Web   ·   Wiki   ·   Activities   ·   Blog   ·   Lists   ·   Chat   ·   Meeting   ·   Bugs   ·   Git   ·   Translate   ·   Archive   ·   People   ·   Donate
summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorRoshan Karki <roxan@roxan-desktop.(none)>2009-12-28 06:03:14 (GMT)
committer Roshan Karki <roxan@roxan-desktop.(none)>2009-12-28 06:03:14 (GMT)
commit3b9ee3ef45975db98ac39146bd852f083891494f (patch)
tree80736b9162ed269fa058bfe9da0be1476112c97a
parent5e002b76e97c88142491a4296cbcebf3587129b1 (diff)
added lesson numberwords for testing
Diffstat
-rw-r--r--examples/NumberWords/assets/image/football.pngbin0 -> 6840 bytes
-rw-r--r--examples/NumberWords/assets/image/gameOver.pngbin0 -> 13740 bytes
-rw-r--r--examples/NumberWords/css/lesson.css54
-rw-r--r--examples/NumberWords/index.html33
-rw-r--r--examples/NumberWords/js/lesson.js106
5 files changed, 193 insertions, 0 deletions
diff --git a/examples/NumberWords/assets/image/football.png b/examples/NumberWords/assets/image/football.png
new file mode 100644
index 0000000..93dbd71
--- /dev/null
+++ b/examples/NumberWords/assets/image/football.png
Binary files differ
diff --git a/examples/NumberWords/assets/image/gameOver.png b/examples/NumberWords/assets/image/gameOver.png
new file mode 100644
index 0000000..8114f48
--- /dev/null
+++ b/examples/NumberWords/assets/image/gameOver.png
Binary files differ
diff --git a/examples/NumberWords/css/lesson.css b/examples/NumberWords/css/lesson.css
new file mode 100644
index 0000000..1850cdc
--- /dev/null
+++ b/examples/NumberWords/css/lesson.css
@@ -0,0 +1,54 @@
+table {
+cursor: pointer;
+border-collapse: collapse;
+border: 1px solid #000000;
+background-color: #FFCC00;
+}
+
+td {
+background-color: #ffcc00;
+border: 1px solid #000000;
+width: 35px;
+height:35px;
+text-align: center;
+font-weight: bold;
+font-size: 18px;
+}
+.done {
+background-color: #336699;
+
+}
+.highlight {
+background-color: #336600;
+}
+
+#left{
+position: relative;
+float:left;
+}
+
+#right{
+position:relative;
+float:left;
+margin: 10px 0 0 25px;
+font-size: 30px;
+}
+
+#right > div {
+}
+
+#question {
+margin: 25px;
+}
+
+#instructions {
+color: blue;
+font-weight: bold;
+font-size: 20px;
+width: 600px;
+}
+
+#over {
+float:left;
+margin: 0 0 0 50px;
+}
diff --git a/examples/NumberWords/index.html b/examples/NumberWords/index.html
new file mode 100644
index 0000000..c921aca
--- /dev/null
+++ b/examples/NumberWords/index.html
@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <link rel="stylesheet" href="css/lesson.css" />
+ <script type="text/javascript" src="../../js/raphael-min.js"></script>
+ <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 id="instructions">Count the number of footballs in the box and find the corresponding number word in the crossword puzzle.</div>
+ <div id="question"></div>
+ <div id="main">
+ <div id="left">
+ <table>
+ </table>
+ </div>
+ <div id="right">
+ <div id="eleven">Eleven (11)</div>
+ <div id="twelve">Twelve (12)</div>
+ <div id="thirteen">Thirteen (13)</div>
+ <div id="fourteen">Fourteen (14)</div>
+ <div id="fifteen">Fifteen (15)</div>
+ <div id="sixteen">Sixteen (16)</div>
+ <div id="seventeen">Seventeen (17)</div>
+ <div id="eighteen">Eighteen (18)</div>
+ <div id="nineteen">Nineteen (19)</div>
+ <div id="twenty">Twenty (20)</div>
+ </div>
+ <div id="over"><img src="assets/image/gameOver.png" /></div>
+ </div>
+ </body>
+</html>
diff --git a/examples/NumberWords/js/lesson.js b/examples/NumberWords/js/lesson.js
new file mode 100644
index 0000000..3b1ba17
--- /dev/null
+++ b/examples/NumberWords/js/lesson.js
@@ -0,0 +1,106 @@
+$(document).ready (function(){
+ var k = Karma ({
+ image: [{name:"football", file:"football.png"}]
+ });
+ k.ready(function() {
+ var ELEVEN=["30","40","50","60","70","80"]; //coordinates of each answer
+ var TWELVE=["32","33","34","35","36","37"];
+ var THIRTEEN=["32","42","52","62","72","82","92","102"];
+ var FOURTEEN=["39","49","59","69","79","89","99","109"];
+ var FIFTEEN=["38","48","58","68","78","88","98"];
+ var SIXTEEN=["47","56","65","74","83","92","101"];
+ var SEVENTEEN=["210","29","28","27","26","25","24","23"];
+ var EIGHTEEN=["03","04","05","06","07","08","09","010"];
+ var NINETEEN=["10","11","12","13","14","15","16","17"];
+ var TWENTY=["103","104","105","106","107","108"];
+ var ANS=["eleven","twelve","thirteen","fourteen","fifteen","sixteen","seventeen","eighteen","nineteen","twenty"];
+ var ARR=[ELEVEN,TWELVE,THIRTEEN,FOURTEEN,FIFTEEN,SIXTEEN,SEVENTEEN,EIGHTEEN,NINETEEN,TWENTY]; //list of all coordinates
+ var opt="ONRELEVENCOTIXRAJSFTMNCNNTHIRTEENEEEWTLGEERTITEEGRFTATWGETLRMXWCAEHENVEIAQPFNTNEESOTETMTERVFIFTEENYEAEFOURTEENNTSCNCNETON";
+ var question=[0,1,2,3,4,5,6,7,8,9]; //this array will be shuffled and the variable key will be used to generate random questions
+ var COLOR=["green","purple","orange","brown","pink"]; //some colors to display correct list on right in random color
+ var counter=0,key;
+ var paper,set;
+ var totalQuest = 10; //total number of questions before gameover is displayed
+
+ var shuffle = function (choices) {
+ for(var i=0;i<choices.length;i++) {
+ var num = k.rand(0,choices.length-1);
+ var temp = choices[i];
+ choices[i]=choices[num];
+ choices[num]=temp;
+ }
+ };
+
+ var updateQuestion = function (){
+ set.remove();
+ set = paper.set();
+ var xx=0,yy=0;
+ for(var i = 0;i<=key+11;i++){
+ set.push(paper.image(k.image.football.src,xx,yy,25,25));
+ xx+=25;
+ if(i===10) {
+ yy+=25;
+ xx=0;
+ }
+ }
+ }
+
+ var showList = function () { //shows the list on right like One (1)
+ $("#"+ANS[key]).show().css({"color":COLOR[k.rand(0,COLOR.length)]});
+ };
+
+ var congrats = function() {
+ $('td[className!="cell"]').unbind('click');
+ $("#over").show();
+ };
+
+ var init = function () { //lesson initialization stuffs
+ shuffle(question); //shuffling to generate random questions
+ key = question[counter]; //the random question to show
+ paper = Raphael("question",250,50);
+ set = paper.set();
+ paper.rect(0,0,250,50);
+ $("#right > div").hide();
+ $("#over").hide();
+ var str="";
+ for(var i=0;i<11;i++) {
+ str+="<tr>";
+ for(var j=0;j<11;j++) {
+ str+="<td class='cell' id='"+String(j)+String(i)+"'>"+opt.charAt((i*11)+j)+"</td>";
+ }
+ str+="</tr>";
+ }
+ $('table').append(str); //table with id and class as cell
+ for(var k=0;k<ARR.length;k++){
+ ARR[k].forEach(function(elem){
+ $("#"+elem).removeClass('cell').addClass(ANS[k]); //if the cell holds correct answer, do the steps
+ });
+ }
+ }
+
+ var addEvent = function() {
+ $('td[className!="cell"]').hover(function(evt){$('.'+evt.target.className.split(' ')[0]).addClass('highlight')}
+ ,function(evt){$('.'+evt.target.className.split(' ')[0]).removeClass('highlight')}).bind('click',function(evt) {
+ clickedAns = (evt.target.className).split(' ')[0];
+ if(clickedAns===ANS[key]) {
+ $('.'+clickedAns).removeClass('highlight').removeClass('clickedAns').addClass('done');
+ showList();
+ counter++;
+ if (counter === totalQuest) {
+ congrats();
+ return;
+ }
+ key = question[counter];
+ updateQuestion();
+ }
+ else {
+ console.log('no');
+ }
+ });
+ };
+
+ init();
+ addEvent();
+ updateQuestion();
+ });
+});
generated by cgit v0.9.1 at 2024-05-02 20:45:23 (GMT)