document.getElementById('hintNumFormId').value = '0';
//sets up variables
let question1Answer = 0;
let question2Answer = 0;
//sets up constants
const ctx = document.getElementById('c').getContext('2d'),
ca = document.getElementById('ca'),
coords = document.getElementById('coords'),
size = document.getElementById('size'),
toggleCartesian = (e) => { ca.cartesian = !ca.cartesian };
//draws stuff on the grid
function draw(ctx, view) {
let w = ctx.canvas.width, h = ctx.canvas.height,
sz = 20*view.scl, xoff = view.x%sz, yoff = view.y%sz;
if (ca.cartesian)
ctx.setTransform(1,0,0,-1,0.5,h-0.5);
else
ctx.setTransform(1,0,0,1,0.5,0.5);
ctx.clearRect(0,0,w,h);
// draw grid ...
if (view.scl > 0.2) {
ctx.strokeStyle = "#ccc";
ctx.lineWidth = 1;
ctx.beginPath();
for (let x=xoff,nx=w+1; x<nx; x+=sz) { ctx.moveTo(x,0); ctx.lineTo(x,h); }
for (let y=yoff,ny=h+1; y<ny; y+=sz) { ctx.moveTo(0,y); ctx.lineTo(w,y); }
ctx.stroke();
}
//draw origin lines
if (document.getElementById('OLID').checked == true) {
ctx.lineWidth = 2;
ctx.strokeStyle = "#555"; // origin lines ...
ctx.beginPath();
ctx.moveTo(view.x,0); ctx.lineTo(view.x,h);
ctx.moveTo(0,view.y); ctx.lineTo(w,view.y);
ctx.stroke();
ctx.closePath();
}
//draw shapes
ctx.save();
if (ca.cartesian)
ctx.setTransform(view.scl,0,0,-view.scl,view.x+0.5,h-view.y-0.5);
else
ctx.setTransform(view.scl,0,0,view.scl,view.x+0.5,view.y+0.5);
//draws the the 1st doorstop
ctx.beginPath();
ctx.strokeStyle = "#555";
ctx.moveTo(40,40);
ctx.lineTo(140,40)
ctx.lineTo(140,97.6);
ctx.lineTo(40,40);
ctx.fillStyle = "#fff2e6";
ctx.fill();
ctx.lineWidth=1;
ctx.stroke();
//draws the the 2nd doorstop
ctx.beginPath();
ctx.moveTo(40,160);
ctx.lineTo(180,160)
ctx.lineTo(180,220);
ctx.lineTo(40,160);
ctx.fillStyle = "#fff2e6";
ctx.fill();
ctx.lineWidth=1;
ctx.stroke();
//draws the text
ctx.scale(1, -1);
ctx.fillStyle = "black";
ctx.font = "20px Arial";
ctx.fillText('D',23,-25);
ctx.fillText('E',145,-25);
ctx.fillText('F',145,-100);
ctx.fillText('5',85,-20);
ctx.fillText('2.88',145,-60);
ctx.fillText('Current Doorstop',240,-60);
ctx.fillText('A',23,-145);
ctx.fillText('B',184,-145);
ctx.fillText('C',184,-220);
ctx.fillText('7',110,-140);
ctx.fillText('3',185,-185);
ctx.fillText('New Doorstop',240,-185);
//Handles if the hints show in the hints tab
if (document.getElementById("hintNumFormId").value == 1) {
document.getElementById("noHintMessage").style = "display: none;"
document.getElementById("hintTabN1").style = "display: block;"
}
if (document.getElementById("hintNumFormId").value == 2) {
document.getElementById("hintTabN2").style = "display: block;"
}
if (document.getElementById("hintNumFormId").value == 3) {
document.getElementById("hintTabN3").style = "display: block;"
document.getElementById("hint-btn").style = "display: none;"
}
}
function render() {
draw(ctx, ca.view);
requestAnimationFrame(render);
}
window.onload = () => {
ca.observe('pointer', e => {
let {x,y} = ca.pntToUsr(e),
prec = Math.max(Math.log(ca.view.scl)/Math.log(2), 0);
coords.innerHTML = `Cursor Location: ${Math.round((x/20)).toFixed(prec)} / ${Math.round((y/20)).toFixed(prec)}`;
});
ca.observe('resize', e => {
size.innerHTML = `size: ${e.width} / ${e.height}`;
});
ca.resize({width,height}=ca); // cause single initial notification ..
render();
}
//Checks if the answer is correct
function checkAnswer() {
let problemAnswer = document.getElementById('answer').value;
document.cookie = 'problemAnswerC='+ document.getElementById('answer').value;
let trimAnswer = problemAnswer.replace(/ /g,'');
if (trimAnswer == 'a=23.2' || trimAnswer == 'a=23.20' || trimAnswer == 'A=23.2' || trimAnswer == 'A=23.20' || trimAnswer == '23.20' || trimAnswer == '23.2') {
document.getElementById("pbar").style = "display: none;"
document.getElementById("pbar1").style = "display: inline-block;"
question1Answer = 1;
document.getElementById("answerresults").innerHTML = "<span class='alert alert-success'>Yay! Correct</span>";
} else {
document.getElementById("answerresults").innerHTML = "<span class='alert alert-danger'>Oops! Try Again!</div>";
}
};
//Displays hints when hint button is pressed
function hintFunc() {
let hintNum = document.getElementById("hintNumFormId").value
if (hintNum == 0) {
alert('Use a triganomic ratio to figure out the measure of angle A.')
document.getElementById("hintNumFormId").value = "1";
}
if (hintNum == 1) {
alert('Use Inverse Tangent on the legs of the triangle to find the measure of angle A')
document.getElementById("hintNumFormId").value = "2";
}
if (hintNum == 2) {
alert('The measure of angle A is the Inverse Tangent (Tan^-1) of 3/7.')
document.getElementById("hintNumFormId").value = "3";
}
if (hintNum == 3) {
alert('Sorry, no more hints, use the hints tab to see previous hints.')
}
if (hintNum > 3) {
alert('Please report this bug to Nathan, as this message should not appear, unless you edited the code, you hacker.')
}
}
!
