Add public API for loading js files asynchronously
Signed-off-by: Julius Härtl <jus@bitgrid.net>
This commit is contained in:
parent
ac6ee0b8b7
commit
a36604d2ec
|
@ -39,7 +39,7 @@ function escapeHTML(s) {
|
||||||
}
|
}
|
||||||
|
|
||||||
/** @namespace OCP */
|
/** @namespace OCP */
|
||||||
var OCP = {},
|
var OCP = Object.assign({}, window.OCP),
|
||||||
/**
|
/**
|
||||||
* @namespace OC
|
* @namespace OC
|
||||||
*/
|
*/
|
||||||
|
@ -367,6 +367,7 @@ var OCP = {},
|
||||||
* @param {string} app the app id to which the script belongs
|
* @param {string} app the app id to which the script belongs
|
||||||
* @param {string} script the filename of the script
|
* @param {string} script the filename of the script
|
||||||
* @param ready event handler to be called when the script is loaded
|
* @param ready event handler to be called when the script is loaded
|
||||||
|
* @deprecated 16.0.0 Use OCP.Loader.loadScript
|
||||||
*/
|
*/
|
||||||
addScript:function(app,script,ready){
|
addScript:function(app,script,ready){
|
||||||
var deferred, path=OC.filePath(app,'js',script+'.js');
|
var deferred, path=OC.filePath(app,'js',script+'.js');
|
||||||
|
@ -387,6 +388,7 @@ var OCP = {},
|
||||||
* Loads a CSS file
|
* Loads a CSS file
|
||||||
* @param {string} app the app id to which the css style belongs
|
* @param {string} app the app id to which the css style belongs
|
||||||
* @param {string} style the filename of the css file
|
* @param {string} style the filename of the css file
|
||||||
|
* @deprecated 16.0.0 Use OCP.Loader.loadStylesheet
|
||||||
*/
|
*/
|
||||||
addStyle:function(app,style){
|
addStyle:function(app,style){
|
||||||
var path=OC.filePath(app,'css',style+'.css');
|
var path=OC.filePath(app,'css',style+'.css');
|
||||||
|
|
|
@ -0,0 +1,11 @@
|
||||||
|
/**
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
import loader from './loader'
|
||||||
|
|
||||||
|
/** @namespace OCP */
|
||||||
|
const OCP = {
|
||||||
|
Loader: loader,
|
||||||
|
};
|
||||||
|
|
||||||
|
window['OCP'] = Object.assign({}, window.OCP, OCP)
|
|
@ -0,0 +1,80 @@
|
||||||
|
/*
|
||||||
|
* @copyright Copyright (c) 2018 Julius Härtl <jus@bitgrid.net>
|
||||||
|
*
|
||||||
|
* @author Julius Härtl <jus@bitgrid.net>
|
||||||
|
*
|
||||||
|
* @license GNU AGPL version 3 or any later version
|
||||||
|
*
|
||||||
|
* This program is free software: you can redistribute it and/or modify
|
||||||
|
* it under the terms of the GNU Affero General Public License as
|
||||||
|
* published by the Free Software Foundation, either version 3 of the
|
||||||
|
* License, or (at your option) any later version.
|
||||||
|
*
|
||||||
|
* This program is distributed in the hope that it will be useful,
|
||||||
|
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||||
|
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||||
|
* GNU Affero General Public License for more details.
|
||||||
|
*
|
||||||
|
* You should have received a copy of the GNU Affero General Public License
|
||||||
|
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
|
||||||
|
let loadedScripts = {};
|
||||||
|
let loadedStylesheets = {};
|
||||||
|
/**
|
||||||
|
* @namespace OCP
|
||||||
|
* @class Loader
|
||||||
|
*/
|
||||||
|
export default {
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Load a script asynchronously
|
||||||
|
*
|
||||||
|
* @param {string} app
|
||||||
|
* @param {string} file
|
||||||
|
* @returns {Promise}
|
||||||
|
*/
|
||||||
|
loadScript: function(app, file) {
|
||||||
|
const key = app + file;
|
||||||
|
if (loadedScripts.hasOwnProperty(key)) {
|
||||||
|
return Promise.resolve();
|
||||||
|
}
|
||||||
|
loadedScripts[key] = true;
|
||||||
|
return new Promise(function (resolve, reject) {
|
||||||
|
var scriptPath = OC.filePath(app, 'js', file);
|
||||||
|
var script = document.createElement('script');
|
||||||
|
script.src = scriptPath;
|
||||||
|
script.setAttribute('nonce', btoa(OC.requestToken));
|
||||||
|
script.onload = () => resolve();
|
||||||
|
script.onerror = () => reject(`Failed to load script from ${scriptPath}`);
|
||||||
|
document.head.appendChild(script);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Load a stylesheet file asynchronously
|
||||||
|
*
|
||||||
|
* @param {string} app
|
||||||
|
* @param {string} file
|
||||||
|
* @returns {Promise}
|
||||||
|
*/
|
||||||
|
loadStylesheet: function(app, file) {
|
||||||
|
const key = app + file;
|
||||||
|
if (loadedStylesheets.hasOwnProperty(key)) {
|
||||||
|
return Promise.resolve();
|
||||||
|
}
|
||||||
|
loadedStylesheets[key] = true;
|
||||||
|
return new Promise(function (resolve, reject) {
|
||||||
|
var stylePath = OC.filePath(app, 'css', file);
|
||||||
|
var link = document.createElement('link');
|
||||||
|
link.href = stylePath;
|
||||||
|
link.type = 'text/css';
|
||||||
|
link.rel = 'stylesheet';
|
||||||
|
link.onload = () => resolve();
|
||||||
|
link.onerror = () => reject(`Failed to load stylesheet from ${stylePath}`);
|
||||||
|
document.head.appendChild(link);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
}
|
|
@ -22,3 +22,5 @@
|
||||||
import '@babel/polyfill'
|
import '@babel/polyfill'
|
||||||
|
|
||||||
import './globals'
|
import './globals'
|
||||||
|
|
||||||
|
import './OCP/index'
|
||||||
|
|
Loading…
Reference in New Issue