Zoe Importer example

.gitignore

@@ -1,3 +1,4 @@
 test/TestMain.hx
 test/TestSuite.hx
 test/ExampleTest.hx
+examples/zoe/Export

examples/zoe/Assets/kit.json

@@ -0,0 +1,48 @@
+{
+"framerate":6,
+"images":["kit.png"],
+"frames":[
+    [0, 0, 64, 128, 0, -1, -1],
+    [64, 0, 64, 128, 0, -1, -1],
+    [128, 0, 64, 128, 0, -1, -1],
+    [192, 0, 64, 128, 0, -1, -1],
+    [256, 0, 64, 128, 0, -1, -1],
+    [320, 0, 64, 128, 0, -1, -1],
+    [384, 0, 64, 128, 0, -1, -1],
+    [448, 0, 64, 128, 0, -1, -1],
+    [512, 0, 64, 128, 0, -1, -1],
+    [576, 0, 64, 128, 0, -1, -1],
+    [640, 0, 64, 128, 0, -1, -1],
+    [704, 0, 64, 128, 0, -1, -1],
+    [768, 0, 64, 128, 0, -1, -1],
+    [832, 0, 64, 128, 0, -1, -1],
+    [896, 0, 64, 128, 0, -1, -1],
+    [960, 0, 64, 128, 0, -1, -1],
+    [1024, 0, 64, 128, 0, -1, -1],
+    [1088, 0, 64, 128, 0, -1, -1],
+    [1152, 0, 64, 128, 0, -1, -1],
+    [1216, 0, 64, 128, 0, -1, -1],
+    [1280, 0, 64, 128, 0, -1, -1],
+    [1344, 0, 64, 128, 0, -1, -1],
+    [1408, 0, 64, 128, 0, -1, -1],
+    [1472, 0, 64, 128, 0, -1, -1],
+    [1536, 0, 64, 128, 0, -1, -1],
+    [1600, 0, 64, 128, 0, -1, -1],
+    [1664, 0, 64, 128, 0, -1, -1],
+    [1728, 0, 64, 128, 0, -1, -1],
+    [1792, 0, 64, 128, 0, -1, -1],
+    [1856, 0, 64, 128, 0, -1, -1]
+],
+"animations":{
+    "block": {"frames": [6, 7, 8], "speed": 1},
+    "hit": {"frames": [9, 10, 11], "speed": 1},
+    "kick": {"frames": [12, 18, 19, 20], "speed": 1},
+    "airpunch": {"frames": [3, 4, 5], "speed": 1},
+    "punch": {"frames": [24, 25, 26], "speed": 1},
+    "jump": {"frames": [15, 16, 17], "speed": 1},
+    "idle": {"frames": [12, 13, 14], "speed": 1},
+    "walk": {"frames": [27, 28, 29], "speed": 1},
+    "airkick": {"frames": [0, 1, 2], "speed": 1},
+    "ko": {"frames": [21, 22, 23], "speed": 1}
+}
+}

examples/zoe/README.md

