117 lines
2.7 KiB
JavaScript
117 lines
2.7 KiB
JavaScript
"use strict";
|
|
/*** ESSENTIALS ***/
|
|
|
|
function sizeAndPos() {
|
|
|
|
var data = c.getImageData(0,0, $c.width(), $c.height());
|
|
var w = $(window).width(),
|
|
h = $(window).height();
|
|
$c.css({'margin-left': w * .05,
|
|
'margin-top': h * .05
|
|
})
|
|
$c.attr('width', w * .9);
|
|
$c.attr('height',h * .9 - 50);
|
|
c.clearRect(0,0, $c.width(), $c.height());
|
|
c.putImageData(data, 0, 0);
|
|
}
|
|
|
|
function relative(x,y) {
|
|
return {
|
|
x : x - $c.offset().left,
|
|
y : y - $c.offset().top
|
|
}
|
|
}
|
|
|
|
function threshold(x1, y1, x2, y2, threshold) {
|
|
var tr = threshold || 5;
|
|
if( x1 <= x2 + tr && x1 >= x2 - tr && y1 <= y2 + tr && y1 >= y2 - tr ) return true;
|
|
return false;
|
|
}
|
|
|
|
function line(x1, y1, x2, y2, opts) {
|
|
opts = opts || {};
|
|
c.beginPath();
|
|
c.lineCap = opts.lineCap || settings.lineCap;
|
|
c.lineJoin = opts.lineJoin || settings.lineJoin;
|
|
c.strokeStyle = opts.strokeStyle || settings.strokeStyle;
|
|
c.lineWidth = opts.lineWidth || settings.lineWidth;
|
|
c.moveTo(x1, y1);
|
|
c.lineTo(x2, y2);
|
|
c.stroke();
|
|
}
|
|
|
|
|
|
/*** END ***/
|
|
|
|
function startPoint(x, y) {
|
|
|
|
// If not previous point exists, make the first one.
|
|
if( !points.length ) points.push({x: x, y: y, type: settings.type, start: {x: x, y: y}});
|
|
|
|
var old = points[points.length-1],
|
|
start = old.start,
|
|
current = {
|
|
x : x,
|
|
y : y,
|
|
start : old.start || {x: x, y: y},
|
|
type : settings.type
|
|
}
|
|
// Just draws a circle
|
|
line(x,y,x,y);
|
|
|
|
if( old.type == 'line' ) {
|
|
line(old.x, old.y, x, y);
|
|
}
|
|
|
|
if( points.length > 1 && ((start && threshold(start.x, start.y, x, y)) || threshold(old.x, old.y, x, y, 2)) ) {
|
|
window.active = false;
|
|
points[points.length-1].type = '';
|
|
points[points.length-1].start = undefined;
|
|
return;
|
|
}
|
|
|
|
points.push(current);
|
|
}
|
|
|
|
function drawPoint(x,y) {
|
|
var capture = points[points.length-1];
|
|
|
|
switch(capture.type) {
|
|
case 'draw': {
|
|
line(capture.x, capture.y, x, y);
|
|
|
|
var current = {
|
|
x : x,
|
|
y : y,
|
|
start : capture.start,
|
|
type : capture.type
|
|
}
|
|
|
|
points.push(current);
|
|
break;
|
|
}
|
|
case 'sketch': {
|
|
line(capture.x, capture.y, x, y);
|
|
var current = {
|
|
x : x,
|
|
y : y,
|
|
start : capture.start,
|
|
type : capture.type
|
|
}
|
|
points.push(current);
|
|
|
|
for( var i = 0, len = points.length-1; i < len; i++ ) {
|
|
if( threshold(points[i].x, points[i].y, current.x, current.y, 40)) {
|
|
var x = points[i].x - current.x,
|
|
y = points[i].y - current.y;
|
|
|
|
line(points[i].x - x*0.2, points[i].y - y*0.2, current.x + x*0.2, current.y + y*0.2, {strokeStyle: 'rgba(0,0,0,0.4)', lineWidth: settings.lineWidth/2})
|
|
}
|
|
}
|
|
break;
|
|
}
|
|
}
|
|
}
|
|
|
|
|