CH1 FIXED YAY
This commit is contained in:
parent
1455bf4010
commit
9b88ef0d74
13
ch1.html
13
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 ↓</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 ↓</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>
|
||||
|
|
BIN
pics/sci0.png
BIN
pics/sci0.png
Binary file not shown.
Before Width: | Height: | Size: 362 KiB After Width: | Height: | Size: 376 KiB |
BIN
pics/sci1.png
BIN
pics/sci1.png
Binary file not shown.
Before Width: | Height: | Size: 196 KiB After Width: | Height: | Size: 161 KiB |
BIN
pics/sci2.png
BIN
pics/sci2.png
Binary file not shown.
Before Width: | Height: | Size: 309 KiB After Width: | Height: | Size: 312 KiB |
|
@ -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;
|
||||
}
|
||||
|
|
|
@ -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();
|
||||
|
||||
|
|
|
@ -34,6 +34,7 @@ if(!FRONT_ONLY){
|
|||
},1000);
|
||||
|
||||
// AND REMOVE UI
|
||||
// TODO: unless it's the forever-card
|
||||
clicky.kill();
|
||||
|
||||
}
|
||||
|
@ -78,6 +79,7 @@ if(_getQueryVariable("refresh")=="yes"){
|
|||
/////////////////////////////////////////
|
||||
/////////////////////////////////////////
|
||||
|
||||
if(!FRONT_ONLY){
|
||||
var clicky = new createAnimatedUIHelper({
|
||||
x: 355,
|
||||
y: 195,
|
||||
|
@ -85,4 +87,4 @@ var clicky = new createAnimatedUIHelper({
|
|||
height: 100,
|
||||
img: "../../pics/ui_click.png"
|
||||
});
|
||||
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue