diff options
Diffstat (limited to 'examples/adding_up_to_10_canvas')
21 files changed, 0 insertions, 689 deletions
diff --git a/examples/adding_up_to_10_canvas/assets/audio/correct.ogg b/examples/adding_up_to_10_canvas/assets/audio/correct.ogg Binary files differdeleted file mode 100755 index a0d9e3a..0000000 --- a/examples/adding_up_to_10_canvas/assets/audio/correct.ogg +++ /dev/null diff --git a/examples/adding_up_to_10_canvas/assets/audio/incorrect.ogg b/examples/adding_up_to_10_canvas/assets/audio/incorrect.ogg Binary files differdeleted file mode 100755 index 4805e55..0000000 --- a/examples/adding_up_to_10_canvas/assets/audio/incorrect.ogg +++ /dev/null diff --git a/examples/adding_up_to_10_canvas/assets/audio/trigger.ogg b/examples/adding_up_to_10_canvas/assets/audio/trigger.ogg Binary files differdeleted file mode 100755 index f22512a..0000000 --- a/examples/adding_up_to_10_canvas/assets/audio/trigger.ogg +++ /dev/null diff --git a/examples/adding_up_to_10_canvas/assets/image/ball37px.png b/examples/adding_up_to_10_canvas/assets/image/ball37px.png Binary files differdeleted file mode 100755 index 4388283..0000000 --- a/examples/adding_up_to_10_canvas/assets/image/ball37px.png +++ /dev/null diff --git a/examples/adding_up_to_10_canvas/assets/image/balloon37px.png b/examples/adding_up_to_10_canvas/assets/image/balloon37px.png Binary files differdeleted file mode 100755 index 8f47d6a..0000000 --- a/examples/adding_up_to_10_canvas/assets/image/balloon37px.png +++ /dev/null diff --git a/examples/adding_up_to_10_canvas/assets/image/banana37px.png b/examples/adding_up_to_10_canvas/assets/image/banana37px.png Binary files differdeleted file mode 100755 index 90728e6..0000000 --- a/examples/adding_up_to_10_canvas/assets/image/banana37px.png +++ /dev/null diff --git a/examples/adding_up_to_10_canvas/assets/image/chilli.png b/examples/adding_up_to_10_canvas/assets/image/chilli.png Binary files differdeleted file mode 100755 index 5f8b64d..0000000 --- a/examples/adding_up_to_10_canvas/assets/image/chilli.png +++ /dev/null diff --git a/examples/adding_up_to_10_canvas/assets/image/fish64px.png b/examples/adding_up_to_10_canvas/assets/image/fish64px.png Binary files differdeleted file mode 100755 index a29f12c..0000000 --- a/examples/adding_up_to_10_canvas/assets/image/fish64px.png +++ /dev/null diff --git a/examples/adding_up_to_10_canvas/assets/image/flower37px.png b/examples/adding_up_to_10_canvas/assets/image/flower37px.png Binary files differdeleted file mode 100755 index 224e707..0000000 --- a/examples/adding_up_to_10_canvas/assets/image/flower37px.png +++ /dev/null diff --git a/examples/adding_up_to_10_canvas/assets/image/happyChimp_120x125.png b/examples/adding_up_to_10_canvas/assets/image/happyChimp_120x125.png Binary files differdeleted file mode 100755 index 5e721c9..0000000 --- a/examples/adding_up_to_10_canvas/assets/image/happyChimp_120x125.png +++ /dev/null diff --git a/examples/adding_up_to_10_canvas/assets/image/happyMonkey.jpg b/examples/adding_up_to_10_canvas/assets/image/happyMonkey.jpg Binary files differdeleted file mode 100755 index bfe0d38..0000000 --- a/examples/adding_up_to_10_canvas/assets/image/happyMonkey.jpg +++ /dev/null diff --git a/examples/adding_up_to_10_canvas/assets/image/normalChimp_120x125.png b/examples/adding_up_to_10_canvas/assets/image/normalChimp_120x125.png Binary files differdeleted file mode 100755 index a731df4..0000000 --- a/examples/adding_up_to_10_canvas/assets/image/normalChimp_120x125.png +++ /dev/null diff --git a/examples/adding_up_to_10_canvas/assets/image/plussign.png b/examples/adding_up_to_10_canvas/assets/image/plussign.png Binary files differdeleted file mode 100755 index 915c5aa..0000000 --- a/examples/adding_up_to_10_canvas/assets/image/plussign.png +++ /dev/null diff --git a/examples/adding_up_to_10_canvas/assets/image/sadChimp_120x125.png b/examples/adding_up_to_10_canvas/assets/image/sadChimp_120x125.png Binary files differdeleted file mode 100755 index 1dec5f0..0000000 --- a/examples/adding_up_to_10_canvas/assets/image/sadChimp_120x125.png +++ /dev/null diff --git a/examples/adding_up_to_10_canvas/assets/image/scorebox.png b/examples/adding_up_to_10_canvas/assets/image/scorebox.png Binary files differdeleted file mode 100755 index 424b60b..0000000 --- a/examples/adding_up_to_10_canvas/assets/image/scorebox.png +++ /dev/null diff --git a/examples/adding_up_to_10_canvas/assets/image/sidebar.png b/examples/adding_up_to_10_canvas/assets/image/sidebar.png Binary files differdeleted file mode 100755 index 9632788..0000000 --- a/examples/adding_up_to_10_canvas/assets/image/sidebar.png +++ /dev/null diff --git a/examples/adding_up_to_10_canvas/assets/image/yellowBox.png b/examples/adding_up_to_10_canvas/assets/image/yellowBox.png Binary files differdeleted file mode 100755 index f7a72ca..0000000 --- a/examples/adding_up_to_10_canvas/assets/image/yellowBox.png +++ /dev/null diff --git a/examples/adding_up_to_10_canvas/css/knavbar.css b/examples/adding_up_to_10_canvas/css/knavbar.css deleted file mode 100755 index 26e3896..0000000 --- a/examples/adding_up_to_10_canvas/css/knavbar.css +++ /dev/null @@ -1,134 +0,0 @@ -body -{ -background: #D8D8D8; -margin:0; -padding:0; -} - -nav -{ -list-style: none; -padding: 0; -margin: 0; -float:left; -width:100%; -background: #FFFFFF; -} - -nav li -{ -float: left; -} - -nav li a -{ -height: 63px; -text-align: center; -font-weight: bold; -font-size: 110%; -display: block; -color:#000000; -padding-left: 0.2em; -padding-right: 0.2em; -text-decoration: none; -} - -nav img -{ -border: none; -width: 58px; -} - -#welcome -{ -padding-left: 1em; -padding-right: 1em; -line-height: 3em; -} - -#subject -{ -text-align: center; -font-weight: bold; -font-size: 130%; -} - -#lesson_name -{ -text-align: center; -font-weight: bold; -font-size: 150%; -padding: 0.8em; -} - -#welcome_refs -{ -text-align: center; -font-weight: bold; -font-size: 150%; -width: 50%; -float: left; -} - -#tutorial_link -{ -width: 50%; -float: left; -} - -#tutorial_link img -{ -padding: 2em; - -} - -#exercise_link -{ -width: 50%; -float: left; -} - -#exercise_link img -{ -padding: 2em; -} - -#lesson -{ -width:800px; -background: #BDBDBD; -} - -#welcome_logo img -{ -padding: 2em; -} - -img -{ -border: none; -} - -nav a:hover { -text-decoration: underline; -outline-width:1px; -outline-style:solid; -} - -nav a.selected { -text-decoration: underline; -background: #BDBDBD; -} - -.centeredImage -{ -text-align:center; -margin-top:0px; -margin-bottom:0px; -padding:0px; -} - -.icon_right -{ -float: right; -}
\ No newline at end of file diff --git a/examples/adding_up_to_10_canvas/css/lesson.css b/examples/adding_up_to_10_canvas/css/lesson.css deleted file mode 100755 index 5147cfa..0000000 --- a/examples/adding_up_to_10_canvas/css/lesson.css +++ /dev/null @@ -1,173 +0,0 @@ - -#main { -width:800px; -height:600px; -position:absolute; -} -#action { -float:left; -position:relative; -width: 650px; -height: 600px; - -} -#sidebar { -background-image: url(../assets/generic/images/sidebar.png); --moz-background-clip:border; --moz-background-inline-policy:continuous; --moz-background-origin:padding; -background:none none repeat scroll 0 0; -float:left; -height:600px; -position:relative; -width:150px; -} -#actionTop { -width: 650px; -height: 300px; -position:relative; -} -#bottom { -clear:both; -float:left; -width: 650px; -height: 300px; -position:relative; -} -#topLtSide { -float:left; -width: 300px; -height: 300px; -position:relative; -} -#topMd { --moz-background-clip:border; --moz-background-inline-policy:continuous; --moz-background-origin:padding; -background:none none repeat scroll 0 0; -float:left; -width: 50px; -height: 300px; -position:relative; -} -#topRtSide { -float:left; -width: 300px; -height:300px; -position:relative; -} -#topLtBox { --moz-background-clip:border; --moz-background-inline-policy:continuous; --moz-background-origin:padding; -background:none none repeat scroll 0 0; -width: 200px; -height: 200px; -left: 75px; -position:absolute; -top:50px; -} - -#topLtCanvas { --moz-background-clip:border; --moz-background-inline-policy:continuous; --moz-background-origin:padding; -background:none none repeat scroll 0 0; -position:absolute; -top: 50px; -left: 75px; -} -#plussign { -display: block; -margin-left: auto; -margin-right: auto; -margin-top: 150px; -} -#topRtBox { -background: none none repeat scroll 0 0; -width: 200px; -height: 200px; -position:absolute; -right: 50px; -top: 50px; -} -#topRtCanvas { -background:none none repeat scroll 0 0; -position:absolute; -left: 50px; -right:50px; -top:50px; -} - -.bottom { --moz-background-clip:border; --moz-background-inline-policy:continuous; --moz-background-origin:padding; -background:none none repeat scroll 0 0; -float:left; -width: 216.5px; -height: 300px; -position:relative; -} - -.bottomBox { - left:25px; - position:absolute; - width: 200px; - height: 200px; - top: 20px; -} - -.sidebarItem { - clear:both; - float:left; - width:150px; - height: 200px; - position: relative; -} - -#timer { -position:absolute; -width:100px; -height:150px; -top:10px; -left:25px; -} - -#timerCanvas { -position:absolute; -width:100px; -height:150px; -top:10px; -left:25px; -} - -#scorebox { -position:absolute; -width:100px; -height:150px; -top:10px; -left:25px; -} - -#scoreboxCanvas { -position:absolute; -width:100px; -height:150px; -top:10px; -left:25px; -} - - -#chimpCanvas { -position:absolute; -top:10px; -left:25px; - -} - -#buttons { -position:absolute; -top:80%; -} - diff --git a/examples/adding_up_to_10_canvas/index.html b/examples/adding_up_to_10_canvas/index.html deleted file mode 100755 index baf36b8..0000000 --- a/examples/adding_up_to_10_canvas/index.html +++ /dev/null @@ -1,82 +0,0 @@ -<!DOCTYPE html> -<html> -<head> - <title>Karma - Adding Up to 10</title> - <meta name="keywords" content="karma,javascript,html5,sugar,sugarlabs,gsoc,ole,nepal" /> - <link type="text/css" rel="stylesheet" href="css/lesson.css" /> - <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> - <link type="image/ico" rel="icon" href="../../../assets/default/image/favicon.ico" /> - <script type="text/javascript" src="../../../js/jquery-1.3.2.min.js"></script> - <script type="text/javascript" src="../../../js/karma.js"></script> - <script type="text/javascript" src="js/lesson.js"></script> - - - -</head> - -<body> - <div> - <div id="action"> - <div id="actionTop"> - - <div id="topLtSide"> - <img id="topLtBox" src="assets/image/yellowBox.png" alt="" /> - <canvas id="topLtCanvas" width="200px" height="200px"></canvas> - - </div> - <div id="topMd"> - <img id="plussign" src="assets/image/plussign.png" alt=""/> - </div> - <div id="topRtSide"> - <img id="topRtBox" src="assets/image/yellowBox.png" alt=""/> - <canvas id="topRtCanvas" width="200px" height="200px"></canvas> - </div> - - </div> - - <div id="bottom"> - <!-- <canvas id="bottomCanvas"></canvas> --> - <div id="bottomLt" class="bottom"> - <img class="bottomBox" src="assets/image/yellowBox.png" alt=""/> - <canvas id="bottomLtCanvas" class="bottomBox" width="200px" height="200px"> </canvas> - </div> - <div id="bottomMd" class="bottom"> - <img class="bottomBox" src="assets/image/yellowBox.png" alt=""/> - <canvas id="bottomMdCanvas" class="bottomBox" width="200px" height="200px"> </canvas> - </div> - <div id="bottomRt" class="bottom"> - <img class="bottomBox" src="assets/image/yellowBox.png" alt=""/> - <canvas id="bottomRtCanvas" class="bottomBox" width="200px" height="200px"> </canvas> - </div> - - </div> - - </div> - <div id="sidebar"> - <div class="sidebarItem"> - <img id="timer" src="assets//image/scorebox.png" alt=""/> - <canvas id="timerCanvas" width="100px" height="140px" > </canvas> - </div> - <div class="sidebarItem"> - <img id="scorebox" src="assets/image/scorebox.png" alt=""/> - <canvas id="scoreboxCanvas" width="100px" height="140px"></canvas> - </div> - <div class="sidebarItem"> - <canvas id="chimpCanvas" width="120px" height="125px"> </canvas> - <div id="buttons"> - <button id="start">Start</button> - <button id="stop">Stop</button> - <button id="reset">Restart</button> - </div> - </div> - - - </div> - - - </div> - - -</body> - -</html> diff --git a/examples/adding_up_to_10_canvas/js/lesson.js b/examples/adding_up_to_10_canvas/js/lesson.js deleted file mode 100755 index efabd88..0000000 --- a/examples/adding_up_to_10_canvas/js/lesson.js +++ /dev/null @@ -1,300 +0,0 @@ -$(document).ready( - function(){ - - var k = Karma({ - image: [ - {name: "ball", file: "ball37px.png"}, - {name: "balloon", file: "balloon37px.png"}, - {name: "banana", file: "banana37px.png"}, - {name: "chilli", file: "chilli.png"}, - {name: "fish" , file: "fish64px.png"}, - {name: "flower", file: "flower37px.png"}, - {name: "normalChimp", file: "normalChimp_120x125.png"}, - {name: "happyChimp", file: "happyChimp_120x125.png"}, - {name: "sadChimp", file: "sadChimp_120x125.png"} - ] - , - audio: [ - {name: "correct", file: "correct.ogg"}, - {name: "incorrect", file: "incorrect.ogg"}, - {name: "trigger", file: "trigger.ogg"} - ], - canvas: [ - {name:"topLt", domId:"topLtCanvas"}, - {name:"topRt", domId:"topRtCanvas"}, - {name:"bottomLt", domId:"bottomLtCanvas"}, - {name:"bottomMd", domId:"bottomMdCanvas"}, - {name:"bottomRt", domId:"bottomRtCanvas"}, - {name:"timer", domId:"timerCanvas"}, - {name:"scorebox", domId:"scoreboxCanvas"}, - {name:"chimp", domId:"chimpCanvas"} - ] - }); - - - k.ready(function() { - var imgNames = ["ball", "banana", "balloon","chilli", "fish", "flower"]; - //game logic - var total, level=0, time, n0, n1, correct; - var maskd=200; - var d=160; - var choices=[]; - var score = 0; - var speed = 2000; - var playerCorrect = 0; - var endTimerX = 80; - var startTimerY = 10; - var endTimerY = 100; - var offsetTimerY = 5; - var timerId; - var isGameRunning = false; - - var timerFn = function () { - k.canvas['timer'].clear(); - - if ( startTimerY >= endTimerY ){ - //you didn't answer in time - k.audio["trigger"].play(); - answer(false, true); - game(); - } - else { - k.canvas['timer'].clear(); - startTimerY = startTimerY + offsetTimerY; - k.canvas['timer'].fillStyle("#ffffff"). - fillRect(10, startTimerY, endTimerX, 20); - } - }; - - function game () { - $.each(k.canvas, function () { - if (this.name != "chimp"){ - this.clear(); - } - }); - - - writeScore(); - total = Karma.rand( 2, 10 ); //the total - n0 = total - Karma.rand(1, total - 1 ); //first number - n1 = total - n0; //second number - - //chose one option (the correct option) - //and then put the correct value into it - correct = Karma.rand( 0, 2 ); - choices[ correct ] = total; - - for (var i=0; i<3; i++) { - //generate the two other options - if ( choices[i] === total) { - continue; - } else { - // generate the other options - choices[ i ] = Karma.rand( 2, 10 ); - for (var j = 0; j < i; j++){ - if (choices[i] === choices[j]) { - choices[ i ] = Karma.rand( 2, 10 ); - } - } - } - } - - var imgId = imgNames[ level ] ; - - - var card = function (canvas, n, minx, miny, d ) { - canvas.save(); - var pos = []; - var x, y, flag; - - - for (var i=0; i<n; i++) { - do { - flag = false; - x = Karma.rand( 0, d ); - y = Karma.rand( 0, d ); - for ( var j=0; j<pos.length; j++) { - if ( Karma.distance2( pos[j], - {"x": x, "y": y} ) < 120 ) { - flag = true; - break; - } - } - - }while ( flag === true ); - pos.push( { "x":x, "y": y } ); - //k.image[ imgId ].draw(canvas, x, y ) - canvas.drawImage(k.image[imgId].media, x, y); - } - - - - canvas.restore(); - }; - - - //put the cards - card(k.canvas["topLt"], n0 , 0, 0, d); - card(k.canvas["topRt"], n1 , 0, 0, d); - card(k.canvas["bottomLt"], choices[ 0 ] , 0, 0, d); - card(k.canvas["bottomMd"], choices[ 1 ] , 0, 0, d); - card(k.canvas["bottomRt"], choices[ 2 ] , 0, 0, d); - - } - - var writeScore = function (){ - k.canvas["scorebox"].save(). - clear(). - font("bold 50px sans-serif white"). - fillStyle("#fff"). - textBaseline("middle"). - fillText("" + score, 30, 100). - restore(); - }; - - var answer = function (correct, tooSlow) { - - if ( correct === false) { - //answer was incorrect or took too long - score = score - 1; - playerCorrect = playerCorrect - 1; - writeScore(); - if (tooSlow === true) { - k.audio[ "trigger" ].play(); - } else { - k.audio[ "incorrect" ].play(); - } - animateChimp(false); - - } else { - score = score + 1; - playerCorrect = playerCorrect + 1; - writeScore(); - k.audio[ "correct" ].play(); - animateChimp(true); - if (playerCorrect === 5){ - level = (level+1)% imgNames.length; - speed = speed - 300; - playerCorrect = 0; - } - } - - changeTimer('start'); - - }; - - var animateChimp = function (answer) { - var timerChimp; - k.canvas["chimp"].clear(); - if( answer === true){ - k.canvas["chimp"].drawImage( - k.image["happyChimp"].media, 0, 0); - } else { - k.canvas["chimp"].drawImage( - k.image["sadChimp"].media, 0, 0); - } - - var restoreChimp = function () { - k.canvas["chimp"].clear(); - k.canvas["chimp"].drawImage( - k.image["normalChimp"].media, 0, 0); - }; - - timerChimp = setTimeout(restoreChimp, 800); - - - }; - - var changeTimer = function (status){ - startTimerY = 10; - k.canvas["timer"].clear(); - clearInterval(timerId); - - if (status === 'start'){ - timerId = setInterval(timerFn, speed); - } - - }; - - var startStop = function (start) { - score = level = 0; - startTimerY = 10; - isGameRunning = true; - - $.each(k.canvas, function () { - if (this.name != "chimp"){ - this.clear(); - } - }); - - changeTimer('start'); - game(); - - - }; - - var start = function () { - startStop(true); - }; - - - var stop = function () { - isGameRunning = false; - - changeTimer('stop'); - $.each(k.canvas, function () { - if (this.name != "chimp"){ - this.clear(); - } - }); - }; - - var reset = function () { - startStop(true); - }; - - - - - - //put the buttons - var buttons=[]; - buttons[ 0 ] = { "canvas": k.canvas["bottomLt"], "id": 0}; - buttons[ 1 ] = { "canvas": k.canvas["bottomMd"], "id": 1}; - buttons[ 2 ] = { "canvas": k.canvas["bottomRt"], "id": 2}; - - - - $.each(buttons, function( key, item ) { - item.canvas.node - .addEventListener('click', - function ( ev ) { - if(isGameRunning === true){ - if ( choices[ item.id ] === total){ - answer(true); - game(); - }else { - answer(false); - game(); - } - } - }, false); - }); - - document.getElementById('start'). - addEventListener('click', start, false); - - - document.getElementById('stop'). - addEventListener('click', stop, false); - - document.getElementById('reset'). - addEventListener('click', reset, false); - - k.canvas["chimp"].drawImage( - k.image["normalChimp"].media, 0, 0); - - }); - - - });
\ No newline at end of file |
