| 1 | /** |
|---|
| 2 | * Display a controlbar and direct the search externally. |
|---|
| 3 | **/ |
|---|
| 4 | package com.jeroenwijering.views { |
|---|
| 5 | |
|---|
| 6 | |
|---|
| 7 | import com.jeroenwijering.events.*; |
|---|
| 8 | import com.jeroenwijering.player.View; |
|---|
| 9 | import com.jeroenwijering.utils.Stacker; |
|---|
| 10 | import com.jeroenwijering.utils.Strings; |
|---|
| 11 | import flash.display.MovieClip; |
|---|
| 12 | import flash.events.MouseEvent; |
|---|
| 13 | import flash.geom.Rectangle; |
|---|
| 14 | import flash.utils.setTimeout; |
|---|
| 15 | import flash.utils.clearTimeout; |
|---|
| 16 | import fl.transitions.*; |
|---|
| 17 | import fl.transitions.easing.*; |
|---|
| 18 | |
|---|
| 19 | |
|---|
| 20 | public class ControlbarView { |
|---|
| 21 | |
|---|
| 22 | |
|---|
| 23 | /** Reference to the view. **/ |
|---|
| 24 | private var view:View; |
|---|
| 25 | /** A list with all controls. **/ |
|---|
| 26 | private var stacker:Stacker; |
|---|
| 27 | /** Reference to the controlbar **/ |
|---|
| 28 | private var bar:MovieClip; |
|---|
| 29 | /** Save whether sliding is enabled. **/ |
|---|
| 30 | private var sliding:Boolean; |
|---|
| 31 | /** Timeout for hiding the bar. **/ |
|---|
| 32 | private var hiding:Number; |
|---|
| 33 | |
|---|
| 34 | |
|---|
| 35 | /** Constructor. **/ |
|---|
| 36 | public function ControlbarView(vie:View) { |
|---|
| 37 | view = vie; |
|---|
| 38 | view.addControllerListener(ControllerEvent.ITEM,itemHandler); |
|---|
| 39 | view.addControllerListener(ControllerEvent.MUTE,muteHandler); |
|---|
| 40 | view.addControllerListener(ControllerEvent.RESIZE,resizeHandler); |
|---|
| 41 | view.addControllerListener(ControllerEvent.VOLUME,volumeHandler); |
|---|
| 42 | view.addModelListener(ModelEvent.LOADED,loadedHandler); |
|---|
| 43 | view.addModelListener(ModelEvent.STATE,stateHandler); |
|---|
| 44 | view.addModelListener(ModelEvent.TIME,timeHandler); |
|---|
| 45 | bar = view.skin['controlbar']; |
|---|
| 46 | stacker = new Stacker(bar); |
|---|
| 47 | bar.addEventListener(MouseEvent.CLICK, clickHandler); |
|---|
| 48 | bar.timeSlider.addEventListener(MouseEvent.MOUSE_DOWN,timeslideHandler); |
|---|
| 49 | bar.timeSlider.addEventListener(MouseEvent.MOUSE_OUT,outHandler); |
|---|
| 50 | bar.volumeSlider.addEventListener(MouseEvent.MOUSE_DOWN,volumeslideHandler); |
|---|
| 51 | bar.volumeSlider.addEventListener(MouseEvent.MOUSE_OUT,outHandler); |
|---|
| 52 | loadedHandler(new ModelEvent(ModelEvent.LOADED,{loaded:0,total:0})); |
|---|
| 53 | muteHandler(new ControllerEvent(ControllerEvent.MUTE,{state:view.config['mute']})); |
|---|
| 54 | stateHandler(new ModelEvent(ModelEvent.STATE,{newstate:ModelStates.IDLE})); |
|---|
| 55 | timeHandler(new ModelEvent(ModelEvent.TIME,{position:0,duration:0})); |
|---|
| 56 | volumeHandler(new ControllerEvent(ControllerEvent.VOLUME,{percentage:view.config['volume']})); |
|---|
| 57 | }; |
|---|
| 58 | |
|---|
| 59 | |
|---|
| 60 | /** Handle clicks from all buttons **/ |
|---|
| 61 | private function clickHandler(evt:MouseEvent) { |
|---|
| 62 | if(evt.target.name.indexOf('Button') > 0) { |
|---|
| 63 | var str = evt.target.name.substr(0,-6).toUpperCase(); |
|---|
| 64 | view.sendEvent(str); |
|---|
| 65 | } else if (evt.target.name == 'timeSlider') { |
|---|
| 66 | sendScrub(evt); |
|---|
| 67 | } else if (evt.target.name == 'volumeSlider') { |
|---|
| 68 | sendVolume(evt); |
|---|
| 69 | } |
|---|
| 70 | sliding = false; |
|---|
| 71 | }; |
|---|
| 72 | |
|---|
| 73 | |
|---|
| 74 | /** Handle a change in the current item **/ |
|---|
| 75 | private function itemHandler(evt:ControllerEvent) { |
|---|
| 76 | if(view.playlist.length > 1) { |
|---|
| 77 | bar.prevButton.visible = bar.nextButton.visible = true; |
|---|
| 78 | } else { |
|---|
| 79 | bar.prevButton.visible = bar.nextButton.visible = false; |
|---|
| 80 | } |
|---|
| 81 | if(view.playlist[view.config['item']]['link']) { |
|---|
| 82 | bar.linkButton.visible = true; |
|---|
| 83 | } else { |
|---|
| 84 | bar.linkButton.visible = false; |
|---|
| 85 | } |
|---|
| 86 | if(view.config['digits'] == false) { |
|---|
| 87 | bar.elapsedText.visible = bar.totalText.visible = false; |
|---|
| 88 | } else { |
|---|
| 89 | bar.elapsedText.visible = bar.totalText.visible = true; |
|---|
| 90 | } |
|---|
| 91 | }; |
|---|
| 92 | |
|---|
| 93 | |
|---|
| 94 | /** Process bytesloaded updates given by the model. **/ |
|---|
| 95 | private function loadedHandler(evt:ModelEvent) { |
|---|
| 96 | var pc1 = 0; |
|---|
| 97 | if(evt.data.total > 0) { |
|---|
| 98 | pc1 = evt.data.loaded/evt.data.total; |
|---|
| 99 | } |
|---|
| 100 | var pc2 = 0; |
|---|
| 101 | if(evt.data.offset) { |
|---|
| 102 | pc2 = evt.data.offset/evt.data.total; |
|---|
| 103 | } |
|---|
| 104 | try { |
|---|
| 105 | var wid = bar.timeSlider.rail.width; |
|---|
| 106 | bar.timeSlider.mark.x = Math.round(pc2*wid); |
|---|
| 107 | bar.timeSlider.mark.width = Math.round(pc1*wid); |
|---|
| 108 | } catch (err:Error) {} |
|---|
| 109 | }; |
|---|
| 110 | |
|---|
| 111 | |
|---|
| 112 | /** Show above controlbar on mousemove. **/ |
|---|
| 113 | private function moveHandler(evt:MouseEvent) { |
|---|
| 114 | bar.visible = true; |
|---|
| 115 | clearTimeout(hiding); |
|---|
| 116 | hiding = setTimeout(moveTimeout,1000); |
|---|
| 117 | }; |
|---|
| 118 | |
|---|
| 119 | |
|---|
| 120 | /** Hide above controlbar again when move has timed out. **/ |
|---|
| 121 | private function moveTimeout() { |
|---|
| 122 | if(bar.mouseY < -10) { |
|---|
| 123 | bar.visible = false; |
|---|
| 124 | } |
|---|
| 125 | }; |
|---|
| 126 | |
|---|
| 127 | |
|---|
| 128 | /** Show a mute icon if playing. **/ |
|---|
| 129 | private function muteHandler(evt:ControllerEvent) { |
|---|
| 130 | if(evt.data.state == true) { |
|---|
| 131 | bar.muteButton.visible = false; |
|---|
| 132 | bar.unmuteButton.visible = true; |
|---|
| 133 | bar.volumeSlider.mark.visible = false; |
|---|
| 134 | } else { |
|---|
| 135 | bar.muteButton.visible = true; |
|---|
| 136 | bar.unmuteButton.visible = false; |
|---|
| 137 | bar.volumeSlider.mark.visible = true; |
|---|
| 138 | } |
|---|
| 139 | }; |
|---|
| 140 | |
|---|
| 141 | |
|---|
| 142 | /** Handle mouseouts from all buttons **/ |
|---|
| 143 | private function outHandler(evt:MouseEvent) { |
|---|
| 144 | if(sliding) { clickHandler(evt); } |
|---|
| 145 | }; |
|---|
| 146 | |
|---|
| 147 | |
|---|
| 148 | /** Process resizing requests **/ |
|---|
| 149 | private function resizeHandler(evt:ControllerEvent) { |
|---|
| 150 | var wid = stacker.width; |
|---|
| 151 | if(view.config['controlbar'] == 'over' || evt.data.fullscreen == true) { |
|---|
| 152 | bar.y = evt.data.height - view.config['controlbarsize']*2; |
|---|
| 153 | if(evt.data.width > 640) { |
|---|
| 154 | bar.x = Math.round(evt.data.width/2-300); |
|---|
| 155 | wid = 600; |
|---|
| 156 | } else { |
|---|
| 157 | bar.x = view.config['controlbarsize']; |
|---|
| 158 | wid = evt.data.width - view.config['controlbarsize']*2; |
|---|
| 159 | } |
|---|
| 160 | } else { |
|---|
| 161 | bar.x = 0; |
|---|
| 162 | wid = evt.data.width; |
|---|
| 163 | bar.y = evt.data.height; |
|---|
| 164 | if(view.config['playlist'] == 'right') { |
|---|
| 165 | wid += view.config['playlistsize']; |
|---|
| 166 | } |
|---|
| 167 | } |
|---|
| 168 | if(view.config['fullscreen'] == false || bar.stage.displayState == null) { |
|---|
| 169 | bar.fullscreenButton.visible = false; |
|---|
| 170 | bar.normalscreenButton.visible = false; |
|---|
| 171 | } else if(evt.data.fullscreen == true) { |
|---|
| 172 | bar.fullscreenButton.visible = false; |
|---|
| 173 | bar.normalscreenButton.visible = true; |
|---|
| 174 | } else { |
|---|
| 175 | bar.fullscreenButton.visible = false; |
|---|
| 176 | bar.normalscreenButton.visible = true; |
|---|
| 177 | } |
|---|
| 178 | stacker.rearrange(wid); |
|---|
| 179 | bar.timeSlider.icon.scaleX = 1/bar.timeSlider.scaleX; |
|---|
| 180 | }; |
|---|
| 181 | |
|---|
| 182 | |
|---|
| 183 | /** Send the new scrub position to the controller **/ |
|---|
| 184 | private function sendScrub(evt:MouseEvent) { |
|---|
| 185 | bar.timeSlider.icon.stopDrag(); |
|---|
| 186 | var xps = bar.timeSlider.icon.x - bar.timeSlider.rail.x; |
|---|
| 187 | var dur = view.playlist[view.config['item']]['duration']; |
|---|
| 188 | var pct = Math.round(xps*dur*10/bar.timeSlider.rail.width)/10; |
|---|
| 189 | view.sendEvent(ViewEvent.SEEK,pct); |
|---|
| 190 | } |
|---|
| 191 | |
|---|
| 192 | |
|---|
| 193 | /** Send the new volume to the controlbar **/ |
|---|
| 194 | private function sendVolume(evt:MouseEvent) { |
|---|
| 195 | bar.volumeSlider.icon.stopDrag(); |
|---|
| 196 | var xps = bar.volumeSlider.icon.x - bar.volumeSlider.rail.x; |
|---|
| 197 | var pct = Math.round(xps*100/bar.volumeSlider.mark.width); |
|---|
| 198 | view.sendEvent(ViewEvent.VOLUME,pct); |
|---|
| 199 | }; |
|---|
| 200 | |
|---|
| 201 | |
|---|
| 202 | /** Process state changes **/ |
|---|
| 203 | private function stateHandler(evt:ModelEvent) { |
|---|
| 204 | switch(evt.data.newstate) { |
|---|
| 205 | case ModelStates.PLAYING: |
|---|
| 206 | if(view.config['controlbar'] == 'over') { |
|---|
| 207 | hiding = setTimeout(moveTimeout,1000); |
|---|
| 208 | view.skin.addEventListener(MouseEvent.MOUSE_MOVE, moveHandler); |
|---|
| 209 | } |
|---|
| 210 | case ModelStates.BUFFERING: |
|---|
| 211 | bar.playButton.visible = false; |
|---|
| 212 | bar.pauseButton.visible = true; |
|---|
| 213 | break; |
|---|
| 214 | default: |
|---|
| 215 | if(view.config['controlbar'] == 'over') { |
|---|
| 216 | clearTimeout(hiding); |
|---|
| 217 | bar.visible = true; |
|---|
| 218 | view.skin.removeEventListener(MouseEvent.MOUSE_MOVE, moveHandler); |
|---|
| 219 | } |
|---|
| 220 | bar.playButton.visible = true; |
|---|
| 221 | bar.pauseButton.visible = false; |
|---|
| 222 | break; |
|---|
| 223 | } |
|---|
| 224 | } |
|---|
| 225 | |
|---|
| 226 | |
|---|
| 227 | /** Process time updates given by the model. **/ |
|---|
| 228 | private function timeHandler(evt:ModelEvent) { |
|---|
| 229 | var dur = evt.data.duration; |
|---|
| 230 | bar.elapsedText.field.text = Strings.digits(evt.data.position); |
|---|
| 231 | bar.totalText.field.text = Strings.digits(evt.data.duration) |
|---|
| 232 | var pct = evt.data.position/evt.data.duration; |
|---|
| 233 | var xps = Math.floor(pct*bar.timeSlider.rail.width); |
|---|
| 234 | if (dur <= 0) { |
|---|
| 235 | bar.timeSlider.icon.visible = false; |
|---|
| 236 | } else { |
|---|
| 237 | bar.timeSlider.icon.visible = true; |
|---|
| 238 | bar.timeSlider.icon.x = xps; |
|---|
| 239 | } |
|---|
| 240 | }; |
|---|
| 241 | |
|---|
| 242 | |
|---|
| 243 | /** Handle a move over the timeslider **/ |
|---|
| 244 | private function timeslideHandler(evt:MouseEvent) { |
|---|
| 245 | var rct = new Rectangle(bar.timeSlider.rail.x,bar.timeSlider.icon.y,bar.timeSlider.rail.width,0); |
|---|
| 246 | bar.timeSlider.icon.startDrag(true,rct); |
|---|
| 247 | sliding = true; |
|---|
| 248 | }; |
|---|
| 249 | |
|---|
| 250 | |
|---|
| 251 | /** Reflect the new volume in the controlbar **/ |
|---|
| 252 | private function volumeHandler(evt:ControllerEvent) { |
|---|
| 253 | bar.volumeSlider.mark.scaleX = evt.data.percentage/100; |
|---|
| 254 | }; |
|---|
| 255 | |
|---|
| 256 | |
|---|
| 257 | /** Handle a move over the volume bar **/ |
|---|
| 258 | private function volumeslideHandler(evt:MouseEvent) { |
|---|
| 259 | var rct = new Rectangle(bar.volumeSlider.rail.x,bar.volumeSlider.icon.y,bar.volumeSlider.rail.width,0); |
|---|
| 260 | bar.volumeSlider.icon.startDrag(true,rct); |
|---|
| 261 | sliding = true; |
|---|
| 262 | }; |
|---|
| 263 | |
|---|
| 264 | |
|---|
| 265 | }; |
|---|
| 266 | |
|---|
| 267 | |
|---|
| 268 | } |
|---|