6 Replies Latest reply on Aug 2, 2009 12:39 PM by jimmyoneshot

    Saveable List of User-Entered urls

    jimmyoneshot

      I’ve found the following code on the net that is a basic example of using the sharedObject method to allow users to save data, however I want to enhance this same example so that in the text area, the user can enter different urls and then when each url that the user has entered is clicked it will navigate to that specific page.

      I know that allowing a user to merely enter a url into a single text box and then have it link to the relevant site once clicked is a simple process but I want to achieve this within the following example so that users can save their url list, reset their entire list back to blank or perhaps delete each link individually by clicking on it then clicking a delete button.

      My main problem is that it seems the selectedItem.text property can’t be accessed within a text area's click command and it doesn't seem the itemClick function is available in a text area like it can in a TileList for example so I’m not sure how I can get it to navigate to the contained url of each item when each item is actually clicked. Would the text area need to be changed to another type of component to incorporate this?:-

      <?xml version="1.0" encoding="utf-8"?>

      <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"

            layout="absolute"

            creationComplete="initSharedObject()">

            <mx:Script>

                  <![CDATA[

                  import flash.net.SharedObject;

       

                  public var sharedObj:SharedObject;

       

                private function initSharedObject():void{

                        sharedObj = SharedObject.getLocal("myTasks");

                      if (sharedObj.size > 0)

                        textareaTasks.text=sharedObj.data.tasks;

                  }

       

                public function localconnectionHandler(msg:String):void {

                        textareaTasks.text= textareaTasks.text + msg + "\n";

                }

       

                private function clearTasks(event:MouseEvent):void {

                    textareaTasks.text="";

                }

       

                private function saveTasks(event:MouseEvent):void {

                    sharedObj.data.tasks = textareaTasks.text;

                        sharedObj.flush();

                }

       

                  private function deleteSavedTasks(event:MouseEvent):void {

                      sharedObj.clear();

                  }

       

                  ]]>

            </mx:Script>

            <mx:Panel  horizontalCenter="0" verticalCenter="0.5" verticalGap="15"

                  paddingLeft="20" paddingRight="20" paddingBottom="20" paddingTop="20"

                    height="300">

                  <mx:Label text="Your tasks are..."/>

                  <mx:TextArea id="textareaTasks"

                        top="20" left="20" right="20" bottom="20"

                        width="100%" height="100%"/>

                  <mx:HBox>

                        <mx:Button id="btnClearTasks" click="clearTasks(event)"

                              label="Clear Tasks"/>

                        <mx:Button id="btnSaveTasks" click="saveTasks(event)"

                              label="Save Tasks to Shared Object"/>

                        <mx:Button id="btnDeleteSavedTasks" click="deleteSavedTasks(event)"

                              label="Delete Saved Shared Object Tasks"/>

                  </mx:HBox>

            </mx:Panel>

      </mx:Application>

        • 1. Re: Saveable List of User-Entered urls
          Gregory Lafrance Level 6

          If this post answers your question or helps, please mark it as such.

           

          You should use a List instead of a TextArea. I've created a custom component to get the URL from the user, and the URLs are displayed in the main app are launchable, and deletable.

           

          I still have to get loading the SharedObject working right, but here is the code so far:

           

          ------- AddURL.mxml -----------

          <?xml version="1.0" encoding="utf-8"?>
          <mx:TitleWindow xmlns:mx="http://www.adobe.com/2006/mxml"
            creationComplete="PopUpManager.centerPopUp(this);"
            title="Add a URL" width="700" verticalGap="20"
            paddingTop="15" paddingBottom="10">
            <mx:Script>
              <![CDATA[
                import mx.core.Application;
                import mx.controls.Alert;
                import mx.managers.PopUpManager;
               
                [Bindable] private var dataValid:Boolean = false;
               
                private function validateData():void{
                  dataValid = url.text != "" ? true : false;
                }
               
                private function addURL():void{
                  mx.core.Application.application.addURL(url.text);
                  PopUpManager.removePopUp(this);
                }
              ]]>
            </mx:Script>
            <mx:TextInput id="url" width="100%" change="validateData();"/>
            <mx:Button label="Add URL" click="addURL();" enabled="{dataValid}"/> 
          </mx:TitleWindow>


          ------ MainApp.mxml --------

           

          <?xml version="1.0" encoding="utf-8"?>
          <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
            layout="absolute" creationComplete="initSharedObject();">
            <mx:Script>
              <![CDATA[
                import mx.events.ListEvent;
                import mx.collections.ArrayCollection;
                import flash.net.SharedObject;
                import mx.managers.PopUpManager;
                import AddURL;

                private var sharedObj:SharedObject;
                [Bindable] public var urls:ArrayCollection;
               
                private function initList():void{
                  urls = new ArrayCollection();
                }

                private function initSharedObject():void{
                  initList();
                  sharedObj = SharedObject.getLocal("urls");
                  if (sharedObj.size > 0){
                    var urlList:Array = sharedObj.data.urls.split(",");
                    urls = new ArrayCollection();
                    for each(var url:String in urlList){
                      urls.addItem({url: url});
                    }
                  }
                }

                private function saveUrls(event:MouseEvent):void {
                  var urlList:String = "";
                  for each(var obj:Object in urls){
                    urlList += obj.toString() + ",";
                  }
                  sharedObj.data.urls = urlList;
                  sharedObj.flush();
                }

                private function deleteSavedUrls(event:MouseEvent):void {
                  sharedObj.clear();
                  initList();
                }

                public function gotoURL(evt:MouseEvent):void{
                  navigateToURL(new URLRequest(urlList.selectedItem.url), '_blank');
                }
               
                private function addURLDialog():void{
                  PopUpManager.createPopUp(this, AddURL, true);
                }
               
                public function addURL(url:String):void{
                  urls.addItemAt({url: url},0);
                }
              ]]>
            </mx:Script>
            <mx:Panel  horizontalCenter="0" verticalCenter="0.5" verticalGap="15"
              paddingLeft="20" paddingRight="20" paddingBottom="20" paddingTop="20"
              height="500">
              <mx:HBox>
                <mx:Label text="Your URLs:" fontWeight="bold" fontSize="14"/>
                <mx:Button label="Add URL" click="addURLDialog();"/>     
              </mx:HBox>
              <mx:List id="urlList" top="20" left="20" right="20" 
                bottom="20" width="100%" height="100%" dataProvider="{urls}"
                alternatingItemColors="[0xcee7f6, 0xf4d5f7]">
                <mx:itemRenderer>
                  <mx:Component>
                    <mx:HBox>
                      <mx:Button label="GO" toolTip="Go to URL"
                        click="outerDocument.gotoURL(event);"/>
                      <mx:Text name="urlText" text="{data.url}" width="100%"/>
                      <mx:Button label="X" toolTip="Delete URL"
                        click="{outerDocument.urls.removeItemAt(outerDocument.urlList.selectedIndex)}"/>
                    </mx:HBox>
                  </mx:Component>
                </mx:itemRenderer>
              </mx:List>
              <mx:HBox>
                <mx:Button id="btnClearUrls" click="initList()"
                  label="Clear URLs"/>
                <mx:Button id="btnSaveUrls" click="saveUrls(event)"
                  label="Save URLs to Shared Object"/>
                <mx:Button id="btnDeleteSavedUrls" click="deleteSavedUrls(event)"
                  label="Delete Saved Shared Object URLs"/>
                <mx:Button id="btnReloadSavedUrls" click="initSharedObject()"
                  label="Reload Saved Shared Object URLs"/>
              </mx:HBox>
            </mx:Panel>
          </mx:Application>

          1 person found this helpful
          • 2. Re: Saveable List of User-Entered urls
            Gregory Lafrance Level 6

            If this post answers your question or helps, please mark it as such.

             

            Okay. The shared object works correctly now.Only the main app file had to change. The AddURL component above is fine as is:

             

            <?xml version="1.0" encoding="utf-8"?>
            <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
              layout="absolute" creationComplete="initSharedObject();">
              <mx:Script>
                <![CDATA[
                  import mx.events.ListEvent;
                  import mx.collections.ArrayCollection;
                  import flash.net.SharedObject;
                  import mx.managers.PopUpManager;
                  import AddURL;

                  private var sharedObj:SharedObject;
                  [Bindable] public var urls:ArrayCollection;
                 
                  private function initList():void{
                    urls = new ArrayCollection();
                  }

                  private function initSharedObject():void{
                    initList();
                    sharedObj = SharedObject.getLocal("urls");
                    if (sharedObj.size > 0){
                      var urlList:Array = sharedObj.data.urls.split(",");
                      urls = new ArrayCollection();
                      for each(var url:String in urlList){
                        if(url != ""){
                          var urlObj:Object = {url: url};
                          urls.addItem(urlObj);            
                        }
                      }
                    }
                  }

                  private function saveUrls(event:MouseEvent):void {
                    var urlList:String = "";
                    for each(var obj:Object in urls){
                      urlList += obj.url + ",";
                    }
                    sharedObj.data.urls = urlList;
                    sharedObj.flush();
                  }

                  private function deleteSavedUrls(event:MouseEvent):void {
                    sharedObj.clear();
                    initList();
                  }

                  public function gotoURL(evt:MouseEvent):void{
                    navigateToURL(new URLRequest(urlList.selectedItem.url), '_blank');
                  }
                 
                  private function addURLDialog():void{
                    PopUpManager.createPopUp(this, AddURL, true);
                  }
                 
                  public function addURL(url:String):void{
                    urls.addItemAt({url: url},0);
                  }
                ]]>
              </mx:Script>
              <mx:Panel  horizontalCenter="0" verticalCenter="0.5" verticalGap="15"
                paddingLeft="20" paddingRight="20" paddingBottom="20" paddingTop="20"
                height="500">
                <mx:HBox>
                  <mx:Label text="Your URLs:" fontWeight="bold" fontSize="14"/>
                  <mx:Button label="Add URL" click="addURLDialog();"/>     
                </mx:HBox>
                <mx:List id="urlList" top="20" left="20" right="20" 
                  bottom="20" width="100%" height="100%" dataProvider="{urls}"
                  alternatingItemColors="[0xcee7f6, 0xf4d5f7]" rowHeight="30">
                  <mx:itemRenderer>
                    <mx:Component>
                      <mx:HBox verticalAlign="middle">
                        <mx:Button label="GO" toolTip="Go to URL"
                          click="outerDocument.gotoURL(event);"/>
                        <mx:Text name="urlText" text="{data.url}" width="100%"/>
                        <mx:Button label="X" toolTip="Delete URL"
                          click="{outerDocument.urls.removeItemAt(outerDocument.urlList.selectedIndex)}"/>
                      </mx:HBox>
                    </mx:Component>
                  </mx:itemRenderer>
                </mx:List>
                <mx:HBox>
                  <mx:Button id="btnClearUrls" click="initList()"
                    label="Clear URLs"/>
                  <mx:Button id="btnSaveUrls" click="saveUrls(event)"
                    label="Save URLs to Shared Object"/>
                  <mx:Button id="btnDeleteSavedUrls" click="deleteSavedUrls(event)"
                    label="Delete Saved Shared Object URLs"/>
                  <mx:Button id="btnReloadSavedUrls" click="initSharedObject()"
                    label="Reload Saved Shared Object URLs"/>
                </mx:HBox>
              </mx:Panel>
            </mx:Application>

            • 3. Re: Saveable List of User-Entered urls
              jimmyoneshot Level 1

              Excellent. That's even better than I thought.

               

              I tried for hours to get it done myself but it works great now. Thanks a lot.

              • 4. Re: Saveable List of User-Entered urls
                jimmyoneshot Level 1

                I have a strange problem after I've changed this application into an AIR application. When I run it and click the 'Go' button on any of the added urls the site doesn't open. Internet Explorer doesn't even open at all.

                 

                The strange thing is this works fine if it's ran as an Flex application so I just can't figure out why it would'nt as an AIR app

                • 5. Re: Saveable List of User-Entered urls
                  Gregory Lafrance Level 6

                  I can't look at this right now, but you might want to consider using the HTML control as a popup.

                  • 6. Re: Saveable List of User-Entered urls
                    jimmyoneshot Level 1

                    It's ok no worries. I've managed to get it fixed by changing the gotoURL function to:-

                     

                    public function gotoURL(evt:MouseEvent):void{

                    {navigateToURL(new URLRequest('http://' + urlList.selectedItem.url))};

                    }

                     

                    Works fine now. Cheers.