Last active
August 29, 2015 14:12
-
-
Save cybercussion/86d846e96760254a3342 to your computer and use it in GitHub Desktop.
Sample RequireJS setup with some light failover for CSS.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/*global requirejs, define, require, CI, $, jQuery */ | |
/*jslint devel: true, browser: true */ | |
/** | |
* Require Config | |
* This is all the core scripts needed to be available at runtime. | |
* Includes CDN and local file fail over. | |
* Shim will control the availability of dependent libraries/scripts. | |
* domReady included to insure it all kicks off right. | |
* @usage <script data-main="js/config" src="js/vendor/requirejs/require.min.js"></script> | |
*/ | |
requirejs.config({ | |
urlArgs: "ts=" + new Date().getTime(), // disable caching - remove in production | |
paths: { | |
// Rack up CDN and local fail over files - '.js' not needed. | |
domReady: [ | |
"//cdnjs.cloudflare.com/ajax/libs/require-domReady/2.0.1/domReady.min", | |
"vendor/requirejs/plugins/domReady.min" | |
], | |
modernizr: [ | |
"//cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.3/modernizr.min", | |
"vendor/modernizr.min" | |
], | |
prefixfree: [ | |
"//cdnjs.cloudflare.com/ajax/libs/prefixfree/1.0.7/prefixfree.min", | |
"vendor/prefixfree.min" | |
], | |
jquery: [ | |
"//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min", | |
"vendor/jquery/2.1.1/jquery.min" | |
], | |
bootstrap: [ | |
"//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.1/js/bootstrap.min", | |
"vendor/twitter-bootstrap/3.3.1/bootstrap.min" | |
], | |
// GSAP | |
tweenmax: [ | |
"//cdnjs.cloudflare.com/ajax/libs/gsap/1.15.0/TweenMax.min", | |
"vendor/gsap/1.15.0/TweenMax.min" | |
], | |
kineticplugin: [ | |
"//cdnjs.cloudflare.com/ajax/libs/gsap/1.15.0/plugins/KineticPlugin.min", | |
"vendor/gsap/1.15.0/plugins/KineticPlugin.min" | |
], | |
throwpropsplugin: [ // licensed plugin | |
"vendor/gsap/1.15.0/plugins/ThrowPropsPlugin.min" | |
], | |
draggable: [ | |
"//cdnjs.cloudflare.com/ajax/libs/gsap/1.15.0/utils/Draggable.min", | |
"vendor/gsap/1.15.0/utils/Draggable.min" | |
], | |
jquerygsap: [ | |
"//cdnjs.cloudflare.com/ajax/libs/gsap/1.15.0/jquery.gsap.min", | |
"vendor/gsap/1.15.0/jquery.gsap.min" | |
], | |
// Local | |
trace: [ | |
"vendor/jquery/plugins/trace" | |
], | |
site: [ | |
"site/Site" | |
], | |
email: [ | |
"site/email/Email" | |
] | |
// End | |
}, | |
shim: { | |
// defined dependencies on scripts | |
'domReady' : ['site'], | |
'bootstrap' : ['jquery'], | |
'trace' : ['jquery'], | |
'tweenmax' : ['jquery'], | |
'kineticplugin' : ['tweenmax'], | |
'throwpropsplugin' : ['tweenmax'], | |
'draggable' : ['tweenmax'], | |
'jquerygsap' : ['tweenmax'], | |
'site' : ['bootstrap'], | |
'email' : ['site'] | |
} | |
}); | |
/* | |
* Tip: | |
* 'define' appears to be a module/JS you depend on | |
* 'require' just loads most likely async and you can't rely on domReady then. | |
* Other examples online show domReady, and $ being passed in as arguments. I was unsuccessful getting that to work | |
* but '$' appears to be accessible when 'define' used. | |
*/ | |
define([ | |
'domReady', | |
'modernizr', | |
'prefixfree', | |
'jquery', | |
'bootstrap', | |
'trace', | |
'tweenmax', | |
'kineticplugin', | |
'throwpropsplugin', | |
'draggable', | |
'jquerygsap', | |
'site', | |
'email'], function (domReady) { | |
"use strict"; | |
// Ready, Set, Go... | |
domReady(function () { | |
// Verify CSS - not a huge fan of this. | |
var ss = document.styleSheets, | |
len = ss.length, | |
i = 0, | |
sheet, | |
rules, | |
isError; | |
while (i < len) { | |
sheet = ss[i]; | |
rules = sheet.rules ? sheet.rules : sheet.cssRules; | |
isError = rules.length === 0; | |
if (sheet.href !== null) { | |
// Bootstrap | |
if (sheet.href.toString().indexOf('twitter-bootstrap') > 0 && isError) { | |
$('<link rel="stylesheet" type="text/css" href="css/bootstrap/3.3.1/css/bootstrap.min.css" />').appendTo('head'); | |
} | |
// Font Awesome | |
if (sheet.href.toString().indexOf('font-awesome') > 0 && isError) { | |
$('<link rel="stylesheet" type="text/css" href="css/font-awesome/4.2.0/css/font-awesome.min.css" />').appendTo('head'); | |
} | |
} | |
i += 1; | |
} | |
// Fire up App | |
CI.init(); | |
}); | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment