// Professional XML Photogallery - by Marco Salvatori Design // www.marcosalvatori.com // www.flashfiles.biz/wp package { import flash.net.*; import flash.xml.*; import flash.events.*; import flash.text.*; import flash.display.*; import flash.net.URLRequest; import gs.*; import gs.easing.*; import gs.plugins.*; import fl.motion.easing.*; import flash.events.MouseEvent; import flash.utils.getTimer; import flash.utils.Timer; import com.pixelfumes.reflect.*; import flash.ui.Mouse; import flash.geom.Point; public class gallery extends MovieClip { // setting variables private var ldr:Loader; private var ldrThumb:Loader; private var fotos:XML; private var categ:XML; private var nmrimg:Number; private var nmrcat:Number; private var currentCat:String; private var times:Number=0; private var img_pics; private var textfromxml:String; //for big img private var mymovie:*; private var myclip:*; //for Thumb private var mymovieT:*; private var myclipT:*; private var iT:Number=0; private var img_picsThumb; private var menunumber_click:*; private var preT:preloadT = new preloadT(); private var infoT:infoloadT = new infoloadT(); //thumb tween private var myTween:TweenMax; private var myTween1:TweenMax; private var myTween2:TweenMax; private var myTween3:TweenMax; //autoplay mode private var timers:*; private var slideShowMode:Boolean=false; //autosize images private var constWH:Number=1.6666666666666666666666666666667; //big img size : default 765 x 459 private var imgSizeW:Number=765; private var imgSizeH:Number=459; //check if zoomed private var zoomS:Boolean=false; //store for good align value private var recentx; private var recenty; //custom cursor private var cursor:*; //Array Categories private var catArr:Array=new Array(); private var catBtnArr:Array=new Array(); //cat button private var Catview:Boolean=false; //debug mode private var sizeX:uint; private var sizeY:uint; //get cat private var getcat:String; //resizable private var resizable:Boolean=true; //---CUSTOMIZABLE--------------------------------- //THUMBNAIL MODE ON OFF - Tell the script to take thumbs from XML or autogenerate them (suggested for pics at default size) //TRUE= Thumbs from file //False= Autogenerate thumbs private var thumbMode:Boolean=true; //---- slideshow Interval in second private var ssTime:Number=5; //zoom value - be careful!!! private var zoomValue:Number=2; public function gallery() { //plugin activation TweenPlugin.activate([ TransformAroundCenterPlugin, ScalePlugin]); //set up stage stage.align=StageAlign.TOP_LEFT; stage.scaleMode=StageScaleMode.NO_SCALE; if (resizable==true) { //hide container cont_img.alpha=0; //add listener to resize event stage.addEventListener(Event.RESIZE, resizesss); //dispatch first forced resize stage.dispatchEvent(new Event(Event.RESIZE)); }else{ //set categories container position var NumInt:uint=(stage.stageWidth) - (catCont.width); TweenMax.to(catCont,1,{x:NumInt,alpha:1,delay:1,ease:Strong.easeOut}); } init(); } // resize function private function resizesss(e:Event):void { //debug for stage size check sizeX=stage.stageWidth; sizeY=stage.stageHeight //trace(sizeX+" "+sizeY); //lock resize for small screen if (sizeY>600){ //resize with a tween image container TweenMax.to(cont_img,0, {alpha:1,scaleX:(sizeY-250)/459,scaleY:(sizeY-250)/459}); TweenMax.to(cont_img,0, {x:(sizeX / 2) - (cont_img.width /2 ),y:(sizeY / 2) - (cont_img.height /2)-50}); } //cat name set position catname_mc.y= stage.stageHeight-20; catname_mc.x= (stage.stageWidth/2 ) - (catname_mc.width/2 ); //set thumbs mc position thumb_mc.y= (stage.stageHeight ) - 120; thumb_mc.x= (stage.stageWidth/2 ) - (766/2 ); //set didabox position didabox.y= -100; didabox.x= (stage.stageWidth/2 ) - (didabox.width/2 ); //set info_mc position info_mc.y = (sizeY / 2)-50; info_mc.x= sizeX/2; //set categories container position var NumInt:uint=(stage.stageWidth) - (catCont.width); catCont.x= NumInt; } //resize function called when img is zoomed private function resizesssBig(e:Event):void { //scaling container TweenMax.to(cont_img,0.3, {x:(stage.stageWidth / 2) - (cont_img.width/2 ),y:(stage.stageHeight / 2) - (cont_img.height/2),scaleX:(stage.stageHeight-250)/459*(2),scaleY:(stage.stageHeight-250)/459*(2)}); //set categories container position var NumInt:uint=(stage.stageWidth) - (catCont.width); catCont.x= NumInt; //set didabox position didabox.y= -100; didabox.x = (stage.stageWidth / 2 ) - (didabox.width / 2 ); //cat name set position catname_mc.y= stage.stageHeight-20; catname_mc.x= (stage.stageWidth/2 ) - (catname_mc.width/2 ); } //ZOOM AND CURSOR ----------------------------------------------------------------------------------------- // function called by images draw private function go():void { //listen to zoom cont_img.img_mc.addEventListener(MouseEvent.CLICK,zoom); cont_img.img_mc.addEventListener(MouseEvent.MOUSE_MOVE,zoomM); cont_img.img_mc.addEventListener(MouseEvent.MOUSE_OVER,zoomOver); cont_img.img_mc.addEventListener(MouseEvent.MOUSE_OUT,zoomOut); cursor=new zoomin_mc(); } //over image private function zoomOver(e:MouseEvent):void { Mouse.hide(); cursor.visible = true; cursor.mouseEnabled = false; cursor.x=stage.mouseX; cursor.y=stage.mouseY; addChild(cursor); } //move image private function zoomM(e:MouseEvent):void { cursor.x=stage.mouseX; cursor.y=stage.mouseY; } //hide cursor on rollout private function zoomOut(e:MouseEvent):void { cursor.visible = false; Mouse.show(); //removeChild(cursor); } //CURSOR--------------------END --------------------------------------------------------------------- //ZOOM MANAGER private function zoom(e:MouseEvent):void { //switch zoom flag zoomS=!zoomS; //trace(zoomS); if (zoomS==true){ //set zoom cursor cursor.gotoAndStop(2); // hide buttons cont_img.btn_sx.visible=false; cont_img.btn_dx.visible=false; // grab last container x and y recentx=cont_img.x recenty=cont_img.y //hide thumbs TweenMax.to(thumb_mc,0.5,{x:thumb_mc.x+1000,alpha:0,ease:Strong.easeOut}); //scale img and go to zoommove fct //TweenMax.to(cont_img,0.5, {onStart:function (){cont_img.img_mc.removeEventListener(MouseEvent.CLICK,zoom);},x:(stage.stageWidth / 2) - (cont_img.width ),y:(stage.stageHeight / 2) - (cont_img.height ),scaleX:(stage.stageHeight-250)/459*(zoomValue),scaleY:(stage.stageHeight-250)/459*(zoomValue),onComplete:zoomMove}); TweenMax.to(cont_img,0.5, {onStart:function (){cont_img.img_mc.removeEventListener(MouseEvent.CLICK,zoom);},transformAroundCenter:{scale:(stage.stageHeight-250)/459*(zoomValue)},onComplete:zoomMove}); if (resizable==true) { //listen to big resize stage.removeEventListener(Event.RESIZE, resizesss); stage.addEventListener(Event.RESIZE, resizesssBig); } }else{ //zoom is false //set zoom cursor cursor.gotoAndStop(1); //remove listener and show buttons stage.removeEventListener(MouseEvent.MOUSE_MOVE,setview); cont_img.btn_sx.visible=true; cont_img.btn_dx.visible=true; TweenMax.to(cont_img,0.5, {x:54,y:82,scaleX:1,scaleY:1,onComplete:dispa}); TweenMax.to(thumb_mc,0.5,{x: (stage.stageWidth/2 ) - (766/2 ),alpha:1,ease:Strong.easeOut}); if (resizable==true) { //re-add listeners stage.addEventListener(Event.RESIZE, resizesss); stage.removeEventListener(Event.RESIZE, resizesssBig); //trace(recentx +" "+ recenty) TweenMax.to(cont_img,0.5, {x:recentx,y:recenty,scaleX:(stage.stageHeight-250)/459,scaleY:(stage.stageHeight-250)/459,onComplete:dispa}); } /////////////////////////////////////////////////////////////////////////////// } } //dispatch resize event private function dispa():void { if (resizable==true) { stage.dispatchEvent(new Event(Event.RESIZE)); } } //re-add zoom listeners after zoom private function zoomMove():void { cont_img.img_mc.addEventListener(MouseEvent.CLICK,zoom); stage.addEventListener(MouseEvent.MOUSE_MOVE,setview); } private function setview(e:MouseEvent):void { motion(); } //big img motion private function motion():void { if (cont_img.y<=0 ){ //trace(cont_img.y) TweenMax.to(cont_img,0.5, {y:Math.round(-1*((cont_img.height-stage.stageHeight)*stage.mouseY/stage.stageHeight))}); } if (cont_img.x<0 ){ TweenMax.to(cont_img,1, {x:Math.round(-1*((cont_img.width-stage.stageWidth)*stage.mouseX/stage.stageWidth))}); } } //init script private function init():void { // useful to track this movieclip in a big project var m:MovieClip=root.parent.parent as MovieClip; //hide preloader info_mc.visible=false; //hide Autoplay off autoplay.autoplayOff.visible=false; //show background TweenMax.to(cont_img.bkgblack,1,{x:0,y:0,scaleX:0.8,scaleY:0.8,alpha:0.9,ease:Strong.easeOut,onComplete:loadXMLcat}); TweenMax.to(thumb_mc.bkgThumb,1,{scaleX:1,scaleY:1,alpha:0,ease:Linear.easeOut}); TweenMax.to(autoplay,1,{y:0,x:0,alpha:1,delay:1,ease:Strong.easeOut}); } //categories button manager private function srollCat(event:MouseEvent){ Catview=!Catview; //trace("click Cat"); var i:Number; for (i=0; i < catBtnArr.length; i++) { if (Catview==true){ //rotate arrow and display dinamic buttons TweenMax.to(catCont.catarrow, 0.5, { transformAroundCenter:{rotation:270},ease:Strong.easeOut}); TweenMax.to(catBtnArr[i],1,{y:23+(20*i),ease:Strong.easeOut}); }else { //rotate arrow and hide dinamic buttons TweenMax.to(catCont.catarrow, 0.5, { transformAroundCenter:{rotation:90},ease:Strong.easeOut}); TweenMax.to(catBtnArr[i],1,{y:-(20*catBtnArr.length),ease:Strong.easeOut}); } } } //*---------------------- LOAD CATEGORIES FROM XML ------------------------------*// private function loadXMLcat() { var xmlLoader:URLLoader = new URLLoader(); xmlLoader.addEventListener(Event.COMPLETE, showXMLcat); xmlLoader.load(new URLRequest("categories.xml")); } private function showXMLcat(e:Event):void { XML.ignoreWhitespace=true; categ=new XML(e.target.data); //trace(categ.cat.length()); //total categories number nmrcat=categ.cat.link.length()-1; //check for LINK and add buttons var i:Number; for (i=0; i < categ.cat.length(); i++) { //push name in cat array catArr.push(categ.cat[i].title.text()); //create button from library var buttonsCat:catbutton_mc=new catbutton_mc(); buttonsCat.name=categ.cat[i].title.text(); buttonsCat.y=-(20*categ.cat.length()); buttonsCat.x=10; buttonsCat.catTxt.text=buttonsCat.name; catBtnArr.push(buttonsCat); //add listener for buttons catBtnArr[i].addEventListener(MouseEvent.CLICK,changeCat); //add child catCont.addChildAt(buttonsCat,0); //trace(" Categories name: "+ categ.cat[i].title.text()); //trace(catArr); //trace(catBtnArr); } //starting with category 0 getcat = categ.cat[0].title.text(); currentCat = categ.cat[0].title.text() + ".xml"; //disable first category button catBtnArr[0].alpha = 0.6; catBtnArr[0].btnint.enabled = false; //display cat name showCatName(); //load assets loadXML(); } //check cat buttons private function changeCat(event:MouseEvent) { //set active buttons for (var j:uint=0; j10) { info_mc.visible=true; }else{ info_mc.visible=false; } info_mc.loading_txt.text=n.toString(); } //put loader content in a movie clip for simple use private function completed(event:Event):void { // hide preloader info_mc.visible=false; mymovie=ldr.content; myclip=mymovie; myclip.alpha=0; // size control and dinamic resizing img //standard and bigger if (myclip.height>=imgSizeH && myclip.width<= (constWH*myclip.height)) { var sizeH:Number= imgSizeH; var sizeW:Number= imgSizeH*myclip.width/myclip.height;//1.6666666666666666666666666666667; myclip.height=sizeH; myclip.width=sizeW; myclip.x=(imgSizeW/2)-(myclip.width/2); //small }else if (myclip.height=imgSizeW){ var prop1:Number=myclip.width/myclip.height; myclip.width=imgSizeW; myclip.height=imgSizeW/prop1; myclip.y=(imgSizeH/2)-(myclip.height/2); } //portrait else if (myclip.height>=imgSizeH && myclip.width>(constWH*myclip.height)) { var prop:Number=myclip.width/myclip.height; myclip.width=imgSizeW; myclip.height=imgSizeW/prop; myclip.y=(imgSizeH/2)-(myclip.height/2); } // --------------------------------------------------- cont_img.img_mc.foto.addChild(myclip); //set position go(); // get caption from XML textfromxml=fotos.item.title[times]; // show caption and pic with alpha didabox.txtdida.text=""; TweenMax.to(didabox,0.3, {y:-100,delay:0, ease:Strong.easeOut,onComplete:showtxt}); TweenMax.to(myclip,0.5, {alpha:1, ease:Linear.easeOut}) //if slideshow autoplay is on go to Timer if (slideShowMode==true) { initTimer(); } } private function ifError(event:IOErrorEvent):void { trace("ioErrorHandler: "+event); } //show caption private function showtxt():void { didabox.txtdida.text=textfromxml; } // -------------------------------- END LOAD IMAGES ---------------------------// // --------------------------- BUTTONS --------------------------------------------------/// private function asx(e:MouseEvent) { //if slideshow autoplay is on stop autoplay if (slideShowMode==true) { autoplayOffFct_forced(); } // go to fadeout function fadeout(); // check current and total images to avoid interruption if (times!=0) { times=times-1; } else { times=nmrimg; } } private function adx(e:MouseEvent) { //if slideshow autoplay is on stop autoplay if (slideShowMode==true) { autoplayOffFct_forced(); } // go to fadeout function fadeout(); // check current and total images to avoid interruption if (times==nmrimg) { times=0; } else { times=times+1; } } // fadeout caption and pic private function fadeout() { TweenMax.to(didabox,0.2, {y:didabox.y-180, ease:Strong.easeOut,onComplete: function(){didabox.txtdida.text="";}}); TweenMax.to(myclip,0.5, {alpha:0, ease:Linear.easeOut,onComplete:function():void {cont_img.img_mc.foto.removeChild(myclip);drawimg();}}) } // --------------------------- END BUTTONS --------------------------------------------------/// // --------------------------- THUMBNAIL GENERATOR AND CONTROL------------------------------/// private function nextThumb() { //Tell the script to take thumbs from XML .... if (thumbMode==true) { img_picsThumb=fotos.item.thumb[iT]; } //Or autogenerate else{ img_picsThumb=fotos.item.link[iT]; } if (iT< fotos.item.length()) { drawThumb(); //Thumbs counter iT=iT+1; //add thumbox to stage var newThumb:thumbox = new thumbox(); newThumb.x=(82*iT)-28; newThumb.name ="thumb"+iT; thumb_mc.container.addChildAt(newThumb,0); } //Add listener when all thumbs are loaded else{ thumb_mc.container.addEventListener(MouseEvent.CLICK,clickControl); thumb_mc.container.addEventListener(MouseEvent.MOUSE_OVER,clickControlOver); thumb_mc.container.buttonMode = true; thumb_mc.container.useHandCursor = true; //left and right arrow control thumb_mc.buttThumbSX.addEventListener(MouseEvent.MOUSE_OVER,scrollSX); thumb_mc.buttThumbDX.addEventListener(MouseEvent.MOUSE_OVER,scrollDX); thumb_mc.buttThumbSX.addEventListener(MouseEvent.MOUSE_OUT,stopScrollSX); thumb_mc.buttThumbDX.addEventListener(MouseEvent.MOUSE_OUT,stopScrollDX); } } private function clickControl(event:MouseEvent) { //if slideshow autoplay is on stop autoplay if (slideShowMode==true) { autoplayOffFct_forced(); } //check click on target menunumber_click=event.target.name; //trace(menunumber_click); if (menunumber_click!="container") { menunumber_click.toString(); //trace(menunumber_click.substring(5, 7)); times=menunumber_click.substring(5, 8)-1; fadeout(); }else{ } } private function clickControlOver(event:MouseEvent) { //can be personalized } // SCROLL CONTROL private function scrollSX(event:MouseEvent) { if (nmrimg>7){ //calculate speed var second:Number=0.2+(thumb_mc.container.x*-1)/300; //tween left myTween1= new TweenMax(thumb_mc.container,second, {x:10, ease:Linear.easeIn}); } } private function scrollDX(event:MouseEvent) { if (nmrimg>7){ //calculate speed var second:Number=0.2+((thumb_mc.container.width-611)-(thumb_mc.container.x*-1))/300; //tween right myTween= new TweenMax(thumb_mc.container,second, {x:-(thumb_mc.container.width)+661-25, ease:Linear.easeIn}); } } private function stopScrollDX(event:MouseEvent) { if (nmrimg>7){ TweenMax.killTweensOf(thumb_mc.container); myTween3=new TweenMax(thumb_mc.container,1, {x:thumb_mc.container.x+10, ease:Strong.easeOut}); } } private function stopScrollSX(event:MouseEvent) { if (nmrimg>7){ TweenMax.killTweensOf(thumb_mc.container); myTween2=new TweenMax(thumb_mc.container,1, {x:thumb_mc.container.x-10, ease:Strong.easeOut}); } } private function infoThumb() { //add thumbnail info about loading from library var NumInt:uint=stage.stageWidth/2-infoT.width/2; infoT.x=NumInt infoT.y=stage.stageHeight-160; infoT.alpha=0; stage.addChild(infoT); TweenMax.to(infoT,1, {alpha:1, ease:Linear.easeOut}) } // ------------------------------------- LOAD THUMB ---------------------------// // create thumb content private function drawThumb() { //load thumb var url:String=img_picsThumb; var urlReq:URLRequest=new URLRequest(url); ldrThumb = new Loader(); initListenersT(ldrThumb.contentLoaderInfo); ldrThumb.load(urlReq); } // init listeners for loading control private function initListenersT(dispatcher:IEventDispatcher):void { dispatcher.addEventListener(Event.COMPLETE,completedT); dispatcher.addEventListener(IOErrorEvent.IO_ERROR,ifErrorT); dispatcher.addEventListener(Event.OPEN,startedT); dispatcher.addEventListener(ProgressEvent.PROGRESS,inLoadingT); } // start loading private function startedT(event:Event):void { } // progress loading private function inLoadingT(event:ProgressEvent):void { catCont.removeEventListener(MouseEvent.CLICK,srollCat); //add thumbnail preloader from library preT.x=(82*iT)-28; preT.alpha=0; thumb_mc.container.addChildAt(preT,1); var actualize:Number=nmrimg+1; infoT.numTxt.text=iT.toString(); infoT.numTxtTot.text=actualize.toString(); //remove thumbnail info about loading when last thumb is ok if (actualize==iT) { TweenMax.to(infoT,1, {x:1999,alpha:0, ease:Linear.easeOut}) catCont.addEventListener(MouseEvent.CLICK,srollCat); catCont.buttonMode=true; catCont.useHandCursor=true; } //init preloader var n:uint=(event.bytesLoaded/event.bytesTotal)*100; if (n<100 && n>0) { preT.alpha=1; } preT.preTtxt.text=n.toString(); } //put loader content in a movie clip for simple use private function completedT(event:Event):void { thumb_mc.container.removeChildAt(1); //trace("draw thumb"); mymovieT=ldrThumb.content; myclipT=mymovieT; //set position myclipT.alpha=0; myclipT.width=80; myclipT.height=48; myclipT.x=(82*iT)-28; thumb_mc.container.addChildAt(myclipT,0); // show thumb with alpha TweenMax.to(myclipT,0.2, {alpha:1, ease:Linear.easeOut,onComplete:nextThumb}) } private function ifErrorT(event:IOErrorEvent):void { trace("ioErrorHandler: "+event); } // -------------------------------- END LOAD IMAGES ---------------------------// //---------------------END THUMB GENERATOR ---------------------------------------// // ----------------------- AUTOPLAY -----------------------------------------------// //activate autoplay private function autoplayOnFct(event:MouseEvent) { slideShowMode=!slideShowMode; autoplay.autoplayOff.visible=true; autoplay.autoplayOn.visible=false; initTimer(); trace("slideShowMode=!slideShowMode:"+slideShowMode); } //DEactivate autoplay private function autoplayOffFct(event:MouseEvent) { timers.stop(); slideShowMode=!slideShowMode; autoplay.autoplayOn.visible=true; autoplay.autoplayOff.visible=false; trace("slideShowMode=!slideShowMode:"+slideShowMode); } //forced DEactivate autoplay private function autoplayOffFct_forced() { timers.stop(); slideShowMode=false; autoplay.autoplayOn.visible=true; autoplay.autoplayOff.visible=false; trace("slideShowMode=!slideShowMode:"+slideShowMode); } // timer private function initTimer():void { timers=new Timer(ssTime*1000,1); timers.addEventListener(TimerEvent.TIMER,this.gestInterval); timers.addEventListener(TimerEvent.TIMER_COMPLETE,endEff); timers.start(); } private function gestInterval(t:TimerEvent):void { //personalizable } //images cycling private function endEff(TimerEvent):void { if (times==nmrimg) { times=0; } else { times=times+1; } fadeout(); } } }