sproutcore 1.9.2 → 1.10.0.rc.1

data/lib/frameworks/sproutcore/frameworks/media/media_capabilities.js

@@ -41,9 +41,9 @@ SC.mediaCapabilities = SC.Object.create({});
     }
     
     var doc = document.createElement('audio');
-    isAudioSupported = !!doc.canPlayType;
+    var isAudioSupported = !!doc.canPlayType;
     delete doc;
-    SC.mediaCapabilities.isHTML5AudioSupported = YES;
+    SC.mediaCapabilities.isHTML5AudioSupported = isAudioSupported;
     
   } catch(e) {
   }
@@ -62,9 +62,9 @@ SC.mediaCapabilities = SC.Object.create({});
     }
     
     var doc = document.createElement('video');
-    isVideoSupported = !!doc.canPlayType;
+    var isVideoSupported = !!doc.canPlayType;
     delete doc;
-    SC.mediaCapabilities.isHTML5VideoSupported = YES;
+    SC.mediaCapabilities.isHTML5VideoSupported = isVideoSupported;
   } catch(e) {
   }
   

data/lib/frameworks/sproutcore/frameworks/media/render_delegates/media_slider.js

@@ -6,69 +6,69 @@
 
 /**
  * Renders and updates the DOM representation of a media slider.
- * 
+ *
  * Parameters ------------------------- Requires the following parameters: -
  * `value` -- a value from 0 to 1. - `frame` -- containing the frame in which
  * the slider is being drawn.
  */
 
 SC.BaseTheme.mediaSliderRenderDelegate = SC.RenderDelegate.create({
-  
+
   className: 'sc-media-slider-view',
-  
+
   render: function(dataSource, context) {
     this.addSizeClassName(dataSource, context);
-    
+
     var blankImage = SC.BLANK_IMAGE_URL;
     var valueMax = dataSource.get('maximum');
     var valueMin = dataSource.get('minimum');
     var valueNow = dataSource.get('ariaValue');
-    
+
     // addressing accessibility
-    context.attr({
+    context.setAttr({
       'aria-valuemax': valueMax,
       'aria-valuemin': valueMin,
       'aria-valuenow': valueNow,
       'aria-orientation': 'horizontal'
     });
     if(valueMin !== 0 || valueMax !== 100) {
-      context.attr('aria-valuetext', valueNow);
+      context.setAttr('aria-valuetext', valueNow);
     }
-    
+
     context = context.begin('span').addClass('track');
     this.includeSlices(dataSource, context, SC.THREE_SLICE);
     context.push('<span class="sc-loaded-ranges"></span>');
     context.push('<img src="' + blankImage + '" class="sc-handle" style="left: ' + dataSource.get('value') + '%" />' + '</span>');
-    
+
     context = context.end();
-    
+
     dataSource.get('renderState')._cachedHandle = null;
   },
-  
-  update: function(dataSource, context) {
-    this.updateSizeClassName(dataSource, context);
-    
+
+  update: function(dataSource, jquery) {
+    this.updateSizeClassName(dataSource, jquery);
+
     var valueMax = dataSource.get('maximum');
     var valueMin = dataSource.get('minimum');
     var valueNow = dataSource.get('ariaValue');
-    
+
     // addressing accessibility
-    context.attr({
+    jquery.attr({
       'aria-valuemax': valueMax,
       'aria-valuemin': valueMin,
       'aria-valuenow': valueNow,
       'aria-orientation': 'horizontal'
     });
     if(valueMin !== 0 || valueMax !== 100) {
-      context.attr('aria-valuetext', valueNow);
+      jquery.attr('aria-valuetext', valueNow);
     }
-    
+
     if(dataSource.didChangeFor('sliderRenderDelegate', 'value')) {
       var handle = dataSource.get('renderState')._cachedHandle;
       if(!handle) {
-        handle = dataSource.get('renderState')._cachedHandle = context.find('.sc-handle');
+        handle = dataSource.get('renderState')._cachedHandle = jquery.find('.sc-handle');
       }
-      
+
       var value = dataSource.get('value');
       handle.css('left', value + "%");
     }

data/lib/frameworks/sproutcore/frameworks/media/resources/video.css

@@ -3,23 +3,23 @@
   background: black;
 }
 
-.sc-media-controls 
+.sc-media-controls
 {
   background: black;
   opacity:0.8;
-  
+
   .sc-button-view
   {
     .sc-button-label
     {
       padding: 0px;
     }
-  
+
     .left, .middle, .right
     {
       display: none;
     }
-  
+
     .stop
     {
       @include slice("controls.png", $left: 13, $width: 11);
@@ -29,7 +29,7 @@
       top: 4px;
       left: 4px;
     }
-    
+
     .play
     {
       @include slice("controls.png", $left: 0, $width: 8);
@@ -39,7 +39,7 @@
       top: 4px;
       left: 6px;
     }
-    
+
     .theater
     {
       @include slice("controls.png", $left: 32, $width: 11);
@@ -50,11 +50,11 @@
       left: 4px;
     }
   }
-  
+
   .sc-label-view
   {
   	position: absolute;
-  
+
     .minus
     {
       @include slice("controls.png", $left: 50, $width: 6);
@@ -64,7 +64,7 @@
       top: 4px;
       left: 7px;
     }
-    
+
     .plus
     {
       @include slice("controls.png", $left: 64, $width: 10);
@@ -75,16 +75,17 @@
       left: 5px;
     }
   }
-  
+
   .time{
     font-size: 10px !important;
     line-height: 20px !important;
     color: #FFFFFF;
+    text-align: center;
   }
   .sc-view.sc-slider-view
   {
     overflow:visible;
-    
+
     .track{
       background: none;
       position:absolute;
@@ -94,12 +95,12 @@
       right:0px;
       z-index:1;
       overflow: display;
-      
+
       .left, .right
       {
         display: none;
       }
-      
+
       .middle
       {
         position:absolute;
@@ -109,7 +110,7 @@
         right:0px;
         background: #CCCCCC;
       }
-      
+
       .sc-loaded-ranges{
         position:absolute;
         top: 0px;
@@ -117,7 +118,7 @@
         left:0px;
         right:0px;
         background: none;
-        
+
         .sc-loaded-range {
           background-color: green;
           top: 0px;
@@ -125,7 +126,7 @@
           position:absolute;
         }
       }
-    
+
       .sc-handle
       {
         background:white;
@@ -135,4 +136,4 @@
       }
     }
   }
-}
+}

data/lib/frameworks/sproutcore/frameworks/media/views/audio.js

@@ -9,7 +9,7 @@ sc_require('views/controls');
 sc_require('views/mini_controls');
 sc_require('media_capabilities');
 
-/** 
+/**
   @class
 
   Renders a audioView using different technologies like HTML5 audio tag,
@@ -34,7 +34,7 @@ SC.AudioView = SC.View.extend(
 
   /**
     Audio view className.
-    @property {String}
+    @type String
   */
   classNames: 'sc-audio-view',
 
@@ -42,13 +42,13 @@ SC.AudioView = SC.View.extend(
     Properties that trigger a re render of the view. If the value changes, it
     means that the audio url changed.
 
-    @property {Array}
+    @type Array
   */
   displayProperties: ['value', 'shouldAutoResize'],
 
   /**
     Reference to the audio object once is created.
-    @property {Object}
+    @type Object
   */
 
   audioObject:null,
@@ -57,14 +57,14 @@ SC.AudioView = SC.View.extend(
     Array containing the technologies and the order to load them depending
     availability
 
-    @property {Array}
+    @type Array
   */
   degradeList: ['html5','quicktime', 'flash'],
 
   /**
      Current time in secs
-     
-     @property {Number}
+
+     @type Number
    */
   currentTime : function(key, value) {
     if (!SC.empty(value) && this._currentTime != value) {
@@ -77,47 +77,47 @@ SC.AudioView = SC.View.extend(
 
   /**
      Current time in secs
-     
-     @property {Number}
+
+     @type Number
      @private
    */
   _currentTime : 0,
-  
-  /** 
+
+  /**
     Duration in secs
-    @property {Number}
+    @type Number
   */
   duration: 0, //audio duration in secs
 
   /**
     Volume. The value should be between 0 and 1
-    @property {Number}
+    @type Number
   */
   volume:0, //volume value from 0 to 1
 
   /**
     Tells you if the audio is paused or not.
-    @property {Boolean}
+    @type Boolean
   */
   paused: YES, //is the audio paused
 
   /**
     Tells you if the audio is loaded.
-    @property {Boolean}
+    @type Boolean
   */
 
   loaded: NO, //has the audio loaded
 
   /**
     Indicates if the audio has reached the end
-    @property {Boolean}
+    @type Boolean
   */
 
   ended: NO, //did the audio finished playing
 
   /**
     Indicates if the audio is ready to be played.
-    @property {Boolean}
+    @type Boolean
   */
 
   canPlay: NO, //can the audio be played
@@ -126,7 +126,7 @@ SC.AudioView = SC.View.extend(
 
   /**
     Formatted currentTime. (00:00)
-    @property {String}
+    @type String
   */
   time: function(){
     var currentTime=this.get('currentTime'),
@@ -448,7 +448,7 @@ SC.AudioView = SC.View.extend(
   }.observes('paused'),
 
   /**
-    Called when currentTime changes. Notifies the different technologies 
+    Called when currentTime changes. Notifies the different technologies
     then new currentTime.
 
     @returns {void}

data/lib/frameworks/sproutcore/frameworks/media/views/controls.js

@@ -17,10 +17,10 @@ SC.MediaControlsView = SC.View.extend(
 /** @scope SC.MediaControlsView.prototype */{
 
   target: null,
-  
+
   childViews: ['playButton', 'progressView', 'timeView', 'minusLabelView', 'volumeView', 'plusLabelView', 'theaterButton'],
   classNames: ['sc-media-controls'],
-  
+
   playObserver: function(){
     if(this.getPath('target.paused')){
       this.get('playButton').set('icon', 'play');
@@ -28,7 +28,7 @@ SC.MediaControlsView = SC.View.extend(
       this.get('playButton').set('icon', 'stop');
     }
   }.observes('*target.paused'),
-  
+
   playButton: SC.ButtonView.extend({
     title: '',
     icon: 'play',
@@ -36,7 +36,7 @@ SC.MediaControlsView = SC.View.extend(
     action: "playPause",
     targetBinding: "*owner.target"
   }),
-  
+
   progressView: SC.MediaSlider.extend({
     layout: { top: 0, left: 25, right: 230, height:20},
     value:0,
@@ -46,14 +46,13 @@ SC.MediaControlsView = SC.View.extend(
     maximumBinding: "*owner.target.duration",
     mediaViewBinding: "*owner.target"
   }),
-  
+
   timeView: SC.LabelView.extend({
     layout: { top: 0, right: 160, width: 60, height:20},
     classNames: 'time',
-    textAlign: SC.ALIGN_CENTER,
     valueBinding: '*owner.target.time'
   }),
-  
+
   theaterButton: SC.ButtonView.extend({
     title: '',
     icon: 'theater',
@@ -62,13 +61,13 @@ SC.MediaControlsView = SC.View.extend(
     action: "fullScreen",
     targetBinding: "*owner.target"
   }),
-  
+
   minusLabelView: SC.LabelView.extend({
     layout: { top: 0, right: 120, width: 20, height:20},
     value: '',
     icon: 'minus'
   }),
-  
+
   volumeView: SC.MediaSlider.extend({
     layout: { top: 0, right: 25, width: 90, height:20},
     value:0,
@@ -77,10 +76,10 @@ SC.MediaControlsView = SC.View.extend(
     maximum: 1,
     step: 0.01
   }),
-  
+
   plusLabelView: SC.LabelView.extend({
     layout: { top: 0, right: 0, width: 20, height:20},
     value: '',
     icon: 'plus'
-  })  
+  })
 });

data/lib/frameworks/sproutcore/frameworks/media/views/mini_controls.js

@@ -14,10 +14,10 @@ SC.MiniMediaControlsView = SC.View.extend(
 /** @scope SC.MiniMediaControlsView.prototype */{
 
   target: null,
-  
+
   childViews: ['playButton', 'timeView', 'minusLabelView', 'volumeView'],
   classNames: ['sc-media-controls'],
-  
+
   playObserver: function(){
     if(this.getPath('target.paused')){
       this.get('playButton').set('icon', 'play');
@@ -25,8 +25,8 @@ SC.MiniMediaControlsView = SC.View.extend(
       this.get('playButton').set('icon', 'stop');
     }
   }.observes('*target.paused'),
-  
-  
+
+
   playButton: SC.ButtonView.design({
     title: '',
     titleMinWidth: 35,
@@ -38,20 +38,19 @@ SC.MiniMediaControlsView = SC.View.extend(
     renderStyle: 'renderImage',
     theme: ''
   }),
-  
+
   timeView: SC.LabelView.design({
     layout: { top: 0, left: 20, width: 60, height:20},
     classNames: 'time',
-    textAlign: SC.ALIGN_CENTER,
     valueBinding: '*owner.target.time'
   }),
-  
+
   minusLabelView: SC.LabelView.design({
     layout: { top: 0, left: 80, width: 20, height:20},
     value: '',
     icon: 'minus'
   }),
-  
+
   volumeView: SC.MediaSlider.design({
     layout: { top: 0, left: 100, right: 10, height:20},
     value:0,