Polygon Intersect
by djwelsh
HTML
<canvas id="c" width="400" height="400"></canvas>
<label>Magnitude<input type="text" id="forceVectorMagnitude" value="1000" /> M</label>
<label>Angle: <input type="text" id="forceVectorAngle" value="30" /> degrees</label>
<button id="forcePush">Shove</button>
CSS
canvas {
width: 400px;
height: 400px;
outline: 1px solid #ccc;
}
label {
display: block;
}
JavaScript
//Math timing
var lastTime;
var thisTime;
var timeElapsed;
var timeInterval;
var mouse = {
x : 0,
y : 0
};
var intersectVector = {};
var ctx;
var polygon;
var forceApplied = false;// Tells us when to stop applying torque
window.onload = function () {
ctx = (document.getElementById('c')).getContext('2d')
var m = 1.2; //miniaturizer; extend to zoom later, e.g. 10px = 1m
polygon = new Polygon({
cx : 200,
cy : 200,
points : [
{ x : -10 / m, y : 70 / m },
{ x : 50 / m, y : 50 / m },
{ x : 100 / m, y : 0 / m },
{ x : 80 / m, y : -20 / m },
{ x : -30 / m, y : -50 / m },
{ x : -80 / m, y : 10 / m }
],
density : DENSITY.birch,
rotation : 0,
rotationalVelocity : 0
});
//Onclick
document.onclick = function (event) {
if (!event) event = window.event;
/*
if (intersectVector) {
polygon.forceVector = {
x : -(polygon.cx) + intersectVector.x,
y : -(polygon.cy) + intersectVector.y,
dx : -(polygon.cx) + intersectVector.x,
dy : -(polygon.cy) + intersectVector.y,
polyFixed : false
};
}
*/
}
console.log(document.getElementById('forcePush'));
(document.getElementById('c')).onmousemove = function (event) {
if (!event) event = window.event;
mouse.x = event.offsetX;
mouse.y = event.offsetY;
};
(document.getElementById('forcePush')).onmousedown = function (event) {
if (!event) event = window.event;
forceApplied = true;
};
(document.getElementById('forceVectorAngle')).onkeydown = function (event) {
if (!event) event = window.event;
var newVal = parseInt(this.value);
if (event.keyCode == 38) {
newVal += 10;
}
else if (event.keyCode == 40) {
...