20 Replies Latest reply on Apr 26, 2010 10:37 PM by Biswamit

    BACK Button

    Florincugir

      I have this scenario with two separate FLEX applications:

       

      FLEX 1 displays SCREEN 1 where the user signs-on; if this operation was successful, is displayed SCREEN 2:with a menu with drop-down options. One of this options, call FLEX 2 application with some information displayed on the same browser. In this FLEX 2 screen, there is a BACK button with click=

      ExternalInterface.call(

      "history.back()").

      The idea is to return to the SCREEN 2 from the FLEX 1 application.

      The problem is that is returned to the SCREEN 1 (sign-on screen). Obviously, the User Session is lost, an unwanted scenario.

       

      Could be solved that by opening a new browser by FLEX 2, but it is not acceptable; should be used only one browser, not two.

       

      Is there a way around this, I mean to return to the SCREEN 2 of FLEX 1?

       

       

      Thanks. 

        • 1. Re: BACK Button
          Matt Le Fevre Level 4

          I think i understand what you mean.

           

          you'd probably want to use Cookies

          1 person found this helpful
          • 2. Re: BACK Button
            Florincugir Level 1

            Thanks, Grizz...

             

            It looks like I need a little(!) more research about this Cookies thing, because I never used them; btw, googling to find something about Cookies (what kind of animals they are), I run over another forum post where you answered and, also, you posted a detailed application about this issue (I remember you worked with Cookies using PHP; good job!).

            Anyway, my boss didn't agree with the Back button idea, so, I need to postpone a little bit the investigation about Cookies; but thank you for your answer, much appreciated, as usual. 

             

             

            Florin

            • 3. Re: BACK Button
              David_F57 Level 5

              hi,

               

              A couple of thoughts, do you need to do this as separate webpages, you could just as easily do it with states in 1 flex app. for 2 separate apps If the first page is a flex app you can store the login details in a local sharedobject. Whenever the first app appears it can look at the sharedobject and if its there it will populate the login box, also you can use it the same way as cookies in that you give them a 'remember me' option.

               

              David.

              • 4. Re: BACK Button
                Florincugir Level 1

                Hi David and thank you for your answer...

                 

                Let me see if I understood correctly: when the user signs-on on the login page of FLEX 1 application, I store the login details in a local shared object.

                When the user hits Back button in FLEX 2 application (which was called from FLEX 1 second page), I use login details for FLEX 1 login page and go directly to the FLEX 1 second page (the behaviour I am actually looking for). Is that correct?

                 

                 

                Florin

                • 5. Re: BACK Button
                  David_F57 Level 5

                  hi,

                   

                  You could program it like that becuase on initialize of page 1 you could check for login details if they exist jump straight to page 2.

                   

                  David.

                  • 6. Re: BACK Button
                    David_F57 Level 5

                    hi,

                     

                    this is fairly simple but it shows how sharedobjects work

                     

                    http://gumbo.flashhub.net/login/ - source included

                     

                     

                    put some values in , tick save then click login, hit refresh on browser, untick save hit login then refresh browser.

                     

                     

                    David.

                    1 person found this helpful
                    • 7. Re: BACK Button
                      Florincugir Level 1

                      Woww... Thanks a lot, David! I will definitely give it a try (never worked with Shared Object before, so, the source is very helpful). I will keep you posted.

                       

                       

                       

                      Florin

                      • 8. Re: BACK Button
                        Biswamit Level 1

                        Hey

                         

                        I am not sure if I understood you correctly

                         

                        Let say you have a html with embeded swf file one being FLEX1 and another being FLEX2

                         

                        Load FLEX1 with Ajax call using say SWF Object and then login through the user credentials and then right click on the menu to go to FLEX2

                         

                        Logically when the menu is clicked you can make a External Interface call to load the another FLEX2 application using another Ajax call using SWF Object

                         

                        Let the user do whatever they want and in case if you want to pass information between then you can use SWF Communication or External Call Interface

                         

                        This would mean that the FLEX2 application will be loaded on top of FLEX1 in your case using the full screen size or may be we can do it with some portion of html page showing both the FLEX1 and FLEX2 together(not sure if these can serve your requirement). Now when you click on the BACK button you unload the FLEX2 application using Ajax and go back to the FLEX1 without killing the session of FLEX1.

                         

                        Hope this help.In case if I miss understood you then ignore it

                         

                        Regards

                        Biswamit

                        • 9. Re: BACK Button
                          Florincugir Level 1

                          Biswamit,

                           

                          First, thank you for your answer...

                           

                          Second, yes, you got it pretty well what I am trying to achieve here... Currently, from the FLEX1 second page menus, I call FLEX2 application using

                           

                          var url:URLRequest = new URLRequest("http://syyzas400/ShipmentInquiry/ShipmentDetails.html");

                          navigateToURL(url,"_self");

                           

                          In this moment, Flex2 (ShipmentDetails) is loaded on the top of FLEX1; so far, so good! Now, when the user hit BACK button, I want to unload (as you correctly pointed out) FLEX2 and to see second page (menus page) from FLEX1

                          You said I can do that using AJAX; could you, please, be a little more specific with an example, or a site where I can find it?

                           

                          Best regards,

                           

                          Florin

                          • 10. Re: BACK Button
                            Biswamit Level 1

                            Hi

                             

                            In case you are using URL Request you will probably land up in different window to show the shipment details

                             

                            I was pointing toward two flex application with compiled swf. Like Say flex1.swf and flex2.swf(shipment details)

                             

                            One main.html page embed flex1.swf and load it a particular declared div

                             

                            <div id="flex1_div">

                            <script type="text/javascript">

                            new Ajax.Request("flex1.swf", {

                            onComplete: function(e)

                            {

                            var flashvars = {};

                            var params = {menu: "false"};

                            var attributes = {};

                            swfobject.embedSWF("flex1.swf", "flex1_div", "1300", "100", "9.0.0","expressInstall.swf", flashvars, params, attributes);

                             

                            }

                            });

                            </script>

                            </div>

                             

                            On loading of that main html page let user log in ........and on clicking of the right click show context menu .............when clicked on a particular menu item ........................use External Interface call to load the flex2.swf at a different div in the main.html say at some portion of the html page........... You know right how to set up External Interface call between flex and javascript ................user click on the right click menu item will call the say following javascript function say loadflex2Widget

                             

                             

                            function loadflex2Widget() {

                            loadedWidget = "flex2.swf";

                            new Ajax.Request("flex2.swf", {

                            onComplete: function(e)

                            {

                            var flashvars = {};

                            var params = {menu: "false"};

                            var attributes = {};

                            swfobject.embedSWF("flex2.swf", "flex2_div", "1050", "800", "9.0.0","expressInstall.swf", flashvars, params, attributes);

                            }

                            });

                            }

                             

                            Once this flex2.swf is loaded ...................and when the user click on the say remove flex2 ............u might use another external interface call to call a function to unload itself from the main.html

                             

                            function unloadFlex2Widget() {

                            swfobject.removeSWF(loadedWidget);

                            }

                             

                            Ok ....................this is just to let you understand what I was trying to convey you.....................you need to write exact code and then make it work

                             

                             

                            Swf Object is Google stuff u can use it. Moreover say for Ajax calls you can use Prototype framework.....you can get it downloaded from searching in google

                             

                            Regards

                            Biswamit

                            • 11. Re: BACK Button
                              Ansury Level 3

                              I'll state the obvious once again:

                               

                              Why go about creating multiple "applications" and integrating them via fragile, complex, and needless JavaScript hacks when this should clearly be a single application?

                               

                              Unless there is some strong need for this to consist of two applications, why are they not just being integrated with one another?

                               

                              Perhaps it's time to stop playing around with fancy hacked-together (likely browser version specific) solutions in an effort to preserve a little old code, and to just stick with the same way everyone else does it (in a single application)?

                               

                              Making a Flex application browser specific defeats a major purpose of using Flex in the first place: VM-sandboxing the application from the volatile and non-standard browser environment.

                              • 12. Re: BACK Button
                                Florincugir Level 1

                                Biswamit,

                                 

                                I do have two different swf files, Flex1.swf and Flex2.swf.

                                Inside Flex1 I use that URL technique, but Flex2 is open in the same window, because I use navigateToUrl command with "_self" option; but it is obvious for me now that, using my technique, it is not possible to achieve what I am looking for...

                                I still have to investigate the other solutions sugessted here: Cookies, Shared Objects, and of course, yours...

                                I don't know what I am going to do at the end, but this thread was for me a very instructive one and I would like to thank to everybody who responded.

                                 

                                 

                                Best regards,

                                 

                                 

                                Florin

                                • 13. Re: BACK Button
                                  Biswamit Level 1

                                  Hi Ansury

                                   

                                  You are correct it all depends on the requirement

                                   

                                  In case if your application is already running different technologies like simple HTML , Ruby/Rails, Ext Js, Flex  and other widgets etc there would be no other option but to try out this kind of option until it is transitioned to use and implement with single technology like Flex

                                   

                                  Moreover if you have a productive running application and if you have a customer requirement say of a chart window which flex can give then they would definetely leverage the power of flex or say ruby/rails and create a flex widget and hook into the application instead of making the whole application to run on flex which would in turn take long time.

                                   

                                  For some reason people are now a days thinking of using all new technologies to get the best.

                                   

                                  Regard

                                  Biswamit

                                  • 14. Re: BACK Button
                                    Florincugir Level 1

                                    Ansury,

                                     

                                    I agree with you, believe it or not! BUT... I have the next scenario: a specific FLEX application should be able to be called from three different points: one of it is from another FLEX application (this thread), but two are not.

                                    My idea was to create one separate application called from whenever is necessary; the advantage of this approach is, IMHO, if you need to do some changes, you do it in one place only, not in many...

                                    It looks like is not that easy and, probably, I will end up with your suggestion... (I was so close, though...)

                                     

                                     

                                    Thank you

                                     

                                     

                                    Florin

                                    • 15. Re: BACK Button
                                      Ansury Level 3

                                      Biswamit,

                                       

                                      I understand what you are saying, but rather than get into that (there are other things to consider beyond initial implementation such as maintainability) which would be off topic, I'm not following how this falls under that category.

                                       

                                      You have two Flex applications, one of which sounds like it's only handling authentication and maybe a bit more.  In this case you're not combining two different client technologies, it's all Flex.  Even if you have multiple middle-tiers (servlets, Ruby, etc) a single Flex application can handle talking to all of them just fine.  Perhaps the requirements just haven't been defined well enough for us here to fully understand.

                                       

                                       

                                      Edit: Just realized Biswamit isn't the OP, so sorry if the text above is confusing.

                                      • 16. Re: BACK Button
                                        Ansury Level 3

                                        Florincuqir,

                                         

                                        This may not be a working solution but have you considered using SWFLoader in your portal Flex application to load your second application?

                                         

                                        The SWFLoader control loads and displays a specified SWF file. You typically use SWFLoader for loading one Flex application into a host Flex application.


                                        http://www.adobe.com/livedocs/flex/3/langref/mx/controls/SWFLoader.html

                                         

                                         

                                        I've never done this in a serious project before (so I'm unaware of the limitations or complications) but you may want to do some research on the topic.

                                        • 17. Re: BACK Button
                                          Biswamit Level 1

                                          Hi

                                           

                                          The requirement is not really clear

                                           

                                          I thought FLEX1 is a flex widget called from another application and then it needs to call another different application FLEX2 and so gave the above idea of leveraging flex application using LocalConnection/ SWFObject/ Ajax etc....................

                                           

                                          If all are flex application and you need to load and unload then use ModuleLoader or SWFLoader as suggested by Ansuri which can help you in loading/unloading module .............

                                           

                                          Regards

                                          Biswamit

                                          • 18. Re: BACK Button
                                            Florincugir Level 1

                                            Thanks Ansury,

                                             

                                            I knew about this SWFLoader, but for some reason (I don't remember now) I didn't think they would be helpful; I will revise that again, though...

                                             

                                            My problem now is that, being pretty new on this forum, I wasn't aware you can grant "Helpful answer" for maximum two answers; and I definitely  wanted to say that about yours and Biswamit's suggestions... Sorry for that!

                                             

                                             

                                            Thank you

                                             

                                             

                                            Florin

                                            • 19. Re: BACK Button
                                              Florincugir Level 1

                                              Ansury,

                                               

                                              I almost done it using SWFLoader, but unfortunatelly, I encountered a problem which is a show-stopper: the value of a host application variable (user session) is lost for the loaded one (and the loaded application needs it).

                                              Do you (or someone else) know a way around this? How can I use the value of a host-application variable to the loaded one (basically, to work as a parameter)?

                                               

                                               

                                              Thank you

                                               

                                               

                                              Florin

                                              • 20. Re: BACK Button
                                                Biswamit Level 1

                                                Hi Florin

                                                 

                                                Try one of these

                                                 

                                                1st Option

                                                 

                                                <mx:SWFLoader 
                                                       
                                                width="100%" height="100%"
                                                       
                                                source=".FLEX2.swf"
                                                       
                                                complete="onLoadComplete(event)"
                                                       
                                                ioError="onLoadError()" securityError="onSecurityError()" />

                                                private function onLoadedAppComplete(event:FlexEvent):void {
                                                                        try {
                                                                                loadedApp = Application(event.target.application);
                                                                                if(!loadedApp) throw new Error();

                                                                                loadedApp.parameters["param1"] = "value1";//Pass variable this way
                                                                        } catch (e:Error) {
                                                                                Alert.show("Failed to get application loaded.", "Error", Alert.OK);
                                                                        }
                                                                }


                                                2nd Option

                                                var loader:SWFLoader = new SWFLoader();
                                                loader.addEventListener(Event.COMPLETE, function(event:Event):void {
                                                    var content:DisplayObject = loader.content;
                                                    uicomponent.addChild(content);
                                                });
                                                loader.load("FLEX2.swf")

                                                Then in Flex2 application write the below to access the varibale passed through URL

                                                if (application.loaderInfo != null) {
                                                    var url:String = application.loaderInfo.url;
                                                    var qm:int = url.lastIndexOf("?");
                                                    if (qm != -1) {
                                                        var query:String = url.substr(qm + 1);
                                                        var params:Array = query.split("&");
                                                        for (var i:int = 0; i < params.length; i++) {
                                                            var param:String = params[i];
                                                            var nameValue:Array = param.split("=");
                                                            if (nameValue.length == 2) {
                                                                var key:String = nameValue[0];
                                                                var val:String = nameValue[1];
                                                                trace(key + "=" + val);
                                                            }
                                                        }
                                                    }
                                                }

                                                3rd Option
                                                Using flash.display.loader in Flex1.swf

                                                import flash.display.Loader;
                                                     import flash.display.Sprite;
                                                     import flash.events.Event;
                                                     import flash.net.URLRequest;
                                                
                                                     public class ExampleA extends Sprite
                                                     {
                                                          private var loader:Loader = new Loader();
                                                
                                                          public function ExampleA()
                                                          {
                                                               loader.contentLoaderInfo.addEventListener( Event.INIT, onLoaderInit );
                                                               loader.load( new URLRequest( "Flex2.swf" ) );
                                                          }
                                                
                                                          private function onLoaderInit( e:Event ):void
                                                          {
                                                               Object( loader.content ).init( "pass variable" );
                                                          }
                                                     }

                                                 

                                                 

                                                Flex 2 code down to access the variable passed from Flex1.swf

                                                 

                                                     import flash.display.Sprite;
                                                
                                                     public class ExampleB extends Sprite
                                                     {
                                                          public function ExampleB()
                                                          {}
                                                
                                                          public function init( param:String ):void
                                                          {
                                                               trace( param ); // passed variable
                                                          }
                                                     }