move src files to a new src folder. update paths respectively. update preload demo page

Author: scottjehl

README.md

@@ -6,7 +6,7 @@ Licensed MIT
 
 ## Usage
 
-Place the [`loadCSS` function](https://github.com/filamentgroup/loadCSS/blob/master/loadCSS.js) inline in the `head` of your page (it can also be included in an external JavaScript file if preferable).
+Place the [`loadCSS` function](https://github.com/filamentgroup/loadCSS/blob/master/src/loadCSS.js) inline in the `head` of your page (it can also be included in an external JavaScript file if preferable).
 
 Then call it by passing it a stylesheet URL:
 
@@ -46,7 +46,7 @@ By default, loadCSS will inject the new CSS stylesheet *after* the last styleshe
 
 #### Using with `onload`
 
-Onload listener support with `link` elements is spotty, so if you need to add an onload callback, include [`onloadCSS` function](https://github.com/filamentgroup/loadCSS/blob/master/onloadCSS.js) on your page and use the `onloadCSS` function:
+Onload listener support with `link` elements is spotty, so if you need to add an onload callback, include [`onloadCSS` function](https://github.com/filamentgroup/loadCSS/blob/master/src/onloadCSS.js) on your page and use the `onloadCSS` function:
 
 ``` javascript
 function onloadCSS( ss, callback ){ ... }
@@ -147,7 +147,7 @@ LoadCSS attempts to load a css file asynchronously, while maintaining the CSS ca
         <th>Yes</th>
         <th>No</th>
     </tr>
-    
+
 </table>
 
 
@@ -161,5 +161,3 @@ The reason this script is sometimes necessary is because there is no cross-brows
 #### Contributions and bug fixes
 
 Both are very much appreciated - especially bug fixes. As for contributions, the goals of this project are to keep things very simple and utilitarian, so if we don't accept a feature addition, it's not necessarily because it's a bad idea. It just may not meet the goals of the project. Thanks!
-
-

bower.json

@@ -1,7 +1,7 @@
 {
 	"name": "loadcss",
 	"main": [
-		"loadCSS.js"
+		"src/loadCSS.js"
 	],
 	"ignore": [
 		"**/.*"

package.json

@@ -2,7 +2,7 @@
   "name": "fg-loadcss",
   "version": "0.2.4",
   "description": "A function for loading CSS asynchronously",
-  "main": "loadCSS.js",
+  "main": "src/loadCSS.js",
   "repository": {
     "type": "git",
     "url": "https://github.com/filamentgroup/loadCSS.git"

loadCSS.js src/loadCSS.js

@@ -4,99 +4,38 @@
 		<title>Test for link[rel=preload]</title>
 		<meta charset="utf-8">
 
-
-
-		<link rel="preload" href="http://scottjehl.com/css-temp/slow.php" as="stylesheet" id="asyncCSS" onload="this.rel='stylesheet'">
-
+		<link rel="preload" href="http://scottjehl.com/css-temp/slow.php" as="style" onload="this.rel='stylesheet'">
 		<script>
 
-			// link rel=preload support test via https://lists.w3.org/Archives/Public/public-whatwg-archive/2015Apr/0013.html
-			function preloadSupported() {
-				var link = document.createElement('link');
-				link.rel = 'PRELOAD';
-				return link.rel == 'preload';
+		/* CSS rel=preload polyfill */
+		(function( w ){
+			// rel=preload support test
+			function support(){
+			  try {
+					return w.document.createElement("link").relList.supports( "preload" );
+			  } catch (e) {}
 			}
-
-			/*!
-			loadCSS: load a CSS file asynchronously.
-			[c]2015 @scottjehl, Filament Group, Inc.
-			Licensed MIT
-			*/
-			(function(w){
-				"use strict";
-				/* exported loadCSS */
-				var loadCSS = function( href, before, media ){
-					// Arguments explained:
-					// `href` [REQUIRED] is the URL for your CSS file.
-					// `before` [OPTIONAL] is the element the script should use as a reference for injecting our stylesheet <link> before
-						// By default, loadCSS attempts to inject the link after the last stylesheet or script in the DOM. However, you might desire a more specific location in your document.
-					// `media` [OPTIONAL] is the media type or query of the stylesheet. By default it will be 'all'
-					var doc = w.document;
-					var ss = doc.createElement( "link" );
-					var newMedia = media || "all";
-					var ref;
-					if( before ){
-						ref = before;
-					}
-					else {
-						var refs = ( doc.body || doc.getElementsByTagName( "head" )[ 0 ] ).childNodes;
-						ref = refs[ refs.length - 1];
-					}
-
-					var sheets = doc.styleSheets;
-					ss.rel = "stylesheet";
-					ss.href = href;
-					// temporarily set media to something inapplicable to ensure it'll fetch without blocking render
-					ss.media = "only x";
-
-
-					// Inject link
-						// Note: the ternary preserves the existing behavior of "before" argument, but we could choose to change the argument to "after" in a later release and standardize on ref.nextSibling for all refs
-						// Note: `insertBefore` is used instead of `appendChild`, for safety re: http://www.paulirish.com/2011/surefire-dom-element-insertion/
-					ref.parentNode.insertBefore( ss, ( before ? ref : ref.nextSibling ) );
-					// A method (exposed on return object for external use) that mimics onload by polling until document.styleSheets until it includes the new sheet.
-					var onloadcssdefined = function( cb ){
-						var resolvedHref = ss.href;
-						var i = sheets.length;
-						while( i-- ){
-							if( sheets[ i ].href === resolvedHref ){
-								return setTimeout(cb);
-							}
-						}
-						setTimeout(function() {
-							onloadcssdefined( cb );
-						});
-					};
-
-					// once loaded, set link's media back to `all` so that the stylesheet applies once it loads
-					if( ss.addEventListener ){
-						ss.addEventListener( "load", function(){
-							this.media = newMedia;
-						});
+			// loop preload links and fetch using loadCSS
+			function poly(){
+				var links = w.document.getElementsByTagName( "link" );
+				for( var i = 0; i < links.length; i++ ){
+					if( links[ i ].getAttribute( "rel" ) === "preload" ){
+						w.loadCSS( links[ i ].href, links[ i ] );
+						links[ i ].rel = null;
 					}
-					ss.onloadcssdefined = onloadcssdefined;
-					onloadcssdefined(function() {
-						if( ss.media !== newMedia ){
-								ss.media = newMedia;
-						}
-					});
-					return ss;
-				};
-				// commonjs
-				if( typeof module !== "undefined" ){
-					module.exports = loadCSS;
 				}
-				else {
-					w.loadCSS = loadCSS;
-				}
-			}( typeof global !== "undefined" ? global : this ));
-
-
-
+			}
 			// if link[rel=preload] is not supported, we must fetch the CSS manually using loadCSS
-			if( !preloadSupported() ){
-				loadCSS( asyncCSS.href );
+			if( !support() ){
+				poly();
+				var run = w.setInterval( poly, 300 );
+				if( w.addEventListener ){
+					w.addEventListener( "load", function(){
+						w.clearInterval( run );
+					} )
+				}
 			}
+		}( this ));
 
 		</script>
 	</head>

onloadCSS.js src/onloadCSS.js

@@ -8,8 +8,8 @@
 	<link rel="stylesheet" href="./libs/qunit/qunit.css" media="screen">
 	<script src="./libs/qunit/qunit.js"></script>
 	<!-- Load local lib and tests. -->
-	<script src="../../loadCSS.js" id="loadCSS"></script>
-	<script src="../../onloadCSS.js"></script>
+	<script src="../../src/loadCSS.js" id="loadCSS"></script>
+	<script src="../../src/onloadCSS.js"></script>
 	<script src="./tests.js"></script>
 </head>
 <body>