sproutcore 1.9.2 → 1.10.0.rc.1

data/lib/frameworks/sproutcore/frameworks/desktop/views/scroller.js

@@ -43,10 +43,10 @@ SC.ScrollerView = SC.View.extend(
 
   /**
     @type Array
-    @default 'thumbPosition thumbLength isEnabled controlsHidden'.w()
+    @default 'thumbPosition thumbLength controlsHidden'.w()
     @see SC.View#displayProperties
   */
-  displayProperties: ['thumbPosition', 'thumbLength', 'isEnabled', 'controlsHidden'],
+  displayProperties: ['thumbPosition', 'thumbLength', 'controlsHidden'],
 
   /**
     The WAI-ARIA role for scroller view.
@@ -286,7 +286,6 @@ SC.ScrollerView = SC.View.extend(
     }
 
     // The appearance of the scroller changes if disabled
-    classNames['disabled'] = !this.get('isEnabled');
     // Whether to hide the thumb and buttons
     classNames['controls-hidden'] = this.get('controlsHidden');
 
@@ -306,13 +305,13 @@ SC.ScrollerView = SC.View.extend(
       this.renderThumb(context, layoutDirection, thumbLength, thumbPosition);
 
       //addressing accessibility
-      context.attr('aria-orientation', ariaOrientation);
+      context.setAttr('aria-orientation', ariaOrientation);
 
       //addressing accessibility
-      context.attr('aria-valuemax', this.get('maximum'));
-      context.attr('aria-valuemin', this.get('minimum'));
-      context.attr('aria-valuenow', this.get('value'));
-      context.attr('aria-controls' , parentView.getPath('contentView.layerId'));
+      context.setAttr('aria-valuemax', this.get('maximum'));
+      context.setAttr('aria-valuemin', this.get('minimum'));
+      context.setAttr('aria-valuenow', this.get('value'));
+      context.setAttr('aria-controls' , parentView.getPath('contentView.layerId'));
 
     } else {
       // The HTML has already been generated, so all we have to do is
@@ -326,7 +325,7 @@ SC.ScrollerView = SC.View.extend(
       this.adjustThumb(thumbElement, thumbPosition, thumbLength);
 
       //addressing accessibility
-      context.attr('aria-valuenow', this.get('value'));
+      context.setAttr('aria-valuenow', this.get('value'));
 
     }
   },
@@ -547,7 +546,7 @@ SC.ScrollerView = SC.View.extend(
     @param evt {SC.Event} the mousedown event
   */
   mouseDown: function(evt) {
-    if (!this.get('isEnabled')) return NO;
+    if (!this.get('isEnabledInPane')) return NO;
 
     // keep note of altIsDown for later.
     this._altIsDown = evt.altKey;
@@ -678,6 +677,8 @@ SC.ScrollerView = SC.View.extend(
     @param evt {SC.Event} the mousedragged event
   */
   mouseDragged: function(evt) {
+    if (!this.get('isEnabledInPane')) return NO;
+
     var value, length, delta, thumbPosition,
         target = evt.target,
         thumbPositionAtDragStart = this._thumbPositionAtDragStart,
@@ -933,8 +934,6 @@ SC.TouchScrollerView = SC.ScrollerView.extend(
         break;
     }
 
-    // The appearance of the scroller changes if disabled
-    if (!this.get('isEnabled')) classNames.push('disabled');
     // Whether to hide the thumb and buttons
     if (this.get('controlsHidden')) classNames.push('controls-hidden');
 

data/lib/frameworks/sproutcore/frameworks/desktop/views/segment.js

@@ -45,13 +45,6 @@ SC.SegmentView = SC.View.extend(SC.Control,
   */
   toolTip: null,
 
-  /**
-    @type Boolean
-    @default YES
-    @see SC.Control#isEnabled
-  */
-  isEnabled: YES,
-
   /**
     @type Boolean
     @default NO
@@ -67,16 +60,16 @@ SC.SegmentView = SC.View.extend(SC.Control,
   isSelected: NO,
 
   /**
-    Change the layout direction to make this a vertical segment instead of horizontal ones. 
+    Change the layout direction to make this a vertical segment instead of horizontal ones.
     Possible values:
-    
+
       - SC.LAYOUT_HORIZONTAL
       - SC.LAYOUT_VERTICAL
-    
+
     @type String
     @default SC.LAYOUT_HORIZONTAL
   */
-  layoutDirection: SC.LAYOUT_HORIZONTAL,   
+  layoutDirection: SC.LAYOUT_HORIZONTAL,
 
   /**
     @type String
@@ -110,7 +103,7 @@ SC.SegmentView = SC.View.extend(SC.Control,
 
   // ..........................................................
   // Properties
-  // 
+  //
 
   /**
     @type String
@@ -158,7 +151,7 @@ SC.SegmentView = SC.View.extend(SC.Control,
 
   /**
     Localized title.
-    
+
     @field
     @type String
     @default ""

data/lib/frameworks/sproutcore/frameworks/desktop/views/segmented.js

@@ -52,9 +52,9 @@ SC.SegmentedView = SC.View.extend(SC.Control,
     @default YES
   */
   acceptsFirstResponder: function () {
-    if (SC.FOCUS_ALL_CONTROLS) { return this.get('isEnabled'); }
+    if (SC.FOCUS_ALL_CONTROLS) { return this.get('isEnabledInPane'); }
     return NO;
-  }.property('isEnabled').cacheable(),
+  }.property('isEnabledInPane').cacheable(),
 
   /**
     @type String
@@ -82,21 +82,20 @@ SC.SegmentedView = SC.View.extend(SC.Control,
     The value of the segmented view.
 
     The SegmentedView's value will always be the value of the currently
-    selected button.  Setting this value will change the selected button.
+    selected button or buttons.  Setting this value will change the selected
+    button or buttons.
+
     If you set this value to something that has no matching button, then
     no buttons will be selected.
 
-    @type Object
+    Note: if allowsMultipleSelection is set to true, then the value must be
+    an Array.
+
+    @type Object | Array
     @default null
   */
   value: null,
 
-  /**
-    @type Boolean
-    @default YES
-  */
-  isEnabled: YES,
-
   /**
     If YES, clicking a selected button again will deselect it, setting the
     segmented views value to null.
@@ -239,7 +238,7 @@ SC.SegmentedView = SC.View.extend(SC.Control,
 
   /**
     The key that contains the layerId for each item.
-    @property {String}
+    @type String
   */
   itemLayerIdKey: null,
 
@@ -266,6 +265,8 @@ SC.SegmentedView = SC.View.extend(SC.Control,
   /**
     The title to use for the overflow segment if it appears.
 
+    NOTE: This will not be HTML escaped and must never be assigned to user inserted text!
+
     @type String
     @default '»'
   */
@@ -277,7 +278,7 @@ SC.SegmentedView = SC.View.extend(SC.Control,
     @type String
     @default 'More…'
   */
-  overflowToolTip: 'More…',
+  overflowToolTip: 'More…',
 
   /**
     The icon to use for the overflow segment if it appears.
@@ -323,6 +324,7 @@ SC.SegmentedView = SC.View.extend(SC.Control,
 
     overflowView = this.get('segmentViewClass').create({
       controlSize: this.get('controlSize'),
+      escapeHTML: false,
       localize: this.get('localize'),
       title: title,
       toolTip: toolTip,
@@ -354,20 +356,17 @@ SC.SegmentedView = SC.View.extend(SC.Control,
   */
   itemsDidChange: function () {
     var items = this.get('items') || [],
-        item,
-        localItem,                        // Used to avoid altering the original items
-        previousItem,
-        childViews = this.get('childViews'),
-        childView,
-        overflowView = childViews.lastObject(),
-        value = this.get('value'),        // The value can change if items that were once selected are removed
-        isSelected,
-        itemKeys = this.get('itemKeys'),
-        itemKey,
-        viewKeys = this.get('viewKeys'),
-        viewKey,
-        segmentViewClass = this.get('segmentViewClass'),
-        i, j;
+      localItem,                        // Used to avoid altering the original items
+      previousItem,
+      childViews = this.get('childViews'),
+      childView,
+      overflowView = childViews.lastObject(),
+      value = this.get('value'),        // The value can change if items that were once selected are removed
+      isSelected,
+      itemKeys = this.get('itemKeys'),
+      itemKey,
+      segmentViewClass = this.get('segmentViewClass'),
+      i, j;
 
     // Update childViews
     if (childViews.get('length') - 1 > items.get('length')) {   // We've lost segments (ie. childViews)
@@ -396,7 +395,7 @@ SC.SegmentedView = SC.View.extend(SC.Control,
           value = null;
         }
 
-        this.removeChild(childView);
+        this.removeChildAndDestroy(childView);
       }
 
       // Update our value which may have changed
@@ -500,8 +499,7 @@ SC.SegmentedView = SC.View.extend(SC.Control,
     to SC.Object based items that may be observed.
   */
   itemContentDidChange: function (item, key, alwaysNull, index) {
-    var items = this.get('items'),
-        childViews = this.get('childViews'),
+    var childViews = this.get('childViews'),
         childView;
 
     childView = childViews.objectAt(index);
@@ -509,13 +507,11 @@ SC.SegmentedView = SC.View.extend(SC.Control,
 
       // Update the childView
       childView.updateItem(this, item);
-    } else {
-      SC.Logger.warn("Item content change was observed on item without matching segment child view.");
-    }
 
-    // Reset our measurements (which depend on width/height or title) and adjust visible views
-    if (this.get('shouldHandleOverflow')) {
-      this.invokeLast(this.remeasure);
+      // Reset our measurements (which depend on width/height or title) and adjust visible views
+      if (this.get('shouldHandleOverflow')) {
+        this.invokeLast(this.remeasure);
+      }
     }
   },
 
@@ -524,11 +520,11 @@ SC.SegmentedView = SC.View.extend(SC.Control,
   */
   viewDidResize: function () {
     var isHorizontal = this.get('layoutDirection') === SC.LAYOUT_HORIZONTAL,
-        visibleDim = isHorizontal ? this.$().width() : this.$().height();
+      visibleDim = isHorizontal ? this.$().width() : this.$().height();
 
     // Only overflow if we've gone below the minimum dimension required to fit all the segments
     if (this.get('shouldHandleOverflow') && (this.isOverflowing || visibleDim <= this.cachedMinimumDim)) {
-	  this.adjustOverflow();
+      this.invokeLast(this.remeasure);
     }
   },
 
@@ -547,8 +543,8 @@ SC.SegmentedView = SC.View.extend(SC.Control,
   */
   remeasure: function () {
     if (!this.get('shouldHandleOverflow')) { return; }
-    var renderDelegate = this.get('renderDelegate'),
-        childViews = this.get('childViews'),
+
+    var childViews = this.get('childViews'),
         overflowView;
 
     if (this.get('isVisibleInWindow')) {
@@ -556,11 +552,10 @@ SC.SegmentedView = SC.View.extend(SC.Control,
       overflowView = childViews.lastObject();
       overflowView.set('isVisible', YES);
 
-      for (var i = childViews.get('length') - 1; i >= 0; i--){
+      for (var i = childViews.get('length') - 1; i >= 0; i--) {
         childViews.objectAt(i).set('isVisible', YES);
       }
 
-
       this.cachedDims = this.segmentDimensions();
       this.cachedOverflowDim = this.overflowSegmentDim();
 
@@ -592,7 +587,7 @@ SC.SegmentedView = SC.View.extend(SC.Control,
     this.overflowItems = [];
 
     length = this.cachedDims.length;
-    for (i=0; i < length; i++) {
+    for (i = 0; i < length; i++) {
       childView = childViews.objectAt(i);
       curElementsDim += this.cachedDims[i];
 
@@ -600,17 +595,8 @@ SC.SegmentedView = SC.View.extend(SC.Control,
       dimToFit = (i === length - 1) ? curElementsDim : curElementsDim + this.cachedOverflowDim;
 
       if (dimToFit > visibleDim) {
-        // Create a menu item based on the original item.
-        overflowItem = {};
-        localItem = childView.get('localItem');
-
-        overflowItem[this.get('itemTitleKey')] = localItem.get(this.get('itemTitleKey'));
-        overflowItem[this.get('itemIconKey')] = localItem.get(this.get('itemIconKey'));
-        overflowItem[this.get('itemIsEnabledKey')] = localItem.get(this.get('itemIsEnabledKey'));
-        overflowItem[this.get('itemKeyEquivalentKey')] = localItem.get(this.get('itemKeyEquivalentKey'));
-        overflowItem[this.get('itemValueKey')] = localItem.get(this.get('itemValueKey'));
-
-        this.overflowItems.pushObject(overflowItem);
+        // Add the localItem to the overflowItems
+        this.overflowItems.pushObject(childView.get('localItem'));
 
         // Record that we're now overflowing
         this.isOverflowing = YES;
@@ -696,7 +682,7 @@ SC.SegmentedView = SC.View.extend(SC.Control,
       rect = {
         x: rect.left,
         y: rect.top,
-        width: (rect.right-rect.left),
+        width: (rect.right - rect.left),
         height: (rect.bottom - rect.top)
       };
 
@@ -743,8 +729,8 @@ SC.SegmentedView = SC.View.extend(SC.Control,
       var el = evt.target;
       if (el) {
         var offset = SC.offset(el);
-        x = offset.x + Math.round(el.offsetWidth/2);
-        y = offset.y + Math.round(el.offsetHeight/2);
+        x = offset.x + Math.round(el.offsetWidth / 2);
+        y = offset.y + Math.round(el.offsetHeight / 2);
       }
     }
 
@@ -765,9 +751,9 @@ SC.SegmentedView = SC.View.extend(SC.Control,
     // handle tab key
     if (evt.which === 9 || evt.keyCode === 9) {
       var view = evt.shiftKey ? this.get('previousValidKeyView') : this.get('nextValidKeyView');
-      if(view) view.becomeFirstResponder();
+      if (view) view.becomeFirstResponder();
       else evt.allowDefault();
-      return YES ; // handled
+      return YES; // handled
     }
 
     // handle arrow keys
@@ -782,24 +768,24 @@ SC.SegmentedView = SC.View.extend(SC.Control,
       if (evt.which === 39 || evt.which === 40) {
 
         if (value) {
-          for(i = 0; i < length - 2; i++){
+          for (i = 0; i < length - 2; i++) {
             childView = childViews.objectAt(i);
-            if ( isArray ? (value.indexOf(childView.get('value'))>=0) : (childView.get('value')===value)){
+            if (isArray ? (value.indexOf(childView.get('value')) >= 0) : (childView.get('value') === value)) {
               this.triggerItemAtIndex(i + 1);
             }
           }
         } else {
           this.triggerItemAtIndex(0);
         }
-        return YES ; // handled
+        return YES; // handled
 
       // Select from the right to the left
       } else if (evt.which === 37 || evt.which === 38) {
 
         if (value) {
-          for(i = 1; i < length - 1; i++) {
+          for (i = 1; i < length - 1; i++) {
             childView = childViews.objectAt(i);
-            if ( isArray ? (value.indexOf(childView.get('value'))>=0) : (childView.get('value')===value)){
+            if (isArray ? (value.indexOf(childView.get('value')) >= 0) : (childView.get('value') === value)) {
               this.triggerItemAtIndex(i - 1);
             }
           }
@@ -821,7 +807,7 @@ SC.SegmentedView = SC.View.extend(SC.Control,
         overflowIndex = childViews.get('length') - 1,
         index;
 
-    if (!this.get('isEnabled')) return YES; // nothing to do
+    if (!this.get('isEnabledInPane')) return YES; // nothing to do
 
     index = this.displayItemIndexForEvent(evt);
     if (index >= 0) {
@@ -936,7 +922,7 @@ SC.SegmentedView = SC.View.extend(SC.Control,
         overflowIndex = childViews.get('length') - 1,
         index;
 
-    if (!this.get('isEnabled')) return YES; // nothing to do
+    if (!this.get('isEnabledInPane')) return YES; // nothing to do
 
     index = this.displayItemIndexForEvent(touch);
 
@@ -950,7 +936,7 @@ SC.SegmentedView = SC.View.extend(SC.Control,
       else this._isTouching = YES;
     }
 
-    return YES ;
+    return YES;
   },
 
   /** @private */
@@ -1054,55 +1040,46 @@ SC.SegmentedView = SC.View.extend(SC.Control,
   triggerItemAtIndex: function (index) {
     var childViews = this.get('childViews'),
         childView,
-        sel, value, val, empty, mult;
+        childValue, value, allowEmpty, allowMult;
 
     childView = childViews.objectAt(index);
 
     if (!childView.get('isEnabled')) return this; // nothing to do!
 
-    empty = this.get('allowsEmptySelection');
-    mult = this.get('allowsMultipleSelection');
+    allowEmpty = this.get('allowsEmptySelection');
+    allowMult = this.get('allowsMultipleSelection');
 
     // get new value... bail if not enabled. Also save original for later.
-    sel = childView.get('value');
-    value = val = this.get('value') ;
-
-    if (SC.empty(value)) {
-      value = [];
-    } else if (!SC.isArray(value)) {
-      value = [value]; // force to array
-    }
+    childValue = childView.get('value');
+    value = this.get('value');
 
     // if we do not allow multiple selection, either replace the current
     // selection or deselect it
-    if (!mult) {
+    if (!allowMult) {
       // if we allow empty selection and the current value is the same as
       // the selected value, then deselect it.
-      if (empty && (value.get('length')===1) && (value.objectAt(0)===sel)) {
+      if (allowEmpty && value === childValue) {
+        value = null;
+      } else {
+        // otherwise, simply replace the value.
+        value = childValue;
+      }
+    } else {
+      // Lazily create the value array.
+      if (!value) {
         value = [];
+      } else if (!SC.isArray(value)) {
+        value = [value];
+      }
 
-      // otherwise, simply replace the value.
-      } else value = [sel] ;
-
-    // if we do allow multiple selection, then add or remove item to the array.
-    } else {
-      if (value.indexOf(sel) >= 0) {
-        if (value.get('length')>1 || (value.objectAt(0)!==sel) || empty) {
-          value = value.without(sel);
+      // if we do allow multiple selection, then add or remove item to the array.
+      if (value.indexOf(childValue) >= 0) {
+        if (value.get('length') > 1 || (value.objectAt(0) !== childValue) || allowEmpty) {
+          value = value.without(childValue);
         }
-      } else value = value.concat([sel]) ;
-    }
-
-    // normalize back to non-array form
-    switch(value.get('length')) {
-      case 0:
-        value = null;
-        break;
-      case 1:
-        value = value.objectAt(0);
-        break;
-      default:
-        break;
+      } else {
+        value = value.concat(childValue);
+      }
     }
 
     // also, trigger target if needed.
@@ -1118,17 +1095,17 @@ SC.SegmentedView = SC.View.extend(SC.Control,
       if (targetKey) {
         target = item.get ? item.get(targetKey) : item[targetKey];
       }
-      if (resp) resp.sendAction(action, target, this, this.get('pane'),value);
+      if (resp) resp.sendAction(action, target, this, this.get('pane'), value);
     }
 
-    if(val !== undefined && (!action || this.get('selectSegmentWhenTriggeringAction'))) {
+    if (value !== undefined && (!action || this.get('selectSegmentWhenTriggeringAction'))) {
       this.set('value', value);
     }
 
     // if an action/target is defined on self use that also
-    action =this.get('action');
+    action = this.get('action');
     if (action && resp) {
-      resp.sendAction(action, this.get('target'), this, this.get('pane'),value);
+      resp.sendAction(action, this.get('target'), this, this.get('pane'), value);
     }
   },
 
@@ -1152,7 +1129,6 @@ SC.SegmentedView = SC.View.extend(SC.Control,
   */
   showOverflowMenu: function () {
     var childViews = this.get('childViews'),
-        overflowViewIndex = childViews.get('length') - 1,
         overflowItems = this.overflowItems,
         overflowItemsLength,
         startIndex,
@@ -1166,16 +1142,16 @@ SC.SegmentedView = SC.View.extend(SC.Control,
     isArray = SC.isArray(value);
     for (var i = 0; i < overflowItemsLength; i++) {
       var item = overflowItems.objectAt(i),
-        itemValueKey = this.get('itemValueKey');
+          itemValueKey = this.get('itemValueKey');
 
-      if (isArray ? value.indexOf(item[itemValueKey]) >= 0 : value === item[itemValueKey]) {
-        item.isChecked = YES;
+      if (isArray ? value.indexOf(item.get(itemValueKey)) >= 0 : value === item.get(itemValueKey)) {
+        item.set('isChecked', YES);
       } else {
-        item.isChecked = NO;
+        item.set('isChecked', NO);
       }
 
       // Track the matching segment index
-      item.index = startIndex + i;
+      item.set('index', startIndex + i);
     }
 
     // TODO: we can't pass a shortcut key to the menu, because it isn't a property of SegmentedView (yet?)
@@ -1219,8 +1195,7 @@ SC.SegmentedView = SC.View.extend(SC.Control,
         childViews = this.get('childViews'),
         overflowIndex = Infinity,
         overflowView = childViews.lastObject(),
-        childView,
-        isSelected;
+        childView;
 
     // The index where childViews are all overflowed
     if (this.overflowItems) {