flex4 - How to display custom player controls on youtube chromeless player using Flash builder 4.6? -


i have view component initialises youtube cloud api using "http://www.youtube.com/apiplayer?version=3&modestbranding=1" url , plays video fullscreen. has play, pause , progress bar under s:actioncontent, trying put "rewind", "play/pause", "forward" , interactive progress bar on top of chromeless player (transparent popup image buttons same), below image. enter image description here

my view component initialises youtube api not have items. (removed s:actioncontent try out popup)

<s:view xmlns:fx="http://ns.adobe.com/mxml/2009"      xmlns:s="library://ns.adobe.com/flex/spark" title="youtubevideoplay" viewactivate="init()" >     <fx:script source="youtubeplayer.as"/>     <fx:script>         <![cdata[             //navigator.addeventlistener(touchevent.touch_begin,showplayercontrol);     how add event listener on youtube player?             public function showplayercontrol():void{                 popupmanager.addpopup(playercontrols,player);             }         ]]>     </fx:script>     <fx:declarations>         <!-- place non-visual elements (e.g., services, value objects) here -->     </fx:declarations> </s:view> 

need popup manager appear on top of chromeless player, when user taps on playing video.

<s:panel xmlns:fx="http://ns.adobe.com/mxml/2009"       xmlns:s="library://ns.adobe.com/flex/spark" width="400" height="300">     <fx:script source="../youtubeplayer.as"/>     <fx:declarations>         <!-- place non-visual elements (e.g., services, value objects) here -->     </fx:declarations>     <fx:style>         @namespace s "library://ns.adobe.com/flex/spark";         global         {             modal-transparency: 0.0;             modal-transparency-color: white;             modal-transparency-blur: 0;         }     </fx:style>     <fx:script>         <![cdata[                            import mx.managers.popupmanager;             /*[bindable][embed(source="view/assets/images/play32.png")]             public static var iconplay : class;*/             [bindable][embed(source="view/assets/images/pause32.png")]             public static var iconpause : class;             [bindable][embed(source="view/assets/images/forward32.png")]             public static var iconforward : class;             [bindable][embed(source="view/assets/images/rewind32.png")]             public static var iconrewind : class;                            //addeventlistener(flexmouseevent.mouse_down_outside,removeplayercontrols);             /*private function removeplayercontrols(event:flexmouseevent):void {             popupmanager.removepopup(this);             }*/                          public function closeandbackup():void {                 dispose();                 navigator.popview();                                             }             public function initandplay():void {                                 player.playvideo();              }                            private var _duration:string = "";              [bindable]             public function duration():string {                 return _duration;             }                            public function set duration(val:string):void {                 _duration = val;              }             protected function ytvideoslider_changehandler(event:event):void             {                 // todo auto-generated method stub                 trace(event.currenttarget.value);                 player.seekto(event.currenttarget.value,true);                           }         ]]>          </fx:script>     <s:vgroup>         <s:hgroup>             <s:layout>                 <s:horizontallayout paddingtop="10" paddingleft="10"/>             </s:layout>             <s:hslider id="ytvideoslider"                         livedragging="true"                        datatipprecision="1"                        maximum="{duration}"                        change="ytvideoslider_changehandler(event)"/>             <s:label text="{math.round(ytvideoslider.value)}"/>         </s:hgroup>         <s:button icon="{iconrewind}" click="player.playvideo()"/>         <s:button icon="{iconpause}" click="player.pausevideo()"/>         <s:button icon="{iconforward}" click="closeandbackup()"/>     </s:vgroup> </s:panel> 

any appreciated. :)

i have started flash builder's spark components, pardon me if question lame.

or there link/tutorial available place player controls on top of chromeless youtube player?

update: able solve problem, , provided solution too

you should able add click listener entire view. while have never used api before, imagine this:

<s:view xmlns:fx="http://ns.adobe.com/mxml/2009"  xmlns:s="library://ns.adobe.com/flex/spark" title="youtubevideoplay" viewactivate="init()" click="showplayercontrol()">  <fx:script source="youtubeplayer.as"/> <fx:script>     <![cdata[         public function showplayercontrol():void{             popupmanager.addpopup(playercontrols,player);         }     ]]> </fx:script> <fx:declarations>     <!-- place non-visual elements (e.g., services, value objects) here --> </fx:declarations> 


Comments

Popular posts from this blog

Why does Ruby on Rails generate add a blank line to the end of a file? -

keyboard - Smiles and long press feature in Android -

node.js - Bad Request - node js ajax post -