Skip to content

Commit

Permalink
Merge pull request #8 from virtual-labs/main
Browse files Browse the repository at this point in the history
update
  • Loading branch information
ishantdei authored May 20, 2024
2 parents 24038e3 + a010d97 commit 58bb973
Show file tree
Hide file tree
Showing 76 changed files with 4,224 additions and 47 deletions.
Binary file modified experiment/simulation/.DS_Store
Binary file not shown.
6 changes: 3 additions & 3 deletions experiment/simulation/A.html
Original file line number Diff line number Diff line change
Expand Up @@ -36,12 +36,12 @@ <h1 class="rules">Rules-</h1>
<div id="canvas-container">
<canvas id="canvas" width="400" height="400"></canvas>
<div class="dot" id="dot3" style="top: 80px; left: 201px;"></div> <!-- dot1 -->
<div class="dot" id="dot4" style="top: 222px; left: 135px;"></div> <!-- dot2 -->
<div class="dot" id="dot4" style="top: 212px; left: 140px;"></div> <!-- dot2 -->
<div class="dot" id="dot1" style="top: 315px; left: 97px;"></div> <!-- dot3 -->
<div class="dot" id="dot2" style="top: 315px; left: 305px;"></div> <!-- dot5 -->
<div class="dot" id="dot5" style="top: 222px; left: 266px;"></div> <!-- dot4 -->
<div class="dot" id="dot5" style="top: 212px; left: 258px;"></div> <!-- dot4 -->
<img id="sbox" src="/experiment/simulation/Letters/A/sboxx.png" >
<img id="trace" src="/experiment/simulation/Letters/A/A.png" >
<img id="trace" src="/experiment/simulation/Letters/A/AA.png" >
<img class="arrrow1" id="arrow1" src="/experiment/simulation/Letters/A/without-bg.gif" alt="Overlay Image">
<img class="arrrow2" id="arrow2" src="/experiment/simulation/Letters/A/without-bg.gif" alt="Overlay Image">
<img class="arrrow3" id="arrow3" src="/experiment/simulation/Letters/A/without-bg.gif" alt="Overlay Image">
Expand Down
9 changes: 5 additions & 4 deletions experiment/simulation/B.html
Original file line number Diff line number Diff line change
Expand Up @@ -36,11 +36,12 @@ <h1 class="rules">Rules-</h1>

<div id="canvas-container">
<canvas id="canvas" width="400" height="400"></canvas>
<div class="dot" id="dot3" style="top: 80px; left: 145px;"></div>
<div class="dot" id="dot4" style="top: 190px; left: 145px;"></div>
<div class="dot" id="dot1" style="top: 315px; left: 145px;"></div>
<div class="dot" id="dot3" style="top: 80px; left: 136px;"></div>
<div class="dot" id="dot4" style="top: 195px; left: 136px;"></div>
<div class="dot" id="dot1" style="top: 313px; left: 136px;"></div>
<img id="sbox" src="Letters/B/sboxx.png" >
<img id="trace" src="Letters/B/B.png" >
<img id="trace" src="Letters/B/BBBB.png" >

<img class="arrrow1" id="arrow1" src="Letters/B/without-bg.gif" alt="Overlay Image">
<img class="arrrow2" id="arrow2" src="Letters/B/without-bg.gif" alt="Overlay Image">
<img class="arrrow3" id="arrow3" src="Letters/B/without-bg.gif" alt="Overlay Image">
Expand Down
30 changes: 13 additions & 17 deletions experiment/simulation/C.html
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
<link rel="icon" href="images/favicon.ico" />
<link rel="stylesheet" href="css/header.css" />

<link rel="stylesheet" href="Letters/A/A.css" />
<link rel="stylesheet" href="Letters/C/C.css" />


<title>Virtual Labs</title>
Expand All @@ -35,28 +35,24 @@ <h1 class="rules">Rules-</h1>

