mocked up header and footer in new layout

17 files changed, 211 insertions, 11 deletions

diff --git a/css/epaath_images/bg_footer.png b/css/epaath_images/bg_footer.png
new file mode 100755
index 0000000..4bd44fa
--- /dev/null
+++ b/css/epaath_images/bg_footer.png
diff --git a/css/epaath_images/bg_header.png b/css/epaath_images/bg_header.png
new file mode 100755
index 0000000..f421817
--- /dev/null
+++ b/css/epaath_images/bg_header.png
diff --git a/css/epaath_images/btn_back.png b/css/epaath_images/btn_back.png
new file mode 100755
index 0000000..d9fbf14
--- /dev/null
+++ b/css/epaath_images/btn_back.png
diff --git a/css/epaath_images/btn_help.png b/css/epaath_images/btn_help.png
new file mode 100755
index 0000000..6753e9c
--- /dev/null
+++ b/css/epaath_images/btn_help.png
diff --git a/css/epaath_images/btn_help_hover.png b/css/epaath_images/btn_help_hover.png
new file mode 100755
index 0000000..d3ccd92
--- /dev/null
+++ b/css/epaath_images/btn_help_hover.png
diff --git a/css/epaath_images/btn_ole.png b/css/epaath_images/btn_ole.png
new file mode 100755
index 0000000..0e775e9
--- /dev/null
+++ b/css/epaath_images/btn_ole.png
diff --git a/css/epaath_images/btn_ole_hover.png b/css/epaath_images/btn_ole_hover.png
new file mode 100755
index 0000000..c43c5f7
--- /dev/null
+++ b/css/epaath_images/btn_ole_hover.png
diff --git a/css/epaath_images/correct.png b/css/epaath_images/correct.png
new file mode 100755
index 0000000..f2dbc5a
--- /dev/null
+++ b/css/epaath_images/correct.png
diff --git a/css/epaath_images/title_block_lt.png b/css/epaath_images/title_block_lt.png
new file mode 100755
index 0000000..b1c0e90
--- /dev/null
+++ b/css/epaath_images/title_block_lt.png
diff --git a/css/epaath_images/title_block_rt.png b/css/epaath_images/title_block_rt.png
new file mode 100755
index 0000000..275daaf
--- /dev/null
+++ b/css/epaath_images/title_block_rt.png
diff --git a/css/epaath_images/wrong.png b/css/epaath_images/wrong.png
new file mode 100755
index 0000000..edfe9c5
--- /dev/null
+++ b/css/epaath_images/wrong.png
diff --git a/css/karma.css b/css/karma.css
index 2ef9dc6..454f3f5 100755
--- a/css/karma.css
+++ b/css/karma.css
@@ -21,3 +21,172 @@
 	}
 }
 
