$(document).ready(
    function(){

	var k = Karma({
			  image: [
			      {name:"camel" , file:"camel.png"},
                  {name:"jar" , file:"jar.png"},
                  {name:"cat" , file:"cat.png"},
                  {name:"teddy" , file:"teddy.png"},
                  {name:"squirrel" , file:"squirrel.png"},
                  {name:"box" , file:"box.png"},
                  {name:"deer" , file:"deer.png"},
                  {name:"elephant" , file:"elephant.png"},
                  {name:"lantern" , file:"lantern.png"},
                  {name:"triangle" , file:"triangle.png"},
                  {name:"man" , file:"man.png"},
                  {name:"monkey" , file:"monkey.png"},
                  {name:"reindeer" , file:"reindeer.png"},
                  {name:"horse" , file:"horse.png"},
                  {name:"mouth" , file:"mouth.png"},
                  {name:"mother" , file:"mother.png"},
                  {name:"rabbit" , file:"rabbit.png"},
                  {name:"badge" , file:"badge.png"},
                  {name:"pencil" , file:"pencil.png"},
                  {name:"pencil_in_hand" , file:"pencil_in_hand.png"},
                  {name:"tortoise" , file:"tortoise.png"},
                  {name:"lion" , file:"lion.png"},
                  {name:"joker" , file:"joker.png"},
                  {name:"train" , file:"train.png"},
                  {name:"ear" , file:"ear.png"},
                  {name:"dog" , file:"dog.png"},
                  {name:"rubber_letter" , file:"rubber_letter.png"},
                  {name:"ram" , file:"ram.png"},
                  {name:"puppet_show" , file:"puppet_show.png"},
                  {name:"bull" , file:"bull.png"},
                  {name:"card" , file:"card.png"},
                  {name:"rat" , file:"rat.png"},
                  {name:"goat" , file:"goat.png"},
                  {name:"peacock" , file:"peacock.png"},
                  {name:"girl" , file:"girl.png"},
                  {name:"mask" , file:"mask.png"},
                  {name:"tree" , file:"tree.png"},
                  {name:"village" , file:"village.png"}	      
			  ],
			  
			  canvas: [
			      {name:"ladder", domId:"ladder"}
			  ]	
		      });
	
	
	k.ready(function() {
		    var logos =["camel", "jar","cat","teddy","squirrel","box","deer","elephant","lantern","triangle","man","monkey",
		    "reindeer","horse",
		     "mouth","mother","rabbit","badge","pencil","pencil_in_hand","tortoise","lion","joker",
		     "train","ear","dog","rubber_letter","ram","puppet_show",    
		     "bull","card","rat","goat","peacock","girl","mask","tree","village","village"];
		     
		    var activities = new Array();
                activities[0] = new Array(23,0);
                activities[1] = new Array(4,0);
                activities[2] = new Array(32,0);
                activities[3] = new Array(18,0);
                activities[4] = new Array(30,0);
                activities[5] = new Array(38,0);
                activities[6] = new Array(25,0);
                activities[7] = new Array(2,0);
                activities[8] = new Array(9,0);
                activities[9] = new Array(34,0);
                activities[10] = new Array(35,0);
                activities[11] = new Array(11,0);
                activities[12] = new Array(28,0);
                activities[13] = new Array(22,0);
                activities[14] = new Array(24,0);
                activities[15] = new Array(5,0);
                activities[16] = new Array(32,0);
                activities[17] = new Array(36,0);
                activities[18] = new Array(6,0);
                activities[19] = new Array(31,0);
                activities[20] = new Array(19,0);
                activities[21] = new Array(37,0);
                activities[22] = new Array(24,0);
                activities[23] = new Array(16,0);
                activities[24] = new Array(32,0);
                activities[25] = new Array(17,0);
                activities[26] = new Array(39,0);
                activities[27] = new Array(10,0);
                activities[28] = new Array(15,0);
                activities[29] = new Array(0,1);
                activities[30] = new Array(17,1);
                activities[31] = new Array(30,1);
                activities[32] = new Array(31,1);
                activities[33] = new Array(7,1);
                activities[34] = new Array(8,1);
                activities[35] = new Array(38,1);
                activities[36] = new Array(0,2);
                activities[37] = new Array(17,2);
                activities[38] = new Array(30,2);
                activities[39] = new Array(31,2);
                activities[40] = new Array(7,2);
                activities[41] = new Array(8,2);
                activities[42] = new Array(12,1);
                activities[43] = new Array(20,0);
                activities[44] = new Array(38,18);
                activities[45] = new Array(0,3);
                activities[46] = new Array(17,3);
                activities[47] = new Array(30,2);
                activities[48] = new Array(31,3);
                activities[49] = new Array(13,1);
                activities[50] = new Array(8,3);
                activities[51] = new Array(38,17);
                activities[52] = new Array(0,4);
                activities[53] = new Array(17,4);
                activities[54] = new Array(30,3);
                activities[55] = new Array(31,4);
                activities[56] = new Array(13,0);
                activities[57] = new Array(8,4);
                activities[58] = new Array(29,1);
                activities[59] = new Array(21,2);
                activities[60] = new Array(36,0);
                activities[61] = new Array(38,19);
                activities[62] = new Array(0,5);
                activities[63] = new Array(17,5);
                activities[64] = new Array(30,4);
                activities[65] = new Array(31,5);
                activities[66] = new Array(7,0);
                activities[67] = new Array(8,5);
                activities[68] = new Array(5,1);
                activities[69] = new Array(21,3);
                activities[70] = new Array(1,1);
                activities[71] = new Array(3,1);
                activities[72] = new Array(38,20);
                activities[73] = new Array(0,6);
                activities[74] = new Array(17,6);
                activities[75] = new Array(30,5);
                activities[76] = new Array(31,6);
                activities[77] = new Array(7,2);
                activities[78] = new Array(8,6);
                activities[79] = new Array(29,2);
                activities[80] = new Array(21,4);
                activities[81] = new Array(12,2);
                activities[82] = new Array(33,1);
                activities[83] = new Array(38,21);
                activities[84] = new Array(0,7);
                activities[85] = new Array(17,7);
                activities[86] = new Array(30,5);
                activities[87] = new Array(31,7);
                activities[88] = new Array(7,0);
                activities[89] = new Array(8,7);
                activities[90] = new Array(21,5);
                activities[91] = new Array(12,3);
                activities[92] = new Array(1,2);
                activities[93] = new Array(38,22);
                activities[94] = new Array(0,8);
                activities[95] = new Array(17,8);
                activities[96] = new Array(30,6);
                activities[97] = new Array(31,8);
                activities[98] = new Array(7,0);
                activities[99] = new Array(8,8);
                activities[100] = new Array(21,6);
                activities[101] = new Array(5,2);
                activities[102] = new Array(33,2);
                activities[103] = new Array(36,0);
                activities[104] = new Array(38,19);
                activities[105] = new Array(0,9);
                activities[106] = new Array(17,9);
                activities[107] = new Array(30,7);
                activities[108] = new Array(31,9);
                activities[109] = new Array(7,3);
                activities[110] = new Array(8,9);
                activities[111] = new Array(21,7);
                activities[112] = new Array(12,4);
                activities[113] = new Array(33,3);
                activities[114] = new Array(38,23);
                activities[115] = new Array(0,10);
                activities[116] = new Array(17,10);
                activities[117] = new Array(31,10);
                activities[118] = new Array(7,0);
                activities[119] = new Array(8,10);
                activities[120] = new Array(21,8);
                activities[121] = new Array(1,3);
                activities[122] = new Array(26,2);
                activities[123] = new Array(38,24);
                activities[124] = new Array(0,11);
                activities[125] = new Array(17,11);
                activities[126] = new Array(30,7);
                activities[127] = new Array(31,11);
                activities[128] = new Array(7,0);
                activities[129] = new Array(8,11);
                activities[130] = new Array(29,3);
                activities[131] = new Array(21,9);
                activities[132] = new Array(5,3);
                activities[133] = new Array(12,5);
                activities[134] = new Array(38,25);
                activities[135] = new Array(0,12);
                activities[136] = new Array(17,12);
                activities[137] = new Array(30,8);
                activities[138] = new Array(31,12);
                activities[139] = new Array(7,0);
                activities[140] = new Array(8,12);
                activities[141] = new Array(21,10);
                activities[142] = new Array(1,4);
                activities[143] = new Array(33,4);
                activities[144] = new Array(36,0);
                activities[145] = new Array(38,19);
                activities[146] = new Array(0,13);
                activities[147] = new Array(17,13);
                activities[148] = new Array(31,13);
                activities[149] = new Array(7,4);
                activities[150] = new Array(8,13);
                activities[151] = new Array(21,11);
                activities[152] = new Array(12,6);
                activities[153] = new Array(1,5);
                activities[154] = new Array(38,26);
                activities[155] = new Array(0,14);
                activities[156] = new Array(17,14);
                activities[157] = new Array(30,9);
                activities[158] = new Array(31,14);
                activities[159] = new Array(7,10);
                activities[160] = new Array(8,14);
                activities[161] = new Array(21,12);
                activities[162] = new Array(29,4);
                activities[163] = new Array(33,5);
                activities[164] = new Array(20,0);
                activities[165] = new Array(38,27);
                activities[166] = new Array(0,15);
                activities[167] = new Array(17,15);
                activities[168] = new Array(30,10);
                activities[169] = new Array(31,15);
                activities[170] = new Array(7,5);
                activities[171] = new Array(8,15);
                activities[172] = new Array(29,5);
                activities[173] = new Array(21,13);
                activities[174] = new Array(1,6);
                activities[175] = new Array(33,6);
                activities[176] = new Array(3,3);
                activities[177] = new Array(38,20);
                activities[178] = new Array(0,16);
                activities[179] = new Array(17,16);
                activities[180] = new Array(31,16);
                activities[181] = new Array(7,0);
                activities[182] = new Array(8,16);
                activities[183] = new Array(29,6);
                activities[184] = new Array(21,14);
                activities[185] = new Array(5,5);
                activities[186] = new Array(12,7);
                activities[187] = new Array(36,0);
                activities[188] = new Array(38,19);
                activities[189] = new Array(0,17);
                activities[190] = new Array(17,17);
                activities[191] = new Array(31,17);
                activities[192] = new Array(7,0);
                activities[193] = new Array(8,17);
                activities[194] = new Array(29,7);
                activities[195] = new Array(21,15);
                activities[196] = new Array(12,8);
                activities[197] = new Array(1,7);
                activities[198] = new Array(38,28);
                activities[199] = new Array(0,18);
                activities[200] = new Array(17,18);
                activities[201] = new Array(31,18);
                activities[202] = new Array(7,6);
                activities[203] = new Array(8,18);
                activities[204] = new Array(29,8);
                activities[205] = new Array(21,16);
                activities[206] = new Array(5,6);
                activities[207] = new Array(33,7);
                activities[208] = new Array(20,0);
                activities[209] = new Array(38,29);
                activities[210] = new Array(0,19);
                activities[211] = new Array(17,19);
                activities[212] = new Array(31,19);
                activities[213] = new Array(7,0);
                activities[214] = new Array(8,19);
                activities[215] = new Array(29,9);
                activities[216] = new Array(21,17);
                activities[217] = new Array(12,9);
                activities[218] = new Array(33,8);
                activities[219] = new Array(38,30);
                activities[220] = new Array(0,20);
                activities[221] = new Array(17,20);
                activities[222] = new Array(31,20);
                activities[223] = new Array(7,0);
                activities[224] = new Array(8,20);
                activities[225] = new Array(29,10);
                activities[226] = new Array(21,18);
                activities[227] = new Array(5,7);
                activities[228] = new Array(1,8);
                activities[229] = new Array(36,0);
                activities[230] = new Array(38,19);
                activities[231] = new Array(0,21);
                activities[232] = new Array(17,21);
                activities[233] = new Array(31,21);
                activities[234] = new Array(7,7);
                activities[235] = new Array(8,21);
                activities[236] = new Array(21,19);
                activities[237] = new Array(33,9);
                activities[238] = new Array(14,1);
                activities[239] = new Array(3,4);
                activities[240] = new Array(20,0);
                activities[241] = new Array(38,30);
                activities[242] = new Array(0,22);
                activities[243] = new Array(20,0);
                activities[244] = new Array(36,0);
                activities[245] = new Array(8,22);
                activities[246] = new Array(21,20);
                activities[247] = new Array(0,23);
                
        k.ready(function(){		
                
		    //game logic
            function draw(){  
                var canvas = document.getElementById('ladder');  
                if (canvas.getContext){  
                    var ctx = canvas.getContext('2d');
                    var maxx = 1200;
                    var maxy = 16000;
                    var x = 0;
                    var y = 0;
                    var odd = 1;
                    var cellsize = 100;
                    var xstart = 16 + 2 * cellsize;
                    var ystart = maxy - cellsize * 0.5;
                    var rows = 1 + activities.length / 3;
                    var row = 0;
                    var cells = 8;
                    var cell = 0;
                    var id = -1;
                    var ix = 0;
                    var idm = 0;
                    var activity = 0;
                    var flag = 0;
                 
                    // ladder
                    ctx.font = "14pt Arial";
                    // ctx.textAlign = "center";
                    x = xstart;
                    y = ystart;
                    ctx.beginPath();
                    ctx.fillRect(x-cellsize*0.8,y+0.15*cellsize,cellsize*0.5,cellsize*0.2);
                    ctx.moveTo(x-cellsize*0.5,y);
                    ctx.lineTo(x-cellsize*0.2,y+0.25*cellsize);
                    ctx.moveTo(x-cellsize*0.5,y+0.5*cellsize);
                    ctx.lineTo(x-cellsize*0.2,y+0.25*cellsize);       
                    for(row=0;row<rows;row++){
                        if (row % 2 == 0) {
                            x = xstart;
                        } else {
                            x = xstart + (cells - 1)*cellsize;
                        }
                        for(cell=0;cell<cells;cell++){
                            ctx.strokeRect(x,y,cellsize, cellsize / 2);
                            if (cell % 2 == 1) {
                                drawlogo(x,y,activity);
                                activity = activity + 1;
                            }
                            if (row % 2 == 0){
                                x = x + cellsize;
                            } else {
                                x = x - cellsize;
                            }                       
                        }
                        if (row + 1 < rows) {
                            if (odd == 1) {
                                ctx.moveTo(x,y);
                                ctx.arc(x, y-cellsize, cellsize, Math.PI/2, 0, 1);
                                ctx.arc(x, y-cellsize, 1.5*cellsize, 0, Math.PI*3/2, 1);
                                ctx.arc(x, y-cellsize, cellsize, Math.PI*3/2, 0, 0);
                                ctx.arc(x, y-cellsize, 1.5*cellsize, 0, Math.PI/2, 0);
                                ctx.stroke();
                                odd = 0;
                            } else {
                                x = xstart;
                                ctx.moveTo(x,y);
                                ctx.arc(x, y-cellsize, cellsize, Math.PI/2, Math.PI, 0);
                                ctx.arc(x, y-cellsize, 1.5*cellsize, Math.PI, Math.PI*3/2, 0);
                                ctx.arc(x, y-cellsize, cellsize, Math.PI*3/2, Math.PI, 1);
                                ctx.arc(x, y-cellsize, 1.5*cellsize, Math.PI, Math.PI/2, 1);
                                ctx.stroke();
                                odd = 1;
                            }
                        }
                        y = y - 2.5 * cellsize; 
                        x = xstart;      
                    }
                } 
             
                function drawlogo(x, y, activity) {

                        id = activities[activity][0]
                        ix = activities[activity][1]
                        if (id == 0){
                            // draw milestone
                            ctx.moveTo(x,y);
                            ctx.lineTo(x,y-cellsize);
                            ctx.moveTo(x+cellsize, y-cellsize);
                            ctx.lineTo(x+cellsize, y);
                            ctx.moveTo(x, y-cellsize);
                            ctx.arc(x+0.5*cellsize,y-cellsize,0.5*cellsize,Math.PI,0,0);
                            ctx.fillText(ix, x + (cellsize * 0.3), y-(cellsize * 0.4), cellsize);
                            ctx.stroke();
                        } else {
                            // draw logo
                            k.canvas["ladder"].drawImage(k.image[logos[id-1]].media, x, y - cellsize);
                            if (ix > 0) {
                                ctx.fillText(ix, x + (cellsize * 0.3), y + (cellsize * 0.4), cellsize);
                            }
                        }
                }    
            }

            draw();
        });
    });
});