1 // ==========================================================================
  2 // Project:   SproutCore - JavaScript Application Framework
  3 // Copyright: ©2006-2011 Strobe Inc. and contributors.
  4 //            Portions ©2008-2011 Apple Inc. All rights reserved.
  5 // License:   Licensed under MIT license (see license.js)
  6 // ==========================================================================
  7 /*globals SC */
  8 
  9 sc_require('views/media_slider');
 10 /** @class
 11   @extends SC.View
 12 */
 13 SC.MiniMediaControlsView = SC.View.extend(
 14 /** @scope SC.MiniMediaControlsView.prototype */{
 15 
 16   target: null,
 17 
 18   childViews: ['playButton', 'timeView', 'minusLabelView', 'volumeView'],
 19   classNames: ['sc-media-controls'],
 20 
 21   playObserver: function(){
 22     if(this.getPath('target.paused')){
 23       this.get('playButton').set('icon', 'play');
 24     }else{
 25       this.get('playButton').set('icon', 'stop');
 26     }
 27   }.observes('*target.paused'),
 28 
 29 
 30   playButton: SC.ButtonView.design({
 31     title: '',
 32     titleMinWidth: 35,
 33     icon: 'play',
 34     noStyle: YES,
 35     layout: { top: 0, left: 0, width: 20, height:20},
 36     action: "playPause",
 37     targetBinding: ".parentView.target",
 38     renderStyle: 'renderImage',
 39     theme: ''
 40   }),
 41 
 42   timeView: SC.LabelView.design({
 43     layout: { top: 0, left: 20, width: 60, height:20},
 44     classNames: 'time',
 45     valueBinding: '.parentView*target.time'
 46   }),
 47 
 48   minusLabelView: SC.LabelView.design({
 49     layout: { top: 0, left: 80, width: 20, height:20},
 50     value: '',
 51     icon: 'minus'
 52   }),
 53 
 54   volumeView: SC.MediaSlider.design({
 55     layout: { top: 0, left: 100, right: 10, height:20},
 56     value:0,
 57     valueBinding: ".parentView*target.volume" ,
 58     minimum: 0,
 59     maximum: 1,
 60     step: 0.01
 61   })
 62 });
 63