17 lines
13 KiB
JavaScript
17 lines
13 KiB
JavaScript
|
/**
|
||
|
*
|
||
|
* Photobooth.js version 0.7
|
||
|
*
|
||
|
* build Thu Oct 17 2013 16:43:37 GMT-0700 (Pacific Daylight Time)
|
||
|
*
|
||
|
* CSS
|
||
|
*/
|
||
|
window.addEventListener("load",function(){var s = document.createElement("style"); s.innerHTML=".photobooth{position:relative;font:11px arial,sans-serif;overflow:hidden;user-select:none;-webkit-user-select:none;-moz-user-select:none;-o-user-select:none}.photobooth canvas{position:absolute;left:0;top:0}.photobooth .blind{position:absolute;left:0;top:0;opacity:0;width:100%;height:100%;background:#fff;z-index:1}.photobooth .blind.anim{transition:opacity 1500ms ease-out;-o-transition:opacity 1500ms ease-out;-moz-transition:opacity 1500ms ease-out;-webkit-transition:opacity 1500ms ease-out}.photobooth .warning{position:absolute;top:45%;background:#ffebeb;color:#cf0000;border:1px solid #cf0000;width:60%;left:50%;margin-left:-30%;display:none;padding:5px;z-index:10;text-align:center}.photobooth .warning span{text-decoration:underline;cursor:pointer;color:#333}.photobooth ul{width:30px;position:absolute;right:0;top:0;background:rgba( 0,0,0,.6 );height:190px;z-index:2;border-bottom-left-radius:5px}.photobooth ul li{width:30px;height:38px;background-repeat:no-repeat;background-position:center center;cursor:pointer;position:relative}.photobooth ul li:hover{background-color:#aaa}.photobooth ul li.selected{background-color:#ccc}.photobooth ul.noHSB{height:80px}.photobooth ul.noHSB li.hue,.photobooth ul.noHSB li.saturation,.photobooth ul.noHSB li.brightness{display:none}.photobooth ul li.hue{background-image:url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAgAAZABkAAD/7AARRHVja3kAAQAEAAAAZAAA/+4ADkFkb2JlAGTAAAAAAf/bAIQAAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQICAgICAgICAgICAwMDAwMDAwMDAwEBAQEBAQECAQECAgIBAgIDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMD/8AAEQgACAAYAwERAAIRAQMRAf/EAHgAAQEAAAAAAAAAAAAAAAAAAAkIAQEAAwAAAAAAAAAAAAAAAAAKBggLEAAAAwQLAAAAAAAAAAAAAAAAMQZBAjQ4A3MEdMQFdQcICTkRAAEBBAcGBwAAAAAAAAAAABExAAEhElECMjMEBQlhwgNzFDgVNRY3CBgK/9oADAMBAAIRAxEAPwBGOKPmqmNdT5FD2YgarLO67OVueIqrxF2tI/1Kn0jjjKfFcJZEt+5BAUCAaKuw+ThT3vC0wbFof+U4Dnv3WGl8Pu47A8vecwabKy8ZRVNKFdF3dY72fztbVdFu67axelcfrPkYlPTutCW7qqYCkwDf/9k=)}.photobooth ul li.saturation{background-image:url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAgAAZABkAAD/7AARRHVja3kAAQAEAAAAZAAA/+4ADkFkb2JlAGTAAAAAAf/bAIQAAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQICAgICAgICAgICAwMDAwMDAwMDAwEBAQEBAQECAQECAgIBAgIDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMD/8AAEQgACAAYAwERAAIRAQMRAf/EAGMAAAMAAAAAAAAAAAAAAAAAAAYICQEBAQEAAAAAAAAAAAAAAAAACAkKEAAABgMBAAAAAAAAAAAAAAAAwYIDMwZxAkQHEQABAgUFAAAAAAAAAAAAAAAAAQYxgQIyM3HBQgMH/9oADAMBAAIRAxEAPwAwo0rWdSFXHBYpnLZmWjVB/fLedIODu5Do81j1y2KE0CJlJA2uK5ZjtY2Kg//Z)}.photobooth ul li.brightness{background-image:url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAgAAZABkAAD/7AARRHVja3kAAQAEAAAAZAAA/+4ADkFkb2JlAGTAAAAAAf/bAIQAAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQICAgICAgICAgICAwMDAwMDAwMDAwEBAQEBAQECAQECAgIBAgIDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMD/8AAEQgACAAYAwERAAIRAQMRAf/EAFcAAQAAAAAAAAAAAAAAAAAAAAoBAQAAAAAAAAAAAAAAAAAAAAAQAAAEBQUAAAAAAAAAAAAAAACxAwgBMXECBXJzBDQ1EQEAAAAAAAAAAAAAAAAAAAAA/9oADAMBAAIRAxEAPwAcTWfR4GtIwC5mITxNUDgAYA0joY3aRKwB/9k=)}.photobooth ul li.crop{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAICAYAAADjoT9jAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAEFJREFUeNpi/A8EDAjACMT/qUgzMCJZwMhAXQA2l4VGhsPNZKKR4XBfMMG8QiPASDcf0MIX/2FxgCJARRoMAAIMAK49Iv4yTUj5AAAAAElFTkSuQmCC)}.photobooth ul li.trigger{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAASCAYAAABB7B6eAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAa9JREFUeNqc1M8rRFEUwPF5M4MhP8aPIiIS21lQk1Is5ceChZIdOytlI/+A7Ig/gGRhpYiNbKQsrBRFLPzYWJghNH7MjOd76qhr8m6vOfWpmffevefec987juu6AZ8RQhhBpJHJuT+CfsiEDo6wGjYeKMKn8b8Um/jCG2qQ0skjyOIWB9hFNyaN8bWSwGEHM5q9EVc6mUQ9YpjDHQbwoQkjuspDDKNEF9hjJDjFcoAEx653XEoJMYoVxNGBGPZRhzbL+HTYWLEtpO6V6EQ5kijTc7HFiwyssDwgyXsxhW8tkZSxAAksoj3n7P4G20hatviKE3RpqXKN4V5K4TE+IQ89WBI8ao0DFkP49krw+057xbyWxBY72LIdXsbjnlzf8/kRbtgSeO1APqonnwlu8tlBIYp9JojmkyCiX7Kf6MsngcSsvvO2aMZEPmcgEcea7ua/aNKGaC2RY0lwgTNsYwwNOlkrprGOJe2q/84vvegabdrrQ
|
||
|
/**
|
||
|
* JS
|
||
|
*/
|
||
|
Photobooth=function(e){e.length&&(e=e[0]);var t=navigator.getUserMedia||navigator.webkitGetUserMedia||navigator.mozGetUserMedia||navigator.oGetUserMedia||navigator.msieGetUserMedia||!1;this.onImage=function(){},this.getHueOffset=function(){return o},this.setHueOffset=function(e){v(e,"hue")&&(o=e)},this.getBrightnessOffset=function(){return a},this.setBrightnessOffset=function(e){v(e,"brightness")&&(a=e)},this.getSaturationOffset=function(){return u},this.setSaturationOffset=function(e){v(e,"saturation")&&(u=e)},this.pause=function(){l===!1&&(l=!0,c&&c.getVideoTracks&&c.getVideoTracks().forEach(function(track) { try { track.stop(); } catch (err){} }))},this.resume=function(){l===!0&&(l=!1,M())},this.destroy=function(){this.pause(),e.removeChild(b)},this.forceHSB=!1,this.isSupported=!!t,this.resize=function(e,t){if(e<200||t<200)throw"Error: Not enough space for Photobooth. Min height / width is 200 px";p=e,d=t,C.setMax(p,d),b.style.width=e+"px",b.style.height=t+"px",w.width=e,w.height=t,S.width=e,S.height=t,T.width=e,T.height=t};var n=function(e){e.stopPropagation(),e.cancelBubble=!0},r=function(e){this.startX=0,this.startY=0,e.addEventListener("mousedown",this,!1)};r.prototype.onStart=function(e,t){},r.prototype.onMove=function(e,t){},r.prototype.onStop=function(e,t){},r.prototype.handleEvent=function(e){this["fon"+e.type](e)},r.prototype.fonmousedown=function(e){e.preventDefault(),this.startX=e.clientX,this.startY=e.clientY,this.onStart(this.startX,this.startY),document.addEventListener("mousemove",this,!1),document.addEventListener("mouseup",this,!1)},r.prototype.fonmousemove=function(e){this.onMove(e.clientX-this.startX,e.clientY-this.startY)},r.prototype.fonmouseup=function(e){this.onStop(e.clientX-this.startX,e.clientY-this.startY),document.removeEventListener("mousemove",this),document.removeEventListener("mouseup",this)};var i=function(e,t){e.innerHTML='<div class="submenu"><div class="tip"></div><div class="slider"><div class="track"></div><div class="handle" style="left:50px"><div></div></div></div></div>';var i=50,s=50,o=e.getElementsByClassName("handle")[0],u=e.getElementsByClassName("slider")[0],a=new r(o);a.onMove=function(e){f(i+e)},a.onStop=function(e){i=s};var f=function(e){e>0&&e<100&&(s=e,o.style.left=e+"px",t((e-50)/100))},l=function(e){f(e.layerX),i=s};u.addEventListener("click",l,!1),o.addEventListener("click",n,!1)},s=function(e,t,i){this.setMax=function(e,n){t=e,i=n},this.getData=function(){return{x:s,y:o,width:u,height:a}},this.isActive=function(){return p},this.toggle=function(){p===!1?(d.style.opacity=1,p=!0):(d.style.opacity=0,p=!1)};var s=30,o=30,u=100,a=100,f=30,l=30,c=100,h=100,p=!1,d=document.createElement("div");d.className="resizehandle",d.innerHTML='<div class="handle"><div></div></div>',e.appendChild(d);var v=d.getElementsByTagName("div")[0],m=new r(v);m.onMove=function(e,n){s+e+u<t&&s+e>0&&(f=s+e,d.style.left=f+"px"),o+n+a<i&&o+n>0&&(l=o+n,d.style.top=l+"px")},m.onStop=function(){s=f,o=l};var g=d.getElementsByTagName("div")[1];g.addEventListener("mousedown",n,!1);var y=new r(g);y.onMove=function(e,n){s+e+u<t&&u+e>18&&(c=u+e,d.style.width=c+"px"),o+n+a<i&&a+n>18&&(h=a+n,d.style.height=h+"px")},y.onStop=function(){u=c,a=h}},o=0,u=0,a=0,f=!1,l=!1,c=null,h=this,p=e.offsetWidth,d=e.offsetHeight,v=function(e,t){if(e<-0.5||e>.5)throw"Invalid value: "+t+" must be between 0 and 1";return!0},m=window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||window.oRequestAnimationFrame||window.msRequestAnimationFrame||function(e){window.setTimeout(e,1e3/60)},g=function(e){return b.getElementsByClassName(e)[0]},y=function(e){return document.createElement(e)},b=y("div");b.className="photobooth",b.innerHTML='<div class="blind"></div><canvas></canvas><div class="warning notSupported">Sorry, Photobooth.js is not supported by your browser</div><div class="warning noWebcam">Please give Photobooth permission to use your Webcam. <span>Try again</span></div><ul><li title="hue"class="hue"></li><li title="saturation"class="saturation"></li><li title="brightness"class="brig
|
||
|
/**
|
||
|
* jQuery integration. (It's safe to delete this line if you're not using jQuery)
|
||
|
*/
|
||
|
window.jQuery&&($.fn.photobooth=function(){return this.each(function(e,t){var n=new Photobooth(t);$(t).data("photobooth",n),n.onImage=function(e){$(t).trigger("image",e)}})})
|