Initial commit

Martins Barinskis · Martins Barinskis · commit 984c676311e2 · 2012-07-08T21:01:42.000+03:00
diff --git a/css.js b/css.js
@@ -0,0 +1,38 @@
+(function(win) {
+	var doc = win.document,
+		docBody = doc.body,
+		createLink = function(src) {
+			var link = doc.createElement('link');
+			link.type = 'text/css';
+			link.rel = 'stylesheet';
+			link.href = src;
+			return link;
+		},
+		resolveClassName = function(moduleName) {
+			var parts = moduleName.split('/');
+			return parts[parts.length - 1].replace('.', '-') + '-loaded';
+		};
+
+	define({
+		load: function(name, req, load) {
+			var link = createLink(name),
+				head = doc.getElementsByTagName('head')[0],
+				test, interval;
+
+			test = doc.createElement('div');
+			test.className = resolveClassName(name);
+			test.style.cssText = 'position: absolute;left:-9999px;top:-9999px;';
+			docBody.appendChild(test);
+
+			head.appendChild(link);
+
+			interval = win.setInterval(function() {
+				if (test.offsetHeight > 0) {
+					clearInterval(interval);
+					docBody.removeChild(test);
+					load(link);
+				}
+			}, 50);
+		}
+	});
+})(window);
diff --git a/css/sample.css b/css/sample.css
@@ -0,0 +1,9 @@
+#test {
+	background-color: #AA0000;
+	color: white;
+	font-weight: bold;
+}
+
+.sample-css-loaded {
+	height: 1px;
+}
diff --git a/demo.html b/demo.html
@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
+		<style>
+			body {
+				font-family: sans-serif;
+			}
+			#test {
+				margin: 1em 0;
+				padding: .5em;
+				border: 1px solid black;
+			}
+		</style>
+	</head>
+	<body>
+		<h1>Loading CSS with Require JS demo</h1>
+		<div><button id="go">Test</button></div>
+		<div id="test">
+			<p>After you click the &quot;Test&quot; button, the background color of this element should change to red.</p>
+		</div>
+
+		<script src="require.js"></script>
+
+		<script>
+			(function(win){
+				var doc = win.document,
+					button = doc.getElementById('go');
+				button.addEventListener('click', function() {
+					require(['css!css/sample.css'], function() {
+						alert('Stylesheet has been loaded');
+					});
+				}, false);
+			})(window);
+		</script>
+	</body>
+</html>
diff --git a/require.js b/require.js
