Investigate into Portfolio Multi Media Tab Gallery - 2

FileViewer

Beside from init(), it also has public method show(), hide() and run() for its parent. But, hide() is not called by its parent, although it is public, it's just called by its own methods so far. 

run() has a parameter, which is the data of the item to present: 

fileViewer.run(e.xmlData);

it may be called by its parent, or get called by its own method, to handle the clicks on prev and next buttons. So its parent is responsible to call its show() and run(), and it handles all others on its own.

There is another key method: resetAll(), there it reset every variable to their init states. So before doing anything, run() calls resetAll() firstly, and then set up the data, it grabs the siblings of the current passed data item, by using XML utility, so actually, the global data storage is still in XML format, it sets up nextXmlData and prevXmlData for its prev and next button handling and finally, it calles runFile(). runFile() is to executing the render of the media file, it plays the video/audio, or loads the image.

In addition, all the logic that user interact with the video/audio control panel is set up within this class, and the author did that for substantial reasons: 

All the visual elements are held by FileViewer, and it certainly be responsible to show/remove them, and the video playback and audio playback share the same control UIs, which is referenced by controlsMc; and for the cases of flash, image and audio it use the same loader instance to load them, that is where the program is smart. Because the control logic of playing video and audio are similar, they inherit the same base class: PlaybackController, AudioPlaybackController and VideoPlaybackController are its inheritors. Then in FileViewer,apc and vpc have same handlers for the same event, and that simplify the code heavily.

Highlights:

1.In the following block:

case FLASH_FILE: 
{
	flashInst = displayMc.addChild(ldr.content) as MovieClip;
	ldr.content.scrollRect = new Rectangle(0, 0, origW, origH);
	break;
}

The scrollRect property is used to set a region of a displayObject to display.

http://gskinner.com/blog/archives/2006/11/understanding_d.html

2. After loading the images, there is a invoke to BitmapData.unlock():

case AUDIO_FILE:
{
	var bd:BitmapData = new BitmapData(origW, origH, true, 0);
	bd.draw(ldr.content);
	bd.unlock();
	imageInst = displayMc.addChild(new Bitmap(bd, PixelSnapping.AUTO, TabsList.settings.imageSmoothing)) as Bitmap;
	imageInst.cacheAsBitmap = true;
	
	break;
}	

3. call Event.updateAfterEvent()

private function overlayMc_mouseMoveHandler(e:MouseEvent = null):void 
{
	var closeTipX:Number = Math.max(0, Math.min(overlayMc.width - closeTipBg.width, this.mouseX + TabsList.settings.closeTipXOffset));
	var closeTipY:Number = this.mouseY + TabsList.settings.closeTipYOffset;
	
	if (closeTipMc.x != closeTipX || closeTipMc.y != closeTipY)
	{
		closeTipMc.x = closeTipX;
		closeTipMc.y = closeTipY;
		
		if(e) e.updateAfterEvent();
	}
}

http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flash/events/MouseEvent.html#updateAfterEvent()

http://drkgodz.hobo-studios.org/blog/?p=132

http://www.5uflash.com/flashjiaocheng/Flashyingyongkaifa/5663.html

4. change display mode:

try { 
stage["fullScreenSourceRect"] = new Rectangle(fsRectOrig.x, fsRectOrig.y, displayMc.width, displayMc.height); 
} 
catch(error:Error) { }

Here is some references about it:

http://livedocs.adobe.com/flash/9.0_cn/ActionScriptLangRefV3/flash/display/BitmapData.html#lock()

http://flexcomps.wordpress.com/2008/10/10/improve-performance-with-bitmapdatalock/

http://www.daylyn.org/post/108.html

Aside from that, the program set up handling logic for stage-resize event at different points, through the proxy of stage-StageLayout, TabsList, ThumbsGrid and FileViewer they have their own handlers and set up separate listeners to that event:

Titlebar

Some where, there are lines: 

if (base == null)
{
	base = { time: TabsList.settings.titleChangeTime, transition: TabsList.settings.titleChangeEasing };
}

and some where below, there is:

Tweener.addTween(newLabel, { alpha: 1, base: base } );
Tweener.addTween(crtLabel, { alpha: 0, base: base, onComplete: removeLabel, onCompleteParams: [crtLabel] } );

The base object can be combined with literal express of objects.

ProgressBar

This class has complex UI logic, since it has progress bar:

it would be updated as long as the media file is playing;

it can be dragged to step forward/backward the playing of the media;