webui-aria2/js/libs/dojox/mobile/app/ImageView.js

//>>built
define(["dijit","dojo","dojox","dojo/require!dojox/mobile/app/_Widget,dojo/fx/easing"],function(_1,_2,_3){
_2.provide("dojox.mobile.app.ImageView");
_2.experimental("dojox.mobile.app.ImageView");
_2.require("dojox.mobile.app._Widget");
_2.require("dojo.fx.easing");
_2.declare("dojox.mobile.app.ImageView",_3.mobile.app._Widget,{zoom:1,zoomCenterX:0,zoomCenterY:0,maxZoom:5,autoZoomLevel:3,disableAutoZoom:false,disableSwipe:false,autoZoomEvent:null,_leftImg:null,_centerImg:null,_rightImg:null,_leftSmallImg:null,_centerSmallImg:null,_rightSmallImg:null,constructor:function(){
this.panX=0;
this.panY=0;
this.handleLoad=_2.hitch(this,this.handleLoad);
this._updateAnimatedZoom=_2.hitch(this,this._updateAnimatedZoom);
this._updateAnimatedPan=_2.hitch(this,this._updateAnimatedPan);
this._onAnimPanEnd=_2.hitch(this,this._onAnimPanEnd);
},buildRendering:function(){
this.inherited(arguments);
this.canvas=_2.create("canvas",{},this.domNode);
_2.addClass(this.domNode,"mblImageView");
},postCreate:function(){
this.inherited(arguments);
this.size=_2.marginBox(this.domNode);
_2.style(this.canvas,{width:this.size.w+"px",height:this.size.h+"px"});
this.canvas.height=this.size.h;
this.canvas.width=this.size.w;
var _4=this;
this.connect(this.domNode,"onmousedown",function(_5){
if(_4.isAnimating()){
return;
}
if(_4.panX){
_4.handleDragEnd();
}
_4.downX=_5.targetTouches?_5.targetTouches[0].clientX:_5.clientX;
_4.downY=_5.targetTouches?_5.targetTouches[0].clientY:_5.clientY;
});
this.connect(this.domNode,"onmousemove",function(_6){
if(_4.isAnimating()){
return;
}
if((!_4.downX&&_4.downX!==0)||(!_4.downY&&_4.downY!==0)){
return;
}
if((!_4.disableSwipe&&_4.zoom==1)||(!_4.disableAutoZoom&&_4.zoom!=1)){
var x=_6.targetTouches?_6.targetTouches[0].clientX:_6.pageX;
var y=_6.targetTouches?_6.targetTouches[0].clientY:_6.pageY;
_4.panX=x-_4.downX;
_4.panY=y-_4.downY;
if(_4.zoom==1){
if(Math.abs(_4.panX)>10){
_4.render();
}
}else{
if(Math.abs(_4.panX)>10||Math.abs(_4.panY)>10){
_4.render();
}
}
}
});
this.connect(this.domNode,"onmouseout",function(_7){
if(!_4.isAnimating()&&_4.panX){
_4.handleDragEnd();
}
});
this.connect(this.domNode,"onmouseover",function(_8){
_4.downX=_4.downY=null;
});
this.connect(this.domNode,"onclick",function(_9){
if(_4.isAnimating()){
return;
}
if(_4.downX==null||_4.downY==null){
return;
}
var x=(_9.targetTouches?_9.targetTouches[0].clientX:_9.pageX);
var y=(_9.targetTouches?_9.targetTouches[0].clientY:_9.pageY);
if(Math.abs(_4.panX)>14||Math.abs(_4.panY)>14){
_4.downX=_4.downY=null;
_4.handleDragEnd();
return;
}
_4.downX=_4.downY=null;
if(!_4.disableAutoZoom){
if(!_4._centerImg||!_4._centerImg._loaded){
return;
}
if(_4.zoom!=1){
_4.set("animatedZoom",1);
return;
}
var _a=_2._abs(_4.domNode);
var _b=_4.size.w/_4._centerImg.width;
var _c=_4.size.h/_4._centerImg.height;
_4.zoomTo(((x-_a.x)/_b)-_4.panX,((y-_a.y)/_c)-_4.panY,_4.autoZoomLevel);
}
});
_2.connect(this.domNode,"flick",this,"handleFlick");
},isAnimating:function(){
return this._anim&&this._anim.status()=="playing";
},handleDragEnd:function(){
this.downX=this.downY=null;
if(this.zoom==1){
if(!this.panX){
return;
}
var _d=(this._leftImg&&this._leftImg._loaded)||(this._leftSmallImg&&this._leftSmallImg._loaded);
var _e=(this._rightImg&&this._rightImg._loaded)||(this._rightSmallImg&&this._rightSmallImg._loaded);
var _f=!(Math.abs(this.panX)<this._centerImg._baseWidth/2)&&((this.panX>0&&_d?1:0)||(this.panX<0&&_e?1:0));
if(!_f){
this._animPanTo(0,_2.fx.easing.expoOut,700);
}else{
this.moveTo(this.panX);
}
}else{
if(!this.panX&&!this.panY){
return;
}
this.zoomCenterX-=(this.panX/this.zoom);
this.zoomCenterY-=(this.panY/this.zoom);
this.panX=this.panY=0;
}
},handleFlick:function(_10){
if(this.zoom==1&&_10.duration<500){
if(_10.direction=="ltr"){
this.moveTo(1);
}else{
if(_10.direction=="rtl"){
this.moveTo(-1);
}
}
this.downX=this.downY=null;
}
},moveTo:function(_11){
_11=_11>0?1:-1;
var _12;
if(_11<1){
if(this._rightImg&&this._rightImg._loaded){
_12=this._rightImg;
}else{
if(this._rightSmallImg&&this._rightSmallImg._loaded){
_12=this._rightSmallImg;
}
}
}else{
if(this._leftImg&&this._leftImg._loaded){
_12=this._leftImg;
}else{
if(this._leftSmallImg&&this._leftSmallImg._loaded){
_12=this._leftSmallImg;
}
}
}
this._moveDir=_11;
var _13=this;
if(_12&&_12._loaded){
this._animPanTo(this.size.w*_11,null,500,function(){
_13.panX=0;
_13.panY=0;
if(_11<0){
_13._switchImage("left","right");
}else{
_13._switchImage("right","left");
}
_13.render();
_13.onChange(_11*-1);
});
}else{
this._animPanTo(0,_2.fx.easing.expoOut,700);
}
},_switchImage:function(_14,_15){
var _16="_"+_14+"SmallImg";
var _17="_"+_14+"Img";
var _18="_"+_15+"SmallImg";
var _19="_"+_15+"Img";
this[_17]=this._centerImg;
this[_16]=this._centerSmallImg;
this[_17]._type=_14;
if(this[_16]){
this[_16]._type=_14;
}
this._centerImg=this[_19];
this._centerSmallImg=this[_18];
this._centerImg._type="center";
if(this._centerSmallImg){
this._centerSmallImg._type="center";
}
this[_19]=this[_18]=null;
},_animPanTo:function(to,_1a,_1b,_1c){
this._animCallback=_1c;
this._anim=new _2.Animation({curve:[this.panX,to],onAnimate:this._updateAnimatedPan,duration:_1b||500,easing:_1a,onEnd:this._onAnimPanEnd});
this._anim.play();
return this._anim;
},onChange:function(_1d){
},_updateAnimatedPan:function(_1e){
this.panX=_1e;
this.render();
},_onAnimPanEnd:function(){
this.panX=this.panY=0;
if(this._animCallback){
this._animCallback();
}
},zoomTo:function(_1f,_20,_21){
this.set("zoomCenterX",_1f);
this.set("zoomCenterY",_20);
this.set("animatedZoom",_21);
},render:function(){
var cxt=this.canvas.getContext("2d");
cxt.clearRect(0,0,this.canvas.width,this.canvas.height);
this._renderImg(this._centerSmallImg,this._centerImg,this.zoom==1?(this.panX<0?1:this.panX>0?-1:0):0);
if(this.zoom==1&&this.panX!=0){
if(this.panX>0){
this._renderImg(this._leftSmallImg,this._leftImg,1);
}else{
this._renderImg(this._rightSmallImg,this._rightImg,-1);
}
}
},_renderImg:function(_22,_23,_24){
var img=(_23&&_23._loaded)?_23:_22;
if(!img||!img._loaded){
return;
}
var cxt=this.canvas.getContext("2d");
var _25=img._baseWidth;
var _26=img._baseHeight;
var _27=_25*this.zoom;
var _28=_26*this.zoom;
var _29=Math.min(this.size.w,_27);
var _2a=Math.min(this.size.h,_28);
var _2b=this.dispWidth=img.width*(_29/_27);
var _2c=this.dispHeight=img.height*(_2a/_28);
var _2d=this.zoomCenterX-(this.panX/this.zoom);
var _2e=this.zoomCenterY-(this.panY/this.zoom);
var _2f=Math.floor(Math.max(_2b/2,Math.min(img.width-_2b/2,_2d)));
var _30=Math.floor(Math.max(_2c/2,Math.min(img.height-_2c/2,_2e)));
var _31=Math.max(0,Math.round((img.width-_2b)/2+(_2f-img._centerX)));
var _32=Math.max(0,Math.round((img.height-_2c)/2+(_30-img._centerY)));
var _33=Math.round(Math.max(0,this.canvas.width-_29)/2);
var _34=Math.round(Math.max(0,this.canvas.height-_2a)/2);
var _35=_29;
var _36=_2b;
if(this.zoom==1&&_24&&this.panX){
if(this.panX<0){
if(_24>0){
_29-=Math.abs(this.panX);
_33=0;
}else{
if(_24<0){
_29=Math.max(1,Math.abs(this.panX)-5);
_33=this.size.w-_29;
}
}
}else{
if(_24>0){
_29=Math.max(1,Math.abs(this.panX)-5);
_33=0;
}else{
if(_24<0){
_29-=Math.abs(this.panX);
_33=this.size.w-_29;
}
}
}
_2b=Math.max(1,Math.floor(_2b*(_29/_35)));
if(_24>0){
_31=(_31+_36)-(_2b);
}
_31=Math.floor(_31);
}
try{
cxt.drawImage(img,Math.max(0,_31),_32,Math.min(_36,_2b),_2c,_33,_34,Math.min(_35,_29),_2a);
}
catch(e){
}
},_setZoomAttr:function(_37){
this.zoom=Math.min(this.maxZoom,Math.max(1,_37));
if(this.zoom==1&&this._centerImg&&this._centerImg._loaded){
if(!this.isAnimating()){
this.zoomCenterX=this._centerImg.width/2;
this.zoomCenterY=this._centerImg.height/2;
}
this.panX=this.panY=0;
}
this.render();
},_setZoomCenterXAttr:function(_38){
if(_38!=this.zoomCenterX){
if(this._centerImg&&this._centerImg._loaded){
_38=Math.min(this._centerImg.width,_38);
}
this.zoomCenterX=Math.max(0,Math.round(_38));
}
},_setZoomCenterYAttr:function(_39){
if(_39!=this.zoomCenterY){
if(this._centerImg&&this._centerImg._loaded){
_39=Math.min(this._centerImg.height,_39);
}
this.zoomCenterY=Math.max(0,Math.round(_39));
}
},_setZoomCenterAttr:function(_3a){
if(_3a.x!=this.zoomCenterX||_3a.y!=this.zoomCenterY){
this.set("zoomCenterX",_3a.x);
this.set("zoomCenterY",_3a.y);
this.render();
}
},_setAnimatedZoomAttr:function(_3b){
if(this._anim&&this._anim.status()=="playing"){
return;
}
this._anim=new _2.Animation({curve:[this.zoom,_3b],onAnimate:this._updateAnimatedZoom,onEnd:this._onAnimEnd});
this._anim.play();
},_updateAnimatedZoom:function(_3c){
this._setZoomAttr(_3c);
},_setCenterUrlAttr:function(_3d){
this._setImage("center",_3d);
},_setLeftUrlAttr:function(_3e){
this._setImage("left",_3e);
},_setRightUrlAttr:function(_3f){
this._setImage("right",_3f);
},_setImage:function(_40,_41){
var _42=null;
var _43=null;
if(_2.isString(_41)){
_43=_41;
}else{
_43=_41.large;
_42=_41.small;
}
if(this["_"+_40+"Img"]&&this["_"+_40+"Img"]._src==_43){
return;
}
var _44=this["_"+_40+"Img"]=new Image();
_44._type=_40;
_44._loaded=false;
_44._src=_43;
_44._conn=_2.connect(_44,"onload",this.handleLoad);
if(_42){
var _45=this["_"+_40+"SmallImg"]=new Image();
_45._type=_40;
_45._loaded=false;
_45._conn=_2.connect(_45,"onload",this.handleLoad);
_45._isSmall=true;
_45._src=_42;
_45.src=_42;
}
_44.src=_43;
},handleLoad:function(evt){
var img=evt.target;
img._loaded=true;
_2.disconnect(img._conn);
var _46=img._type;
switch(_46){
case "center":
this.zoomCenterX=img.width/2;
this.zoomCenterY=img.height/2;
break;
}
var _47=img.height;
var _48=img.width;
if(_48/this.size.w<_47/this.size.h){
img._baseHeight=this.canvas.height;
img._baseWidth=_48/(_47/this.size.h);
}else{
img._baseWidth=this.canvas.width;
img._baseHeight=_47/(_48/this.size.w);
}
img._centerX=_48/2;
img._centerY=_47/2;
this.render();
this.onLoad(img._type,img._src,img._isSmall);
},onLoad:function(_49,url,_4a){
}});
});