Skip to content

Instantly share code, notes, and snippets.

@just-boris
Last active August 29, 2015 14:13
Show Gist options
  • Select an option

  • Save just-boris/e4ea536439b8e6ad346c to your computer and use it in GitHub Desktop.

Select an option

Save just-boris/e4ea536439b8e6ad346c to your computer and use it in GitHub Desktop.
Ym-cat
(function() {
var bear = '<img src="http://placebear.com/g/400/200">';
if(typeof modules !== 'undefined') {
modules.define("bear", function(provide) {
provide(bear);
});
} else {
define('bear', bear);
}
})();
(function() {
var cat = '<img src="http://placekitten.com.s3.amazonaws.com/homepage-samples/408/287.jpg">';
if(typeof modules !== 'undefined') {
modules.define("cat", function(provide) {
provide(cat);
});
} else {
define('cat', cat);
}
})();
<html>
<head>
<title>YM-test</title>
<script type="text/javascript" src="https://rawgit.com/ymaps/modules/0.1.0/modules.js"></script>
<script type="text/javascript" src="loader_type_js.js"></script>
<script type="text/javascript" src="jquery.js"></script>
<script>
modules.define('app', ['loader_type_js', 'jquery'], function(provide, loader) {
var moduleName = location.search.indexOf('cat') > -1 ? 'cat' : 'bear';
loader(moduleName+".js", function() {
modules.require(['jquery', moduleName], function($, moduleText) {
$('body').html(moduleText);
provide();
});
});
});
modules.require('app', function(app) {});
</script>
</head>
<body>
Loading...
</body>
</html>
/**
* @module jquery
* @description Provide jQuery (load if it does not exist).
*/
modules.define(
'jquery',
['loader_type_js'],
function(provide, loader) {
/* global jQuery */
function doProvide(preserveGlobal) {
/**
* @exports
* @type Function
*/
provide(preserveGlobal? jQuery : jQuery.noConflict(true));
}
if(typeof jQuery !== 'undefined') {
doProvide(true);
} else {
loader("//yastatic.net/jquery/2.1.3/jquery.min.js", doProvide);
}
});
/**
* @module loader_type_js
* @description Load JS from external URL.
*/
modules.define('loader_type_js', function(provide) {
var loading = {},
loaded = {},
head = document.getElementsByTagName('head')[0],
runCallbacks = function(path, type) {
var cbs = loading[path], cb, i = 0;
delete loading[path];
while(cb = cbs[i++]) {
cb[type] && cb[type]();
}
},
onSuccess = function(path) {
loaded[path] = true;
runCallbacks(path, 'success');
},
onError = function(path) {
runCallbacks(path, 'error');
};
provide(
/**
* @exports
* @param {String} path resource link
* @param {Function} success to be called if the script succeeds
* @param {Function} error to be called if the script fails
*/
function(path, success, error) {
if(loaded[path]) {
success();
return;
}
if(loading[path]) {
loading[path].push({ success : success, error : error });
return;
}
loading[path] = [{ success : success, error : error }];
var script = document.createElement('script');
script.type = 'text/javascript';
script.charset = 'utf-8';
script.src = (location.protocol === 'file:' && !path.indexOf('//')? 'http:' : '') + path;
if('onload' in script) {
script.onload = function() {
script.onload = script.onerror = null;
onSuccess(path);
};
script.onerror = function() {
script.onload = script.onerror = null;
onError(path);
};
} else {
script.onreadystatechange = function() {
var readyState = this.readyState;
if(readyState === 'loaded' || readyState === 'complete') {
script.onreadystatechange = null;
onSuccess(path);
}
};
}
head.insertBefore(script, head.lastChild);
}
);
});
<html>
<head>
<title>Require-test</title>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/require.js/2.1.10/require.min.js" data-main="app"></script>
<script>
var moduleName = location.search.indexOf('cat') > -1 ? 'cat' : 'bear';
requirejs.config({
paths: {
jquery: '//yastatic.net/jquery/2.1.3/jquery.min'
}
});
define('app', ['jquery', moduleName], function($, moduleText) {
$('body').html(moduleText);
});
</script>
</head>
<body>
Loading...
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment