Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

Fix up number line problem

  • Loading branch information...
commit 42b65ba883c7006bab1fdfa9678eeee92560c460 1 parent 1438922
@xymostech xymostech authored
Showing with 20 additions and 16 deletions.
  1. +20 −16 exercises/number_line.html
View
36 exercises/number_line.html
@@ -15,24 +15,28 @@
<div class="problems">
<div>
<div class="question">
- <p>Drag the orange dot to <strong><var>NUMBER</var></strong>. The distance between adjacent tick marks is 1.</p>
+ <p>Drag the orange dot to <strong><var>NUMBER</var></strong>. The distance between tick marks is 1.</p>
<div class="graphie" id="number-line">
init({
- range: [ [LOWER_BOUND - 1, UPPER_BOUND + 1], [-1, 1] ]
+ range: [[LOWER_BOUND - 1, UPPER_BOUND + 1], [-1, 1]]
});
- line( [ LOWER_BOUND, 0 ], [ UPPER_BOUND, 0 ] );
- for ( var x = LOWER_BOUND; x &lt;= UPPER_BOUND; x++ ) {
- line( [ x, -0.2 ], [ x, 0.2 ] );
+ line([LOWER_BOUND, 0], [UPPER_BOUND, 0]);
+ for (var x = LOWER_BOUND; x &lt;= UPPER_BOUND; x++) {
+ line([x, -0.2], [x, 0.2]);
}
style({ stroke: "#6495ED", strokeWidth: 3.5 });
- line( [ 0, -0.2], [0, 0.2]);
- label( [ 0, -0.53 ], "0", "center", { color: "#6495ED" });
+ line([0, -0.2], [0, 0.2]);
+ label([0, -0.53], "0", "center", { color: "#6495ED" });
addMouseLayer();
- graph.movablePoint = addMovablePoint({ constraints: { constrainY: true }, snapX: 0.25 });
+ graph.movablePoint = addMovablePoint({ constraints: { constrainY: true } });
graph.movablePoint.onMove = function( x, y ) {
- return [ min( max( LOWER_BOUND, x ), UPPER_BOUND ), y ];
+ var newx = round(x);
+ if (abs(newx - x) &lt; 0.25) {
+ x = newx;
+ }
+ return [min(max(LOWER_BOUND, x), UPPER_BOUND), y];
};
</div>
</div>
@@ -41,13 +45,13 @@
<span class="instruction"> Move the orange dot to select your answer. </span>
<div class="guess"> graph.movablePoint.coord[0] </div>
<div class="validator-function">
- if ( guess === 0 ) {
+ if (guess === 0) {
return "";
}
- return abs( NUMBER - guess ) &lt; 0.001;
+ return abs(NUMBER - guess) &lt; 0.001;
</div>
<div class="show-guess">
- graph.movablePoint.setCoord( [ guess, 0 ] );
+ graph.movablePoint.setCoord([guess, 0]);
</div>
</div>
@@ -57,15 +61,15 @@
<div>
<div class="graphie" data-update="number-line">
style({ stroke: "#6495ED", fill: "#6495ED", strokeWidth: 3.5, arrows: "-&gt;" });
- line( [ 0, 0 ], [ NUMBER, 0 ] );
+ line([0, 0], [NUMBER, 0]);
graph.movablePoint.visibleShape.toFront();
</div>
- <p>The orange dot should be <var>plural( abs( NUMBER ), "position")</var> to the <span data-if="NUMBER &lt; 0">left</span><span data-else>right</span> of 0.</p>
+ <p>The orange dot should be <var>plural(abs(NUMBER), "tick mark")</var> to the <span data-if="NUMBER &lt; 0">left</span><span data-else>right</span> of 0.</p>
</div>
<div>
<div class="graphie" data-update="number-line">
- label( [ NUMBER, -0.53 ], NUMBER, "center", { color: "#FFA500" });
- graph.movablePoint.moveTo( NUMBER, 0 );
+ label([NUMBER, -0.53], NUMBER, "center", {color: "#FFA500"});
+ graph.movablePoint.moveTo(NUMBER, 0);
</div>
<p>The orange number shows where <var>NUMBER</var> is on the number line.</p>
</div>
Please sign in to comment.
Something went wrong with that request. Please try again.