Spriter Importer

Monkey Forums/Monkey Code/Spriter Importer

therevills

(Posted 2012) [#1]

[EDIT] Latest code can be downloaded from here:
https://code.google.com/p/monkey-spriter-importer/
[/EDIT]

Based off the Libgdx version from here: http://www.badlogicgames.com/forum/viewtopic.php?f=17&t=3863

You need Diddy's latest xml module:

#TEXT_FILES="*.txt|*.xml|*.json|*.SCML"
Strict

Import diddy

Function Main:Int()
	New Game()
	Return 0
End

Class Game Extends App
	Field spriterObject:SpriterObject
	Field timeElapsed:Float = 0
	Field textures:TextureProvider
	
	Method OnCreate:Int()
		textures = New TextureProvider
		spriterObject = SpriterImporter.ImportFile("hero/BetaFormatHero.SCML", textures)
		
		SetUpdateRate(60)
		Return 0
	End
	Method OnUpdate:Int()
		Return 0
	End	
	Method OnRender:Int()
		Cls(255, 0, 255)
		timeElapsed+=0.06 'dx.graphics.getDeltaTime();
		SpriterDrawer.Draw(textures, spriterObject, "idle_healthy", timeElapsed*100 Mod 760, 100, 300);
	    SpriterDrawer.Draw(textures, spriterObject, "walk", timeElapsed*100 Mod 225, 300, 300);

		Return 0
	End
End

Class SpriterAnimation
	Field name:String
	Field frames:ArrayList<SpriterAnimationFrame>
	
	Method New()
		Self.frames = New ArrayList<SpriterAnimationFrame>
	End
	
	Method GetFrames:ArrayList<SpriterAnimationFrame>()
		Return Self.frames
	End
	
	Method AddFrame:Void(frame:SpriterAnimationFrame)
		Self.frames.Add(frame)
	End
	
	Method ToString:String()
		Return "";'"SpriterAnimation [name=" + name + ", frames=" + frames + "]"
	End
End

Class SpriterAnimationFrame
	Field frame:SpriterFrame
	Field duration:Float
	
	Method ToString:String()
		Return "SpriterAnimationFrame [frame=" + frame + ", duration=" + duration + "]"
	End	
End

Class SpriterFrame
	Field name:String
	Field sprites:ArrayList<SpriterSprite>
	
	Method New()
		Self.sprites = New ArrayList<SpriterSprite>
	End
	
	Method GetSprites:ArrayList<SpriterSprite>()
		Return Self.sprites
	End
	
	Method AddSprite:Void(sprite:SpriterSprite)
		Self.sprites.Add(sprite)
	End
	
	Method GetSpriteByObjectPart:SpriterSprite(objectPart:SpriterObjectPart)
		For Local i:Int = 0 To sprites.Size() -1
			Local sprite:SpriterSprite = sprites.Get(i)
			If sprite.objectPart = objectPart
				Return sprite
			End
		Next
		Return Null
	End
	
	Method GetSpriteByObjectPartPath:SpriterSprite(objectPart:SpriterObjectPart)
		'TODO
		Local searchPath:String = "" 'objectPart.textureName.substring(0, objectPart.textureName.indexOf("\\"));

		For Local i:Int = 0 To sprites.Size() - 1
			Local sprite:SpriterSprite = sprites.Get(i)
			Local curPath:String = ""'sprite.objectPart.textureName.substring(0, sprite.objectPart.textureName.indexOf("\\"));    		
    		
			If curPath = searchPath
				Return sprite
			End
		Next
		Return Null
	End
	
	Method ToString:String()
		Return ""'"SpriterFrame [name=" + name + ", sprites=" + sprites + "]"
	End	
End

Class SpriterObject
	Field basePath:String

	Field objectParts:StringMap<SpriterObjectPart>
	Field animations:StringMap<SpriterAnimation>
	
	Method New()
		Self.objectParts = New StringMap<SpriterObjectPart>
		Self.animations = New StringMap<SpriterAnimation>
	End
	
	Method GetObjectParts:StringMap<SpriterObjectPart>()
		Return objectParts
	End

	Method AddObjectPart:Void(objectPart:SpriterObjectPart)
		Self.objectParts.Add(objectPart.textureName, objectPart)
	End

	Method GetAnimations:StringMap<SpriterAnimation>()
		Return animations
	End

	Method AddAnimation:Void(animation:SpriterAnimation)
		Self.animations.Add(animation.name, animation)
	End

	Method ToString:String()
		Return ""'"SpriterObject [objectParts=" + objectParts + ", animations=" + animations + "]"
	End
End

Class SpriterObjectPart
	Field textureName:String
	Field originX:Float
	Field originY:Float
	
	Method ToString:String()
		Return ""'"SpriterObjectPart [textureName=" + textureName + ", originX=" + originX + ", originY=" + originY + "]"
	End
End

Class SpriterSprite
	Field objectPart:SpriterObjectPart
	Field colorBits:Float
	Field opacity:Float
	Field angle:Float
	Field x:Float
	Field y:Float
	Field width:Float
	Field height:Float

	Method ToString:String()
		Return ""'"SpriterSprite [objectPart=" + objectPart + ", colorBits=" + colorBits + ", opacity=" + opacity + ", angle=" + angle + ", x=" + x + ", y=" + y + ", width=" + width + ", height=" + height + "]"
	End
End

Class SpriterImporter
	Function ImportFile:SpriterObject(file:String, textures:TextureProvider)
		Local xmlReader:XMLParser = New XMLParser
		Local doc:XMLDocument = xmlReader.ParseString(LoadString(file))
		
		Print doc.Root.Children.Get(0).Parent.Name
		
		
		Local rootElement:XMLElement = doc.Root
		Local spriterObject:SpriterObject = New SpriterObject
		
		spriterObject.basePath = "hero\" 'file.path().replace(file.name(), "");
		'// import the objectParts with the hotspots
		
		Local xmlHotSpotArray:XMLElement = rootElement.GetFirstChildByName("hotspotarray")
		If (xmlHotSpotArray<>Null) Then
			For Local xmlHotSpot:XMLElement = Eachin xmlHotSpotArray.GetChildrenByName("hotspot")
				Local objectPart:SpriterObjectPart = New SpriterObjectPart
				objectPart.textureName = xmlHotSpot.GetFirstChildByName("filepath").Value()
				objectPart.originX = Float(xmlHotSpot.GetFirstChildByName("x").Value())
				objectPart.originY = Float(xmlHotSpot.GetFirstChildByName("y").Value())
				spriterObject.AddObjectPart(objectPart);
			Next
		Endif	
		
		'// Import the frames
		Local frames:StringMap<SpriterFrame> = New StringMap<SpriterFrame>
		For Local xmlFrame:XMLElement = Eachin rootElement.GetChildrenByName("frame")
			Local frame:SpriterFrame = New SpriterFrame
			frame.name = xmlFrame.GetFirstChildByName("name").Value
			For Local xmlSprite:XMLElement = Eachin xmlFrame.GetChildrenByName("sprite")
				Local sprite:SpriterSprite = New SpriterSprite
				sprite.objectPart = spriterObject.GetObjectParts().Get(xmlSprite.GetFirstChildByName("image").Value())
				If sprite.objectPart = Null Then ' create new object part
					Local objectPart:SpriterObjectPart = New SpriterObjectPart
					objectPart.textureName = xmlSprite.GetFirstChildByName("image").Value()
					textures.Load(spriterObject.basePath + objectPart.textureName)
					sprite.objectPart = objectPart
					spriterObject.AddObjectPart(objectPart)
				End
				sprite.colorBits = Float(xmlSprite.GetFirstChildByName("color").Value())
				sprite.opacity = Float(xmlSprite.GetFirstChildByName("opacity").Value())
				sprite.angle = Float(xmlSprite.GetFirstChildByName("angle").Value())
				If sprite.angle < 0
					sprite.angle += 360
				End
				sprite.x = Float(xmlSprite.GetFirstChildByName("x").Value())
				sprite.y = Float(xmlSprite.GetFirstChildByName("y").Value())
				sprite.width = Float(xmlSprite.GetFirstChildByName("width").Value())
				sprite.height = Float(xmlSprite.GetFirstChildByName("height").Value())

				frame.AddSprite(sprite)
			Next
			frames.Add(frame.name, frame)
		Next
		
		'// Import the animations
		For Local xmlAnim:XMLElement = Eachin rootElement.GetFirstChildByName("char").GetChildrenByName("anim")
			Local animation:SpriterAnimation = New SpriterAnimation
			animation.name = xmlAnim.GetFirstChildByName("name").Value()
			For Local xmlFrame:XMLElement = Eachin xmlAnim.GetChildrenByName("frame")
				Local animationFrame:SpriterAnimationFrame = New SpriterAnimationFrame
				animationFrame.duration = Float(xmlFrame.GetFirstChildByName("duration").Value())
				Local text:String = xmlFrame.GetFirstChildByName("name").Value()
				animationFrame.frame = frames.Get(text)
				animation.AddFrame(animationFrame)
			Next
			spriterObject.AddAnimation(animation)
		Next
		
		Return spriterObject
	End
End

Class SpriterDrawer
	Function Draw:Void(textureProvider:TextureProvider, spriterObject:SpriterObject, animationName:String, keyTime:Float, offsetX:Float, offsetY:Float)
		Local spriterAnimation:SpriterAnimation = spriterObject.GetAnimations().Get(animationName)
		If spriterAnimation = Null Then
			Error("The given animationname:" + animationName + " does not exist in the animation")
		End
		Local frames:ArrayList<SpriterAnimationFrame> = spriterAnimation.GetFrames()
		Local currentFrame:SpriterAnimationFrame = Null
		Local nextFrame:SpriterAnimationFrame = Null
		Local curTime:Float = 0
		Local tweenFactor:Float = 0
		For Local i:Int = 0 To frames.Size() - 1
			Local animationFrame:SpriterAnimationFrame = frames.Get(i)
			If curTime <= keyTime And curTime + animationFrame.duration > keyTime
				currentFrame = animationFrame
				If i < frames.Size() - 1
					nextFrame = frames.Get(i + 1)
				Else
					nextFrame = animationFrame
				End
				tweenFactor = (keyTime - curTime) / (animationFrame.duration)
				Exit
			End
			curTime += animationFrame.duration
		End
		If currentFrame= Null Then
			currentFrame = frames.Get(frames.Size() - 1)
			nextFrame = frames.Get(frames.Size() - 1)
		End
		
		'// iterate through all sprites And draw them
		Local sprites1:ArrayList<SpriterSprite> = currentFrame.frame.GetSprites()
		For Local i:Int = 0 To sprites1.Size() - 1
			Local sprite1:SpriterSprite = sprites1.Get(i)
			
			'// attention: Sprite uses an inverted y-axis: 0:0 is top left
			Local posX1:Float  = sprite1.x - sprite1.objectPart.originX + offsetX
			Local posY1:Float  = sprite1.y - sprite1.objectPart.originY + offsetY
			Local angle1:Float  = sprite1.angle
			
			Local posXTweened:Float
			Local posYTweened:Float
			Local angleTweened:Float
			'// perform tweening, If sprite occurs in next frame too
			Local sprite2:SpriterSprite = nextFrame.frame.GetSpriteByObjectPart(sprite1.objectPart)
			If sprite2 = Null '// no tweening possible
				posXTweened = posX1
				posYTweened = posY1
				angleTweened = angle1
			Else
				Local posX2:Float = sprite2.x - sprite2.objectPart.originX + offsetX
				Local posY2:Float = sprite2.y - sprite2.objectPart.originY + offsetY
				Local angle2:Float = sprite2.angle

				posXTweened = posX1 * (1 - tweenFactor) + posX2 * tweenFactor
				posYTweened = posY1 * (1 - tweenFactor) + posY2 * tweenFactor

				If (angle2 > angle1)
					If (angle2 - angle1 <= 180)
						angleTweened = angle1 * (1 - tweenFactor) + angle2 * tweenFactor
					Else
						angleTweened = (360 + angle1) * (1 - tweenFactor) + angle2 * tweenFactor
					End
				Else
					If (angle1 - angle2 <= 180)
						angleTweened = angle1 * (1 - tweenFactor) + angle2 * tweenFactor
					Else
						angleTweened = angle1 * (1 - tweenFactor) + (360 + angle2) * tweenFactor
					End
				End
			End
			
			'// Lets draw!
			Local img:Image = textureProvider.GetTexture(spriterObject.basePath + sprite1.objectPart.textureName)
			Local x# = posXTweened
			Local y# = posYTweened
			Local rot# = angleTweened
			Local scaleX# = 1
			Local scaleY# = 1
			DrawImage img, x, y, rot, scaleX, scaleY
		End
	End	
End

Class TextureProvider Extends StringMap<Image>

	Method Load:Image(name:String)
		Local storeKey:String = name.ToUpper()

		Local i:Image = New Image
		Local imgName:String = name
		imgName = imgName.Replace("\", "/")
		
		i = LoadImage(imgName )', 1, flags)
		If i = Null
			Error "Error loading image "+name
		End
		'Print "storing "+storeKey
		Self.Set(storeKey, i)
		Return i
	End
	
	Method DisplayAllStored:Void()
		' debug: print all keys in the map
		For Local key:String = Eachin Self.Keys()
			Print key + " is stored in the map."
		Next
	End
	
	Method GetTexture:Image(name:String)
		name = name.ToUpper()
	   	
		Local i:Image= Self.Get(name)
		If i = Null Then Error("Image '" + name + "' not found in the TextureProvider")
		Return i
	End	
End

It's not 100% yet, but it does load up the hero example: http://dl.dropbox.com/u/1013446/Spriter%20Releases/BetaFileFormatRelease/BetaFileFormatRelease.zip

Running Example: http://www.therevillsgames.com/monkey/Spriter/MonkeyGame.html

John McCubbin

(Posted 2012) [#2]

Good work, I've backed the spriter project on kickstarter and am looking forward to using it for monkey and hopefully blitzmax too :)

Soap	(Posted 2012) [#3]

Awesome! :D The page has been updated with Monkey listed: http://www.kickstarter.com/projects/539087245/spriter

TheRedFox

(Posted 2012) [#4]

I've backed Spriter as well. Cool to get this!

Wiering

(Posted 2012) [#5]

Nice!
What am I doing wrong if I get 'Identifier "GetFirstChildByName" not found'?

therevills

(Posted 2012) [#6]

What am I doing wrong if I get 'Identifier "GetFirstChildByName" not found'?

You need Diddy's latest xml module...

http://code.google.com/p/diddy/source/detail?r=393

Add this to the xml.monkey file around line 565:

	Method GetFirstChildByName:XMLElement(findName:String)
		For Local element:XMLElement = EachIn children
			If element.name = findName Then Return element
		Next
		Return Null
	End

Samah

(Posted 2012) [#7]

Get the latest xml.monkey from the repository.
Edit: Beat me to it. Stupid Gingerbread keyboard. :-)

Wiering

(Posted 2012) [#8]

Thanks!

Soap	(Posted 2012) [#9]

http://dl.dropbox.com/u/1013446/Spriter%20Releases/wordpress/Procedural.pdf

Soap	(Posted 2012) [#10]

Update: http://www.brashmonkey.com/forum/viewtopic.php?f=2&t=543

"I�ve completed the candidate for the file format. The format is a proposal for the final format of SCML"

Soap	(Posted 2012) [#11]

http://www.kickstarter.com/projects/539087245/spriter/posts/279445

Tibit

(Posted 2012) [#12]

This tool is really cool!

I had totally missed this, I saw the kickstarter today, and then at the bottom saw "monkey" and I was soo suprised.

Nice work, will defiantly use this in many projects!!

Rob Pearmain

(Posted 2012) [#13]

Where is the latest download link, the existing one seems broken?

Thanks

therevills

(Posted 2012) [#14]

The link to the beta format in the first post was controlled by the Spriter guys.

The code also needs to be updated to work with the newest version the spriter format.

Tibit

(Posted 2012) [#15]

Here is the latest:
http://www.kickstarter.com/projects/539087245/spriter/posts (Update 17 Aug)

They allow you to pre-order on their site. I haven't started working with it in Monkey yet since they are still in an unstable Alpha state, tough it is looking really good and nice to see Monkey with early support thanks to therevills :)

therevills

(Posted 2013) [#16]

WIP Update:

http://www.therevillsgames.com/monkey/SpriterA4/MonkeyGame.html

TODO:
Tweening
~~Timeline Updating~~

therevills

(Posted 2013) [#17]

Just updated the demo, now uses the actual timing from the files and has timeline updating (so now more missing hair :P)... the monster moves slow as the animation is 2 seconds in length, it'll look better once tweening is done ;)

CopperCircle

(Posted 2013) [#18]

Looking good

DGuy	(Posted 2013) [#19]

Nicely done!

therevills

(Posted 2013) [#20]

Nearly finished tweening, the monster looks 99% complete but the hero looks off...

Left side sprites are drawn per key frame and the right side sprites are drawn with tweening:

http://www.therevillsgames.com/monkey/SpriterA4/MonkeyGame.html

Jesse

(Posted 2013) [#21]

whenever I change animation it glitches and does this:

Safari & Chrome.

other than that it works quite nicely.

.

rIKmAN

(Posted 2013) [#22]

Yep same as Jesse for me, left side works fine, right side characters explode when changing animations - Tested in Chrome.

Good work :)

therevills

(Posted 2013) [#23]

Yeah I know about that one ;) Its due to the timing not being reset, if you leave a second or two the animation should go back to normal.

So whats the difference between these calculations:

Local tweenedX:Float = x1 + ((x2 - x1) * ((currentTime - timelineKey.time) / ( nextKeyTime - timelineKey.time)))

with this:

Local t1:Float = currentTime - timelineKey.time
Local t2:Float = nextKeyTime - timelineKey.time
Local timeAmount:Float = t1 / t2
Local tweenedX:Float = x1 + ((x2 - x1) * timeAmount)

I thought they were the same, but I had to expand the first one to the second one to get the tweening to work.

Samah

(Posted 2013) [#24]

(currentTime - timelineKey.time) / ( nextKeyTime - timelineKey.time)

Integer division.

therevills

(Posted 2013) [#25]

Integer division.

Doh! Thanks Samah!!

Just uploaded a newer version with a timer class: F1 to start, F2 to Stop and F3 to Resume.

So close now... hero's arm is a bit off when walking. [Edit - looks like the file is like that anyway...)

Tibit

(Posted 2013) [#26]

Excellent work, this is going to be very fun to use!

therevills

(Posted 2013) [#27]

Uploaded a quick fix and also uses Maps instead of Lists (since most of the objects are ID based).

therevills

(Posted 2013) [#28]

Question...

If you are on the last keyframe and there is time left on the animation, do we tween between the last frame and the first frame?

As this is what is causing the jumping movement with the walking hero... if we just display the last keyframe until the end of the animation it looks better, but you have a slight pause in movement.

Paul - Taiphoz

(Posted 2013) [#29]

have you tried just maxing the time or setting it back to the start the second the animation reaches its end ?

therevills

(Posted 2013) [#30]

I originally had it if there wasnt a next keyframe it would tween between the last keyframe and the first keyframe and max the time, it worked 90% of the time and I guess would be nearly the correct way for looping.

Now I've got if you are on the last keyframe it keeps on that frame until the end of the animation...

rIKmAN

(Posted 2013) [#31]

Now I've got if you are on the last keyframe it keeps on that frame until the end of the animation...

That doesn't sound right, is it working like that?
Maybe if you had to have a keyframe on the last frame, so as soon as it hits it you know then animation has completely ended, that might work?

From what you said it sounds like it would be frozen on the last keyframe pose until the end of the animation, then snap back to frame 1 when it had finished.

therevills

(Posted 2013) [#32]

Maybe if you had to have a keyframe on the last frame, so as soon as it hits it you know then animation has completely ended, that might work?

Then it would go straight to the first keyframe with no time to tween.

From what you said it sounds like it would be frozen on the last keyframe pose until the end of the animation, then snap back to frame 1 when it had finished.

Exactly :)

I think I need to add/use the looping flag in the SCML:

<animation id="0" name="idle_healthy" length="2100" looping="false">

Currently it is always "false" in the XML.

If its false, we would freeze on the last keyframe until the end of the animation, if true it would tween between the last keyframe and the first keyframe until the end of the animation and start again.

therevills

(Posted 2013) [#33]

Ahhhh think I've might have got it (maybe), a timeline's first key might not start at the animation start... so if we don't tween.

therevills

(Posted 2013) [#34]

All cleaned up and read to go (apart from bones):

http://www.therevillsgames.com/monkey/SpriterA4/MonkeyGame.html

#TEXT_FILES="*.txt|*.xml|*.json|*.SCML|*.scml"
Strict
Import mojo
Import diddy.xml

Function Main:Int()
	New Game()
	Return 0
End

'-------------------------- Monkey Spriter Demo --------------------------
Class Game Extends App
	
	Field monster:MonkeySpriter
	Field hero:MonkeySpriter

	Const IDLE:String = "Idle"
	Const POSTURE:String = "Posture"
	Field monsterAnimName:String = IDLE
	
	Const IDLEH:String = "idle_healthy"
	Const WALK:String = "walk"
	Field heroAnimName:String = IDLEH

	Field x:Float, y:Float
	
	Field lastMillisecs:Int
	Field currentMillisecs:Int 
	Field timeElapsed:Int
	Field tween:Bool = True
	Field loopType:Int
	
	Method OnCreate:Int()
		monster = SpriterImporter.ImportFile("monster", "Example.SCML")
		hero = SpriterImporter.ImportFile("example hero", "BetaFormatHero.SCML")
		x = DeviceWidth() / 2
		y = DeviceHeight() - 20
		monster.timer.Start()
		hero.timer.Start()		
		SetUpdateRate(60)
		lastMillisecs = Millisecs()
		loopType = MonkeySpriter.LOOPING_TRUE
		CreateGUI()
		Return 0
	End
	
	Method CreateGUI:Void()
		Local b:Button = New Button("Anim 1", 0, 10, 100, 20)
		b.SetColour(255, 0, 0)
		b = New Button("Anim 2", 110, 10, 100, 20)

		b = New Button("Loop Type", 220, 10, 100, 20)
		b.SetColour(255, 255, 0)
		
		b = New Button("Reset Timer", 330, 10, 100, 20)
		b.SetColour(255, 0, 255)
		
		b = New Button("Stop Timer", 440, 10, 100, 20)
		b.SetColour(0, 255, 255)
		
		b = New Button("Resume Timer", 550, 10, 100, 20)
		b.SetColour(0, 255, 0)
		
		b = New Button("Slower", 440, 40, 100, 20)
		b.SetColour(100, 100, 100)
		
		b = New Button("Faster", 550, 40, 100, 20)
		b.SetColour(0, 0, 255)
		
		b = New Button("Tween On/Off", 220, 40, 100, 20)
		b.SetColour(25, 255, 25)
	End
	
	Method OnUpdate:Int()
		' simple delta timing
		currentMillisecs = Millisecs()
		timeElapsed = currentMillisecs - lastMillisecs 
		lastMillisecs = currentMillisecs

		hero.Update(heroAnimName, loopType, timeElapsed)
		monster.Update(monsterAnimName, loopType, timeElapsed)
		
		Controls()
		Return 0
	End	
	
	Method OnRender:Int()
		Cls
		
		monster.Draw(x, y, tween)
		hero.Draw(x-100, y, tween)
		
		Button.DrawAll()
		DrawDebug()
		Return 0
	End
	
	Method Controls:Void()
		Button.UpdateAll()
		If Button.Clicked("Stop Timer") Then
			monster.timer.Stop()
			hero.timer.Stop()
		End
		If Button.Clicked("Resume Timer") Then
			monster.timer.Resume()
			hero.timer.Resume()
		End
		If Button.Clicked("Reset Timer") Then
			monster.timer.Start()
			hero.timer.Start()
			monster.mainlineKeyId = 0
			hero.mainlineKeyId = 0
		End
		If Button.Clicked("Faster") Then
			hero.timer.rate/=1.1
			monster.timer.rate/=1.1
		End
		If Button.Clicked("Slower") Then
			hero.timer.rate*=1.1
			monster.timer.rate*=1.1
		End
		If Button.Clicked("Anim 1") Then
			monsterAnimName = IDLE
			heroAnimName = IDLEH
			monster.mainlineKeyId = 0
			monster.timer.Start()
			hero.mainlineKeyId = 0
			hero.timer.Start()
		End
		If Button.Clicked("Anim 2") Then
			monsterAnimName = POSTURE
			heroAnimName = WALK
			monster.mainlineKeyId = 0
			monster.timer.Start()
			hero.mainlineKeyId = 0
			hero.timer.Start()
		End
		If Button.Clicked("Tween On/Off") Then
			tween = Not tween
		End
		If Button.Clicked("Loop Type") Then
			monster.timer.Start()
			hero.timer.Start()
			monster.mainlineKeyId = 0
			hero.mainlineKeyId = 0
			loopType += 1
			If loopType > 2 loopType = 0
		End
		
		If KeyDown(KEY_W) y-=2
		If KeyDown(KEY_S) y+=2
		If KeyDown(KEY_A) x-=2
		If KeyDown(KEY_D) x+=2
	End
	
	Method DrawDebug:Void()
		Local y:Int = 100
		Local gap:Int = 15
		DrawText("MONKEY SPRITER IMPORTER", 10, y)
		y+=gap
		y+=gap
		DrawText("Monster Timer = " + monster.timer.GetTime(), 10, y)
		y+=gap
		DrawText("Hero Timer    = " + hero.timer.GetTime(), 10, y)
		y+=gap
		DrawText("Time Elapsed  = " + timeElapsed, 10, y)
		y+=gap
		Local loopString:String
		Select loopType
			Case 0
				loopString = "FALSE"
			Case 1
				loopString = "TRUE"
			Case 2
				loopString = "PING PONG"
		End
		DrawText("Looping Type  = " + loopString, 10, y)
		y+=gap
		DrawText("Timer Speed   = " + monster.timer.rate, 10, y)
		y+=gap
		If tween
			DrawText("Tweening      = TRUE", 10, y)
		Else
			DrawText("Tweening      = FALSE", 10, y)
		End
		y+=gap
	End
End
'-------------------------- Simple Button --------------------------
Class Button
	Field x:Int, y:Int
	Field w:Int, h:Int
	Field label:String
	Field name:String
	Field r:Int = 255, g:Int = 255, b:Int = 255
	Field mouseOver:Bool = False
	Field clicked:Bool = False
	Global clickedName:String = ""
	Global list:List<Button>
	
	Method New(label:String, x:Int, y:Int, w:Int, h:Int)
		If list = Null Then list = New List<Button>
		Self.label = label
		Self.name = label.ToUpper()
		Self.x = x
		Self.y = y
		Self.w = w
		Self.h = h
		
		list.AddLast(Self)
	End
	
	Method SetColour:Void(r:Int, g:Int, b:Int)
		Self.r = r
		Self.g = g
		Self.b = b
	End
	
	Method Update:Void()
		If RectsOverlap(MouseX(), MouseY(), 3, 3, Self.x, Self.y, Self.w, Self.h)
			mouseOver = True
			If MouseHit(MOUSE_LEFT)
				If Not clicked
					clicked = True
				End
			Else
				clicked = False
			End
		Else
			clicked = False
			mouseOver = False
		End
	End
	
	Method Draw:Void()
		Local light:Int = -25
		If mouseOver
			light = 120
		End
		SetColor (r + light, g + light, b + light)
		DrawRect (x, y, w, h)
		SetColor (255, 255, 255)
		DrawText (label, x + 2, y + 2)
	End
	
	Function DrawAll:Void()
		For Local b:Button = Eachin list
			b.Draw()
		End
	End
	
	Function Clicked:Int(name:String)
		name = name.ToUpper()
		If name = clickedName
			clickedName = ""
			Return 1		
		Else
			Return 0
		End
	End
	
	Function UpdateAll:Void()
		clickedName = ""
		For Local b:Button = Eachin list
			b.Update()
			If b.clicked Then clickedName = b.name
		End
	End
End

Function RectsOverlap:Int(x0:Float, y0:Float, w0:Float, h0:Float, x2:Float, y2:Float, w2:Float, h2:Float)
	If x0 > (x2 + w2) Or (x0 + w0) < x2 Then Return False
	If y0 > (y2 + h2) Or (y0 + h0) < y2 Then Return False
	Return True
End

'-------------------------- Monkey Spriter Code --------------------------
Class MonkeySpriter
	Field textures:TextureProvider = New TextureProvider()
	Field folders:IntMap<SpriterFolder>
	Field entities:IntMap<SpriterEntity>
	Field mainPath:String
	Field animationName:String
	Field nextKeyTime:Int
	Field mainlineKeyId:Int
	Field timer:Timer
	Const LOOPING_FALSE:Int = 0
	Const LOOPING_TRUE:Int = 1
	Const LOOPING_PING_PONG:Int = 2
	
	Method New()
		Self.folders = New IntMap<SpriterFolder>
		Self.entities = New IntMap<SpriterEntity>
		mainlineKeyId = 0
		timer = New Timer
	End

	Method Update:Void(animationName:String, looping:Int = LOOPING_TRUE, timeElapsed:Int)
		Self.animationName = animationName
		If Not timer.stopped
			timer.Update(timeElapsed)
			Local animation:SpriterAnimation = entities.Get(0).animations.Get(animationName)
			If looping <> "" Then
				animation.looping = looping
			End
			Local mainline:SpriterMainline = animation.mainline
			If timer.GetTime() >= animation.length
				If animation.looping = LOOPING_TRUE
					timer.Reset()
				Else If animation.looping = LOOPING_PING_PONG
					timer.direction = timer.DOWN
				Else If animation.looping = LOOPING_FALSE
					timer.Stop()
				End
			End
			If animation.looping = LOOPING_PING_PONG And timer.GetTime() <= 0
				timer.direction = timer.UP
				timer.Reset()
			End
		End		
	End
	
	Method Draw:Void(offsetX:Float, offsetY:Float, tween:Bool = False)
		Local anim:SpriterAnimation = entities.Get(0).animations.Get(animationName)
		Local mainline:SpriterMainline = anim.mainline
		
		Local time:Float = timer.GetTime()
		mainlineKeyId = mainline.GetKeyViaTime(time).id
		Local mainlineKey:SpriterKey = mainline.keys.Get(mainlineKeyId)

		For Local i:Int = Eachin mainlineKey.objectRefs.Keys()
			Local objRef:SpriterObjectRef = mainlineKey.objectRefs.Get(i)
			Local timeline:SpriterTimeline = anim.timelines.Get(objRef.timeline)
			Local timelineKey:SpriterKey = timeline.GetKeyViaTime(time)
			Local nextTimelineKey:SpriterKey = timeline.keys.Get(objRef.key + 1)
			Local nextKeyTime:Int
			
			If nextTimelineKey = Null Then
				If anim.looping = LOOPING_TRUE
					nextTimelineKey = timeline.keys.Get(0)
					nextKeyTime = anim.length
					' next timeline might not start at the beginning of the animation
					If nextTimelineKey.time > 0 Then
						nextKeyTime += nextTimelineKey.time
					End
				Else If anim.looping = LOOPING_PING_PONG
					If timer.direction = timer.UP
						nextKeyTime = anim.length
					Else
						nextKeyTime = 0
					End
					nextTimelineKey = timelineKey
				Else If anim.looping = LOOPING_FALSE
					nextTimelineKey = timelineKey
					nextKeyTime = anim.length	
				End
			Else
				nextKeyTime = nextTimelineKey.time
			End
			
			Local nextO:SpriterObject = nextTimelineKey.objects.Last()

			For Local o:SpriterObject = Eachin timelineKey.objects
				Local folder:SpriterFolder = Self.folders.Get(o.folder)
				Local file:SpriterFile = folder.files.Get(o.file)
				Local texture:Image = textures.GetTexture(Self.mainPath + "/" + file.name.ToUpper())
				Local px:Float = o.pivotX * texture.Width()
				Local py:Float = texture.Height() + (-o.pivotY * texture.Height())
				If o.pivotY = 0 Then py = 0
				If o.pivotX = 0 Then px = 0
				texture.SetHandle(px, py)
				If tween
					Local tweenedX:Float = LinearInterpolation(o.x, nextO.x, timelineKey.time, nextKeyTime, timer.GetTime())
					Local tweenedY:Float = LinearInterpolation(o.y, nextO.y, timelineKey.time, nextKeyTime, timer.GetTime())
					Local tweenedAngle:Float = AngleLinearInterpolation(o.angle, nextO.angle, timelineKey.time, nextKeyTime, timer.GetTime())
					Local tweenedScaleX:Float = LinearInterpolation(o.scaleX, nextO.scaleX, timelineKey.time, nextKeyTime, timer.GetTime())
					Local tweenedScaleY:Float = LinearInterpolation(o.scaleY, nextO.scaleY, timelineKey.time, nextKeyTime, timer.GetTime())
					Local tweenedAlpha:Float = LinearInterpolation(o.alpha, nextO.alpha, timelineKey.time, nextKeyTime, timer.GetTime())
					SetAlpha(tweenedAlpha)
					DrawImage(texture, tweenedX + offsetX, -tweenedY + offsetY, tweenedAngle, tweenedScaleX, tweenedScaleY, 0)
				Else
					SetAlpha(o.alpha)
					DrawImage(texture, o.x + offsetX, -o.y + offsetY, o.angle, o.scaleX, o.scaleY, 0)
				End
			Next
			SetAlpha(1)
		Next
	End
	
	Method LinearInterpolation:Float(a:Float, b:Float, timeA:Float, timeB:Float, currentTime:Float)
		Return a + ((b - a) * ((currentTime - timeA) / (timeB - timeA)))
	End
	
	Method AngleLinearInterpolation:Float(a:Float, b:Float, timeA:Float, timeB:Float, currentTime:Float)
		return a + (AngleDifference(b, a) * ((currentTime - timeA) / (timeB - timeA)))
	End
	
	Method AngleDifference:Float(a:Float, b:Float)
		Return ((((a - b) Mod 360) + 540) Mod 360) - 180
	End
End

Class SpriterFolder
	Field files:IntMap<SpriterFile>
	Field id:Int
	Field name:String
	
	Method New()
		Self.files = New IntMap<SpriterFile>
	End
End

Class SpriterFile
	Field id:Int
	Field name:String
	Field width:Int
	Field height:Int
End

Class SpriterEntity
	Field id:Int
	Field name:String
	Field animations:StringMap<SpriterAnimation>
	
	Method New()
		Self.animations = New StringMap<SpriterAnimation>
	End
End

Class SpriterAnimation
	Field id:Int
	Field name:String
	Field length:Int
	Field looping:Int
	Field mainline:SpriterMainline
	Field timelines:IntMap<SpriterTimeline>
	Field maxKey:Int
	
	Method New()
		Self.mainline = New SpriterMainline
		Self.timelines = New IntMap<SpriterTimeline>
	End
End

Class SpriterMainline
	Field keys:IntMap<SpriterKey>
	Field keyId:Int = 0
	Field delay:Float = 0
	Field maxDelay:Int = 5
	Field speed:Float = 1.5
	Field maxKey:Int
		
	Method New()
		Self.keys = New IntMap<SpriterKey>
	End
		
	Method GetKey:SpriterKey(timer:Timer)
		Local rv:SpriterKey = Self.keys.Get(0)
		For Local i:Int = Eachin Self.keys.Keys()
			Local key:SpriterKey = Self.keys.Get(i)
			If key.time > timer.GetTime()
				Return rv
			End
			rv = key
		Next
		Return rv
	End
	
	Method GetKeyViaTime:SpriterKey(time:Float)
		Local rv:SpriterKey = Self.keys.Get(0)
		For Local i:Int = Eachin Self.keys.Keys()
			Local key:SpriterKey = Self.keys.Get(i)
			If key.time > time
				Return rv
			End
			rv = key
		Next
		Return rv
	End

End

Class SpriterKey
	Field id:Int
	Field time:Int
	Field spin:Int
	Field objectRefs:IntMap<SpriterObjectRef>
	Field objects:List<SpriterObject>
	
	Method New()
		Self.objectRefs = New IntMap<SpriterObjectRef>
		Self.objects = New List<SpriterObject>
	End
End

Class SpriterObjectRef
	Field id:Int
	Field timeline:Int
	Field key:Int
	Field zIndex:Int
End

Class SpriterTimeline
	Field id:Int
	Field keys:IntMap<SpriterKey>
	Field keyId:Int = 0
	Field delay:Float = 0
	Field maxDelay:Int = 5
	Field speed:Float = 1.5
	Field maxKey:Int
	
	Method New()
		Self.keys = New IntMap<SpriterKey>
	End
	
	Method GetKey:SpriterKey(timer:Timer)
		Local rv:SpriterKey = Self.keys.Get(0)
		For Local i:Int = Eachin Self.keys.Keys()
			Local key:SpriterKey = Self.keys.Get(i)
			If key.time > timer.GetTime()
				Return rv
			End
			rv = key
		Next
		Return rv
	End
	
	Method GetKeyViaTime:SpriterKey(time:Float)
		Local rv:SpriterKey = Self.keys.Get(0)
		For Local i:Int = Eachin Self.keys.Keys()
			Local key:SpriterKey = Self.keys.Get(i)
			If key.time > time
				Return rv
			End
			rv = key
		Next
		Return rv
	End

End

Class SpriterObject
	Field folder:Int
	Field file:Int
	Field x:Float
	Field y:Float
	Field pivotX:Float
	Field pivotY:Float
	Field angle:Float
	Field scaleX:Float
	Field scaleY:Float
	Field alpha:Float
End

Class SpriterImporter
	Function ImportFile:MonkeySpriter(path:String, file:String, debug:Bool = False)
		If debug Then Print "Importing " + path + "/" + file

		Local str:String = LoadString(path + "/" + file)
		If str = "" Then Error "Error loading file..."
		
		Local xmlReader:XMLParser = New XMLParser		
		Local doc:XMLDocument = xmlReader.ParseString(str)
		Local rootElement:XMLElement = doc.Root

		Local smo:MonkeySpriter = New MonkeySpriter()
		smo.mainPath = path
		For Local folderElement:XMLElement = Eachin rootElement.GetChildrenByName("folder")
			Local folder:SpriterFolder = New SpriterFolder()
			folder.id = Int(folderElement.GetAttribute("id"))
			folder.name = folderElement.GetAttribute("name")
			If debug Print "folder = " + folder.id + " " + folder.name
			
			For Local fileElement:XMLElement = Eachin folderElement.GetChildrenByName("file")
				Local file:SpriterFile = New SpriterFile()
				file.id = Int(fileElement.GetAttribute("id"))
				file.name = fileElement.GetAttribute("name")
				file.width = Int(fileElement.GetAttribute("width"))
				file.height = Int(fileElement.GetAttribute("height"))
				
				If debug Print "file = " + file.id + " " + file.name
				smo.textures.Load(path + "/" + file.name)
				
				folder.files.Add(file.id, file)
			Next
			smo.folders.Add(folder.id, folder)
		Next
		
		For Local entityElement:XMLElement = Eachin rootElement.GetChildrenByName("entity")
			Local entity:SpriterEntity = New SpriterEntity()
			Local id:String = entityElement.GetAttribute("id")
			Local name:String = entityElement.GetAttribute("name")
			
			If debug Print "entity = " + id + " " + name
			For Local animationElement:XMLElement = Eachin entityElement.GetChildrenByName("animation")
				Local animation:SpriterAnimation = New SpriterAnimation()
				animation.id  = Int(animationElement.GetAttribute("id"))
				animation.name = animationElement.GetAttribute("name")
				animation.length = Int(animationElement.GetAttribute("length"))
				Local looping:String = animationElement.GetAttribute("looping", MonkeySpriter.LOOPING_FALSE)
				Select looping
					Case "true"
						animation.looping = MonkeySpriter.LOOPING_TRUE
					Case "false"
						animation.looping = MonkeySpriter.LOOPING_FALSE
					Case "ping_pong"
						animation.looping = MonkeySpriter.LOOPING_PING_PONG
				End

				If debug Print "animation = " + animation.id + " " + animation.name
				
				' Should only be one mainline element
				For Local mainlineElement:XMLElement = Eachin animationElement.GetChildrenByName("mainline")
					For Local keyElement:XMLElement = Eachin mainlineElement.GetChildrenByName("key")
						Local skey:SpriterKey = New SpriterKey()
						skey.id = Int(keyElement.GetAttribute("id"))
						skey.time= Int(keyElement.GetAttribute("time", "0"))
						If debug Print "key = " + skey.id + " " + skey.time

						For Local objectRefElement:XMLElement = Eachin keyElement.GetChildrenByName("object_ref")
							Local objectRef:SpriterObjectRef = New SpriterObjectRef
							objectRef.id = Int(objectRefElement.GetAttribute("id"))
							objectRef.timeline = Int(objectRefElement.GetAttribute("timeline"))
							objectRef.key = Int(objectRefElement.GetAttribute("key"))
							objectRef.zIndex = Int(objectRefElement.GetAttribute("z_index"))
							If debug Print "object_ref = " + objectRef.id + " " + objectRef.timeline
							
							skey.objectRefs.Add(objectRef.id, objectRef)
						Next
						animation.mainline.keys.Add(skey.id, skey)
						animation.maxKey = skey.id
					Next	
				Next
				
				For Local timelineElement:XMLElement = Eachin animationElement.GetChildrenByName("timeline")
					Local timeline:SpriterTimeline = New SpriterTimeline()
					timeline.id = Int(timelineElement.GetAttribute("id"))
					If debug Print "timeline = " + timeline.id
					
					For Local keyElement:XMLElement = Eachin timelineElement.GetChildrenByName("key")
						Local key:SpriterKey = New SpriterKey()
						key.id = Int(keyElement.GetAttribute("id"))
						key.time = Int(keyElement.GetAttribute("time", "0"))
						key.spin = Int(keyElement.GetAttribute("spin", "1"))
						If debug Print "key = " + key.id + " " + key.time + " " + key.spin
						
						For Local objectElement:XMLElement = Eachin keyElement.GetChildrenByName("object")						
							Local o:SpriterObject = New SpriterObject()
							o.folder = Int(objectElement.GetAttribute("folder"))
							o.file = Int(objectElement.GetAttribute("file"))
							o.x = Float(objectElement.GetAttribute("x", "0"))
							o.y = Float(objectElement.GetAttribute("y", "0"))
							o.pivotX = Float(objectElement.GetAttribute("pivot_x", "0"))
							o.pivotY = Float(objectElement.GetAttribute("pivot_y", "0"))
							o.angle = Float(objectElement.GetAttribute("angle", "0"))
							o.scaleX = Float(objectElement.GetAttribute("scale_x", "1"))
							o.scaleY = Float(objectElement.GetAttribute("scale_y", "1"))
							o.alpha = Float(objectElement.GetAttribute("a", "1"))
							
							If debug Print "object = " + o.folder + " " + o.file + " " + o.angle
														
							key.objects.AddLast(o)
						Next
						timeline.keys.Add(key.id, key)
					Next
					animation.timelines.Add(timeline.id, timeline)
				Next
				entity.animations.Add(animation.name, animation)
			Next
			smo.entities.Add(entity.id, entity)
		Next
		Return smo
	End
End

Class TextureProvider Extends StringMap<Image>
	Method Load:Image(name:String)
		Local storeKey:String = name.ToUpper()

		Local i:Image = New Image
		Local imgName:String = name

		i = LoadImage(imgName )', 1, flags)
		If i = Null
			Error "Error loading image "+name
		End
		'Print "storing "+storeKey
		Self.Set(storeKey, i)
		Return i
	End
	
	Method DisplayAllStored:Void()
		' debug: print all keys in the map
		For Local key:String = Eachin Self.Keys()
			Print key + " is stored in the map."
		Next
	End
	
	Method GetTexture:Image(name:String)
		name = name.ToUpper()
	   	
		Local i:Image= Self.Get(name)
		If i = Null Then Error("Image '" + name + "' not found in the TextureProvider")
		Return i
	End	
End

Class Timer
	Field stopped:Bool
	Field rate:Float
	Const UP:Int = 1
	Const DOWN:Int = -1
	Field direction:Int
	Field count:Float
	
	Method New()
		stopped = True
		rate = 1
		direction = UP
	End
	
	Method Start:Void()
		Reset()
		Resume()
		rate = 1
	End
	
	Method Stop:Void()
		If Not stopped
			stopped = True
		End
	End
	
	Method Resume:Void()
		If stopped
			stopped = False
		End
	End
	
	Method Reset:Void()
		count = 0
		direction = UP
	End
	
	Method GetTime:Float()
		Return count / rate
	End

	Method Update:Void(timeElapsed:Int)
		If direction = UP
			count+=timeElapsed
		Else
			count-=timeElapsed
		End
	End
End

Paul - Taiphoz

(Posted 2013) [#35]

Thats looking really good if you can really get this nailed down and into diddy it will probably make me buy that spriter tool.

therevills

(Posted 2013) [#36]

SLotman over on bb.com suggested adding support for scaling and flipping, so after head banging at my desk and bugging Samah, it now works.

http://www.therevillsgames.com/monkey/SpriterA4/MonkeyGame.html

#TEXT_FILES="*.txt|*.xml|*.json|*.SCML|*.scml"
Strict
Import mojo
Import diddy.xml

Function Main:Int()
	New Game()
	Return 0
End

'-------------------------- Monkey Spriter Demo --------------------------
Class Game Extends App
	
	Field monster:MonkeySpriter
	Field hero:MonkeySpriter

	Const IDLE:String = "Idle"
	Const POSTURE:String = "Posture"
	Field monsterAnimName:String = IDLE
	
	Const IDLEH:String = "idle_healthy"
	Const WALK:String = "walk"
	Field heroAnimName:String = IDLEH

	Field x:Float, y:Float
	Field flipX:Bool
	Field flipY:Bool
	Field lastMillisecs:Int
	Field currentMillisecs:Int 
	Field timeElapsed:Int
	Field tween:Bool = True
	Field loopType:Int
	Field scaleX:Float = 1
	Field scaleY:Float = 1
	Field debug:Bool
	
	Method OnCreate:Int()
		monster = SpriterImporter.ImportFile("monster", "Example.SCML")
		hero = SpriterImporter.ImportFile("example hero", "BetaFormatHero.SCML")
		x = DeviceWidth() / 2
		y = DeviceHeight() - 20
		monster.timer.Start()
		hero.timer.Start()		
		SetUpdateRate(60)
		lastMillisecs = Millisecs()
		loopType = MonkeySpriter.LOOPING_TRUE
		debug = false
		CreateGUI()
		Return 0
	End
	
	Method CreateGUI:Void()
		Local b:Button = New Button("Anim 1", 0, 10, 100, 20)
		b.SetColour(255, 0, 0)
		b = New Button("Anim 2", 110, 10, 100, 20)

		b = New Button("Loop Type", 220, 10, 100, 20)
		b.SetColour(255, 255, 0)
		
		b = New Button("Reset Timer", 330, 10, 100, 20)
		b.SetColour(255, 0, 255)
		
		b = New Button("Stop Timer", 440, 10, 100, 20)
		b.SetColour(0, 255, 255)
		
		b = New Button("Resume Timer", 550, 10, 100, 20)
		b.SetColour(0, 255, 0)
		
		b = New Button("Slower", 440, 40, 100, 20)
		b.SetColour(100, 100, 100)
		
		b = New Button("Faster", 550, 40, 100, 20)
		b.SetColour(0, 0, 255)
		
		b = New Button("Tween On/Off", 330, 40, 100, 20)
		b.SetColour(25, 255, 25)

		b = New Button("Flip X", 0, 70, 100, 20)
		b.SetColour(25, 255, 125)	

		b = New Button("Flip Y", 110, 70, 100, 20)
		b.SetColour(123, 123, 255)	

		b = New Button("Scale Up", 0, 40, 100, 20)
		b.SetColour(255, 33, 125)	
		
		b = New Button("Scale Down", 110, 40, 100, 20)
		b.SetColour(125, 0, 125)
		
		b = New Button("Debug On/Off", 220, 40, 100, 20)
		b.SetColour(125, 230, 234)	
	End
	
	Method OnUpdate:Int()
		' simple delta timing
		currentMillisecs = Millisecs()
		timeElapsed = currentMillisecs - lastMillisecs 
		lastMillisecs = currentMillisecs

		hero.Update(heroAnimName, loopType, timeElapsed)
		monster.Update(monsterAnimName, loopType, timeElapsed)
		
		Controls()
		Return 0
	End	
	
	Method OnRender:Int()
		Cls
		monster.Draw(x, y, tween, scaleX, scaleY)
		hero.Draw(x-200, y, tween, scaleX, scaleY)
	
		Button.DrawAll()
		If debug Then DrawDebug()
		Return 0
	End
	
	Method Controls:Void()
		Button.UpdateAll()
		If Button.Clicked("Debug On/Off") Then
			debug = Not debug
		End
		If Button.Clicked("Scale Up") Then
			scaleX *= 1.1
			scaleY *= 1.1
		End
		If Button.Clicked("Scale Down") Then
			scaleX /= 1.1
			scaleY /= 1.1
		End
		If Button.Clicked("Flip X") Then
			scaleX = -scaleX
		End
		If Button.Clicked("Flip Y") Then
			scaleY = -scaleY
			y = DeviceHeight() - y
		End
		If Button.Clicked("Stop Timer") Then
			monster.timer.Stop()
			hero.timer.Stop()
		End
		If Button.Clicked("Resume Timer") Then
			monster.timer.Resume()
			hero.timer.Resume()
		End
		If Button.Clicked("Reset Timer") Then
			monster.timer.Start()
			hero.timer.Start()
			monster.mainlineKeyId = 0
			hero.mainlineKeyId = 0
		End
		If Button.Clicked("Faster") Then
			hero.timer.rate/=1.1
			monster.timer.rate/=1.1
		End
		If Button.Clicked("Slower") Then
			hero.timer.rate*=1.1
			monster.timer.rate*=1.1
		End
		If Button.Clicked("Anim 1") Then
			monsterAnimName = IDLE
			heroAnimName = IDLEH
			monster.mainlineKeyId = 0
			monster.timer.Start()
			hero.mainlineKeyId = 0
			hero.timer.Start()
		End
		If Button.Clicked("Anim 2") Then
			monsterAnimName = POSTURE
			heroAnimName = WALK
			monster.mainlineKeyId = 0
			monster.timer.Start()
			hero.mainlineKeyId = 0
			hero.timer.Start()
		End
		If Button.Clicked("Tween On/Off") Then
			tween = Not tween
		End
		If Button.Clicked("Loop Type") Then
			monster.timer.Start()
			hero.timer.Start()
			monster.mainlineKeyId = 0
			hero.mainlineKeyId = 0
			loopType += 1
			If loopType > 2 loopType = 0
		End
		
		If KeyDown(KEY_W) y-=2
		If KeyDown(KEY_S) y+=2
		If KeyDown(KEY_A) x-=2
		If KeyDown(KEY_D) x+=2
	End
	
	Method DrawDebug:Void()
		Local y:Int = 100
		Local gap:Int = 15
		SetAlpha(0.75)
		DrawText("MONKEY SPRITER IMPORTER", 10, y)
		y+=gap
		y+=gap
		DrawText("Monster Timer = " + monster.timer.GetTime(), 10, y)
		y+=gap
		DrawText("Hero Timer    = " + hero.timer.GetTime(), 10, y)
		y+=gap
		DrawText("Time Elapsed  = " + timeElapsed, 10, y)
		y+=gap
		Local loopString:String
		Select loopType
			Case 0
				loopString = "FALSE"
			Case 1
				loopString = "TRUE"
			Case 2
				loopString = "PING PONG"
		End
		DrawText("Looping Type  = " + loopString, 10, y)
		y+=gap
		DrawText("Timer Rate    = " + monster.timer.rate, 10, y)
		y+=gap
		If tween
			DrawText("Tweening      = TRUE", 10, y)
		Else
			DrawText("Tweening      = FALSE", 10, y)
		End
		y+=gap
		DrawText("Scale X       = " + scaleX, 10, y)
		y+=gap
		DrawText("Scale Y       = " + scaleY, 10, y)

		SetAlpha(1)
	End
End
'-------------------------- Simple Button --------------------------
Class Button
	Field x:Int, y:Int
	Field w:Int, h:Int
	Field label:String
	Field name:String
	Field r:Int = 255, g:Int = 255, b:Int = 255
	Field mouseOver:Bool = False
	Field clicked:Bool = False
	Global clickedName:String = ""
	Global list:List<Button>
	
	Method New(label:String, x:Int, y:Int, w:Int, h:Int)
		If list = Null Then list = New List<Button>
		Self.label = label
		Self.name = label.ToUpper()
		Self.x = x
		Self.y = y
		Self.w = w
		Self.h = h
		
		list.AddLast(Self)
	End
	
	Method SetColour:Void(r:Int, g:Int, b:Int)
		Self.r = r
		Self.g = g
		Self.b = b
	End
	
	Method Update:Void()
		If RectsOverlap(MouseX(), MouseY(), 3, 3, Self.x, Self.y, Self.w, Self.h)
			mouseOver = True
			If MouseHit(MOUSE_LEFT)
				If Not clicked
					clicked = True
				End
			Else
				clicked = False
			End
		Else
			clicked = False
			mouseOver = False
		End
	End
	
	Method Draw:Void()
		Local light:Int = -25
		If mouseOver
			light = 120
			SetAlpha(1)
		End
		SetColor (r + light, g + light, b + light)
		DrawRect (x, y, w, h)
		SetColor (255, 255, 255)
		DrawText (label, x + 2, y + 2)
	End
	
	Function DrawAll:Void()
		For Local b:Button = Eachin list
			SetAlpha(0.75)
			b.Draw()
		End
		SetAlpha(1)		
	End
	
	Function Clicked:Int(name:String)
		name = name.ToUpper()
		If name = clickedName
			clickedName = ""
			Return 1		
		Else
			Return 0
		End
	End
	
	Function UpdateAll:Void()
		clickedName = ""
		For Local b:Button = Eachin list
			b.Update()
			If b.clicked Then clickedName = b.name
		End
	End
End

Function RectsOverlap:Int(x0:Float, y0:Float, w0:Float, h0:Float, x2:Float, y2:Float, w2:Float, h2:Float)
	If x0 > (x2 + w2) Or (x0 + w0) < x2 Then Return False
	If y0 > (y2 + h2) Or (y0 + h0) < y2 Then Return False
	Return True
End

'-------------------------- Monkey Spriter Code --------------------------
Class MonkeySpriter
	Field textures:TextureProvider = New TextureProvider()
	Field folders:IntMap<SpriterFolder>
	Field entities:IntMap<SpriterEntity>
	Field mainPath:String
	Field animationName:String
	Field nextKeyTime:Int
	Field mainlineKeyId:Int
	Field timer:Timer
	Const LOOPING_FALSE:Int = 0
	Const LOOPING_TRUE:Int = 1
	Const LOOPING_PING_PONG:Int = 2
	
	Method New()
		Self.folders = New IntMap<SpriterFolder>
		Self.entities = New IntMap<SpriterEntity>
		mainlineKeyId = 0
		timer = New Timer
	End

	Method Update:Void(animationName:String, looping:Int = LOOPING_TRUE, timeElapsed:Int)
		Self.animationName = animationName
		If Not timer.stopped
			timer.Update(timeElapsed)
			Local animation:SpriterAnimation = entities.Get(0).animations.Get(animationName)
			If looping <> "" Then
				animation.looping = looping
			End
			Local mainline:SpriterMainline = animation.mainline
			If timer.GetTime() >= animation.length
				If animation.looping = LOOPING_TRUE
					timer.Reset()
				Else If animation.looping = LOOPING_PING_PONG
					timer.direction = timer.DOWN
				Else If animation.looping = LOOPING_FALSE
					timer.Stop()
				End
			End
			If animation.looping = LOOPING_PING_PONG And timer.GetTime() <= 0
				timer.direction = timer.UP
				timer.Reset()
			End
		End		
	End
	
	Method Draw:Void(offsetX:Float, offsetY:Float, tween:Bool = False, scaleX:Float = 1, scaleY:Float = 1)
		Local anim:SpriterAnimation = entities.Get(0).animations.Get(animationName)
		If anim = Null Return
		Local mainline:SpriterMainline = anim.mainline
		
		Local time:Float = timer.GetTime()
		mainlineKeyId = mainline.GetKeyViaTime(time).id
		Local mainlineKey:SpriterKey = mainline.keys.Get(mainlineKeyId)

		For Local i:Int = Eachin mainlineKey.objectRefs.Keys()
			Local objRef:SpriterObjectRef = mainlineKey.objectRefs.Get(i)
			Local timeline:SpriterTimeline = anim.timelines.Get(objRef.timeline)
			Local timelineKey:SpriterKey = timeline.GetKeyViaTime(time)
			Local nextTimelineKey:SpriterKey = timeline.keys.Get(objRef.key + 1)
			Local nextKeyTime:Int
			
			If nextTimelineKey = Null Then
				If anim.looping = LOOPING_TRUE
					nextTimelineKey = timeline.keys.Get(0)
					nextKeyTime = anim.length
					' next timeline might not start at the beginning of the animation
					If nextTimelineKey.time > 0 Then
						nextKeyTime += nextTimelineKey.time
					End
				Else If anim.looping = LOOPING_PING_PONG
					If timer.direction = timer.UP
						nextKeyTime = anim.length
					Else
						nextKeyTime = 0
					End
					nextTimelineKey = timelineKey
				Else If anim.looping = LOOPING_FALSE
					nextTimelineKey = timelineKey
					nextKeyTime = anim.length	
				End
			Else
				nextKeyTime = nextTimelineKey.time
			End
			
			Local nextO:SpriterObject = nextTimelineKey.objects.Last()

			For Local o:SpriterObject = Eachin timelineKey.objects
				Local folder:SpriterFolder = Self.folders.Get(o.folder)
				Local file:SpriterFile = folder.files.Get(o.file)
				Local texture:Image = textures.GetTexture(Self.mainPath + "/" + file.name.ToUpper())
				Local px:Float = o.pivotX * texture.Width()
				Local py:Float = texture.Height() + (-o.pivotY * texture.Height())
				If o.pivotY = 0 Then py = 0
				If o.pivotX = 0 Then px = 0
				texture.SetHandle(px, py)
				Local currentAngle:Float = o.angle
				Local nextAngle:Float = nextO.angle

				'XOR
				If (scaleX < 0) <> (scaleY < 0) Then
					currentAngle = -currentAngle
					nextAngle = -nextAngle
				End

				If tween
					Local tweenedX:Float = LinearInterpolation(o.x, nextO.x, timelineKey.time, nextKeyTime, timer.GetTime())
					Local tweenedY:Float = LinearInterpolation(o.y, nextO.y, timelineKey.time, nextKeyTime, timer.GetTime())
					Local tweenedAngle:Float = AngleLinearInterpolation(currentAngle, nextAngle, timelineKey.time, nextKeyTime, timer.GetTime())
					Local tweenedScaleX:Float = LinearInterpolation(o.scaleX, nextO.scaleX, timelineKey.time, nextKeyTime, timer.GetTime())
					Local tweenedScaleY:Float = LinearInterpolation(o.scaleY, nextO.scaleY, timelineKey.time, nextKeyTime, timer.GetTime())
					Local tweenedAlpha:Float = LinearInterpolation(o.alpha, nextO.alpha, timelineKey.time, nextKeyTime, timer.GetTime())
					SetAlpha(tweenedAlpha)
					DrawImage(texture, tweenedX * scaleX + offsetX, -tweenedY * scaleY + offsetY, tweenedAngle, tweenedScaleX * scaleX, tweenedScaleY * scaleY, 0)
				Else
					SetAlpha(o.alpha)
					DrawImage(texture, o.x * scaleX + offsetX, -o.y * scaleY + offsetY, currentAngle, o.scaleX * scaleX, o.scaleY * scaleY, 0)
				End
			Next		
			SetAlpha(1)
		Next
	End
	
	Method LinearInterpolation:Float(a:Float, b:Float, timeA:Float, timeB:Float, currentTime:Float)
		Return a + ((b - a) * ((currentTime - timeA) / (timeB - timeA)))
	End
	
	Method AngleLinearInterpolation:Float(a:Float, b:Float, timeA:Float, timeB:Float, currentTime:Float)
		return a + (AngleDifference(b, a) * ((currentTime - timeA) / (timeB - timeA)))
	End
	
	Method AngleDifference:Float(a:Float, b:Float)
		Return ((((a - b) Mod 360) + 540) Mod 360) - 180
	End
End

Class SpriterFolder
	Field files:IntMap<SpriterFile>
	Field id:Int
	Field name:String
	
	Method New()
		Self.files = New IntMap<SpriterFile>
	End
End

Class SpriterFile
	Field id:Int
	Field name:String
	Field width:Int
	Field height:Int
End

Class SpriterEntity
	Field id:Int
	Field name:String
	Field animations:StringMap<SpriterAnimation>
	
	Method New()
		Self.animations = New StringMap<SpriterAnimation>
	End
End

Class SpriterAnimation
	Field id:Int
	Field name:String
	Field length:Int
	Field looping:Int
	Field mainline:SpriterMainline
	Field timelines:IntMap<SpriterTimeline>
	Field maxKey:Int
	
	Method New()
		Self.mainline = New SpriterMainline
		Self.timelines = New IntMap<SpriterTimeline>
	End
End

Class SpriterMainline
	Field keys:IntMap<SpriterKey>
	Field keyId:Int = 0
	Field delay:Float = 0
	Field maxDelay:Int = 5
	Field speed:Float = 1.5
	Field maxKey:Int
		
	Method New()
		Self.keys = New IntMap<SpriterKey>
	End
		
	Method GetKey:SpriterKey(timer:Timer)
		Local rv:SpriterKey = Self.keys.Get(0)
		For Local i:Int = Eachin Self.keys.Keys()
			Local key:SpriterKey = Self.keys.Get(i)
			If key.time > timer.GetTime()
				Return rv
			End
			rv = key
		Next
		Return rv
	End
	
	Method GetKeyViaTime:SpriterKey(time:Float)
		Local rv:SpriterKey = Self.keys.Get(0)
		For Local i:Int = Eachin Self.keys.Keys()
			Local key:SpriterKey = Self.keys.Get(i)
			If key.time > time
				Return rv
			End
			rv = key
		Next
		Return rv
	End

End

Class SpriterKey
	Field id:Int
	Field time:Int
	Field spin:Int
	Field objectRefs:IntMap<SpriterObjectRef>
	Field objects:List<SpriterObject>
	
	Method New()
		Self.objectRefs = New IntMap<SpriterObjectRef>
		Self.objects = New List<SpriterObject>
	End
End

Class SpriterObjectRef
	Field id:Int
	Field timeline:Int
	Field key:Int
	Field zIndex:Int
End

Class SpriterTimeline
	Field id:Int
	Field keys:IntMap<SpriterKey>
	Field keyId:Int = 0
	Field delay:Float = 0
	Field maxDelay:Int = 5
	Field speed:Float = 1.5
	Field maxKey:Int
	
	Method New()
		Self.keys = New IntMap<SpriterKey>
	End
	
	Method GetKey:SpriterKey(timer:Timer)
		Local rv:SpriterKey = Self.keys.Get(0)
		For Local i:Int = Eachin Self.keys.Keys()
			Local key:SpriterKey = Self.keys.Get(i)
			If key.time > timer.GetTime()
				Return rv
			End
			rv = key
		Next
		Return rv
	End
	
	Method GetKeyViaTime:SpriterKey(time:Float)
		Local rv:SpriterKey = Self.keys.Get(0)
		For Local i:Int = Eachin Self.keys.Keys()
			Local key:SpriterKey = Self.keys.Get(i)
			If key.time > time
				Return rv
			End
			rv = key
		Next
		Return rv
	End

End

Class SpriterObject
	Field folder:Int
	Field file:Int
	Field x:Float
	Field y:Float
	Field pivotX:Float
	Field pivotY:Float
	Field angle:Float
	Field scaleX:Float
	Field scaleY:Float
	Field alpha:Float
End

Class SpriterImporter
	Function ImportFile:MonkeySpriter(path:String, file:String, debug:Bool = False)
		If debug Then Print "Importing " + path + "/" + file

		Local str:String = LoadString(path + "/" + file)
		If str = "" Then Error "Error loading file..."
		
		Local xmlReader:XMLParser = New XMLParser		
		Local doc:XMLDocument = xmlReader.ParseString(str)
		Local rootElement:XMLElement = doc.Root

		Local smo:MonkeySpriter = New MonkeySpriter()
		smo.mainPath = path
		For Local folderElement:XMLElement = Eachin rootElement.GetChildrenByName("folder")
			Local folder:SpriterFolder = New SpriterFolder()
			folder.id = Int(folderElement.GetAttribute("id"))
			folder.name = folderElement.GetAttribute("name")
			If debug Print "folder = " + folder.id + " " + folder.name
			
			For Local fileElement:XMLElement = Eachin folderElement.GetChildrenByName("file")
				Local file:SpriterFile = New SpriterFile()
				file.id = Int(fileElement.GetAttribute("id"))
				file.name = fileElement.GetAttribute("name")
				file.width = Int(fileElement.GetAttribute("width"))
				file.height = Int(fileElement.GetAttribute("height"))
				
				If debug Print "file = " + file.id + " " + file.name
				smo.textures.Load(path + "/" + file.name)
				
				folder.files.Add(file.id, file)
			Next
			smo.folders.Add(folder.id, folder)
		Next
		
		For Local entityElement:XMLElement = Eachin rootElement.GetChildrenByName("entity")
			Local entity:SpriterEntity = New SpriterEntity()
			Local id:String = entityElement.GetAttribute("id")
			Local name:String = entityElement.GetAttribute("name")
			
			If debug Print "entity = " + id + " " + name
			For Local animationElement:XMLElement = Eachin entityElement.GetChildrenByName("animation")
				Local animation:SpriterAnimation = New SpriterAnimation()
				animation.id  = Int(animationElement.GetAttribute("id"))
				animation.name = animationElement.GetAttribute("name")
				animation.length = Int(animationElement.GetAttribute("length"))
				Local looping:String = animationElement.GetAttribute("looping", MonkeySpriter.LOOPING_FALSE)
				Select looping
					Case "true"
						animation.looping = MonkeySpriter.LOOPING_TRUE
					Case "false"
						animation.looping = MonkeySpriter.LOOPING_FALSE
					Case "ping_pong"
						animation.looping = MonkeySpriter.LOOPING_PING_PONG
				End

				If debug Print "animation = " + animation.id + " " + animation.name
				
				' Should only be one mainline element
				For Local mainlineElement:XMLElement = Eachin animationElement.GetChildrenByName("mainline")
					For Local keyElement:XMLElement = Eachin mainlineElement.GetChildrenByName("key")
						Local skey:SpriterKey = New SpriterKey()
						skey.id = Int(keyElement.GetAttribute("id"))
						skey.time= Int(keyElement.GetAttribute("time", "0"))
						If debug Print "key = " + skey.id + " " + skey.time

						For Local objectRefElement:XMLElement = Eachin keyElement.GetChildrenByName("object_ref")
							Local objectRef:SpriterObjectRef = New SpriterObjectRef
							objectRef.id = Int(objectRefElement.GetAttribute("id"))
							objectRef.timeline = Int(objectRefElement.GetAttribute("timeline"))
							objectRef.key = Int(objectRefElement.GetAttribute("key"))
							objectRef.zIndex = Int(objectRefElement.GetAttribute("z_index"))
							If debug Print "object_ref = " + objectRef.id + " " + objectRef.timeline
							
							skey.objectRefs.Add(objectRef.id, objectRef)
						Next
						animation.mainline.keys.Add(skey.id, skey)
						animation.maxKey = skey.id
					Next	
				Next
				
				For Local timelineElement:XMLElement = Eachin animationElement.GetChildrenByName("timeline")
					Local timeline:SpriterTimeline = New SpriterTimeline()
					timeline.id = Int(timelineElement.GetAttribute("id"))
					If debug Print "timeline = " + timeline.id
					
					For Local keyElement:XMLElement = Eachin timelineElement.GetChildrenByName("key")
						Local key:SpriterKey = New SpriterKey()
						key.id = Int(keyElement.GetAttribute("id"))
						key.time = Int(keyElement.GetAttribute("time", "0"))
						key.spin = Int(keyElement.GetAttribute("spin", "1"))
						If debug Print "key = " + key.id + " " + key.time + " " + key.spin
						
						For Local objectElement:XMLElement = Eachin keyElement.GetChildrenByName("object")						
							Local o:SpriterObject = New SpriterObject()
							o.folder = Int(objectElement.GetAttribute("folder"))
							o.file = Int(objectElement.GetAttribute("file"))
							o.x = Float(objectElement.GetAttribute("x", "0"))
							o.y = Float(objectElement.GetAttribute("y", "0"))
							o.pivotX = Float(objectElement.GetAttribute("pivot_x", "0"))
							o.pivotY = Float(objectElement.GetAttribute("pivot_y", "0"))
							o.angle = Float(objectElement.GetAttribute("angle", "0"))
							o.scaleX = Float(objectElement.GetAttribute("scale_x", "1"))
							o.scaleY = Float(objectElement.GetAttribute("scale_y", "1"))
							o.alpha = Float(objectElement.GetAttribute("a", "1"))
							
							If debug Print "object = " + o.folder + " " + o.file + " " + o.angle
														
							key.objects.AddLast(o)
						Next
						timeline.keys.Add(key.id, key)
					Next
					animation.timelines.Add(timeline.id, timeline)
				Next
				entity.animations.Add(animation.name, animation)
			Next
			smo.entities.Add(entity.id, entity)
		Next
		Return smo
	End
End

Class TextureProvider Extends StringMap<Image>
	Method Load:Image(name:String)
		Local storeKey:String = name.ToUpper()

		Local i:Image = New Image
		Local imgName:String = name

		i = LoadImage(imgName )', 1, flags)
		If i = Null
			Error "Error loading image "+name
		End
		'Print "storing "+storeKey
		Self.Set(storeKey, i)
		Return i
	End
	
	Method DisplayAllStored:Void()
		' debug: print all keys in the map
		For Local key:String = Eachin Self.Keys()
			Print key + " is stored in the map."
		Next
	End
	
	Method GetTexture:Image(name:String)
		name = name.ToUpper()
	   	
		Local i:Image= Self.Get(name)
		If i = Null Then Error("Image '" + name + "' not found in the TextureProvider")
		Return i
	End	
End

Class Timer
	Field stopped:Bool
	Field rate:Float
	Const UP:Int = 1
	Const DOWN:Int = -1
	Field direction:Int
	Field count:Float
	
	Method New()
		stopped = True
		rate = 1
		direction = UP
	End
	
	Method Start:Void()
		Reset()
		Resume()
		rate = 1
	End
	
	Method Stop:Void()
		If Not stopped
			stopped = True
		End
	End
	
	Method Resume:Void()
		If stopped
			stopped = False
		End
	End
	
	Method Reset:Void()
		count = 0
		direction = UP
	End
	
	Method GetTime:Float()
		Return count / rate
	End

	Method Update:Void(timeElapsed:Int)
		If direction = UP
			count+=timeElapsed
		Else
			count-=timeElapsed
		End
	End
End

rIKmAN

(Posted 2013) [#37]

Not sure if you have seen it therevills, but if you are planning on adding bones support the Admin over at BrashMonkey has posted a bone example in your Monkey thread.

Are you planning on updating this to support new Spriter features in the future?

What are the downsides to using Spriter as opposed to typical images for animation. ie. performance, memory, cpu etc.

therevills

(Posted 2013) [#38]

Yeah I saw the reply and I've changed the Importer to read in the bones... but I'm not sure how to implement it at the moment.

Are you planning on updating this to support new Spriter features in the future?

I'm getting it to a stage so I can actually use it in a game, the source is here so if I don't keep it up to date hopefully someone else will. And hopefully the Spriter team doesn't totally change the format again...

What are the downsides to using Spriter as opposed to typical images for animation. ie. performance, memory, cpu etc.

It will require more CPU time to tween and maybe more memory due to more objects per sprite... but you save on texture memory and you can quickly change an animation without redrawing all the frames again.

rIKmAN

(Posted 2013) [#39]

I didn't even realise it didn't support bones until I saw your post on their forums, I assumed that was what the demo was using.

I look forward to having bones support, once that is in I will be having a proper look at using it in a game, as from what I have seen of Spriter it makes animating possible even for a complete non-artist like me.

Any ETA on the bones support or is it just an as and when for when you progress with your project?

therevills

(Posted 2013) [#40]

I've added the importing code for the bones, but need to do the rendering... I'll be working on this for the rest of this week, but I really need to move with my main project.

rIKmAN

(Posted 2013) [#41]

Can't wait to see your progress :)

therevills

(Posted 2013) [#42]

Okay, hit a big bump yesterday... Slotman has been messing around with my code and found quite a huge bug.

In Spriter you can alter a pivot point in any of the keyframes. So for example say on key frame 1 the pivot for the head is at 20, 74 and on key frame 2 its at 24, 150, but the actual image doesn't move. The tween is between 74 and 150 forcing the head to move upwards.

I could minus the pivots off the co-ords, but only if I don't use "SetHandle":

       |Frame 1 | Frame 2
-------+--------+---------
  x    | 20     | 24
  y    | 74     | 150
pivotX | 0.617  | 0.503
pivotY | 0.157  | 0.778

Image Height = 121 pixels

Just looking at Y:
Frame 1:
pivotYPoint = 0.157 * 121 = 18.997

newY = 74 - 18.997 = 55

Frame 2:
pivotYPoint = 0.778 * 121 = 94.138

newY = 150 - 94.138 = 56

But of course now all the angles wont be rotated at the correct point.... :(

Anyone got any ideas on how to get around this?

Tibit

(Posted 2013) [#43]

Could you do your own rotation, translation, scale & pivot instead of DrawImage's using push pop matrix to mimic the Spriter behavior?

therevills

(Posted 2013) [#44]

Maybe... but I didn't really want to use matrix stuff, as I wanted to be able to convert this code quickly to BlitzMax (as this is really where I want to use it at the moment...)

therevills

(Posted 2013) [#45]

Fixed it!!!!!!!!!!!!!!!!! YAYYYYYYYYYYYY!!!!! \o/

Samah originally suggested tweening the pivots which we tried, but it didn't work... I've just revisit that idea and figured out what we did wrong:

#TEXT_FILES="*.txt|*.xml|*.json|*.SCML|*.scml"
Strict
Import mojo
Import diddy.xml

Function Main:Int()
	New Game()
	Return 0
End

'-------------------------- Monkey Spriter Demo --------------------------
Class Game Extends App
	
	Field monster:MonkeySpriter
	Field hero:MonkeySpriter
	Field bones:MonkeySpriter
	Field devil:MonkeySpriter
	
	Const IDLE:String = "Idle"
	Const POSTURE:String = "Posture"
	Field monsterAnimName:String = IDLE
	
	Const IDLEH:String = "idle_healthy"
	Const WALK:String = "walk"
	Field heroAnimName:String = IDLEH
	Field flipX:Bool
	Field flipY:Bool
	Field lastMillisecs:Int
	Field currentMillisecs:Int 
	Field timeElapsed:Int
	Field tween:Bool = True
	Field loopType:Int
	Field scaleX:Float = 1
	Field scaleY:Float = 1
	Field debug:Bool
	
	Method OnCreate:Int()
		monster = SpriterImporter.ImportFile("monster", "Example.SCML")
		hero = SpriterImporter.ImportFile("example hero", "BetaFormatHero.SCML")
		bones = SpriterImporter.ImportFile("BoneExample", "Basic_Platformer.scml")
		devil = SpriterImporter.ImportFile("bdevil1", "bdevil1.scml")
	'	devil = SpriterImporter.ImportFile("testdevil", "testdevil.scml")
		
		monster.x = DeviceWidth() / 2
		monster.y = DeviceHeight() - 20
		hero.x = DeviceWidth() / 2 - 200
		hero.y = DeviceHeight() - 20
		bones.x = DeviceWidth() / 2
		bones.y = -100' DeviceHeight() / 2
		
		devil.x = 200
		devil.y = 400
		
		devil.timer.Start()
		bones.timer.Start()
		monster.timer.Start()
		hero.timer.Start()		
		SetUpdateRate(60)
		lastMillisecs = Millisecs()
		loopType = MonkeySpriter.LOOPING_TRUE
		debug = false
		CreateGUI()
		Return 0
	End
	
	Method CreateGUI:Void()
		Local b:Button = New Button("Anim 1", 0, 10, 100, 20)
		b.SetColour(255, 0, 0)
		b = New Button("Anim 2", 110, 10, 100, 20)

		b = New Button("Loop Type", 220, 10, 100, 20)
		b.SetColour(255, 255, 0)
		
		b = New Button("Reset Timer", 330, 10, 100, 20)
		b.SetColour(255, 0, 255)
		
		b = New Button("Stop Timer", 440, 10, 100, 20)
		b.SetColour(0, 255, 255)
		
		b = New Button("Resume Timer", 550, 10, 100, 20)
		b.SetColour(0, 255, 0)
		
		b = New Button("Slower", 440, 40, 100, 20)
		b.SetColour(100, 100, 100)
		
		b = New Button("Faster", 550, 40, 100, 20)
		b.SetColour(0, 0, 255)
		
		b = New Button("Tween On/Off", 330, 40, 100, 20)
		b.SetColour(25, 255, 25)

		b = New Button("Flip X", 0, 70, 100, 20)
		b.SetColour(25, 255, 125)	

		b = New Button("Flip Y", 110, 70, 100, 20)
		b.SetColour(123, 123, 255)	

		b = New Button("Scale Up", 0, 40, 100, 20)
		b.SetColour(255, 33, 125)	
		
		b = New Button("Scale Down", 110, 40, 100, 20)
		b.SetColour(125, 0, 125)
		
		b = New Button("Debug On/Off", 220, 40, 100, 20)
		b.SetColour(125, 230, 234)	
	End
	
	Method OnUpdate:Int()
		' simple delta timing
		currentMillisecs = Millisecs()
		timeElapsed = currentMillisecs - lastMillisecs 
		lastMillisecs = currentMillisecs

		hero.Update(heroAnimName, loopType, timeElapsed)
		monster.Update(monsterAnimName, loopType, timeElapsed)
		
		bones.Update("Player_Idle", loopType, timeElapsed)
		
		devil.Update("idle", loopType, timeElapsed)
		Controls()
		Return 0
	End	
	
	Method OnRender:Int()
		Cls
		monster.Draw(tween)
		hero.Draw(tween)
		bones.Draw(tween)
		devil.Draw(tween)
		
		Button.DrawAll()
		If debug Then DrawDebug()
		Return 0
	End
	
	Method Controls:Void()
		Button.UpdateAll()
		If Button.Clicked("Debug On/Off") Then
			debug = Not debug
		End
		If Button.Clicked("Scale Up") Then
			scaleX *= 1.1
			scaleY *= 1.1
			monster.SetScale(scaleX, scaleY)
			hero.SetScale(scaleX, scaleY)
			bones.SetScale(scaleX, scaleY)
		End
		If Button.Clicked("Scale Down") Then
			scaleX /= 1.1
			scaleY /= 1.1
			monster.SetScale(scaleX, scaleY)
			hero.SetScale(scaleX, scaleY)
			bones.SetScale(scaleX, scaleY)
		End
		If Button.Clicked("Flip X") Then
			scaleX = -scaleX
			monster.SetScale(scaleX, monster.scaleY)
			hero.SetScale(scaleX, monster.scaleY)
		End
		If Button.Clicked("Flip Y") Then
			scaleY = -scaleY
			monster.SetScale(monster.scaleX, scaleY)
			hero.SetScale(hero.scaleX, scaleY)
			monster.y = DeviceHeight() - monster.y
			hero.y = DeviceHeight() - hero.y
		End
		If Button.Clicked("Stop Timer") Then
			monster.timer.Stop()
			hero.timer.Stop()
			devil.timer.Stop()
		End
		If Button.Clicked("Resume Timer") Then
			monster.timer.Resume()
			hero.timer.Resume()
			devil.timer.Resume()
		End
		If Button.Clicked("Reset Timer") Then
			monster.timer.Start()
			hero.timer.Start()
			monster.mainlineKeyId = 0
			hero.mainlineKeyId = 0
		End
		If Button.Clicked("Faster") Then
			hero.timer.rate/=1.1
			monster.timer.rate/=1.1
		End
		If Button.Clicked("Slower") Then
			hero.timer.rate*=1.1
			monster.timer.rate*=1.1
			devil.timer.rate*=1.1
		End
		If Button.Clicked("Anim 1") Then
			monsterAnimName = IDLE
			heroAnimName = IDLEH
			monster.mainlineKeyId = 0
			monster.timer.Start()
			hero.mainlineKeyId = 0
			hero.timer.Start()
		End
		If Button.Clicked("Anim 2") Then
			monsterAnimName = POSTURE
			heroAnimName = WALK
			monster.mainlineKeyId = 0
			monster.timer.Start()
			hero.mainlineKeyId = 0
			hero.timer.Start()
		End
		If Button.Clicked("Tween On/Off") Then
			tween = Not tween
		End
		If Button.Clicked("Loop Type") Then
			monster.timer.Start()
			hero.timer.Start()
			monster.mainlineKeyId = 0
			hero.mainlineKeyId = 0
			loopType += 1
			If loopType > 2 loopType = 0
		End
		
		If KeyDown(KEY_W) hero.y-=2
		If KeyDown(KEY_S) hero.y+=2
		If KeyDown(KEY_A) hero.x-=2
		If KeyDown(KEY_D) hero.x+=2
	End
	
	Method DrawDebug:Void()
		Local y:Int = 100
		Local gap:Int = 15
		SetAlpha(0.75)
		DrawText("MONKEY SPRITER IMPORTER", 10, y)
		y+=gap
		y+=gap
		DrawText("Monster Timer = " + monster.timer.GetTime(), 10, y)
		y+=gap
		DrawText("Hero Timer    = " + hero.timer.GetTime(), 10, y)
		y+=gap
		DrawText("Devil Timer   = " + devil.timer.GetTime(), 10, y)
		y+=gap
		DrawText("Time Elapsed  = " + timeElapsed, 10, y)
		y+=gap
		Local loopString:String
		Select loopType
			Case 0
				loopString = "FALSE"
			Case 1
				loopString = "TRUE"
			Case 2
				loopString = "PING PONG"
		End
		DrawText("Looping Type  = " + loopString, 10, y)
		y+=gap
		DrawText("Timer Rate    = " + monster.timer.rate, 10, y)
		y+=gap
		If tween
			DrawText("Tweening      = TRUE", 10, y)
		Else
			DrawText("Tweening      = FALSE", 10, y)
		End
		y+=gap
		DrawText("Scale X       = " + scaleX, 10, y)
		y+=gap
		DrawText("Scale Y       = " + scaleY, 10, y)

		SetAlpha(1)
	End
End
'-------------------------- Simple Button --------------------------
Class Button
	Field x:Int, y:Int
	Field w:Int, h:Int
	Field label:String
	Field name:String
	Field r:Int = 255, g:Int = 255, b:Int = 255
	Field mouseOver:Bool = False
	Field clicked:Bool = False
	Global clickedName:String = ""
	Global list:List<Button>
	
	Method New(label:String, x:Int, y:Int, w:Int, h:Int)
		If list = Null Then list = New List<Button>
		Self.label = label
		Self.name = label.ToUpper()
		Self.x = x
		Self.y = y
		Self.w = w
		Self.h = h
		
		list.AddLast(Self)
	End
	
	Method SetColour:Void(r:Int, g:Int, b:Int)
		Self.r = r
		Self.g = g
		Self.b = b
	End
	
	Method Update:Void()
		If RectsOverlap(MouseX(), MouseY(), 3, 3, Self.x, Self.y, Self.w, Self.h)
			mouseOver = True
			If MouseHit(MOUSE_LEFT)
				If Not clicked
					clicked = True
				End
			Else
				clicked = False
			End
		Else
			clicked = False
			mouseOver = False
		End
	End
	
	Method Draw:Void()
		Local light:Int = -25
		If mouseOver
			light = 120
			SetAlpha(1)
		End
		SetColor (r + light, g + light, b + light)
		DrawRect (x, y, w, h)
		SetColor (255, 255, 255)
		DrawText (label, x + 2, y + 2)
	End
	
	Function DrawAll:Void()
		For Local b:Button = Eachin list
			SetAlpha(0.75)
			b.Draw()
		End
		SetAlpha(1)		
	End
	
	Function Clicked:Int(name:String)
		name = name.ToUpper()
		If name = clickedName
			clickedName = ""
			Return 1		
		Else
			Return 0
		End
	End
	
	Function UpdateAll:Void()
		clickedName = ""
		For Local b:Button = Eachin list
			b.Update()
			If b.clicked Then clickedName = b.name
		End
	End
End

Function RectsOverlap:Int(x0:Float, y0:Float, w0:Float, h0:Float, x2:Float, y2:Float, w2:Float, h2:Float)
	If x0 > (x2 + w2) Or (x0 + w0) < x2 Then Return False
	If y0 > (y2 + h2) Or (y0 + h0) < y2 Then Return False
	Return True
End

'-------------------------- Monkey Spriter Code --------------------------
Class MonkeySpriter
	Field textures:TextureProvider = New TextureProvider()
	Field folders:IntMap<SpriterFolder>
	Field entities:IntMap<SpriterEntity>
	Field mainPath:String
	Field animationName:String
	Field nextKeyTime:Int
	Field mainlineKeyId:Int
	Field timer:Timer
	Field scaleX:Float = 1
	Field scaleY:Float = 1
	Field x:Float, y:Float
	Const LOOPING_FALSE:Int = 0
	Const LOOPING_TRUE:Int = 1
	Const LOOPING_PING_PONG:Int = 2
	
	Method New()
		Self.folders = New IntMap<SpriterFolder>
		Self.entities = New IntMap<SpriterEntity>
		mainlineKeyId = 0
		timer = New Timer
	End
	
	Method Copy:MonkeySpriter()
		Local ms:MonkeySpriter = New MonkeySpriter
		ms.textures = Self.textures
		ms.folders  = Self.folders
		ms.entities = Self.entities
		ms.mainPath = Self.mainPath
		ms.animationName = Self.animationName
		ms.nextKeyTime   = Self.nextKeyTime
		ms.mainlineKeyId = Self.mainlineKeyId
		ms.timer = New Timer
		ms.scaleX = Self.scaleX
		ms.scaleY = Self.scaleY
		ms.x = Self.x
		ms.y = Self.y
		Return ms
	End Method
	
	Method Update:Void(animationName:String, looping:Int = LOOPING_TRUE, timeElapsed:Int)
		Self.animationName = animationName
		If Not timer.stopped
			timer.Update(timeElapsed)
			Local animation:SpriterAnimation
			Try
				animation = entities.Get(0).animations.Get(animationName)
				If animation = Null Then Throw New Throwable
			Catch ex:Throwable
        		Print "Animation is null! Can not find animation " + animationName
			End
			
			If looping <> "" Then
				animation.looping = looping
			End
			Local mainline:SpriterMainline = animation.mainline
			If timer.GetTime() >= animation.length
				If animation.looping = LOOPING_TRUE
					timer.Reset()
				Else If animation.looping = LOOPING_PING_PONG
					timer.direction = timer.DOWN
				Else If animation.looping = LOOPING_FALSE
					timer.Stop()
				End
			End
			If animation.looping = LOOPING_PING_PONG And timer.GetTime() <= 0
				timer.direction = timer.UP
				timer.Reset()
			End
		End		
	End
	
	Method Draw:Void(tween:Bool = False)
		Local anim:SpriterAnimation = entities.Get(0).animations.Get(animationName)
		If anim = Null Return
		Local mainline:SpriterMainline = anim.mainline
		
		Local time:Float = timer.GetTime()
		mainlineKeyId = mainline.GetKeyViaTime(time).id
		Local mainlineKey:SpriterKey = mainline.keys.Get(mainlineKeyId)
		
		Local boneMap:IntMap<SpriterBone> = New IntMap<SpriterBone>
		For Local i:Int = Eachin mainlineKey.boneRefs.Keys()
			Local boneRef:SpriterBoneRef = mainlineKey.boneRefs.Get(i)
			Local timeline:SpriterTimeline = anim.timelines.Get(boneRef.timeline)
			Local timelineKey:SpriterKey = timeline.GetKeyViaTime(time)
			Local nextTimelineKey:SpriterKey = timeline.keys.Get(boneRef.key + 1)
			Local nextKeyTime:Int
			
			For Local b:SpriterBone = Eachin timelineKey.bones
				boneMap.Add(i, b)
			Next
		Next

		For Local i:Int = Eachin mainlineKey.objectRefs.Keys()
			Local objRef:SpriterObjectRef = mainlineKey.objectRefs.Get(i)
			Local timeline:SpriterTimeline = anim.timelines.Get(objRef.timeline)
			Local timelineKey:SpriterKey = timeline.GetKeyViaTime(time)
			Local nextTimelineKey:SpriterKey = timeline.keys.Get(objRef.key + 1)
			Local nextKeyTime:Int
			
			If nextTimelineKey = Null Then
				If anim.looping = LOOPING_TRUE
					nextTimelineKey = timeline.keys.Get(0)
					nextKeyTime = anim.length
					' next timeline might not start at the beginning of the animation
					If nextTimelineKey.time > 0 Then
						nextKeyTime += nextTimelineKey.time
					End
				Else If anim.looping = LOOPING_PING_PONG
					If timer.direction = timer.UP
						nextKeyTime = anim.length
					Else
						nextKeyTime = 0
					End
					nextTimelineKey = timelineKey
				Else If anim.looping = LOOPING_FALSE
					nextTimelineKey = timelineKey
					nextKeyTime = anim.length	
				End
			Else
				nextKeyTime = nextTimelineKey.time
			End
			
			Local nextO:SpriterObject = nextTimelineKey.objects.Last()

			Local bone:SpriterBone
			If objRef.parent > -1
			'	bone = boneMap.Get(objRef.parent)
			End

			For Local o:SpriterObject = Eachin timelineKey.objects
				Local folder:SpriterFolder = Self.folders.Get(o.folder)
				Local file:SpriterFile = folder.files.Get(o.file)
				Local texture:Image = textures.GetTexture(Self.mainPath + "/" + file.name.ToUpper())

				Local nextFolder:SpriterFolder = Self.folders.Get(nextO.folder)
				Local nextFile:SpriterFile = nextFolder.files.Get(nextO.file)
				Local nextTexture:Image = textures.GetTexture(Self.mainPath + "/" + nextFile.name.ToUpper())
			
				Local currentAngle:Float = o.angle
				Local nextAngle:Float = nextO.angle

				'XOR
				If (scaleX < 0) <> (scaleY < 0) Then
					currentAngle = -currentAngle
					nextAngle = -nextAngle
				End

				If 1=0'bone
					Local bx# = (bone.x)+ x
					Local by# = (bone.y) + y
					Local ba# = 90'bone.angle
					Local bsx# = 1'bone.scaleX' * scaleX
					Local bsy# =  1'bone.scaleY' * scaleY
					DrawImage(texture, bx, by, ba, bsx, bsy, 0)
				Else
					If tween
						Local x1# = o.x
						Local x2# = nextO.x
						Local y1# = o.y
						Local y2# = nextO.y
						
						Local tweenedPivotX:Float = LinearInterpolation(o.pivotX, nextO.pivotX, timelineKey.time, nextKeyTime, time)
						Local tweenedPivotY:Float = LinearInterpolation(o.pivotY, nextO.pivotY, timelineKey.time, nextKeyTime, time)
						
						Local tweenedX:Float = LinearInterpolation(x1, x2, timelineKey.time, nextKeyTime, time)
						Local tweenedY:Float = LinearInterpolation(y1, y2, timelineKey.time, nextKeyTime, time)
						Local tweenedAngle:Float = AngleLinearInterpolation(currentAngle, nextAngle, timelineKey.time, nextKeyTime, time)
						Local tweenedScaleX:Float = LinearInterpolation(o.scaleX, nextO.scaleX, timelineKey.time, nextKeyTime, time)
						Local tweenedScaleY:Float = LinearInterpolation(o.scaleY, nextO.scaleY, timelineKey.time, nextKeyTime, time)
						Local tweenedAlpha:Float = LinearInterpolation(o.alpha, nextO.alpha, timelineKey.time, nextKeyTime, time)

						texture.SetHandle(tweenedPivotX * texture.Width(),  nextTexture.Height() + (-tweenedPivotY * nextTexture.Height()))
						
						SetAlpha(tweenedAlpha)
						DrawImage(texture, tweenedX * scaleX + x, -tweenedY * scaleY + y, tweenedAngle, tweenedScaleX * scaleX, tweenedScaleY * scaleY, 0)
					Else
						texture.SetHandle(o.pivotX * texture.Width(),  nextTexture.Height() + (-o.pivotY * nextTexture.Height()))
						SetAlpha(o.alpha)
						DrawImage(texture, o.x * scaleX + x, -o.y * scaleY + y, currentAngle, o.scaleX * scaleX, o.scaleY * scaleY, 0)
					End
				End
			Next		
			SetAlpha(1)
			DrawText timelineKey.id +" " +nextTimelineKey.id, x, y
		Next
	End
	
	Method LinearInterpolation:Float(a:Float, b:Float, timeA:Float, timeB:Float, currentTime:Float)
		Return a + ((b - a) * ((currentTime - timeA) / (timeB - timeA)))
	End
	
	Method AngleLinearInterpolation:Float(a:Float, b:Float, timeA:Float, timeB:Float, currentTime:Float)
		return a + (AngleDifference(b, a) * ((currentTime - timeA) / (timeB - timeA)))
	End
	
	Method AngleDifference:Float(a:Float, b:Float)
		Return ((((a - b) Mod 360) + 540) Mod 360) - 180
	End
	
	Method SetScale:Void(scaleX:Float, scaleY:Float)
		Self.scaleX = scaleX
		Self.scaleY = scaleY
	End
End

Class SpriterFolder
	Field files:IntMap<SpriterFile>
	Field id:Int
	Field name:String
	
	Method New()
		Self.files = New IntMap<SpriterFile>
	End
End

Class SpriterFile
	Field id:Int
	Field name:String
	Field width:Int
	Field height:Int
End

Class SpriterEntity
	Field id:Int
	Field name:String
	Field animations:StringMap<SpriterAnimation>
	
	Method New()
		Self.animations = New StringMap<SpriterAnimation>
	End
End

Class SpriterAnimation
	Field id:Int
	Field name:String
	Field length:Int
	Field looping:Int
	Field mainline:SpriterMainline
	Field timelines:IntMap<SpriterTimeline>
	Field maxKey:Int
	
	Method New()
		Self.mainline = New SpriterMainline
		Self.timelines = New IntMap<SpriterTimeline>
	End
End

Class SpriterMainline
	Field keys:IntMap<SpriterKey>
	Field keyId:Int = 0
	Field delay:Float = 0
	Field maxDelay:Int = 5
	Field speed:Float = 1.5
	Field maxKey:Int
		
	Method New()
		Self.keys = New IntMap<SpriterKey>
	End
		
	Method GetKey:SpriterKey(timer:Timer)
		Local rv:SpriterKey = Self.keys.Get(0)
		For Local i:Int = Eachin Self.keys.Keys()
			Local key:SpriterKey = Self.keys.Get(i)
			If key.time > timer.GetTime()
				Return rv
			End
			rv = key
		Next
		Return rv
	End
	
	Method GetKeyViaTime:SpriterKey(time:Float)
		Local rv:SpriterKey = Self.keys.Get(0)
		For Local i:Int = Eachin Self.keys.Keys()
			Local key:SpriterKey = Self.keys.Get(i)
			If key.time > time
				Return rv
			End
			rv = key
		Next
		Return rv
	End

End

Class SpriterKey
	Field id:Int
	Field time:Int
	Field spin:Int
	Field objectRefs:IntMap<SpriterObjectRef>
	Field objects:List<SpriterObject>
	Field boneRefs:IntMap<SpriterBoneRef>
	Field bones:List<SpriterBone>
	
	Method New()
		Self.objectRefs = New IntMap<SpriterObjectRef>
		Self.objects = New List<SpriterObject>
		Self.boneRefs = New IntMap<SpriterBoneRef>
		Self.bones = New List<SpriterBone>
	End
End

Class SpriterBoneRef
	Field id:Int
	Field timeline:Int
	Field parent:Int
	Field key:Int
End

Class SpriterObjectRef
	Field id:Int
	Field timeline:Int
	Field key:Int
	Field zIndex:Int
	Field parent:Int
End

Class SpriterTimeline
	Field id:Int
	Field keys:IntMap<SpriterKey>
	Field keyId:Int = 0
	Field delay:Float = 0
	Field maxDelay:Int = 5
	Field speed:Float = 1.5
	Field maxKey:Int
	Field name:String
	
	Method New()
		Self.keys = New IntMap<SpriterKey>
	End
	
	Method GetKey:SpriterKey(timer:Timer)
		Local rv:SpriterKey = Self.keys.Get(0)
		For Local i:Int = Eachin Self.keys.Keys()
			Local key:SpriterKey = Self.keys.Get(i)
			If key.time > timer.GetTime()
				Return rv
			End
			rv = key
		Next
		Return rv
	End
	
	Method GetKeyViaTime:SpriterKey(time:Float)
		Local rv:SpriterKey = Self.keys.Get(0)
		For Local i:Int = Eachin Self.keys.Keys()
			Local key:SpriterKey = Self.keys.Get(i)
			If key.time > time
				Return rv
			End
			rv = key
		Next
		Return rv
	End

End

Class SpriterObject
	Field folder:Int
	Field file:Int
	Field x:Float
	Field y:Float
	Field pivotX:Float
	Field pivotY:Float
	Field angle:Float
	Field scaleX:Float
	Field scaleY:Float
	Field alpha:Float
End

Class SpriterBone
	Field x:Float
	Field y:Float
	Field angle:Float
	Field scaleX:Float
	Field scaleY:Float
End

Class SpriterImporter
	Function ImportFile:MonkeySpriter(path:String, file:String, debug:Bool = False)
		If debug Then Print "Importing " + path + "/" + file

		Local str:String = LoadString(path + "/" + file)
		If str = "" Then Error "Error loading file..."
		
		Local xmlReader:XMLParser = New XMLParser		
		Local doc:XMLDocument = xmlReader.ParseString(str)
		Local rootElement:XMLElement = doc.Root

		Local smo:MonkeySpriter = New MonkeySpriter()
		smo.mainPath = path
		For Local folderElement:XMLElement = Eachin rootElement.GetChildrenByName("folder")
			Local folder:SpriterFolder = New SpriterFolder()
			folder.id = Int(folderElement.GetAttribute("id"))
			folder.name = folderElement.GetAttribute("name")
			If debug Print "folder = " + folder.id + " " + folder.name
			
			For Local fileElement:XMLElement = Eachin folderElement.GetChildrenByName("file")
				Local file:SpriterFile = New SpriterFile()
				file.id = Int(fileElement.GetAttribute("id"))
				file.name = fileElement.GetAttribute("name")
				file.width = Int(fileElement.GetAttribute("width"))
				file.height = Int(fileElement.GetAttribute("height"))
				
				If debug Print "file = " + file.id + " " + file.name
				smo.textures.Load(path + "/" + file.name)
				
				folder.files.Add(file.id, file)
			Next
			smo.folders.Add(folder.id, folder)
		Next
		
		For Local entityElement:XMLElement = Eachin rootElement.GetChildrenByName("entity")
			Local entity:SpriterEntity = New SpriterEntity()
			Local id:String = entityElement.GetAttribute("id")
			Local name:String = entityElement.GetAttribute("name")
			
			If debug Print "entity = " + id + " " + name
			For Local animationElement:XMLElement = Eachin entityElement.GetChildrenByName("animation")
				Local animation:SpriterAnimation = New SpriterAnimation()
				animation.id  = Int(animationElement.GetAttribute("id"))
				animation.name = animationElement.GetAttribute("name")
				animation.length = Int(animationElement.GetAttribute("length"))
				Local looping:String = animationElement.GetAttribute("looping", MonkeySpriter.LOOPING_FALSE)
				Select looping
					Case "true"
						animation.looping = MonkeySpriter.LOOPING_TRUE
					Case "false"
						animation.looping = MonkeySpriter.LOOPING_FALSE
					Case "ping_pong"
						animation.looping = MonkeySpriter.LOOPING_PING_PONG
				End

				If debug Print "animation = " + animation.id + " " + animation.name
				
				' Should only be one mainline element
				For Local mainlineElement:XMLElement = Eachin animationElement.GetChildrenByName("mainline")
					For Local keyElement:XMLElement = Eachin mainlineElement.GetChildrenByName("key")
						Local skey:SpriterKey = New SpriterKey()
						skey.id = Int(keyElement.GetAttribute("id"))
						skey.time= Int(keyElement.GetAttribute("time", "0"))
						If debug Print "key = " + skey.id + " " + skey.time

						For Local boneRefElement:XMLElement = Eachin keyElement.GetChildrenByName("bone_ref")
							Local boneRef:SpriterBoneRef = New SpriterBoneRef
							boneRef.id = Int(boneRefElement.GetAttribute("id"))
							boneRef.parent = Int(boneRefElement.GetAttribute("parent", "-1"))
							boneRef.timeline = Int(boneRefElement.GetAttribute("timeline"))
							boneRef.key = Int(boneRefElement.GetAttribute("key"))
							If debug Then Print "bone_ref = " + boneRef.id + " " + boneRef.timeline
							skey.boneRefs.Add(boneRef.id, boneRef)
						Next

						For Local objectRefElement:XMLElement = Eachin keyElement.GetChildrenByName("object_ref")
							Local objectRef:SpriterObjectRef = New SpriterObjectRef
							objectRef.id = Int(objectRefElement.GetAttribute("id"))
							objectRef.timeline = Int(objectRefElement.GetAttribute("timeline"))
							objectRef.key = Int(objectRefElement.GetAttribute("key"))
							objectRef.zIndex = Int(objectRefElement.GetAttribute("z_index"))
							objectRef.parent = Int(objectRefElement.GetAttribute("parent", "-1"))
							If debug Print "object_ref = " + objectRef.id + " " + objectRef.timeline + " " + objectRef.parent
							
							skey.objectRefs.Add(objectRef.id, objectRef)
						Next
						animation.mainline.keys.Add(skey.id, skey)
						animation.maxKey = skey.id
					Next	
				Next
				
				For Local timelineElement:XMLElement = Eachin animationElement.GetChildrenByName("timeline")
					Local timeline:SpriterTimeline = New SpriterTimeline()
					timeline.id = Int(timelineElement.GetAttribute("id"))
					timeline.name = timelineElement.GetAttribute("id", "")
					If debug Print "timeline = " + timeline.id + " " + timeline.name
					
					For Local keyElement:XMLElement = Eachin timelineElement.GetChildrenByName("key")
						Local key:SpriterKey = New SpriterKey()
						key.id = Int(keyElement.GetAttribute("id"))
						key.time = Int(keyElement.GetAttribute("time", "0"))
						key.spin = Int(keyElement.GetAttribute("spin", "1"))
						If debug Print "key = " + key.id + " " + key.time + " " + key.spin
						
						For Local boneElement:XMLElement = Eachin keyElement.GetChildrenByName("bone")
							Local b:SpriterBone = New SpriterBone()
							b.x = Float(boneElement.GetAttribute("x", "0"))
							b.y = Float(boneElement.GetAttribute("y", "0"))
							b.angle = Float(boneElement.GetAttribute("angle", "0"))
							b.scaleX = Float(boneElement.GetAttribute("scale_x", "1"))
							b.scaleY = Float(boneElement.GetAttribute("scale_y", "1"))
							
							If debug Print "bone = " + b.x + " " + b.y + " " + b.angle
							
							key.bones.AddLast(b)
						Next
						
						For Local objectElement:XMLElement = Eachin keyElement.GetChildrenByName("object")						
							Local o:SpriterObject = New SpriterObject()
							o.folder = Int(objectElement.GetAttribute("folder"))
							o.file = Int(objectElement.GetAttribute("file"))
							o.x = Float(objectElement.GetAttribute("x", "0"))
							o.y = Float(objectElement.GetAttribute("y", "0"))
							o.pivotX = Float(objectElement.GetAttribute("pivot_x", "0"))
							o.pivotY = Float(objectElement.GetAttribute("pivot_y", "1"))
							o.angle = Float(objectElement.GetAttribute("angle", "0"))
							o.scaleX = Float(objectElement.GetAttribute("scale_x", "1"))
							o.scaleY = Float(objectElement.GetAttribute("scale_y", "1"))
							o.alpha = Float(objectElement.GetAttribute("a", "1"))
							
							If debug Print "object = " + o.folder + " " + o.file + " " + o.angle
														
							key.objects.AddLast(o)
						Next
						timeline.keys.Add(key.id, key)
					Next
					animation.timelines.Add(timeline.id, timeline)
				Next
				entity.animations.Add(animation.name, animation)
			Next
			smo.entities.Add(entity.id, entity)
		Next
		Return smo
	End
End

Class TextureProvider Extends StringMap<Image>
	Method Load:Image(name:String)
		Local storeKey:String = name.ToUpper()

		Local i:Image = New Image
		Local imgName:String = name

		i = LoadImage(imgName )', 1, flags)
		If i = Null
			Error "Error loading image "+name
		End
		'Print "storing "+storeKey
		Self.Set(storeKey, i)
		Return i
	End
	
	Method DisplayAllStored:Void()
		' debug: print all keys in the map
		For Local key:String = Eachin Self.Keys()
			Print key + " is stored in the map."
		Next
	End
	
	Method GetTexture:Image(name:String)
		name = name.ToUpper()
	   	
		Local i:Image= Self.Get(name)
		If i = Null Then Error("Image '" + name + "' not found in the TextureProvider")
		Return i
	End	
End

Class Timer
	Field stopped:Bool
	Field rate:Float
	Const UP:Int = 1
	Const DOWN:Int = -1
	Field direction:Int
	Field count:Float
	
	Method New()
		stopped = True
		rate = 1
		direction = UP
	End
	
	Method Start:Void()
		Reset()
		Resume()
		rate = 1
	End
	
	Method Stop:Void()
		If Not stopped
			stopped = True
		End
	End
	
	Method Resume:Void()
		If stopped
			stopped = False
		End
	End
	
	Method Reset:Void()
		count = 0
		direction = UP
	End
	
	Method GetTime:Float()
		Return count / rate
	End

	Method Update:Void(timeElapsed:Int)
		If direction = UP
			count+=timeElapsed
		Else
			count-=timeElapsed
		End
	End
End

therevills

(Posted 2013) [#46]

Decided on uploading the code to Google Code:

https://code.google.com/p/monkey-spriter-importer/

rIKmAN

(Posted 2013) [#47]

Great work mate, so bones are fully working now? :)

Are those example files available from the Spriter site?

therevills

(Posted 2013) [#48]

so bones are fully working now?

Nope, I was having trouble with pivots and it was really doing my head in!

Are those example files available from the Spriter site?

They should be, or you can get them on the Google Code page.

therevills

(Posted 2013) [#49]

WIP Bones added... my brain hurts :P

http://www.therevillsgames.com/monkey/SpriterA4/MonkeyGame.html

dopeyrulz

(Posted 2013) [#50]

@therevills

Your flipping on the right-hand character is not working properly - otherwise looks ok!

therevills

(Posted 2013) [#51]

LOL... that's why its WIP :-)

rIKmAN

(Posted 2013) [#52]

There aren't any files listed in the downloads section on the Google Code page, do I need to SVN like with Diddy?

Also, I've posted on the App page as well, but how are you keeping the images so crisp when rotating / scaling?

As soon as I rotate or scale any image in 4.1a it gets distorted / jaggy, and apparently it is a known issue, but doesn't seem to affect your demo?

therevills

(Posted 2013) [#53]

do I need to SVN like with Diddy?

I'm using Mercurial (Hg) this time around :)

but how are you keeping the images so crisp when rotating / scaling?

The power of Monkey ;) It's the image filtering built into Monkey, if you turn it off it will look pixelated.

rIKmAN

(Posted 2013) [#54]

Not for me - they start getting jaggies when I rotate them in Spriter so it can't be Monkey, unless you're saying Monkey fixes these jaggies once loaded?

Thinking about it you are using demo files - it's possible they are exported from a newer version than 4.1a.

If you load in the monster demo and rotate his head you'll see the jaggies and distortion on his face - when you get time could you test it?

Also maybe load the demo monster into 4.1a, re-save it and see if that is still smooth and crisp in your demo.

therevills

(Posted 2013) [#55]

Because we render the images using Monkey it is smooth, it is the Sprinter application which is not smoothing them. We are just using the animation file in Monkey.

rIKmAN

(Posted 2013) [#56]

So it isn't just me then? - ut's becuase you are using a non-jaggy premade .scml file (+images)..?

If you were to use Spriter like I explained to make your own test character you would also get the ugly jaggies?

Just want to make sure it's not me going mad, I spent about 3hrs messing round last night and got nowhere really due to it looking so ugly.

therevills

(Posted 2013) [#57]

Sorry... okay let's try again. For me, the images within the Spriter application are pixelated when scaled and rotated, but when I load them using my code into Monkey its fine.

rIKmAN

(Posted 2013) [#58]

Ahhhh!

I never tried getting them into Monkey as they got messed up in Spriter so I thought that was where the problem was.

I'll give that a go, ignore how it looks in Spriter and see if I can finally get it looking right in Monkey once its loaded in.

Thanks for the info.

edit
I missed one of your replies when posting, hence me asking you the same thing again, apologies :)

rIKmAN

(Posted 2013) [#59]

Just tested this and it works perfectly when in Monkey, smooth and crisp just as you said.

Thanks mate, next up flipped bones! :P

<snipped a load of waffle>

When I add my unboned character to your demo and set looping to false, after the animation has finished he warps into a pile of limbs, but the x/y position do not change when this happens.

If I turn off tweening, then he looks fine when the animation ends - so it's something to do with tweening.
I must be missing something but can't see anything in the demo code with your models that I'm not doing with mine. Any ideas?

edit
I fixed/bodged this by checking timer.GetTime() against a value around 20ms less than the length of the animation inside Spriter.

therevills

(Posted 2013) [#60]

after the animation has finished he warps into a pile of limbs

Any chance you could send me your character?

Re: Flipped bones........ I give up, until the Spriter guys release the development guides, I've been trying off and on for the past two weeks and getting nowhere!

therevills

(Posted 2013) [#61]

I had a mini-brainwave last night and thought sod flipping the bones, why don't I just flip the images!

http://www.therevillsgames.com/monkey/SpriterA4/MonkeyGame.html

rIKmAN

(Posted 2013) [#62]

There is a post on the Spriter forum by C2tP which basically says the same thing - don't flip the bones.

I am not using bones at the moment as I wanted to get it working with just images before I spent time setting up a rig, but even that is giving me issues when trying to flip - although I suspect my code is at fault here rather than Spriter or your importer.

Do you still want my character that collapses when not in loop mode?

Is it possible to turn on/off images in a character using Monkey code, maybe setting the alpha level on the fly for each image in the rig?

therevills

(Posted 2013) [#63]

Do you still want my character that collapses when not in loop mode?

Yes please!

Is it possible to turn on/off images in a character using Monkey code, maybe setting the alpha level on the fly for each image in the rig?

Yeah, it should be possible... over on bb.com SlotMan did it on an old version of the importer:
http://www.blitzbasic.com/Community/post.php?topic=99983&post=1177496

rIKmAN

(Posted 2013) [#64]

Ah nice - I forgot about bb.com if I'm honest - I'll give that a look tomorrow that could be really helpful.

Where do you want me to send my files?

therevills

(Posted 2013) [#65]

Have you got a drop box account or something, if not send it to my email address: therevillsgames@...

rIKmAN

(Posted 2013) [#66]

Yes of course, sorry it was late and my brain was frazzled!

I've got a couple of examples that are not playing nice, which I have basically added my character to your Example to rule out it being my code.
I've upped it to my DropBox with a little readme to explain things.

Find the download ~~here~~

therevills

(Posted 2013) [#67]

Love the Goof character!

Okay, the issue with your character and the spriter importer is that you have your very last key frame at the end of the animation. For a quick fix add 100ms to the Animation length... but it is a bug in the code!

With your day/night cycle... dont know yet, I'll investigate tonight.

rIKmAN

(Posted 2013) [#68]

Thanks mate, keep it to yourself if you would, though I wouldn't expect you to do anything with it.

Would setting the last keyframe 1ms before the end of the animation work rather than adding dead space to my animations?

I think it may be the same issue with the nigh and day scene - the last keyframe is the very end of the animation, so I guess its doing the same as with the character, I'll give it a try and see.

Is the bug with the scml or the importer module?

Oh and thanks, appreciate your time. :)

therevills

(Posted 2013) [#69]

keep it to yourself if you would

No worries! Did you draw it yourself and the night/day background?

I think it may be the same issue with the nigh and day scene

I thought so too, but when I altered it I still saw the slight flicker.

Is the bug with the scml or the importer module?

The importer module...

rIKmAN

(Posted 2013) [#70]

No worries! Did you draw it yourself and the night/day background?

No they are from the game I'm working on at the moment - hence the keep it to yourself - but I'm not the artist.

I thought so too, but when I altered it I still saw the slight flicker.

Ahh OK, hopefully a simple fix then :)

EDIT: I just tested moving the keyframe 2ms from the end of the animation and it works fine, he stays on screen when the animation ends.

therevills

(Posted 2013) [#71]

Fixed the LOOPING_FALSE bug...

With the night and day issue, I know whats causing it and a workaround.

The flicker you are seeing is when your night scene finishes and you change to the day scene, but for some reason Monkey displays your night scene again which causes the flicker.

The workaround around is to call spriterObject.Update after changing the animation, so in your example move bg.Update(bgAnimName, loopType, timeElapsed) under the Select statement.

I'll have to think about how we can fix that in the importer.

rIKmAN

(Posted 2013) [#72]

Ahhh that fixed both the issues - thank you! :)

I will be having a play with boned characters this weekend, so I will let you know if I find any anomalies with the flipping.
The current character is just images, and is now a lot more complicated (parts-wise) than that small demo so I think a skeleton is in order.

Thanks again for the quick fix! :)

therevills

(Posted 2013) [#73]

Alright, I've just pushed another changed. This one will require you to call SetAnimation and I have also removed the animationName and loopType from the Update method.

This will fix the day/night cycle so you wont need to call update after changing the animations:

Load in your scml:

loopType = MonkeySpriter.LOOPING_FALSE

bg = SpriterImporter.ImportFile("bg", "bg_day_and_night.scml")
bg.x = 0
bg.y = 0
bg.timer.Start()
bg.SetAnimation(bgAnimName, loopType)

Update and change animations:

bg.Update(timeElapsed)

If bg.currentAnimation.finished
	bgAnimName = BG_NIGHT_TO_DAY
	bg.SetAnimation(bgAnimName, loopType)
	bg.timer.Start()
EndIf

Note: finished is only set if the loop type is FALSE

rIKmAN

(Posted 2013) [#74]

Good stuff, super speedy fix, I'll get that pulled shortly - thanks. :)

A little off-topic, but are you rolling your own collision for the Spriter images or waiting for the official implementation in the SCML?

therevills

(Posted 2013) [#75]

Are you rolling your own collision for the Spriter images or waiting for the official implementation?

Haven't even thought about collisions yet... I'm more using it for animation cut-scenes.

I guess the best approach would be rectangle collisions for each image.

rIKmAN

(Posted 2013) [#76]

Hi mate,

I sent an email to you about this, but in case you don't get it...

What is the deal with multiple .scml files for one character (ie. head/body) and scaling?

I can place them fine and offset the head for movement etc, but when I scale they explode away from each other due to the differing pivot points, and I'm wondering if there is some way to easily deal with this?

therevills

(Posted 2013) [#77]

Hey Rik,

Yes, I got your email I been trying to think a solution for you... but havent come up with anything.

Maybe post on the Spriter forum and see if anyone on there has any answers.

rIKmAN

(Posted 2013) [#78]

Will do mate, I just thought it may be something that could be handled in the importer - I will let you know if I find out an answer.

therevills

(Posted 2013) [#79]

It more a parent child relationship issue, the importer has done it's job now its the actual game's job to control the imported sprites.

Not sure if this would work, but a cheating way you could do is, in Spriter set you head position to be in the correct position where it would be on the body...

rIKmAN

(Posted 2013) [#80]

That works, so simple I didn't think of it - doh! :)

Soap	(Posted 2013) [#81]

New update: http://www.kickstarter.com/projects/539087245/spriter/posts/436499

rIKmAN

(Posted 2013) [#82]

Yep been testing this for a week or so, it's a big improvement over the old version but lacks some important features right now to be used in a proper project.

As soon as the copy/paste is in I think I'll use it instead of the alpha full time.

therevills

(Posted 2013) [#83]

I actually prefer the A4 GUI... why do they keep changing it!?

Playniax

(Posted 2013) [#84]

I am playing around with this again and I would like to add some kind of collision handling.

What is the best way to get a certain part of the sprite. For example the sword relative x and coordinates, width and height so can make some collision stuff?

Also the complete width and height of a sprite would be great :)

Or I should hack something together myself...

I have made this little demo with Ignition:

http://www.playniax.com/share/demos/spriter/MonkeyGame.html

therevills

(Posted 2013) [#85]

lol - you like to spam the forums dont ya ;)

http://www.monkeycoder.co.nz/Community/posts.php?topic=5040#55355

ziggy

(Posted 2013) [#86]

How stable would you considere Spriter on Monkey? I'm about to start a very big project next week and I would like to suggest Monkey for it, but I would love to have some feedback about Spriter and Monkey and how much do they love each other. All samples look like that's what I want to do, but if there's anything missing on the Monkey module I should know beforehand, It would be great to be aware of it.

therevills

(Posted 2013) [#87]

Monkey module I should know beforehand, It would be great to be aware of it

I've pretty much stressed tested it in HTML5 and GLFW and its pretty stable.

The only thing I can think of is that it might have issues on Android, due to the lists I am using, so there is work we could do to optimise the code - maybe use arrays/arraylist instead.

ziggy

(Posted 2013) [#88]

Thanks! if it's only optimization looks great

rIKmAN

(Posted 2013) [#89]

Spriter itself is still in dev, so a lot of features are still "coming soon" and "planned" as it has been heavily delayed.

It's far from perfect and there are still some bugs and features missing, but in the last month the new version has come on loads and is finally heading towards adding all the features promised.

The spriterImporter supports all the features available at the moment, and hopefully as Spriter itself adds more features then therevills will kindly keep his importer up to date - I hope so anyway :)

I'm using the existing software and importer in my project and it's fine for that at the moment, though I don't use bones so not sure if there are any issues there.

EDIT: I can confirm it works fine on iOS as well.

Playniax

(Posted 2013) [#90]

@therevills: yeah, I was wondering about the lists. Not sure performance wise this would work with a lot of sprites. Also I noticed the New command in the Draw method if I remember correctly. Isn't that going to be a problem for the GC because it looks like it's called everytime? Not sure though.

And for collision, If I could get the objects width/height and relative pos it should not be so hard to add collision methods.

therevills

(Posted 2013) [#91]

Also I noticed the New command in the Draw method if I remember correctly. Isn't that going to be a problem for the GC because it looks like it's called everytime?

Yeah it could be an issue, as I said the code could be optimised quite a bit - I normally try to get things working and then optimise as needed.

rIKmAN

(Posted 2013) [#92]

Not sure how many (if any) people are keeping up to date with Spriter and this importer module, but it has been updated a fair bit to B4 now.

This version includes "Character Maps" which is allowing images to be swapped in and use the same animation data (Pro Feature Only) for things like weapons, clothing, armour, shields etc.

As well as an update/release of the Developer Docs.

Any plans to update the importer to support the new stuff therevills?

therevills

(Posted 2013) [#93]

So the character maps let you to use the same animations but just swap in the images... that's cool (as long as all the images are the same size I guess).

Is the idea also that you can change the images at runtime?

I do/did plan on adding all the features of Spriter, but I am so busy at the moment, so don't expect it soon...

I am happy to open up the repo to anyone who is interested in helping, just let me know. :)

Dwapook

(Posted 2013) [#94]

Hey.. I'm using the ignition framework implementation of the importer and I've run into a problem with pivots..

I've been setting the pivot point before laying the image on the canvas in spriter.. (like this states)

But doing that seems to cause the pivot points to be ignored when run through the monkey importer.. Kind of curious if that's ignition specific or the original source of the module has the same problem? I'm having a bit of trouble trying to figure out how the download the latest version..

Playniax

(Posted 2013) [#95]

Can you test this with the non Ignition code?

We do not support this code officially but I see what I can do. Just test it first with the non Ignition code.

rIKmAN

(Posted 2013) [#96]

Thanks for the reply therevills.

Without being pushy at all, would you have a rough estimate of timescale before you have chance to look at the code again? Weeks / months?

@Dwapook
I use the non-Playniax code and have not noticed any abnormalities with regards to pivot points - I'm using the Pro version of Spriter B4, are you?

What is the problem exactly...incorrect animations when played back due to the pivots being wrong?

Dwapook

(Posted 2013) [#97]

@Playniax
Eh.. I tested it with the non ignition code and getting the same issues, maybe I'm doing something wrong

@ rIKmAN
Yeah, I'm using Spriter B4 Pro also.. as for specifics..

I set the pivot x and pivot y in the file palette, these values were 0 in the spriter examples I downloaded..

___________________________________________________________________________

When I test it out, it looks like the pivot points are considered to be set as 0,0 and all the images are displaced...

___________________________________________________________________________

This happens when I turn the tween off..
One last issue, if I set animation to ping pong, the images warps back and forth on the screen, appearing in the left as a crumpled ball, and unchanged in the right..

therevills

(Posted 2013) [#98]

@rIKmAN

Its going to be months... its currently good enough for my newest game and I dont want to spend anymore time on this until my game is out. (Apart from bug fixes).

@Dwapook

Firstly dont worry about what happens when you turn off tweening, you are using bones - bones require tweening.

Any chance can you share your animation?

Dwapook

(Posted 2013) [#99]

https://docs.google.com/file/d/0B23VwTc0S49gTllWOHRjdjRqeUk/edit?usp=sharing

Eh.. fairly incomplete as we weren't planning to do much with it until this issue gets sorted out.. danke!

therevills

(Posted 2013) [#100]

Thanks Dwapook, looking thru your SCML file there are quite a few new elements which unless I am blind I can not find how to use them.

For example "File" now has pivotX and pivotY which I guess is the default pivot points, also "Object_Ref" has "abs_" elements (pivot, x, y, angle, scales, alpha) yet I cant find any documentation on what to do with these...

Dwapook

(Posted 2013) [#101]

Aye, well thanks for looking into it at least! Tried messing with it for a while myself and only managed to get it looking somewhat better.. Still trying to get familiar with monkey and I'm not a very strong coder to begin with..

therevills

(Posted 2013) [#102]

For the time being could you not use the default pivot points for your project?

Dwapook

(Posted 2013) [#103]

Eh, what I used was the default, I thought? I think I get what you mean though! Will try just altering the pivots after the images have been laid on the canvas for now and hope nothing else comes up, thanks again for your time!