10 Replies Latest reply on Jan 27, 2010 11:43 PM by shashank543233

    how to use navigateToUrl for below example..also when i export it its showing a blank page

    shashank543233

      this is the TAG.as file... in the 87th line we have to put the navigatetourl command, i highlighted the lined to be edited

       

      package
      {
          import flash.display.Sprite;
          import flash.events.MouseEvent;
          import flash.text.TextField;
          import flash.text.TextFieldAutoSize;
          import flash.text.TextFormat;
          import mx.events.MenuEvent;
                  import mx.controls.Alert;
                  import mx.collections.*;
          import mx.controls.Alert;
         
          public class Tag extends Sprite {
             
              private var _back:Sprite;
              private var _node:Object;
              private var _cx:Number;
              private var _cy:Number;
              private var _cz:Number;
              private var _color:Number;
              private var _hicolor:Number;
              private var _active:Boolean;
              private var _tf:TextField;
              private var keyword:String;
             
              //You need to embed a font
              [Embed(systemFont="Tahoma",
                          fontName="myFont",
                          mimeType="application/x-font")]
              public var myFont:Class;

       


              public function Tag( node:Object, color:Number, hicolor:Number ){
                  _node = node;
                  keyword = node.name;
                  _color = color;
                  _hicolor = hicolor;
                  _active = false;
                  // create the text field
                  _tf = new TextField();
                  _tf.autoSize = TextFieldAutoSize.LEFT;
                  _tf.selectable = false;
                  // set styles
                  var format:TextFormat = new TextFormat();
                  format.font = "myFont";
                  format.bold = true;
                  format.color = color;
                  format.size = ((8*node.size)/50);
                  _tf.defaultTextFormat = format;
                  _tf.embedFonts = true;
                  // set text
                  _tf.text = node.name;
                  addChild(_tf);
                  // scale and add
                  _tf.x = -this.width / 2;
                  _tf.y = -this.height / 2;
                  // create the back
                  _back = new Sprite();
                  _back.graphics.beginFill( _hicolor, .4 );
                  _back.graphics.lineStyle( 0, _hicolor );
                  _back.graphics.drawRect( 0, 0, _tf.textWidth+20, _tf.textHeight+5 );
                  _back.graphics.endFill();
                  addChildAt( _back, 0 );
                  _back.x = -( _tf.textWidth/2 ) - 10;
                  _back.y = -( _tf.textHeight/2 ) - 2;
                  _back.visible = false;
                  // force mouse cursor on rollover
                  this.mouseChildren = false;
                  this.buttonMode = true;
                  this.useHandCursor = true;
                  // events
                  this.addEventListener(MouseEvent.MOUSE_OUT, mouseOutHandler);
                  this.addEventListener(MouseEvent.MOUSE_OVER, mouseOverHandler);
                  this.addEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
              }
             
              private function mouseOverHandler( e:MouseEvent ):void {
                  _back.visible = true;
                  _tf.textColor = _hicolor;
                  _active = true;
              }
             
              private function mouseOutHandler( e:MouseEvent ):void {
                  _back.visible = false;
                  _tf.textColor = _color;
                  _active = false;
              }
             
             private function mouseUpHandler( e:MouseEvent ):void {
                 
                  var objURLReq:URLRequest = new URLRequest(event.item.@data.toString());
                 navigateToURL(objURLReq, "_self");
              }

       

              // setters and getters
              public function set cx( n:Number ):void{ _cx = n }
              public function get cx():Number { return _cx; }
              public function set cy( n:Number ):void{ _cy = n }
              public function get cy():Number { return _cy; }
              public function set cz( n:Number ):void{ _cz = n }
              public function get cz():Number { return _cz; }
              public function get active():Boolean { return _active; }

       

          }

       

      }

       

       

      and this is the xml file related..

      <?xml version="1.0" encoding="UTF-8"?>
      <tags>
        <tag>
          <name>Illustration</name>
          <data>"http://www.adobe.com/"</data>
          <tid>2</tid>
          <weight>1</weight>
          <counter>4</counter>
          <repetead>2</repetead>
          <size>133.33333333333</size>
          <meuPeso>6</meuPeso>
        </tag>
        <tag>
          <name>CorelDraw</name>
          <tid>113</tid>
          <weight>1</weight>
          <counter>3</counter>
          <repetead>0</repetead>
          <size>113.33333333333</size>
          <meuPeso>3</meuPeso>
        </tag>
        <tag>
          <name>Design</name>
          <tid>1</tid>
          <weight>1</weight>
          <counter>3</counter>
          <repetead>2</repetead>
          <size>126.66666666667</size>
          <meuPeso>5</meuPeso>
        </tag>
        <tag>
          <name>Flex</name>
          <tid>6</tid>
          <weight>1</weight>
          <counter>3</counter>
          <repetead>4</repetead>
          <size>140</size>
          <meuPeso>7</meuPeso>
        </tag>
        <tag>
          <name>mxml</name>
          <tid>15</tid>
          <weight>1</weight>
          <counter>2</counter>
          <repetead>2</repetead>
          <size>120</size>
          <meuPeso>4</meuPeso>
        </tag>
        <tag>
          <name>skin</name>
          <tid>14</tid>
          <weight>1</weight>
          <counter>2</counter>
          <repetead>0</repetead>
          <size>106.66666666667</size>
          <meuPeso>2</meuPeso>
        </tag>
        <tag>
          <name>Eclipse</name>
          <tid>12</tid>
          <weight>1</weight>
          <counter>2</counter>
          <repetead>2</repetead>
          <size>120</size>
          <meuPeso>4</meuPeso>
        </tag>
        <tag>
          <name>swf</name>
          <tid>9</tid>
          <weight>1</weight>
          <counter>2</counter>
          <repetead>0</repetead>
          <size>106.66666666667</size>
          <meuPeso>2</meuPeso>
        </tag>
        <tag>
          <name>Flash</name>
          <tid>8</tid>
          <weight>1</weight>
          <counter>2</counter>
          <repetead>2</repetead>
          <size>120</size>
          <meuPeso>4</meuPeso>
        </tag>
        <tag>
          <name>Tour de Flex</name>
          <tid>13</tid>
          <weight>1</weight>
          <counter>2</counter>
          <repetead>2</repetead>
          <size>120</size>
          <meuPeso>4</meuPeso>
        </tag>
        <tag>
          <name>Flex Builder</name>
          <tid>11</tid>
          <weight>1</weight>
          <counter>2</counter>
          <repetead>2</repetead>
          <size>120</size>
          <meuPeso>4</meuPeso>
        </tag>
        <tag>
          <name>ActionScript</name>
          <tid>10</tid>
          <weight>1</weight>
          <counter>2</counter>
          <repetead>2</repetead>
          <size>120</size>
          <meuPeso>4</meuPeso>
        </tag>
        <tag>
          <name>Adobe</name>
          <tid>7</tid>
          <weight>1</weight>
          <counter>2</counter>
          <repetead>2</repetead>
          <size>120</size>
          <meuPeso>4</meuPeso>
        </tag>
        <tag>
          <name>as</name>
          <tid>17</tid>
          <weight>1</weight>
          <counter>2</counter>
          <repetead>10</repetead>
          <size>173.33333333333</size>
          <meuPeso>12</meuPeso>
        </tag>
        <tag>
          <name>as3</name>
          <tid>16</tid>
          <weight>1</weight>
          <counter>2</counter>
          <repetead>2</repetead>
          <size>120</size>
          <meuPeso>4</meuPeso>
        </tag>
        <tag>
          <name>Cinema 4D</name>
          <tid>4</tid>
          <weight>1</weight>
          <counter>1</counter>
          <repetead>0</repetead>
          <size>100</size>
          <meuPeso>1</meuPeso>
        </tag>
        <tag>
          <name>Pencil</name>
          <tid>126</tid>
          <weight>1</weight>
          <counter>1</counter>
          <repetead>1</repetead>
          <size>106.66666666667</size>
          <meuPeso>2</meuPeso>
        </tag>
        <tag>
          <name>Collage</name>
          <tid>112</tid>
          <weight>1</weight>
          <counter>1</counter>
          <repetead>0</repetead>
          <size>100</size>
          <meuPeso>1</meuPeso>
        </tag>
        <tag>
          <name>Colors</name>
          <tid>127</tid>
          <weight>1</weight>
          <counter>1</counter>
          <repetead>0</repetead>
          <size>100</size>
          <meuPeso>1</meuPeso>
        </tag>
        <tag>
          <name>Graphic</name>
          <tid>109</tid>
          <weight>1</weight>
          <counter>1</counter>
          <repetead>0</repetead>
          <size>100</size>
          <meuPeso>1</meuPeso>
        </tag>
        <tag>
          <name>Photoshop</name>
          <tid>18</tid>
          <weight>1</weight>
          <counter>1</counter>
          <repetead>2</repetead>
          <size>113.33333333333</size>
          <meuPeso>3</meuPeso>
        </tag>
        <tag>
          <name>Course</name>
          <tid>125</tid>
          <weight>1</weight>
          <counter>1</counter>
          <repetead>3</repetead>
          <size>120</size>
          <meuPeso>4</meuPeso>
        </tag>
        <tag>
          <name>PHP</name>
          <tid>110</tid>
          <weight>1</weight>
          <counter>1</counter>
          <repetead>3</repetead>
          <size>120</size>
          <meuPeso>4</meuPeso>
        </tag>
        <tag>
          <name>Reference</name>
          <tid>5</tid>
          <weight>1</weight>
          <counter>1</counter>
          <repetead>1</repetead>
          <size>106.66666666667</size>
          <meuPeso>2</meuPeso>
        </tag>
        <tag>
          <name>Web Design</name>
          <tid>3</tid>
          <weight>1</weight>
          <counter>1</counter>
          <repetead>0</repetead>
          <size>100</size>
          <meuPeso>1</meuPeso>
        </tag>
        <tag>
          <name>Yoga</name>
          <tid>111</tid>
          <weight>1</weight>
          <counter>1</counter>
          <repetead>1</repetead>
          <size>106.66666666667</size>
          <meuPeso>2</meuPeso>
        </tag>
        <tag>
          <name>Collection</name>
          <tid>120</tid>
          <weight>1</weight>
          <counter>1</counter>
          <repetead>1</repetead>
          <size>106.66666666667</size>
          <meuPeso>2</meuPeso>
        </tag>
        <tag>
          <name>Card</name>
          <tid>108</tid>
          <weight>1</weight>
          <counter>1</counter>
          <repetead>0</repetead>
          <size>100</size>
          <meuPeso>1</meuPeso>
        </tag>
        <tag>
          <name>Carvalhar.com</name>
          <tid>124</tid>
          <weight>2</weight>
          <counter>1</counter>
          <repetead>1</repetead>
          <size>106.66666666667</size>
          <meuPeso>2</meuPeso>
        </tag>
      </tags>

       

       

      it also has 2 other files, it will be required to meet my requirements

        • 1. Re: how to use navigateToUrl for below example..also when i export it its showing a blank page
          archemedia Level 4

          event.item.@data.toString()

           

          What does this return? I can only find one data tag in you xml (the first node).

           

          Dany

          • 2. Re: how to use navigateToUrl for below example..also when i export it its showing a blank page
            shashank543233 Level 1

            i already did convert that to a string.. and i am getting some errors..call to undefined urlrequest ...

              And i figured out that first i will deal with one node and then generalize it

            • 3. Re: how to use navigateToUrl for below example..also when i export it its showing a blank page
              seRajan Level 1

              hi,

               

                   Please check the "event" and "item".

               

               

              private function mouseUpHandler( e:MouseEvent ):void {
                         
                          var objURLReq:URLRequest = new URLRequest(event.item.@data.toString());
                         navigateToURL(objURLReq, "_self");
                      }

               

              from this function argument is "e", but your are handling "event". another thing is "item" not in MouseEvent property. Xml Load functions not avail in this code.

               

              - Rajan

              • 4. Re: how to use navigateToUrl for below example..also when i export it its showing a blank page
                shashank543233 Level 1

                yes, i have taken care of event but could u tell what to do with item...i am new to coding and i am finding it difficult to correct...would be great if u elaborate

                • 5. Re: how to use navigateToUrl for below example..also when i export it its showing a blank page
                  archemedia Level 4

                  Can you debug your application and put a breakpoint in your function. Then post an image of the event object (e)?

                  What is causing the event? Is it a datagrid?

                   

                  Dany

                  • 6. Re: how to use navigateToUrl for below example..also when i export it its showing a blank page
                    shashank543233 Level 1

                    no ,its not a data grid... actually its a tag cloud...xml files are used to name them and i have a file name tagcloud.as where all the stuff is there..i will paste that....

                    package
                    {
                        import flash.events.Event;
                        import flash.events.MouseEvent;
                        import flash.net.URLLoader;
                       
                        import mx.containers.Canvas;
                        import mx.core.UIComponent;
                        import mx.rpc.events.ResultEvent;
                        import mx.rpc.http.HTTPService;

                     

                        public class TagCloud extends Canvas    {
                           
                            private var radius:Number;
                            private var mcList:Array;
                            private var dtr:Number;
                            private var d:Number;
                            private var sa:Number;
                            private var ca:Number;
                            private var sb:Number;
                            private var cb:Number;
                            private var sc:Number;
                            private var cc:Number;
                            private var originx:Number;
                            private var originy:Number;
                            private var tcolor:Number;
                            private var hicolor:Number;
                            private var tcolor2:Number;
                            private var tspeed:Number;
                            private var distr:Boolean;
                            private var lasta:Number;
                            private var lastb:Number;
                            private var holder:UIComponent;
                            private var active:Boolean;
                            private var myXML:XML;
                            private var myLoader:URLLoader;
                            private var widthTag:Number;
                            private var heightTag:Number;
                            //this number changes if it's elliptical or spherical
                            [Bindable]
                            public var howElliptical:Number=1;
                           
                            public function TagCloud(){       
                                goTagGo();
                            }
                            public function goTagGo():void {
                                tspeed = 1;
                                distr = true; //distribute the words or not
                                // load XML file
                                var service : HTTPService = new HTTPService();
                                //the url for the tag xml...
                                  service.url = 'tagcloud.xml';
                                   service.addEventListener(ResultEvent.RESULT, xmlLoaded);
                                  service.send();
                            }
                            private function xmlLoaded(e:Event):void {
                                trace("xml loaded");
                               
                                //define sizes
                                widthTag = this.width - this.width/10;
                                heightTag = this.height - this.height/10;

                     

                                //load the xml info using E4X
                                var result:* = HTTPService(e.target).lastResult;
                                if(result.tags){               
                                    // set some vars
                                    radius = 150;
                                    dtr = Math.PI/180;
                                    d=300;
                                    sineCosine( 0,0,0 );
                                    mcList = [];
                                    active = false;
                                    lasta = 1;
                                    lastb = 1;
                                    // create holder mc, center it       
                                    holder = new UIComponent();
                                    addChild(holder);
                                    resizeHolder();
                                    // loop though them to find the smallest and largest 'tags'
                                    var largest:Number = 0;
                                    var smallest:Number = 9999;
                                   
                                        for each (var tag:Object in result.tags.tag )  {
                                            largest = Math.max( largest, tag.meuPeso );
                                            smallest = Math.min( smallest, tag.meuPeso );
                                       
                                            // create movie clips                   
                                            var perc:Number = ( smallest == largest ) ? 1 : (tag.meuPeso-smallest) / (largest-smallest);
                                            var col:Number = 0x000000;
                                            var hicol:Number = 0xFFEF07;
                                           
                                            var mc:Tag = new Tag( tag, col, hicol );
                                            holder.addChild(mc);
                                            holder.x = (this.widthTag/2) - (holder.width/2);
                                            holder.y = (this.heightTag/2) - (holder.height/2);
                                            // store reference
                                            mcList.push( mc );
                                        }
                           
                                        // distribute the tags on the sphere
                                        positionAll();
                                        // add event listeners
                                        this.addEventListener(Event.ENTER_FRAME, updateTags);
                                        parent.addEventListener(MouseEvent.ROLL_OUT, mouseExitHandler);
                                        parent.addEventListener(MouseEvent.MOUSE_MOVE, mouseMoveHandler);
                                        this.addEventListener(Event.RESIZE, resizeHandler);
                                }
                            }

                     

                            private function updateTags( e:Event ):void {
                                var a:Number;
                                var b:Number;
                                if( active ){
                                    a = (-Math.min( Math.max( holder.mouseY, -250 ), 250 ) / 150 ) * tspeed;
                                    b = (Math.min( Math.max( holder.mouseX, -250 ), 250 ) /150 ) * tspeed;
                                } else {
                                    a = lasta * 0.98;
                                    b = lastb * 0.98;
                                }
                                lasta = a;
                                lastb = b;
                                // if a and b under threshold, skip motion calculations to free up the processor
                                if( Math.abs(a) > 0.01 || Math.abs(b) > 0.01 ){
                                    var c:Number = 0;
                                    sineCosine( a, b, c );
                                    // bewegen van de punten
                                    for( var j:Number=0; j<mcList.length; j++ ) {
                                        // multiply positions by a x-rotation matrix
                                        var rx1:Number = mcList[j].cx;
                                        var ry1:Number = mcList[j].cy * ca + mcList[j].cz * -sa;
                                        var rz1:Number = mcList[j].cy * sa + mcList[j].cz * ca;
                                        // multiply new positions by a y-rotation matrix
                                        var rx2:Number = rx1 * cb + rz1 * sb;
                                        var ry2:Number = ry1;
                                        var rz2:Number = rx1 * -sb + rz1 * cb;
                                        // multiply new positions by a z-rotation matrix
                                        var rx3:Number = rx2 * cc + ry2 * -sc;
                                        var ry3:Number = rx2 * sc + ry2 * cc;
                                        var rz3:Number = rz2;
                                        // set arrays to new positions
                                        mcList[j].cx = rx3;
                                        mcList[j].cy = ry3;
                                        mcList[j].cz = rz3;
                                        // add perspective
                                        var per:Number = d / (d+rz3);
                                        // setmc position, scale, alpha
                                        mcList[j].x = (howElliptical * rx3 * per) - (howElliptical*2); //original is mcList[j].x = rx3 * per;
                                        mcList[j].y = ry3 * per;
                                        mcList[j].scaleX = mcList[j].scaleY =  per;
                                        mcList[j].alpha = per/2;
                                    }
                                    depthSort();
                                }
                            }
                           
                            private function depthSort():void {
                                mcList.sortOn( "cz", Array.DESCENDING | Array.NUMERIC );
                                var current:Number = 0;
                                for( var i:Number=0; i<mcList.length; i++ ){
                                    holder.setChildIndex( mcList[i], i );
                                    if( mcList[i].active == true ){
                                        current = i;
                                    }
                                }
                                holder.setChildIndex( mcList[current], mcList.length-1 );
                            }
                           
                            /* See http://blog.massivecube.com/?p=9 */
                            private function positionAll():void {       
                                var phi:Number = 0;
                                var theta:Number = 0;
                                var max:Number = mcList.length;
                                // mix up the list so not all a' live on the north pole
                                mcList.sort( function():Number{ return Math.random()<0.5 ? 1 : -1; } );
                                // distibute
                                for( var i:Number=1; i<max+1; i++){
                                    if( distr ){
                                        phi = Math.acos(-1+(2*i-1)/max);
                                        theta = Math.sqrt(max*Math.PI)*phi;
                                    }else{
                                        phi = Math.random()*(Math.PI);
                                        theta = Math.random()*(2*Math.PI);
                                    }
                                    // Coordinate conversion
                                    mcList[i-1].cx = radius * Math.cos(theta)*Math.sin(phi);
                                    mcList[i-1].cy = radius * Math.sin(theta)*Math.sin(phi);
                                    mcList[i-1].cz = radius * Math.cos(phi);
                                }
                            }
                           
                       
                            private function mouseExitHandler( e:Event ):void {
                                 active = false;
                                // trace("mouseExitHandler, active: " + active);
                            }
                            private function mouseMoveHandler( e:MouseEvent ):void {
                                active = true;
                                //trace("mouseMoveHandler, active: " + active);
                            }
                            private function resizeHandler( e:Event ):void { resizeHolder(); }
                           
                            private function resizeHolder():void {
                               
                                holder.x = (this.width/2) - (holder.width/2);
                                holder.y = (this.height/2) - (holder.height/2);
                                var scale:Number;
                                if( width > height ){
                                    scale = (height/500);
                                } else {
                                    scale = (width/500);
                                }
                                holder.scaleX = holder.scaleY = scale;
                            }
                           
                            private function sineCosine( a:Number, b:Number, c:Number ):void {
                                sa = Math.sin(a * dtr);
                                ca = Math.cos(a * dtr);
                                sb = Math.sin(b * dtr);
                                cb = Math.cos(b * dtr);
                                sc = Math.sin(c * dtr);
                                cc = Math.cos(c * dtr);
                            }
                           
                           
                            private function getColorFromGradient( perc:Number ):Number {
                                var r:Number = ( perc * ( tcolor >> 16 ) ) + ( (1-perc) * ( tcolor2 >> 16 ) );
                                var g:Number = ( perc * ( (tcolor >> 8) % 256 ) ) + ( (1-perc) * ( (tcolor2 >> 8) % 256 ) );
                                var b:Number = ( perc * ( tcolor % 256 ) ) + ( (1-perc) * ( tcolor2 % 256 ) );
                                return( (r << 16) | (g << 8) | b );
                            }

                     

                           
                        }

                     

                    }

                    • 7. Re: how to use navigateToUrl for below example..also when i export it its showing a blank page
                      seRajan Level 1

                      hi,     I don't unterstand the flow, Could yousend the your package?- Rajan

                      • 9. Re: how to use navigateToUrl for below example..also when i export it its showing a blank page
                        seRajan Level 1

                        hi,

                         

                         

                        I attached updated source file. Please check and give the commants.

                         

                         

                        I updated the XML file, added the data node for url like.

                         

                        MouseUp handler updated in Tag.as file.

                         

                         

                         

                        - Rajan

                        • 10. Re: how to use navigateToUrl for below example..also when i export it its showing a blank page
                          shashank543233 Level 1

                          thanks man!!!! that code worked like a charm:)...but still i face a small problem...when i export , i get a internal build error and and when i ignore that and export i cant view the output in either swf or html file