Simple proof of concept. FF Only; uses jquery.

SeanMcMillan · Mar 21, 2011 · 6d2d6ee · 6d2d6ee
1 parent 3efcb9d
commit 6d2d6ee
Show file tree

Hide file tree

Showing 4 changed files with 61 additions and 1 deletion.
diff --git a/README b/README
@@ -49,4 +49,4 @@ There are 3 outcomes:
         .loading class is removed / page is ready (user supplied)        
 
 
-Ultimately, I hope that all 3 patrts will be small enough to inline them into the head tag of yuor page
+Ultimately, I hope that all 3 parts will be small enough to inline them into the head tag of yuor page
diff --git a/exploration/cgrade.js b/exploration/cgrade.js
@@ -0,0 +1,37 @@
+(function() {
+
+    function theTest() {
+        return true;
+    }
+
+    function preTest() {
+        return true;
+    }
+
+    function loadJsAsynch() {
+        var script = document.createElement("script");
+        script.type = "text/javascript";
+        script.async = true;
+        script.src = "main.js";
+
+        var target = document.getElementsByTagName("script")[0];
+        target.parentNode.insertBefore(script, target);
+    }
+
+    function insertFoucPreventer() {
+        $(document.documentElement).removeClass("no-js").addClass("js loading");
+
+        var foucPreventer = $("<style/>").text(".loading .hideload {display:none};");
+        var target = document.getElementsByTagName("script")[0];
+        target.parentNode.insertBefore(foucPreventer.get(0), target);
+    }
+
+    function doIt() {
+        if (preTest() && theTest()) {
+            insertFoucPreventer();
+            loadJsAsynch();
+        }
+    }
+
+    doIt();
+})();
diff --git a/exploration/main.js b/exploration/main.js
@@ -0,0 +1,4 @@
+(function() {
+        $("#nojs").text("Content for Passing Browsers");
+        $("html").removeClass("loading");
+})();
diff --git a/exploration/simple.html b/exploration/simple.html
@@ -0,0 +1,19 @@
+<!doctype html>
+<html class="no-js" lang="en">
+<head>
+  <title>C Grade test page</title>
+  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.js"></script>
+  <script src="cgrade.js"></script>
+
+</head>
+
+<body>
+
+
+<h1 id="nojs" class="hideload">Content for Failing Browsers</h1>
+
+<h2>Content for everybody</h2>
+
+</body>
+</html>
+
Original file line number	Diff line number	Diff line change
Expand Up		@@ -49,4 +49,4 @@ There are 3 outcomes:
		.loading class is removed / page is ready (user supplied)


		Ultimately, I hope that all 3 patrts will be small enough to inline them into the head tag of yuor page
		Ultimately, I hope that all 3 parts will be small enough to inline them into the head tag of yuor page