summaryrefslogtreecommitdiff
path: root/public
diff options
context:
space:
mode:
Diffstat (limited to 'public')
-rw-r--r--public/assets/javascripts/rectangles/engine/rooms/mover.js85
-rw-r--r--public/assets/javascripts/rectangles/models/room.js6
-rw-r--r--public/assets/javascripts/ui/_router.js26
-rw-r--r--public/assets/javascripts/ui/editor/ColorControl.js2
-rw-r--r--public/assets/javascripts/ui/editor/HelpCursor.js2
-rw-r--r--public/assets/javascripts/ui/reader/MediaPlayer.js2
-rw-r--r--public/assets/javascripts/ui/reader/ReaderView.js1
-rw-r--r--public/assets/javascripts/ui/reader/ShareView.js27
-rw-r--r--public/assets/javascripts/ui/z_share.js25
-rw-r--r--public/assets/javascripts/vendor/canvasutilities.js145
-rwxr-xr-xpublic/assets/stylesheets/app.css45
-rw-r--r--public/assets/test/intersect.html132
12 files changed, 433 insertions, 65 deletions
diff --git a/public/assets/javascripts/rectangles/engine/rooms/mover.js b/public/assets/javascripts/rectangles/engine/rooms/mover.js
index fae2ce6..8ce00fe 100644
--- a/public/assets/javascripts/rectangles/engine/rooms/mover.js
+++ b/public/assets/javascripts/rectangles/engine/rooms/mover.js
@@ -34,7 +34,7 @@ Rooms.mover = new function(){
}
// check if we've breached one of the walls.. clamp position if so
- var collision = base.room.collidesDisc(pos.x, pos.z, radius)
+ var collision = base.room.collidesDisc(cam, pos, radius)
if (collision && ! base.noclip) {
cam.x = (collision & LEFT_RIGHT) ? base.room.rect.x.clampDisc(pos.x, radius) : pos.x
@@ -48,6 +48,89 @@ Rooms.mover = new function(){
base.room = null
}
+/*
+ var dz = new vec2( cam.z, pos.z )
+ dz.normalize()
+
+ var dx = new vec2( cam.x, pos.x )
+ dx.normalize()
+
+ // first check if the cam-pos movement intersects the wall.
+ // next check if it intersects any of the surface frames
+ // if we can pass through the wall at this point, we do not need to clamp.
+ // otherwise, get the distance along the cam-pos vector where we would hit the wall and clamp to it.
+ Walls.list.forEach(function(wall){
+ var t = -1
+ switch (wall.side) {
+ case FRONT:
+ if (cam.z >= wall.edge + radius && wall.edge + radius >= pos.z && wall.vec.intersects(dx) ) {
+ t = check_intersection( front_back_intersection, cam, pos, dx, wall, radius )
+ }
+ break
+ case BACK:
+ // console.log(cam.z|0, wall.edge-radius, pos.z|0, wall.vec.intersects(dx))
+ if (cam.z <= wall.edge - radius && wall.edge - radius <= pos.z && wall.vec.intersects(dx) ) {
+ t = check_intersection( front_back_intersection, cam, pos, dx, wall, -radius )
+ console.log(t)
+ }
+ break
+ case LEFT:
+ if (cam.x >= wall.edge + radius && wall.edge + radius >= pos.x && wall.vec.intersects(dz) ) {
+ t = check_intersection( left_right_intersection, cam, pos, dz, wall, radius )
+ }
+ break
+ case RIGHT:
+ if (cam.x <= wall.edge - radius && wall.edge - radius <= pos.x && wall.vec.intersects(dz) ) {
+ t = check_intersection( left_right_intersection, cam, pos, dz, wall, -radius )
+ }
+ break
+ }
+ if (0 <= t && t <= 1) {
+ pos.x = cam.x + (pos.x - cam.x) * t
+ pos.z = cam.z + (pos.z - cam.z) * t
+
+ dz = new vec2( cam.z, pos.z )
+ dz.normalize()
+
+ dx = new vec2( cam.x, pos.x )
+ dx.normalize()
+ }
+ })
+
+ function check_intersection(intersection_function, cam, pos, cam_pos_vector, wall, radius) {
+ var t = -1
+ wall.surface.faces.some(function(face, i){
+ if (face.y.a == 0 && face.x.intersects(cam_pos_vector)) {
+ t = intersection_function( cam, pos, wall, face, radius )
+ console.log(">>", t)
+ if (0 <= t && t <= 1) {
+ return true
+ }
+ else {
+ t = -1
+ }
+ }
+ return false
+ })
+ return t
+ }
+ function left_right_intersection (cam, pos, wall, face, radius) {
+ var perp_n = (face.x.a - face.x.b) * (wall.edge - cam.z + radius)
+ var perp_d = (face.x.a - face.x.b) * (pos.z - cam.z)
+ if (perp_d == 0) return Infinity
+ return perp_n / perp_d
+ }
+ function front_back_intersection (cam, pos, wall, face, radius) {
+ // va.vx*vb.vy - va.vy*vb.vx
+ var perp_n = (face.x.b - face.x.a) * (wall.edge - cam.x + radius)
+ var perp_d = (face.x.b - face.x.a) * (pos.x - cam.x)
+
+ console.log((pos.x - cam.x), wall.edge - cam.x, radius)
+
+ if (perp_d == 0) return Infinity
+ return perp_n / perp_d
+ }
+*/
// collision test failed, so update position
cam.x = pos.x
cam.z = pos.z
diff --git a/public/assets/javascripts/rectangles/models/room.js b/public/assets/javascripts/rectangles/models/room.js
index b0344a1..26bf055 100644
--- a/public/assets/javascripts/rectangles/models/room.js
+++ b/public/assets/javascripts/rectangles/models/room.js
@@ -122,7 +122,8 @@
return collision
}
- Room.prototype.collidesDisc = function(x,y,radius){
+ Room.prototype.collidesDisc = function(src, dest, radius){
+ var x = dest.x, y = dest.z
var collision = 0, wall_collision, contains_x, contains_y
this.regions.forEach(function(r){
if (! r.sides) return
@@ -152,9 +153,6 @@
if (contains_y) {
collision |= wall_collision & LEFT_RIGHT
}
-// if (bitcount(wall_collision) > 1) {
-// collision |= wall_collision
-// }
})
return collision
}
diff --git a/public/assets/javascripts/ui/_router.js b/public/assets/javascripts/ui/_router.js
index c7b625a..0c95664 100644
--- a/public/assets/javascripts/ui/_router.js
+++ b/public/assets/javascripts/ui/_router.js
@@ -40,8 +40,6 @@ var SiteRouter = Router.extend({
"/project/:name": 'projectViewer',
"/project/:name/edit": 'projectEditor',
"/project/:name/view": 'projectViewer',
-
- "/test/wallpaper": 'testWallpaper',
},
mobileRoutes: {
@@ -213,29 +211,5 @@ var SiteRouter = Router.extend({
// this.documentModal.destroy(name)
},
- testWallpaper: function(e){
- var content = document.getElementById("content")
- content.style.width = "680px"
- content.style.margin = "0 auto"
- var wm = new WallpaperManager()
- app.on('wallpaper-ready', function(){
- var black = [0,0,0,0]
- var white = [255,255,255,1.0]
- var swatches = wm.buildSwatches(black, white, 4)
- document.body.style.backgroundColor = "#eee"
- swatches.forEach(function(swatch){
- swatch.style.margin = "4px"
- swatch.style.border = "1px solid lime"
- swatch.style.backgroundColor = "#888"
- content.appendChild(swatch)
- swatch.onclick = function(){
- dataUrl = swatch.toDataURL()
- document.body.style.backgroundImage = "url(" + dataUrl + ")"
- }
- })
- })
- wm.init()
- },
-
})
diff --git a/public/assets/javascripts/ui/editor/ColorControl.js b/public/assets/javascripts/ui/editor/ColorControl.js
index 72e9fb1..d1a8c7b 100644
--- a/public/assets/javascripts/ui/editor/ColorControl.js
+++ b/public/assets/javascripts/ui/editor/ColorControl.js
@@ -101,7 +101,7 @@ var ColorControl = View.extend({
initialState: null,
- begin: function(){
+ begin: function(){
this.initialState = this.serialize()
},
diff --git a/public/assets/javascripts/ui/editor/HelpCursor.js b/public/assets/javascripts/ui/editor/HelpCursor.js
index 7268b32..8ada237 100644
--- a/public/assets/javascripts/ui/editor/HelpCursor.js
+++ b/public/assets/javascripts/ui/editor/HelpCursor.js
@@ -10,7 +10,7 @@ var HelpCursor = View.extend({
addmedia: "Great, now click a wall to place this image.",
resize: "Drag the image to position it, or use the dots to resize.",
presets: "These are some basic presets to get you started. Click em! :-)",
- wallpaper: "Drag the wallpaper onto the walls, floor, and ceiling.",
+ wallpaper: "Click the wallpaper you want then apply it to the walls. Feel free to upload your own too!",
colors: "Use these colors to change the color of the walls, floor, and ceiling.",
settings: "This is where you publish your project. Give it a name, hit save, and you'll have a URL you can share with your friends.",
},
diff --git a/public/assets/javascripts/ui/reader/MediaPlayer.js b/public/assets/javascripts/ui/reader/MediaPlayer.js
index 7f73e1b..e40c6ff 100644
--- a/public/assets/javascripts/ui/reader/MediaPlayer.js
+++ b/public/assets/javascripts/ui/reader/MediaPlayer.js
@@ -44,7 +44,7 @@ var MediaPlayer = FormView.extend({
this.unbind()
}
if (media.type == "image") {
- if ((! media.title || ! media.title.length) && (! media.description || ! media.description.length) || (media.title == filenameFromUrl(media.url)) ) {
+ if ( ! media.description && (! media.title || media.title == filenameFromUrl(media.url)) ) {
this.hide()
return
}
diff --git a/public/assets/javascripts/ui/reader/ReaderView.js b/public/assets/javascripts/ui/reader/ReaderView.js
index 8531244..c132609 100644
--- a/public/assets/javascripts/ui/reader/ReaderView.js
+++ b/public/assets/javascripts/ui/reader/ReaderView.js
@@ -9,6 +9,7 @@ var ReaderView = View.extend({
initialize: function(){
this.mediaPlayer = new MediaPlayer ({ parent: this })
+ this.shareView = new ShareView ({ parent: this })
},
load: function(name){
diff --git a/public/assets/javascripts/ui/reader/ShareView.js b/public/assets/javascripts/ui/reader/ShareView.js
new file mode 100644
index 0000000..35c23ca
--- /dev/null
+++ b/public/assets/javascripts/ui/reader/ShareView.js
@@ -0,0 +1,27 @@
+var ShareView = View.extend({
+ el: ".share",
+
+ events: {
+ "click #share_facebook": "facebook",
+ "click #share_twitter": "twitter",
+ },
+
+ initialize: function(opt){
+ this.parent = opt.parent
+ },
+
+ facebook: function (e) {
+ e.preventDefault()
+ var msg = $(".roomName").html() + " on VValls"
+ var url = "https://www.facebook.com/share.php?u=" + encodeURIComponent(window.location.origin + window.location.pathname) + "&t=" + encodeURIComponent(msg);
+ window.open(url, "_blank")
+ },
+
+ twitter: function (e) {
+ e.preventDefault()
+ var msg = $(".roomName").html() + " on VValls"
+ var url = "https://twitter.com/home?status=" + encodeURIComponent(window.location.origin + window.location.pathname + " " + msg);
+ window.open(url, "_blank")
+ }
+
+})
diff --git a/public/assets/javascripts/ui/z_share.js b/public/assets/javascripts/ui/z_share.js
deleted file mode 100644
index d31aa89..0000000
--- a/public/assets/javascripts/ui/z_share.js
+++ /dev/null
@@ -1,25 +0,0 @@
-var share = {
- init: function(){
- share.bind()
- },
- bind: function(){
- $("#facebook").click(share.facebook)
- $("#twitter").click(share.twitter)
- },
- url: "http://vvalls.com/",
- facebook_msg: "",
- twitter_msg: "",
- openLink: function (url) {
- window.open(url, "_blank");
- },
- facebook: function () {
- var url = "https://www.facebook.com/share.php?u=" + encodeURIComponent(share.url) + "&t=" + encodeURIComponent(share.facebook_msg);
- share.openLink(url);
- return false;
- },
- twitter: function () {
- var url = "https://twitter.com/home?status=" + encodeURIComponent(share.url + " " + share.twitter_msg);
- share.openLink(url);
- return false;
- }
-}
diff --git a/public/assets/javascripts/vendor/canvasutilities.js b/public/assets/javascripts/vendor/canvasutilities.js
new file mode 100644
index 0000000..011ebb0
--- /dev/null
+++ b/public/assets/javascripts/vendor/canvasutilities.js
@@ -0,0 +1,145 @@
+var drawArrow = function(ctx, x1, y1, x2, y2, style, which, angle, d) {
+ 'use strict';
+ // Ceason pointed to a problem when x1 or y1 were a string, and concatenation
+ // would happen instead of addition
+ if (typeof(x1) == 'string') x1 = parseInt(x1);
+ if (typeof(y1) == 'string') y1 = parseInt(y1);
+ if (typeof(x2) == 'string') x2 = parseInt(x2);
+ if (typeof(y2) == 'string') y2 = parseInt(y2);
+ style = typeof(style) != 'undefined' ? style : 3;
+ which = typeof(which) != 'undefined' ? which : 1; // end point gets arrow
+ angle = typeof(angle) != 'undefined' ? angle : Math.PI / 8;
+ d = typeof(d) != 'undefined' ? d : 10;
+ // default to using drawHead to draw the head, but if the style
+ // argument is a function, use it instead
+ var toDrawHead = typeof(style) != 'function' ? drawHead : style;
+
+ // For ends with arrow we actually want to stop before we get to the arrow
+ // so that wide lines won't put a flat end on the arrow.
+ //
+ var dist = Math.sqrt((x2 - x1) * (x2 - x1) + (y2 - y1) * (y2 - y1));
+ var ratio = (dist - d / 3) / dist;
+ var tox, toy, fromx, fromy;
+ if (which & 1) {
+ tox = Math.round(x1 + (x2 - x1) * ratio);
+ toy = Math.round(y1 + (y2 - y1) * ratio);
+ } else {
+ tox = x2;
+ toy = y2;
+ }
+ if (which & 2) {
+ fromx = x1 + (x2 - x1) * (1 - ratio);
+ fromy = y1 + (y2 - y1) * (1 - ratio);
+ } else {
+ fromx = x1;
+ fromy = y1;
+ }
+
+ // Draw the shaft of the arrow
+ ctx.beginPath();
+ ctx.moveTo(fromx, fromy);
+ ctx.lineTo(tox, toy);
+ ctx.stroke();
+
+ // calculate the angle of the line
+ var lineangle = Math.atan2(y2 - y1, x2 - x1);
+ // h is the line length of a side of the arrow head
+ var h = Math.abs(d / Math.cos(angle));
+
+ if (which & 1) { // handle far end arrow head
+ var angle1 = lineangle + Math.PI + angle;
+ var topx = x2 + Math.cos(angle1) * h;
+ var topy = y2 + Math.sin(angle1) * h;
+ var angle2 = lineangle + Math.PI - angle;
+ var botx = x2 + Math.cos(angle2) * h;
+ var boty = y2 + Math.sin(angle2) * h;
+ toDrawHead(ctx, topx, topy, x2, y2, botx, boty, style);
+ }
+ if (which & 2) { // handle near end arrow head
+ var angle1 = lineangle + angle;
+ var topx = x1 + Math.cos(angle1) * h;
+ var topy = y1 + Math.sin(angle1) * h;
+ var angle2 = lineangle - angle;
+ var botx = x1 + Math.cos(angle2) * h;
+ var boty = y1 + Math.sin(angle2) * h;
+ toDrawHead(ctx, topx, topy, x1, y1, botx, boty, style);
+ }
+}
+
+var drawHead = function(ctx, x0, y0, x1, y1, x2, y2, style) {
+ 'use strict';
+ if (typeof(x0) == 'string') x0 = parseInt(x0);
+ if (typeof(y0) == 'string') y0 = parseInt(y0);
+ if (typeof(x1) == 'string') x1 = parseInt(x1);
+ if (typeof(y1) == 'string') y1 = parseInt(y1);
+ if (typeof(x2) == 'string') x2 = parseInt(x2);
+ if (typeof(y2) == 'string') y2 = parseInt(y2);
+ var radius = 3;
+ var twoPI = 2 * Math.PI;
+
+ // all cases do this.
+ ctx.save();
+ ctx.beginPath();
+ ctx.moveTo(x0, y0);
+ ctx.lineTo(x1, y1);
+ ctx.lineTo(x2, y2);
+ switch (style) {
+ case 0:
+ // curved filled, add the bottom as an arcTo curve and fill
+ var backdist = Math.sqrt(((x2 - x0) * (x2 - x0)) + ((y2 - y0) * (y2 - y0)));
+ ctx.arcTo(x1, y1, x0, y0, .55 * backdist);
+ ctx.fill();
+ break;
+ case 1:
+ // straight filled, add the bottom as a line and fill.
+ ctx.beginPath();
+ ctx.moveTo(x0, y0);
+ ctx.lineTo(x1, y1);
+ ctx.lineTo(x2, y2);
+ ctx.lineTo(x0, y0);
+ ctx.fill();
+ break;
+ case 2:
+ // unfilled head, just stroke.
+ ctx.stroke();
+ break;
+ case 3:
+ //filled head, add the bottom as a quadraticCurveTo curve and fill
+ var cpx = (x0 + x1 + x2) / 3;
+ var cpy = (y0 + y1 + y2) / 3;
+ ctx.quadraticCurveTo(cpx, cpy, x0, y0);
+ ctx.fill();
+ break;
+ case 4:
+ //filled head, add the bottom as a bezierCurveTo curve and fill
+ var cp1x, cp1y, cp2x, cp2y, backdist;
+ var shiftamt = 5;
+ if (x2 == x0) {
+ // Avoid a divide by zero if x2==x0
+ backdist = y2 - y0;
+ cp1x = (x1 + x0) / 2;
+ cp2x = (x1 + x0) / 2;
+ cp1y = y1 + backdist / shiftamt;
+ cp2y = y1 - backdist / shiftamt;
+ } else {
+ backdist = Math.sqrt(((x2 - x0) * (x2 - x0)) + ((y2 - y0) * (y2 - y0)));
+ var xback = (x0 + x2) / 2;
+ var yback = (y0 + y2) / 2;
+ var xmid = (xback + x1) / 2;
+ var ymid = (yback + y1) / 2;
+
+ var m = (y2 - y0) / (x2 - x0);
+ var dx = (backdist / (2 * Math.sqrt(m * m + 1))) / shiftamt;
+ var dy = m * dx;
+ cp1x = xmid - dx;
+ cp1y = ymid - dy;
+ cp2x = xmid + dx;
+ cp2y = ymid + dy;
+ }
+
+ ctx.bezierCurveTo(cp1x, cp1y, cp2x, cp2y, x0, y0);
+ ctx.fill();
+ break;
+ }
+ ctx.restore();
+}
diff --git a/public/assets/stylesheets/app.css b/public/assets/stylesheets/app.css
index d7876da..ef49350 100755
--- a/public/assets/stylesheets/app.css
+++ b/public/assets/stylesheets/app.css
@@ -153,6 +153,27 @@ a{
font-size: 24px;
padding: 18px 27px 0 8px;
}
+@-moz-keyframes redpulse {
+ 50%{
+ color:#f24444;
+ }
+}
+@keyframes redpulse {
+ 50%{
+ color:#f24444;
+ }
+}
+@-webkit-keyframes redpulse {
+ 50%{
+ color:#f24444;
+ }
+}
+
+.topLinks a.ion-help-circled.active {
+ -webkit-animation:1s redpulse infinite linear;
+ -moz-animation:1s redpulse infinite linear;
+ animation:1s redpulse infinite linear;
+}
.topLinks a.ion-help-circled.active,
.topLinks a.ion-help-circled:hover {
background:transparent;
@@ -916,6 +937,7 @@ border-left: 1px solid black;
position: fixed;
bottom:0;
right:0;
+ pointer-events:none;
z-index: 2;
}
#hud {
@@ -1108,6 +1130,7 @@ border-left: 1px solid black;
margin-top: -16px;
font-size: 13px;
font-family:'Lato', sans-serif;
+ font-weight:600;
}
.menu span.ion-ios7-sunny-outline:hover:after {
@@ -1347,6 +1370,14 @@ border-left: 1px solid black;
font-weight: 300;
}
+.mediaDrawer form h2{
+ font-size: 22px;
+ display: inline-block;
+ position: relative;
+ z-index: 4;
+ margin-bottom: 20px;
+}
+
.mediaDrawer.mediaViewer h2 {
margin-top:28px;
font-size:18px;
@@ -1824,17 +1855,15 @@ input[type="range"]::-webkit-slider-thumb {
position: fixed;
max-width: 200px;
font-size: 15px;
- color: black;
- background: rgba(255,255,255,0.9);
+ color: white;
+ background: rgba(255,0,0,0.8);
margin: 8px 0 0 8px;
padding: 10px;
font-weight: 600;
z-index: 22;
display: none;
- margin-left:-210px;
+ margin-left:-220px;
margin-bottom:20px;
- border:1px solid;
- box-shadow:3px 3px black;
}
.settings.info {
@@ -1873,7 +1902,10 @@ input[type="range"]::-webkit-slider-thumb {
.modalLink:hover span {
text-decoration: underline;
}
-
+.settings .name {
+ display: block;
+ margin-top: 10px;
+}
@-webkit-keyframes fade {
50% {
opacity:0.6;
@@ -2465,6 +2497,7 @@ a[data-role="forgot-password"] {
.share h2 {
font-weight: 400;
font-size: 13px;
+ margin:0;
}
.share a{
diff --git a/public/assets/test/intersect.html b/public/assets/test/intersect.html
new file mode 100644
index 0000000..3f6d110
--- /dev/null
+++ b/public/assets/test/intersect.html
@@ -0,0 +1,132 @@
+<canvas id="canvas"></canvas>
+
+<script src="/assets/javascripts/util.js"></script>
+<script src="/assets/javascripts/vendor/tube.js"></script>
+<script src="/assets/javascripts/rectangles/util/constants.js"></script>
+<script src="/assets/javascripts/rectangles/util/mouse.js"></script>
+<script src="/assets/javascripts/rectangles/models/vec2.js"></script>
+<script src="/assets/javascripts/rectangles/models/rect.js"></script>
+<script src="/assets/javascripts/vendor/canvasutilities.js"></script>
+<script>
+
+var ctx = canvas.getContext('2d')
+
+var w = canvas.width = 600
+var h = canvas.height = 400
+
+var vec_a = new Rect( 100, 120, 50, 100 )
+var vec_b = new Rect( 20, 200, 120, 120 )
+var vecs = [ vec_a, vec_b ]
+var points = [ vec_a.x, vec_a.y, vec_b.x, vec_b.y ]
+var r = 4
+
+var vec_c = new Rect()
+vec_c.x = vec_a.x
+vec_c.y = vec_b.x
+
+var intersect = new vec2 ()
+
+var dragging = false, dragging_a, dragging_b
+var delta = new vec2( 0, 0 )
+
+var mymouse = new mouse({
+ el: canvas,
+ down: function(e, cursor){
+ points.some(function(p){
+ if (-cursor.x.a > p.a - r && -cursor.x.a < p.a + r &&
+ cursor.y.a > p.b - r && cursor.y.a < p.b + r) {
+ dragging_a = p.a
+ dragging_b = p.b
+ dragging = p
+ return true
+ }
+ })
+ },
+ drag: function(e, cursor){
+ if (! dragging) return
+ delta = cursor.delta()
+ delta.a = - delta.a
+ dragging.a = dragging_a + delta.a
+ dragging.b = dragging_b + delta.b
+ },
+ up: function(e, cursor, new_cursor){
+ delta.zero()
+ dragging.dragging = false
+ dragging = false
+ },
+})
+
+function draw () {
+ ctx.fillStyle = "#fff"
+ ctx.fillRect(0,0,w,h)
+
+ ctx.fillStyle = "#bbb"
+ points.forEach(drawPoint)
+
+ drawLine(vec_a.x, vec_a.y, "#f00")
+ drawLine(vec_b.x, vec_b.y, "#00f")
+ drawLine(vec_a.x, vec_b.x, "#080")
+
+ var t = perp(vec_c, vec_b) / ( perp(vec_a, vec_b) || 0.0000001 )
+ intersect.a = vec_a.x.a + ( vec_a.y.a - vec_a.x.a ) * t
+ intersect.b = vec_a.x.b + ( vec_a.y.b - vec_a.x.b ) * t
+
+ var collinear = is_collinear( intersect.b, vec_b )
+ var long_enough_to_intersect = 0 <= t && t <= 1
+
+ if (long_enough_to_intersect && collinear) {
+ ctx.fillStyle = "#f00"
+ }
+ else if (is_on_line) {
+ ctx.fillStyle = "#0f0"
+ }
+ else {
+ ctx.fillStyle = "#000"
+ }
+
+ drawPoint(intersect)
+}
+function drawLine (pa, pb, color) {
+ ctx.fillStyle = color
+ ctx.strokeStyle = color
+ var x1 = pa.a
+ var y1 = pa.b
+ var x2 = pb.a
+ var y2 = pb.b
+ drawArrow(ctx, x1, y1, x2, y2)
+}
+function drawPoint (p) {
+ var x = p.a - r
+ var y = p.b - r
+ ctx.fillRect(x, y, r*2, r*2)
+}
+function perp (va, vb) {
+ return (va.y.a - va.x.a) * (vb.y.b - vb.x.b) - (va.y.b - va.x.b) * (vb.y.a - vb.x.a)
+}
+function is_collinear (n, vec) {
+ var on_x, on_y
+
+ if (vec.x.a < vec.y.a) {
+ on_x = vec.x.a <= n && n <= vec.y.a
+ }
+ else {
+ on_x = vec.x.a >= n && n >= vec.y.a
+ }
+
+ if (vec.x.b < vec.y.b) {
+ on_y = vec.x.b <= n && n <= vec.y.b
+ }
+ else {
+ on_y = vec.x.b >= n && n >= vec.y.b
+ }
+
+ return !! (on_x && on_y)
+}
+
+function animate(){
+ requestAnimationFrame(animate)
+ draw()
+}
+animate()
+
+</script>
generated by cgit v1.2.3-70-g09d2 (git 2.51.0) at 2025-12-23 08:19:05 +0000