I made this component with that in mind. It's a work in progress, but the HSlider code is pretty solid:
<?xml version="1.0" encoding="utf-8"?> <mx:Canvas xmlns:mx = "http://www.adobe.com/2006/mxml"; creationComplete="init()"> <mx:states> <mx:State name="Full Screen"> <mx:SetProperty target="{myVid}" name="width" value="100%"/> <mx:SetProperty target="{myVid}" name="height" value="100%"/> <mx:SetProperty target="{hbox1}" name="width" value="100%"/> <mx:SetProperty target="{hbox1}" name="height" value="100%"/> <mx:RemoveChild target="{hSliderScale}"/> <mx:SetProperty target="{button1}" name="label" value="Close Full Screen"/> <mx:SetStyle target="{hbox1}" name="horizontalAlign" value="center"/> <mx:SetStyle target="{hbox1}" name="paddingTop" value="5"/> </mx:State> <mx:State name="*"/> </mx:states> <mx:Script> <![CDATA[ import mx.events.CuePointEvent; import mx.events.*; import mx.managers.PopUpManager; private static var SCRUB_POINT:Number; private static var DURATION:Number; private static var IS_PAUSED:Boolean; public static var CURRENT_TIME:Number; private var playheadPos:Number = 0; private var isFullScreen:Boolean; [Bindable] public var screenWidth:Number; [Bindable] public var screenHeight:Number; [Bindable] public var myCuePoints:Array = [ {name:"Cue Point 1",time:2}, {name:"Cue Point 2",time:4}, {name:"Cue Point 3",time:6} ] private function init():void { myVid.addEventListener(VideoEvent.PLAYHEAD_UPDATE, progressHandler); screenWidth = 320; screenHeight = 240; isFullScreen = false; } private function cpHandler(event:CuePointEvent):void { //cp.text = ""; //cp.text = "Reached Cuepoint: " + event.cuePointName + " " + String(event.cuePointTime); } private function scrubHandler():void { playheadPos = Math.floor((hSlider.value*.01)*DURATION); if (IS_PAUSED) { IS_PAUSED = false; } } private function progressHandler(event:VideoEvent):void { var progress:Number = event.target.playheadTime; var totalHSliderVal:Number = hSlider.maximum; DURATION = Math.floor(event.target.totalTime); playheadPos = Math.floor(event.target.playheadTime); setTime(); hSlider.value = Math.floor(progress/DURATION*100); } private function onScrubComplete():void { IS_PAUSED = true; myVid.playheadTime = playheadPos; myVid.pause(); } private function onScrubStart():void { IS_PAUSED = true; myVid.pause(); } private function initPlayback(event:VideoEvent) { DURATION = Math.floor(event.target.totalTime); playheadPos = Math.floor((hSlider.value*.01)*DURATION); } private function setTime() { CURRENT_TIME = playheadPos; } private function scaleDisplay() { var percChange:Number = hSliderScale.value; var inc:Number = percChange*.001; var increaseX:Number = inc*myVid.width; var increaseY:Number = inc*myVid.height; if (hSliderScale.value == hSliderScale.minimum) { myVid.width = screenWidth; myVid.height = screenHeight; } else if (hSliderScale.value == hSliderScale.maximum) { myVid.width = myVid.width+100; myVid.height = myVid.height+100; } else { myVid.width = increaseX+screenWidth; myVid.height = increaseY+screenHeight; } hSlider.width = myVid.width; } private function sizePressHandler() { } private function sizeReleaseHandler() { if (hSliderScale.value == 100) { myVid.width = screenWidth; myVid.height = screenHeight; } hSlider.width = myVid.width; } private function toggleFullScreen() { if (!isFullScreen) { currentState = "Full Screen"; isFullScreen = true; } else { currentState = "*"; isFullScreen = false; } } ]]> </mx:Script> <mx:Box id="pnl_main" height="100%" width="100%" horizontalAlign="center" textAlign="center" paddingTop="0" paddingLeft="0" paddingRight="0" paddingBottom="0"> <mx:Box width="100%" id="box1" horizontalAlign="center" verticalAlign="top"> <mx:HBox id="hbox1" verticalAlign="middle"> <mx:Button click="toggleFullScreen()" label="Full Screen" id="button1"/> <mx:HSlider id="hSliderScale" minimum="100" maximum="200" value="100" thumbPress="sizePressHandler()" thumbRelease="sizeReleaseHandler()" dataTipPlacement="bottom" tickColor="black" snapInterval="1" tickInterval="20" labels="['100%','200%']" allowTrackClick="true" liveDragging="true" change="scaleDisplay();"/> </mx:HBox> </mx:Box> <mx:VideoDisplay ready="initPlayback(event)" maintainAspectRatio="true" id="myVid" height="{screenHeight}" width="{screenWidth}" source="assets/myVideo.flv" autoPlay="false" cuePointManagerClass="mx.controls.videoClasses.CuePointManager" cuePoints="{myCuePoints}" cuePoint="cpHandler(event);"> </mx:VideoDisplay> <mx:HSlider id="hSlider" width="{screenWidth}" minimum="0" maximum="100" value="0" thumbPress="onScrubStart()" thumbRelease="onScrubComplete()" dataTipPlacement="top" tickColor="black" snapInterval="1" tickInterval="10" allowTrackClick="false" liveDragging="true" change="scrubHandler();"/> <mx:HBox> <mx:Button label="Play" click="myVid.play();"/> <mx:Button label="Pause" click="myVid.pause();"/> <mx:Button label="Stop" click="myVid.stop();"/> </mx:HBox> </mx:Box> </mx:Canvas> On 2/26/07, Alan Rother <[EMAIL PROTECTED]> wrote:
Awesome Thank you. I had searched the archives but didn't find this one. =] -- Alan Rother Adobe Certified Advanced ColdFusion MX 7 Developer
-- Mike ---------- http://www.mikebritton.com http://www.mikenkim.com
