This commit is contained in:
Mahdi Dibaiee 2014-02-06 19:48:11 +03:30
parent 02ed7f9f08
commit 7ee22151c6
4 changed files with 17 additions and 23 deletions

View File

@ -145,13 +145,14 @@ function save() {
}).on('mousemove', function(e) { }).on('mousemove', function(e) {
if( $(this).attr('data-moving') ) { if( $(this).attr('data-moving') ) {
var x = parseInt(e.pageX - sliderLeft - 15); var x = parseInt(e.pageX - sliderLeft - 15);
var progress = $(this).parent().children().first(); var $c = $('.'+$(this).parents('div[role="slider"]').attr('class'));
var progress = $c.find('progress');
var max = +progress.attr('max'); var max = +progress.attr('max');
var min = +progress.attr('min'); var min = +progress.attr('min');
if( x <= max && x >= min ) { if( x <= max && x >= min ) {
$(this).css('left', x+'%'); $c.find('button').css('left', x+'%');
$(this).parent().find('progress').attr('value', x); progress.attr('value', x);
var key = $(this).parents('div[role="slider"]').attr('class'); var key = $c.attr('class');
settings[key] = x; settings[key] = x;
$('#'+ key +' span').html(x); $('#'+ key +' span').html(x);
} }

View File

@ -34,6 +34,8 @@ function line(x1, y1, x2, y2, opts, overlay) {
var c = window.c; var c = window.c;
if( overlay ) var c = window.o; if( overlay ) var c = window.o;
c.beginPath(); c.beginPath();
if( settings.type == 'eraser' ) c.globalCompositeOperation = 'destination-out';
else c.globalCompositeOperation = opts.composite || settings.composite;
c.lineCap = opts.lineCap || settings.lineCap; c.lineCap = opts.lineCap || settings.lineCap;
c.lineJoin = opts.lineJoin || settings.lineJoin; c.lineJoin = opts.lineJoin || settings.lineJoin;
c.strokeStyle = opts.color || settings.color; c.strokeStyle = opts.color || settings.color;
@ -129,6 +131,9 @@ function drawPoint(x,y) {
var capture = points[points.length-1]; var capture = points[points.length-1];
switch(capture.type) { switch(capture.type) {
case 'eraser': {
capture.type = 'pen';
}
case 'pen': { case 'pen': {
line(capture.x, capture.y, x, y); line(capture.x, capture.y, x, y);
@ -182,20 +187,6 @@ function drawPoint(x,y) {
} }
break; break;
} }
case 'eraser': {
c.globalCompositeOperation = 'destination-out';
line(capture.x, capture.y, x, y);
var current = {
x : x,
y : y,
start : capture.start,
type : capture.type
}
points.push(current);
break;
}
} }
} }

View File

@ -11,7 +11,8 @@ $(document).ready(function() {
lineCap: 'round', lineCap: 'round',
lineJoin: 'round', lineJoin: 'round',
furLength: 5, furLength: 5,
connectTelorance: 40 connectTelorance: 40,
composite: 'source-over'
}; };
window.points = []; window.points = [];
window.$c = $('canvas'); window.$c = $('canvas');

View File

@ -151,13 +151,14 @@ function save() {
}).on('touchmove', function(e) { }).on('touchmove', function(e) {
if( $(this).attr('data-moving') ) { if( $(this).attr('data-moving') ) {
var x = parseInt(e.changedTouches[0].pageX - sliderLeft - 15); var x = parseInt(e.changedTouches[0].pageX - sliderLeft - 15);
var progress = $(this).parent().children().first(); var $c = $('.'+$(this).parents('div[role="slider"]').attr('class'));
var progress = $c.find('progress');
var max = +progress.attr('max'); var max = +progress.attr('max');
var min = +progress.attr('min'); var min = +progress.attr('min');
if( x <= max && x >= min ) { if( x <= max && x >= min ) {
$(this).css('left', x+'%'); $c.find('button').css('left', x+'%');
$(this).parent().find('progress').attr('value', x); progress.attr('value', x);
var key = $(this).parents('div[role="slider"]').attr('class'); var key = $c.attr('class');
settings[key] = x; settings[key] = x;
$('#'+ key +' span').html(x); $('#'+ key +' span').html(x);
} }