Permalink
Fetching contributors…
Cannot retrieve contributors at this time
174 lines (162 sloc) 5.25 KB
<!DOCTYPE html>
<html data-require="math math-format graphie graphie-helpers graphie-geometry">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Polygon intuition</title>
<script src="../khan-exercise.js"></script>
<script>
function updateShape(){
var graph = KhanUtil.currentGraph;
var type="";
if ( jQuery( "#par2" ).is(":checked") ){
jQuery( "#par1" ).attr("checked", true );
jQuery( "#opp" ).attr("checked", true );
}
//Double check if always true
if ( jQuery( "#par1" ).is(":checked") && jQuery( "#adj" ).is(":checked") ){
jQuery( "#par2" ).attr("checked", true );
jQuery( "#opp" ).attr("checked", true );
}
var selected = jQuery( "input:checked" );
var par1 = jQuery( "#par1" ).is(":checked");
var par2 = jQuery( "#par2" ).is(":checked");
var adj = jQuery( "#adj" ).is(":checked");
var opp = jQuery( "#opp" ).is(":checked");
var angle = jQuery( "#angle" ).is(":checked");
if ( selected.length == 0 ){
type = "quadrilateral";
}
if ( selected.length == 5 ){
type = "square";
}
if ( angle && !par1 && !opp && !adj ){
type = "quadrilateral with a right angle";
}
if ( par2 && angle && opp && !adj){
type = "rectangle";
}
if ( par2 && opp && !angle && !adj ){
type = "parallelogram";
}
if ( par2 && opp && !angle && adj ){
type = "rhombus";
}
if ( !par1 && !opp && !angle && adj ){
type = "kite";
}
if ( !par2 && par1 && !opp && !angle && !adj ){
type = "trapezoid";
}
if ( !par2 && par1 && opp && !angle && !adj ){
type = "isosceles trapezoid";
}
if ( !par2 && par1 && !opp && angle && !adj ){
type = "right angle trapezoid";
}
var s = getShape( type );
s.draw();
s.drawLabels();
}
function getShape( name ){
with ( KhanUtil.currentGraph ) {
var graph = KhanUtil.currentGraph;
var ratio = KhanUtil.randFromArray( [ 0.2, 0.5, 0.7, 1.5 ] );
var center = [ graph.POS[ 0 ], graph.POS[ 1 ] - 4 ];
label( [ center[ 0 ], center[ 1 ] - 1 ] , "\\text{ " + name + "}" );
graph.POS = center;
if ( name === "square" ){
return newSquare( center );
}
if ( name === "rectangle" ){
return newRectangle(center );
}
if ( name === "rhombus" ){
return newRhombus(center );
}
if ( name === "parallelogram" ){
return newParallelogram(center );
}
if ( name === "trapezoid" ){
return newTrapezoid( center );
}
if ( name === "right angle trapezoid" ){
var angA = 90;
var angB = 180 - angA;
var angC = KhanUtil.randRange( 30, 160 );
var angD = 180 - angC;
return new Quadrilateral( center, [ angA, angC , angD , angB ], KhanUtil.randFromArray( [ 0.2, 0.5, 0.7, 1.5 ] ) , "", 3 );
}
if ( name === "kite" ){
return newKite(center );
}
if ( name === "isosceles trapezoid" ){
var angC = KhanUtil.randRange( 30, 160 );
var angD = 180 - angC;
return new Quadrilateral( center, [ angC, angC , angD , angD ], KhanUtil.randFromArray( [ 0.2, 0.5, 0.7 ] ) , "", 3 );
}
if ( name === "quadrilateral" ){
var angA = KhanUtil.randRange( 30, 160 );
angB = KhanUtil.randRange( 30, 160 );
if ( angA + angB < 170 ){
var angC = KhanUtil.randRange( 180 - angA - angB, 140 );
}
else {
var angC = KhanUtil.randRange( 30, 330 - angA - angB );
}
var angD = 360 - angA - angB - angC;
return new Quadrilateral( center, [ angA, angB, angC, angD ], KhanUtil.randFromArray( [ 1.3, 1.5, 1.7 ] ) , "", 3 );
}
if ( name === "quadrilateral with a right angle" ){
var angA = 90;
angB = KhanUtil.randRange( 30, 160 );
if ( angA + angB < 170 ){
var angC = KhanUtil.randRange( 180 - angA - angB, 140 );
}
else {
var angC = KhanUtil.randRange( 30, 330 - angA - angB );
}
var angD = 360 - angA - angB - angC;
return new Quadrilateral( center, [ angA, angB , angC , angD ], KhanUtil.randFromArray( [ 1.3, 1.5, 1.7 ] ) , "", 3 );
}
}
}
</script>
</head>
<body>
<div class="exercise">
<div class="vars">
<var id="POLYGONS">[ "quadrilateral", "kite", "trapezoid", "square", "rectangle", "rhombus", "isosceles trapezoid","parallelogram" ]</var>
<var id="POLYGON"> POLYGONS[ 1 ]</var>
</div>
<div class="problems">
<div>
<div class="question">
?
</div>
<div class="graphie" id="grid">
init({
range: [ [ -10, 10 ], [ -23, 6 ] ],
scale: [30, 30]
});
var graph = KhanUtil.currentGraph;
graph.POS = [ -1, 5 ];
qr = updateShape();
</div>
<div class="solution" data-type="multiple">
Polygon command center
<div>
<input id="par1" type="checkbox" onclick="updateShape()">2 sides parallel
<input id="par2" type="checkbox" onclick="updateShape()">4 sides parallel
</div>
<div>
<input id="adj" type="checkbox" onclick="updateShape()">Adjacent sides equal
<input id="opp" type="checkbox" onclick="updateShape()">Opposite sides equal
</div>
<div><input id="angle" type="checkbox" onclick="updateShape()">Angle equal to 90</div>
<span class="sol" data-type="decimal" data-inexact style="display: none" id="intercept-sol"><var>B</var></span>
</div>
</div>
</div>
</div>
</body>
</html>