sproutcore 1.6.0.beta.3 → 1.6.0.rc.1

data/lib/frameworks/sproutcore/frameworks/desktop/tests/views/static_content.js

@@ -21,7 +21,6 @@ test("Frame Recalculation", function() {
           callCount += 1;
         }.observes('frame')
       });
-
    pane.setPath('contentView.contentView', view);
    pane.append();
    baseCount = callCount;
@@ -38,7 +37,9 @@ test("Frame Recalculation", function() {
    callCount = 0;
 
    SC.RunLoop.begin().end();
-   ok(view.get('layer').textContent.indexOf(content) > -1, 'view should rerender when content changes');
+   var layer = view.get('layer');
+
+   ok(layer.innerHTML.indexOf(content) > -1, 'view should rerender when content changes');
    view.contentLayoutDidChange();
    ok(callCount > 0, 'frame should recompute after calling contentLayoutDidChange()');
 

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

@@ -95,14 +95,15 @@ SC.CheckboxView = SC.ButtonView.extend(SC.StaticLayout,
     if(!this.get('isEnabled')) {
       return YES;
     }
-    var val = this.get('value');
-    if (val === this.get('toggleOnValue')) {
 
-      this.set('value', this.get('toggleOffValue'));
-    }
-    else {
-      this.set('value', this.get('toggleOnValue'));
+    var isOn = this.get('value') === this.get('toggleOnValue');
+    this.set('value', isOn ? this.get('toggleOffValue') : this.get('toggleOnValue'));
+
+    // fire action
+    if (this.get('buttonBehavior') !== SC.HOLD_BEHAVIOR) {
+      if (this.$().within(evt.target)) { this._action(evt); }
     }
+
     return YES;
   },
   

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

@@ -2118,6 +2118,20 @@ SC.CollectionView = SC.View.extend(SC.CollectionViewDelegate, SC.CollectionConte
     return YES ; // always handle
   },
 
+  insertTab: function(evt) {
+    var view = this.get('nextValidKeyView');
+    if (view) view.becomeFirstResponder();
+    else evt.allowDefault();
+    return YES ; // handled
+  },
+
+  insertBacktab: function(evt) {
+    var view = this.get('previousValidKeyView');
+    if (view) view.becomeFirstResponder();
+    else evt.allowDefault();
+    return YES ; // handled
+  },
+
   // ..........................................................
   // MOUSE EVENTS
   // 
@@ -2142,6 +2156,8 @@ SC.CollectionView = SC.View.extend(SC.CollectionViewDelegate, SC.CollectionConte
 
     if (!this.get('isEnabled')) return contentIndex > -1;
 
+    if(!this.get('isSelectable')) return NO;
+
     info = this.mouseDownInfo = {
       event:        ev,  
       itemView:     itemView,
@@ -2245,6 +2261,8 @@ SC.CollectionView = SC.View.extend(SC.CollectionViewDelegate, SC.CollectionConte
 
     if (!this.get('isEnabled')) return contentIndex > -1;
 
+    if(!this.get('isSelectable')) return NO;
+
     if (this.get('useToggleSelection')) {
       // Return if clicked outside of elements or if toggle was handled by mouseDown
       if (!view || this.get('selectOnMouseDown')) return NO;

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

@@ -159,14 +159,13 @@ SC.PopupButtonView = SC.ButtonView.extend(
 
     @param {SC.Event} evt
   */
-  action: function(evt)
-  {
+  action: function(evt) {
     var menu = this.get('instantiatedMenu') ;
 
     if (!menu) {
-      //@ if (debug)
+      // @if (debug)
       SC.Logger.warn("SC.PopupButton - Unable to show menu because the menu property is set to %@.".fmt(menu));
-      //@ endif
+      // @endif
       return NO ;
     }
 
@@ -280,8 +279,7 @@ SC.PopupButtonView = SC.ButtonView.extend(
     alt_shift_z)
     @param {SC.Event} evt
   */
-  performKeyEquivalent: function( charCode, evt )
-  {
+  performKeyEquivalent: function(charCode, evt) {
     if (!this.get('isEnabled')) return NO ;
     var menu = this.get('instantiatedMenu') ;
 
@@ -300,4 +298,3 @@ SC.PopupButtonMenuLoader = SC.Task.extend({
     if (this.popupButton) this.popupButton._instantiateMenu();
   }
 });
-

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

@@ -36,6 +36,7 @@ sc_require('views/segment');
     - *itemIconKey*  - an icon
     - *itemActionKey* - an optional action to fire when pressed
     - *itemTargetKey* - an optional target for the action
+    - *itemLayerIdKey* - an optional target for the action 
     - *segmentViewClass* - class to be used for creating segments
 
   @extends SC.View
@@ -235,6 +236,12 @@ SC.SegmentedView = SC.View.extend(SC.Control,
   */
   itemTargetKey: null,
 
+  /**
+    The key that contains the layerId for each item.
+    @property {String}
+  */
+  itemLayerIdKey: null,
+
   /**
     The key that contains the key equivalent for each item.  If defined then
     pressing that key equivalent will be like selecting the tab.  Also,
@@ -287,10 +294,10 @@ SC.SegmentedView = SC.View.extend(SC.Control,
 
     @type Array
   */
-  itemKeys: 'itemTitleKey itemValueKey itemIsEnabledKey itemIconKey itemWidthKey itemToolTipKey itemKeyEquivalentKey'.w(),
+  itemKeys: ['itemTitleKey', 'itemValueKey', 'itemIsEnabledKey', 'itemIconKey', 'itemWidthKey', 'itemToolTipKey', 'itemKeyEquivalentKey', 'itemLayerIdKey'],
   
   /** @private */
-  viewKeys: ['title', 'value', 'isEnabled', 'icon', 'width', 'toolTip', 'keyEquivalent'],
+  viewKeys: ['title', 'value', 'isEnabled', 'icon', 'width', 'toolTip', 'keyEquivalent', 'layerId'],
 
   /** @private
     Call itemsDidChange once to initialize segment child views for the items that exist at

data/lib/frameworks/sproutcore/frameworks/desktop/{panes → views}/select_button.js

@@ -835,6 +835,21 @@ SC.SelectButtonView = SC.ButtonView.extend(
     return this.get('isEnabled');
   }.property('isEnabled'),
 
+  insertTab: function(evt) {
+    var view = this.get('nextValidKeyView');
+    if (view) view.becomeFirstResponder();
+    else evt.allowDefault();
+    return YES ; // handled
+  },
+
+  insertBacktab: function(evt) {
+    var view = this.get('previousValidKeyView');
+    if (view) view.becomeFirstResponder();
+    else evt.allowDefault();
+    return YES ; // handled
+  },
+
+
   /** @private
     Override the button isSelectedDidChange function in order to not perform any action
     on selecting the select_button
@@ -948,3 +963,31 @@ SC.SelectButtonView.HUGE_POPUP_MENU_WIDTH_OFFSET = 0;
   @default -2
 */
 SC.SelectButtonView.MENU_WIDTH_OFFSET = -2;
+
+/**
+  Default metrics for the different control sizes.
+*/
+SC.MenuPane.TINY_MENU_ITEM_HEIGHT = 10;
+SC.MenuPane.TINY_MENU_ITEM_SEPARATOR_HEIGHT = 2;
+SC.MenuPane.TINY_MENU_HEIGHT_PADDING = 2;
+SC.MenuPane.TINY_SUBMENU_OFFSET_X = 0;
+
+SC.MenuPane.SMALL_MENU_ITEM_HEIGHT = 16;
+SC.MenuPane.SMALL_MENU_ITEM_SEPARATOR_HEIGHT = 7;
+SC.MenuPane.SMALL_MENU_HEIGHT_PADDING = 4;
+SC.MenuPane.SMALL_SUBMENU_OFFSET_X = 2;
+
+SC.MenuPane.REGULAR_MENU_ITEM_HEIGHT = 20;
+SC.MenuPane.REGULAR_MENU_ITEM_SEPARATOR_HEIGHT = 9;
+SC.MenuPane.REGULAR_MENU_HEIGHT_PADDING = 6;
+SC.MenuPane.REGULAR_SUBMENU_OFFSET_X = 2;
+
+SC.MenuPane.LARGE_MENU_ITEM_HEIGHT = 60;
+SC.MenuPane.LARGE_MENU_ITEM_SEPARATOR_HEIGHT = 20;
+SC.MenuPane.LARGE_MENU_HEIGHT_PADDING = 0;
+SC.MenuPane.LARGE_SUBMENU_OFFSET_X = 4;
+
+SC.MenuPane.HUGE_MENU_ITEM_HEIGHT = 20;
+SC.MenuPane.HUGE_MENU_ITEM_SEPARATOR_HEIGHT = 9;
+SC.MenuPane.HUGE_MENU_HEIGHT_PADDING = 0;
+SC.MenuPane.HUGE_SUBMENU_OFFSET_X = 0;

data/lib/frameworks/sproutcore/frameworks/experimental/frameworks/forms/views/form.js

@@ -4,52 +4,54 @@
 //            Portions ©2008-2011 Apple Inc. All rights reserved.
 // License:   Licensed under MIT license (see license.js)
 // ==========================================================================
-
 /*globals Forms */
 
-/** @class
-FormView
-FormView is a lot like a normal view. However, in addition to the childViews
-collection, it has a fields collection. The items referenced here are NOT
-just children; they are explicity stated in the array fields, which works
-just like childViews, but marks fields to be laid out automatically.
+sc_require("mixins/emptiness");
+sc_require("mixins/edit_mode");
+sc_require("views/form_row");
 
-Usually, you will place rows into the FormView:
+/** 
+  @class
 
-    childViews: "fullName gender".w(),
-    contentBinding: 'MyApp.personController',
+  FormView is a lot like a normal view. However, in addition to the childViews
+  collection, it has a fields collection. The items referenced here are NOT
+  just children; they are explicity stated in the array fields, which works
+  just like childViews, but marks fields to be laid out automatically.
 
-    fullName: SC.FormView.row("Name:", SC.TextFieldView.extend({
-      layout: {height: 20, width: 150}
-    })),
+  Usually, you will place rows into the FormView:
+  
+      childViews: "fullName gender".w(),
+      contentBinding: 'MyApp.personController',
 
-    gender: SC.FormView.row("Gender:", SC.RadioView.design({
-      layout: {width: 150, height: 40, centerY: 0},
-      items: ["male", "female"]
-    }))
+      fullName: SC.FormView.row("Name:", SC.TextFieldView.extend({
+        layout: {height: 20, width: 150}
+      })),
 
-The name of the row (ie. 'fullName'), is passed down to the *FieldView, and used as the key
-to bind the value property to the content. In this case it will bind content.fullName to the
-value property of the textFieldView. Easy!
+      gender: SC.FormView.row("Gender:", SC.RadioView.design({
+        layout: {width: 150, height: 40, centerY: 0},
+        items: ["male", "female"]
+      }))
 
-One important thing about the field collection: It can contain any type of
-view, including other FormViews or subclasses of FormView.
+  The name of the row (ie. 'fullName'), is passed down to the *FieldView, and used as the key
+  to bind the value property to the content. In this case it will bind content.fullName to the
+  value property of the textFieldView. Easy!
 
-This is important, because this is how you make nice rows that have a
-label and a field: these rows are actually subclasses of FormView itself.
+  One important thing about the field collection: It can contain any type of
+  view, including other FormViews or subclasses of FormView.
 
-## Editing
-The form does not allow editing by default; editing must be started by calling
-beginEditing.
+  This is important, because this is how you make nice rows that have a
+  label and a field: these rows are actually subclasses of FormView itself.
 
+  Editing
+  -------
+  
+  The form does not allow editing by default; editing must be started by calling
+  beginEditing.
 
-@extends SC.View
-@implements SC.Editable
-*/
 
-sc_require("mixins/emptiness");
-sc_require("mixins/edit_mode");
-sc_require("views/form_row");
+  @extends SC.View
+  @implements SC.Editable
+*/
 
 SC.FormView = SC.View.extend(SC.FlowedLayout, SC.CalculatesEmptiness, SC.FormsEditMode, /** @scope SC.FormView.prototype */ {
   layoutDirection: SC.LAYOUT_VERTICAL,

data/lib/frameworks/sproutcore/frameworks/foundation/core.js

@@ -15,9 +15,9 @@ SC.FOCUS_ALL_CONTROLS = YES;
 SC.ready(function() {
   var focus = SC.SAFARI_FOCUS_BEHAVIOR;
   if (focus !== null && focus !== undefined) {
-    //@ if (debug)
+    // @if (debug)
     SC.Logger.warn("SC.SAFARI_FOCUS_BEHAVIOR is deprecated. Please use SC.FOCUS_ALL_CONTROLS instead");
-    //@ endif
+    // @endif
     SC.FOCUS_ALL_CONTROLS = SC.SAFARI_FOCUS_BEHAVIOR;
   }
 });

data/lib/frameworks/sproutcore/frameworks/foundation/mixins/auto_resize.js

@@ -8,7 +8,7 @@
 sc_require("system/utils/string_measurement");
 
 /**
-  @mixin
+  @class
   Use this mixin to make your view automatically resize based upon its value,
   title, or other string property. Only works for views that support automatic
   resizing.
@@ -134,6 +134,9 @@ SC.AutoResize = {
       // if so, cancel the old request and make a new one
       SC.AutoResizeManager.cancelMeasurementForView(this, requestedBatchResizeId);
       SC.AutoResizeManager.scheduleMeasurementForView(this, batchResizeId);
+
+      // update the requested batchResizeId to the new id
+      this._scar_requestedBatchResizeId = batchResizeId;
     }
   }.observes('batchResizeId'),
 
@@ -151,7 +154,7 @@ SC.AutoResize = {
 
     this._scar_measurementPending = YES;
     this._scar_requestedBatchResizeId = batchResizeId;
-  },
+  }.observes('isVisible'),
 
   /**
     Measures the size of the view.
@@ -160,7 +163,8 @@ SC.AutoResize = {
   */
   measureSize: function(batch) {
     var metrics, layer, value = this.get('autoResizeText'),
-        autoSizePadding, paddingHeight, paddingWidth;
+        autoSizePadding, paddingHeight, paddingWidth,
+        ignoreEscape = !this.get('escapeHTML');
 
     // There are two special cases.
     //   - empty: we should do nothing. The metrics are 0.
@@ -172,7 +176,7 @@ SC.AutoResize = {
     if (SC.none(value) || value === "") {
       metrics = { width: 0, height: 0 };
     } else if (batch) {
-      metrics = SC.measureString(value);
+      metrics = SC.measureString(value, ignoreEscape);
     } else {
       // Normal resize pattern: get our own layer, pass it as a template to SC.metricsForString.
       layer = this.get('autoResizeLayer');
@@ -181,7 +185,7 @@ SC.AutoResize = {
         return;
       }
 
-      metrics = SC.metricsForString(value, layer);
+      metrics = SC.metricsForString(value, layer, this.get('classNames'), ignoreEscape);
     }
 
     // metrics should include padding
@@ -318,13 +322,16 @@ SC.AutoResizeManager = {
       if (batches.hasOwnProperty(tag)) {
         views = batches[tag];
 
-        // step through until you find one with a layer
+        // step through until you find one with a layer and also visible
         while ((view = views.pop())) {
+
+          if(!view.get('isVisible')) continue;
+
           layer = view.get('autoResizeLayer');
 
           // use the layer to prepare the measurement
           if(layer) {
-            SC.prepareStringMeasurement(layer);
+            SC.prepareStringMeasurement(layer, view.get('classNames'));
             view.measureSize(YES);
             break;
           }
@@ -332,7 +339,7 @@ SC.AutoResizeManager = {
 
         // now measure the rest using the same settings
         while ((view = views.pop())) {
-          view.measureSize(YES);
+          if(view.get('isVisible')) view.measureSize(YES);
         }
 
         SC.teardownStringMeasurement();

data/lib/frameworks/sproutcore/frameworks/foundation/mixins/button.js

@@ -5,10 +5,7 @@
 // License:   Licensed under MIT license (see license.js)
 // ==========================================================================
 
-SC.Button = {
-  
-  initMixin: function(){
-    SC.Logger.warn("SC.Button is deprecated and does nothing. Subclass SC.ButtonView instead.");
-  }
-  
-} ;
+SC.Button.initMixin = function(){
+  throw "SC.Button is deprecated as a mixin and is now a subclass of SC.TemplateView. Subclass SC.ButtonView instead.";
+};
+

data/lib/frameworks/sproutcore/frameworks/foundation/mixins/flowed_layout.js

@@ -280,19 +280,22 @@ SC.FlowedLayout = {
     // if it is a spacer, we must set the dimension that it
     // expands in to 0.
     if (view.get('isSpacer')) {
-      if (this.get('layoutDirection') === SC.LAYOUT_HORIZONTAL) calc.width = 0;
-      else calc.height = 0;
+      if (this.get('layoutDirection') === SC.LAYOUT_HORIZONTAL) {
+        calc.width = view.get('layout').minWidth || 0;
+      } else {
+        calc.height = view.get('layout').minHeight || 0;
+      }
     }
     
     // if it has a fillWidth/Height, clear it for later
     if (
       this.get('layoutDirection') === SC.LAYOUT_HORIZONTAL && view.get('fillHeight')
     ) {
-      calc.height = 0;
+      calc.height = view.get('layout').minHeight || 0;
     } else if (
       this.get('layoutDirection') === SC.LAYOUT_VERTICAL && view.get('fillWidth')
     ) {
-      calc.width = 0;
+      calc.width = view.get('layout').minWidth || 0;
     }
     
     // return
@@ -305,12 +308,34 @@ SC.FlowedLayout = {
   }.property('calculatedWidth', 'calculatedHeight'),
   
   /** @private */
+
+  // the maximum row length when all flexible items are collapsed.
+  _scfl_maxCollapsedRowLength: 0,
+
+  // the total row size when all flexible rows are collapsed.
+  _scfl_totalCollapsedRowSize: 0,
+
+
   _scfl_calculatedSizeDidChange: function() {
     if(this.get('autoResize')) {
-      if(this.get('shouldResizeWidth')) this.adjust('minWidth', this.get('calculatedWidth'));
-      if(this.get('shouldResizeHeight')) this.adjust('minHeight', this.get('calculatedHeight'));
+      if (this.get('layoutDirection') == SC.LAYOUT_VERTICAL) {
+        if (this.get('shouldResizeHeight')) {
+          this.adjust('minHeight', this.get('_scfl_maximumCollapsedRowLength'));
+        }
+
+        if (this.get('shouldResizeWidth')) {
+          this.adjust('minWidth', this.get('_scfl_totalCollapsedRowSize'));
+        }
+      } else {
+        if (this.get('shouldResizeWidth')) {
+          this.adjust('minWidth', this.get('_scfl_maximumCollapsedRowLength'));
+        }
+        if (this.get('shouldResizeHeight')) {
+          this.adjust('minHeight', this.get('_scfl_totalCollapsedRowSize'));
+        }
+      }
     }
-  }.observes('autoResize', 'shouldResizeWidth', 'calculatedWidth', 'shouldResizeHeight', 'calculatedHeight'),
+  }.observes('autoResize', 'shouldResizeWidth', '_scfl_maximumCollapsedRowLength', '_scfl_totalCollapsedRowSize', 'shouldResizeHeight'),
   
   /**
     @private
@@ -344,6 +369,14 @@ SC.FlowedLayout = {
       // The rows array starts empty. It will get filled out by the method
       // _scfl_distributeChildrenIntoRows.
       rows: undefined,
+
+
+      // the maximum row length where all collapsible items are collapsed.
+      maximumCollapsedRowLength: 0,
+
+      // the total sizes of all rows when collapsed (With flex-height rows
+      // at minimum size)
+      totalCollapsedRowSize: 0,
       
       // These properties are calculated once here, but later used by
       // the various methods.
@@ -438,12 +471,13 @@ SC.FlowedLayout = {
       // this must be set before we check if the child is included because even
       // if it isn't included, we need to remember that there is a line break
       // for later
-      newRowPending = newRowPending || (idx !== startingAt && child.get('startsNewRow'));
+      newRowPending = newRowPending || (items.length > 0 && child.get('startsNewRow'));
 
       if (!this.shouldIncludeChildInFlow(idx, child)) continue;
       
       childSize = this.flowSizeForChild(idx, child);
       spacing = this.flowSpacingForChild(idx, child);
+
       childSpacedSize = {
         width: childSize.width + spacing.left + spacing.right,
         height: childSize.height + spacing.top + spacing.bottom
@@ -490,6 +524,7 @@ SC.FlowedLayout = {
     }
     
     row.rowLength = itemOffset;
+    row.plan.maximumCollapsedRowLength = Math.max(row.rowLength, row.plan.maximumCollapsedRowLength);
     row.items = items;
     return idx;
   },
@@ -569,6 +604,8 @@ SC.FlowedLayout = {
     row.shouldExpand = shouldExpand;
     row.rowLength = position - row.plan.rowStartPadding; // row length does not include padding
     row.rowSize = rowSize;
+
+    row.plan.totalCollapsedRowSize += row.rowSize;
     
   },
 
@@ -658,8 +695,9 @@ SC.FlowedLayout = {
     this.beginPropertyChanges();
 
     this.set('calculatedHeight', isVertical ? longestRow : totalSize);
-
     this.set('calculatedWidth', isVertical ? totalSize : longestRow);
+    this.set('_scfl_maximumCollapsedRowLength', plan.maximumCollapsedRowLength);
+    this.set('_scfl_totalCollapsedRowSize', plan.totalCollapsedRowSize);
 
     this.endPropertyChanges();
   },
@@ -699,11 +737,15 @@ SC.FlowedLayout = {
   
   /** @private */
   _scfl_frameDidChange: function() {
-    var frame = this.get("frame"), lf = this._scfl_lastFrameSize;
-    this._scfl_lastFrameSize = frame;
+    if (this._scfl_isChangingSize) return;
+
+    var frame = this.get("frame"), lf = this._scfl_lastFrameSize || {};
+    this._scfl_lastFrameSize = SC.clone(frame);
+
+    if (lf.width == frame.width && lf.height == frame.height) {
+      return;
+    }
 
-    if (lf && lf.width == frame.width && lf.height == frame.height) return;
-    
     this.invokeOnce("_scfl_tile");
   }.observes("frame"),