CH1 FIXED YAY

ch1.html

@@ -64,8 +64,7 @@ Let me know your honest feedback, thanks!)
 <panel w=600 h=80>
 <words w=600 x=-15 no-bg>
 	Here’s a playable simulation of the Forgetting Curve.
-	<br>
-	<b>Change the rate of “memory decay”. What happens?</b>
+	<b>Change the rate of memory decay. What happens to the curve?</b>
 </words>
 </panel>
 
@@ -109,7 +108,7 @@ But, in general, a memory’s “rate of decay” slows down each time you <b>ac
 	<br>
 	(grey line: what memory would've been <i>without</i> the recall)
 	<br>
-	<b>Change the timing of the recall. What happens?</b>
+	<b>Change the recall timing to see how it affects the curve:</b>
 </words>
 </panel>
 
@@ -133,7 +132,7 @@ But, in general, a memory’s “rate of decay” slows down each time you <b>ac
 	There is! The trick to remembering... 
 </words>
 <words x=210 y=330 w=200>
-	...<i>is to forget.</i>
+	...<i>is to almost forget.</i>
 </words>
 </panel>
 
@@ -174,8 +173,7 @@ You need <b>desirable difficulty</b>: the sweet spot of just-hard-enough.
 <words w=600 x=-15 no-bg>
 	Same simulation as before, but now it shows the <span style="background:#ffe866">sweet spot</span> –
 	where you’ve forgotten <i>just a little bit.</i>
-	<br>
-	<b>Change the timing of the recall. What happens now?</b>
+	<b>Put the recall in the middle of the sweet spot. What happens?</b>
 </words>
 </panel>
 
@@ -223,6 +221,7 @@ then when you’re ready, <b>flip the card over &darr;</b>
 </words>
 </panel>
 
+<!-- TODO: SAY again, guess THEN flip -->
 <panel w=600 h=300 bg="#e0e0e0">
 <sim x=80 y=0 w=440 h=300 src="sims/singlecard/?card=guessgap"></sim>
 </panel>
@@ -232,7 +231,7 @@ then when you’re ready, <b>flip the card over &darr;</b>
 	Which is very counter-intuitive!
 	You can prove to yourself this is true, by playing with the sim below.
 	<b>
-	Get all recalls into the <span style="background:#ffe866">sweet spot</span>.
+	Get all recalls into the middle of the <span style="background:#ffe866">sweet spot</span>.
 	What spacing do you get?
 	</b>
 </words>

sims/ebbinghaus/ebbinghaus.css

@@ -99,16 +99,16 @@ input[fullw]{
 .decay_slider::-webkit-slider-thumb{
     -webkit-appearance: none;
     appearance: none;
-     width: 25px;
-    height: 25px;
-    border-radius: 50%;
+     width: 15px;
+    height: 35px;
+    border-radius: 8px; 
     background: #333;
     cursor: pointer;
 }
 .decay_slider::-moz-range-thumb{
-	 width: 25px;
-    height: 25px;
-    border-radius: 50%;
+	 width: 15px;
+    height: 35px;
+    border-radius: 8px; 
     background: #333;
     cursor: pointer;
 }
@@ -118,16 +118,16 @@ input[fullw]{
 .sweet_slider::-webkit-slider-thumb{
     -webkit-appearance: none;
     appearance: none;
-    width: 30px;
-    height: 30px;
-    border-radius: 50%;
+    width: 15px;
+    height: 35px;
+    border-radius: 8px; 
     background: #ffDD00;
     cursor: pointer;
 }
 .sweet_slider::-moz-range-thumb{
-	width: 30px;
-    height: 30px;
-    border-radius: 50%;
+	width: 15px;
+    height: 35px;
+    border-radius: 8px; 
     background: #ffDD00;
     cursor: pointer;
 }

sims/ebbinghaus/ebbinghaus.js

@@ -439,6 +439,8 @@ function update(){
 		}
 
 		// DRAW THE MAIN THICK CURVES
+		var theLastPoint = null;
+		var theCircles = [];
 		ctx.lineWidth = 5;
 		// For each curve, draw until cut.
 		for(var c=0; c<curves.length; c++){
@@ -462,16 +464,28 @@ function update(){
 					}else{
 						ctx.lineTo(p.x,p.y);
 					}
+					theLastPoint = {x:p.x, y:p.y, distance:Math.abs(point.m-optimal)};
 				}else if(!imCut){
 					p = _project(point.t, 1);
 					ctx.lineTo(p.x,p.y);
 					imCut = true;
+					theCircles.push(theLastPoint);
 				}
 			}
 			ctx.stroke();
 
 		}
 
+		// DRAW THE CIRCLES
+		for(var i=0; i<theCircles.length; i++){
+			var circ = theCircles[i];
+			var d = circ.distance;
+			ctx.fillStyle = (d<OPTIMAL_RANGE/2) ? "#FFDD00" : "#FF4040";
+			ctx.beginPath();
+			ctx.arc(circ.x, circ.y, 8, 0, Math.TAU, false);
+			ctx.fill();
+		}
+
 		// And, again...
 		ctx.restore();
 

sims/singlecard/singlecard.js

@@ -34,6 +34,7 @@ if(!FRONT_ONLY){
 			},1000);
 
 			// AND REMOVE UI
+			// TODO: unless it's the forever-card
 			clicky.kill();
 
 		}
@@ -78,11 +79,12 @@ if(_getQueryVariable("refresh")=="yes"){
 /////////////////////////////////////////
 /////////////////////////////////////////
 
-var clicky = new createAnimatedUIHelper({
-	x: 355,
-	y: 195,
-	width: 100,
-	height: 100,
-	img: "../../pics/ui_click.png"
-});
-
+if(!FRONT_ONLY){
+	var clicky = new createAnimatedUIHelper({
+		x: 355,
+		y: 195,
+		width: 100,
+		height: 100,
+		img: "../../pics/ui_click.png"
+	});
+}