1 Reply Latest reply on Feb 8, 2010 3:57 PM by cheftimo

    Help needed with effects on a pop-up window

    cheftimo Level 2

      The easiest way to see the problem is to see the program in action, here: http://www.webgourmand.com/wg/CyberCucina/CyberCucina2.html. If you can't figure out what's going on, please read the notes you see when the page appears, and perhaps those on the Support tab.

       

      Up to the point where you click the image on the product description, it's all working the way I like. Now, when I click the pop-up window to dismiss it, I would like it to zoom down and out of view, just the reverse of when it zooms out and you see the big image.

       

      The problem now is that the pop-up is getting removed before the zoom when you dismiss the pop-up is complete. Please note this: when I remove the last line of code from function closePopUp(), the zoom happens as I expect, but it just loops (and, of course, the pop-up does not get removed).

       

      Here is the pop-up window component code:

       

       

       

      <?xml version="1.0" encoding="utf-8"?>
      <mx:Box xmlns:mx="http://www.adobe.com/2006/mxml" 
           creationComplete="PopUpManager.centerPopUp(this)"
            borderStyle="solid" borderThickness="20" cornerRadius="24" 
            backgroundColor="#000000" borderColor="#000000" 
            mouseDownEffect="zoomPopUpIn()"
            >
           
           <mx:Script>
                <![CDATA[
                     import mx.managers.PopUpManager;
                     import valueObjects.Product;
                     
                     [Bindable]
                     public var product:Product;
                     
                     private function zoomPopUpIn():void{
                     popUpZoom.zoomHeightFrom = 1;
                     popUpZoom.zoomHeightTo = 0;
                     popUpZoom.zoomWidthFrom = 1;
                     popUpZoom.zoomWidthTo = 0;
                     popUpZoom.play();
                     }
                     
                     private function closePopUp():void{
                          zoomPopUpIn();
                          PopUpManager.removePopUp(this);
                     }     
                ]]>
           </mx:Script>
           
          <mx:Zoom id="popUpZoom" duration="1000" target="{this}" 
               effectEnd="closePopUp()"/>
      
           <mx:Image id="img" width="640" height="480"
                source = "../assets/images/Cyber/BigImage_files/{product.BigImage}" 
                toolTip="CLICK IMAGE to CLOSE this window" 
                click="closePopUp()"
                />
           
      </mx:Box>
      
       
      

       

       

      What I need to accomplish is to let that last zoom end before the pop-up is removed.

       

      Anyone have any ideas?

       

      Best regards,

       

      Carlos

        • 1. Re: Help needed with effects on a pop-up window
          cheftimo Level 2

          Never mind, I figured it out!

           

          In case anyone is interested, I tried a couple of things:

           

          • ·        Ending the effect explicitly, like this, popUpZoom.end(), right after popUpZoom.play() in the closePopUP() function;
          • ·        making popUpZoom's effectEnd = " closePopUP()".

           

          Neither of those worked: the popUp was getting wiped out before the zoomPopUPIn() had a chance to complete.

           

          What I ended up doing:

           

          • ·        Removed 'PopUpManager.removePopUp(this)' from the closePopUp() function;
          • ·        Made popUpZoom's effectEnd = "PopUpManager.removePopUp(this)".

           

          It's working OK. Now, on to other issues…

           

          I'm sure I'll be back.

           

          Carlos