RRGraphic

redrocketcms.components.RRGraphic

 

The graphic renders out any visual assets. It is the essential component for loading and displaying images, video, and audio. It is also flexible enough to load anything anywhere, not just within components.

p id:String

Static. This id is the sybolID linkage necessary for dynamic attachment using attachMovie().

 

Example Usage. Identical functionally to dropping the Graphic component on the stage:

import redrocketcms.components.RRGraphic; this.attachMovie(RRGraphic.id, "graphic", this.getNextHighestDepth());

p onLoaded:Object (When Image Loads)

Write-only. Will accept one of three values:

 

  • "Do Nothing" - does nothing
  • "Play Parent Movie" - plays the parent movie of the instance
  • "onLoaded Function" - requires you to apply a "onInitialized" method to the instance.
// Example #1 using event model (preferred) var graphic:MovieClip; // the instance on the stage graphic.addEventListener("onLoaded", this); function onLoaded (eo) { trace (eo.target);// a reference to graphic } //Example #2 for onLoaded as a function: var graphic:MovieClip; // the instance on the stage graphic.onLoaded = function () { trace ("do something"); } // Example #3 for onLoaded as a String: var graphic:MovieClip; // the instance on the stage function doSomething () { trace ("do something"); } graphic.onLoaded = "doSomething";

p onProgress:Object

Write-only. Either a string of a function in the parent timeline, or a function to execute.

// Example #1 using events (Preferred) var graphic:MovieClip; // the instance on the stage graphic.addEventListener("onProgress", this); function onProgress (eo) { trace (eo.ratio); // will give a number between 0 and 1 } //Example #2 for onProgress as a function: var graphic:MovieClip; // the instance on the stage graphic.onProgress = function (ratio:Number) { trace ("percent loaded = " + Math.round(ratio*100)); } //Example #2 for onProgress as a string: var graphic:MovieClip; // the instance on the stage function doSomething (ratio:Number) { trace ("percent loaded = " + Math.round(ratio*100)); } graphic.onProgress = "doSomething";

p playerType:String (Media Playback Component)

Write-only. Specifies a Component to render multimedia files (video or audio) if any exist. Currently, two are available:

 

"Default" - Does nothing to handle media files

"FLVPlayback" - Macromedia FLV player (no audio)

"MediaPlayback" - Macromedia media player (flv + mp3 but no flash 8 video)

p fitStyle:String (Fit Policy - Sizing)

Write-only. There are 7 differnt sizing methods:

 

  • "Do Nothing" or
  • "nothing" - no resizing, no croping
  • "Constrain to Size (allow bordering)" or
  • "letterBox" - scales the image to fit within the size of the bounding box, while maintaining the aspect ratio. if the resulting image has a dimension smaller than the bounding box, bordering (empty space) will occur.
  • "Constrain to Size (prevent borders)" or
  • "noBorder" - scales the image to fit so that the shorter of the two dimensions will fit the size of the bounding box, maintaining the aspect ratio, while croping the overflow from the other dimension. the result is an image the same size as the bounding box.
  • "Constrain to Size (abandon aspect ratio)" or
  • "fill" - scales the image to fit within the size of the bounding while abandoning the aspect ratio. distortion may occur.
  • "Constrain Width" or
  • "width" - scales the image to fit so that the width dimension will fit the width of the bounding box, maintaining the aspect ratio, while croping the overflow from the other dimension, if is greater than the bounding box’s height.
  • "Constrain Height" or
  • "height" - scales the image to fit so that the height dimension will fit the height of the bounding box, maintaining the aspect ratio, while croping the overflow from the other dimension, if is is greater than the bounding box’s width.
  • "Crop To Size" or
  • "crop" - no scaling, but crops graphic to size of bounding box

p alignment:String (Fit Policy - Alignment)

Write-only. Aligns the loaded image to the bounding box. Note: this will only show results if fitStyle is set to "Crop to Size" or "Do Nothing".

 

possible values are:

 

  • "Top Left" or "tl"
  • "Top" or "t"
  • "Top Right" or "tr"
  • "Left" or "l"
  • "Center" or "c"
  • "Right" or "r"
  • "Bottom Left" or "bl"
  • "Bottom" or "b"
  • "Bottom Right" or "br"

 

p smoothing:Boolean (Size Policy - Smoothing)

The Graphic Class uses the Flash BitmapData Class to render all on-screen static images. The excellent feature of this ability is to ensure pixel-level perfection without any memory overhead. Since your images are dynamically re-sampled on the fly, if you resize images using the component, there will be loss of image data.

 

If you are doing any stretching/scaling/rotating, you should turn this feature on, but for the most part, it should no be necessary.

 

