Fixed shared options bug

This commit is contained in:
Luis Leiva 2014-05-07 19:43:34 +02:00
parent eb9eb53539
commit 8595baabc3
2 changed files with 15 additions and 11 deletions

View File

@ -15,8 +15,8 @@
* This just documents the method that is added to jQuery by this plugin.
*/
;(function($){
// config options + namespace ID
var options, _ns = "sketchable";
// Custom namespace ID.
var _ns = "sketchable";
/**
* Note: This is NOT a constructor actually, but a series of methods to be
* called from the plugin.
@ -36,7 +36,7 @@
*/
init: function(opts) {
// Options will be available for all plugin methods.
options = $.extend({}, $.fn.sketchable.defaults, opts || {});
var options = $.extend({}, $.fn.sketchable.defaults, opts || {});
return this.each(function() {
var elem = $(this), data = elem.data(_ns);
if (!data) {
@ -56,7 +56,9 @@
// Date of first coord, used as time origin.
timestamp: new Date().getTime(),
// Save a pointer to the drawing canvas (jSketch instance).
sketch: sketch
sketch: sketch,
// Save also a pointer to the given options.
options: options
});
// Attach event listeners.
if (options.interactive) {
@ -124,7 +126,7 @@
*/
clear: function() {
return this.each(function() {
var elem = $(this), data = elem.data(_ns);
var elem = $(this), data = elem.data(_ns), options = data.options;
data.sketch.clear();
data.strokes = [];
if (typeof options.events.clear === 'function') {
@ -144,7 +146,7 @@
*/
reset: function(opts) {
return this.each(function(){
var elem = $(this), data = elem.data(_ns);
var elem = $(this), data = elem.data(_ns), options = data.options;
elem.sketchable('destroy').sketchable(opts);
if (typeof options.events.reset === 'function') {
options.events.reset(elem, data);
@ -160,7 +162,7 @@
*/
destroy: function() {
return this.each(function(){
var elem = $(this), data = elem.data(_ns);
var elem = $(this), data = elem.data(_ns), options = data.options;
if (options.interactive) {
elem.unbind("mousedown", mousedownHandler);
elem.unbind("mouseup", mouseupHandler);
@ -276,8 +278,10 @@
};
function mousemoveHandler(e) {
var elem = $(e.target), data = elem.data(_ns);
var elem = $(e.target), data = elem.data(_ns), options = data.options;
if (!options.mouseupMovements && !data.sketch.isDrawing) return;
// This would grab all penup strokes before drawing anythong on the canvas.
//if ( (!options.mouseupMovements || data.strokes.length === 0) && !data.sketch.isDrawing ) return;
var p = getMousePos(e);
if (data.sketch.isDrawing) data.sketch.lineTo(p.x, p.y);
@ -288,7 +292,7 @@
};
function mousedownHandler(e) {
var elem = $(e.target), data = elem.data(_ns);
var elem = $(e.target), data = elem.data(_ns), options = data.options;
data.sketch.isDrawing = true;
var p = getMousePos(e);
data.sketch.beginPath();
@ -303,7 +307,7 @@
};
function mouseupHandler(e) {
var elem = $(e.target), data = elem.data(_ns);
var elem = $(e.target), data = elem.data(_ns), options = data.options;
data.sketch.isDrawing = false;
data.sketch.closePath();
data.strokes.push(data.coords);

View File

@ -2,4 +2,4 @@
* jQuery sketchable | v1.6 | Luis A. Leiva | MIT license
* This is a jQuery plugin for the jSketch drawing class.
*/
(function(g){var j,e="sketchable";var b={init:function(k){j=g.extend({},g.fn.sketchable.defaults,k||{});return this.each(function(){var l=g(this),m=l.data(e);if(!m){var n=new jSketch(this,{fillStyle:j.graphics.fillStyle,strokeStyle:j.graphics.strokeStyle,lineWidth:j.graphics.lineWidth,});n.isDrawing=false;l.data(e,{strokes:[],coords:[],timestamp:new Date().getTime(),sketch:n});if(j.interactive){l.bind("mousedown",h);l.bind("mouseup",i);l.bind("mousemove",f);l.bind("touchstart",d);l.bind("touchend",d);l.bind("touchmove",d);this.onselectstart=function(){return false}}}if(typeof j.events.init==="function"){j.events.init(l,l.data(e))}})},strokes:function(k){if(k){return this.each(function(){var m=g(this),n=m.data(e);n.strokes=k})}else{var l=g(this).data(e);return l.strokes}},handler:function(k){return this.each(function(){var l=g(this),m=l.data(e);k(l,m)})},clear:function(){return this.each(function(){var k=g(this),l=k.data(e);l.sketch.clear();l.strokes=[];if(typeof j.events.clear==="function"){j.events.clear(k,l)}})},reset:function(k){return this.each(function(){var l=g(this),m=l.data(e);l.sketchable("destroy").sketchable(k);if(typeof j.events.reset==="function"){j.events.reset(l,m)}})},destroy:function(){return this.each(function(){var k=g(this),l=k.data(e);if(j.interactive){k.unbind("mousedown",h);k.unbind("mouseup",i);k.unbind("mousemove",f);k.unbind("touchstart",d);k.unbind("touchend",d);k.unbind("touchmove",d)}k.removeData(e);if(typeof j.events.destroy==="function"){j.events.destroy(k,l)}})}};g.fn.sketchable=function(k){if("methods functions hooks".split(" ").indexOf(k)>-1){return b}else{if(b[k]){return b[k].apply(this,Array.prototype.slice.call(arguments,1))}else{if(typeof k==="object"||!k){return b.init.apply(this,arguments)}else{g.error("Method "+k+' does not exist. See jQuery.sketchable("methods").')}}}return this};g.fn.sketchable.defaults={interactive:true,mouseupMovements:false,events:{},graphics:{firstPointSize:0,lineWidth:3,strokeStyle:"#F0F",fillStyle:"#F0F"}};function c(l){var k=g(l.target),m=k.offset();return{x:Math.round(l.pageX-m.left),y:Math.round(l.pageY-m.top)}}function a(k,m){var l=(new Date).getTime();k.coords.push([m.x,m.y,l,+k.sketch.isDrawing])}function f(n){var k=g(n.target),l=k.data(e);if(!j.mouseupMovements&&!l.sketch.isDrawing){return}var m=c(n);if(l.sketch.isDrawing){l.sketch.lineTo(m.x,m.y)}a(l,m);if(typeof j.events.mousemove==="function"){j.events.mousemove(k,l,n)}}function h(n){var k=g(n.target),l=k.data(e);l.sketch.isDrawing=true;var m=c(n);l.sketch.beginPath();if(j.graphics.firstPointSize>0){l.sketch.fillCircle(m.x,m.y,j.graphics.firstPointSize)}a(l,m);if(typeof j.events.mousedown==="function"){j.events.mousedown(k,l,n)}}function i(m){var k=g(m.target),l=k.data(e);l.sketch.isDrawing=false;l.sketch.closePath();l.strokes.push(l.coords);l.coords=[];if(typeof j.events.mouseup==="function"){j.events.mouseup(k,l,m)}}function d(l){l.preventDefault();var k=g(l.target);var n=l.originalEvent.changedTouches[0];for(var m in l){n[m]=l[m]}switch(l.type){case"touchstart":k.unbind(l.type,h);h(n);break;case"touchmove":k.unbind(l.type,f);f(n);break;case"touchend":k.unbind(l.type,i);i(n);break;default:return}}})(jQuery);
(function(g){var e="sketchable";var b={init:function(k){var j=g.extend({},g.fn.sketchable.defaults,k||{});return this.each(function(){var l=g(this),m=l.data(e);if(!m){var n=new jSketch(this,{fillStyle:j.graphics.fillStyle,strokeStyle:j.graphics.strokeStyle,lineWidth:j.graphics.lineWidth,});n.isDrawing=false;l.data(e,{strokes:[],coords:[],timestamp:new Date().getTime(),sketch:n,options:j});if(j.interactive){l.bind("mousedown",h);l.bind("mouseup",i);l.bind("mousemove",f);l.bind("touchstart",d);l.bind("touchend",d);l.bind("touchmove",d);this.onselectstart=function(){return false}}}if(typeof j.events.init==="function"){j.events.init(l,l.data(e))}})},strokes:function(j){if(j){return this.each(function(){var l=g(this),m=l.data(e);m.strokes=j})}else{var k=g(this).data(e);return k.strokes}},handler:function(j){return this.each(function(){var k=g(this),l=k.data(e);j(k,l)})},clear:function(){return this.each(function(){var k=g(this),l=k.data(e),j=l.options;l.sketch.clear();l.strokes=[];if(typeof j.events.clear==="function"){j.events.clear(k,l)}})},reset:function(j){return this.each(function(){var l=g(this),m=l.data(e),k=m.options;l.sketchable("destroy").sketchable(j);if(typeof k.events.reset==="function"){k.events.reset(l,m)}})},destroy:function(){return this.each(function(){var k=g(this),l=k.data(e),j=l.options;if(j.interactive){k.unbind("mousedown",h);k.unbind("mouseup",i);k.unbind("mousemove",f);k.unbind("touchstart",d);k.unbind("touchend",d);k.unbind("touchmove",d)}k.removeData(e);if(typeof j.events.destroy==="function"){j.events.destroy(k,l)}})}};g.fn.sketchable=function(j){if("methods functions hooks".split(" ").indexOf(j)>-1){return b}else{if(b[j]){return b[j].apply(this,Array.prototype.slice.call(arguments,1))}else{if(typeof j==="object"||!j){return b.init.apply(this,arguments)}else{g.error("Method "+j+' does not exist. See jQuery.sketchable("methods").')}}}return this};g.fn.sketchable.defaults={interactive:true,mouseupMovements:false,events:{},graphics:{firstPointSize:0,lineWidth:3,strokeStyle:"#F0F",fillStyle:"#F0F"}};function c(k){var j=g(k.target),l=j.offset();return{x:Math.round(k.pageX-l.left),y:Math.round(k.pageY-l.top)}}function a(j,l){var k=(new Date).getTime();j.coords.push([l.x,l.y,k,+j.sketch.isDrawing])}function f(n){var k=g(n.target),l=k.data(e),j=l.options;if(!j.mouseupMovements&&!l.sketch.isDrawing){return}var m=c(n);if(l.sketch.isDrawing){l.sketch.lineTo(m.x,m.y)}a(l,m);if(typeof j.events.mousemove==="function"){j.events.mousemove(k,l,n)}}function h(n){var k=g(n.target),l=k.data(e),j=l.options;l.sketch.isDrawing=true;var m=c(n);l.sketch.beginPath();if(j.graphics.firstPointSize>0){l.sketch.fillCircle(m.x,m.y,j.graphics.firstPointSize)}a(l,m);if(typeof j.events.mousedown==="function"){j.events.mousedown(k,l,n)}}function i(m){var k=g(m.target),l=k.data(e),j=l.options;l.sketch.isDrawing=false;l.sketch.closePath();l.strokes.push(l.coords);l.coords=[];if(typeof j.events.mouseup==="function"){j.events.mouseup(k,l,m)}}function d(k){k.preventDefault();var j=g(k.target);var m=k.originalEvent.changedTouches[0];for(var l in k){m[l]=k[l]}switch(k.type){case"touchstart":j.unbind(k.type,h);h(m);break;case"touchmove":j.unbind(k.type,f);f(m);break;case"touchend":j.unbind(k.type,i);i(m);break;default:return}}})(jQuery);