Alloy UI

aui-image-viewer  1.0.1

 
Filters
AUI.add("aui-image-viewer-base",function(AQ){var AJ=AQ.Lang,Ah=AJ.isBoolean,q=AJ.isNumber,e=AJ.isObject,Am=AJ.isString,AS=AQ.Plugin.NodeFX,Au="anim",E="arrow",m="arrowLeftEl",I="arrowRightEl",Ap="bd",t="blank",AZ="body",Q="boundingBox",Ae="caption",Z="captionEl",Ac="captionFromTitle",D="centered",F="close",AR="closeEl",i="createDocumentFragment",Ad="currentIndex",An="easeBothStrong",Ak="footer",O="helper",AG="hidden",V="hide",Aa="href",AF="icon",f="image",Y="imageAnim",Aj="image-viewer",AV="info",p="infoEl",AK="infoTemplate",B="left",AO="link",x="links",Ai="loader",As="loading",l="loadingEl",X="lock",P="maxHeight",Ao="maxWidth",v="modal",j="offsetHeight",Al="offsetWidth",y="opacity",M="overlay",AU="preloadAllImages",AI="preloadNeighborImages",AB="px",J="region",K="right",W="scroll",AN="show",d="showArrows",Af="showClose",S=" ",AY="src",Ab="title",N="top",o="totalLinks",w="viewportRegion",AD="visible",AP="ownerDocument",Ar=function(A){return(A instanceof AQ.NodeList);},Aq=function(){return Array.prototype.slice.call(arguments).join(S);},R=27,r=39,AW=37,b=AQ.ClassNameManager.getClassName,z=b(O,W,X),s=b(AF,As),a=b(Aj,E),AM=b(Aj,E,B),Ag=b(Aj,E,K),g=b(Aj,Ap),AC=b(Aj,Ae),c=b(Aj,F),AH=b(Aj,f),C=b(Aj,AV),At=b(Aj,AO),AX=b(Aj,As),T=b(M,AG),G=document.createTextNode(""),u="Image {current} of {total}",AL='<a href="#" class="'+Aq(a,AM)+'"></a>',AT='<a href="#" class="'+Aq(a,Ag)+'"></a>',U='<div class="'+AC+'"></div>',H='<a href="#" class="'+c+'"></a>',h='<img class="'+AH+'" />',AA='<div class="'+C+'"></div>',n='<div class="'+T+'"></div>',k='<div class="'+s+'"></div>';var AE=AQ.Component.create({NAME:Aj,ATTRS:{anim:{value:true,validator:Ah},bodyContent:{value:G},caption:{value:t,validator:Am},captionFromTitle:{value:true,validator:Ah},centered:{value:true},currentIndex:{value:0,validator:q},image:{readOnly:true,valueFn:function(){return AQ.Node.create(h);}},imageAnim:{value:{},setter:function(A){return AQ.merge({to:{opacity:1},easing:An,duration:0.8},A);},validator:e},infoTemplate:{getter:function(A){return this._getInfoTemplate(A);},value:u,validator:Am},links:{setter:function(L){var A=this;if(Ar(L)){return L;}else{if(Am(L)){return AQ.all(L);}}return new AQ.NodeList([L]);}},loading:{value:false,validator:Ah},modal:{value:{opacity:0.8,background:"#000"}},preloadAllImages:{value:false,validator:Ah},preloadNeighborImages:{value:true,validator:Ah},showClose:{value:true,validator:Ah},showArrows:{value:true,validator:Ah},totalLinks:{readOnly:true,getter:function(A){return this.get(x).size();}},visible:{value:false},zIndex:{value:3000,validator:q},arrowLeftEl:{readOnly:true,valueFn:function(){return AQ.Node.create(AL);}},arrowRightEl:{readOnly:true,valueFn:function(){return AQ.Node.create(AT);}},captionEl:{readOnly:true,valueFn:function(){return AQ.Node.create(U);}},closeEl:{readOnly:true,valueFn:function(){return AQ.Node.create(H);}},infoEl:{readOnly:true,valueFn:function(){return AQ.Node.create(AA);}},loader:{readOnly:true,valueFn:function(){return AQ.Node.create(n).appendTo(document.body);}},loadingEl:{valueFn:function(){return AQ.Node.create(k);}},maxHeight:{value:Infinity,validator:q},maxWidth:{value:Infinity,validator:q}},EXTENDS:AQ.OverlayBase,prototype:{activeImage:0,_keyHandler:null,renderUI:function(){var A=this;A._renderControls();A._renderFooter();A.get(x).addClass(At);},bindUI:function(){var A=this;var L=A.get(x);var Aw=A.get(m);var Av=A.get(I);var Ax=A.get(AR);Aw.on("click",AQ.bind(A._onClickLeftArrow,A));Av.on("click",AQ.bind(A._onClickRightArrow,A));Ax.on("click",AQ.bind(A._onClickCloseEl,A));L.on("click",AQ.bind(A._onClickLinks,A));A._keyHandler=AQ.bind(A._onKeyInteraction,A);AQ.getDoc().on("keydown",A._keyHandler);A.after("render",A._afterRender);A.after("loadingChange",A._afterLoadingChange);A.after("visibleChange",A._afterVisibleChange);},destructor:function(){var A=this;var L=A.get(x);A.close();L.detach("click");L.removeClass(At);AQ.getDoc().detach("keydown",A._keyHandler);A.get(m).remove(true);A.get(I).remove(true);A.get(AR).remove(true);A.get(Ai).remove(true);},close:function(){var A=this;A.hide();A.hideMask();},getLink:function(L){var A=this;return A.get(x).item(L);},getCurrentLink:function(){var A=this;return A.getLink(A.get(Ad));},loadImage:function(Ax){var L=this;var Av=L.bodyNode;var A=L.get(Ai);L.set(As,true);if(L.activeImage){L.activeImage.detach("load");}L.activeImage=L.get(f).clone();var Aw=L.activeImage;A.empty();A.append(Aw);Aw.on("load",AQ.bind(L._onLoadImage,L));Aw.attr(AY,Ax);L.fire("request",{image:Aw});},hasLink:function(L){var A=this;return A.getLink(L);},hasNext:function(){var A=this;return A.hasLink(A.get(Ad)+1);},hasPrev:function(){var A=this;return A.hasLink(A.get(Ad)-1);},hideControls:function(){var A=this;A.get(m).hide();A.get(I).hide();A.get(AR).hide();},hideMask:function(){AQ.ImageViewerMask.hide();},next:function(){var A=this;if(A.hasNext()){A.set(Ad,A.get(Ad)+1);A.show();}},preloadAllImages:function(){var A=this;A.get(x).each(function(Av,L){A.preloadImage(L);});},preloadImage:function(L){var A=this;var Av=A.getLink(L);if(Av){var Aw=Av.attr(Aa);A.get(f).clone().attr(AY,Aw);}},prev:function(){var A=this;if(A.hasPrev()){A.set(Ad,A.get(Ad)-1);A.show();}},showLoading:function(){var A=this;var L=A.bodyNode;A.setStdModContent(AZ,A.get(l));},showMask:function(){var A=this;var L=A.get(v);if(e(L)){AQ.each(L,function(Aw,Av){AQ.ImageViewerMask.set(Av,Aw);});}if(L){AQ.ImageViewerMask.show();}},show:function(){var A=this;var L=A.getCurrentLink();if(L){A.showMask();AE.superclass.show.apply(this,arguments);A.loadImage(L.attr(Aa));}},_renderControls:function(){var L=this;var A=AQ.one(AZ);A.append(L.get(m).hide());A.append(L.get(I).hide());A.append(L.get(AR).hide());},_renderFooter:function(){var A=this;var L=A.get(Q);var Av=L.get(AP).invoke(i);Av.append(A.get(Z));Av.append(A.get(p));A.setStdModContent(Ak,Av);},_syncCaptionUI:function(){var A=this;var Av=A.get(Ae);var Ax=A.get(Z);var L=A.get(Ac);if(L){var Aw=A.getCurrentLink();if(Aw){var Ay=Aw.attr(Ab);if(Ay){Av=Aw.attr(Ab);}}}Ax.html(Av);
},_syncControlsUI:function(){var A=this;var Av=A.get(Q);var Aw=A.get(m);var L=A.get(I);var Az=A.get(AR);if(A.get(AD)){if(A.get(d)){var Ay=Av.get(w);var Ax=Math.floor(Ay.height/2)+Ay.top;Aw[A.hasPrev()?AN:V]();L[A.hasNext()?AN:V]();Aw.setStyle(N,Ax-Aw.get(j)+AB);L.setStyle(N,Ax-L.get(j)+AB);}if(A.get(Af)){Az.show();}}else{A.hideControls();}},_syncImageViewerUI:function(){var A=this;A._syncControlsUI();A._syncCaptionUI();A._syncInfoUI();},_syncInfoUI:function(){var A=this;var L=A.get(p);L.html(A.get(AK));},_getRatio:function(Ax,L){var A=this;var Aw=1;var Az=A.get(P);var Ay=A.get(Ao);if((L>Az)||(Ax>Ay)){var A0=(L/Az);var Av=(Ax/Ay);Aw=Math.max(A0,Av);}return Aw;},_getInfoTemplate:function(L){var A=this;var Av=A.get(o);var Aw=A.get(Ad)+1;return AQ.substitute(L,{current:Aw,total:Av});},_afterRender:function(){var A=this;var L=A.bodyNode;L.addClass(g);if(A.get(AU)){A.preloadAllImages();}},_afterLoadingChange:function(Av){var A=this;var L=A.get(Q);if(Av.newVal){L.addClass(AX);A.showLoading();}else{L.removeClass(AX);}},_afterVisibleChange:function(L){var A=this;A._syncControlsUI();},_onClickCloseEl:function(L){var A=this;A.close();L.halt();},_onClickLeftArrow:function(L){var A=this;A.prev();L.halt();},_onClickRightArrow:function(L){var A=this;A.next();L.halt();},_onClickLinks:function(L){var A=this;var Av=L.currentTarget;A.set(Ad,A.get(x).indexOf(Av));A.show();L.preventDefault();},_onKeyInteraction:function(L){var A=this;var Av=L.keyCode;if(!A.get(AD)){return false;}if(Av==AW){A.prev();}else{if(Av==r){A.next();}else{if(Av==R){A.close();}}}},_onLoadImage:function(Av){var A=this;var Aw=Av.currentTarget;var Ax=A.get(Y);if(A.get(Au)){Aw.setStyle(y,0);Aw.unplug(AS).plug(AS);Aw.fx.on("end",function(Ay){A.fire("anim",{anim:Ay,image:Aw});});Aw.fx.setAttrs(Ax);Aw.fx.stop().run();}A.setStdModContent(AZ,Aw);A._uiSetImageSize(Aw);A._syncImageViewerUI();A._setAlignCenter(true);A.set(As,false);A.fire("load",{image:Aw});if(A.get(AI)){var L=A.get(Ad);A.preloadImage(L+1);A.preloadImage(L-1);}},_uiSetImageSize:function(Az){var L=this;var Ax=L.bodyNode;var Ay=Az.get(J);var Aw=L._getRatio(Ay.width,Ay.height);var A=(Ay.height/Aw);var Av=(Ay.width/Aw);Az.set(j,A);Az.set(Al,Av);Ax.setStyles({height:A+AB,width:Av+AB});}}});AQ.ImageViewer=AE;AQ.ImageViewerMask=new AQ.OverlayMask().render();},"@VERSION@",{skinnable:true,requires:["anim","aui-overlay-mask","substitute"]});