Team:UCLA/Template/Javascript
From 2014.igem.org
(Difference between revisions)
Samichaels (Talk | contribs) |
Samichaels (Talk | contribs) |
||
Line 145: | Line 145: | ||
<!-- TEARABLE CLOTH --> | <!-- TEARABLE CLOTH --> | ||
- | + | var physics_accuracy = 3, | |
- | + | mouse_influence = 20, | |
- | + | mouse_cut = 5, | |
- | + | gravity = 1200, | |
- | + | cloth_height = 30, | |
- | + | cloth_width = 50, | |
- | + | start_y = 20, | |
- | + | spacing = 7, | |
- | var physics_accuracy | + | tear_distance = 60; |
- | mouse_influence | + | |
- | mouse_cut | + | |
- | gravity | + | |
- | cloth_height | + | |
- | cloth_width | + | |
- | start_y | + | |
- | spacing | + | |
- | tear_distance | + | |
Line 190: | Line 182: | ||
var Point = function (x, y) { | var Point = function (x, y) { | ||
- | this.x | + | this.x = x; |
- | this.y | + | this.y = y; |
- | this.px | + | this.px = x; |
- | this.py | + | this.py = y; |
- | this.vx | + | this.vx = 0; |
- | this.vy | + | this.vy = 0; |
- | this.pin_x | + | this.pin_x = null; |
- | this.pin_y | + | this.pin_y = null; |
- | + | ||
this.constraints = []; | this.constraints = []; | ||
}; | }; | ||
Line 237: | Line 229: | ||
Point.prototype.draw = function () { | Point.prototype.draw = function () { | ||
- | if ( | + | if (this.constraints.length <= 0) return; |
var i = this.constraints.length; | var i = this.constraints.length; | ||
Line 255: | Line 247: | ||
while (i--) this.constraints[i].resolve(); | while (i--) this.constraints[i].resolve(); | ||
- | this.x > boundsx | + | if (this.x > boundsx) { |
- | this.y | + | |
+ | this.x = 2 * boundsx - this.x; | ||
+ | |||
+ | } else if (this.x < 1) { | ||
+ | |||
+ | this.x = 2 - this.x; | ||
+ | } | ||
+ | |||
+ | if (this.y > boundsy) { | ||
+ | |||
+ | this.y = 2 * boundsy - this.y; | ||
+ | |||
+ | } else if (this.y < 1) { | ||
+ | |||
+ | this.y = 2 - this.y; | ||
+ | } | ||
}; | }; | ||
Line 266: | Line 273: | ||
}; | }; | ||
- | Point.prototype.remove_constraint = function ( | + | Point.prototype.remove_constraint = function (lnk) { |
- | this.constraints. | + | var i = this.constraints.length; |
+ | while (i--) | ||
+ | if (this.constraints[i] == lnk) this.constraints.splice(i, 1); | ||
}; | }; | ||
Line 284: | Line 293: | ||
var Constraint = function (p1, p2) { | var Constraint = function (p1, p2) { | ||
- | this.p1 | + | this.p1 = p1; |
- | this.p2 | + | this.p2 = p2; |
this.length = spacing; | this.length = spacing; | ||
}; | }; | ||
Line 291: | Line 300: | ||
Constraint.prototype.resolve = function () { | Constraint.prototype.resolve = function () { | ||
- | var diff_x | + | var diff_x = this.p1.x - this.p2.x, |
- | diff_y | + | diff_y = this.p1.y - this.p2.y, |
- | dist | + | dist = Math.sqrt(diff_x * diff_x + diff_y * diff_y), |
- | diff | + | diff = (this.length - dist) / dist; |
if (dist > tear_distance) this.p1.remove_constraint(this); | if (dist > tear_distance) this.p1.remove_constraint(this); | ||
Line 370: | Line 379: | ||
canvas.onmousedown = function (e) { | canvas.onmousedown = function (e) { | ||
- | mouse.button | + | mouse.button = e.which; |
- | mouse.px | + | mouse.px = mouse.x; |
- | mouse.py | + | mouse.py = mouse.y; |
- | var rect | + | var rect = canvas.getBoundingClientRect(); |
- | mouse.x | + | mouse.x = e.clientX - rect.left, |
- | mouse.y | + | mouse.y = e.clientY - rect.top, |
- | mouse.down | + | mouse.down = true; |
e.preventDefault(); | e.preventDefault(); | ||
}; | }; | ||
Line 386: | Line 395: | ||
canvas.onmousemove = function (e) { | canvas.onmousemove = function (e) { | ||
- | mouse.px | + | mouse.px = mouse.x; |
- | mouse.py | + | mouse.py = mouse.y; |
- | var rect | + | var rect = canvas.getBoundingClientRect(); |
- | mouse.x | + | mouse.x = e.clientX - rect.left, |
- | mouse.y | + | mouse.y = e.clientY - rect.top, |
e.preventDefault(); | e.preventDefault(); | ||
}; | }; | ||
Line 402: | Line 411: | ||
ctx.strokeStyle = '#888'; | ctx.strokeStyle = '#888'; | ||
- | |||
cloth = new Cloth(); | cloth = new Cloth(); | ||
- | |||
update(); | update(); | ||
} | } | ||
Line 410: | Line 417: | ||
window.onload = function () { | window.onload = function () { | ||
- | canvas | + | canvas = document.getElementById('c'); |
- | ctx | + | ctx = canvas.getContext('2d'); |
- | canvas.width | + | canvas.width = 560; |
canvas.height = 350; | canvas.height = 350; | ||
Revision as of 21:43, 5 August 2014