<div id="canvas-container">
<canvas id="canvas" width="400" height="400"></canvas>
<div class="dot" id="dot3" style="top: 80px; left: 201px;"></div> <!-- dot1 -->
<div class="dot" id="dot4" style="top: 222px; left: 135px;"></div> <!-- dot2 -->
<div class="dot" id="dot1" style="top: 315px; left: 97px;"></div> <!-- dot3 -->
<div class="dot" id="dot2" style="top: 315px; left: 305px;"></div> <!-- dot5 -->
<div class="dot" id="dot5" style="top: 222px; left: 266px;"></div> <!-- dot4 -->
<img id="sbox" src="/experiment/simulation/Letters/A/sboxx.png" >
<img id="trace" src="/experiment/simulation/Letters/A/A.png" >
<img class="arrrow1" id="arrow1" src="/experiment/simulation/Letters/A/without-bg.gif" alt="Overlay Image">
<img class="arrrow2" id="arrow2" src="/experiment/simulation/Letters/A/without-bg.gif" alt="Overlay Image">
<img class="arrrow3" id="arrow3" src="/experiment/simulation/Letters/A/without-bg.gif" alt="Overlay Image">

<img id="stroke1" src="/experiment/simulation/Letters/A/stroke1.png" >
<img id="stroke2" src="/experiment/simulation/Letters/A/stroke1.png" >
<img id="stroke3" src="/experiment/simulation/Letters/A/stroke1.png" >

<div class="dot" id="dot3" style="top: 80px; left: 297px;"></div>
<!-- <div class="dot" id="dot4" style="top: 190px; left: 145px;"></div> -->
<div class="dot" id="dot1" style="top: 315px; left: 297px;"></div>
<img id="sbox" src="./Letters/C/sboxx.png" >
<img id="trace" src="./Letters/C/C.png" >
<img class="arrrow1" id="arrow1" src="./Letters/C/curved arrow.gif" alt="Overlay Image">
<!-- <img class="arrrow2" id="arrow2" src="without-bg.gif" alt="Overlay Image">
<img class="arrrow3" id="arrow3" src="without-bg.gif" alt="Overlay Image"> -->
<img id="stroke1" src="./Letters/C/stroke1.png" >
<!-- <img id="stroke2" src="stroke2.png" >
<img id="stroke3" src="stroke2.png" >-->
</div>

</div>
<!-- Your code goes here-->

<!-- Add JS at the bottom of HTML file -->
<script src="./Letters/A/A.js"></script>
<script src="./Letters/C/C.js"></script>
</body>

</html>
60 changes: 60 additions & 0 deletions experiment/simulation/D.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,60 @@
<!DOCTYPE html>
<html>

<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link href="https://fonts.googleapis.com/css2?family=Open+Sans&amp;family=Raleway&amp;display=swap"
rel="stylesheet" />
<link rel="icon" href="images/favicon.ico" />
<link rel="stylesheet" href="css/header.css" />

<link rel="stylesheet" href="Letters/D/D.css" />


<title>Virtual Labs</title>
</head>

<body>


<div class="simulation-container">

<h2 class="title">Lettering</h2>
<h3 class="instruction-main"> Letter D</h3>

<h1 class="rules">Rules-</h1>
<p class="rule">1] Draw the line in the direction of the arrow on the trace of the letter.</p>
<p class="rule">2] To draw, click on the starting point and drag the cursor to end point .</p>







<div id="canvas-container">
<canvas id="canvas" width="400" height="400"></canvas>
<div class="dot" id="dot3" style="top: 80px; left: 132px;"></div>
<div class="dot1" id="dot4" style="top: 80px; left: 132px;"></div>
<div class="dot" id="dot1" style="top: 315px; left: 132px;"></div>
<div class="dot1" id="dot2" style="top: 315px; left: 132px;"></div>