@@ -0,0 +1,31 @@
+# ZoeImporter Spritesheet Example
+
+This example is based on Infinite's code
+[texturepacker example](https://github.com/jgranick/spritesheet/tree/master/examples/texturepacker)
+
+* Artwork is from opengameart.org [link](http://opengameart.org/content/kit-the-firefox-mascot)
+
+## Zoe
+
+If Flash is still your favourite animation tool, you should use [ZoeImporter](https://github.com/jgranick/spritesheet/blob/master/spritesheet/importers/ZoeImporter.hx) to create spritesheets.
+
+You will need [Zoe](http://www.createjs.com/#!/Zoe) 
+
+>
+ZOË   
+An AIR application for exporting SWF animations as EaselJS spritesheets for use in Canvas and CSS. Maintain frame labels, reuse similar frames, and more!
+>
+
+![image](zoe.png)
+
+## Flash
+
+And create an animation on the timeline with labels
+
+![image](flash.png)
+
+Export the animation to `.swf` and open that file into Zoe.
+
+Fiddle with the settings in Zoe and export the spritesheet with json.
+
+

examples/zoe/Source/Main.hx

@@ -0,0 +1,125 @@
+package;
+
+import spritesheet.Spritesheet;
+import spritesheet.importers.ZoeImporter;
+import flash.display.StageScaleMode;
+import flash.display.StageAlign;
+import flash.ui.Keyboard;
+import flash.events.KeyboardEvent;
+import flash.Lib;
+import flash.events.Event;
+import spritesheet.AnimatedSprite;
+import flash.display.BitmapData;
+import openfl.Assets;
+import flash.display.Sprite;
+
+/**
+ * ZoeImporter
+ * @author Matthijs Kamstra aka [mck]
+ * 
+ * Based on Infinite's code
+ * https://github.com/jgranick/spritesheet/tree/master/examples/texturepacker
+ */
+class Main extends Sprite
+{
+	var inited:Bool;
+	var lastTime:Int = 0;
+	var animated:AnimatedSprite;
+
+	public function new()
+	{
+		super();
+
+		stage.align = StageAlign.TOP_LEFT;
+		stage.scaleMode = StageScaleMode.NO_SCALE;
+
+		setupSpritsheet();
+		centerContent();
+	}
+
+	public function setupSpritsheet():Void
+	{
+		// Load Spritesheet Source (json file)
+		var json = Assets.getText("assets/kit.json");
+
+		var spritesheet:Spritesheet = ZoeImporter.parse(json, 'assets');
+
+		// default the behaviour don't loop
+		spritesheet.loopBehavior('walk');
+		spritesheet.loopBehavior('idle');
+
+		animated = new AnimatedSprite(spritesheet, true);
+		addChild( animated );
+
+		animated.showBehavior("walk");
+
+		addEventListener(Event.ENTER_FRAME, onEnterFrame);
+		stage.addEventListener(KeyboardEvent.KEY_UP, onKeyUp);
+
+		trace("keys:1,2,3,4,5,6,7,8,9,0");
+	}
+
+	private function centerContent():Void
+	{
+		animated.x = stage.stageWidth / 2-animated.width/2;
+		animated.y = stage.stageHeight / 2-animated.height/2;
+	}
+
+	private function onEnterFrame(e:Event):Void
+	{
+		var time = Lib.getTimer();
+		var delta = time - lastTime;
+		animated.update(delta);
+		lastTime = time;
+	}
+
+	private function resize(e:Event)
+	{
+		centerContent();
+	}
+
+	private function onKeyUp(e:KeyboardEvent):Void
+	{
+		if (e.keyCode == Keyboard.NUMBER_1) {
+			animated.showBehavior("idle");
+			trace("idle");
+		}
+		if (e.keyCode == Keyboard.NUMBER_2) {
+			animated.showBehavior("walk");
+			trace("walk");
+		}
+		if (e.keyCode == Keyboard.NUMBER_3) {
+			animated.showBehavior("jump");
+			trace("jump");
+		}
+		if (e.keyCode == Keyboard.NUMBER_4) {
+			animated.showBehavior("hit");
+			trace("hit");
+		}
+		if (e.keyCode == Keyboard.NUMBER_5) {
+			animated.showBehavior("punch");
+			trace("punch");
+		}
+		if (e.keyCode == Keyboard.NUMBER_6) {
+			animated.showBehavior("kick");
+			trace("kick");
+		}
+		if (e.keyCode == Keyboard.NUMBER_7) {
+			animated.showBehavior("airpunch");
+			trace("airpunch");
+		}
+		if (e.keyCode == Keyboard.NUMBER_8) {
+			animated.showBehavior("airkick");
+			trace("airkick");
+		}
+		if (e.keyCode == Keyboard.NUMBER_9) {
+			animated.showBehavior("ko");
+			trace("ko");
+		}
+		if (e.keyCode == Keyboard.NUMBER_0) {
+			animated.showBehaviors(["walk","jump","hit","punch","idle"]);
+			trace("walk,jump,hit,punch,idle");
+		}
+	}
+
+}

examples/zoe/project.xml

@@ -0,0 +1,15 @@
+<?xml version="1.0" encoding="utf-8"?>
+<project>
+
+	<meta title="Zoe" package="com.example.zoe" version="1.0.0" company="Company Name" />
+	<app main="Main" path="Export" file="Zoe" />
+
+	<source path="Source" />
+
+    <haxelib name="openfl" />
+    <haxelib name="spritesheet" />
+
+	<assets path="Assets" rename="assets" exclude="kit.svg" />
+	<icon path="Assets/kit.svg" />
+
+</project>

haxelib.json

@@ -4,8 +4,8 @@
   "license": "MIT",
   "tags": [],
   "description": "Spritesheet is a useful and flexible sprite sheet library compatible with OpenFL",
-  "version": "1.2.0",
+  "version": "1.2.1",
   "releasenote": "Update for Haxe 3",
-  "contributors": [ "singmajesty", "infinite" ],
+  "contributors": [ "singmajesty", "infinite", "Matthijs Kamstra aka [mck]" ],
   "dependencies": {}
 }

spritesheet/AnimatedSprite.hx

@@ -130,7 +130,7 @@ class AnimatedSprite extends Sprite {
 
 			if (ratio >= 1) {
 
-				if (currentBehavior.loop) {
+				if (currentBehavior.loop && behaviorQueue.length == 0 ) {
 
 					ratio -= Math.floor (ratio);
 

spritesheet/Spritesheet.hx

@@ -56,7 +56,20 @@ class Spritesheet {
 
 	}
 
-
+	/**
+	 * added for ZoeImporter, loop of the animation is default false 
+	 * @param  name 	BehaviorData name set by ZoeImporter
+	 */
+	public function loopBehavior (name:String):Void {
+
+		if(this.behaviors.exists(cast name)){		
+			var behavior : BehaviorData = this.behaviors.get (cast name);
+			behavior.loop = true;
+		}
+
+	}
+
+
 	public function addFrame (frame:SpritesheetFrame):Void {
 
 		frames.push (frame);

spritesheet/importers/ZoeImporter.hx

@@ -28,7 +28,9 @@ class ZoeImporter {
 
 		var json = Json.parse (data);
 		var images = [];
-
+
+		var framerate = Std.int (json.framerate);
+
 		for (image in cast (json.images, Array <Dynamic>)) {
 
 			images.push (new Bitmap (Assets.getBitmapData (assetDirectory + "/" + image)));
@@ -73,7 +75,8 @@ class ZoeImporter {
 			var state = Reflect.field (json.animations, key);
 			var behaviorFrames = new Array <Int> ();
 			var frames = Reflect.field (state, "frames");
-
+			var speed = Reflect.field (state, "speed");
+
 			if (frames == null) {
 
 				//there must be a more elegant way of doing this...
@@ -92,9 +95,11 @@ class ZoeImporter {
 
 			}
 
+			var cFramerate = Math.round(framerate * speed);
+
 			//var origin = new Point (frames[state.start].x, frames[state.start].y);
 			//var behavior = new BehaviorData (key, behaviorFrames, true, 30, origin.x, origin.y);
-			var behavior = new BehaviorData (key, behaviorFrames, true, 30, 0, 0);
+			var behavior = new BehaviorData (key, behaviorFrames, false, cFramerate, 0, 0);
 			behaviors.set (behavior.name, behavior);
 
 		}