diff --git a/README.md b/README.md index dab0914..be30610 100644 --- a/README.md +++ b/README.md @@ -13,6 +13,10 @@ MIT LICENSED (http://www.opensource.org/licenses/mit-license.php) Copyright (c) 2011, Joel Besada +Installation +------ + npm install jsmanipulate + Usage ------ diff --git a/filter list/index.html b/filter list/index.html deleted file mode 100644 index 68c877f..0000000 --- a/filter list/index.html +++ /dev/null @@ -1,15 +0,0 @@ - - - - - - JSManipulate - Filter List - - -
-

JSManipulate Filter List

-
-

Blur

filter: blur

Default Values

amount: 3

Brightness

filter: brightness

Default Values

amount: 0

Bump

filter: bump

Default Values

N/A

Circle Smear

filter: circlesmear

Default Values

size: 4
density: 0.5
mix: 0.5

Contrast

filter: contrast

Default Values

amount: 1

Cross Smear

filter: crosssmear

Default Values

distance: 8
density: 0.5
mix: 0.5

Diffusion

filter: diffusion

Default Values

scale: 4

Dither

filter: dither

Default Values

levels: 3
color: true

Edge Detection

filter: edge

Default Values

N/A

Emboss

filter: emboss

Default Values

height: 1
angle: 135
elevation: 30

Exposure

filter: exposure

Default Values

exposure: 1

Gain/Bias

filter: gain

Default Values

gain: 0.5
bias: 0.5

Gamma

filter: gamma

Default Values

amount: 1

Grayscale

filter: grayscale

Default Values

N/A

Hue

filter: hue

Default Values

amount: 0

Invert

filter: invert

Default Values

N/A

Kaleidoscope

filter: kaleidoscope

Default Values

angle: 0
rotation: 0
sides: 3
centerX: 0.5
centerY: 0.5

Lens Distortion

filter: lensdistortion

Default Values

refraction: 1.5
radius: 50
centerX: 0.5
centerY: 0.5

Line Smear

filter: linesmear

Default Values

distance: 8
density: 0.5
angle: 0
mix: 0.5

Maximum

filter: maximum

Default Values

N/A

Median

filter: median

Default Values

N/A

Minimum

filter: minimum

Default Values

N/A

Noise

filter: noise

Default Values

amount: 25
density: 1
monochrome: true

Oil Painting

filter: oil

Default Values

range: 3

Opacity

filter: opacity

Default Values

amount: 1

Pinch/Whirl

filter: pinch

Default Values

amount: 0.5
radius: 100
angle: 0
centerX: 0.5
centerY: 0.5

Pixelation

filter: pixelate

Default Values

size: 5

Posterize

filter: posterize

Default Values

levels: 6

RGBAdjust

filter: rgbadjust

Default Values

red: 1
green: 1
blue: 1

Saturation

filter: saturation

Default Values

amount: 1

Sawtooth Ripples

filter: sawtoothripple

Default Values

xAmplitude: 5
yAmplitude: 5
xWavelength: 16
yWavelength: 16

Sepia

filter: sepia

Default Values

amount: 10

Sharpen

filter: sharpen

Default Values

N/A

Sine Ripples

filter: sineripple

Default Values

xAmplitude: 5
yAmplitude: 5
xWavelength: 16
yWavelength: 16

Solarize

filter: solarize

Default Values

N/A

Sparkle

filter: sparkle

Default Values

rays: 50
size: 25
amount: 50
randomness: 25
centerX: 0.5
centerY: 0.5

Square Smear

filter: squaresmear

Default Values

size: 4
density: 0.5
mix: 0.5

Black & White

filter: threshold

Default Values

threshold: 127

Triangle Ripples

filter: triangleripple

Default Values

xAmplitude: 5
yAmplitude: 5
xWavelength: 16
yWavelength: 16

Twirl

filter: twirl

Default Values

radius: 100
angle: 180
centerX: 0.5
centerY: 0.5

Vignette

filter: vignette

Default Values

amount: 0.3

Water Ripples

filter: waterripple

Default Values

phase: 0
radius: 50
wavelength: 16
amplitude: 10
centerX: 0.5
centerY: 0.5
-
- - diff --git a/filter list/style/style.css b/filter list/style/style.css deleted file mode 100644 index 4c003bb..0000000 --- a/filter list/style/style.css +++ /dev/null @@ -1,35 +0,0 @@ -body { - background-color: #EEEEEE; - color: #232323; - font: 14px Helvetica, Arial, sans-serif; - line-height: 1.5em; -} - -.filter { - display:block; - color: #EEEEEE; - background-color: #232323; - -moz-border-radius: 5px; - -webkit-border-radius: 5px; - border-radius: 5px; - overflow: auto; - padding: 10px 20px 10px 20px; -} -.default-values, .recommended-values { - float: left; - display: block; - margin-right: 50px; - -} -h2 { - clear: both; -} -h3 { - color: #FFFFFF; - font-size: 14px; - margin-bottom: 5px; -} -#wrapper { - width: 580px; - margin: 0 auto; -} \ No newline at end of file diff --git a/script/separate filters/blur.js b/filters/blur.js similarity index 100% rename from script/separate filters/blur.js rename to filters/blur.js diff --git a/script/separate filters/brightness.js b/filters/brightness.js similarity index 100% rename from script/separate filters/brightness.js rename to filters/brightness.js diff --git a/script/separate filters/bump.js b/filters/bump.js similarity index 100% rename from script/separate filters/bump.js rename to filters/bump.js diff --git a/script/separate filters/circlesmear.js b/filters/circlesmear.js similarity index 100% rename from script/separate filters/circlesmear.js rename to filters/circlesmear.js diff --git a/script/separate filters/contrast.js b/filters/contrast.js similarity index 100% rename from script/separate filters/contrast.js rename to filters/contrast.js diff --git a/script/separate filters/crosssmear.js b/filters/crosssmear.js similarity index 100% rename from script/separate filters/crosssmear.js rename to filters/crosssmear.js diff --git a/script/separate filters/diffusion.js b/filters/diffusion.js similarity index 100% rename from script/separate filters/diffusion.js rename to filters/diffusion.js diff --git a/script/separate filters/dither.js b/filters/dither.js similarity index 100% rename from script/separate filters/dither.js rename to filters/dither.js diff --git a/script/separate filters/edge.js b/filters/edge.js similarity index 100% rename from script/separate filters/edge.js rename to filters/edge.js diff --git a/script/separate filters/emboss.js b/filters/emboss.js similarity index 100% rename from script/separate filters/emboss.js rename to filters/emboss.js diff --git a/script/separate filters/exposure.js b/filters/exposure.js similarity index 100% rename from script/separate filters/exposure.js rename to filters/exposure.js diff --git a/script/separate filters/filterutils.js b/filters/filterutils.js similarity index 100% rename from script/separate filters/filterutils.js rename to filters/filterutils.js diff --git a/script/separate filters/gain.js b/filters/gain.js similarity index 100% rename from script/separate filters/gain.js rename to filters/gain.js diff --git a/script/separate filters/gamma.js b/filters/gamma.js similarity index 100% rename from script/separate filters/gamma.js rename to filters/gamma.js diff --git a/script/separate filters/grayscale.js b/filters/grayscale.js similarity index 100% rename from script/separate filters/grayscale.js rename to filters/grayscale.js diff --git a/script/separate filters/hue.js b/filters/hue.js similarity index 100% rename from script/separate filters/hue.js rename to filters/hue.js diff --git a/script/separate filters/invert.js b/filters/invert.js similarity index 100% rename from script/separate filters/invert.js rename to filters/invert.js diff --git a/script/separate filters/kaleidoscope.js b/filters/kaleidoscope.js similarity index 100% rename from script/separate filters/kaleidoscope.js rename to filters/kaleidoscope.js diff --git a/script/separate filters/lensdistortion.js b/filters/lensdistortion.js similarity index 100% rename from script/separate filters/lensdistortion.js rename to filters/lensdistortion.js diff --git a/script/separate filters/linesmear.js b/filters/linesmear.js similarity index 100% rename from script/separate filters/linesmear.js rename to filters/linesmear.js diff --git a/script/separate filters/maximum.js b/filters/maximum.js similarity index 100% rename from script/separate filters/maximum.js rename to filters/maximum.js diff --git a/script/separate filters/median.js b/filters/median.js similarity index 100% rename from script/separate filters/median.js rename to filters/median.js diff --git a/script/separate filters/minimum.js b/filters/minimum.js similarity index 100% rename from script/separate filters/minimum.js rename to filters/minimum.js diff --git a/script/separate filters/noise.js b/filters/noise.js similarity index 100% rename from script/separate filters/noise.js rename to filters/noise.js diff --git a/script/separate filters/oil.js b/filters/oil.js similarity index 100% rename from script/separate filters/oil.js rename to filters/oil.js diff --git a/script/separate filters/opacity.js b/filters/opacity.js similarity index 100% rename from script/separate filters/opacity.js rename to filters/opacity.js diff --git a/script/separate filters/pinch.js b/filters/pinch.js similarity index 100% rename from script/separate filters/pinch.js rename to filters/pinch.js diff --git a/script/separate filters/pixelation.js b/filters/pixelation.js similarity index 100% rename from script/separate filters/pixelation.js rename to filters/pixelation.js diff --git a/script/separate filters/posterize.js b/filters/posterize.js similarity index 100% rename from script/separate filters/posterize.js rename to filters/posterize.js diff --git a/script/separate filters/rgbadjust.js b/filters/rgbadjust.js similarity index 100% rename from script/separate filters/rgbadjust.js rename to filters/rgbadjust.js diff --git a/script/separate filters/saturation.js b/filters/saturation.js similarity index 100% rename from script/separate filters/saturation.js rename to filters/saturation.js diff --git a/script/separate filters/sawtoothripple.js b/filters/sawtoothripple.js similarity index 100% rename from script/separate filters/sawtoothripple.js rename to filters/sawtoothripple.js diff --git a/script/separate filters/sepia.js b/filters/sepia.js similarity index 100% rename from script/separate filters/sepia.js rename to filters/sepia.js diff --git a/script/separate filters/sharpen.js b/filters/sharpen.js similarity index 100% rename from script/separate filters/sharpen.js rename to filters/sharpen.js diff --git a/script/separate filters/sineripple.js b/filters/sineripple.js similarity index 100% rename from script/separate filters/sineripple.js rename to filters/sineripple.js diff --git a/script/separate filters/solarize.js b/filters/solarize.js similarity index 100% rename from script/separate filters/solarize.js rename to filters/solarize.js diff --git a/script/separate filters/sparkle.js b/filters/sparkle.js similarity index 100% rename from script/separate filters/sparkle.js rename to filters/sparkle.js diff --git a/script/separate filters/squaresmear.js b/filters/squaresmear.js similarity index 100% rename from script/separate filters/squaresmear.js rename to filters/squaresmear.js diff --git a/script/separate filters/threshold.js b/filters/threshold.js similarity index 100% rename from script/separate filters/threshold.js rename to filters/threshold.js diff --git a/script/separate filters/triangleripple.js b/filters/triangleripple.js similarity index 100% rename from script/separate filters/triangleripple.js rename to filters/triangleripple.js diff --git a/script/separate filters/twirl.js b/filters/twirl.js similarity index 100% rename from script/separate filters/twirl.js rename to filters/twirl.js diff --git a/script/separate filters/vignette.js b/filters/vignette.js similarity index 87% rename from script/separate filters/vignette.js rename to filters/vignette.js index 7ae5020..1540136 100644 --- a/script/separate filters/vignette.js +++ b/filters/vignette.js @@ -15,7 +15,8 @@ function VignetteFilter(){ var outputData = []; if(values === undefined){ values = this.defaultValues; } var amount = (values.amount === undefined) ? this.defaultValues.amount : values.amount; - var canvas = document.createElement("canvas"); + if(typeof module !== "undefined" && typeof module.exports !== "undefined"){ var canvas = require("canvas"); } // nodejs + else{ var canvas = document.createElement("canvas"); } // browser canvas.width = width; canvas.height = height; var context = canvas.getContext("2d"); diff --git a/script/separate filters/waterripple.js b/filters/waterripple.js similarity index 100% rename from script/separate filters/waterripple.js rename to filters/waterripple.js diff --git a/script/jsmanipulate.js b/jsmanipulate.js similarity index 99% rename from script/jsmanipulate.js rename to jsmanipulate.js index f10acdb..87ebb9c 100644 --- a/script/jsmanipulate.js +++ b/jsmanipulate.js @@ -2182,7 +2182,8 @@ function VignetteFilter(){ var outputData = []; if(values === undefined){ values = this.defaultValues; } var amount = (values.amount === undefined) ? this.defaultValues.amount : values.amount; - var canvas = document.createElement("canvas"); + if(typeof module !== "undefined" && typeof module.exports !== "undefined"){ var canvas = require("canvas"); } // nodejs + else{ var canvas = document.createElement("canvas"); } // browser canvas.width = width; canvas.height = height; var context = canvas.getContext("2d"); @@ -2307,4 +2308,8 @@ var JSManipulate = { twirl : new TwirlFilter(), vignette : new VignetteFilter(), waterripple : new WaterRippleFilter() -}; \ No newline at end of file +}; + +// node.js +if (typeof module !== "undefined" && typeof module.exports !== "undefined"){ module.exports = JSManipulate; } + diff --git a/minified/jsmanipulate.min.js b/minified/jsmanipulate.min.js new file mode 100644 index 0000000..1013c6b --- /dev/null +++ b/minified/jsmanipulate.min.js @@ -0,0 +1,15 @@ +/* +========================================================================= + JSManipulate v1.0 (2011-08-01) + +Javascript image filter & effect library + +Developed by Joel Besada (http://www.joelb.me) +Demo page: http://www.joelb.me/jsmanipulate + +MIT LICENSED (http://www.opensource.org/licenses/mit-license.php) +Copyright (c) 2011, Joel Besada +========================================================================= +*/ +function FilterUtils(){this.HSVtoRGB=function(t,a,e){var i,r,n,s=Math.floor(6*t),l=6*t-s,h=e*(1-a),o=e*(1-l*a),u=e*(1-(1-l)*a);switch(s%6){case 0:i=e,r=u,n=h;break;case 1:i=o,r=e,n=h;break;case 2:i=h,r=e,n=u;break;case 3:i=h,r=o,n=e;break;case 4:i=u,r=h,n=e;break;case 5:i=e,r=h,n=o}return[255*i,255*r,255*n]},this.RGBtoHSV=function(t,a,e){t/=255,a/=255,e/=255;var i,r,n=Math.max(t,a,e),s=Math.min(t,a,e),l=n,h=n-s;if(r=0===n?0:h/n,n===s)i=0;else{switch(n){case t:i=(a-e)/h+(e>a?6:0);break;case a:i=(e-t)/h+2;break;case e:i=(t-a)/h+4}i/=6}return[i,r,l]},this.getPixel=function(t,a,e,i,r){var n=4*(e*i+a);return 0>a||a>=i||0>e||e>=r?[t[4*(this.clampPixel(e,0,r-1)*i+this.clampPixel(a,0,i-1))],t[4*(this.clampPixel(e,0,r-1)*i+this.clampPixel(a,0,i-1))+1],t[4*(this.clampPixel(e,0,r-1)*i+this.clampPixel(a,0,i-1))+2],t[4*(this.clampPixel(e,0,r-1)*i+this.clampPixel(a,0,i-1))+3]]:[t[n],t[n+1],t[n+2],t[n+3]]};var t,a=!1;this.gaussianRandom=function(){if(a)return a=!1,t;var e,i,r;do e=2*Math.random()-1,i=2*Math.random()-1,r=e*e+i*i;while(r>=1||0===r);var n=Math.sqrt(-2*Math.log(r)/r);return t=i*n,a=!0,e*n},this.clampPixel=function(t,a,e){return a>t?a:t>e?e:t},this.triangle=function(t){var a=this.mod(t,1);return 2*(.5>a?a:1-a)},this.mod=function(t,a){var e=parseInt(t/a,10);return t-=e*a,0>t?t+a:t},this.mixColors=function(t,a,e){var i=this.linearInterpolate(t,a[0],e[0]),r=this.linearInterpolate(t,a[1],e[1]),n=this.linearInterpolate(t,a[2],e[2]),s=this.linearInterpolate(t,a[3],e[3]);return[i,r,n,s]},this.linearInterpolate=function(t,a,e){return a+t*(e-a)},this.bilinearInterpolate=function(t,a,e,i,r,n){var s,l,h=e[0],o=e[1],u=e[2],d=e[3],f=i[0],v=i[1],m=i[2],c=i[3],g=r[0],p=r[1],x=r[2],V=r[3],w=n[0],F=n[1],M=n[2],b=n[3],I=1-t,y=1-a;s=I*d+t*c,l=I*V+t*b;var A=y*s+a*l;s=I*h+t*f,l=I*g+t*w;var R=y*s+a*l;s=I*o+t*v,l=I*p+t*F;var D=y*s+a*l;s=I*u+t*m,l=I*x+t*M;var S=y*s+a*l;return[R,D,S,A]},this.tableFilter=function(t,a,e,i){for(var r=0;i>r;r++)for(var n=0;e>n;n++)for(var s=4*(r*e+n),l=0;3>l;l++)t[s+l]=a[t[s+l]]},this.convolveFilter=function(t,a,e,i){var r,n,s=[];r=n=Math.sqrt(a.length);for(var l=parseInt(r/2,10),h=parseInt(n/2,10),o=0;i>o;o++)for(var u=0;e>u;u++){for(var d=4*(o*e+u),f=0,v=0,m=0,c=-l;l>=c;c++){var g,p=o+c;g=p>=0&&i>p?p*e:o*e;for(var x=n*(c+l)+h,V=-h;h>=V;V++){var w=a[x+V];if(0!==w){var F=u+V;F>=0&&e>F||(F=u);var M=4*(g+F);f+=w*t[M],v+=w*t[M+1],m+=w*t[M+2]}}}s[d]=parseInt(f+.5,10),s[d+1]=parseInt(v+.5,10),s[d+2]=parseInt(m+.5,10),s[d+3]=t[d+3]}for(var b=0;bl;l++)for(var h=0;e>h;h++){var o=4*(l*e+h);a.apply(this,[h,l,r]);var u,d,f,v,m=Math.floor(r[0]),c=Math.floor(r[1]),g=r[0]-m,p=r[1]-c;if(m>=0&&e-1>m&&c>=0&&i-1>c){var x=4*(e*c+m);u=[t[x],t[x+1],t[x+2],t[x+3]],d=[t[x+4],t[x+5],t[x+6],t[x+7]],f=[t[x+4*e],t[x+4*e+1],t[x+4*e+2],t[x+4*e+3]],v=[t[x+4*(e+1)],t[x+4*(e+1)+1],t[x+4*(e+1)+2],t[x+4*(e+1)+3]]}else u=this.getPixel(t,m,c,e,i),d=this.getPixel(t,m+1,c,e,i),f=this.getPixel(t,m,c+1,e,i),v=this.getPixel(t,m+1,c+1,e,i);var V=this.bilinearInterpolate(g,p,u,d,f,v);n[o]=V[0],n[o+1]=V[1],n[o+2]=V[2],n[o+3]=V[3]}for(var w=0;wl&&(l=0),e=l>=2.5?.98711*l-.9633:l>=.5?3.97156-4.14554*Math.sqrt(1-.26891*l):2*l*(3.97156-4.14554*Math.sqrt(.865545));var h,o,u,d,f,v,m=e*e,c=m*e,g=1.57825+2.44413*e+1.4281*m+.422205*c,p=(2.44413*e+2.85619*m+1.26661*c)/g,x=-(1.4281*m+1.26661*c)/g,V=.422205*c/g,w=1-(p+x+V),F=0;for(F=0;3>F;F++)for(var M=0;n>M;M++){for(h=M*r+F,o=M*r+(i-1<<2)+F,u=s[h],d=u,f=d,v=f;o>=h;h+=4)u=w*s[h]+p*d+x*f+V*v,s[h]=u,v=f,f=d,d=u;for(h=M*r+(i-1<<2)+F,o=M*r+F,u=s[h],d=u,f=d,v=f;h>=o;h-=4)u=w*s[h]+p*d+x*f+V*v,s[h]=u,v=f,f=d,d=u}for(F=0;3>F;F++)for(var b=0;i>b;b++){for(h=(b<<2)+F,o=(n-1)*r+(b<<2)+F,u=s[h],d=u,f=d,v=f;o>=h;h+=r)u=w*s[h]+p*d+x*f+V*v,s[h]=u,v=f,f=d,d=u;for(h=(n-1)*r+(b<<2)+F,o=(b<<2)+F,u=s[h],d=u,f=d,v=f;h>=o;h-=r)u=w*s[h]+p*d+x*f+V*v,s[h]=u,v=f,f=d,d=u}}}function BrightnessFilter(){this.name="Brightness",this.isDirAnimatable=!0,this.defaultValues={amount:0},this.valueRanges={amount:{min:-1,max:1}};var t=new FilterUtils;this.filter=function(a,e){var i=a.width,r=a.height,n=a.data;void 0===e&&(e=this.defaultValues);for(var s=void 0===e.amount?this.defaultValues.amount:e.amount,l=0;r>l;l++)for(var h=0;i>h;h++){var o=4*(l*i+h),u=t.RGBtoHSV(n[o],n[o+1],n[o+2]);u[2]+=s,u[2]<0?u[2]=0:u[2]>1&&(u[2]=1);for(var d=t.HSVtoRGB(u[0],u[1],u[2]),f=0;3>f;f++)n[o+f]=d[f]}}}function BumpFilter(){this.name="Bump",this.isDirAnimatable=!0,this.defaultValues={},this.valueRanges={};var t=new FilterUtils;this.filter=function(a){var e=a.width,i=a.height,r=a.data,n=[-1,-1,0,-1,1,1,0,1,1];t.convolveFilter(r,n,e,i)}}function CircleSmearFilter(){this.name="Circle Smear",this.isDirAnimatable=!1,this.defaultValues={size:4,density:.5,mix:.5},this.valueRanges={size:{min:1,max:10},density:{min:0,max:1},mix:{min:0,max:1}};var t=new FilterUtils;this.filter=function(a,e){for(var i=a.width,r=a.height,n=a.data,s=[],l=0;lh&&(h=1),h=parseInt(h,10);for(var o=void 0===e.density?this.defaultValues.density:e.density,u=void 0===e.mix?this.defaultValues.mix:e.mix,d=h+1,f=d*d,v=parseInt(2*o/30*i*r/2,10),m=0;v>m;m++)for(var c=(Math.random()*Math.pow(2,32)&2147483647)%i,g=(Math.random()*Math.pow(2,32)&2147483647)%r,p=[n[4*(g*i+c)],n[4*(g*i+c)+1],n[4*(g*i+c)+2],n[4*(g*i+c)+3]],x=c-d;c+d+1>x;x++)for(var V=g-d;g+d+1>V;V++){var w=(x-c)*(x-c)+(V-g)*(V-g);if(x>=0&&i>x&&V>=0&&r>V&&f>=w)for(var F=[s[4*(V*i+x)],s[4*(V*i+x)+1],s[4*(V*i+x)+2],s[4*(V*i+x)+3]],M=t.mixColors(u,F,p),b=0;3>b;b++)s[4*(V*i+x)+b]=M[b]}for(var I=0;Is&&(s=0);for(var l=[],h=0;256>h;h++)l[h]=parseInt(255*((h/255-.5)*s+.5),10);t.tableFilter(n,l,i,r)}}function CrossSmearFilter(){this.name="Cross Smear",this.isDirAnimatable=!1,this.defaultValues={distance:8,density:.5,mix:.5},this.valueRanges={distance:{min:0,max:30},density:{min:0,max:1},mix:{min:0,max:1}};var t=new FilterUtils;this.filter=function(a,e){for(var i=a.width,r=a.height,n=a.data,s=[],l=0;lh&&(h=0),h=parseInt(h,10);for(var o=void 0===e.density?this.defaultValues.density:e.density,u=void 0===e.mix?this.defaultValues.mix:e.mix,d=parseInt(2*o*i*r/(h+1),10),f=0;d>f;f++){for(var v,m,c,g=(Math.random()*Math.pow(2,32)&2147483647)%i,p=(Math.random()*Math.pow(2,32)&2147483647)%r,x=Math.random()*Math.pow(2,32)%h+1,V=[n[4*(p*i+g)],n[4*(p*i+g)+1],n[4*(p*i+g)+2],n[4*(p*i+g)+3]],w=g-x;g+x+1>w;w++)if(w>=0&&i>w)for(v=[s[4*(p*i+w)],s[4*(p*i+w)+1],s[4*(p*i+w)+2],s[4*(p*i+w)+3]],m=t.mixColors(u,v,V),c=0;3>c;c++)s[4*(p*i+w)+c]=m[c];for(var F=p-x;p+x+1>F;F++)if(F>=0&&r>F)for(v=[s[4*(F*i+g)],s[4*(F*i+g)+1],s[4*(F*i+g)+2],s[4*(F*i+g)+3]],m=t.mixColors(u,v,V),c=0;3>c;c++)s[4*(F*i+g)+c]=m[c]}for(var M=0;Mo;o++){var u=2*Math.PI*o/256;l[o]=s*Math.sin(u),h[o]=s*Math.cos(u)}transInverse=function(t,a,e){var i=parseInt(255*Math.random(),10),r=Math.random();e[0]=t+r*l[i],e[1]=a+r*h[i]},t.transformFilter(n,transInverse,i,r)}}function DitherFilter(){this.name="Dither",this.isDirAnimatable=!1,this.defaultValues={levels:3,color:!0},this.valueRanges={levels:{min:2,max:30},color:{min:!1,max:!0}};new FilterUtils;this.filter=function(t,a){var e,i,r=t.width,n=t.height,s=t.data,l=[];for(i=0;i=h&&(h=1);var u=[0,0,0,0,0,7,3,5,1],d=16,f=0,v=[];for(e=0;h>e;e++)v[e]=parseInt(255*e/(h-1),10);var m=[];for(e=0;256>e;e++)m[e]=parseInt(h*e/256,10);for(var c=0;n>c;c++){var g,p=1==(1&c);p?(f=4*(c*r+r-1),g=-1):(f=c*r*4,g=1);for(var x=0;r>x;x++){var V=s[f],w=s[f+1],F=s[f+2];o||(V=w=F=parseInt((V+w+F)/3,10));var M=v[m[V]],b=v[m[w]],I=v[m[F]];l[f]=M,l[f+1]=b,l[f+2]=I,l[f+3]=s[f+3];var y=V-M,A=w-b,R=F-I;for(e=-1;1>=e;e++){var D=e+c;if(D>=0&&n>D)for(i=-1;1>=i;i++){var S=i+x;if(S>=0&&r>S){var P;if(P=p?u[3*(e+1)-i+1]:u[3*(e+1)+i+1],0!==P){var W=p?f-4*i:f+4*i;V=s[W],w=s[W+1],F=s[W+2];var U=P/d;V+=y*U,w+=A*U,F+=R*U,s[W]=V,s[W+1]=w,s[W+2]=F}}}}f+=4*g}}for(i=0;il;l++)for(var h=0;i>h;h++){var o=4*(l*i+h),u=0;gh=0,bh=0;var d=0;gv=0,bv=0;for(var f=-1;1>=f;f++){var v,m=l+f;v=m>=0&&r>m?m*i*4:l*i*4;for(var c=3*(f+1)+1,g=-1;1>=g;g++){var p=h+g;p>=0&&i>p||(p=h),p*=4;var x=n[v+p],V=n[v+p+1],w=n[v+p+2],F=t[c+g],M=a[c+g];u+=parseInt(F*x,10),bh+=parseInt(F*V,10),gh+=parseInt(F*w,10),d+=parseInt(M*x,10),gv+=parseInt(M*V,10),bv+=parseInt(M*w,10)}}x=parseInt(Math.sqrt(u*u+d*d)/1.8,10),V=parseInt(Math.sqrt(gh*gh+gv*gv)/1.8,10),w=parseInt(Math.sqrt(bh*bh+bv*bv)/1.8,10),s[o]=x,s[o+1]=V,s[o+2]=w,s[o+3]=n[o+3]}for(var b=0;by;y++,I+=d)for(var A=I,R=A+d,D=R+d,S=0;e>S;S++,A++,R++,D++){var P=4*(y*e+S);0!==y&&i-2>y&&0!==S&&e-2>S?(v=u[A-1]+u[R-1]+u[D-1]-u[A+1]-u[R+1]-u[D+1],m=u[D-1]+u[D]+u[D+1]-u[A-1]-u[A]-u[A+1],M=0===v&&0===m?b:(F=v*g+m*p+w)<0?0:parseInt(F/Math.sqrt(v*v+m*m+V),10)):M=b,r[P]=r[P+1]=r[P+2]=M}}}function ExposureFilter(){this.name="Exposure",this.isDirAnimatable=!0,this.defaultValues={exposure:1},this.valueRanges={exposure:{min:0,max:5}};var t=new FilterUtils;this.filter=function(a,e){var i=a.width,r=a.height,n=a.data;void 0===e&&(e=this.defaultValues);for(var s=void 0===e.exposure?this.defaultValues.exposure:e.exposure,l=[],h=0;256>h;h++)l[h]=parseInt(255*(1-Math.exp(-(h/255)*s)),10);t.tableFilter(n,l,i,r)}}function GainFilter(){this.name="Gain/Bias",this.isDirAnimatable=!0,this.defaultValues={gain:.5,bias:.5},this.valueRanges={gain:{min:0,max:1},bias:{min:0,max:1}};var t=new FilterUtils;this.filter=function(a,e){var i=a.width,r=a.height,n=a.data;void 0===e&&(e=this.defaultValues);for(var s=void 0===e.gain?this.defaultValues.gain:e.gain,l=void 0===e.bias?this.defaultValues.bias:e.bias,h=[],o=0;256>o;o++){var u=o/255,d=(1/s-2)*(1-2*u);u=.5>u?u/(d+1):(d-u)/(d-1),u/=(1/l-2)*(1-u)+1,h[o]=parseInt(255*u,10)}t.tableFilter(n,h,i,r)}}function GammaFilter(){this.name="Gamma",this.isDirAnimatable=!0,this.defaultValues={amount:1},this.valueRanges={amount:{min:0,max:2}},this.filter=function(t,a){var e=t.width,i=t.height,r=t.data;void 0===a&&(a=this.defaultValues);var n=void 0===a.amount?this.defaultValues.amount:a.amount;if(0>n&&(n=0),!FilterUtils)return void(console&&console.error("Unable to find filterutils.js, please include this file! (Required by "+this.name+" filter)"));for(var s=new FilterUtils,l=[],h=0;256>h;h++)l[h]=255*Math.pow(h/255,1/n)+.5;s.tableFilter(r,l,e,i)}}function GrayscaleFilter(){this.name="Grayscale",this.isDirAnimatable=!0,this.defaultValues={},this.valueRanges={},this.filter=function(t){for(var a=t.width,e=t.height,i=t.data,r=0;e>r;r++)for(var n=0;a>n;n++){var s=4*(r*a+n),l=.3*i[s]+.59*i[s+1]+.11*i[s+2];i[s]=i[s+1]=i[s+2]=l}}}function HueFilter(){this.name="Hue",this.isDirAnimatable=!0,this.defaultValues={amount:0},this.valueRanges={amount:{min:-1,max:1}};var t=new FilterUtils;this.filter=function(a,e){var i=a.width,r=a.height,n=a.data;void 0===e&&(e=this.defaultValues);for(var s=void 0===e.amount?this.defaultValues.amount:e.amount,l=0;r>l;l++)for(var h=0;i>h;h++){var o=4*(l*i+h),u=t.RGBtoHSV(n[o],n[o+1],n[o+2]);for(u[0]+=s;u[0]<0;)u[0]+=360;for(var d=t.HSVtoRGB(u[0],u[1],u[2]),f=0;3>f;f++)n[o+f]=d[f]}}}function InvertFilter(){this.name="Invert",this.isDirAnimatable=!0,this.defaultValues={},this.valueRanges={},this.filter=function(t){for(var a=t.width,e=t.height,i=t.data,r=0;e>r;r++)for(var n=0;a>n;n++)for(var s=4*(r*a+n),l=0;3>l;l++)i[s+l]=255-i[s+l]}}function KaleidoscopeFilter(){this.name="Kaleidoscope",this.isDirAnimatable=!1,this.defaultValues={angle:0,rotation:0,sides:3,centerX:.5,centerY:.5},this.valueRanges={angle:{min:0,max:360},rotation:{min:0,max:360},sides:{min:1,max:30},centerX:{min:0,max:1},centerY:{min:0,max:1}};var t=new FilterUtils;this.filter=function(a,e){var i=a.width,r=a.height,n=a.data;void 0===e&&(e=this.defaultValues);var s=void 0===e.angle?this.defaultValues.angle:e.angle,l=void 0===e.rotation?this.defaultValues.rotation:e.rotation,h=void 0===e.sides?this.defaultValues.sides:e.sides,o=void 0===e.centerX?this.defaultValues.centerX:e.centerX,u=void 0===e.centerY?this.defaultValues.centerY:e.centerY,d=i*o,f=r*u;s=s/180*Math.PI,l=l/180*Math.PI;var v=function(a,e,i){var r=a-d,n=e-f,o=Math.sqrt(r*r+n*n),u=Math.atan2(n,r)-s-l;u=t.triangle(u/Math.PI*h*.5),u+=s,i[0]=d+o*Math.cos(u),i[1]=f+o*Math.sin(u)};t.transformFilter(n,v,i,r)}}function LensDistortionFilter(){this.name="Lens Distortion",this.isDirAnimatable=!1,this.defaultValues={refraction:1.5,radius:50,centerX:.5,centerY:.5},this.valueRanges={refraction:{min:1,max:10},radius:{min:1,max:200},centerX:{min:0,max:1},centerY:{min:0,max:1}};var t=new FilterUtils;this.filter=function(a,e){var i=a.width,r=a.height,n=a.data;void 0===e&&(e=this.defaultValues);var s=void 0===e.refraction?this.defaultValues.refraction:e.refraction,l=void 0===e.centerX?this.defaultValues.centerX:e.centerX,h=void 0===e.centerY?this.defaultValues.centerY:e.centerY,o=void 0===e.radius?this.defaultValues.radius:e.radius,u=o*o,d=i*l,f=r*h,v=function(t,a,e){var i=t-d,r=a-f,n=i*i,l=r*r;if(l>=u-u*n/u)e[0]=t,e[1]=a;else{var h=1/s,o=Math.sqrt((1-n/u-l/u)*u),v=o*o,m=Math.acos(i/Math.sqrt(n+v)),c=Math.PI/2-m,g=Math.asin(Math.sin(c)*h);g=Math.PI/2-m-g,e[0]=t-Math.tan(g)*o;var p=Math.acos(r/Math.sqrt(l+v));c=Math.PI/2-p,g=Math.asin(Math.sin(c)*h),g=Math.PI/2-p-g,e[1]=a-Math.tan(g)*o}};t.transformFilter(n,v,i,r)}}function LineSmearFilter(){this.name="Line Smear",this.isDirAnimatable=!1,this.defaultValues={distance:8,density:.5,angle:0,mix:.5},this.valueRanges={distance:{min:1,max:30},density:{min:0,max:1},angle:{min:0,max:360},mix:{min:0,max:1}};var t=new FilterUtils;this.filter=function(a,e){var i,r=a.width,n=a.height,s=a.data,l=[];for(i=0;ih&&(h=1),h=parseInt(h,10);var o=void 0===e.density?this.defaultValues.density:e.density,u=void 0===e.angle?this.defaultValues.angle:e.angle,d=void 0===e.mix?this.defaultValues.mix:e.mix;u=u/180*Math.PI;for(var f=Math.sin(u),v=Math.cos(u),m=parseInt(2*o*r*n/2,10),c=0;m>c;c++){var g,p,x,V,w,F,M,b=(Math.random()*Math.pow(2,32)&2147483647)%r,I=(Math.random()*Math.pow(2,32)&2147483647)%n,y=(Math.random()*Math.pow(2,32)&2147483647)%h+1,A=[s[4*(I*r+b)],s[4*(I*r+b)+1],s[4*(I*r+b)+2],s[4*(I*r+b)+3]],R=parseInt(y*v,10),D=parseInt(y*f,10),S=b-R,P=I-D,W=b+R,U=I+D;F=S>W?-1:1,M=P>U?-1:1,R=W-S,D=U-P,R=Math.abs(R),D=Math.abs(D),g=S,p=P;var X,Y;if(r>g&&g>=0&&n>p&&p>=0)for(X=[l[4*(p*r+g)],l[4*(p*r+g)+1],l[4*(p*r+g)+2],l[4*(p*r+g)+3]],Y=t.mixColors(d,X,A),i=0;3>i;i++)l[4*(p*r+g)+i]=Y[i];if(Math.abs(R)>Math.abs(D)){for(x=2*D-R,V=2*D,w=2*(D-R);g!=W;)if(0>=x?x+=V:(x+=w,p+=M),g+=F,r>g&&g>=0&&n>p&&p>=0)for(X=[l[4*(p*r+g)],l[4*(p*r+g)+1],l[4*(p*r+g)+2],l[4*(p*r+g)+3]],Y=t.mixColors(d,X,A),i=0;3>i;i++)l[4*(p*r+g)+i]=Y[i]}else for(x=2*R-D,V=2*R,w=2*(R-D);p!=U;)if(0>=x?x+=V:(x+=w,g+=F),p+=M,r>g&&g>=0&&n>p&&p>=0)for(X=[l[4*(p*r+g)],l[4*(p*r+g)+1],l[4*(p*r+g)+2],l[4*(p*r+g)+3]],Y=t.mixColors(d,X,A),i=0;3>i;i++)l[4*(p*r+g)+i]=Y[i]}for(i=0;in;n++)for(var s=0;a>s;s++){for(var l=4*(n*a+s),h=0,o=0,u=0,d=-1;1>=d;d++){var f=n+d;if(f>=0&&e>f)for(var v=-1;1>=v;v++){var m=s+v;if(m>=0&&a>m){var c=4*(f*a+m);h=Math.max(h,i[c]),o=Math.max(o,i[c+1]),u=Math.max(u,i[c+2])}}}r[l]=h,r[l+1]=o,r[l+2]=u,r[l+3]=i[l+3]}for(var g=0;gn;n++)for(var s=0;a>s;s++){for(var l=4*(n*a+s),h=[],o=[],u=[],d=-1;1>=d;d++){var f=n+d;if(f>=0&&e>f)for(var v=-1;1>=v;v++){var m=s+v;if(m>=0&&a>m){var c=4*(f*a+m);h.push(i[c]),o.push(i[c+1]),u.push(i[c+2])}}}var g=function(t,a){return t-a};h.sort(g),o.sort(g),u.sort(g),r[l]=h[4],r[l+1]=o[4],r[l+2]=u[4],r[l+3]=i[l+3]}for(var p=0;pn;n++)for(var s=0;a>s;s++){for(var l=4*(n*a+s),h=255,o=255,u=255,d=-1;1>=d;d++){var f=n+d;if(f>=0&&e>f)for(var v=-1;1>=v;v++){var m=s+v;if(m>=0&&a>m){var c=4*(f*a+m);h=Math.min(h,i[c]),o=Math.min(o,i[c+1]),u=Math.min(u,i[c+2])}}}r[l]=h,r[l+1]=o,r[l+2]=u,r[l+3]=i[l+3]}for(var g=0;gh;h++)for(var o=0;e>o;o++){var u=4*(h*e+o);if(Math.random()<=s){var d;if(l)d=parseInt((2*Math.random()-1)*n,10),r[u]+=d,r[u+1]+=d,r[u+2]+=d;else for(var f=0;3>f;f++)d=parseInt((2*Math.random()-1)*n,10),r[u+f]+=d}}}}function OilFilter(){this.name="Oil Painting",this.isDirAnimatable=!1,this.defaultValues={range:3},this.valueRanges={range:{min:0,max:5}},this.filter=function(t,a){var e=t.width,i=t.height,r=t.data,n=[];void 0===a&&(a=this.defaultValues);var s=void 0===a.range?this.defaultValues.range:a.range;s=parseInt(s,10);for(var l=[],h=[],o=[],u=[],d=[],f=[],v=256,m=0;i>m;m++)for(var c=0;e>c;c++){for(var g=4*(m*e+c),p=0;v>p;p++)l[p]=h[p]=o[p]=u[p]=d[p]=f[p]=0;for(var x=-s;s>=x;x++){var V,w=m+x;if(w>=0&&i>w){V=w*e;for(var F=-s;s>=F;F++){var M=c+F;if(M>=0&&e>M){var b=r[4*(V+M)],I=r[4*(V+M)+1],y=r[4*(V+M)+2],A=b*v/256,R=I*v/256,D=y*v/256;u[A]+=b,d[R]+=I,f[D]+=y,l[A]++,h[R]++,o[D]++}}}}for(var S=0,P=0,W=0,U=1;v>U;U++)l[U]>l[S]&&(S=U),h[U]>h[P]&&(P=U),o[U]>o[W]&&(W=U);S=u[S]/l[S],P=d[P]/h[P],W=f[W]/o[W],n[g]=S,n[g+1]=P,n[g+2]=W,n[g+3]=r[g+3]}for(var X=0;Xs;s++)for(var l=0;e>l;l++){var h=4*(s*e+l);r[h+3]=255*n}}}function PinchFilter(){this.name="Pinch/Whirl",this.isDirAnimatable=!1,this.defaultValues={amount:.5,radius:100,angle:0,centerX:.5,centerY:.5},this.valueRanges={amount:{min:-1,max:1},radius:{min:1,max:200},angle:{min:0,max:360},centerX:{min:0,max:1},centerY:{min:0,max:1}};var t=new FilterUtils;this.filter=function(a,e){var i=a.width,r=a.height,n=a.data;void 0===e&&(e=this.defaultValues);var s=void 0===e.amount?this.defaultValues.amount:e.amount,l=void 0===e.angle?this.defaultValues.angle:e.angle,h=void 0===e.centerX?this.defaultValues.centerX:e.centerX,o=void 0===e.centerY?this.defaultValues.centerY:e.centerY,u=void 0===e.radius?this.defaultValues.radius:e.radius,d=u*u;l=l/180*Math.PI;var f=i*h,v=r*o,m=function(t,a,e){var i=t-f,r=a-v,n=i*i+r*r;if(n>d||0===n)e[0]=t,e[1]=a;else{var h=Math.sqrt(n/d),o=Math.pow(Math.sin(.5*Math.PI*h),-s);i*=o,r*=o;var u=1-h,m=l*u*u,c=Math.sin(m),g=Math.cos(m);e[0]=f+g*i-c*r,e[1]=v+c*i+g*r}};t.transformFilter(n,m,i,r)}}function PixelationFilter(){this.name="Pixelation",this.isDirAnimatable=!1,this.defaultValues={size:5},this.valueRanges={size:{min:1,max:50}},this.filter=function(t,a){var e=t.width,i=t.height,r=t.data;void 0===a&&(a=this.defaultValues);var n=void 0===a.size?this.defaultValues.size:a.size;n=parseInt(n,10);for(var s,l,h,o=0;i>o;o+=n)for(var u=0;e>u;u+=n){var d=Math.min(n,e-u),f=Math.min(n,i-o),v=d*f,m=0,c=0,g=0;for(s=o;o+f>s;s++)for(l=u;u+d>l;l++)h=4*(s*e+l),m+=r[h],c+=r[h+1],g+=r[h+2];for(s=o;o+f>s;s++)for(l=u;u+d>l;l++)h=4*(s*e+l),r[h]=m/v,r[h+1]=c/v,r[h+2]=g/v}}}function PosterizeFilter(){this.name="Posterize",this.isDirAnimatable=!1,this.defaultValues={levels:6},this.valueRanges={levels:{min:2,max:30}};var t=new FilterUtils;this.filter=function(a,e){var i=a.width,r=a.height,n=a.data;void 0===e&&(e=this.defaultValues);var s=void 0===e.levels?this.defaultValues.levels:parseInt(e.levels,10);if(!(1>=s)){for(var l=[],h=0;256>h;h++)l[h]=parseInt(255*parseInt(h*s/256,10)/(s-1),10);t.tableFilter(n,l,i,r)}}}function RGBAdjustFilter(){this.name="RGBAdjust",this.isDirAnimatable=!0,this.defaultValues={red:1,green:1,blue:1},this.valueRanges={red:{min:0,max:2},green:{min:0,max:2},blue:{min:0,max:2}},this.filter=function(t,a){var e=t.width,i=t.height,r=t.data;void 0===a&&(a=this.defaultValues);var n=void 0===a.red?this.defaultValues.red:a.red,s=void 0===a.green?this.defaultValues.green:a.green,l=void 0===a.blue?this.defaultValues.blue:a.blue;0>n&&(n=0),0>s&&(s=0),0>l&&(l=0);for(var h=0;i>h;h++)for(var o=0;e>o;o++){var u=4*(h*e+o);r[u]*=n,r[u+1]*=s,r[u+2]*=l}}}function SaturationFilter(){this.name="Saturation",this.isDirAnimatable=!0,this.defaultValues={amount:1},this.valueRanges={amount:{min:0,max:2}},this.filter=function(t,a){var e=t.width,i=t.height,r=t.data;void 0===a&&(a=this.defaultValues);for(var n=void 0===a.amount?this.defaultValues.amount:a.amount,s=.3,l=.59,h=.11,o=(1-n)*s+n,u=(1-n)*s,d=(1-n)*s,f=(1-n)*l,v=(1-n)*l+n,m=(1-n)*l,c=(1-n)*h,g=(1-n)*h,p=(1-n)*h+n,x=0;i>x;x++)for(var V=0;e>V;V++){var w=4*(x*e+V),F=r[w],M=r[w+1],b=r[w+2];r[w]=o*F+f*M+c*b,r[w+1]=u*F+v*M+g*b,r[w+2]=d*F+m*M+p*b}}}function SawtoothRippleFilter(){this.name="Sawtooth Ripples",this.isDirAnimatable=!1,this.defaultValues={xAmplitude:5,yAmplitude:5,xWavelength:16,yWavelength:16},this.valueRanges={xAmplitude:{min:0,max:30},yAmplitude:{min:0,max:30},xWavelength:{min:1,max:50},yWavelength:{min:1,max:50}};var t=new FilterUtils;this.filter=function(a,e){var i=a.width,r=a.height,n=a.data;void 0===e&&(e=this.defaultValues);var s=void 0===e.xAmplitude?this.defaultValues.xAmplitude:e.xAmplitude,l=void 0===e.yAmplitude?this.defaultValues.yAmplitude:e.yAmplitude,h=void 0===e.xWavelength?this.defaultValues.xWavelength:e.xWavelength,o=void 0===e.yWavelength?this.defaultValues.yWavelength:e.yWavelength,u=function(a,e,i){var r=e/h,n=a/o,u=t.mod(r,1),d=t.mod(n,1);i[0]=a+s*u,i[1]=e+l*d};t.transformFilter(n,u,i,r)}}function SepiaFilter(){this.name="Sepia",this.isDirAnimatable=!0,this.defaultValues={amount:10},this.valueRanges={amount:{min:0,max:30}};new FilterUtils;this.filter=function(t,a){var e=t.width,i=t.height,r=t.data;void 0===a&&(a=this.defaultValues);var n=void 0===a.amount?this.defaultValues.amount:a.amount;n*=2.55;for(var s=0;i>s;s++)for(var l=0;e>l;l++){var h,o,u,d=4*(s*e+l),f=.3*r[d]+.59*r[d+1]+.11*r[d+2];h=o=u=f,h+=40,o+=20,u-=n,r[d]=h,r[d+1]=o,r[d+2]=u}}}function SharpenFilter(){this.name="Sharpen",this.isDirAnimatable=!0,this.defaultValues={},this.valueRanges={};var t=new FilterUtils;this.filter=function(a){var e=a.width,i=a.height,r=a.data,n=[0,-.2,0,-.2,1.8,-.2,0,-.2,0];t.convolveFilter(r,n,e,i)}}function SineRippleFilter(){this.name="Sine Ripples",this.isDirAnimatable=!1,this.defaultValues={xAmplitude:5,yAmplitude:5,xWavelength:16,yWavelength:16},this.valueRanges={xAmplitude:{min:0,max:30},yAmplitude:{min:0,max:30},xWavelength:{min:1,max:50},yWavelength:{min:1,max:50}};var t=new FilterUtils;this.filter=function(a,e){var i=a.width,r=a.height,n=a.data;void 0===e&&(e=this.defaultValues);var s=void 0===e.xAmplitude?this.defaultValues.xAmplitude:e.xAmplitude,l=void 0===e.yAmplitude?this.defaultValues.yAmplitude:e.yAmplitude,h=void 0===e.xWavelength?this.defaultValues.xWavelength:e.xWavelength,o=void 0===e.yWavelength?this.defaultValues.yWavelength:e.yWavelength,u=function(t,a,e){var i=a/h,r=t/o,n=Math.sin(i),u=Math.sin(r);e[0]=t+s*n,e[1]=a+l*u};t.transformFilter(n,u,i,r)}}function SolarizeFilter(){this.name="Solarize",this.isDirAnimatable=!0,this.defaultValues={},this.valueRanges={};var t=new FilterUtils;this.filter=function(a){for(var e=a.width,i=a.height,r=a.data,n=[],s=0;256>s;s++){var l=s/255>.5?2*(s/255-.5):2*(.5-s/255);n[s]=parseInt(255*l,10)}t.tableFilter(r,n,e,i)}}function SparkleFilter(){this.name="Sparkle",this.isDirAnimatable=!1,this.defaultValues={rays:50,size:25,amount:50,randomness:25,centerX:.5,centerY:.5},this.valueRanges={rays:{min:1,max:100},size:{min:1,max:200},amount:{min:0,max:100},randomness:{min:0,max:50},centerX:{min:0,max:1},centerY:{min:0,max:1}};var t=new FilterUtils;this.filter=function(a,e){var i=a.width,r=a.height,n=a.data;void 0===e&&(e=this.defaultValues);var s=void 0===e.rays?this.defaultValues.rays:e.rays;s=parseInt(s,10);for(var l=void 0===e.size?this.defaultValues.size:e.size,h=void 0===e.amount?this.defaultValues.amount:e.amount,o=void 0===e.randomness?this.defaultValues.randomness:e.randomness,u=void 0===e.centerX?this.defaultValues.centerX:e.centerX,d=void 0===e.centerY?this.defaultValues.centerY:e.centerY,f=u*i,v=d*r,m=[],c=0;s>c;c++)m[c]=l+o/100*l*t.gaussianRandom();for(var g=0;r>g;g++)for(var p=0;i>p;p++){var x=4*(g*i+p),V=p-f,w=g-v,F=V*V+w*w,M=Math.atan2(w,V),b=(M+Math.PI)/(2*Math.PI)*s,I=parseInt(b,10),y=b-I;if(0!==l){var A=t.linearInterpolate(y,m[I%s],m[(I+1)%s]),R=A*A/(F+1e-4);R=Math.pow(R,(100-h)/50),y-=.5,y=1-y*y,y*=R}y=t.clampPixel(y,0,1);for(var D=t.mixColors(y,[n[x],n[x+1],n[x+2],n[x+3]],[255,255,255,255]),S=0;3>S;S++)n[x+S]=D[S]}}}function SquareSmearFilter(){this.name="Square Smear",this.isDirAnimatable=!1,this.defaultValues={size:4,density:.5,mix:.5},this.valueRanges={size:{min:1,max:10},density:{min:0,max:1},mix:{min:0,max:1}};var t=new FilterUtils;this.filter=function(a,e){var i,r=a.width,n=a.height,s=a.data,l=[];for(i=0;ih&&(h=1),h=parseInt(h,10);for(var o=void 0===e.density?this.defaultValues.density:e.density,u=void 0===e.mix?this.defaultValues.mix:e.mix,d=h+1,f=parseInt(2*o/30*r*n/2,10),v=0;f>v;v++)for(var m=(Math.random()*Math.pow(2,32)&2147483647)%r,c=(Math.random()*Math.pow(2,32)&2147483647)%n,g=[s[4*(c*r+m)],s[4*(c*r+m)+1],s[4*(c*r+m)+2],s[4*(c*r+m)+3]],p=m-d;m+d+1>p;p++)for(var x=c-d;c+d+1>x;x++)if(p>=0&&r>p&&x>=0&&n>x){var V=[l[4*(x*r+p)],l[4*(x*r+p)+1],l[4*(x*r+p)+2],l[4*(x*r+p)+3]],w=t.mixColors(u,V,g);for(i=0;3>i;i++)l[4*(x*r+p)+i]=w[i]}for(i=0;is;s++)for(var l=0;e>l;l++){var h=4*(s*e+l),o=(r[h]+r[h+1]+r[h+2])/3,u=0;o>n&&(u=255),r[h]=r[h+1]=r[h+2]=u}}}function TriangleRippleFilter(){this.name="Triangle Ripples",this.isDirAnimatable=!1,this.defaultValues={xAmplitude:5,yAmplitude:5,xWavelength:16,yWavelength:16},this.valueRanges={xAmplitude:{min:0,max:30},yAmplitude:{min:0,max:30},xWavelength:{min:1,max:50},yWavelength:{min:1,max:50}};var t=new FilterUtils;this.filter=function(a,e){var i=a.width,r=a.height,n=a.data;void 0===e&&(e=this.defaultValues);var s=void 0===e.xAmplitude?this.defaultValues.xAmplitude:e.xAmplitude,l=void 0===e.yAmplitude?this.defaultValues.yAmplitude:e.yAmplitude,h=void 0===e.xWavelength?this.defaultValues.xWavelength:e.xWavelength,o=void 0===e.yWavelength?this.defaultValues.yWavelength:e.yWavelength,u=function(a,e,i){var r=e/h,n=a/o,u=t.triangle(r,1),d=t.triangle(n,1);i[0]=a+s*u,i[1]=e+l*d};t.transformFilter(n,u,i,r)}}function TwirlFilter(){this.name="Twirl",this.isDirAnimatable=!1,this.defaultValues={radius:100,angle:180,centerX:.5,centerY:.5},this.valueRanges={radius:{min:1,max:200},angle:{min:0,max:360},centerX:{min:0,max:1},centerY:{min:0,max:1}};var t=new FilterUtils;this.filter=function(a,e){var i=a.width,r=a.height,n=a.data;void 0===e&&(e=this.defaultValues);var s=void 0===e.angle?this.defaultValues.angle:e.angle,l=void 0===e.centerX?this.defaultValues.centerX:e.centerX,h=void 0===e.centerY?this.defaultValues.centerY:e.centerY,o=void 0===e.radius?this.defaultValues.radius:e.radius,u=o*o;s=s/180*Math.PI;var d=i*l,f=r*h,v=function(t,a,e){var i=t-d,r=a-f,n=i*i+r*r;if(n>u)e[0]=t,e[1]=a;else{n=Math.sqrt(n);var l=Math.atan2(r,i)+s*(o-n)/o;e[0]=d+n*Math.cos(l),e[1]=f+n*Math.sin(l)}};t.transformFilter(n,v,i,r)}}function VignetteFilter(){this.name="Vignette",this.isDirAnimatable=!1,this.defaultValues={amount:.3},this.valueRanges={amount:{min:0,max:1}},this.filter=function(t,a){var e=t.width,i=t.height,r=t.data,n=[];void 0===a&&(a=this.defaultValues);var s=void 0===a.amount?this.defaultValues.amount:a.amount;if("undefined"!=typeof module&&"undefined"!=typeof module.exports)var l=require("canvas");else var l=document.createElement("canvas");l.width=e,l.height=i;var h,o=l.getContext("2d"),u=Math.sqrt(Math.pow(e/2,2)+Math.pow(i/2,2));o.putImageData(t,0,0),o.globalCompositeOperation="source-over",h=o.createRadialGradient(e/2,i/2,0,e/2,i/2,u),h.addColorStop(0,"rgba(0,0,0,0)"),h.addColorStop(.5,"rgba(0,0,0,0)"),h.addColorStop(1,"rgba(0,0,0,"+s+")"),o.fillStyle=h,o.fillRect(0,0,e,i),n=o.getImageData(0,0,e,i).data;for(var d=0;df)e[0]=t,e[1]=a;else{var o=Math.sqrt(n),u=l*Math.sin(o/s*Math.PI*2-h);u*=(d-o)/d,0!==o&&(u*=s/o),e[0]=t+i*u,e[1]=a+r*u}};t.transformFilter(n,c,i,r)}}var JSManipulate={blur:new BlurFilter,brightness:new BrightnessFilter,bump:new BumpFilter,circlesmear:new CircleSmearFilter,contrast:new ContrastFilter,crosssmear:new CrossSmearFilter,diffusion:new DiffusionFilter,dither:new DitherFilter,edge:new EdgeFilter,emboss:new EmbossFilter,exposure:new ExposureFilter,gain:new GainFilter,gamma:new GammaFilter,grayscale:new GrayscaleFilter,hue:new HueFilter,invert:new InvertFilter,kaleidoscope:new KaleidoscopeFilter,lensdistortion:new LensDistortionFilter,linesmear:new LineSmearFilter,maximum:new MaximumFilter,median:new MedianFilter,minimum:new MinimumFilter,noise:new NoiseFilter,oil:new OilFilter,opacity:new OpacityFilter,pinch:new PinchFilter,pixelate:new PixelationFilter,posterize:new PosterizeFilter,rgbadjust:new RGBAdjustFilter,saturation:new SaturationFilter,sawtoothripple:new SawtoothRippleFilter,sepia:new SepiaFilter,sharpen:new SharpenFilter,sineripple:new SineRippleFilter,solarize:new SolarizeFilter,sparkle:new SparkleFilter,squaresmear:new SquareSmearFilter,threshold:new ThresholdFilter,triangleripple:new TriangleRippleFilter,twirl:new TwirlFilter,vignette:new VignetteFilter,waterripple:new WaterRippleFilter};"undefined"!=typeof module&&"undefined"!=typeof module.exports&&(module.exports=JSManipulate); diff --git a/package.json b/package.json new file mode 100644 index 0000000..db7a24a --- /dev/null +++ b/package.json @@ -0,0 +1,18 @@ +{ + "author": "Joel Besada", + "name": "jsmanipulate", + "version": "1.0.2", + "description": "JSManipulate is an image filter and effects library written in Javascript for client-side manipulation of images on a web page.", + "main": "jsmanipulate.js", + "license": "MIT", + "keywords": ["canvas", "image", "images", "graphics", "filter", "filters", "manipulation", "manipulate", "distortion", "distort", "effects", "blur", "sharpen", "emboss", "invert"], + "homepage": "http://joelb.me/jsmanipulate/", + "repository": { + "type": "git", + "url": "https://github.com/dholtzmann/JSManipulate.git" + }, + "dependencies": { + "canvas": "~1.2.9" + }, + "engines": { "node": "*" } +} diff --git a/script/minified/jsmanipulate.min.js b/script/minified/jsmanipulate.min.js deleted file mode 100644 index 6d2ddb5..0000000 --- a/script/minified/jsmanipulate.min.js +++ /dev/null @@ -1,98 +0,0 @@ -/* -========================================================================= - JSManipulate v1.0 (2011-08-01) - -Javascript image filter & effect library - -Developed by Joel Besada (http://www.joelb.me) -Demo page: http://www.joelb.me/jsmanipulate - -MIT LICENSED (http://www.opensource.org/licenses/mit-license.php) -Copyright (c) 2011, Joel Besada -========================================================================= -*/ -function FilterUtils(){this.HSVtoRGB=function(a,b,f){var d,g,c,e=Math.floor(a*6),h=a*6-e,a=f*(1-b),k=f*(1-h*b),b=f*(1-(1-h)*b);switch(e%6){case 0:d=f;g=b;c=a;break;case 1:d=k;g=f;c=a;break;case 2:d=a;g=f;c=b;break;case 3:d=a;g=k;c=f;break;case 4:d=b;g=a;c=f;break;case 5:d=f,g=a,c=k}return[d*255,g*255,c*255]};this.RGBtoHSV=function(a,b,f){a/=255;b/=255;f/=255;var d=Math.max(a,b,f),g=Math.min(a,b,f),c,e=d-g;if(d===g)c=0;else{switch(d){case a:c=(b-f)/e+(b=d||f<0||f>=g)return[a[(this.clampPixel(f,0,g-1)*d+this.clampPixel(b,0,d-1))*4],a[(this.clampPixel(f,0,g-1)*d+this.clampPixel(b,0,d-1))*4+1],a[(this.clampPixel(f,0,g-1)*d+this.clampPixel(b,0,d-1))*4+2],a[(this.clampPixel(f,0,g-1)*d+this.clampPixel(b,0,d-1))*4+3]];return[a[c],a[c+1],a[c+2],a[c+3]]};var h=!1,e;this.gaussianRandom=function(){if(h)return h=!1,e;else{var a,b,f;do a=2*Math.random()-1,b=2* -Math.random()-1,f=a*a+b*b;while(f>=1||f===0);f=Math.sqrt(-2*Math.log(f)/f);e=b*f;h=!0;return a*f}};this.clampPixel=function(a,b,f){return af?f:a};this.triangle=function(a){a=this.mod(a,1);return 2*(a<0.5?a:1-a)};this.mod=function(a,b){var f=parseInt(a/b,10);a-=f*b;if(a<0)return a+b;return a};this.mixColors=function(a,b,f){var d=this.linearInterpolate(a,b[0],f[0]),g=this.linearInterpolate(a,b[1],f[1]),c=this.linearInterpolate(a,b[2],f[2]),a=this.linearInterpolate(a,b[3],f[3]);return[d,g,c,a]}; -this.linearInterpolate=function(a,b,f){return b+a*(f-b)};this.bilinearInterpolate=function(a,b,f,d,g,c){var e=f[0],h=f[1],k=f[2],i=d[0],o=d[1],p=d[2],s=g[0],n=g[1],m=g[2],q=g[3],t=c[0],r=c[1],g=c[2],u=c[3],c=1-a,v=1-b,f=c*f[3]+a*d[3],f=v*f+b*(c*q+a*u),e=v*(c*e+a*i)+b*(c*s+a*t),h=v*(c*h+a*o)+b*(c*n+a*r);return[e,h,v*(c*k+a*p)+b*(c*m+a*g),f]};this.tableFilter=function(a,b,f,d){for(var g=0;g=0&&i=0&&o=2.5?0.98711*g-0.9633:g>=0.5?3.97156-4.14554*Math.sqrt(1-0.26891*g):2*g*(3.97156-4.14554*Math.sqrt(0.865545));var c=g*g,j=c*g,l=1.57825+2.44413*g+1.4281*c+0.422205*j;g=(2.44413*g+2.85619*c+1.26661*j)/l;for(var c=-(1.4281*c+1.26661*j)/l,j=0.422205*j/l,l=1-(g+c+j),k=0,i,o,p, -s,n,m,k=0;k<3;k++)for(var q=0;q=o;i-=4)p=l*d[i]+g*s+c*n+j*m,d[i]=p,m=n,n=s,s=p}for(k=0;k<3;k++)for(q=0;q=o;i-=b)p=l*d[i]+g*s+c*n+j*m,d[i]=p,m=n,n=s,s=p}}} -function BrightnessFilter(){this.name="Brightness";this.isDirAnimatable=!0;this.defaultValues={amount:0};this.valueRanges={amount:{min:-1,max:1}};var h=new FilterUtils;this.filter=function(e,a){var b=e.width,f=e.height,d=e.data;if(a===void 0)a=this.defaultValues;for(var g=a.amount===void 0?this.defaultValues.amount:a.amount,c=0;c1&&(k[2]=1);for(var k=h.HSVtoRGB(k[0],k[1],k[2]),i=0;i<3;i++)d[l+i]= -k[i]}}}function BumpFilter(){this.name="Bump";this.isDirAnimatable=!0;this.defaultValues={};this.valueRanges={};var h=new FilterUtils;this.filter=function(e){h.convolveFilter(e.data,[-1,-1,0,-1,1,1,0,1,1],e.width,e.height)}} -function CircleSmearFilter(){this.name="Circle Smear";this.isDirAnimatable=!1;this.defaultValues={size:4,density:0.5,mix:0.5};this.valueRanges={size:{min:1,max:10},density:{min:0,max:1},mix:{min:0,max:1}};var h=new FilterUtils;this.filter=function(e,a){for(var b=e.width,f=e.height,d=e.data,g=[],c=0;c=0&&n=0&&m=0&&q=0&&q=0&&o=0&&n=j-j*e/j)c[0]=a,c[1]=b;else{var t=1/g,r=Math.sqrt((1-e/j-h/j)*j),u=r*r,d=Math.acos(d/Math.sqrt(e+u)),e=Math.PI/2-d,e=Math.asin(Math.sin(e)*t),e=Math.PI/2-d-e;c[0]=a-Math.tan(e)*r;a=Math.acos(f/Math.sqrt(h+u));e=Math.PI/2-a;e=Math.asin(Math.sin(e)*t);e=Math.PI/2-a-e;c[1]=b-Math.tan(e)*r}},b,f)}} -function LineSmearFilter(){this.name="Line Smear";this.isDirAnimatable=!1;this.defaultValues={distance:8,density:0.5,angle:0,mix:0.5};this.valueRanges={distance:{min:1,max:30},density:{min:0,max:1},angle:{min:0,max:360},mix:{min:0,max:1}};var h=new FilterUtils;this.filter=function(e,a){var b=e.width,f=e.height,d=e.data,g=[],c;for(c=0;c=0&&u=0){c=[g[(u*b+r)*4],g[(u*b+r)*4+1],g[(u*b+r)*4+2],g[(u*b+r)*4+3]];z=h.mixColors(i,c,q);for(c=0;c<3;c++)g[(u*b+r)*4+c]=z[c]}if(Math.abs(t)>Math.abs(m)){v=2*m-t;y=2*m;for(t=2*(m-t);r!=s;)if(v<=0?v+=y:(v+=t,u+=x),r+=w,r=0&&u=0){c=[g[(u*b+r)*4],g[(u*b+r)*4+1],g[(u*b+r)*4+2],g[(u*b+r)*4+3]];z=h.mixColors(i,c,q);for(c=0;c<3;c++)g[(u*b+r)*4+c]=z[c]}}else{v=2*t-m;y=2*t;for(t=2*(t-m);u!=n;)if(v<=0?v+=y:(v+= -t,r+=w),u+=x,r=0&&u=0){c=[g[(u*b+r)*4],g[(u*b+r)*4+1],g[(u*b+r)*4+2],g[(u*b+r)*4+3]];z=h.mixColors(i,c,q);for(c=0;c<3;c++)g[(u*b+r)*4+c]=z[c]}}}for(c=0;c=0&&i=0&&p=0&&i=0&&p=0&&i=0&&pc[m]&&(m=u),j[u]>j[q]&&(q=u),l[u]>l[t]&&(t=u);m=k[m]/c[m];q=i[q]/j[q];t=o[t]/l[t];d[n]=m;d[n+1]=q;d[n+2]=t;d[n+3]=f[n+3]}for(a=0;ai||h===0?(d[0]=a,d[1]=b):(a=Math.sqrt(h/i),b=Math.pow(Math.sin(Math.PI*0.5*a),-g),e*=b,f*=b,a=1-a,b=c*a*a,a=Math.sin(b),b=Math.cos(b),d[0]=o+b*e-a*f,d[1]=p+a*e+b*f)},b,f)}} -function PixelationFilter(){this.name="Pixelation";this.isDirAnimatable=!1;this.defaultValues={size:5};this.valueRanges={size:{min:1,max:50}};this.filter=function(h,e){var a=h.width,b=h.height,f=h.data;if(e===void 0)e=this.defaultValues;for(var d=e.size===void 0?this.defaultValues.size:e.size,d=parseInt(d,10),g,c,j,l=0;l0.5?2*(d/255-0.5):2*(0.5-d/255)),10);h.tableFilter(e,f,a,b)}} -function SparkleFilter(){this.name="Sparkle";this.isDirAnimatable=!1;this.defaultValues={rays:50,size:25,amount:50,randomness:25,centerX:0.5,centerY:0.5};this.valueRanges={rays:{min:1,max:100},size:{min:1,max:200},amount:{min:0,max:100},randomness:{min:0,max:50},centerX:{min:0,max:1},centerY:{min:0,max:1}};var h=new FilterUtils;this.filter=function(e,a){var b=e.width,f=e.height,d=e.data;if(a===void 0)a=this.defaultValues;for(var g=a.rays===void 0?this.defaultValues.rays:a.rays,g=parseInt(g,10),c= -a.size===void 0?this.defaultValues.size:a.size,j=a.amount===void 0?this.defaultValues.amount:a.amount,l=a.randomness===void 0?this.defaultValues.randomness:a.randomness,k=(a.centerX===void 0?this.defaultValues.centerX:a.centerX)*b,i=(a.centerY===void 0?this.defaultValues.centerY:a.centerY)*f,o=[],p=0;p=0&&n=0&&md&&(l=255);f[j]=f[j+1]=f[j+2]=l}}} -function TriangleRippleFilter(){this.name="Triangle Ripples";this.isDirAnimatable=!1;this.defaultValues={xAmplitude:5,yAmplitude:5,xWavelength:16,yWavelength:16};this.valueRanges={xAmplitude:{min:0,max:30},yAmplitude:{min:0,max:30},xWavelength:{min:1,max:50},yWavelength:{min:1,max:50}};var h=new FilterUtils;this.filter=function(e,a){var b=e.width,f=e.height,d=e.data;if(a===void 0)a=this.defaultValues;var g=a.xAmplitude===void 0?this.defaultValues.xAmplitude:a.xAmplitude,c=a.yAmplitude===void 0?this.defaultValues.yAmplitude: -a.yAmplitude,j=a.xWavelength===void 0?this.defaultValues.xWavelength:a.xWavelength,l=a.yWavelength===void 0?this.defaultValues.yWavelength:a.yWavelength;h.transformFilter(d,function(a,b,d){var e=a/l,f=h.triangle(b/j,1),e=h.triangle(e,1);d[0]=a+g*f;d[1]=b+c*e},b,f)}} -function TwirlFilter(){this.name="Twirl";this.isDirAnimatable=!1;this.defaultValues={radius:100,angle:180,centerX:0.5,centerY:0.5};this.valueRanges={radius:{min:1,max:200},angle:{min:0,max:360},centerX:{min:0,max:1},centerY:{min:0,max:1}};var h=new FilterUtils;this.filter=function(e,a){var b=e.width,f=e.height,d=e.data;if(a===void 0)a=this.defaultValues;var g=a.angle===void 0?this.defaultValues.angle:a.angle,c=a.centerX===void 0?this.defaultValues.centerX:a.centerX,j=a.centerY===void 0?this.defaultValues.centerY: -a.centerY,l=a.radius===void 0?this.defaultValues.radius:a.radius,k=l*l,g=g/180*Math.PI,i=b*c,o=f*j;h.transformFilter(d,function(a,b,c){var d=a-i,e=b-o,f=d*d+e*e;f>k?(c[0]=a,c[1]=b):(f=Math.sqrt(f),a=Math.atan2(e,d)+g*(l-f)/l,c[0]=i+f*Math.cos(a),c[1]=o+f*Math.sin(a))},b,f)}} -function VignetteFilter(){this.name="Vignette";this.isDirAnimatable=!1;this.defaultValues={amount:0.3};this.valueRanges={amount:{min:0,max:1}};this.filter=function(h,e){var a=h.width,b=h.height,f=h.data,d=[];if(e===void 0)e=this.defaultValues;var d=e.amount===void 0?this.defaultValues.amount:e.amount,g=document.createElement("canvas");g.width=a;g.height=b;var g=g.getContext("2d"),c;c=Math.sqrt(Math.pow(a/2,2)+Math.pow(b/2,2));g.putImageData(h,0,0);g.globalCompositeOperation="source-over";c=g.createRadialGradient(a/ -2,b/2,0,a/2,b/2,c);c.addColorStop(0,"rgba(0,0,0,0)");c.addColorStop(0.5,"rgba(0,0,0,0)");c.addColorStop(1,"rgba(0,0,0,"+d+")");g.fillStyle=c;g.fillRect(0,0,a,b);d=g.getImageData(0,0,a,b).data;for(a=0;ak)d[0]=a,d[1]=b;else{var h=Math.sqrt(h),r=c*Math.sin(h/g*Math.PI*2-j);r*=(l-h)/l;h!==0&&(r*=g/h);d[0]=a+e*r;d[1]=b+f*r}}, -b,f)}} -var JSManipulate={blur:new BlurFilter,brightness:new BrightnessFilter,bump:new BumpFilter,circlesmear:new CircleSmearFilter,contrast:new ContrastFilter,crosssmear:new CrossSmearFilter,diffusion:new DiffusionFilter,dither:new DitherFilter,edge:new EdgeFilter,emboss:new EmbossFilter,exposure:new ExposureFilter,gain:new GainFilter,gamma:new GammaFilter,grayscale:new GrayscaleFilter,hue:new HueFilter,invert:new InvertFilter,kaleidoscope:new KaleidoscopeFilter,lensdistortion:new LensDistortionFilter,linesmear:new LineSmearFilter, -maximum:new MaximumFilter,median:new MedianFilter,minimum:new MinimumFilter,noise:new NoiseFilter,oil:new OilFilter,opacity:new OpacityFilter,pinch:new PinchFilter,pixelate:new PixelationFilter,posterize:new PosterizeFilter,rgbadjust:new RGBAdjustFilter,saturation:new SaturationFilter,sawtoothripple:new SawtoothRippleFilter,sepia:new SepiaFilter,sharpen:new SharpenFilter,sineripple:new SineRippleFilter,solarize:new SolarizeFilter,sparkle:new SparkleFilter,squaresmear:new SquareSmearFilter,threshold:new ThresholdFilter, -triangleripple:new TriangleRippleFilter,twirl:new TwirlFilter,vignette:new VignetteFilter,waterripple:new WaterRippleFilter};