/ Home | Support | ShowRoom | Swiff Player Developer | Simple Example
Swiff Player Developer Example

ActionScript Example

Download the PowerPoint Presentation and see it in action

Download source code and resources

//
// This example demonstrates how to create a simple picture slide show
// in ActionScript using ShowRoom API and PowerPoint effects.
//
// At startup, this Flash will display the first picture. On each
// click during the PowerPoint Slide Show (using the mouse, or Space key,
// Right key, or a PowerPoint Remote), a new picture will be displayed.
// We synchronize the current picture index with the current effect index.
//
// The code below is complete and can even be run outside of PowerPoint.
//
package {
 
  import flash.display.Sprite;
  import flash.display.Bitmap;
  import flash.display.StageScaleMode;
  import flash.display.StageAlign;
  import flash.events.MouseEvent;
 
  import flash.events.Event;
  import flash.utils.getTimer;
 
  import com.globfx.showroom.ShowRoom;
  import com.globfx.showroom.SwiffPlayerShape;
  import com.globfx.showroom.IShowRoomContent;
 
  /////////////////////////////////////////////////////////////////////////////
 
  // When inserting this Flash in PowerPoint, don't forget to enable
  // ShowRoom Effects in the "Flash" Ribbon Tab. (or in the "Developer" Tab in the
  // properties dialog box)
  // Then enter the number of effects needed.
  // See http://www.globfx.com/support/showroom/flashdev/effects.php
 
  [SWF(backgroundColor="#000000", frameRate="40", quality="HIGH", width="850", height="400")]
  public class ShowRoomSlideShow extends Sprite implements IShowRoomContent
  {
    // This picture slide show is displaying 4 pictures, therefore
    // we need 4 ShowRoom effects that will generate 4 "On Click" PowerPoint effects
    //
    // We declare 4 ShowRoom Effects in the PowerPoint ShowRoom UI
    // ("Flash" Ribbon Tab or "Developer" Tab in the properties dialog box)
    [Embed(source="photo1.jpg")]
    static public var Photo1 : Class;
    [Embed(source="photo2.jpg")]
    static public var Photo2 : Class;
    [Embed(source="photo3.jpg")]
    static public var Photo3 : Class;
    [Embed(source="photo4.jpg")]
    static public var Photo4 : Class;
   
    private var showroom : ShowRoom = null;
   
    private var center : Sprite = null;
    private var holder : Sprite = null;
   
    private var bitmaps : Array = null;
    private var delta : int = 1000;
    private var margin : int = 0; //500;
   
    private var pict_index : int = 0;
   
    private var content_width : Number = 0;
    private var content_height : Number = 0;
   
    public function ShowRoomSlideShow()
    {
      try
      {
        showroom= ShowRoom.create(this);
        if( showroom != null )
        {
          // we are running in PowerPoint
          // ShowRoom will call ShowRoomContent_SetSize() to resize us
          // Subscribe to the EFFECT_CHANGED event to walk through the picture slide show
          showroom.shape.addEventListener( SwiffPlayerShape.EFFECT_CHANGED, on_showroom_effect_changed );
        }
        else
        {
          // we are running outside of PowerPoint
          if( stage == null )
          {
            // still not added to stage, wait for it to be added to the stage
            this.addEventListener( Event.ADDED_TO_STAGE, on_added_to_stage );
          }
        }
       
        // create the Bitmap objects
       
        bitmaps= new Array();
        bitmaps.push( new Photo1() );
        bitmaps.push( new Photo2() );
        bitmaps.push( new Photo3() );
        bitmaps.push( new Photo4() );
       
        center= new Sprite();
        holder= new Sprite();
       
        var i : int;
        var x : int = 0;
        for( i= 0; i < bitmaps.length; ++i )
        {
          var bm : Bitmap = bitmaps[i];
         
          var scale : Number = delta / bm.bitmapData.width;
         
          bm.smoothing= true;
          bm.scaleX= scale;
          bm.scaleY= scale;
         
          bm.x= x - bm.width/2;
          bm.y= -bm.height/2;
         
          holder.addChild(bm);
         
          x += delta + margin;
        }
       
        this.addChild(center);
        center.addChild(holder);
       
        holder.alpha= 0;
        fadein_start_anim();
       
        pict_index= 0;
       
        if( showroom == null && stage != null )
        {
          // we are not running in PowerPoint, layout now
          layout_from_stage();
        }
       
        this.addEventListener( MouseEvent.MOUSE_UP, on_mouse_up );
       
        if( showroom != null )
        {
          // we could already be in a further effect (not 0)
          // this call is not always necessary, but it guarantees
          // proper synchronization between the number of executed
          // PowerPoint effects and our current displayed picture
          show_picture(showroom.shape.effectIndex);
        }
      }
      catch( e: Error )
      {
      }
    }
   
    // if not running in PowerPoint
    private function on_added_to_stage( e: Event ) : void
    {
      stage.scaleMode= StageScaleMode.NO_SCALE;
      stage.align= StageAlign.TOP_LEFT;
      stage.addEventListener( Event.RESIZE, on_stage_resize );
      layout_from_stage();
    }
   
    // if not running in PowerPoint
    private function on_stage_resize( e : Event ) : void
    {
      layout_from_stage();
    }
   
    // if not running in PowerPoint
    private function layout_from_stage() : void
    {
      content_width= stage.stageWidth;
      content_height= stage.stageHeight;
      layout();
    }
   
    // called by ShowRoom to resize this Flash
    public function setShowRoomContentSize( newWidth : Number ) : void
    {
      content_width= newWidth;
      content_height= newHeight;
      layout();
    }
   
    // In FullScreen mode, we are responsible in mouse events handling
    private function on_mouse_up( e : MouseEvent ) : void
    {
      if( e.shiftKey )
      {
        // Shift+MouseUp = goto previous effect
        if( showroom != null )
        {
          // ShowRoom will call us back on on_showroom_effect_changed() or will close us
          showroom.slideShow.previous();
        }
        else
        {
          // if not running in PowerPoint
          show_picture( pict_index-1 );
        }
        return;
      }
     
      // MouseUp = goto next effect      
      if( showroom != null )
      {
        // ShowRoom will call us back on on_showroom_effect_changed() or will close us
        showroom.slideShow.next();
      }
      else
      {
        // if not running in PowerPoint
        show_picture( pict_index+1 );
      }
    }
   
    private function layout() : void
    {
      if( center == null )
        return;
     
      center.x= content_width / 2;
      center.y= content_height / 2;
     
      var scale : Number = content_width / delta;
      center.scaleX= scale;
      center.scaleY= scale;
    }
   
    private function on_showroom_effect_changed( e : Event ) : void
    {
      if( showroom.shape.effectIndex == -1 && pict_index == 0 && !showroom.shape.fullScreen )
      {
        // optional trick to avoid the Poster state when the user walks back
        // through effects in the same slide
        showroom.slideShow.previous();
        return;
      }
     
      show_picture(showroom.shape.effectIndex);
    }
   
    // show a new picture from the slide show
    private function show_picture( new_pict_index : int ) : void
    {
      if( new_pict_index < 0 || new_pict_index >= bitmaps.length )
        return;
     
      if( pict_index == new_pict_index )
        return;
     
      pict_index= new_pict_index;
      anim_old_x= holder.x;
      anim_new_x= -pict_index * (delta + margin);
     
      start_anim();
    }
   
    private var anim_duration : int = 300; // milliseconds
    private var anim_start_time : int = -1;
    private var anim_old_x : Number = 0;
    private var anim_new_x : Number = 0;
   
    private function on_enter_frame( e : Event ) : void
    {
      var dt : int = getTimer() - anim_start_time;
      if( dt >= anim_duration )
      {
        holder.x= anim_new_x;
        stop_anim();
        return;
      }
     
      var t : Number(dt) / anim_duration;
      t= t*(2-t); // ease out
      holder.x= (1-t)*anim_old_x + t*anim_new_x;
    }
   
    private function start_anim() : void
    {
      stop_anim();
      if( anim_new_x == anim_old_x )
        return;
      this.addEventListener( "enterFrame", on_enter_frame );
      anim_start_time= getTimer();    
    }
   
    private function stop_anim() : void
    {
      if( anim_start_time == -1 )
        return;
      this.removeEventListener( "enterFrame", on_enter_frame );
      anim_start_time= -1;
    }
   
   
    private var fadein_anim_duration : int = 300; // milliseconds
    private var fadein_anim_start_time : int = -1;
   
    private function fadein_start_anim() : void
    {
      fadein_stop_anim();
      this.addEventListener( "enterFrame", fadein_on_enter_frame );
      fadein_anim_start_time= getTimer();    
    }
   
    private function fadein_stop_anim() : void
    {
      if( fadein_anim_start_time == -1 )
        return;
      this.removeEventListener( "enterFrame", fadein_on_enter_frame );
      fadein_anim_start_time= -1;
    }
   
    private function fadein_on_enter_frame( e : Event ) : void
    {
      var dt : int = getTimer() - fadein_anim_start_time;
      if( dt >= fadein_anim_duration )
      {
        holder.alpha= 1;
        fadein_stop_anim();
        return;
      }
     
      holder.alpha= Number(dt) / fadein_anim_duration;
    }
  }
 
  /////////////////////////////////////////////////////////////////////////////
}
 
Home  |  Swiff Chart  |  Swiff Chart Generator  |  ShowRoom  |  Swiff Saver  |  SWF Extractor  |  Swiff Player