Note: this setting has no effect for absolute URL’s, FLV’s or MP3’s.

p graphicID:String (Graphic ID)

Write-only. If set to "Auto", the graphic will automatically seek out the first Provider class, and retrieve the data from it, otherwise, if you specify an ID, it will use that id when pulling the data.

p source:String (Graphic URL)

Write-only. You can use the Graphic component to load external images not realted to the RRC framework. All you need to do is specify a relative or absolute path to the image, and it will load it in. Setting the source to "" (empty string) or undefined will re-load the automatic graphic from the provider.

m getBounds (mc):Object

This function is helpful if, after the fitting, cropping, and alignment of the loaded image, that the bounding box and the size of the final image do not match. This function returns the bounding box of the actual image instead of the bounding box of the component.

 

mc:MovieClip

the timeline of the movie to assign the coordinate space to.

 

returns Object

Object containing 4 properties: xMin, xMax, yMin, yMax

p FLV_PATH:String (Static)

Macromedia/Adobe can be real idiots. For some reason, the loading rules for FLV’s are different than loading rules for every other type of external file — go figure. For FLV’s the loading is done relatively from the source of the FLV, not from the calling movie.

 

By Default, the FLV_PATH is set to "../../" which means the document root is 2 levels below. Depending on how your site is situated, you may need to change this.

p CACHE_BITMAPS:Boolean (Static)

This global setting turns off the bitmap functions of the Graphic component. It is false by default, but here are some things to consider to help you make a decsion:

  • if caching is on, flash will keep a "copy" of the bitmap in memory. if you are working on a site that has many images, but you dont need the rendering of the images to be lightening-fast, it may cause memory issues and performance issues.
  • if caching is on, re-loading of the same asset will be instantaneous. since it will be pulling from memory, there will be no call to the server, and the image will render instantly.

 

example usage:

import redrocketcms.components.RRGraphic; RRGraphic.CACHE_BITMAPS = false;

p asset:MovieClip

Read-only. The actual internal graphic. This is useful if you are setting up the media players and want to set them up using actionscript.

p type:String

Returns a string representation of the file extension of the graphic. Possible values are:

  • BMP
  • PNG
  • GIF
  • JPEG
  • JPG
  • SWF
  • FLV
  • MP3

Auditable

redrocketcms.classes.collector.Auditable

 

The auditable is the class adds the first set of Component Inspectable properties. Any library-based Components will become a child of this class.

p hSizePolicy:Boolean (Size Policy - Horizontal)

Write-only. The horizontal size policy instructs the component to resize itself to match the maximum width of the component’s containing objects.

p vSizePolicy:Boolean (Size Policy - Vertical)

Write-only. The vertical size policy instructs the component to resize itself to match the maximum height of the component’s containing objects.

Collector

redrocketcms.classes.Collector

 

The Collector class searches for data within it’s heirarcy. It will search for the closeset Provider and store the data.

p data:Object

The data property is a dump of the data that feeds the Component/Class. Typically, this is an object with properties or sub-objects that have exhaustive data realting to the component.

 

To find out what is in the data object you could write something like this:

// where _api is the component/class you are trying to read from. var data = _api.data; for (var prop in data) trace (prop + ": " + data[prop]);

Component

thetainteractive.classes.architecture.Component

 

This is the base class for any class that is a Libray-based component. This class sets up the EventDispatcher, and base functions.

m setSize(width:Number, height:Number):Void

Sets the size of the bounding box of the component.

 

param width:Number

the size, in pixels of the width of the component. pass null if you do not want to set a width.

 

param height:Number

the size, in pixels of the height of the component. pass null if you do not want to set a height.

 

see also:

width

height

p width:Number

Sets the size of the component width in pixels.

p height:Number

Sets the size of the component height in pixels.

m move(x:Number, y:Number):Void

Moves the component.

 

param x:Number

moves the component x pixels horizontally.

 

param y:Number

moves the component y pixels vertically.

m invalidate()

The invalidate function is a very important function. Usually, invalidate is called internally by other methods to redraw the component.

 

However, it is a public method, and by calling invalidate() on any component that uses an invalidation routine essentially "redraws" the entire component.

 

Care should be taken not to continually call invaidate() on any one component on a loop or onEnterFrame() function. invalidate is usually processor and memory intensive for one frame, so be sure to call it when you are sure that you want the component to redraw.

 

Another note is that many of the components are nested within other components, and they are linked together visually. Therefore, calling invalidate() on one component may cause multiple ares to redraw, again, another reason to use sparingly.

e resize()

Event dispatched to listeners when the setSize() method is called. Note: this is also called if the width/height propeties are set.

e move()

Event Dispathced when the component is moved using the move() method.