<img id="sbox" src="./Letters/D/sboxx.png" >
<img id="trace" src="./Letters/D/D.png" >
<img class="arrrow1" id="arrow1" src="./Letters/D/without-bg.gif" alt="Overlay Image">
<img class="arrrow2" id="arrow2" src="./Letters/D/curved arrow.gif" alt="Overlay Image">
<!-- <img class="arrrow3" id="arrow3" src="without-bg.gif" alt="Overlay Image"> -->
<img id="stroke1" src="./Letters/D/stroke1.png" >
<img id="stroke2" src="./Letters/D/stroke2.png" >
<!-- <img id="stroke3" src="stroke2.png" > -->
</div>

</div>
<!-- Your code goes here-->

<!-- Add JS at the bottom of HTML file -->
<script src="./Letters/D/D.js"></script>
</body>

</html>
63 changes: 63 additions & 0 deletions experiment/simulation/E.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,63 @@
<!DOCTYPE html>
<html>

<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link href="https://fonts.googleapis.com/css2?family=Open+Sans&amp;family=Raleway&amp;display=swap"
rel="stylesheet" />
<link rel="icon" href="images/favicon.ico" />
<link rel="stylesheet" href="css/header.css" />

<link rel="stylesheet" href="Letters/E/E.css" />


<title>Virtual Labs</title>
</head>

<body>


<div class="simulation-container">

<h2 class="title">Lettering</h2>
<h3 class="instruction-main"> Letter E</h3>

<h1 class="rules">Rules-</h1>
<p class="rule">1] Draw the line in the direction of the arrow on the trace of the letter.</p>
<p class="rule">2] To draw, click on the starting point and drag the cursor to end point .</p>







<div id="canvas-container">
<canvas id="canvas" width="400" height="400"></canvas>
<div class="dot" id="dot3" style="top: 83px; left: 149px;"></div>
<div class="dot" id="dot4" style="top: 200px; left: 149px;"></div>
<div class="dot" id="dot1" style="top: 319px; left: 149px;"></div>
<div class="dot" id="dot2" style="top: 82.5px; left: 280px;"></div>
<div class="dot" id="dot5" style="top: 200px; left: 252px;"></div>
<div class="dot" id="dot6" style="top: 319px; left: 280px;"></div>
<img id="sbox" src="./Letters/E/sboxx.png" >
<img id="trace" src="./Letters/E/E.png" >
<img class="arrrow1" id="arrow1" src="./Letters/E/without-bg.gif" alt="Overlay Image">
<img class="arrrow2" id="arrow2" src="./Letters/E/without-bg.gif" alt="Overlay Image">
<img class="arrrow3" id="arrow3" src="./Letters/E/without-bg.gif" alt="Overlay Image">
<img class="arrrow4" id="arrow4" src="./Letters/E/without-bg.gif" alt="Overlay Image">
<img id="stroke1" src="./Letters/E/stroke1.png" >
<img id="stroke2" src="./Letters/E/stroke1.png" >
<img id="stroke3" src="./Letters/E/stroke1.png" >
<img id="stroke4" src="./Letters/E/stroke1.png" >
</div>

</div>
<!-- Your code goes here-->

<!-- Add JS at the bottom of HTML file -->
<script src="./Letters/E/E.js"></script>
</body>

</html>
63 changes: 63 additions & 0 deletions experiment/simulation/F.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,63 @@
<!DOCTYPE html>
<html>

<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link href="https://fonts.googleapis.com/css2?family=Open+Sans&amp;family=Raleway&amp;display=swap"
rel="stylesheet" />
<link rel="icon" href="images/favicon.ico" />
<link rel="stylesheet" href="css/header.css" />

<link rel="stylesheet" href="Letters/F/F.css" />


<title>Virtual Labs</title>
</head>

<body>


<div class="simulation-container">

<h2 class="title">Lettering</h2>
<h3 class="instruction-main"> Letter F</h3>

