Skip to main content

Posts

html5 games and native games html5 which framework and why? ===================================================================== http://www.createjs.com/#!/EaselJS if  you are a html5 developer and looking for a fast and reliable library for you html5 projects(games+banners) then easeljs be your first choice i am working from last two years with this great library and create almost five games running smoothly 60 framerate on both browser and tablets even i gained a stable framerate of 60fps on ipad2 and ipad retina display . what should i follow while creating a html5 games with easeljs =================================================== always use global declaration for reuse variables 1)  http://www.typescriptlang.org/  javascript  classes :) 2) http://wipetouch.codeplex.com/ all swipe of touch events you need for a complex game 3) http://www.greensock.com/ a amazing tween library by greenshock 4) http://indiegamr.com/easeljs-...

Parallax effect for any gaming language

Parallax effect with tiling is one of the key requirement for today's endless gaming so i decide to create my own and after some experiment i created   effect is created in as3 but it can be easily converted in any language is small amount of time easy way to create any endless running parallax scrolling background is very easy ===================================================== 1)step one get the device width or height according to screen size 2) second step get the number of titles  numberoftile = screensize/widthoftile; 3) increase number of tile by one numberoftile+=1 or  numberoftile++ 4) draw all tiles inside a container or root element 5) update the tile container based on speed;   for more here is my as3 class just copy and paste in a new as3 file and name it as parallax as3 all code below //package package  { import flash.display.Sprite; import flash.display.MovieClip; import flash.events.Event; import flash.displa...

Shuffle an array in haxe nme

Shuffle  an  array  in haxe nme here is a neat and clean method to suffle a array in haxe nme ===================================================== //declare outside class var totalflower:Array <Int>; var flowerArray:Array <String>; //           flowerArray = ["img/f1.png","img/f2.png","img/f3.png","img/f4.png"]; totalflower = createArray(flowerArray.length ) ; totalflower = randomArray(totalflower); private function createArray(arraySize:Int) { var array:Array<Int> = new Array(); for (i in 0...arraySize) { array[i] = i; } return array; } private function randomArray(_array:Array<Int>) { var _length:Int= _array.length; var mixed:Array<Int>= _array.slice(0,_length); var rn:Int; var it:Int; var el:Int; for (i in 0..._array.length) { el = mixed[i]; rn = Math.floor(Math.random() * _length); ...

continues looping of a background in as3

/* copy and paste this code on the first frame of your movie and create  need a bg movie clip put that clip in library  */ import flash.display.MovieClip; import flash.events.Event; import flash.display.Sprite; import flash.events.MouseEvent; var max:Number = 800; var speed:Number = -5; stage.frameRate = 24; //a blank sprite thats hold the background var BgClone:MovieClip; //adding background movieClip; //defaut direction addbackground() function addbackground() { //minimum 2 for (var i:Number=0; i<2; i++) { var Bg=new bg(); this.addChild(Bg); Bg.x=(Bg.width/2)+Bg.width*i; Bg.y = Bg.height/2; Bg.addEventListener(Event.ENTER_FRAME,moveBg); } } function moveBg(e:Event) { e.currentTarget.x +=  speed;     if ( e.currentTarget.x<-(e.currentTarget.width/2)) { e.currentTarget.x = 1190; } }

swipe event using jquery and easeljs with a cool example

swipe events are most popular events for the android and ios devices. so here i come with a example where i am using jquery and easeljs. what you need to run this example  ============================================================================ a images floder which contains two pictures one for background and another of a moving  object ========================================================================== files required (jquery and wipetouch files) -------------------------------------------------- http://jquery.com/download/ http://wipetouch.codeplex.com/releases/view/89431 download easeljs (coolest javascript library ) http://www.createjs.com/#!/EaselJS copy and paste the entrie code in html file be sure your directory structure is like mine or you can create you own  ======================================================================= <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML ...

inheritance using EaselJS: a example of bouncing balls create with easejs

its really easy to extend a class in easeljs here is a example with source code ball class extended from the container class with its serval own properties such as vx,vy and gravity   ===================================================== for new guys copy this code in a javascript file rename that file as ball.js   //ball class (function (window) {     function ball(icon,x,y) {         this.initialize(icon,x,y);     }     //Inheritance from Container     ball.prototype = new createjs.Container();  ball.prototype.icon=null; ball.prototype.vx=2; ball.prototype.vy=0; ball.prototype.gravity = .4;     ball.prototype.initialize = function (icon) {   this.icon=icon;   this.addChild(icon);     }      ball.prototype.onTick = function () {                // apply gravi...

