WBCE CMS Forum

rjgamer

Developer

jquery-insert.js überarbeitet

Hallo,

aus purem Interesse, ohne dass es eigentlich einen Bedarf gibt, habe ich die $.insert Funktion überarbeitet.

Meine Lösung ist codetechnisch auf dem neusten Stand und theoretisch flexibel erweiterbar. Die überarbeitete $.insert Funktion, kann wie bisher einzelne CSS und JS Dateien, neu aber auch mehrere Dateien laden. Dazu bietet es sogar die Separierung der Basis-URL. Aber schaut euch am besten das Ganze anhand des Beispiel-Codes selber an:

[== JavaScript ==]
// ******************************************
// BISHERIGE FUNKTION
// *************************************

// Eine Datei laden
$.insert('https://example.com/demo.js');

// ******************************************
// NEUE FUNKTIONEN
// ******************************************

// Mehrere Dateien von der selben Basis-URL laden
var moduleFiles = [
    'path/to/foo.css',
    'path/to/bar.js'
];
$.insert(moduleFiles, 'https://foo.com/bar/');

// Mehrere Dateien mit unterschiedlichen URLs laden
$.insert(['https://foo.com/bar.css', 'http://lorem.de/ipsum.js']);

// Eine Datei von einer Basis-URL laden
$.insert('path/to/foo.js', 'http://foo.com/path/to/bar/');

Bräuchte nun aber einige Tester der $.insert Funktion. Einfach die JS-Datei im Anhang herunterladen und im Ordner include von wBCE ersetzen (Sicherung vorher nicht vergessen!).

Danke für euer Feedback!

Ahja, das include/jquery Verzeichnis könnte man echt mal ausmisten.  Werde dazu irgendwann mal einen neuen Thread öffnen.

Gruss

Beitrag geändert von rjgamer (13.07.2016 14:13:36)

---

Neoflow | Fraggy Backend Theme

stefanek

Developer

Re: jquery-insert.js überarbeitet

Ich schau es mir später an.
Bin für ein paar Stunden außerhaus.

Chris

P.S. das sind so trockene Sachen für die kriegst Du nicht viele Tester mobilisiert ;-)

---

“Success is the progressive realization of a worthy ideal.” ― Earl Nightingale

rjgamer

Developer

Re: jquery-insert.js überarbeitet

Joa leider. Aber hat sauviel Spass gemacht das Ding zu entwickeln.  Heute wieder viel gelernt...

Ahja, GitHub Repo online. Das jQuery Script kann gerne auch in anderen Projekten genutzt werden:
https://github.com/Neoflow/jQuery-InsertLoader

Gruss

---

Neoflow | Fraggy Backend Theme

stefanek

Developer

Re: jquery-insert.js überarbeitet

So, während meine bessere Hälfte sich die Haare macht...

[== Undefiniert ==]
if (typeof url === 'string' && url.length) {

            var extension = url.substring(url.lastIndexOf('.') + 1, url.length),
                    finalUrl = (path || '') + url + '?_=' + new Date().getTime(),
                    $head = $('head');

            switch (extension) {
                case 'js':
                    $head.append($('<script>', {
                        src: finalUrl
                    }));
                    break;
                case 'css':
                    $head.append($('<link>', {
                        href: finalUrl,
                        rel: 'stylesheet',
                        type: 'test/css'
                    }));
                    break;
                default:
                    console.warn('URL is not linking to a CSS or JS file: ' + url);
                    return false;
            }
            return true;
        }

Es wäre gut, wenn wir im switch auch filename.js.php hätten.
Dann könnte man auch durch PHP generierte JS Scripte und json Arrays mit der insert Funktion inserten.

vielleicht reicht es sogar schon, wenn man einfach nur php zulässt:

[== Undefiniert ==]
switch (extension) {
                case 'php':
                case 'js':
                    $head.append($('<script>', {
                        src: finalUrl
                    }));
                    break;
                case 'css':
                    $head.append($('<link>', {
                        href: finalUrl,
                        rel: 'stylesheet',
                        type: 'test/css'
                    }));
                    break;
                default:
                    console.warn('URL is not linking to a CSS or JS file: ' + url);
                    return false;
            }

wobei *.js.php würde mir mehr zusagen, weil es eindeutiger ist.
Darüberhinaus könnte man auch *.css.php mit aufnehmen für PHP generierte CSS Files.

Chris

Beitrag geändert von stefanek (13.07.2016 14:33:35)

---

“Success is the progressive realization of a worthy ideal.” ― Earl Nightingale

rjgamer

Developer

Re: jquery-insert.js überarbeitet

Hmm, bin nicht so der Fan davon, aber warum nicht.

JSON aber nicht, dafür bietet jQuery von Haus aus Funktionen. Der InsertLoader soll explizit einfach JS und CSS nachladen können. Theoretisch gibt es ja auch schon für JS eine Lösung von jQuery.

Am liebsten hätte ich nämlich einfach eine $.getStylesheet Funktion geschrieben um nur CSS nachzuladen und dann für JS auf die $.getScript von jQuery verwiesen. Aber um die Kompatibilität zu gewährleisten, hab ich es gelassen.

PHP als weitere Dateierweiterung für das Laden von Scripts ist drin. Den Code einfach hier für den erneuten Test herunterladen:
https://github.com/Neoflow/jQuery-Inser … -insert.js

Gruss

Beitrag geändert von rjgamer (13.07.2016 15:18:52)

---

Neoflow | Fraggy Backend Theme

rjgamer

Developer

Re: jquery-insert.js überarbeitet

Gibt es hier eigentlich Bestrebungen für WBCE 1.2 meine Insert-Lösung zu nutzen?

Vorteil gegenüber der alten Lösung: Sauber mit jQuery realisiert inkl. einem ordentlichen Exception Handling plus ein paar kleineren neuen Funktionen (siehe erster Post)

Beitrag geändert von rjgamer (21.09.2016 13:22:29)

---

Neoflow | Fraggy Backend Theme

cwsoft

Mitglied

Re: jquery-insert.js überarbeitet

Ist das neue Plugin Abwärtskompatibel zu älteren jQuery und WBCE Versionen, respektive WBCE-Addons? Wenn ja spräche nichts dagegen die flexiblere Lösung in den Core aufzunehmen.

---

Account inactive since 2018/11/17.

rjgamer

Developer

Re: jquery-insert.js überarbeitet

Das mit jQuery muss ich noch testen, sollte aber zu 99% kein Problem sein. Es kann 1zu1 das gleiche und noch mehr als die bisherige Lösung, muss aber sicher noch in den kommenden Alphas von WBCE getestet werden.

---

Neoflow | Fraggy Backend Theme