EffectHub.com: your best source for gaming

Recommendation

More Effects...

JS

$(window).load(function () {
  init();
  });

function init()
		{
			createJSInit();
		}
		
		var canvas;
		var stage;
		
		var skeletonData;
		
		var texture2x;
		var texture1x;
		var texture0_5x;
		var texture0_3x;
		
		var textureData2x;
		var textureData1x;
		var textureData0_5x;
		var textureData0_3x;
		
		function createJSInit()
		{
			canvas = document.getElementById("canvas");
			stage = new createjs.Stage(canvas);
			
			$.getJSON(
				"http://www.effecthub.com/uploads/codefile/C766F107-56FC-2E7D-06AF-14E3BDDB3072/skeleton.json",
				function(data)
				{
					skeletonData = data;
					dragonBonesInit();
					loadTexture();
				}
			)
		}
		
		function loadTexture()
		{
			texture2x = new Image();
			texture2x.onload = function()
			{
				$.getJSON(
					"http://www.effecthub.com/uploads/codefile/52E134C9-DE39-39E2-979D-F0CDBE245278/texture@2x.json",
					function(data)
					{
						textureData2x = data;
						buildArmature("warrior2x", texture2x, textureData2x, 2, 150);
					}
				);
			}
			texture2x.src = "http://www.effecthub.com/uploads/codefile/A734E40D-BE66-A52E-AB6B-B4DFF35309DA/texture@2x.png";
			
			texture1x = new Image();
			texture1x.onload = function()
			{
				$.getJSON(
					"http://www.effecthub.com/uploads/codefile/D79A6305-C264-4EB7-5AD3-0D970318003F/texture@1x.json",
					function(data)
					{
						textureData1x = data;
						buildArmature("warrior1x", texture1x, textureData1x, 1, 300);
					}
				);
			}
			texture1x.src = "http://www.effecthub.com/uploads/codefile/D1EE88A1-5AEB-DB73-C551-AB72D926CA38/texture@1x.png";
			
			texture0_5x = new Image();
			texture0_5x.onload = function()
			{
				$.getJSON(
					"http://www.effecthub.com/uploads/codefile/C15CC4C7-7C50-E89D-80AD-F5068B4D7CB6/texture@0.5x.json",
					function(data)
					{
						textureData0_5x = data;
						buildArmature("warrior0.5x", texture0_5x, textureData0_5x, 0.5, 450);
					}
				);
			}
			texture0_5x.src = "http://www.effecthub.com/uploads/codefile/8A83EF16-4DAC-6F18-C87C-4C08CC6D75E9/texture@0.5x.png";
			
			texture0_3x = new Image();
			texture0_3x.onload = function()
			{
				$.getJSON(
					"http://www.effecthub.com/uploads/codefile/68A0096B-8228-FB1F-8D6A-E909001F4F33/texture@0.3x.json",
					function(data)
					{
						textureData0_3x = data;
						buildArmature("warrior0.3x", texture0_3x, textureData0_3x, 0.3, 600);
					}
				);
			}
			texture0_3x.src = "http://www.effecthub.com/uploads/codefile/54D58379-619C-48A5-7804-0D6B0476EFF1/texture@0.3x.png";
		}
		
		var factory;
		var armatures;
		
		function dragonBonesInit()
		{
			factory = new dragonBones.factorys.CreateJSFactory();
			factory.addSkeletonData(dragonBones.objects.DataParser.parseSkeletonData(skeletonData), "warriorSkeletonName");
			
			createjs.Ticker.setFPS(60);
			createjs.Ticker.addEventListener("tick", update);
			
			canvas.onclick = changeAnimation;
			
			armatures = [];
		}
		
		function buildArmature(textureAtlasName, texture, textureData, scale, x)
		{
			factory.addTextureAtlas(new dragonBones.textures.CreateJSTextureAtlas(texture, textureData, scale), textureAtlasName);
			
			var armature = factory.buildArmature("warrior", null, "warriorSkeletonName", textureAtlasName);
			armature.getDisplay().x = x;
			armature.getDisplay().y = 300;
			
			dragonBones.animation.WorldClock.clock.add(armature);
			armatures.push(armature);
			stage.addChild(armature.getDisplay());
			
			changeAnimation();
		}
		
		function update() 
		{
			dragonBones.animation.WorldClock.clock.advanceTime(1/60);
			stage.update();
		}
		
		function changeAnimation() 
		{
			var armature = armatures[0];
			if(armature)
			{
				do
				{
					var animationName = armature.animation.animationNameList[Math.floor(Math.random() * armature.animation.animationNameList.length)];
				}
				while (animationName == armature.animation.getLastAnimationName());
				
				for(var index in armatures)
				{
					armature = armatures[index];
					armature.animation.gotoAndPlay(animationName);
				}
			}
		}

CSS

HTML

Join Effecthub.com

Working with Global Gaming Artists and Developers!

Login
Sign Up

Or Sign Up with Your Email Address: