Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

Merge and squash pull request #25699 from mwittels/proofsPart1

Closes #25699

commit fee767d
Author: Mark Wittels <mark@khanacademy.org>
Date:   Tue Jul 10 16:26:18 2012 -0700

    users can add up to 3 tick marks to figures

commit 3c1c4e3
Author: Mark Wittels <mark@khanacademy.org>
Date:   Tue Jul 10 16:10:52 2012 -0700

    remove superfluous code tags

commit c6d0388
Author: Mark Wittels <mark@khanacademy.org>
Date:   Tue Jul 10 15:38:05 2012 -0700

    fixed bug with proof representation, removed console.logs

commit ce26ed2
Author: Mark Wittels <mark@khanacademy.org>
Date:   Tue Jul 10 15:30:53 2012 -0700

    representation of known proof in predictable order, allows reflexive property on one problem type

commit 08316a0
Author: Mark Wittels <mark@khanacademy.org>
Date:   Tue Jul 10 15:12:11 2012 -0700

    intro proof exercise statement entry and dynamic hints

commit d6348ae
Author: Mark Wittels <mark@khanacademy.org>
Date:   Mon Jul 9 20:16:30 2012 -0700

    fix proof output bug in geo proofs 2

commit 6316168
Author: Mark Wittels <mark@khanacademy.org>
Date:   Mon Jul 9 19:18:31 2012 -0700

    intro proofs vertical case working

commit 99d4689
Author: Mark Wittels <mark@khanacademy.org>
Date:   Mon Jul 9 16:42:33 2012 -0700

    changed highlighting to work with appengine load order

commit 63bfc3b
Author: Mark Wittels <mark@khanacademy.org>
Date:   Mon Jul 9 16:08:09 2012 -0700

    changed figure in find-wrong-statement exercise, updated problem descriptions

commit 11a00d2
Author: Mark Wittels <mark@khanacademy.org>
Date:   Mon Jul 9 16:00:47 2012 -0700

    changed figure in fill-in-blanks exercise

commit 76d3b77
Author: Mark Wittels <mark@khanacademy.org>
Date:   Mon Jul 9 02:04:55 2012 -0700

    fixed errors where statements were duplicated in proof, hints were undefined

commit 853771f
Author: Mark Wittels <mark@khanacademy.org>
Date:   Sun Jul 8 23:46:29 2012 -0700

    fixing merge conflicts part II

commit 9667caf
Merge: 39c0dfa 0d92ec0
Author: Mark Wittels <mark@khanacademy.org>
Date:   Sun Jul 8 23:39:31 2012 -0700

    merge conflicts

commit 39c0dfa
Author: Mark Wittels <mark@khanacademy.org>
Date:   Sun Jul 8 23:37:30 2012 -0700

    renamed first exercise to geo proofs intro

commit 9dc99f3
Author: Mark Wittels <mark@khanacademy.org>
Date:   Sun Jul 8 23:34:20 2012 -0700

    changed triangle highlighting to not rely on triangle proof objects
  • Loading branch information...
commit ed0be47ab9141afa384e0b300086b78c6201421c 1 parent 7547602
mwittels mwittels authored beneater committed
413 exercises/geometry_proofs_1.html
View
@@ -17,67 +17,59 @@
<body>
<div class="exercise">
<div class="vars">
- <var id="A">[-4,2]</var>
- <var id="B">[4,2]</var>
- <var id="C">[0,0]</var>
- <var id="D">[-4,-2]</var>
- <var id="E">[4,-2]</var>
-
- <var id="POINTS">["A","B","C","D","E"]</var>
-
<var id="AB">new Seg("A","B")</var>
<var id="BA">AB</var>
<var id="AC">new Seg("A","C")</var>
<var id="CA">AC</var>
<var id="AD">new Seg("A","D")</var>
<var id="DA">AD</var>
- <var id="AE">new Seg("A","E")</var>
- <var id="EA">AE</var>
+ <var id="AF">new Seg("A","F")</var>
+ <var id="FA">AF</var>
<var id="BC">new Seg("B","C")</var>
<var id="CB">BC</var>
<var id="BD">new Seg("B","D")</var>
<var id="DB">BD</var>
<var id="BE">new Seg("B","E")</var>
<var id="EB">BE</var>
- <var id="CD">new Seg("C","D")</var>
- <var id="DC">CD</var>
<var id="CE">new Seg("C","E")</var>
<var id="EC">CE</var>
+ <var id="CF">new Seg("C","F")</var>
+ <var id="FC">CF</var>
<var id="DE">new Seg("D","E")</var>
<var id="ED">DE</var>
-
-
- <var id="SEGS">[AB,BA,AC,CA,AD,DA,AE,EA,BC,CB,BD,DB,CD,DC,CE,EC,DE,ED]</var>
-
- <var id="ang1">new Ang("D","A","C", null)</var>
- <var id="ang2">new Ang("C","A","B", null)</var>
- <var id="ang3">new Ang("C","B","A", null)</var>
- <var id="ang4">new Ang("C","B","E", null)</var>
- <var id="ang5">new Ang("A","C","B", null)</var>
- <var id="ang6">new Ang("A","C","D", null)</var>
- <var id="ang7">new Ang("B","C","E", null)</var>
- <var id="ang8">new Ang("D","C","E", null)</var>
- <var id="ang9">new Ang("A","D","C", null)</var>
- <var id="ang10">new Ang("C","D","E", null)</var>
- <var id="ang11">new Ang("C","E","D", null)</var>
- <var id="ang12">new Ang("C","E","B", null)</var>
+ <var id="DF">new Seg("D","F")</var>
+ <var id="FD">DF</var>
+ <var id="EF">new Seg("E","F")</var>
+ <var id="FE">EF</var>
+
+ <var id="SEGS">[AB,BA,AC,CA,AD,DA,AF,FA,BC,CB,BD,DB,BE,EB,CE,EC,CF,FC,DE,ED,DF,FD,EF,FE]</var>
+
+ <var id="ang1">new Ang("B","A","C")</var>
+ <var id="ang2">new Ang("A","B","C")</var>
+ <var id="ang3">new Ang("A","C","B")</var>
+ <var id="ang4">new Ang("D","B","E")</var>
+ <var id="ang5">new Ang("E","B","C")</var>
+ <var id="ang6">new Ang("B","C","E")</var>
+ <var id="ang7">new Ang("E","C","F")</var>
+ <var id="ang8">new Ang("B","D","E")</var>
+ <var id="ang9">new Ang("B","E","D")</var>
+ <var id="ang10">new Ang("B","E","C")</var>
+ <var id="ang11">new Ang("C","E","F")</var>
+ <var id="ang12">new Ang("C","F","E")</var>
<var id="ANGS">[ang1, ang2, ang3, ang4, ang5, ang6, ang7, ang8, ang9, ang10, ang11, ang12]</var>
- <var id="SUPPLEMENTARY_ANGS">[addAngs(ang5, ang6), addAngs(ang6, ang8), addAngs(ang8, ang7), addAngs(ang7, ang5)]</var>
+ <var id="SUPPLEMENTARY_ANGS">[addAngs(ang2, addAngs(ang5, ang4)), addAngs(ang3, addAngs(ang6, ang7)), addAngs(ang9, addAngs(ang10,ang11))]</var>
- <var id="ALTERNATE_INTERIOR_ANGS">[[ang1, ang12], [ang2, ang11], [ang10, ang3], [ang9, ang4]]</var>
+ <var id="ALTERNATE_INTERIOR_ANGS">[[ang5, ang9], [ang6, ang11]]</var>
- <var id="ABC">new Triang([AB, BC, CA], [ang3, ang5, ang2])</var>
- <var id="BCE">new Triang([BC, CE, EB], [ang7, ang12, ang4])</var>
- <var id="ECD">new Triang([EC, CD, DE], [ang8, ang10, ang11])</var>
- <var id="DCA">new Triang([DC, CA, AD], [ang6, ang1, ang9])</var>
- <var id="ABE">new Triang([AB, BE, EA], [addAngs(ang3, ang4), ang12, ang2])</var>
- <var id="ADE">new Triang([AD, DE, EA], [addAngs(ang9, ang10), ang11, ang1])</var>
- <var id="BED">new Triang([BE, ED, DB], [addAngs(ang12, ang11), ang10, ang4])</var>
- <var id="BAD">new Triang([BA, AD, DB], [addAngs(ang2, ang1), ang9, ang3])</var>
+ <var id="ABC">new Triang([AB, BC, CA], [ang2, ang3, ang1])</var>
+ <var id="BDE">new Triang([BD, DE, EB], [ang8, ang9, ang4])</var>
+ <var id="BCE">new Triang([BC, CE, EB], [ang6, ang10, ang5])</var>
+ <var id="CEF">new Triang([CE, EF, FC], [ang11, ang12, ang7])</var>
+ <var id="ADF">new Triang([AD, DF, FA], [ang8, ang12, ang1])</var>
- <var id="TRIANGLES">[ABC, BCE, ECD, DCA, ABE, ADE, BED, BAD]</var>
+ <var id="TRIANGLES">[ABC, BDE, BCE, CEF]</var>
<var id="STATEMENTS">initProof(SEGS, ANGS, TRIANGLES, SUPPLEMENTARY_ANGS, ALTERNATE_INTERIOR_ANGS, 3, 0.25, "all")</var>
<var id="KNOWN">STATEMENTS[0]</var>
@@ -90,7 +82,7 @@
</div>
<div class="problem">
- <p class="question"> <code> \overline{AB} </code> is parallel to <code> \overline{DE} </code>, and <code> \overline{AD} </code> is parallel to <code> \overline{BE} </code>. Figure not drawn to scale. </p>
+ <p class="question"> <code> \overline{BC} </code> is parallel to <code> \overline{DF} </code>. Figure not drawn to scale. </p>
<div class="graphie">
init({
range: [[-5, 5], [-5, 5]],
@@ -100,11 +92,12 @@
graph.congruency = addCongruency({ y1: -0.7, y2: 10.7 });
- graph.congruency.addPoint("A", [-4, 4]);
- graph.congruency.addPoint("B", [3, 4]);
- graph.congruency.addPoint("C", [0, 0]);
- graph.congruency.addPoint("D", [-3, -4]);
- graph.congruency.addPoint("E", [4, -4]);
+ graph.congruency.addPoint("A", [0, 4]);
+ graph.congruency.addPoint("B", [-2, 0]);
+ graph.congruency.addPoint("C", [2, 0]);
+ graph.congruency.addPoint("D", [-4, -4]);
+ graph.congruency.addPoint("E", [0, -4]);
+ graph.congruency.addPoint("F", [4, -4]);
graph.congruency.addLine({
start: "A",
@@ -126,7 +119,7 @@
});
graph.congruency.addLine({
start: "A",
- end: "E",
+ end: "F",
clickable: true,
maxState: 3
});
@@ -150,37 +143,45 @@
});
graph.congruency.addLine({
start: "C",
- end: "D",
+ end: "E",
clickable: true,
maxState: 3
});
graph.congruency.addLine({
- start: "E",
- end: "D",
+ start: "C",
+ end: "F",
clickable: true,
maxState: 3
});
graph.congruency.addLine({
- start: "C",
+ start: "D",
end: "E",
clickable: true,
maxState: 3
});
+ graph.congruency.addLine({
+ start: "D",
+ end: "F",
+ clickable: true,
+ maxState: 3
+ });
+ graph.congruency.addLine({
+ start: "E",
+ end: "F",
+ clickable: true,
+ maxState: 3
+ });
graph.congruency.addAngles("A", { maxState: 3 });
graph.congruency.addAngles("B", { maxState: 3 });
graph.congruency.addAngles("C", { maxState: 3 });
graph.congruency.addAngles("D", { maxState: 3 });
graph.congruency.addAngles("E", { maxState: 3 });
+ graph.congruency.addAngles("F", { maxState: 3 });
- graph.congruency.addAngle("DAC", { maxState: 3 });
- graph.congruency.addAngle("CAB", { maxState: 3 });
- graph.congruency.addAngle("ABC", { maxState: 3 });
- graph.congruency.addAngle("CBE", { maxState: 3 });
- graph.congruency.addAngle("BEC", { maxState: 3 });
- graph.congruency.addAngle("CED", { maxState: 3 });
- graph.congruency.addAngle("EDC", { maxState: 3 });
- graph.congruency.addAngle("CDA", { maxState: 3 });
+ graph.congruency.addAngle("BAC", { maxState: 3 });
+ graph.congruency.addAngle("EDB", { maxState: 3 });
+ graph.congruency.addAngle("CFE", { maxState: 3 });
for(var angle in graph.congruency.angles){
graph.congruency.angles[angle].setSelectedStyle({
@@ -189,11 +190,13 @@
});
}
- graph.congruency.addLabel("A", "left");
- graph.congruency.addLabel("B", "right");
+ graph.congruency.addLabel("A", "above");
+ graph.congruency.addLabel("B", "left");
graph.congruency.addLabel("C", "right");
- graph.congruency.addLabel("D", "left");
- graph.congruency.addLabel("E", "right");
+ graph.congruency.addLabel("D", "below");
+ graph.congruency.addLabel("E", "below");
+ graph.congruency.addLabel("F", "below");
+
var hintsLeft = FILL_BLANKS_NUM*2;
$(".missingStatement").keyup(function(){
@@ -255,187 +258,129 @@
});
for(var line in graph.congruency.lines){
- for(var line2 in graph.congruency.lines){
-
- $(function(){
- var $statement = $("."+line+"-"+line2);
- var firstLine = graph.congruency.lines[line];
- var secondLine = graph.congruency.lines[line2];
-
- if($statement.length &gt; 0){
- $statement.bind("vmouseover", function(event) {
- firstLine.setHighlighted({
- stroke: ORANGE,
- "stroke-width": 3
- });
- secondLine.setHighlighted({
- stroke: BLUE,
- "stroke-width": 3
- });
- $(this).bind("vmouseout", function(event) {
- firstLine.unsetHighlighted({
- stroke: "black",
- "stroke-width": 2
- });
- secondLine.unsetHighlighted({
- stroke: "black",
- "stroke-width": 2
- });
- });
+ for(var line2 in graph.congruency.lines){
+ (function() {
+ var $statement = $("."+line+"-"+line2);
+ var firstLine = graph.congruency.lines[line];
+ var secondLine = graph.congruency.lines[line2];
+
+ if($statement.length &gt; 0){
+ $statement.live("vmouseover", function(event) {
+ firstLine.setHighlighted({
+ stroke: ORANGE,
+ "stroke-width": 3
+ });
+ secondLine.setHighlighted({
+ stroke: BLUE,
+ "stroke-width": 3
+ });
+ $(this).bind("vmouseout", function(event) {
+ firstLine.unsetHighlighted({
+ stroke: "black",
+ "stroke-width": 2
});
-
- }
+ secondLine.unsetHighlighted({
+ stroke: "black",
+ "stroke-width": 2
+ });
+ });
+ });
+ secondLine.unsetHighlighted({
+ stroke: "black",
+ "stroke-width": 2
});
}
- }
+ })();
+ }
+ }
- for(var angle in graph.congruency.angles){
- for(var angle2 in graph.congruency.angles){
- $(function(){
- var $statement = $("."+angle+"-"+angle2);
- var firstAngle = graph.congruency.angles[angle];
- var secondAngle = graph.congruency.angles[angle2];
-
- if($statement.length &gt; 0){
- $statement.bind("vmouseover", function(event) {
- var firstState = firstAngle.state;
- var secondState = secondAngle.state;
- var maxState = Math.max(firstState,secondState);
-
- firstAngle.setHighlighted({
- stroke: ORANGE,
- "stroke-width": 3
- });
- secondAngle.setHighlighted({
- stroke: BLUE,
- "stroke-width": 3
- });
- firstAngle.setState(maxState &gt; 0 ? maxState : 1);
- secondAngle.setState(maxState &gt; 0 ? maxState : 1);
- $(this).bind("vmouseout", function(event) {
- firstAngle.unsetHighlighted({
- stroke: "black",
- "stroke-width": 2
- });
- secondAngle.unsetHighlighted({
- stroke: "black",
- "stroke-width": 2
- });
- firstAngle.setState(firstState);
- secondAngle.setState(secondState);
- });
+ for(var angle in graph.congruency.angles){
+ for(var angle2 in graph.congruency.angles){
+ (function(){
+ var $statement = $("."+angle+"-"+angle2);
+ var firstAngle = graph.congruency.angles[angle];
+ var secondAngle = graph.congruency.angles[angle2];
+
+ if($statement.length &gt; 0){
+ $statement.live("vmouseover", function(event) {
+ var firstState = firstAngle.state;
+ var secondState = secondAngle.state;
+ var maxState = Math.max(firstState,secondState);
+
+ firstAngle.setHighlighted({
+ stroke: ORANGE,
+ "stroke-width": 3
+ });
+ secondAngle.setHighlighted({
+ stroke: BLUE,
+ "stroke-width": 3
+ });
+ firstAngle.setState(maxState &gt; 0 ? maxState : 1);
+ secondAngle.setState(maxState &gt; 0 ? maxState : 1);
+ $(this).bind("vmouseout", function(event) {
+ firstAngle.unsetHighlighted({
+ stroke: "black",
+ "stroke-width": 2
+ });
+ secondAngle.unsetHighlighted({
+ stroke: "black",
+ "stroke-width": 2
});
- }
+ firstAngle.setState(firstState);
+ secondAngle.setState(secondState);
+ });
});
}
+ })();
+ }
+ }
+
+ for(var line in graph.congruency.lines){
+ (function(){
+ var $statements = $("."+line);
+ for(var i = 0; i&lt;$statements.length; i++){
+ var highlightLine = graph.congruency.lines[line];
+ var highlightDiv = $($statements[i]);
+
+ highlightDiv.live("vmouseover", function(event) {
+ highlightLine.setHighlighted({
+ stroke: ORANGE,
+ "stroke-width": 3
+ });
+ $(this).bind("vmouseout", function(event) {
+ highlightLine.unsetHighlighted({
+ stroke: "black",
+ "stroke-width": 2
+ });
+ });
+ });
}
+ })();
+ }
+
+ for(var line in graph.congruency.lines){
+ (function(){
+ var $statements = $("."+line + "2");
+ for(var i = 0; i&lt;$statements.length; i++){
+ var highlightLine = graph.congruency.lines[line];
+ var highlightDiv = $($statements[i]);
+
+ highlightDiv.live("vmouseover", function(event) {
+ highlightLine.setHighlighted({
+ stroke: BLUE,
+ "stroke-width": 3
+ });
+ $(this).bind("vmouseout", function(event) {
+ highlightLine.unsetHighlighted({
+ stroke: "black",
+ "stroke-width": 2
- for(var i=0; i&lt;(TRIANGLES.length); i++){
- for(var j=0; j&lt;(TRIANGLES.length); j++){
- for(var k=0; k&lt;3; k++){
- $(function(){
- var triangle = TRIANGLES[i];
- var triangle2 = TRIANGLES[j];
-
- var seg1_1 = triangle.segs[k].toString().substring(3,5);
- var seg1_2 = triangle.segs[(k+1) % 3].toString().substring(3,5);
- var seg1_3 = triangle.segs[(k+2) % 3].toString().substring(3,5);
-
- var seg2_1 = triangle2.segs[k].toString().substring(3,5);
- var seg2_2 = triangle2.segs[(k+1) % 3].toString().substring(3,5);
- var seg2_3 = triangle2.segs[(k+2) % 3].toString().substring(3,5);
-
- var triangleSegs = [seg1_1, seg1_2, seg1_3];
- var triangle2Segs = [seg2_1, seg2_2, seg2_3];
- var sharedSeg = [-1, -1];
-
- for(var l=0; l&lt;3; l++){
- for(var m=0; m&lt;3; m++){
- if(triangleSegs[l] === triangle2Segs[m]){
- sharedSeg = [l,m];
- }
- }
- }
-
-
- var $statement = $("."+seg1_1+"-"+seg1_2+"-"+seg1_3+"-"+seg2_1+"-"+seg2_2+"-"+seg2_3);
-
- var line1_1 = graph.congruency.lines[seg1_1];
- var line1_2 = graph.congruency.lines[seg1_2];
- var line1_3 = graph.congruency.lines[seg1_3];
-
- var line2_1 = graph.congruency.lines[seg2_1];
- var line2_2 = graph.congruency.lines[seg2_2];
- var line2_3 = graph.congruency.lines[seg2_3];
-
- var triangleLines = [line1_1, line1_2, line1_3];
- var triangle2Lines = [line2_1, line2_2, line2_3];
-
- if($statement.length &gt; 0){
- $statement.bind("vmouseover", function(event) {
- for(var l=0; l&lt;3; l++){
- if(sharedSeg[0] != l){
- triangleLines[l].setUnselectedStyle({
- stroke: ORANGE,
- "stroke-width": 3
- });
- }
- else{
- triangleLines[l].setUnselectedStyle({
- stroke: "black",
- "stroke-width": 3
- });
- }
- }
-
- for(var l=0; l&lt;3; l++){
- if(sharedSeg[1] != l){
- triangle2Lines[l].setUnselectedStyle({
- stroke: BLUE,
- "stroke-width": 3
- });
- }
- else{
- triangle2Lines[l].setUnselectedStyle({
- stroke: "black",
- "stroke-width": 3
- });
- }
- }
-
- $(this).bind("vmouseout", function(event) {
- line1_1.setUnselectedStyle({
- stroke: "black",
- "stroke-width": 2
- });
- line1_2.setUnselectedStyle({
- stroke: "black",
- "stroke-width": 2
- });
- line1_3.setUnselectedStyle({
- stroke: "black",
- "stroke-width": 2
- });
-
- line2_1.setUnselectedStyle({
- stroke: "black",
- "stroke-width": 2
- });
- line2_2.setUnselectedStyle({
- stroke: "black",
- "stroke-width": 2
- });
- line2_3.setUnselectedStyle({
- stroke: "black",
- "stroke-width": 2
- });
- });
- });
- }
});
- }
- }
+ });
+ });
}
+ })();
+ }
</div>
</div>
@@ -452,12 +397,12 @@
<div class="instruction">
Fill in the blanks in this proof that <var> FINISHED </var>.
</div>
- <div class="guess">[outputKnownProof()]</div>
+ <div class="guess">1</div>
<div class="validator-function">
return FILL_BLANKS_NUM==0;
</div>
<div class="show-guess">
-
+ return outputKnownProof();
</div>
</div>
<div class="hints">
538 exercises/geometry_proofs_2.html
View
@@ -391,7 +391,7 @@
<p data-else>There is no wrong statement in this proof.</p>
</div>
</div> -->
- <div id="parallelogram">
+ <div id="triforce">
<div class="vars">
<var id="AB">new Seg("A","B")</var>
<var id="BA">AB</var>
@@ -399,53 +399,53 @@
<var id="CA">AC</var>
<var id="AD">new Seg("A","D")</var>
<var id="DA">AD</var>
- <var id="AE">new Seg("A","E")</var>
- <var id="EA">AE</var>
+ <var id="AF">new Seg("A","F")</var>
+ <var id="FA">AF</var>
<var id="BC">new Seg("B","C")</var>
<var id="CB">BC</var>
<var id="BD">new Seg("B","D")</var>
<var id="DB">BD</var>
<var id="BE">new Seg("B","E")</var>
<var id="EB">BE</var>
- <var id="CD">new Seg("C","D")</var>
- <var id="DC">CD</var>
<var id="CE">new Seg("C","E")</var>
<var id="EC">CE</var>
+ <var id="CF">new Seg("C","F")</var>
+ <var id="FC">CF</var>
<var id="DE">new Seg("D","E")</var>
<var id="ED">DE</var>
-
-
- <var id="SEGS">[AB,BA,AC,CA,AD,DA,AE,EA,BC,CB,BD,DB,CD,DC,CE,EC,DE,ED]</var>
-
- <var id="ang1">new Ang("D","A","C", null)</var>
- <var id="ang2">new Ang("C","A","B", null)</var>
- <var id="ang3">new Ang("C","B","A", null)</var>
- <var id="ang4">new Ang("C","B","E", null)</var>
- <var id="ang5">new Ang("A","C","B", null)</var>
- <var id="ang6">new Ang("A","C","D", null)</var>
- <var id="ang7">new Ang("B","C","E", null)</var>
- <var id="ang8">new Ang("D","C","E", null)</var>
- <var id="ang9">new Ang("A","D","C", null)</var>
- <var id="ang10">new Ang("C","D","E", null)</var>
- <var id="ang11">new Ang("C","E","D", null)</var>
- <var id="ang12">new Ang("C","E","B", null)</var>
+ <var id="DF">new Seg("D","F")</var>
+ <var id="FD">DF</var>
+ <var id="EF">new Seg("E","F")</var>
+ <var id="FE">EF</var>
+
+ <var id="SEGS">[AB,BA,AC,CA,AD,DA,AF,FA,BC,CB,BD,DB,BE,EB,CE,EC,CF,FC,DE,ED,DF,FD,EF,FE]</var>
+
+ <var id="ang1">new Ang("B","A","C")</var>
+ <var id="ang2">new Ang("A","B","C")</var>
+ <var id="ang3">new Ang("A","C","B")</var>
+ <var id="ang4">new Ang("D","B","E")</var>
+ <var id="ang5">new Ang("E","B","C")</var>
+ <var id="ang6">new Ang("B","C","E")</var>
+ <var id="ang7">new Ang("E","C","F")</var>
+ <var id="ang8">new Ang("B","D","E")</var>
+ <var id="ang9">new Ang("B","E","D")</var>
+ <var id="ang10">new Ang("B","E","C")</var>
+ <var id="ang11">new Ang("C","E","F")</var>
+ <var id="ang12">new Ang("C","F","E")</var>
<var id="ANGS">[ang1, ang2, ang3, ang4, ang5, ang6, ang7, ang8, ang9, ang10, ang11, ang12]</var>
- <var id="SUPPLEMENTARY_ANGS">[addAngs(ang5, ang6), addAngs(ang6, ang8), addAngs(ang8, ang7), addAngs(ang7, ang5)]</var>
+ <var id="SUPPLEMENTARY_ANGS">[addAngs(ang2, addAngs(ang5, ang4)), addAngs(ang3, addAngs(ang6, ang7)), addAngs(ang9, addAngs(ang10,ang11))]</var>
- <var id="ALTERNATE_INTERIOR_ANGS">[[ang1, ang12], [ang2, ang11], [ang10, ang3], [ang9, ang4]]</var>
+ <var id="ALTERNATE_INTERIOR_ANGS">[[ang5, ang9], [ang6, ang11]]</var>
- <var id="ABC">new Triang([AB, BC, CA], [ang3, ang5, ang2])</var>
- <var id="BCE">new Triang([BC, CE, EB], [ang7, ang12, ang4])</var>
- <var id="ECD">new Triang([EC, CD, DE], [ang8, ang10, ang11])</var>
- <var id="DCA">new Triang([DC, CA, AD], [ang6, ang1, ang9])</var>
- <var id="ABE">new Triang([AB, BE, EA], [addAngs(ang3, ang4), ang12, ang2])</var>
- <var id="ADE">new Triang([AD, DE, EA], [addAngs(ang9, ang10), ang11, ang1])</var>
- <var id="BED">new Triang([BE, ED, DB], [addAngs(ang12, ang11), ang10, ang4])</var>
- <var id="BAD">new Triang([BA, AD, DB], [addAngs(ang2, ang1), ang9, ang3])</var>
+ <var id="ABC">new Triang([AB, BC, CA], [ang2, ang3, ang1])</var>
+ <var id="BDE">new Triang([BD, DE, EB], [ang8, ang9, ang4])</var>
+ <var id="BCE">new Triang([BC, CE, EB], [ang6, ang10, ang5])</var>
+ <var id="CEF">new Triang([CE, EF, FC], [ang11, ang12, ang7])</var>
+ <var id="ADF">new Triang([AD, DF, FA], [ang8, ang12, ang1])</var>
- <var id="TRIANGLES">[ABC, BCE, ECD, DCA, ABE, ADE, BED, BAD]</var>
+ <var id="TRIANGLES">[ABC, BDE, BCE, CEF]</var>
<var id="STATEMENTS">initProof(SEGS, ANGS, TRIANGLES, SUPPLEMENTARY_ANGS, ALTERNATE_INTERIOR_ANGS, 3, 0.25, "all")</var>
<var id="KNOWN">STATEMENTS[0]</var>
@@ -464,7 +464,7 @@
<div class="problem">
<p class="question">What's the first wrong statement in the proof below that <var>FINISHED</var><code> \; ?</code></br></br>
- <code> \overline{AB} </code> is parallel to <code> \overline{DE} </code>, and <code> \overline{AD} </code> is parallel to <code> \overline{BE} </code>. This diagram is not drawn to scale.</p>
+ <code> \overline{BC} </code> is parallel to <code> \overline{DF} </code>. This diagram is not drawn to scale.</p>
<div class="graphie">
init({
range: [[-5, 5], [-5, 5]],
@@ -474,271 +474,227 @@
graph.congruency = addCongruency({ y1: -0.7, y2: 10.7 });
- graph.congruency.addPoint("A", [-4, 4]);
- graph.congruency.addPoint("B", [3, 4]);
- graph.congruency.addPoint("C", [0, 0]);
- graph.congruency.addPoint("D", [-3, -4]);
- graph.congruency.addPoint("E", [4, -4]);
-
- graph.congruency.addLine({
- start: "A",
- end: "B",
- clickable: true,
- maxState: 3
- });
- graph.congruency.addLine({
- start: "A",
- end: "C",
- clickable: true,
- maxState: 3
- });
- graph.congruency.addLine({
- start: "A",
- end: "D",
- clickable: true,
- maxState: 3
- });
- graph.congruency.addLine({
- start: "A",
- end: "E",
- clickable: true,
- maxState: 3
- });
- graph.congruency.addLine({
- start: "B",
- end: "C",
- clickable: true,
- maxState: 3
- });
- graph.congruency.addLine({
- start: "B",
- end: "D",
- clickable: true,
- maxState: 3
- });
- graph.congruency.addLine({
- start: "E",
- end: "B",
- clickable: true,
- maxState: 3
- });
- graph.congruency.addLine({
- start: "E",
- end: "D",
- clickable: true,
- maxState: 3
- });
- graph.congruency.addLine({
- start: "C",
- end: "D",
- clickable: true,
- maxState: 3
- });
- graph.congruency.addLine({
- start: "C",
- end: "E",
- clickable: true,
- maxState: 3
- });
-
- graph.congruency.addAngles("A", { maxState: 3 });
- graph.congruency.addAngles("B", { maxState: 3 });
- graph.congruency.addAngles("C", { maxState: 3 });
- graph.congruency.addAngles("D", { maxState: 3 });
- graph.congruency.addAngles("E", { maxState: 3 });
-
- graph.congruency.addAngle("DAC", { maxState: 3 });
- graph.congruency.addAngle("CAB", { maxState: 3 });
- graph.congruency.addAngle("ABC", { maxState: 3 });
- graph.congruency.addAngle("CBE", { maxState: 3 });
- graph.congruency.addAngle("BEC", { maxState: 3 });
- graph.congruency.addAngle("CED", { maxState: 3 });
- graph.congruency.addAngle("EDC", { maxState: 3 });
- graph.congruency.addAngle("CDA", { maxState: 3 });
-
- graph.congruency.addLabel("A", "left");
- graph.congruency.addLabel("B", "right");
- graph.congruency.addLabel("C", "right");
- graph.congruency.addLabel("D", "left");
- graph.congruency.addLabel("E", "right");
-
- for(var angle in graph.congruency.angles){
- graph.congruency.angles[angle].setSelectedStyle({
- stroke: "black",
- "stroke-width": 3
- });
- }
-
- for(var line in graph.congruency.lines){
- for(var line2 in graph.congruency.lines){
-
- $(function(){
- var $statement = $("."+line+"-"+line2);
- var firstLine = graph.congruency.lines[line];
- var secondLine = graph.congruency.lines[line2];
-
- if($statement.length &gt; 0){
- $statement.bind("vmouseover", function(event) {
- firstLine.setHighlighted({
- stroke: ORANGE,
- "stroke-width": 3
- });
- secondLine.setHighlighted({
- stroke: BLUE,
- "stroke-width": 3
- });
- $(this).bind("vmouseout", function(event) {
- firstLine.unsetHighlighted();
- secondLine.unsetHighlighted();
- });
- });
-
- }
+ graph.congruency.addPoint("A", [0, 4]);
+ graph.congruency.addPoint("B", [-2, 0]);
+ graph.congruency.addPoint("C", [2, 0]);
+ graph.congruency.addPoint("D", [-4, -4]);
+ graph.congruency.addPoint("E", [0, -4]);
+ graph.congruency.addPoint("F", [4, -4]);
+
+ graph.congruency.addLine({
+ start: "A",
+ end: "B",
+ clickable: true,
+ maxState: 3
+ });
+ graph.congruency.addLine({
+ start: "A",
+ end: "C",
+ clickable: true,
+ maxState: 3
+ });
+ graph.congruency.addLine({
+ start: "A",
+ end: "D",
+ clickable: true,
+ maxState: 3
+ });
+ graph.congruency.addLine({
+ start: "A",
+ end: "F",
+ clickable: true,
+ maxState: 3
+ });
+ graph.congruency.addLine({
+ start: "B",
+ end: "C",
+ clickable: true,
+ maxState: 3
+ });
+ graph.congruency.addLine({
+ start: "B",
+ end: "D",
+ clickable: true,
+ maxState: 3
+ });
+ graph.congruency.addLine({
+ start: "B",
+ end: "E",
+ clickable: true,
+ maxState: 3
+ });
+ graph.congruency.addLine({
+ start: "C",
+ end: "E",
+ clickable: true,
+ maxState: 3
+ });
+ graph.congruency.addLine({
+ start: "C",
+ end: "F",
+ clickable: true,
+ maxState: 3
+ });
+ graph.congruency.addLine({
+ start: "D",
+ end: "E",
+ clickable: true,
+ maxState: 3
+ });
+ graph.congruency.addLine({
+ start: "D",
+ end: "F",
+ clickable: true,
+ maxState: 3
+ });
+ graph.congruency.addLine({
+ start: "E",
+ end: "F",
+ clickable: true,
+ maxState: 3
+ });
+
+ graph.congruency.addAngles("A", { maxState: 3 });
+ graph.congruency.addAngles("B", { maxState: 3 });
+ graph.congruency.addAngles("C", { maxState: 3 });
+ graph.congruency.addAngles("D", { maxState: 3 });
+ graph.congruency.addAngles("E", { maxState: 3 });
+ graph.congruency.addAngles("F", { maxState: 3 });
+
+ graph.congruency.addAngle("BAC", { maxState: 3 });
+ graph.congruency.addAngle("EDB", { maxState: 3 });
+ graph.congruency.addAngle("CFE", { maxState: 3 });
+
+ for(var angle in graph.congruency.angles){
+ graph.congruency.angles[angle].setSelectedStyle({
+ stroke: "black",
+ "stroke-width": 3
+ });
+ }
+
+ graph.congruency.addLabel("A", "above");
+ graph.congruency.addLabel("B", "left");
+ graph.congruency.addLabel("C", "right");
+ graph.congruency.addLabel("D", "below");
+ graph.congruency.addLabel("E", "below");
+ graph.congruency.addLabel("F", "below");
+
+ for(var angle in graph.congruency.angles){
+ graph.congruency.angles[angle].setSelectedStyle({
+ stroke: "black",
+ "stroke-width": 3
+ });
+ }
+
+ for(var line in graph.congruency.lines){
+ for(var line2 in graph.congruency.lines){
+
+ (function(){
+ var $statement = $("."+line+"-"+line2);
+ var firstLine = graph.congruency.lines[line];
+ var secondLine = graph.congruency.lines[line2];
+
+ if($statement.length &gt; 0){
+ $statement.live("vmouseover", function(event) {
+ firstLine.setHighlighted({
+ stroke: ORANGE,
+ "stroke-width": 3
+ });
+ secondLine.setHighlighted({
+ stroke: BLUE,
+ "stroke-width": 3
+ });
+ $(this).bind("vmouseout", function(event) {
+ firstLine.unsetHighlighted();
+ secondLine.unsetHighlighted();
+ });
});
- }
- }
-
- for(var angle in graph.congruency.angles){
- for(var angle2 in graph.congruency.angles){
- $(function(){
- var $statement = $("."+angle+"-"+angle2);
- var firstAngle = graph.congruency.angles[angle];
- var secondAngle = graph.congruency.angles[angle2];
- if($statement.length &gt; 0){
- $statement.bind("vmouseover", function(event) {
- var firstState = firstAngle.state;
- var secondState = secondAngle.state;
- var maxState = Math.max(firstState,secondState);
-
- firstAngle.setHighlighted({
- stroke: ORANGE,
- "stroke-width": 3
- });
- secondAngle.setHighlighted({
- stroke: BLUE,
- "stroke-width": 3
- });
- firstAngle.setState(maxState &gt; 0 ? maxState : 1);
- secondAngle.setState(maxState &gt; 0 ? maxState : 1);
- $(this).bind("vmouseout", function(event) {
- firstAngle.unsetHighlighted();
- secondAngle.unsetHighlighted();
- firstAngle.setState(firstState);
- secondAngle.setState(secondState);
- });
- });
- }
+ }
+ })();
+ }
+ }
+
+ for(var angle in graph.congruency.angles){
+ for(var angle2 in graph.congruency.angles){
+ (function(){
+ var $statement = $("."+angle+"-"+angle2);
+ var firstAngle = graph.congruency.angles[angle];
+ var secondAngle = graph.congruency.angles[angle2];
+
+ if($statement.length &gt; 0){
+ $statement.live("vmouseover", function(event) {
+ var firstState = firstAngle.state;
+ var secondState = secondAngle.state;
+ var maxState = Math.max(firstState,secondState);
+
+ firstAngle.setHighlighted({
+ stroke: ORANGE,
+ "stroke-width": 3
+ });
+ secondAngle.setHighlighted({
+ stroke: BLUE,
+ "stroke-width": 3
+ });
+ firstAngle.setState(maxState &gt; 0 ? maxState : 1);
+ secondAngle.setState(maxState &gt; 0 ? maxState : 1);
+ $(this).bind("vmouseout", function(event) {
+ firstAngle.unsetHighlighted();
+ secondAngle.unsetHighlighted();
+ firstAngle.setState(firstState);
+ secondAngle.setState(secondState);
+ });
});
}
+ })();
+ }
+ }
+
+ for(var line in graph.congruency.lines){
+ (function(){
+ var $statements = $("."+line);
+ for(var i = 0; i&lt;$statements.length; i++){
+ var highlightLine = graph.congruency.lines[line];
+ var highlightDiv = $($statements[i]);
+
+ highlightDiv.live("vmouseover", function(event) {
+ highlightLine.setHighlighted({
+ stroke: ORANGE,
+ "stroke-width": 3
+ });
+ $(this).bind("vmouseout", function(event) {
+ highlightLine.unsetHighlighted({
+ stroke: "black",
+ "stroke-width": 2
+ });
+ });
+ });
}
-
- for(var i=0; i&lt;(TRIANGLES.length); i++){
- for(var j=0; j&lt;(TRIANGLES.length); j++){
- for(var k=0; k&lt;3; k++){
- $(function(){
- var triangle = TRIANGLES[i];
- var triangle2 = TRIANGLES[j];
-
- var seg1_1 = triangle.segs[k].toString().substring(3,5);
- var seg1_2 = triangle.segs[(k+1) % 3].toString().substring(3,5);
- var seg1_3 = triangle.segs[(k+2) % 3].toString().substring(3,5);
-
- var seg2_1 = triangle2.segs[k].toString().substring(3,5);
- var seg2_2 = triangle2.segs[(k+1) % 3].toString().substring(3,5);
- var seg2_3 = triangle2.segs[(k+2) % 3].toString().substring(3,5);
-
- var triangleSegs = [seg1_1, seg1_2, seg1_3];
- var triangle2Segs = [seg2_1, seg2_2, seg2_3];
- var sharedSeg = [-1, -1];
-
- for(var l=0; l&lt;3; l++){
- for(var m=0; m&lt;3; m++){
- if(triangleSegs[l] === triangle2Segs[m]){
- sharedSeg = [l,m];
- }
- }
- }
-
-
- var $statement = $("."+seg1_1+"-"+seg1_2+"-"+seg1_3+"-"+seg2_1+"-"+seg2_2+"-"+seg2_3);
-
- var line1_1 = graph.congruency.lines[seg1_1];
- var line1_2 = graph.congruency.lines[seg1_2];
- var line1_3 = graph.congruency.lines[seg1_3];
-
- var line2_1 = graph.congruency.lines[seg2_1];
- var line2_2 = graph.congruency.lines[seg2_2];
- var line2_3 = graph.congruency.lines[seg2_3];
-
- var triangleLines = [line1_1, line1_2, line1_3];
- var triangle2Lines = [line2_1, line2_2, line2_3];
-
- if($statement.length &gt; 0){
- $statement.bind("vmouseover", function(event) {
- for(var l=0; l&lt;3; l++){
- if(sharedSeg[0] != l){
- triangleLines[l].setUnselectedStyle({
- stroke: ORANGE,
- "stroke-width": 3
- });
- }
- else{
- triangleLines[l].setUnselectedStyle({
- stroke: "black",
- "stroke-width": 3
- });
- }
- }
-
- for(var l=0; l&lt;3; l++){
- if(sharedSeg[1] != l){
- triangle2Lines[l].setUnselectedStyle({
- stroke: BLUE,
- "stroke-width": 3
- });
- }
- else{
- triangle2Lines[l].setUnselectedStyle({
- stroke: "black",
- "stroke-width": 3
- });
- }
- }
-
- $(this).bind("vmouseout", function(event) {
- line1_1.setUnselectedStyle({
- stroke: "black",
- "stroke-width": 2
- });
- line1_2.setUnselectedStyle({
- stroke: "black",
- "stroke-width": 2
- });
- line1_3.setUnselectedStyle({
- stroke: "black",
- "stroke-width": 2
- });
-
- line2_1.setUnselectedStyle({
- stroke: "black",
- "stroke-width": 2
- });
- line2_2.setUnselectedStyle({
- stroke: "black",
- "stroke-width": 2
- });
- line2_3.setUnselectedStyle({
- stroke: "black",
- "stroke-width": 2
- });
- });
- });
- }
+ })();
+ }
+
+ for(var line in graph.congruency.lines){
+ (function(){
+ var $statements = $("."+line + "2");
+ for(var i = 0; i&lt;$statements.length; i++){
+ var highlightLine = graph.congruency.lines[line];
+ var highlightDiv = $($statements[i]);
+
+ highlightDiv.live("vmouseover", function(event) {
+ highlightLine.setHighlighted({
+ stroke: BLUE,
+ "stroke-width": 3
+ });
+ $(this).bind("vmouseout", function(event) {
+ highlightLine.unsetHighlighted({
+ stroke: "black",
+ "stroke-width": 2
});
- }
- }
+ });
+ });
}
+ })();
+ }
</div>
</div>
834 exercises/geometry_proofs_intro.html
View
@@ -0,0 +1,834 @@
+<!DOCTYPE html>
+<html data-require="math graphie graphie-helpers graphie-geometry math-format interactive proofs congruency">
+<head>
+ <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+ <title>Simple Geometry Proofs</title>
+ <script src="../khan-exercise.js"></script>
+ <style type="text/css">
+ input[type=text] {
+ width: 30px;
+ text-transform: uppercase;
+ }
+ </style>
+</head>
+<body>
+ <div class="exercise">
+ <div class="problems">
+ <div id="vertical">
+ <div class="vars">
+ <var id="AC">new Seg("A","C")</var>
+ <var id="CA">AC</var>
+ <var id="AD">new Seg("A","D")</var>
+ <var id="DA">AD</var>
+ <var id="BE">new Seg("B","E")</var>
+ <var id="EB">BE</var>
+ <var id="AE">new Seg("A","E")</var>
+ <var id="EA">AE</var>
+ <var id="BC">new Seg("B","C")</var>
+ <var id="CB">BC</var>
+ <var id="BD">new Seg("B","D")</var>
+ <var id="DB">BD</var>
+ <var id="CD">new Seg("C","D")</var>
+ <var id="DC">CD</var>
+ <var id="CE">new Seg("C","E")</var>
+ <var id="EC">CE</var>
+
+
+ <var id="SEGS">[AC,CA,AE,EA,BC,CB,BD,DB,CD,DC,CE,EC]</var>
+
+
+ <var id="ang1">new Ang("D","A","C", null)</var>
+ <var id="ang2">new Ang("C","B","E", null)</var>
+ <var id="ang3">new Ang("A","C","D", null)</var>
+ <var id="ang4">new Ang("B","C","E", null)</var>
+ <var id="ang5">new Ang("A","D","C", null)</var>
+ <var id="ang6">new Ang("C","E","B", null)</var>
+ <var id="ang7">new Ang("A","C","B", null)</var>
+ <var id="ang8">new Ang("D","C","E", null)</var>
+
+ <var id="ANGS">[ang1, ang2, ang3, ang4, ang5, ang6, ang7, ang8]</var>
+
+ <var id="SUPPLEMENTARY_ANGS">[addAngs(ang3, ang7), addAngs(ang7, ang4), addAngs(ang4, ang8), addAngs(ang8, ang3)]</var>
+
+ <var id="ALTERNATE_INTERIOR_ANGS">[]</var>
+
+ <var id="PARALLEL_SEGS">[]</var>
+
+ <var id="ADC">new Triang([AD, DC, CA], [ang5, ang3, ang1])</var>
+ <var id="BEC">new Triang([BE, EC, CB], [ang6, ang4, ang2])</var>
+
+
+ <var id="TRIANGLES">[ADC, BEC]</var>
+
+ <var id="STATEMENTS">initProof(SEGS, ANGS, TRIANGLES, SUPPLEMENTARY_ANGS, ALTERNATE_INTERIOR_ANGS, 2, 0.25, "triangle")</var>
+ <var id="KNOWN">STATEMENTS[0]</var>
+ <var id="FINISHED">STATEMENTS[1]</var>
+
+ <var id="HINT">"you haven't entered anything yet"</var>
+ <var id="HINTS_LEFT">3</var>
+ </div>
+ <p class="question">
+ <p>Prove <var> FINISHED </var>.</p>
+ <p>This figure is not drawn to scale.</p>
+ </p>
+
+ <div class="problem">
+ <div class="graphie">
+ init({
+ range: [[-5, 5], [-5, 5]],
+ scale: 40
+ });
+ addMouseLayer();
+
+ graph.congruency = addCongruency({ y1: -0.7, y2: 10.7 });
+
+ graph.congruency.addPoint("A", [-4, 4]);
+ graph.congruency.addPoint("B", [4, 4]);
+ graph.congruency.addPoint("C", [0, -(4/3)]);
+ graph.congruency.addPoint("D", [-2, -4]);
+ graph.congruency.addPoint("E", [2, -4]);
+
+ graph.congruency.addLine({
+ start: "A",
+ end: "D",
+ clickable: true,
+ maxState: 3
+ });
+ graph.congruency.addLine({
+ start: "A",
+ end: "C",
+ clickable: true,
+ maxState: 3
+ });
+ graph.congruency.addLine({
+ start: "C",
+ end: "D",
+ clickable: true,
+ maxState: 3
+ });
+ graph.congruency.addLine({
+ start: "C",
+ end: "B",
+ clickable: true,
+ maxState: 3
+ });
+ graph.congruency.addLine({
+ start: "C",
+ end: "E",
+ clickable: true,
+ maxState: 3
+ });
+ graph.congruency.addLine({
+ start: "E",
+ end: "B",
+ clickable: true,
+ maxState: 3
+ });
+
+ graph.congruency.addAngles("A", { maxState: 3 });
+ graph.congruency.addAngles("B", { maxState: 3 });
+ graph.congruency.addAngles("C", { maxState: 3 });
+ graph.congruency.addAngles("D", { maxState: 3 });
+ graph.congruency.addAngles("E", { maxState: 3 });
+
+ for(var angle in graph.congruency.angles){
+ graph.congruency.angles[angle].setSelectedStyle({
+ stroke: "black",
+ "stroke-width": 3
+ });
+ }
+
+ graph.congruency.addLabel("A", "left");
+ graph.congruency.addLabel("B", "right");
+ graph.congruency.addLabel("C", "right");
+ graph.congruency.addLabel("D", "left");
+ graph.congruency.addLabel("E", "right");
+
+ $(".hint1").hide();
+ $(".hint2").hide();
+ $(".hint3").hide();
+
+ var hintCategory = "good format but wrong";
+ var hintsLeft = 2;
+ var giveAway = false;
+
+ $(".nextStatement input").keyup(function(){
+ var thing1 = $("#thing1").val().toUpperCase();
+ var thing2 = $("#thing2").val().toUpperCase();
+ var reason = $("#reason").val();
+
+ if(thing1.length === 0 && thing2.length === 0){
+ hintCategory = "good format but wrong";
+ return;
+ }
+
+ var verifyTriangles = thing1.length === 3 && thing2.length === 3 ? verifyStatementArgs(thing1+"="+thing2, reason, "triangle congruence") : false;
+ var verifyAngles = thing1.length === 3 && thing2.length === 3 ? verifyStatementArgs(thing1+"="+thing2, reason, "angle equality") : false;
+ var verifySegments = thing1.length === 2 && thing2.length === 2 ? verifyStatementArgs(thing1+"="+thing2, reason, "segment equality") : false;
+
+ if(verifyTriangles === true || verifyAngles === true || verifySegments === true){
+ $(".statements").html(outputKnownProof());
+ _.each($(".statements code"), function(tag){ $.tmpl.type.code()(tag); });
+ $("#thing1").val("");
+ $("#thing2").val("");
+ $("#reason").val("");
+ $("#symbol1").html("");
+ $("#symbol2").html("");
+ if(userProofDone === true){
+ $(".nextStatement").hide();
+ $("#hint").attr("disabled", true);
+ }
+ else{
+ hintsLeft = 2;
+ $("#hint").val("I'd like a hint (2 hints left for this step)");
+ $("#hint").attr("disabled", false);
+ hintCategory = "good format but wrong";
+ giveAway = false;
+ }
+ }
+ else if(verifyTriangles === false || verifyAngles === false || verifySegments === false){
+ hintCategory = "good format but wrong";
+ }
+ else{
+ hintCategory = "bad format";
+ }
+ });
+ $("#reason").change(function(){
+ <!-- var curVal = $("#reason").val();
+ if(curVal === "SSS" || curVal === "ASA" || curVal === "SAS" || curVal === "AAS"){
+ $("#symbol1").html(" \\triangle ");
+ $("#symbol2").html(" \\triangle ");
+ }
+ else if(curVal === "vertical angles" || curVal === "alternate angles"){
+ $("#symbol1").html(" \\angle ");
+ $("#symbol2").html(" \\angle ");
+ }
+ else{
+ $("#symbol1").html("");
+ $("#symbol2").html("");
+ }
+ $.tmpl.type.code()($("#symbol1")[0]);
+ $.tmpl.type.code()($("#symbol2")[0]); -->
+ $(".nextStatement input").keyup();
+ });
+
+ var storedHint = "";
+ $("#hint").click(function(){
+ if(hintsLeft &gt; 0){
+ hintsLeft--;
+ if(hintCategory === "bad format"){
+ hintsLeft++;
+ var stepsLeft = hintsLeft + " hint" + (hintsLeft === 1 ? "" : "s") + " left";
+ $(this).val("I'd like a hint (" + stepsLeft + " for this step)");
+ $(this).attr("disabled", false);
+ $(".actualHints").append("&lt;p&gt; The things you've entered aren't segments, angles, or triangles in the figure. &lt;/p&gt;");
+ }
+ else{
+ var stepsLeft = hintsLeft + " hint" + (hintsLeft === 1 ? "" : "s") + " left";
+ $(this).val("I'd like a hint (" + stepsLeft + " for this step)");
+ $(this).attr("disabled", false);
+ if(!giveAway){
+ var nextHintSet = nextStatementHint();
+ $(".actualHints").append("&lt;p&gt;"+nextHintSet[0]+"&lt;/p&gt;");
+ storedHint = nextHintSet[1];
+ }
+ else{
+ $(".actualHints").append("&lt;p&gt;"+storedHint+"&lt;/p&gt;");
+ storedHint = "";
+ }
+ _.each($(".actualHints code"), function(tag){ $.tmpl.type.code()(tag); });
+ giveAway = !giveAway;
+ }
+ if(hintsLeft === 0){
+ $("#hint").attr("disabled", true);
+ }
+ }
+ });
+
+ </div>
+ </div>
+
+ <p class="statements"> <var> outputKnownProof() </var></p>
+ <p class="nextStatement">
+ <input type="text" id="thing1"></input> <code> \cong </code> <input type="text" id="thing2" > </input> because
+ <select id="reason">
+ <option value="">select a reason</option>
+ <option value="SSS">side-side-side congruence</option>
+ <option value="ASA">angle-side-angle congruence</option>
+ <option value="SAS">side-angle-side congruence</option>
+ <option value="AAS">angle-angle-side congruence</option>
+ <option value="vertical angles">vertical angles are equal</option>
+ <option value="alternate angles">alternate interior angles are equal</option>
+ <option value="CPCTC">corresp. parts of congruent triangles are congruent</option>
+ </select>
+ </p>
+ <div class="actualHints">
+ </div>
+ <div class="solution" data-type="custom">
+ <div class="instruction">
+ When you enter the next statement in the proof, and a valid reason, that statement will be added to the proof. When you're done, hit check answer.
+ </div>
+ <div class="guess">1</div>
+ <div class="validator-function">
+ return isProofDone();
+ </div>
+ <div class="show-guess">
+ return knownEqualities;
+ </div>
+ </div>
+ <div class="hints">
+ <p></p>
+ <p></p>
+ <p></p>
+ </div>
+ </div>
+ <div id="alternate">
+ <div class="vars">
+ <var id="AB">new Seg("A","B")</var>
+ <var id="BA">AB</var>
+ <var id="AC">new Seg("A","C")</var>
+ <var id="CA">AC</var>
+ <var id="AE">new Seg("A","E")</var>
+ <var id="EA">AE</var>
+ <var id="BC">new Seg("B","C")</var>
+ <var id="CB">BC</var>
+ <var id="BD">new Seg("B","D")</var>
+ <var id="DB">BD</var>
+ <var id="CD">new Seg("C","D")</var>
+ <var id="DC">CD</var>
+ <var id="CE">new Seg("C","E")</var>
+ <var id="EC">CE</var>
+ <var id="DE">new Seg("D","E")</var>
+ <var id="ED">DE</var>
+
+ <var id="SEGS">[AB,BA,AC,CA,AE,EA,BC,CB,BD,DB,CD,DC,CE,EC,DE,ED]</var>
+
+ <var id="ang1">new Ang("C","A","B", null)</var>
+ <var id="ang2">new Ang("C","B","A", null)</var>
+ <var id="ang3">new Ang("A","C","B", null)</var>
+ <var id="ang4">new Ang("D","C","E", null)</var>
+ <var id="ang5">new Ang("C","D","E", null)</var>
+ <var id="ang6">new Ang("C","E","D", null)</var>
+ <var id="ang7">new Ang("A","C","D", null)</var>
+ <var id="ang8">new Ang("B","C","E", null)</var>
+
+ <var id="ANGS">[ang1, ang2, ang3, ang4, ang5, ang6, ang7, ang8]</var>
+
+ <var id="SUPPLEMENTARY_ANGS">[addAngs(ang3, ang7), addAngs(ang7, ang4), addAngs(ang4, ang8), addAngs(ang8, ang3)]</var>
+
+ <var id="ALTERNATE_INTERIOR_ANGS">[[ang2, ang5]]</var>
+
+ <var id="PARALLEL_SEGS">[]</var>
+
+ <var id="ABC">new Triang([AB, BC, CA], [ang2, ang3, ang1])</var>
+ <var id="CDE">new Triang([CD, DE, EC], [ang5, ang6, ang4])</var>
+
+
+ <var id="TRIANGLES">[ABC, CDE]</var>
+
+ <var id="STATEMENTS">initProof(SEGS, ANGS, TRIANGLES, SUPPLEMENTARY_ANGS, ALTERNATE_INTERIOR_ANGS, 2, 0.25, "triangle")</var>
+ <var id="KNOWN">STATEMENTS[0]</var>
+ <var id="FINISHED">STATEMENTS[1]</var>
+
+
+ <var id="DOT_ATTRS">{ r: 0.2, fill: BLUE, stroke: "none" }</var>
+
+ </div>
+ <p class="question">
+ <p>Prove <var> FINISHED </var>.</p>
+ <p> <code> \overline{AB} </code> is parallel to <code> \overline{DE} </code>. This figure is not drawn to scale.</p>
+ </p>
+
+ <div class="problem">
+ <div class="graphie">
+ init({
+ range: [[-5, 5], [-5, 5]],
+ scale: 40
+ });
+ addMouseLayer();
+
+ graph.congruency = addCongruency({ y1: -0.7, y2: 10.7 });
+
+ graph.congruency.addPoint("A", [-3, 4]);
+ graph.congruency.addPoint("B", [3, 4]);
+ graph.congruency.addPoint("C", [0, 0]);
+ graph.congruency.addPoint("D", [-3, -4]);
+ graph.congruency.addPoint("E", [3, -4]);
+
+ graph.congruency.addLine({
+ start: "A",
+ end: "B",
+ clickable: true,
+ maxState: 3
+ });
+ graph.congruency.addLine({
+ start: "A",
+ end: "C",
+ clickable: true,
+ maxState: 3
+ });
+ graph.congruency.addLine({
+ start: "B",
+ end: "C",
+ clickable: true,
+ maxState: 3
+ });
+ graph.congruency.addLine({
+ start: "C",
+ end: "D",
+ clickable: true,
+ maxState: 3
+ });
+ graph.congruency.addLine({
+ start: "C",
+ end: "E",
+ clickable: true,
+ maxState: 3
+ });
+ graph.congruency.addLine({
+ start: "D",
+ end: "E",
+ clickable: true,
+ maxState: 3
+ });
+
+ graph.congruency.addAngles("A", { maxState: 3 });
+ graph.congruency.addAngles("B", { maxState: 3 });
+ graph.congruency.addAngles("C", { maxState: 3 });
+ graph.congruency.addAngles("D", { maxState: 3 });
+ graph.congruency.addAngles("E", { maxState: 3 });
+
+ for(var angle in graph.congruency.angles){
+ graph.congruency.angles[angle].setSelectedStyle({
+ stroke: "black",
+ "stroke-width": 3
+ });
+ }
+
+ graph.congruency.addLabel("A", "left");
+ graph.congruency.addLabel("B", "right");
+ graph.congruency.addLabel("C", "right");
+ graph.congruency.addLabel("D", "left");
+ graph.congruency.addLabel("E", "right");
+
+ $(".hint1").hide();
+ $(".hint2").hide();
+ $(".hint3").hide();
+
+ var hintCategory = "good format but wrong";
+ var hintsLeft = 2;
+ var giveAway = false;
+
+ $(".nextStatement input").keyup(function(){
+ var thing1 = $("#thing1").val().toUpperCase();
+ var thing2 = $("#thing2").val().toUpperCase();
+ var reason = $("#reason").val();
+
+ if(thing1.length === 0 && thing2.length === 0){
+ hintCategory = "good format but wrong";
+ return;
+ }
+
+ var verifyTriangles = thing1.length === 3 && thing2.length === 3 ? verifyStatementArgs(thing1+"="+thing2, reason, "triangle congruence") : false;
+ var verifyAngles = thing1.length === 3 && thing2.length === 3 ? verifyStatementArgs(thing1+"="+thing2, reason, "angle equality") : false;
+ var verifySegments = thing1.length === 2 && thing2.length === 2 ? verifyStatementArgs(thing1+"="+thing2, reason, "segment equality") : false;
+
+ if(verifyTriangles === true || verifyAngles === true || verifySegments === true){
+ $(".statements").html(outputKnownProof());
+ _.each($(".statements code"), function(tag){ $.tmpl.type.code()(tag); });
+ $("#thing1").val("");
+ $("#thing2").val("");
+ $("#reason").val("");
+ $("#symbol1").html("");
+ $("#symbol2").html("");
+ if(userProofDone === true){
+ $(".nextStatement").hide();
+ $("#hint").attr("disabled", true);
+ }
+ else{
+ hintsLeft = 2;
+ $("#hint").val("I'd like a hint (2 hints left for this step)");
+ $("#hint").attr("disabled", false);
+ hintCategory = "good format but wrong";
+ giveAway = false;
+ }
+ }
+ else if(verifyTriangles === false || verifyAngles === false || verifySegments === false){
+ hintCategory = "good format but wrong";
+ }
+ else{
+ hintCategory = "bad format";
+ }
+ });
+ $("#reason").change(function(){
+ <!-- var curVal = $("#reason").val();
+ if(curVal === "SSS" || curVal === "ASA" || curVal === "SAS" || curVal === "AAS"){
+ $("#symbol1").html(" \\triangle ");
+ $("#symbol2").html(" \\triangle ");
+ }
+ else if(curVal === "vertical angles" || curVal === "alternate angles"){
+ $("#symbol1").html(" \\angle ");
+ $("#symbol2").html(" \\angle ");
+ }
+ else{
+ $("#symbol1").html("");
+ $("#symbol2").html("");
+ }
+ $.tmpl.type.code()($("#symbol1")[0]);
+ $.tmpl.type.code()($("#symbol2")[0]); -->
+ $(".nextStatement input").keyup();
+ });
+
+
+ var storedHint = "";
+ $("#hint").click(function(){
+ if(hintsLeft &gt; 0){
+ hintsLeft--;
+ if(hintCategory === "bad format"){
+ hintsLeft++;
+ var stepsLeft = hintsLeft + " hint" + (hintsLeft === 1 ? "" : "s") + " left";
+ $(this).val("I'd like a hint (" + stepsLeft + " for this step)");
+ $(this).attr("disabled", false);
+ $(".actualHints").append("&lt;p&gt; The things you've entered aren't segments, angles, or triangles in the figure. &lt;/p&gt;");
+ }
+ else{
+ var stepsLeft = hintsLeft + " hint" + (hintsLeft === 1 ? "" : "s") + " left";
+ $(this).val("I'd like a hint (" + stepsLeft + " for this step)");
+ $(this).attr("disabled", false);
+ if(!giveAway){
+ var nextHintSet = nextStatementHint();
+ $(".actualHints").append("&lt;p&gt;"+nextHintSet[0]+"&lt;/p&gt;");
+ storedHint = nextHintSet[1];
+ }
+ else{
+ $(".actualHints").append("&lt;p&gt;"+storedHint+"&lt;/p&gt;");
+ storedHint = "";
+ }
+ _.each($(".actualHints code"), function(tag){ $.tmpl.type.code()(tag); });
+ giveAway = !giveAway;
+ }
+ if(hintsLeft === 0){
+ $("#hint").attr("disabled", true);
+ }
+ }
+ });
+
+
+ </div>
+ </div>
+
+ <p class="statements"> <var> outputKnownProof() </var></p>
+ <p class="nextStatement">
+ <input type="text" id="thing1"></input> <code> \cong </code> <input type="text" id="thing2" > </input> because
+ <select id="reason">
+ <option value="">select a reason</option>
+ <option value="SSS">side-side-side congruence</option>
+ <option value="ASA">angle-side-angle congruence</option>
+ <option value="SAS">side-angle-side congruence</option>
+ <option value="AAS">angle-angle-side congruence</option>
+ <option value="vertical angles">vertical angles are equal</option>
+ <option value="alternate angles">alternate interior angles are equal</option>
+ <option value="CPCTC">corresp. parts of congruent triangles are congruent</option>
+ </select>
+ </p>
+ <div class="actualHints">
+ </div>
+ <div class="solution" data-type="custom">
+ <div class="instruction">
+ When you enter the next statement in the proof, and a valid reason, that statement will be added to the proof. When you're done, hit check answer.
+ </div>
+ <div class="guess">1</div>
+ <div class="validator-function">
+ return isProofDone();
+ </div>
+ <div class="show-guess">
+ return knownEqualities;
+ </div>
+ </div>
+ <div class="hints">
+ <p></p>
+ <p></p>
+ <p></p>
+ </div>
+ </div>
+ <div id="shared">
+ <div class="vars">
+ <var id="A">[0,6]</var>
+ <var id="B">[-8,0]</var>
+ <var id="C">[8,0]</var>
+ <var id="D">[0,-6]</var>
+
+ <var id="POINTS">["A","B","C","D"]</var>
+
+ <var id="AB">new Seg("A","B")</var>
+ <var id="BA">AB</var>
+ <var id="AC">new Seg("A","C")</var>
+ <var id="CA">AC</var>
+ <var id="BD">new Seg("B","D")</var>
+ <var id="DB">BD</var>
+ <var id="CD">new Seg("C","D")</var>
+ <var id="DC">CD</var>
+ <var id="AD">new Seg("A","D")</var>
+ <var id="DA">AD</var>
+
+
+ <var id="SEGS">[AB,BA,AC,CA,BD,DB,CD,DC,AD,DA]</var>
+
+
+ <var id="ang1">new Ang("A","B","D", null)</var>
+ <var id="ang2">new Ang("B","A","D", null)</var>
+ <var id="ang3">new Ang("D","A","C", null)</var>
+ <var id="ang4">new Ang("A","C","D", null)</var>
+ <var id="ang5">new Ang("A","D","B", null)</var>
+ <var id="ang6">new Ang("A","D","C", null)</var>
+
+ <var id="ANGS">[ang1, ang2, ang3, ang4, ang5, ang6]</var>
+
+ <var id="SUPPLEMENTARY_ANGS">[]</var>
+
+ <var id="ALTERNATE_INTERIOR_ANGS">[]</var>
+
+ <var id="PARALLEL_SEGS">[]</var>
+
+ <!-- <var id="PARALLEL_TO_ALTERNATE">(function() {
+ dict = {};
+ dict[[AB,DE]] = [[ang2, ang11], [ang3, ang10]];
+ return dict;
+ })</var>
+
+ <var id="ALTERNATE_TO_PARALLEL">(function() {
+ dict = {};
+ dict[[ang2, ang11]] = [AB,DE];
+ dict[[ang3, ang10]] = [AB,DE];
+ return dict;
+ })</var> -->
+
+ <var id="BAD">new Triang([BA, AD, DB], [ang2, ang5, ang1])</var>
+ <var id="CAD">new Triang([CA, AD, DC], [ang3, ang6, ang4])</var>
+
+
+ <var id="TRIANGLES">[BAD, CAD]</var>
+
+ <var id="STATEMENTS">initProof(SEGS, ANGS, TRIANGLES, SUPPLEMENTARY_ANGS, ALTERNATE_INTERIOR_ANGS, 2, 0.25, "triangle")</var>
+ <var id="KNOWN">STATEMENTS[0]</var>
+ <var id="FINISHED">STATEMENTS[1]</var>
+
+
+ <var id="DOT_ATTRS">{ r: 0.2, fill: BLUE, stroke: "none" }</var>
+
+ </div>
+ <p class="question">
+ <p>You are given <var> KNOWN </var>.</p>
+ <p>Prove <var> FINISHED </var></p>
+ </p>
+
+ <div class="problem">
+ <div class="graphie">
+ init({
+ range: [[-5, 5], [-5, 5]],
+ scale: 40
+ });
+ addMouseLayer();
+
+ graph.congruency = addCongruency({ y1: -0.7, y2: 10.7 });
+
+ graph.congruency.addPoint("A", [0, 3]);
+ graph.congruency.addPoint("B", [-4, 0]);
+ graph.congruency.addPoint("C", [4, 0]);
+ graph.congruency.addPoint("D", [0, -3]);
+
+ graph.congruency.addLine({
+ start: "A",
+ end: "B",
+ clickable: true,
+ maxState: 3
+ });
+ graph.congruency.addLine({
+ start: "B",
+ end: "D",
+ clickable: true,
+ maxState: 3
+ });
+ graph.congruency.addLine({
+ start: "A",
+ end: "D",
+ clickable: true,
+ maxState: 3
+ });
+ graph.congruency.addLine({
+ start: "A",
+ end: "C",
+ clickable: true,
+ maxState: 3
+ });
+ graph.congruency.addLine({
+ start: "C",
+ end: "D",
+ clickable: true,
+ maxState: 3
+ });
+
+ graph.congruency.addAngles("A");
+ graph.congruency.addAngles("B");
+ graph.congruency.addAngles("C");
+ graph.congruency.addAngles("D");
+
+ for(var angle in graph.congruency.angles){
+ graph.congruency.angles[angle].setSelectedStyle({
+ stroke: "black",
+ "stroke-width": 3
+ });
+ }
+
+ graph.congruency.addLabel("A", "above");
+ graph.congruency.addLabel("B", "left");
+ graph.congruency.addLabel("C", "right");
+ graph.congruency.addLabel("D", "below");
+
+ $(".hint1").hide();
+ $(".hint2").hide();
+ $(".hint3").hide();
+
+ var hintCategory = "good format but wrong";
+ var hintsLeft = 2;
+ var giveAway = false;
+
+ $(".nextStatement input").keyup(function(){
+ var thing1 = $("#thing1").val().toUpperCase();
+ var thing2 = $("#thing2").val().toUpperCase();
+ var reason = $("#reason").val();
+
+ if(thing1.length === 0 && thing2.length === 0){
+ hintCategory = "good format but wrong";
+ return;
+ }
+
+ var verifyTriangles = thing1.length === 3 && thing2.length === 3 ? verifyStatementArgs(thing1+"="+thing2, reason, "triangle congruence") : false;
+ var verifyAngles = thing1.length === 3 && thing2.length === 3 ? verifyStatementArgs(thing1+"="+thing2, reason, "angle equality") : false;
+ var verifySegments = thing1.length === 2 && thing2.length === 2 ? verifyStatementArgs(thing1+"="+thing2, reason, "segment equality") : false;
+
+ if(verifyTriangles === true || verifyAngles === true || verifySegments === true){
+ if($("#thing1").val() === $("#thing2").val() || $("#thing1").val() === $("#thing2").val().split("").reverse().join("")){
+
+ }
+ $(".statements").html(outputKnownProof());
+ _.each($(".statements code"), function(tag){ $.tmpl.type.code()(tag); });
+ $("#thing1").val("");
+ $("#thing2").val("");
+ $("#reason").val("");
+ $("#symbol1").html("");
+ $("#symbol2").html("");
+ if(userProofDone === true){
+ $(".nextStatement").hide();
+ $("#hint").attr("disabled", true);
+ }
+ else{
+ hintsLeft = 2;
+ $("#hint").val("I'd like a hint (2 hints left for this step)");
+ $("#hint").attr("disabled", false);
+ hintCategory = "good format but wrong";
+ giveAway = false;
+ }
+ }
+ else if(verifyTriangles === false || verifyAngles === false || verifySegments === false){
+ hintCategory = "good format but wrong";
+ }
+ else{
+ hintCategory = "bad format";
+ }
+ });
+ $("#reason").change(function(){
+ <!-- var curVal = $("#reason").val();
+ if(curVal === "SSS" || curVal === "ASA" || curVal === "SAS" || curVal === "AAS"){
+ $("#symbol1").html(" \\triangle ");
+ $("#symbol2").html(" \\triangle ");
+ }
+ else if(curVal === "vertical angles" || curVal === "alternate angles"){
+ $("#symbol1").html(" \\angle ");
+ $("#symbol2").html(" \\angle ");
+ }
+ else{
+ $("#symbol1").html("");
+ $("#symbol2").html("");
+ }
+ $.tmpl.type.code()($("#symbol1")[0]);
+ $.tmpl.type.code()($("#symbol2")[0]); -->
+ $(".nextStatement input").keyup();
+ });
+
+
+ var storedHint = "";
+ $("#hint").click(function(){
+ if(hintsLeft &gt; 0){
+ hintsLeft--;
+ if(hintCategory === "bad format"){
+ hintsLeft++;
+ var stepsLeft = hintsLeft + " hint" + (hintsLeft === 1 ? "" : "s") + " left";
+ $(this).val("I'd like a hint (" + stepsLeft + " for this step)");
+ $(this).attr("disabled", false);
+ $(".actualHints").append("&lt;p&gt; The things you've entered aren't segments, angles, or triangles in the figure. &lt;/p&gt;");
+ }
+ else{
+ var stepsLeft = hintsLeft + " hint" + (hintsLeft === 1 ? "" : "s") + " left";
+ $(this).val("I'd like a hint (" + stepsLeft + " for this step)");
+ $(this).attr("disabled", false);
+ if(!giveAway){
+ var nextHintSet = nextStatementHint();
+ $(".actualHints").append("&lt;p&gt;"+nextHintSet[0]+"&lt;/p&gt;");
+ storedHint = nextHintSet[1];
+ }
+ else{
+ $(".actualHints").append("&lt;p&gt;"+storedHint+"&lt;/p&gt;");
+ storedHint = "";
+ }
+ _.each($(".actualHints code"), function(tag){ $.tmpl.type.code()(tag); });
+ giveAway = !giveAway;
+ }
+ if(hintsLeft === 0){
+ $("#hint").attr("disabled", true);
+ }
+ }
+ });
+
+ </div>
+ </div>
+
+ <p class="statements"> <var> outputKnownProof() </var></p>
+ <p class="nextStatement">
+ <input type="text" id="thing1"></input> <code> \cong </code> <input type="text" id="thing2" > </input> because
+ <select id="reason">
+ <option value="">select a reason</option>
+ <option value="SSS">side-side-side congruence</option>
+ <option value="ASA">angle-side-angle congruence</option>
+ <option value="SAS">side-angle-side congruence</option>
+ <option value="AAS">angle-angle-side congruence</option>
+ <option value="vertical angles">vertical angles are equal</option>
+ <option value="alternate angles">alternate interior angles are equal</option>
+ <option value="CPCTC">corresp. parts of congruent triangles are congruent</option>
+ <option value="reflexive property">reflexive property</option>
+ </select>
+ </p>
+ <div class="actualHints">
+ </div>
+ <div class="solution" data-type="custom">
+ <div class="instruction">
+ When you enter the next statement in the proof, and a valid reason, that statement will be added to the proof. When you're done, hit check answer.
+ </div>
+ <div class="guess">1</div>
+ <div class="validator-function">
+ return isProofDone();
+ </div>
+ <div class="show-guess">
+ return knownEqualities;
+ </div>
+ </div>
+ <div class="hints">
+ <p></p>
+ <p></p>
+ <p></p>
+ </div>
+ </div>
+ </div>
+ </div>
+</body>
+</html>
183 utils/proofs.js
View
@@ -22,6 +22,7 @@ var userProofDone;
// knownEqualities is an object with key-value pairs corresponding to statement-justification pairs
// of statements known in the course of proof to be equal
var knownEqualities;
+var knownEqualitiesList;
// finishedEqualities denotes all the equalities that should be known, and
// the correct reasoning, at the end of the proof
@@ -62,6 +63,7 @@ function initProof(segs, angs, triangles, supplementaryAngs, altIntAngs, depth,
finishedEqualitiesList = [];
fixedTriangles = {};
+ knownEqualitiesList = [];
SEGMENTS = segs;
ANGLES = angs;
@@ -240,6 +242,9 @@ function verifyStatementArgs(statement, reason, category) {
else if (triangle1Permutation != triangle2Permutation) {
return false;
}
+ else if (eqIn([triangle1, triangle2], knownEqualities)){
+ return "that's already in the proof!";
+ }
else {
toReturn = checkTriangleCongruent(triangle1, triangle2, reason);
}
@@ -260,7 +265,9 @@ function verifyStatementArgs(statement, reason, category) {
if (ang1 == null || ang2 == null) {
return "those angles aren't in this figure...";
}
-
+ else if (eqIn([ang1, ang2], knownEqualities)){
+ return "that's already in the proof!";
+ }
else {
toReturn = checkAngEqual(ang1, ang2, reason);
}
@@ -283,7 +290,14 @@ function verifyStatementArgs(statement, reason, category) {
if (seg1 == null || seg2 == null) {
return "those segments aren't in this figure...";
}
-
+ else if(seg1.equals(seg2) && reason === "reflexive property"){
+ knownEqualities[[seg1, seg2]] = "reflexive property";
+ knownEqualitiesList.push([seg1, seg2]);
+ return true;
+ }
+ else if (eqIn([seg1, seg2], knownEqualities)){
+ return "that's already in the proof!";
+ }
else {
toReturn = checkSegEqual(seg1, seg2, reason);
}
@@ -310,9 +324,9 @@ function isProofDone() {
// give a hint as to the next statement which the user should try to prove
function nextStatementHint() {
var hintKeys = [];
- // filter out all keys with value "same *" or "given"
+ // filter out all keys with value "same *" or "given," as well as those values already in the proof
for (var eq in finishedEqualities) {
- if (finishedEqualities[eq].substring(0, 4) != "Same" && finishedEqualities[eq] != "given") {
+ if (finishedEqualities[eq].substring(0, 4) != "Same" && finishedEqualities[eq] != "given" && !(eq in knownEqualities)) {
hintKeys.push(eq);
}
}
@@ -334,9 +348,10 @@ function nextStatementHint() {
var useToProve = checkTriangleForHint(triangle1, triangle2, knownEqualities);
if (useToProve.length > 0) {
- return "You know that " + prettifyEquality(useToProve[0][0] + "," + useToProve[0][1])
+ return ["You know that " + prettifyEquality(useToProve[0][0] + "," + useToProve[0][1])
+ ", " + prettifyEquality(useToProve[1][0] + "," + useToProve[1][1])
- + ", and " + prettifyEquality(useToProve[2][0] + "," + useToProve[2][1]) + ". What can you prove from this?";
+ + ", and " + prettifyEquality(useToProve[2][0] + "," + useToProve[2][1]) + ". What can you prove from this?",
+ "A useful thing to prove here is " + prettifyEquality(triangle1 + "," + triangle2)];
}
}
@@ -350,7 +365,8 @@ function nextStatementHint() {
var useToProve = checkSegForHint(seg1, seg2, knownEqualities);
if (useToProve.length > 0) {
- return "You know that " + prettifyEquality(useToProve[0] + "," + useToProve[1]) + ". What segments can you prove equal from this?";
+ return ["You know that " + prettifyEquality(useToProve[0] + "," + useToProve[1]) + ". What segments can you prove equal from this?",
+ "A useful thing to prove here is " + prettifyEquality(seg1 + "," + seg2)];
}
}
@@ -365,15 +381,17 @@ function nextStatementHint() {
var useToProve = checkAngForHint(ang1, ang2, knownEqualities);
if (useToProve.length > 0 && useToProve[0] instanceof Triang) {
- return "You know that " + prettifyEquality(useToProve[0] + "," + useToProve[1]) + ". What angles can you prove equal from this?";
+ return ["You know that " + prettifyEquality(useToProve[0] + "," + useToProve[1]) + ". What angles can you prove equal from this?",
+ "A useful thing to prove here is " + prettifyEquality(ang1 + "," + ang2)];
}
else if (useToProve.length > 0) {
- return "Try using " + useToProve + " to prove some useful pair of angles equal.";
+ return ["Try using " + useToProve + " to prove some useful pair of angles equal.",
+ "A useful thing to prove here is " + prettifyEquality(ang1 + "," + ang2)];
}
}
}
- return "Sorry, no hint for now >:[";
+ return "Sorry, there seems to be a problem with the hint system. Please report this bug.";
}
@@ -382,8 +400,9 @@ function nextStatementHint() {
function outputFinishedProof() {
var proofText = "<h3>Givens</h3>";
- var unsortedKeyList = _.map(finishedEqualitiesList, function(key) { return key.toString(); });
- var finishedKeys = sortEqualityList(unsortedKeyList.reverse(), finishedEqualities);
+ var unsortedKeyList = _.clone(finishedEqualitiesList);
+ var finishedKeysList = sortEqualityList(unsortedKeyList.reverse(), finishedEqualities);
+ var finishedKeys = _.map(finishedKeysList, function(key) { return key.toString(); });
var possibleValids = [];
@@ -393,8 +412,7 @@ function outputFinishedProof() {
numberGivens++;
}
});
- numberGivens /= 2;
- for (var i = 0; i < finishedKeys.length; i += 2) {
+ for (var i = 0; i < finishedKeys.length; i ++) {
if (finishedEqualities[finishedKeys[i]].substring(0, 4) != "Same") {
if (finishedEqualities[finishedKeys[i]] === "given") {
numberGivens--;
@@ -432,7 +450,8 @@ function outputFinishedProof() {
function outputKnownProof() {
var proofText = "<h3>Givens</h3>";
- var knownKeys = sortEqualityList(_.keys(knownEqualities), knownEqualities);
+ var knownKeysList = sortEqualityList(knownEqualitiesList, knownEqualities);
+ var knownKeys = _.map(knownKeysList, function(key){ return key.toString(); });
var numberGivens = 0;
_.each(knownKeys, function(key) {
@@ -440,8 +459,8 @@ function outputKnownProof() {
numberGivens++;
}
});
- numberGivens /= 2;
- for (var i = 0; i < knownKeys.length; i += 2) {
+
+ for (var i = 0; i < knownKeys.length; i ++) {
if (knownEqualities[knownKeys[i]].substring(0, 4) != "Same") {
if (knownEqualities[knownKeys[i]] === "given") {
numberGivens--;
@@ -478,8 +497,9 @@ function outputFillBlanksProof() {
var blanks = 0;
var blankStatements = 0;
- var unsortedKeyList = _.map(finishedEqualitiesList, function(key) { return key.toString(); });
- var finishedKeys = sortEqualityList(unsortedKeyList.reverse(), finishedEqualities);
+ var unsortedKeyList = _.clone(finishedEqualitiesList);
+ var finishedKeysList = sortEqualityList(unsortedKeyList.reverse(), finishedEqualities);
+ var finishedKeys = _.map(finishedKeysList, function(key) { return key.toString(); });
var numberGivens = 0;
_.each(finishedKeys, function(key) {
@@ -487,15 +507,19 @@ function outputFillBlanksProof() {
numberGivens++;
}
});
- numberGivens /= 2;
var newEqualities = {};
- for (var i = 0; i < finishedKeys.length; i += 2) {
+ for (var i = 0; i < finishedKeys.length; i++) {
if (finishedEqualities[finishedKeys[i]].substring(0, 4) != "Same") {
if (finishedEqualities[finishedKeys[i]] === "given") {
numberGivens--;
- proofText += "<div style=\"float:left\" class=\"" + divName(finishedKeys[i]) + "\">";
+ if(i % 3 != 2){
+ proofText += "<div style=\"float:left\" class=\"" + divName(finishedKeys[i]) + "\">";
+ }
+ else{
+ proofText += "<div style=\"float:left\" class=\"" + divName(finishedKeys[i]) + "\">";
+ }
proofText += prettifyEquality(finishedKeys[i]);
if (numberGivens > 1) {
proofText += "<code>, \\ </code> </div>";
@@ -572,9 +596,8 @@ function outputFillBlanksProof() {
// returns true if the statements were filled in correctly, false otherwise
function checkFillBlanksStatement(divID) {
// for now, hardcode these
- var equivAngles = {"BAE" : "BAC", "EAB" : "CAB", "DAE" : "DAC", "EAD" : "CAD", "ABD" : "ABC", "DBA" : "CBA", "EBD" : "EBC", "DBE" : "CBE",
- "BEA" : "BEC", "AEB" : "CEB", "DEA" : "DEC", "AED" : "CED", "BDE" : "CDE", "EDB" : "EDC", "ADB" : "ADC", "BDA" : "CDA"};
- var unsortedKeyList = _.map(finishedEqualitiesList, function(key) { return _.clone(key); });
+ var equivAngles = {"ADE" : "BDE", "BDF" : "BDE", "ADF" : "BDE", "BAF" : "BAC", "DAC" : "BAC", "DAF" : "BAC", "CFD" : "CFE", "AFE" : "CFE", "AFD" : "CFE"};
+ var unsortedKeyList = _.clone(finishedEqualitiesList);
var finishedKeys = sortEqualityList(unsortedKeyList.reverse(), finishedEqualities);
var components = divID.split("-");
@@ -685,9 +708,9 @@ function checkFillBlanksReason(select, selectID) {
}
// for fill-in-the-blanks proofs, this hint function looks for the next missing reason, and generate a hint based
-// on that using nextStatementHint()
+// on that
function getFillBlanksHint(giveAway) {
- var unsortedKeyList = _.map(finishedEqualitiesList, function(key) { return _.clone(key); });
+ var unsortedKeyList = _.clone(finishedEqualitiesList);
var finishedKeys = sortEqualityList(unsortedKeyList.reverse(), finishedEqualities);
if (!giveAway) {
@@ -702,6 +725,17 @@ function getFillBlanksHint(giveAway) {
for (var i = 0; i < finishedKeys.length; i++) {
beforeEqualities[finishedKeys[i]] = finishedEqualities[finishedKeys[i]];
}
+ for (var i = 0; i < SEGMENTS.length; i++) {
+ beforeEqualities[[SEGMENTS[i], SEGMENTS[i]]] = "Same segment";
+ }
+
+ for (var i = 0; i < ANGLES.length; i++) {
+ beforeEqualities[[ANGLES[i], ANGLES[i]]] = "Same angle";
+ }
+
+ for (var i = 0; i < TRIANGLES.length; i++) {
+ beforeEqualities[[TRIANGLES[i], TRIANGLES[i]]] = "Same triangle";
+ }
if (components[0] === "t") {
var triangle1 = finishedKeys[components[1]][0];
@@ -906,7 +940,7 @@ function outputBadProof() {
// now construct the proof we want to hand to the exercise
var proofText = "<h3>Givens</h3>";
- var knownKeys = sortEqualityList(_.keys(knownEqualities), knownEqualities);
+ var knownKeys = sortEqualityStringList(_.keys(knownEqualities), knownEqualities);
var numberGivens = 0;
_.each(knownKeys, function(key) {
@@ -1089,6 +1123,8 @@ function traceBack(statementKey, depth) {
finishedEqualities[statementKey.reverse()] = "given";
finishedEqualitiesList.push(statementKey);
finishedEqualitiesList.push(statementKey.reverse());
+ knownEqualitiesList.push(statementKey);
+ knownEqualitiesList.push(statementKey.reverse());
if (statementKey[0] instanceof Triang) {
fixedTriangles[statementKey[0]] = true;
@@ -1436,6 +1472,8 @@ function traceBack(statementKey, depth) {
finishedEqualities[statementKey.reverse()] = "given";
finishedEqualitiesList.push(statementKey);
finishedEqualitiesList.push(statementKey.reverse());
+ knownEqualitiesList.push(statementKey);
+ knownEqualitiesList.push(statementKey.reverse());
}
// otherwise, change the labeling on the triangle so that the segments given in the
// statement key are corresponding
@@ -1443,7 +1481,7 @@ function traceBack(statementKey, depth) {
var trianglePair = newTriangles[KhanUtil.randRange(0, newTriangles.length - 1)];
// there has to be a better way of doing this
- // _indexOf doesn't work (because of === issues?)
+ // _.indexOf doesn't work (because of === issues?)
var index1;
for (var i = 0; i < trianglePair[0].segs.length; i++) {
if (trianglePair[0].segs[i].equals(seg1)) {
@@ -1508,6 +1546,8 @@ function traceBack(statementKey, depth) {
finishedEqualities[statementKey.reverse()] = "given";
finishedEqualitiesList.push(statementKey);
finishedEqualitiesList.push(statementKey.reverse());
+ knownEqualitiesList.push(statementKey);
+ knownEqualitiesList.push(statementKey.reverse());
}
// otherwise, change the labeling on the triangle so that the angles given in the
// statement key are corresponding
@@ -1580,6 +1620,8 @@ function setGivenOrTraceBack(keys, reason, oldKey, dep) {
finishedEqualities[key.reverse()] = "given";
finishedEqualitiesList.push(key);
finishedEqualitiesList.push(key.reverse());
+ knownEqualitiesList.push(key);
+ knownEqualitiesList.push(key.reverse());
if (key[0] instanceof Triang) {
fixedTriangles[key[0]] = true;
@@ -1598,6 +1640,8 @@ function setGivenOrTraceBack(keys, reason, oldKey, dep) {
finishedEqualities[oldKey.reverse()] = "given";
finishedEqualitiesList.push(oldKey);
finishedEqualitiesList.push(oldKey.reverse());
+ knownEqualitiesList.push(oldKey);
+ knownEqualitiesList.push(oldKey.reverse());
if (oldKey[0] instanceof Triang) {
fixedTriangles[oldKey[0]] = true;
@@ -1707,6 +1751,7 @@ function checkTriangleCongruent(triangle1, triangle2, reason) {
if (reason === "SSS") {
knownEqualities[[triangle1, triangle2]] = "SSS";
knownEqualities[[triangle2, triangle1]] = "SSS";
+ knownEqualitiesList.push([triangle1, triangle2]);
return true;
}
}
@@ -1720,6 +1765,7 @@ function checkTriangleCongruent(triangle1, triangle2, reason) {
if (reason === "ASA") {
knownEqualities[[triangle1, triangle2]] = "ASA";
knownEqualities[[triangle2, triangle1]] = "ASA";
+ knownEqualitiesList.push([triangle1, triangle2]);
return true;
}
}
@@ -1733,6 +1779,7 @@ function checkTriangleCongruent(triangle1, triangle2, reason) {
if (reason === "SAS") {
knownEqualities[[triangle1, triangle2]] = "SAS";
knownEqualities[[triangle2, triangle1]] = "SAS";
+ knownEqualitiesList.push([triangle1, triangle2]);
return true;
}
}
@@ -1748,6 +1795,7 @@ function checkTriangleCongruent(triangle1, triangle2, reason) {
if (reason === "AAS") {
knownEqualities[[triangle1, triangle2]] = "AAS";
knownEqualities[[triangle2, triangle1]] = "AAS";
+ knownEqualitiesList.push([triangle1, triangle2]);
return true;
}
}
@@ -1762,6 +1810,7 @@ function checkTriangleCongruent(triangle1, triangle2, reason) {
if (reason === "AAS") {
knownEqualities[[triangle1, triangle2]] = "AAS";
knownEqualities[[triangle2, triangle1]] = "AAS";
+ knownEqualitiesList.push([triangle1, triangle2]);
return true;
}
}
@@ -1793,6 +1842,7 @@ function checkSegEqual(seg1, seg2, reason) {
if (reason === "CPCTC" || reason === "corresponding parts of congruent triangles are congruent") {
knownEqualities[[seg1, seg2]] = "corresponding parts of congruent triangles are congruent";
knownEqualities[[seg2, seg1]] = "corresponding parts of congruent triangles are congruent";
+ knownEqualitiesList.push([seg1, seg2]);
return true;
}
}
@@ -1821,6 +1871,7 @@ function checkAngEqual(ang1, ang2, reason) {
if (reason === "CPCTC" || reason === "corresponding parts of congruent triangles are congruent") {
knownEqualities[[ang1, ang2]] = "corresponding parts of congruent triangles are congruent";
knownEqualities[[ang2, ang1]] = "corresponding parts of congruent triangles are congruent";
+ knownEqualitiesList.push([ang1, ang2]);
return true;
}
}
@@ -1847,6 +1898,7 @@ function checkAngEqual(ang1, ang2, reason) {
if (reason === "vertical angles" || reason === "vertical angles are equal") {
knownEqualities[[ang1, ang2]] = "vertical angles are equal";
knownEqualities[[ang2, ang1]] = "vertical angles are equal";
+ knownEqualitiesList.push([ang1, ang2]);
return true;
}
}
@@ -1857,6 +1909,7 @@ function checkAngEqual(ang1, ang2, reason) {
if (reason === "alternate angles" || reason === "alternate interior angles are equal") {
knownEqualities[[ang1, ang2]] = "alternate interior angles are equal";
knownEqualities[[ang2, ang1]] = "alternate interior angles are equal";
+ knownEqualitiesList.push([ang1, ang2]);
return true;
}
}
@@ -1918,7 +1971,7 @@ function checkTriangleForHint(triangle1, triangle2, equalityObject) {
&& eqIn([triangle1.angs[(i + 1) % 3], triangle2.angs[(i + 1) % 3]], equalityObject)
&& eqIn([triangle1.segs[(i + 2) % 3], triangle2.segs[(i + 2) % 3]], equalityObject)) {
return [[triangle1.angs[i], triangle2.angs[i]],
- [triangle1.segs[(i + 2) % 3], triangle2.segs[(i + 2) % 3]], [triangle1.segs[(i + 2) % 3], triangle2.segs[(i + 2) % 3]]];
+ [triangle1.angs[(i + 1) % 3], triangle2.angs[(i + 1) % 3]], [triangle1.segs[(i + 2) % 3], triangle2.segs[(i + 2) % 3]]];
}
}
@@ -1944,13 +1997,27 @@ function checkSegForHint(seg1, seg2, equalityObject) {
// return [];
// }
-
for (var i = 0; i < seg1.triangles.length; i++) {
for (var j = 0; j < seg2.triangles.length; j++) {
+ var index1;
+ for (var k = 0; k < seg1.triangles[i][0].segs.length; k++) {
+ if (seg1.triangles[i][0].segs[k].equals(seg1)) {
+ index1 = k;
+ }
+ }
+
+ var index2;
+ for (var k = 0; k < seg2.triangles[j][0].segs.length; k++) {
+ if (seg2.triangles[j][0].segs[k].equals(seg2)) {
+ index2 = k;
+ }
+ }
+
// if the segments' corresponding triangles are congruent AND they're the same part of those triangles, we add
// to the known equalities
if (eqIn([seg1.triangles[i][0], seg2.triangles[j][0]], equalityObject)
- && _.indexOf(seg1, seg1.triangles[i][0].segs) === _.indexOf(seg2, seg2.triangles[j][0].segs)) {
+ && index1 === index2) {
+
return [seg1.triangles[i][0], seg2.triangles[j][0]];
}
}
@@ -1969,8 +2036,23 @@ function checkAngForHint(ang1, ang2, equalityObject) {
// to the known
for (var i = 0; i < ang1.triangles.length; i++) {
for (var j = 0; j < ang2.triangles.length; j++) {
+
+ var index1;
+ for (var k = 0; k < ang1.triangles[i][0].angs.length; k++) {
+ if (ang1.triangles[i][0].angs[k].equals(ang1)) {
+ index1 = k;
+ }
+ }
+
+ var index2;
+ for (var k = 0; k < ang2.triangles[j][0].angs.length; k++) {
+ if (ang2.triangles[j][0].angs[k].equals(ang2)) {
+ index2 = k;
+ }
+ }