green lantern

Green.

Glantern est une bibliothèque destinée à un calque Flash-HTML5. Profitez de l'aperçu en direct de http://hozuki.github.io/green-lantern.

Des captures d'écran des cas de test peuvent être trouvées ici.

Acquérir la source

git natif est fortement recommandé contre d'autres clients:

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

Ou, en tant que package NPM, vous pouvez l'installer via npm :

npm install glantern --save

Construction de la source

Assurez-vous que Node.js et NPM sont installés. Le reste est assez simple:

 cd GLantern
npm install
gulp build

Après le bâtiment, vous trouverez:

• un répertoire build/node pour NW.JS et Electron;
• un fichier build/GLantern-browser.js comme fichier javascript complet et concaténé pour les navigateurs;
• un build/GLantern-browser.min.js (et un mappage source correspondant) pour les navigateurs, comme fichier minimisée pour une meilleure vitesse de chargement.

Utilisation de la bibliothèque

Voir la page de démonstration sur test/visual/index.html . Vous aurez besoin d'un environnement avec WebGL, comme les navigateurs modernes, NW.JS ou Electron.

Importation dans votre projet

Glantern prend en charge deux styles d'importation.

Le premier est l'importation par balise <script> . Utilisez son attribut src et pointez-le vers le résultat compilé:

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

Dans des environnements qui prennent en charge Node.js, comme NW.JS ou Electron, vous pouvez également utiliser la syntaxe require :

 const GLantern = require ( "glantern" ) ;

Après avoir importé avec le premier ou le dernier style, l'objet GLantern est disponible à l'échelle mondiale.

En utilisant des membres exportés

La structure du package de Flash est conservée dans Glantern, donc ajoutant un GLantern. Le préfixe fonctionne généralement. Si vous souhaitez le rendre plus comme ActionScript, Glantern fournit une fonction injectToGlobal() pour injecter les "packages" à la portée globale.

 // 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 ( ) ;
} 

Q&R

Voir QA.MD.

Licence

La licence MIT

Vous trouverez également une copie dans LICENSE.md .

Autres ressources

• Adobe Flash CC est capable d'exporter le projet Flash en tant que projets WebGL. Le tutoriel et les restrictions peuvent être trouvés ici. Cependant, il a récemment été annoncé que Flash est remplacé par Animate. Donc, les gars, vous voudrez peut-être accueillir chaleureusement cette nouvelle solution.
• Mozilla a lancé un projet, Shumway, qui est destiné à fournir un support de type flash en utilisant des fonctionnalités HTML 5 sur Firefox.

Crédits

Une partie de Green-Lantern utilise des modifications basées sur webgl-utils.js . Son fichier de licence peut être trouvé ici.

Une partie de Green-Lantern utilise des modifications basées sur AwayJS.Core.geom . Son fichier de licence peut être trouvé ici.

Une partie de Green-Lantern utilise des adaptations de la géométrie anti-grain, à l'origine par Maxim Shemanarev en C ++. Son fichier de licence peut être trouvé ici.