unique array in javascript(which contain all unique values)

how to get a unique array in javascript ============================= var list1=create_unique_random_array(20,0,19); var list2=create_unique_random_array(20,0,19); function create_unique_random_array(num_elements,min,max) {     var temp, nums = new Array;     for (var element=0; element<num_elements; element++) {          while((temp=number_found(random_number(min,max),nums))  ==-1);         nums[element] = temp;     }     return (nums); } function number_found (random_number,number_array) {     for (var element=0; element<number_array.length; element++) {         if (random_number==number_array[element]) {             return (-1); }    }     return (random_number); }

cool flash like drag and drop in easejs and html5

here is a cool drag and drop create in easejs+tweenlite what is easejs= easejs is a flash api like java script library  what  is tweenlite = a cool time based animation engine or javascript library   whole code  for your drag and drop with screenshoot you can download  easejs from the below link ================================ http://www.createjs.com/#!/EaselJS you can download tweenlite  from the below link http://www.greensock.com/gsap-js/ because easejs yet not support hit test for collision detetion  so i downloaded a cool collision detection javascript file from https://github.com/olsn/Collision-Detection-for-EaselJS/blob/master/example/index.html ======================================================================= code of  drag and drop <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html ...
tooo busy with my work now its time to play with some cool html5 engines  easeljs= a javascript library worked same as flash api http://www.createjs.com/ greenshock= JavaScript library one of the coolest JavaScript animations library till yet   http://www.greensock.com/ Cocos2d for javascript a super cool gaming engine for javascript http://www.cocos2d-x.org/projects/cocos2d-x/wiki/Cocos2d-html5 Gamvas-one of the coolest engines with box2d physics and a little particle system http://gamvas.com/

a funky drag and drop using greensock and as3

click here to download a cool drag and drop using as3 and greensock source code ================================================================= import com.greensock.*; import com.greensock.easing.*; createEvents(); function createEvents():void { for (var i:Number=1; i<4; i++) { this["drag"+i].__x=this["drag"+i].x; this["drag"+i].__y=this["drag"+i].y; this["drag"+i].answer=String("drop"+i); this["drag"+i].index=1; this["drag"+i].buttonMode=true; this["drag" + i].addEventListener(MouseEvent.MOUSE_DOWN,dragIcon); this["drag" + i].addEventListener(MouseEvent.MOUSE_UP,dropIcon); } } function dragIcon(m:MouseEvent):void { swap(MovieClip(m.currentTarget)); MovieClip(m.currentTarget).startDrag(); } function tweenback(__target) { __target.stopDrag(); TweenLite.to(__target, 0.5, {x:__target.__x, y:__target.__y, ease:Cubic.easeOut,onComplete:res...

swapping two values of a array

here i found a quite interesting method which is really useful when you need to swap two values in a array ====================================================================== var myArray:Array=["flash","flex","html","dhtml","javascript"]; Array.prototype.swap = function(fromIndex:int, toIndex:int):void {     var temp:* = this[toIndex];     this[toIndex] = this[fromIndex];     this[fromIndex] = temp;    }    ; //swaping first and second index of a array myArray.swap(0,1); for (var i :Number=0; i<myArray.length; i++) { trace(myArray[i]); }

creating a small drawing tool using as3 where you can draw with mouse and record and replay it my clicking on replay button

code  ============================================== //import required packages import com.greensock.*; import com.greensock.easing.*; // var drawing:Boolean=false; var eraseing:Boolean=false; var drawingbroad:Sprite; var linedraw:Sprite; var eraserDraw:Sprite; var xloc:Array=new Array(); var yloc:Array=new Array(); var type:Array=new Array(); var replayline:Sprite; var replayeraser:Sprite; var startpointPencil:Boolean=false; var startpointeraser:Boolean=false; var toolsArray=new Array("pencil","eraser","replay"); // var recordconter:Number=-1; var tooltype:String=null; var recordTimer:Timer; init(); function init() { newDrawing(); addnewdrawing(); selectaTool(); } function newDrawing():void { clearAll() drawingbroad=new Sprite(); this.addChild(drawingbroad); drawingbroad.x=10; drawingbroad.y=10; drawingbroad.graphics.lineStyle(1,0x000000); drawingbroad.graphics.beginFill(0xFFFFFF); drawingbroad.graphics.drawRect(10,10,750,500); drawingbroad.g...