green lantern

Grün-laterne

Glaterne ist eine Bibliothek, die für eine Flash-HTML5-Shim-Schicht bestimmt ist. Genießen Sie die Live-Vorschau von http://hozuki.github.io/green-lantern.

Screenshots von Testfällen finden Sie hier.

Die Quelle erwerben

Native git ist sehr empfohlen gegen andere Kunden:

git clone https://github.com/hozuki/GLantern.git

Oder als NPM -Paket können Sie es über npm installieren:

npm install glantern --save

Gebäude aus der Quelle

Stellen Sie sicher, dass Sie Node.js und NPM installiert haben. Der Rest ist recht einfach:

 cd GLantern
npm install
gulp build

Nach dem Gebäude finden Sie:

• ein build/node für NW.JS und Electron;
• eine build/GLantern-browser.js Datei als vollständige, verkettete JavaScript-Datei für Browser;
• ein build/GLantern-browser.min.js (und entsprechende Quellzuordnung) für Browser als minimierte Datei für eine bessere Ladegeschwindigkeit.

Verwenden der Bibliothek

Siehe die Demo -Seite unter test/visual/index.html . Sie benötigen eine Umgebung mit WebGL, wie modernen Browsern, NW.js oder Electron.

Importieren in Ihr Projekt

Glaterne unterstützt zwei Importstile.

Der erste importiert nach <script> Tag. Verwenden Sie sein src -Attribut und weisen Sie es auf das kompilierte Ergebnis hin:

 < script type =" text/javascript " src =" GLantern-browser.min.js " > </ script >

In Umgebungen, die node.js wie nw.js oder elektron unterstützen, können Sie auch die require Syntax verwenden:

 const GLantern = require ( "glantern" ) ;

Nach dem Import mit dem ersteren oder dem letzteren Stil ist das GLantern weltweit verfügbar.

Mit exportierten Mitgliedern

Die Packungsstruktur von Flash ist in Glaterne aufbewahrt, sodass eine GLantern. Präfix funktioniert normalerweise. Wenn Sie ActionScript mehr machen möchten, bietet Glaterne eine injectToGlobal() -Funktion, um die "Pakete" dem globalen Bereich injizieren zu können.

 // Check if GLantern is supported
if ( GLantern . isSupported ( ) ) {
    const lantern = new GLantern . EngineBase ( ) ;
    const canvas = document . createElement ( "canvas" ) ;
    lantern . initialize ( canvas , 682 , 438 ) ;
    document . body . appendChild ( lantern . view ) ;
    window . addEventListener ( "unload" , function ( ) {
        lantern . dispose ( ) ;
    } ) ;
    draw ( true , this ) ;
} else {
    const prompt = document . createElement ( "span" ) ;
    prompt . textContent = "Oops, GLantern is not supported on your browser." ;
    document . body . appendChild ( prompt ) ;
}

/**
* Draws a rectangle.
*/
function draw ( ) {
    function createShape ( alpha ) {
        const s = new GLantern . flash . display . Shape ( lantern . stage , lantern . stage ) ;
        lantern . stage . addChild ( s ) ;
        s . alpha = alpha ;
        return s ;
    }
    const shape1 = createShape ( 1 ) ;
    shape1 . graphics . beginFill ( 0xffffff ) ;
    shape1 . graphics . drawRect ( 0 , 0 , 540 , 383 ) ;
    shape1 . graphics . endFill ( ) ;
} 

Fragen und a

Siehe Qa.md.

Lizenz

Die MIT -Lizenz

Sie finden auch eine Kopie in LICENSE.md .

Andere Ressourcen

• Adobe Flash CC kann das Flash -Projekt als WebGL -Projekte exportieren. Das Tutorial und die Einschränkungen finden Sie hier. Es wurde jedoch kürzlich bekannt gegeben, dass Flash durch Animate ersetzt wird. Also Jungs, Sie möchten vielleicht eine herzliche willkommene Lösung.
• Mozilla hat ein Projekt gestartet, Shumway, das mithilfe von HTML 5-Funktionen auf Firefox eine blitzartige Unterstützung bieten soll.

Credits

Ein Teil von Green-Lantern verwendet Modifikationen basierend auf webgl-utils.js . Die Lizenzdatei finden Sie hier.

Ein Teil von Green-Lantern verwendet Modifikationen basierend auf AwayJS.Core.geom . Die Lizenzdatei finden Sie hier.

Ein Teil der Grünlaterne verwendet Anpassungen aus der Anti-Korn-Geometrie, ursprünglich von Maxim Shemanarev in C ++. Die Lizenzdatei finden Sie hier.