Last active
August 29, 2015 14:23
-
-
Save mathdoodle/a3315c968fd8fb928a86 to your computer and use it in GitHub Desktop.
preload
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
| { | |
| "uuid": "86cb3d7f-7e3c-4cad-aefd-cbd19cd534a5", | |
| "description": "preload", | |
| "dependencies": { | |
| "underscore": "1.8.3", | |
| "davinci-threejs": "0.71.4", | |
| "microAjax": "latest", | |
| "DomReady": "latest", | |
| "async": "1.2.1" | |
| }, | |
| "operatorOverloading": false | |
| } |
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
| <!doctype html> | |
| <html> | |
| <head> | |
| <style> | |
| /* STYLE-MARKER */ | |
| </style> | |
| <!-- SCRIPTS-MARKER --> | |
| </head> | |
| <body> | |
| <script> | |
| // CODE-MARKER | |
| </script> | |
| </body> | |
| </html> |
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
| /** | |
| * Quick'n'dirty loader for additional .html content, THREE textures, audio | |
| * @param files: string[] | |
| * @param callback: (assets?: {[name:string]: any}) => void): void | |
| */ | |
| class preload { | |
| constructor(urls: string[], callback: (errors?: {[name:string]: any}, assets?: {[name:string]: any}) => void) { | |
| // Completion counter | |
| var remaining = urls.length; | |
| var errors: {[name:string]: any} = {}; | |
| var assets: {[name:string]: any} = {}; | |
| var ping = function (error: any, data: {[name:string]: any}) { | |
| if (!error) { | |
| _.extend(assets, data || {}); | |
| } | |
| else { | |
| _.extend(errors, error || {}); | |
| } | |
| // Call callback if done. | |
| if (--remaining == 0) { | |
| callback(errors, assets); | |
| }; | |
| } | |
| /** | |
| * regexps: {[extension:string]:RegExp} | |
| * This will be used for detecting the type of the file based on its extension. | |
| */ | |
| var regexps: {[extension:string]:RegExp} = {}; | |
| /** | |
| * Maps the extension to the (static) functions on ThreeBox.preload. | |
| */ | |
| var exts: {[extension:string]: (url:string, name: string, callback)=> void} = { | |
| 'html': preload.html, | |
| 'jpg': preload.image, | |
| 'png': preload.image, | |
| 'gif': preload.image, | |
| 'mp3': preload.audio, | |
| }; | |
| _.each(exts, function (handler, ext) { | |
| regexps[ext] = new RegExp('\\.' + ext + "\u0024"); // Not sure why $ screws things up when run in mathdoodle. | |
| }); | |
| // Load individual file | |
| // Underscore.js reminder: When used on an array, arguments are (element, index, list) | |
| _.each(urls, function (url) { | |
| // Use appropriate handler based on extension | |
| // Underscore.js reminder. When used on an object, arguments are (value, key, list) | |
| _.each(exts, function (handler: (url: string, name: string, callback) => void, ext) { | |
| if (url.match(regexps[ext])) { | |
| var path = url.split(/\//g); | |
| var name = path.pop().replace(/\.[A-Za-z0-9]+$/, ''); | |
| handler(url, name, ping); | |
| } | |
| }); | |
| }); | |
| } | |
| static html(url: string, name: string, callback: (err: any, data: {[name:string]: any}) =>void) { | |
| new microAjax(url, function (res: string) { | |
| var match: RegExpMatchArray; | |
| // Insert javascript directly | |
| while (match = res.match(/^(<script\s*>|<script[^>]*type=['"]text\/javascript['"][^>]*>)([\s\S]+?)<\/script>$/m)) { | |
| try { | |
| /* | |
| var script = document.createElement('script'); | |
| script.type = 'text/javascript'; | |
| script.innerHTML = match[2]; | |
| document.body.appendChild(script); | |
| */ | |
| eval('(function () {' + match[2] + '})()'); | |
| } | |
| catch (e) { | |
| console.error(e); | |
| console.error('While evaluating: ' + match[2]); | |
| } | |
| res = res.replace(match[0], ''); | |
| } | |
| // Insert HTML via div | |
| // Not sure why we need to replace whitespace. | |
| if (res.replace(/\s*/g, '') !== '') { | |
| var div = document.createElement('div'); | |
| div.innerHTML = res; | |
| document.body.appendChild(div); | |
| } | |
| callback(undefined, {}); | |
| }); | |
| } | |
| static image(url: string, name: string, callback: (err: any, data: {[name:string]: THREE.Texture}) =>void) { | |
| THREE.ImageUtils.loadTexture( | |
| url, | |
| null, | |
| function (texture: THREE.Texture) { | |
| var data: {[name:string]: THREE.Texture} = {}; | |
| data[name] = texture; | |
| callback(undefined, data); | |
| }, | |
| function(message: string) { | |
| callback(new Error(url + " not found."), undefined); | |
| } | |
| ); | |
| } | |
| static audio(url: string, name: string, callback: (err: any, data: {[name:string]: any}) => void): void { | |
| // Load binary file via AJAX | |
| var request = new XMLHttpRequest(); | |
| request.open("GET", url, true); | |
| request.responseType = "arraybuffer"; | |
| request.onload = function (event: Event) { | |
| var data: {[name:string]: any} = {}; | |
| data[name] = request.response; | |
| callback(undefined, data); | |
| }; | |
| request.onerror = function(event: ErrorEvent) { | |
| callback(event, undefined); | |
| } | |
| request.send(); | |
| } | |
| } | |
| DomReady.ready(function() { | |
| async.parallel([ | |
| function(callback){ | |
| preload.image('../img/achilles.png', 'achilles', callback); | |
| }, | |
| function(callback){ | |
| preload.image('../img/tortoise.png', 'tortoise', callback); | |
| } | |
| ], | |
| function(err, results: {[name:string]: any}[]) { | |
| if (!err) { | |
| // We probably want to flatten the array into a map. | |
| console.log("All assets were successfully loaded."); | |
| main(results); | |
| } | |
| else { | |
| console.log("Something is rotten in the state of Denmark: " + err); | |
| } | |
| }); | |
| }); | |
| function main(assets) { | |
| console.log("The main function has been called!"); | |
| } |
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
| // |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment