3 Replies Latest reply on Dec 22, 2010 6:38 AM by kglad

    Slideshow has pics and texts out of sync

    kam5FCC Level 1

      Hi - just starting AS and tried making a slide show for sponsors of our sports site.  Basically it reads an XML file that contains the sponsors logos and blurbs loads them into MCs and slides them rotating.  The XML has 14 entries that are like ...

      <slideshow width="150" height="150" speed="10">
      <image url="sponsors/PlayItAgainSports150.jpg" title="Play It Again Sports"/>
      <image url="sponsors/laidlaw.png" title="Planning and Investments"/>
      ....
      <image url="sponsors/gorham.png" title="Construction/Remodelling"/>
      </slideshow>
      

      My Problem is that when the webpage loads and the slideshow rotates and sometimes the titles and pages don't mesh.  The title for one doesn't go with the logo.  It only seems to happen when its on the webpage, not in my Flash Devel prog.  Can it be a problem downloading the 25-50KB files?  Can anyone look at the code and see if I'm doing anything glaringly wrong.

      import mx.transitions.Tween;
      import mx.transitions.easing.*;
      import ascb.util.NumberUtilities;
      
      var myShowXML = new XML();
      myShowXML.ignoreWhite = true;
      //myShowXML.load("sponsors/slideshow.xml");
      myShowXML.load("slideshow.xml");
      
      myShowXML.onLoad = function() {
          trace("In onLoad");
          _root.myWidth = myShowXML.firstChild.attributes.width;
          _root.myHeight = myShowXML.firstChild.attributes.height;
          _root.mySpeed = myShowXML.firstChild.attributes.speed;
      
          _root.myImages = myShowXML.firstChild.childNodes;
          _root.myImagesNo = myImages.length;
      
          createContainer();
          callImages();
      };
      
      function createContainer() {
          trace("In createContainer");
          _root.createEmptyMovieClip("myContainer_mc",_root.getNextHighestDepth ());
      
          myContainer_mc.lineStyle(5,0x000000,100);
          myContainer_mc.lineTo(_root.myWidth,0);
          myContainer_mc.lineTo(_root.myWidth,_root.myHeight);
          myContainer_mc.lineTo(0,_root.myHeight);
          myContainer_mc.lineTo(0,0);
      
          myContainer_mc._x = (Stage.width-myContainer_mc._width)/2 + 2;
          myContainer_mc._y = (Stage.height-myContainer_mc._height)/2 - 10;
          trace("Leaving createContainer")
      }
      
      function callImages() {
          trace("In callImages");
          _root.myMCL = new MovieClipLoader();
          _root.myPreloader = new Object();
          _root.myMCL.addListener(_root.myPreloader);
      
      trace("Setting cips array");
          _root.myClips_array = [];
      
          _root.myPreloader.onLoadStart = function(target) {
              _root.createTextField("myText_txt",_root.getNextHighestDepth(),0,0,10 0,20);
              _root.myText_txt._x = (Stage.width-_root.myText_txt._width)/2;
              _root.mtText_txt._y = (Stage.height-_root.myText_txt._height)/2;
              _root.myText_txt.autoSize = "center";
              //_root.myText_txt.autoSize = TextFieldAutoSize.CENTER;
          };
      
          _root.myPreloader.onLoadProgress = function(target) {
              _root.myText_txt.text = "Loading..."+_root.myClips_array.length+"/"+_root.myImagesNo+" Completed";
          };
      
          _root.myPreloader.onLoadComplete = function(target) {
              _root.myClips_array.push(target);
              target._alpha = 0;
              
              trace ("outside if");
              if (_root.myClips_array.length == _root.myImagesNo) {
                  _root.myText_txt._y = myContainer_mc._y+myContainer_mc._height;
                  trace("In if");
                  i = Math.random();
                  i = int(i * _root.myImagesNo);
                  trace("I is " + i + "# is " + _root.myImagesNo);
                  _root.target_mc = i;
                  moveSlide();
                  myShowInt = setInterval(moveSlide, (_root.mySpeed*1000)+1000);
              }
             
          };
          
          //current_mc.addEventListener(MouseEvent.CLICK, onClick);
          
      trace("Getting Images with "+_root.myImagesNo);
          for (i=0; i<_root.myImagesNo; i++) {
              trace("Image #"+i+" with URL:"+_root.myImages[i].attributes.url);
              temp_url = _root.myImages[i].attributes.url;
              temp_mc = myContainer_mc.createEmptyMovieClip(i, myContainer_mc.getNextHighestDepth());
      
              _root.myMCL.loadClip(temp_url,temp_mc);
          }
      }
      
      function onClick() {
          trace ("In click");
          getURL(_root.myImages[target_mc].attributes.address);
      }
      
      function moveSlide() {
          trace("In slide");
          current_mc = _root.myClips_array[_root.target_mc];
          trace("target_mc is " + _root.target_mc);
          new Tween(current_mc, "_alpha", Strong.easeOut, 100, 0, 1, true);
          _root.target_mc++;
          trace("new target_mc is " + _root.target_mc);
      
          if (_root.target_mc>=_root.myImagesNo) {
              _root.target_mc = 0;
          }
      
          _root.myText_txt.text = _root.myImages[target_mc].attributes.title;
          //_root.myText_txt.width = 50;
          var txtFormat:TextFormat = new TextFormat();
          txtFormat.font = "Helvetica";
          txtFormat.color = 0xCC0000;
          txtFormat.bold = true;
          txtFormat.url = "http://www.cnn.com";
              
          _root.myText_txt.setTextFormat(txtFormat);
          trace("Type is "+_root.myImages[target_mc].attributes.type+" with "+_root.myImages[target_mc].attributes.address);
          next_mc = _root.myClips_array[_root.target_mc];
          next_mc.go
          new Tween(next_mc, "_alpha", Strong.easeOut, 0, 100, 1, true);
      }
      


      Thanks

      Kevin

        • 1. Re: Slideshow has pics and texts out of sync
          kglad Adobe Community Professional & MVP

          that's usually caused by an asynchronous operation like loading images in a for-loop and expecting them to complete loading in the same order in which they started loading (in the for loop).

          • 2. Re: Slideshow has pics and texts out of sync
            kam5FCC Level 1

            So how could I go about pre-loading the pics as the predecessors are being shown?

             

            Thanks,

            Kevin

            • 3. Re: Slideshow has pics and texts out of sync
              kglad Adobe Community Professional & MVP

              you can load your images sequentially:

               

              _root.myPreloader.onLoadComplete = function(target) {
                      _root.myClips_array.push(target);
                      // do whatever the loadIndex-th image loaded
                      loadIndex++;
                      if(loadIndex<_root.myImagesNo){
                          loadF();
                      }
                  };
                  loadIndex=0;
                  //current_mc.addEventListener(MouseEvent.CLICK, onClick);
              }
              function loadF(){

               

                      temp_url = _root.myImages[loadIndex].attributes.url;
                      temp_mc = myContainer_mc.createEmptyMovieClip(loadIndex, myContainer_mc.getNextHighestDepth());

               

                      _root.myMCL.loadClip(temp_url,temp_mc);
                 
              }

              1 person found this helpful