move script loader to utils
This commit is contained in:
parent
f968927bff
commit
20b8def298
48
js/reveal.js
48
js/reveal.js
|
@ -7,6 +7,7 @@ import {
|
||||||
deserialize,
|
deserialize,
|
||||||
transformElement,
|
transformElement,
|
||||||
injectStyleSheet,
|
injectStyleSheet,
|
||||||
|
loadScript,
|
||||||
closestParent,
|
closestParent,
|
||||||
colorToRgb,
|
colorToRgb,
|
||||||
colorBrightness,
|
colorBrightness,
|
||||||
|
@ -303,53 +304,6 @@ export default function( revealElement, options ) {
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
|
||||||
* Loads a JavaScript file from the given URL and executes it.
|
|
||||||
*
|
|
||||||
* @param {string} url Address of the .js file to load
|
|
||||||
* @param {function} callback Method to invoke when the script
|
|
||||||
* has loaded and executed
|
|
||||||
*/
|
|
||||||
function loadScript( url, callback ) {
|
|
||||||
|
|
||||||
const script = document.createElement( 'script' );
|
|
||||||
script.type = 'text/javascript';
|
|
||||||
script.async = false;
|
|
||||||
script.defer = false;
|
|
||||||
script.src = url;
|
|
||||||
|
|
||||||
if( callback ) {
|
|
||||||
|
|
||||||
// Success callback
|
|
||||||
script.onload = script.onreadystatechange = event => {
|
|
||||||
if( event.type === 'load' || /loaded|complete/.test( script.readyState ) ) {
|
|
||||||
|
|
||||||
// Kill event listeners
|
|
||||||
script.onload = script.onreadystatechange = script.onerror = null;
|
|
||||||
|
|
||||||
callback();
|
|
||||||
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
// Error callback
|
|
||||||
script.onerror = err => {
|
|
||||||
|
|
||||||
// Kill event listeners
|
|
||||||
script.onload = script.onreadystatechange = script.onerror = null;
|
|
||||||
|
|
||||||
callback( new Error( 'Failed loading script: ' + script.src + '\n' + err ) );
|
|
||||||
|
|
||||||
};
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
// Append the script at the end of <head>
|
|
||||||
const head = document.querySelector( 'head' );
|
|
||||||
head.insertBefore( script, head.lastChild );
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Starts up reveal.js by binding input events and navigating
|
* Starts up reveal.js by binding input events and navigating
|
||||||
* to the current URL deeplink if there is one.
|
* to the current URL deeplink if there is one.
|
||||||
|
|
|
@ -76,25 +76,6 @@ export const transformElement = ( element, transform ) => {
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
|
||||||
* Injects the given CSS styles into the DOM.
|
|
||||||
*
|
|
||||||
* @param {string} value
|
|
||||||
*/
|
|
||||||
export const injectStyleSheet = ( value ) => {
|
|
||||||
|
|
||||||
let tag = document.createElement( 'style' );
|
|
||||||
tag.type = 'text/css';
|
|
||||||
if( tag.styleSheet ) {
|
|
||||||
tag.styleSheet.cssText = value;
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
tag.appendChild( document.createTextNode( value ) );
|
|
||||||
}
|
|
||||||
document.getElementsByTagName( 'head' )[0].appendChild( tag );
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Find the closest parent that matches the given
|
* Find the closest parent that matches the given
|
||||||
* selector.
|
* selector.
|
||||||
|
@ -230,4 +211,70 @@ export const enterFullscreen = () => {
|
||||||
requestMethod.apply( element );
|
requestMethod.apply( element );
|
||||||
}
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Injects the given CSS styles into the DOM.
|
||||||
|
*
|
||||||
|
* @param {string} value
|
||||||
|
*/
|
||||||
|
export const injectStyleSheet = ( value ) => {
|
||||||
|
|
||||||
|
let tag = document.createElement( 'style' );
|
||||||
|
tag.type = 'text/css';
|
||||||
|
if( tag.styleSheet ) {
|
||||||
|
tag.styleSheet.cssText = value;
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
tag.appendChild( document.createTextNode( value ) );
|
||||||
|
}
|
||||||
|
document.getElementsByTagName( 'head' )[0].appendChild( tag );
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Loads a JavaScript file from the given URL and executes it.
|
||||||
|
*
|
||||||
|
* @param {string} url Address of the .js file to load
|
||||||
|
* @param {function} callback Method to invoke when the script
|
||||||
|
* has loaded and executed
|
||||||
|
*/
|
||||||
|
export const loadScript = ( url, callback ) => {
|
||||||
|
|
||||||
|
const script = document.createElement( 'script' );
|
||||||
|
script.type = 'text/javascript';
|
||||||
|
script.async = false;
|
||||||
|
script.defer = false;
|
||||||
|
script.src = url;
|
||||||
|
|
||||||
|
if( typeof callback === 'function' ) {
|
||||||
|
|
||||||
|
// Success callback
|
||||||
|
script.onload = script.onreadystatechange = event => {
|
||||||
|
if( event.type === 'load' || /loaded|complete/.test( script.readyState ) ) {
|
||||||
|
|
||||||
|
// Kill event listeners
|
||||||
|
script.onload = script.onreadystatechange = script.onerror = null;
|
||||||
|
|
||||||
|
callback();
|
||||||
|
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// Error callback
|
||||||
|
script.onerror = err => {
|
||||||
|
|
||||||
|
// Kill event listeners
|
||||||
|
script.onload = script.onreadystatechange = script.onerror = null;
|
||||||
|
|
||||||
|
callback( new Error( 'Failed loading script: ' + script.src + '\n' + err ) );
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
// Append the script at the end of <head>
|
||||||
|
const head = document.querySelector( 'head' );
|
||||||
|
head.insertBefore( script, head.lastChild );
|
||||||
|
|
||||||
}
|
}
|
Loading…
Reference in New Issue