Introduce script loader

Christoph Burgmer · Christoph Burgmer · commit 0c399541bf06 · 2014-03-06T20:06:14.000+01:00
diff --git a/Gruntfile.js b/Gruntfile.js
@@ -7,15 +7,8 @@ module.exports = function (grunt) {
         },
         jasmine: {
             src: [
-                'node_modules/rasterizehtml/dist/rasterizeHTML.allinone.js',
-                'node_modules/imagediff/imagediff.js',
                 'node_modules/jssha/src/sha.js',
-                'src/utils.js',
-                'src/phantomjsrenderer.js',
-                'src/browserrenderer.js',
-                'src/domstorage.js',
-                'src/<%= pkg.name %>.js',
-                'src/basichtmlreporter.js',
+                'csscritic.js',
                 'src/terminalreporter.js',
                 'src/signoffreporter.js'
             ],
diff --git a/RegressionRunner.html b/RegressionRunner.html
@@ -4,11 +4,9 @@
     <title>Regression Runner</title>
     <meta charset="utf-8"/>
 
-    <link rel="stylesheet" type="text/css" href="dist/csscritic.min.css">
+    <script src="csscritic.js"></script>
 
-    <script type="text/javascript" src="dist/csscritic.allinone.js"></script>
-
-    <script type="text/javascript">
+    <script>
         window.onload = function() {
             csscritic.addReporter(csscritic.BasicHTMLReporter());
             csscritic.add('test/ui/failingTest.html');
@@ -25,9 +23,7 @@
             csscritic.execute();
         };
     </script>
-
 </head>
-
 <body>
 </body>
 </html>
diff --git a/csscritic.js b/csscritic.js
@@ -0,0 +1,46 @@
+/*
+ * CSS Critic loader
+ *
+ * Just include
+ *    <script src="csscritic.js"></script>
+ * and you are good to go.
+ */
+(function () {
+    var thisFileName = 'csscritic.js',
+        cssDependencies = [
+            'src/basichtmlreporter.css'
+        ],
+        jsDependencies = [
+            'node_modules/rasterizehtml/dist/rasterizeHTML.allinone.js',
+            'node_modules/imagediff/imagediff.js',
+            'src/utils.js',
+            'src/basichtmlreporter.js',
+            'src/browserrenderer.js',
+            'src/domstorage.js',
+            'src/csscritic.js'
+        ];
+
+    var getBasePath = function () {
+        var script = document.querySelector('script[src*="' + thisFileName + '"]'),
+            src = script.attributes.src.value;
+
+        return src.substring(0, src.indexOf(thisFileName));
+    };
+
+    var loadCssDependency = function (path) {
+        document.write('<link rel="stylesheet" href="' + path + '">');
+    };
+
+    var loadJsDependency = function (path) {
+        document.write('<script src="' + path + '"></script>');
+    };
+
+    var basePath = getBasePath();
+
+    cssDependencies.forEach(function (path) {
+        loadCssDependency(basePath + path);
+    });
+    jsDependencies.forEach(function (path) {
+        loadJsDependency(basePath + path);
+    });
+}());
diff --git a/example/RegressionRunner.html b/example/RegressionRunner.html
@@ -4,20 +4,16 @@
     <title>Regression Runner</title>
     <meta charset="utf-8"/>
 
-    <link rel="stylesheet" type="text/css" href="../dist/csscritic.min.css">
+    <script src="../csscritic.js"></script>
 
-    <script type="text/javascript" src="../dist/csscritic.allinone.js"></script>
-
-    <script type="text/javascript">
+    <script>
         window.onload = function() {
             csscritic.addReporter(csscritic.BasicHTMLReporter());
             csscritic.add('pageUnderTest.html');
             csscritic.execute();
         };
     </script>
-
 </head>
-
 <body>
 <button onclick="localStorage.clear(); window.location.reload();">Reset all tests</button>
 </body>
diff --git a/test/SpecRunner.html b/test/SpecRunner.html
@@ -14,14 +14,8 @@
     <script src="helpers.js"></script>
 
     <!-- include source files here... -->
-    <script src="../node_modules/rasterizehtml/dist/rasterizeHTML.allinone.js"></script>
-    <script src="../node_modules/imagediff/imagediff.js"></script>
     <script src="../node_modules/jssha/src/sha.js"></script>
-    <script src="../src/utils.js"></script>
-    <script src="../src/browserrenderer.js"></script>
-    <script src="../src/domstorage.js"></script>
-    <script src="../src/csscritic.js"></script>
-    <script src="../src/basichtmlreporter.js"></script>
+    <script src="../csscritic.js"></script>
     <script src="../src/terminalreporter.js"></script>
     <script src="../src/signoffreporter.js"></script>
 
