build style of lessons

IROpen · Jan 5, 2019 · cbe7594 · cbe7594
1 parent 6a3f678
commit cbe7594
Show file tree

Hide file tree

Showing 6 changed files with 24 additions and 4 deletions.
diff --git a/docs/images/left1.png b/docs/images/left1.png
diff --git a/docs/images/left2.png b/docs/images/left2.png
diff --git a/docs/images/right1.png b/docs/images/right1.png
diff --git a/docs/images/right2.png b/docs/images/right2.png
diff --git a/docs/lessons/1.json b/docs/lessons/1.json
@@ -1,2 +1,2 @@
 {"title":"آشنایی با فارسی اسکریپت",
-"text":"فارسی اسکریپت ابزاری است که زندگی شما را آسان می کند. ساعت چیست ؟ و بکگراند صفحه را به قرمز تغییر-بده . را امتحان کنید . اما این ها بخش ناچیزی از قابلیت های نامحدود فارسی اسکریپت هستند . با فارسی اسکریپت تقریبا هر کاری قابل انجام است ، اما با آموزش  ! پس آموزش را ادامه دهید . "}
+"text":"فارسی اسکریپت ابزاری است که زندگی شما را آسان می کند. ساعت چیست ؟ و بکگراند صفحه را با قرمز رنگ کن . را امتحان کنید . اما این ها بخش ناچیزی از قابلیت های نامحدود فارسی اسکریپت هستند . با فارسی اسکریپت تقریبا هر کاری قابل انجام است ، اما با آموزش  ! پس آموزش را ادامه دهید . "}
diff --git a/docs/taste.html b/docs/taste.html
@@ -30,9 +30,18 @@ <h1>آموزش فارسی اسکریپت</h1>
 	                    در این قسمت علاوه بر این که می توانید آزادانه فارسی اسکریپت را امتحان کنید 
 	                    می توانید به صورت سریع و مختصر فارسی اسکریپت را یاد بگیرید.
 	                    </p>
-	                    <p>
-	                    متاسفانه من هنوز ساخته نشده ام :) من را در گیت هاب کامل کنید .
-	                    </p>
+	                    <div id="lesson-position">
+            <span id="lesson-left-button"><button type="button" id="buttonleft2" class="btn"><img src="images/right2.png" width="16" text="left2"></button></span>
+            <span id="lesson-number">درس 1</span>
+            <span id="lesson-right-button"><button type="button" id="buttonright2" class="btn"><img src="images/left2.png" width="16" text="right2"></button></span>
+            <span id="lesson-step-spacer"></span>
+            <span id="step-left-button"><button type="button" id="buttonleft1" class="btn"><img src="images/right1.png" width="16" text="left1"></button></span>
+            <span id="step-number">گام 1</span>
+            <span id="step-right-button"><button type="button" id="buttonright1" class="btn"><img src="images/left1.png" width="16" text="right1"></button></span>
+       </div>
+       <p>
+       فعلا چیزی در این جا موجود نیست !
+       </p>
 	                </div>
 	            </td>
 	        </tr>
@@ -42,6 +51,17 @@ <h1>آموزش فارسی اسکریپت</h1>
 			t.onCmd = async (x) => {
 				t.print(await FS.eval(x));
 			}
+			function builder(lb,v){
+			    return ()=>{
+			        let t = document.getElementById(lb+'-number').innerHTML;
+			        t = t.substring(0,4)+(Number(t.substring(4))+v);
+			        document.getElementById(lb+'-number').innerHTML = t;
+			    }
+			}
+			document.getElementById('lesson-right-button').onclick = builder('lesson',1);
+			document.getElementById('lesson-left-button').onclick = builder('lesson',-1);
+			document.getElementById('step-right-button').onclick = builder('step',1);
+			document.getElementById('step-left-button').onclick = builder('step',-1);
 		</script>
 	</body>
 </html>