<h1 class="rules">Rules-</h1>
<p class="rule">1] Draw the line in the direction of the arrow on the trace of the letter.</p>
<p class="rule">2] To draw, click on the starting point and drag the cursor to end point .</p>







<div id="canvas-container">
<canvas id="canvas" width="400" height="400"></canvas>
<div class="dot" id="dot3" style="top: 83px; left: 137px;"></div>
<div class="dot" id="dot4" style="top: 202px; left: 137px;"></div>
<div class="dot" id="dot1" style="top: 319px; left: 137px;"></div>
<div class="dot" id="dot2" style="top: 82.5px; left: 273px;"></div>
<div class="dot" id="dot5" style="top: 202px; left: 239px;"></div>

<img id="sbox" src="./Letters/F/sboxx.png" >
<img id="trace" src="./Letters/F/FF.png" >
<img class="arrrow1" id="arrow1" src="./Letters/F/without-bg.gif" alt="Overlay Image">
<img class="arrrow2" id="arrow2" src="./Letters/F/without-bg.gif" alt="Overlay Image">
<img class="arrrow3" id="arrow3" src="./Letters/F/without-bg.gif" alt="Overlay Image">
<img class="arrrow4" id="arrow4" src="./Letters/F/without-bg.gif" alt="Overlay Image">
<img id="stroke1" src="./Letters/F/stroke1.png" >
<img id="stroke2" src="./Letters/F/stroke1.png" >
<img id="stroke3" src="./Letters/F/stroke1.png" >

</div>

</div>
<!-- Your code goes here-->

<!-- Add JS at the bottom of HTML file -->
<script src="./Letters/F/F.js"></script>
</body>

</html>
60 changes: 60 additions & 0 deletions experiment/simulation/G.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,60 @@
<!DOCTYPE html>
<html>

<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link href="https://fonts.googleapis.com/css2?family=Open+Sans&amp;family=Raleway&amp;display=swap"
rel="stylesheet" />
<link rel="icon" href="images/favicon.ico" />
<link rel="stylesheet" href="css/header.css" />

<link rel="stylesheet" href="./Letters/G/G.css" />


<title>Virtual Labs</title>
</head>

<body>


<div class="simulation-container">

<h2 class="title">Lettering</h2>
<h3 class="instruction-main"> Letter G</h3>

<h1 class="rules">Rules-</h1>
<p class="rule">1] Draw the line in the direction of the arrow on the trace of the letter.</p>
<p class="rule">2] To draw, click on the starting point and drag the cursor to end point .</p>







<div id="canvas-container">
<canvas id="canvas" width="400" height="400"></canvas>
<div class="dot" id="dot3" style="top: 87px; left: 280px;"></div>
<!-- <div class="dot" id="dot4" style="top: 190px; left: 145px;"></div> -->
<div class="dot" id="dot1" style="top: 260px; left: 297px;"></div>
<div class="dot" id="dot2" style="top: 198px; left: 297px;"></div>
<div class="dot" id="dot4" style="top: 198px; left: 229px;"></div>
<img id="sbox" src="./Letters/G/sboxx.png" >
<img id="trace" src="./Letters/G/G.png" >
<img class="arrrow1" id="arrow1" src="./Letters/G/curved arrow.gif" alt="Overlay Image">
<img class="arrrow2" id="arrow2" src="./Letters/G/without-bg.gif" alt="Overlay Image">
<img class="arrrow3" id="arrow3" src="./Letters/G/without-bg.gif" alt="Overlay Image">
<img id="stroke1" src="./Letters/G/stroke11.png" >
<img id="stroke2" src="./Letters/G/stroke2.png" >
<img id="stroke3" src="./Letters/G/stroke2.png" >
</div>

</div>
<!-- Your code goes here-->

<!-- Add JS at the bottom of HTML file -->
<script src="./Letters/G/G.js"></script>
</body>

</html>
Loading

0 comments on commit 58bb973

Please sign in to comment.