summaryrefslogtreecommitdiff
path: root/assets/test/brush/index2.html
diff options
context:
space:
mode:
authorJules Laplace <jules@okfoc.us>2014-11-18 18:41:32 -0500
committerJules Laplace <jules@okfoc.us>2014-11-18 18:41:32 -0500
commit1f86b57c3036a137120e7e0568eec33c1f6a98f1 (patch)
tree1afa092f72b24dc1190e178f18999b7677ac1c14 /assets/test/brush/index2.html
parent4c5fddd39465514de192c1a678a24137271a3b40 (diff)
more brush stuff
Diffstat (limited to 'assets/test/brush/index2.html')
-rw-r--r--assets/test/brush/index2.html119
1 files changed, 0 insertions, 119 deletions
diff --git a/assets/test/brush/index2.html b/assets/test/brush/index2.html
deleted file mode 100644
index 7094ca8..0000000
--- a/assets/test/brush/index2.html
+++ /dev/null
@@ -1,119 +0,0 @@
-<style>
-body,html{margin:0;padding:0;}
-#hud { position: absolute; top: 0; left: 0; pointer-events: none; }
-canvas { position: absolute; top: 0; left: 0; }
-#mask { pointer-events: none; }
-#scratch { display: none; }
-</style>
-<canvas id="canvas"></canvas>
-<canvas id="mask"></canvas>
-<canvas id="scratch"></canvas>
-<div id="hud"></div>
-
-<script src="/assets/javascripts/vendor/bower_components/jquery/dist/jquery.min.js"></script>
-<script src="/assets/javascripts/vendor/bower_components/lodash/dist/lodash.min.js"></script>
-<script src="/assets/javascripts/vendor/canvasutilities.js"></script>
-<script src="/assets/javascripts/vendor/jsBezier-0.6.js"></script>
-<script src="/assets/javascripts/vendor/tube.js"></script>
-<script src="/assets/javascripts/math/util.js"></script>
-<script src="/assets/javascripts/math/point.js"></script>
-<script src="/assets/javascripts/math/vec2.js"></script>
-<script src="/assets/javascripts/util/mouse.js"></script>
-<script src="/assets/javascripts/util/uid.js"></script>
-<script>
-
-var ctx = canvas.getContext('2d')
-var maskCtx = mask.getContext('2d')
-var scratchCtx = scratch.getContext('2d')
-
-var w = mask.width = canvas.width = window.innerWidth
-var h = mask.height = canvas.height = window.innerHeight
-
-var drawing = false
-var lastPoint = new point (0, 0), newPoint = new point (0, 0)
-
-var mymouse = new mouse({
- el: canvas,
- down: function(e, cursor){
- drawing = true
- lastPoint.x = cursor.a.x
- lastPoint.y = cursor.a.y
- maskCtx.clearRect(0,0,w,h)
- drawLine(lastPoint, lastPoint)
-// imagedata = ctx.getImageData( 0, 0, canvas.width, canvas.height )
-// data = imagedata.data
- },
- drag: function(e, cursor){
- newPoint.x = cursor.b.x
- newPoint.y = cursor.b.y
- drawLine(lastPoint, newPoint)
-
- lastPoint.x = newPoint.x
- lastPoint.y = newPoint.y
- },
- up: function(e, cursor, new_cursor){
- drawing = false
- ctx.globalCompositeOperation = "multiply"
- ctx.drawImage(mask, 0, 0)
- maskCtx.clearRect(0,0,w,h)
- },
-})
-
-function drawLine (u, v) {
- var radius = 20
-
- var xmin = Math.min(u.x, v.x)
- var ymin = Math.min(u.y, v.y)
-
- var w = scratch.width = abs(u.x - v.x) + radius*2
- var h = scratch.height = abs(u.y - v.y) + radius*2
-
- var p = new point (0,0)
- var radius2 = radius * radius
-
-// if (w == h && h == radius*2) return
-
- var imagedata = ctx.createImageData(w, h)
- var d = imagedata.data
- var i, j, t, dist
-
- for (i = 0; i < w; i++) {
- for (j = 0; j < h; j++) {
- t = (j * w + i) * 4
-
- p.x = xmin + i - radius
- p.y = ymin + j - radius
-
- dist = distToSegmentSquared( p, u, v )
-
- if (dist > radius2) {
- d[t+3] = 0
- }
- else {
- d[t+0] = d[t+1] = d[t+2] = round( (sqrt(dist)/radius) * 255)
- d[t+3] = 255
- }
- }
- }
- scratchCtx.putImageData(imagedata, 0, 0)
- maskCtx.globalCompositeOperation = 'darken';
- maskCtx.drawImage(scratch, xmin - radius, ymin - radius)
-}
-
-drawLine( new point( 100, 100 ), new point( 100, 400 ) )
-drawLine( new point( 100, 100 ), new point( 400, 100 ) )
-drawLine( new point( 100, 100 ), new point( 400, 400 ) )
-
-function sqr(x) { return x * x }
-function dist2(v, w) { return sqr(v.x - w.x) + sqr(v.y - w.y) }
-function distToSegmentSquared (p, v, w) {
- var l2 = dist2(v, w)
- if (l2 == 0) return dist2(p, v)
- var t = ((p.x - v.x) * (w.x - v.x) + (p.y - v.y) * (w.y - v.y)) / l2
- if (t < 0) return dist2(p, v)
- if (t > 1) return dist2(p, w)
- return dist2(p, { x: v.x + t * (w.x - v.x),
- y: v.y + t * (w.y - v.y) })
-}
-
-</script>