Browse Source

use new loader to load css

experimental
Paweł Jedwabny 4 years ago
parent
commit
e215ec5633
2 changed files with 36 additions and 10 deletions
  1. +1
    -10
      src/epesi.js
  2. +35
    -0
      src/loader.js

+ 1
- 10
src/epesi.js View File

@@ -225,17 +225,8 @@ const Epesi = {
console.warn('DEPRECATED: load is invoked implicitly');
Epesi.loader.load();
},
//csses
loaded_csses:new Array(),
load_css:function(file) {
if (Epesi.loaded_csses.indexOf(file)!=-1) return false;
let fileref = document.createElement("link")
fileref.setAttribute("rel", "stylesheet");
fileref.setAttribute("type", "text/css");
fileref.setAttribute("href", file);
document.getElementsByTagName("head").item(0).appendChild(fileref);
Epesi.loaded_csses.push(file);
return true;
Epesi.loader.load_css(file);
}
};


+ 35
- 0
src/loader.js View File

@@ -5,6 +5,8 @@ class Loader {
loaded_js = [];
to_load_js = [];
to_execute_js = [];
to_load_css = [];
loaded_css = [];

static loadScript = file => {
return new Promise(function (resolve, reject) {
@@ -26,6 +28,27 @@ class Loader {
});
};

static loadCss = file => {
return new Promise(function (resolve, reject) {
let link = document.createElement('link');
link.type = 'text/css';
link.rel = 'stylesheet';
link.onerror = reject;
link.href = file;
link.onload = link.onreadystatechange = function (_, isAbort) {
if (isAbort || !link.readyState || /loaded|complete/.test(link.readyState)) {
link.onload = link.onreadystatechange = null;
link = undefined;

if (!isAbort) {
resolve();
}
}
};
document.getElementsByTagName('head').item(0).appendChild(link);
});
};

static insertScript = code => {
return new Promise(function (resolve, reject) {
let script = document.createElement('script');
@@ -42,6 +65,12 @@ class Loader {
await this.load();
};

load_css = async file => {
if (this.loaded_css.includes(file) || this.to_load_css.includes(file)) return;
this.to_load_css.push(file);
await this.load();
};

execute_js = async code => {
this.to_execute_js.push(code);
await this.load();
@@ -63,6 +92,12 @@ class Loader {
Loader.insertScript(code);
}

let css;
while (css = this.to_load_css.shift()) {
Loader.loadCss(css);
this.loaded_css.push(css);
}

this.loading = false;
}
}


Loading…
Cancel
Save