+
+#kHeader{
+    background-image: url('./epaath_images/bg_header.png');
+    background-repeat: repeat-x;
+    height: 89px;
+    width: 100%;
+    position: absolute;
+    top: 0em;
+
+/*
+    width: 100%;
+    height: 5.4em;
+    position: absolute;
+    top: 0em;
+*/
+}
+
+
+
+
+#topbtn_left {
+	float: left;
+	height: 60px;
+	width: 60px;
+	padding-top: 13px;
+	padding-left: 5px;
+}
+	
+	
+#linkBack{
+    width: 60px;		
+    height: 59px;
+    background-image:url('./epaath_images/btn_back.png');
+}
+#linkBack:hover{
+    background:url('./epaath_images/btn_back_hover.png');
+}
+	
+#lesson_title {
+	float: left;
+	font-family: Verdana, Arial, Helvetica, sans-serif;
+	font-size: 16pt;
+	font-weight: bold;
+	color: #FFFFFF;
+	margin-left: 10px;
+	background-image: url(./epaath_images/bg_title_block.png);
+}
+#topbtn_right {
+	float: right;
+	height: 60px;
+	width: 60px;
+	padding-top: 13px;
+	padding-right: 5px;
+}
+#linkHelp{
+    width: 60px;		height: 60px;
+    background:url(./epaath_images/btn_help.png);
+}
+		#linkHelp:hover{
+			background:url(./epaath_images/btn_help_hover.png);
+		}
+		#linkOle{
+			width: 60px;		height: 60px;
+			background:url(./epaath_images/btn_ole.png);
+		}
+		#linkOle:hover{
+			background:url(./epaath_images/btn_ole_hover.png);
+		}
+		#linkNext{
+			width: 60px;		height: 60px;
+			background:url(./epaath_images/btn_next.png);
+		}
+		#linkNext:hover{
+			background:url(./epaath_images/btn_next_hover.png);
+		}
+
+
+#kFooter{
+  background-image: url('./epaath_images/bg_header.png');
+  width: 100%;
+  height: 5.4em;
+  position: absolute;
+  bottom: 0em;
+}
+
+#kFooter>div{
+  margin-top: 0.4em;
+  margin-bottom: 0.3em;
+  margin-right: 0.4em;
+  float:right;
+}
+
+
+/*
+
+#header {
+	background-image: url(../assets/image/bg_header.png);
+	background-repeat: repeat-x;
+	height: 89px;
+	width: 100%;
+	position: absolute;
+	left: 0px;
+	top: 0px;
+}
+#topbtn_left {
+	float: left;
+	height: 60px;
+	width: 60px;
+	padding-top: 13px;
+	padding-left: 5px;
+}
+	
+	
+	#linkBack{
+			width: 60px;		height: 59px;
+			background:url(../assets/image/btn_back.png);
+		}
+	#linkBack:hover{
+			background:url(../assets/image/btn_back_hover.png);
+		}
+	
+#lesson_title {
+	float: left;
+	font-family: Verdana, Arial, Helvetica, sans-serif;
+	font-size: 16pt;
+	font-weight: bold;
+	color: #FFFFFF;
+	margin-left: 10px;
+	background-image: url(../assets/image/bg_title_block.png);
+}
+#topbtn_right {
+	float: right;
+	height: 60px;
+	width: 60px;
+	padding-top: 13px;
+	padding-right: 5px;
+}
+		#linkHelp{
+			width: 60px;		height: 60px;
+			background:url(../assets/image/btn_help.png);
+		}
+		#linkHelp:hover{
+			background:url(../assets/image/btn_help_hover.png);
+		}
+		#linkOle{
+			width: 60px;		height: 60px;
+			background:url(../assets/image/btn_ole.png);
+		}
+		#linkOle:hover{
+			background:url(../assets/image/btn_ole_hover.png);
+		}
+		#linkNext{
+			width: 60px;		height: 60px;
+			background:url(../assets/image/btn_next.png);
+		}
+		#linkNext:hover{
+			background:url(../assets/image/btn_next_hover.png);
+		}
+#footer {
+	background-image: url(../assets/image/bg_footer.png);
+	background-repeat: repeat-x;
+	position: absolute;
+	height: 69px;
+	width: 100%;
+	left: 0px;
+	bottom: 0px;
+}
+
+*/
\ No newline at end of file
diff --git a/css/theme/images/epaath_bg_footer.png b/css/theme/images/epaath_bg_footer.png
new file mode 100755
index 0000000..4bd44fa
--- /dev/null
+++ b/css/theme/images/epaath_bg_footer.png
diff --git a/css/theme/images/epaath_bg_header.png b/css/theme/images/epaath_bg_header.png
new file mode 100755
index 0000000..f421817
--- /dev/null
+++ b/css/theme/images/epaath_bg_header.png
diff --git a/examples/English_Animal_Identification/index.html b/examples/English_Animal_Identification/index.html
index 739fce2..87e7600 100755
--- a/examples/English_Animal_Identification/index.html
+++ b/examples/English_Animal_Identification/index.html
@@ -17,11 +17,32 @@
 	<script type="text/javascript" src="js/lesson.js"></script>

 </head>

 <body>

-	<div id="scoreArea">

+	<div id="kHeader">

+	  <div id="lesson_title">

+	    <div id="topbtn_left">

