Archiv der Kategorie: Cangaja

Cangaja: Support für Spine 2D Animationen in Cangaja

spine 2d in cangajaMit den 2D Animtionstools Spine oder Spriter habe ich schon lange geliebäugelt. Als ich mir das Spine Runtime Repository auf github angeschaut habe und dort das JavaScript Beispiel für die Turbulenz HTML5 Game Engine gesehen habe, dachte ich mir dass die Spine Runtime eigentlich gar nicht so schwer zu integrieren ist. Außerdem ist hier eine sehr gute Runtime Dokumentation zu finden.

Also habe ich eine erste einfache Spine Klasse in Cangaja integriert, siehe Demo. Die meisten Features funktionieren schon.

Bei Skalierung und Transparenz von Elementen muss ich noch genauer schauen ob das in der spine-js runtime schon nicht unterstützt wird bzw. noch nicht richtig von mir implementiert wurde.

Auch bei Texturen die z.B. auf der X- oder Y-Achse gespiegelt sind gibt es noch einen kleines Positionierungsproblem.

Im nächsten Schritt wäre natürlich eine Kollisionsabfrage interessant oder sogar eine Verbindung mit Box2D Bodies wären ein sehr cooles Feature.

Auch die Spine Animation Events bieten interessante Einsatzmöglichkeiten. Abgesehen davon besitze ich im Moment nur die eingeschränkte Demoversion von Spine in der das Exportieren von Animationen deaktivert ist. Mal sehen was Zeit und Motivation in Zukunft bringt ;-)

 

JavaScript: Destructable Terrain in JavaScript mit Cangaja (Box2D, poly2tri, Clipper)

Destructible terrain in JavaScript

Auf dieses Feature bin ich ein klein wenig stolz ;-) Ich habe in Cangaja ein destructible Terrain implementiert! Mehr oder weniger angespornt von einem Kollegen, der dieses Feature immer wieder erwähnt hat und haben wollte, hat mich dieses Thema irgendwie nie richtig los gelassen…

Infos im Web sind rar, aber dennoch sehr inspirierend gewesen. „Digging into Box2D destructible terrain“ von Emanuele Feronato und das folgende Tutorial wurden mit Spannung erwartet. Die Tutorials werden aber in nicht abwartbaren Abständen veröffentlicht ;-)

Die richtige Idee kam aber erst beim betrachten von „Destructible terrain using SFML + Box2D + Clipper + Poly2Tri“ . Das war der Moment in dem ich dachte, dass ist doch gar nicht so schwer zu implementieren! Mit Clipper und Poly2tri die es als JavaScript Version gibt, wird der Hauptteil der Arbeit erledigt.

Die Terrain Funktion hat noch ein zwei kleine Bugs, die wie ich hoffe noch ausgemerzt werden können. Die Demo dazu läuft aber schon sehr gut!

Cangaja: Erstes Spieledemo!

So, das erste kleine Cangaja Spieledemo ist programmiert. Es ist zwar noch etwas rudimentär, aber schon spielbar. Ziel war es ein erstes kleines leichtes Projekt umzusetzen, um die Tauglichkeit des Cangaja Frameworks zu testen.

Die Wunsch- bzw. Featureliste für das Cangaja Framework ist lang und teilweise sehr sportlich ;-) Freie Zeit und vor allem der Spaß am weiterentwickeln wird zeigen ob noch weitere Features ins FW einfließen werden… Wie in diesem Blogbeitrag schon geschrieben ist die HTML5/Canvas/Framework Front gerade massiv in Bewegung und hat hochkarätige Lösungen hervorgebracht.

Cangaja: Statusbericht ;o)

cangaja-picTja, was soll ich sagen… meine anfängliche Spielerei mit dem Canvas Element und auch mit JavaScript hat sich ganz schön weit entwickelt. Mittlerweile ist ein kleines JS Game Framework, genannt Cangaja (CanvasGameJavaScript) daraus geworden.

Dieses ist eigentlich inspiriert durch Monkey und die dafür existierenden 2D FrameWorks. Hier gibt es das Mojo Framework von Monkey selbst und noch viele andere die darauf aufbauen. Hier seien nur schnell Diddy FW, fantomEngine FW und das Ignition FW genannt. Monkey hat eine geniale Multiplatformunterstützung die ihres gleichen sucht, aber trotzdem bin ich ins Canvas/JavaScript Lager abgedriftet ;-)

Auch die JavaScript FW Front ist gerade massiv in Bewegung. Man kommt aus dem Staunen nicht mehr heraus. Altbekannte Libraries wie z.B. mrdoobs three.js oder das neue pixi.js von GoodBoyDigital leisten beeindruckende Features. Aber auch „einfache“ leicht zu programmierende Frameworks wie Quintus haben ihren Charme. Mit Ludei’s CocoonJS und Ejecta sind zwei sehr interessante Lösungen am Start mit denen man HTML5 Entwicklungen auf Mobile Geräte in fast nativer Performance bringen kann.

Aber zurück zu Cangaja, dieses steht auf Github für jedermann zur Verfügung. Eine kleine Demo- bzw. Featureübersicht ist hier zu finden. Für alle FrameWork Teile gibt es dort einzelne Beispiele. Mittlerweile bin ich auch in die Verlegenheit gekommen eine API Dokumentation zu erstellen, dabei war mit YUIDOC eine große Hilfe. Diese wird in Zukunft hoffentlich intensiv gepflegt.

Enthaltene Features sind: Sprites (unterstützt TexturePacker, wie auch alle ableitenden Klassen), Animationen, Emitter, Particle, Director, Screens, Layer, Buttons, Fonts (unterstützt GlyphDesigner), Maps (unterstützt Tiled), Box2D Wrapper (unterstützt PhysicsEditor), usw., usw.

Manches ist weit fortgeschritten, manches hätte besser smarter gelöst werden können, anderes wird in Zukunft noch geändert ;-) Die Wunschliste ist groß…