From cac047dc7f5d62f9521b796158be386e47df2d60 Mon Sep 17 00:00:00 2001 From: Vasilij Belosludcev Date: Thu, 6 Apr 2017 12:52:59 +0500 Subject: [PATCH] removed building scripts. added the event cb.cropped. small fixes. --- .gitignore | 4 +++- README.md | 18 +++++++++++++++++- bower.json | 5 ++--- dist/jquery.cropbox.min.js | 2 +- scripts/build.sh | 3 --- src/jquery.cropbox.js | 35 +++++++++++++++++++---------------- 6 files changed, 42 insertions(+), 25 deletions(-) delete mode 100755 scripts/build.sh diff --git a/.gitignore b/.gitignore index 496ee2c..2aad0e1 100644 --- a/.gitignore +++ b/.gitignore @@ -1 +1,3 @@ -.DS_Store \ No newline at end of file +.DS_Store +*.swp + diff --git a/README.md b/README.md index e2e2a58..aa4c504 100644 --- a/README.md +++ b/README.md @@ -151,6 +151,22 @@ HTML-attributes for cropped images which content to ```resultContainer```. Text/Html messages for current frame crop settings. +## Events + +### `cb.cropped` + +The event running when you cropped an image. + +The event have one an argument: `info`. `info` contain data about a cropped image. + +Example usage: + +```js +$('#cropbox').on('cb.cropped', function(event, info) { + console.log(info); +}); +``` + ## License -yii2-widget-cropbox is released under the BSD 3-Clause License. \ No newline at end of file +yii2-widget-cropbox is released under the BSD 3-Clause License. diff --git a/bower.json b/bower.json index a631d3c..d852a13 100644 --- a/bower.json +++ b/bower.json @@ -1,6 +1,6 @@ { "name": "jq-cropbox", - "version": "1.0.1", + "version": "1.0.2", "homepage": "https://github.com/bupy7/jquery-cropbox", "authors": [ "Vasilij Belosludcev " @@ -23,8 +23,7 @@ ], "ignore": [ ".*", - "*.md", - "/scripts" + "*.md" ], "dependencies": { "jquery": ">=1.8", diff --git a/dist/jquery.cropbox.min.js b/dist/jquery.cropbox.min.js index d2de6ab..14470f9 100644 --- a/dist/jquery.cropbox.min.js +++ b/dist/jquery.cropbox.min.js @@ -1 +1 @@ -"use strict";(function(ap){var y="mousedown",ai="mousemove",Y="mouseup",ak="mousewheel",L="resize",b="change",aw="load",h="click";var K=null,k=null,B=null,t=null,an=null,aa=null,az={},r={},x={},e=new Image,v=ap(document),C=ap(window),al=1,s=0,l=null,G=null,X=null,p=null,T=null,u=null,I=null,n={},A=[{width:200,height:200,minWidth:200,minHeight:200,maxWidth:350,maxHeight:350}],E=[];var ar={init:function(aB){K=ap(this);G=ap(aB.selectors.inputFile);u=ap(aB.selectors.inputInfo);X=ap(aB.selectors.btnReset);p=ap(aB.selectors.btnCrop);T=ap(aB.selectors.resultContainer);A=aB.variants||A;n=aB.imageOptions||n;E=aB.messages||E;if(typeof aB.selectors.messageBlock!="undefined"){I=ap(aB.selectors.messageBlock)}W();H();M();V();ad()}};var H=function(){B=K.find(".image-cropbox");k=K.find(".frame-cropbox");t=K.find(".workarea-cropbox");an=K.find(".membrane-cropbox");aa=K.find(".resize-cropbox")},ad=function(){k.on(y,f);k.on(ai,R);v.on(Y,av);aa.on(y,ay);v.on(ai,z);v.on(Y,N);an.on(y,j);an.on(ai,S);an.on(Y,au);an.on(ak,am);C.on(L,at);G.on(b,F);p.on(h,d);X.on(h,Q)},F=function(){var aB=new FileReader();aB.readAsDataURL(this.files[0]);ap(aB).one(aw,P)},d=function(){var aB=k.position().left-B.position().left,aG=k.position().top-B.position().top,aC=k.width(),aE=k.height(),aD=ap("").attr({width:aC,height:aE})[0],aF=null;aD.getContext("2d").drawImage(B[0],0,0,e.width,e.height,-aB,-aG,B.width(),B.height());aF=aD.toDataURL("image/png");af({sWidth:e.width,sHeight:e.height,x:aB,y:aG,dWidth:B.width(),dHeight:B.height(),ratio:al,width:aC,height:aE,image:aF});Z(ap("",ap.extend(n,{src:aF})));if(ao()){q()}},J=function(){var aB=aj(),aD=t.width()/2-aB.width/2,aC=t.height()/2-aB.height/2;k.css({width:aB.width,height:aB.height,backgroundImage:'url("'+e.src+'")'});U(aD,aC)},U=function(aE,aD){var aF=B.position().left,aC=B.position().top,aB=aF-aE,aG=aC-aD;if(aB>0){aB=0;aE=aF}else{if(B.width()+aF0){aG=0;aD=aC}else{if(B.height()+aCaI&&typeof aK=="undefined"){aK=aI}else{if(aCaE&&typeof aJ=="undefined"){aJ=aE}else{if(aMaK){aC=aK}else{if(aCaJ){aM=aJ}else{if(aM0){m()}else{D()}aB.preventDefault?aB.preventDefault():(aB.returnValue=false)},m=function(){al*=1.01;var aC=e.width*al,aB=e.height*al;g(aC,aB);U(k.position().left,k.position().top)},D=function(){var aC=al;al*=0.99;var aD=e.width*al,aB=e.height*al;if(aD>=k.width()&&aB>=k.height()){g(aD,aB);U(k.position().left,k.position().top)}else{al=aC}},g=function(aC,aB){B.css({width:aC,height:aB});k.css({backgroundSize:aC+"px "+aB+"px"})},ag=function(){var aC=aj();if(aC.width>e.width||aC.height>e.height){var aB=aC.width/e.width,aD=aC.height/e.height;if(aB>aD){al=aB}else{al=aD}}else{al=1}g(e.width*al,e.height*al)},O=function(){t.fadeIn()},aA=function(){t.fadeOut()},a=function(){s=0},aj=function(){return A[s]},ao=function(){if(A.length<=s+1){s=0;ah();return false}++s;ag();ae();J();return true},ac=function(aB){u.val(JSON.stringify(aB))},af=function(aC){var aB=JSON.parse(u.val());aB.push(aC);u.val(JSON.stringify(aB))},Q=function(){aq();ac([]);a();aA();M();V()},o=function(){ax();ac([]);a();O();ag();ae();J();i();c()},ah=function(){aA();M();V()},M=function(){p.prop("disabled",true)},i=function(){p.prop("disabled",false)},q=function(){if(!c()){V()}},c=function(){if(typeof E[s]!="undefined"&&I!==null){I.html(E[s]).show();return true}return false},V=function(){if(I!==null){I.hide()}},W=function(){l=T.clone()},aq=function(){T.html(l.html())},Z=function(aB){T.append(aB)},ax=function(){T.empty()};ap.fn.cropbox=function(aB){if(ar[aB]){return ar[aB].apply(this,Array.prototype.slice.call(arguments,1))}else{if(typeof aB==="object"||!aB){return ar.init.apply(this,arguments)}else{ap.error('Method "'+aB+'" not exists.')}}}})(jQuery); \ No newline at end of file +;(function(ap){"use strict";var y="mousedown",ai="mousemove",Y="mouseup",ak="mousewheel",L="resize",b="change",aw="load",h="click";var K=null,k=null,B=null,t=null,an=null,aa=null,az={},r={},x={},e=new Image,v=ap(document),C=ap(window),al=1,s=0,l=null,G=null,X=null,p=null,T=null,u=null,I=null,n={},A=[{width:200,height:200,minWidth:200,minHeight:200,maxWidth:350,maxHeight:350}],E=[];var ar={init:function(aB){K=ap(this);G=ap(aB.selectors.inputFile);u=ap(aB.selectors.inputInfo);X=ap(aB.selectors.btnReset);p=ap(aB.selectors.btnCrop);T=ap(aB.selectors.resultContainer);A=aB.variants||A;n=aB.imageOptions||n;E=aB.messages||E;if(typeof aB.selectors.messageBlock!="undefined"){I=ap(aB.selectors.messageBlock)}W();H();M();V();ad()}};var H=function(){B=K.find(".image-cropbox");k=K.find(".frame-cropbox");t=K.find(".workarea-cropbox");an=K.find(".membrane-cropbox");aa=K.find(".resize-cropbox")},ad=function(){k.on(y,f);k.on(ai,R);v.on(Y,av);aa.on(y,ay);v.on(ai,z);v.on(Y,N);an.on(y,j);an.on(ai,S);an.on(Y,au);an.on(ak,am);C.on(L,at);G.on(b,F);p.on(h,d);X.on(h,Q)},F=function(){var aB=new FileReader();aB.readAsDataURL(this.files[0]);ap(aB).one(aw,P)},d=function(){var aB=k.position().left-B.position().left,aH=k.position().top-B.position().top,aC=k.width(),aE=k.height(),aD=ap("").attr({width:aC,height:aE})[0],aG=null;aD.getContext("2d").drawImage(B[0],0,0,e.width,e.height,-aB,-aH,B.width(),B.height());var aG=aD.toDataURL("image/png"),aF={sWidth:e.width,sHeight:e.height,x:aB,y:aH,dWidth:B.width(),dHeight:B.height(),ratio:al,width:aC,height:aE,image:aG};af(aF);Z(ap("",ap.extend(n,{src:aG})));if(ao()){q()}K.trigger("cb.cropped",[aF])},J=function(){var aB=aj(),aD=t.width()/2-aB.width/2,aC=t.height()/2-aB.height/2;k.css({width:aB.width,height:aB.height,backgroundImage:'url("'+e.src+'")'});U(aD,aC)},U=function(aE,aD){var aF=B.position().left,aC=B.position().top,aB=aF-aE,aG=aC-aD;if(aB>0){aB=0;aE=aF}else{if(B.width()+aF0){aG=0;aD=aC}else{if(B.height()+aCaI&&typeof aK=="undefined"){aK=aI}else{if(aCaE&&typeof aJ=="undefined"){aJ=aE}else{if(aMaK){aC=aK}else{if(aCaJ){aM=aJ}else{if(aM0){m()}else{D()}aB.preventDefault?aB.preventDefault():(aB.returnValue=false)},m=function(){al*=1.01;var aC=e.width*al,aB=e.height*al;g(aC,aB);U(k.position().left,k.position().top)},D=function(){var aC=al;al*=0.99;var aD=e.width*al,aB=e.height*al;if(aD>=k.width()&&aB>=k.height()){g(aD,aB);U(k.position().left,k.position().top)}else{al=aC}},g=function(aC,aB){B.css({width:aC,height:aB});k.css({backgroundSize:aC+"px "+aB+"px"})},ag=function(){var aC=aj();if(aC.width>e.width||aC.height>e.height){var aB=aC.width/e.width,aD=aC.height/e.height;if(aB>aD){al=aB}else{al=aD}}else{al=1}g(e.width*al,e.height*al)},O=function(){t.fadeIn()},aA=function(){t.fadeOut()},a=function(){s=0},aj=function(){return A[s]},ao=function(){if(A.length<=s+1){s=0;ah();return false}++s;ag();ae();J();return true},ac=function(aB){u.val(JSON.stringify(aB))},af=function(aC){var aB=JSON.parse(u.val());aB.push(aC);u.val(JSON.stringify(aB))},Q=function(){aq();ac([]);a();aA();M();V()},o=function(){ax();ac([]);a();O();ag();ae();J();i();c()},ah=function(){aA();M();V()},M=function(){p.prop("disabled",true)},i=function(){p.prop("disabled",false)},q=function(){if(!c()){V()}},c=function(){if(typeof E[s]!="undefined"&&I!==null){I.html(E[s]).show();return true}return false},V=function(){if(I!==null){I.hide()}},W=function(){l=T.clone()},aq=function(){T.html(l.html())},Z=function(aB){T.append(aB)},ax=function(){T.empty()};ap.fn.cropbox=function(aB){if(ar[aB]){return ar[aB].apply(this,Array.prototype.slice.call(arguments,1))}else{if(typeof aB==="object"||!aB){return ar.init.apply(this,arguments)}else{ap.error('Method "'+aB+'" not exists.')}}}})(jQuery); diff --git a/scripts/build.sh b/scripts/build.sh deleted file mode 100755 index c1cfdf5..0000000 --- a/scripts/build.sh +++ /dev/null @@ -1,3 +0,0 @@ -#!/usr/bin/env bash -yuicompressor ./../src/jquery.cropbox.js -o ./../dist/jquery.cropbox.min.js -yuicompressor ./../src/jquery.cropbox.css -o ./../dist/jquery.cropbox.min.css \ No newline at end of file diff --git a/src/jquery.cropbox.js b/src/jquery.cropbox.js index dc9b854..91a6eaa 100644 --- a/src/jquery.cropbox.js +++ b/src/jquery.cropbox.js @@ -15,10 +15,11 @@ * * Belosludcev Vasilij https://github.com/bupy7 * Homepage of extension: https://github.com/bupy7/jquery-cropbox - * v1.0.1 + * v1.0.2 */ -"use strict"; -(function ($) { +;(function ($) { + "use strict"; + // const var EVENT_MOUSE_DOWN = 'mousedown', EVENT_MOUSE_MOVE = 'mousemove', @@ -143,23 +144,25 @@ $image.width(), $image.height() ); - image = canvas.toDataURL('image/png'); - addInfo({ - sWidth: sourceImage.width, - sHeight: sourceImage.height, - x: x, - y: y, - dWidth: $image.width(), - dHeight: $image.height(), - ratio: ratio, - width: frameWidth, - height: frameHeight, - image: image - }); + var image = canvas.toDataURL('image/png'), + info = { + sWidth: sourceImage.width, + sHeight: sourceImage.height, + x: x, + y: y, + dWidth: $image.width(), + dHeight: $image.height(), + ratio: ratio, + width: frameWidth, + height: frameHeight, + image: image + }; + addInfo(info); addToContainer($('', $.extend(imageOptions, {src: image}))); if (nextVariant()) { nextMessage(); } + $th.trigger('cb.cropped', [info]); }, initFrame = function() { var variant = getCurrentVariant(),