+	      <div id="linkBack"><a href="http://olenepal.org"></a>

+	      </div>

+	    </div>

+	    <div id="lesson_title">

+	    <img src="./epaath_images/title_block_lt.png" width="33" height="89" align="absmiddle" alt="" />

+	    English Prepositions<span id="currentTitle"></span> 

+	    <img src="./epaath_images/title_block_rt.png" width="33" height="89" align="absmiddle" />		

+	    </div>

+	    <div id="topbtn_right">

+	      <a href="#">

+		<div id="linkHelp">

+		</div>

+	      </a>

+	    </div>

+	    <div id="topbtn_right">

+		  <a href="http://olenepal.org">

+		    <div id="linkOle">

+		    </div>

+		  </a>

+	    </div>	

+	  </div>

 	</div>

 

-	

-

 	<div id="gameArea">

 		<div id="questionBox">What is this?</div>

 		<img class = "imageBox" id="imgObject" src="" alt=""/>

@@ -40,5 +61,9 @@
 			Game Over

 		</div>

 	</div>

+	<div id="kFooter">

+	  <div id="scoreArea">

+	  </div>

+	</div>

 </body>

 </html>
\ No newline at end of file
diff --git a/index.html b/index.html
index ca8c036..132ae3e 100755
--- a/index.html
+++ b/index.html
@@ -86,7 +86,7 @@
   <div id="footer">
   Karma.js is licensed under the 
   <a href="http://www.opensource.org/licenses/mit-license.php"> MIT License</a>. Karma is a sub-project of <a href="http://sugarlabs.org">SugarLabs</a> and sponsored by <a href="http://www.olenepal.org">OLE Nepal</a>. <br />
-  Copyright (c) 2009 Bryan Willson Berry
+  Copyright (c) 2009 Bryan Willson Berry, MIT License
   </div>
   
 
diff --git a/js/ui.scoreboard.js b/js/ui.scoreboard.js
index 0ffb835..9704c20 100755
--- a/js/ui.scoreboard.js
+++ b/js/ui.scoreboard.js
@@ -114,9 +114,15 @@
 			  if (self._getData('locale') === "ne"){
 			      switch(str){
 				  case "Score":
-				      return "foo";
+				      return "अङ्क";
 				  case "Total":
-				      return "bar";
+				      return "जम्मा";
+				  case "Restart":
+				      return "फेरी खेलौ";
+				  case "Pause":
+				      return "खेल रोकौ";
+				  case "Start":
+				      return "सुरु गरौ";
 				  default:
 				      return "string not translated";
 			      }
@@ -178,7 +184,7 @@
 			  .find('span:first');
 
 
-		     $("<div><span>Total</span></div>")
+		     $("<div><span>" + this._("Total") + "</span></div>")
 			  .addClass('ui-scoreboard-spacing-' + layoutId +
 				    ' ui-corner-all ' + 
 				    'ui-scoreboard-text')
@@ -201,7 +207,7 @@
 			  			+ 'ui-scoreboard-icon')
 			      )
 			      .append( 
-				      $('<span>Restart</span>')
+				      $('<span></span>')
 					  .addClass('centered')
 			      );
 		       
@@ -211,7 +217,7 @@
 			      .addClass('ui-icon-arrowrefresh-1-w') 
 			      .end()
 			      .find('span:last') 
-			      .text('Restart')
+			      .text(this._('Restart'))
 			      .end()
 			      .click(function(){ self.restart();})
 			      .appendTo($parent);	  
@@ -226,7 +232,7 @@
 			    .addClass('ui-icon-pause') 
 			    .end()
 			    .find('span:last') 
-			    .text('Pause')
+			    .text(this._('Pause'))
 			    .end()
 			    .click(function(){ 
 				       self.element.trigger('scoreboardPause'); 
@@ -241,7 +247,7 @@
 		              .addClass('ui-icon-arrowreturnthick-1-s')
 		              .end()
 			      .find('span:last')
-			      .text('Start')
+			      .text(this._('Start'))
 		              .end()
 			      .click(function(){ 
 				       self.element.trigger('scoreboardStart');