sproutcore 1.0.1049.pre.2 → 1.4.0.rc

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

@@ -99,7 +99,16 @@ SC.SelectFieldView = SC.FieldView.extend(
   sortObjects: function(objects) {
     if(!this.get('disableSort')){
       var nameKey = this.get('sortKey') || this.get('nameKey') ;
-      objects = objects.sortProperty(nameKey);
+      if(nameKey) objects = objects.sortProperty(nameKey);
+      else{
+        objects = objects.sort(function(a,b) {
+          if (nameKey) {
+            a = a.get ? a.get(nameKey) : a[nameKey] ;
+            b = b.get ? b.get(nameKey) : b[nameKey] ;
+          }
+          return (a<b) ? -1 : ((a>b) ? 1 : 0) ;
+        }) ;
+      }
     }
     return objects ;
   },

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

@@ -25,6 +25,13 @@ SC.SliderView = SC.View.extend(SC.Control,
   
   classNames: 'sc-slider-view',
   
+  /** 
+    The DOM element that displays the handle.  This element will have its
+    top-left corner updated to reflect the current state of the slider.  Use
+    margin-offsets to properly position your handle over this location.
+  */
+  handleSelector: 'img.sc-handle',
+  
   /**
     Bind this to the current value of the progress bar.  Note that by default 
     an empty value will disable the progress bar and a multiple value too make 
@@ -76,11 +83,9 @@ SC.SliderView = SC.View.extend(SC.Control,
   
   displayProperties: 'value minimum maximum'.w(),
   
-  createRenderer: function(t) {
-    return t.slider();
-  },
-  
-  updateRenderer: function(r) {
+  render: function(context, firstTime) {
+    sc_super();
+    
     var min = this.get('minimum'),
         max = this.get('maximum'),
         value = this.get('value'),
@@ -97,10 +102,19 @@ SC.SliderView = SC.View.extend(SC.Control,
     // determine the percent across
     if(value!==0) value = Math.floor((value - min) / (max - min) * 100);
     
-    // set atributes
-    r.attr({
-      "value": value
-    });
+    if(firstTime) {
+      var blankImage = SC.BLANK_IMAGE_URL;
+      context.push('<span class="sc-inner">',
+                    '<span class="sc-leftcap"></span>',
+                    '<span class="sc-rightcap"></span>',
+                    '<img src="', blankImage, 
+                    '" class="sc-handle" style="left: ', value, '%" />',
+                    '</span>');
+    }
+    else {
+      this.$(this.get('handleSelector')).css('left', value + "%");
+    }
+    
   },
   
   _isMouseDown: NO,
@@ -109,7 +123,7 @@ SC.SliderView = SC.View.extend(SC.Control,
     if (!this.get('isEnabled')) return YES; // nothing to do...
     this.set('isActive', YES);
     this._isMouseDown = YES ;
-    return this._triggerHandle(evt, YES);
+    return this._triggerHandle(evt, true);
   },
   
   // mouseDragged uses same technique as mouseDown.
@@ -156,7 +170,7 @@ SC.SliderView = SC.View.extend(SC.Control,
   */
   _triggerHandle: function(evt, firstEvent) {
     var width = this.get('frame').width,
-        min = this.get('minimum'), max=this.get('maximum'),
+        min = this.get('minimum'), max=this.get('maximum'),  
         step = this.get('step'), v=this.get('value'), loc;
         
     if(firstEvent){    
@@ -166,32 +180,19 @@ SC.SliderView = SC.View.extend(SC.Control,
       loc = evt.pageX-this._evtDiff;
     }
     
-    // convert to percentage
-    loc = Math.max(0, Math.min(loc / width, 1));
-    
-    // if the location is NOT in the general vicinity of the slider, we assume
-    // that the mouse pointer or touch is in the center of where the knob should be.
-    // otherwise, if we are starting, we need to do extra to add an offset
-    if (firstEvent) {
-      var value = this.get("value");
-      value = (value - min) / (max - min);
-      
-      // if the value and the loc are within 16px
-      if (Math.abs(value * width - loc * width) < 16) this._offset = value - loc;
-      else this._offset = 0;
-    }
+    // constrain loc to 8px on either side (left to allow knob overhang)
+    loc = Math.max(Math.min(loc,width-8), 8) - 8;
+    width -= 16 ; // reduce by margin
     
-    // add offset
-    loc = loc + this._offset;
+    // convert to percentage
+    loc = loc / width ;
     
     // convert to value using minimum/maximum then constrain to steps
     loc = min + ((max-min)*loc);
     if (step !== 0) loc = Math.round(loc / step) * step ;
-    
+
     // if changes by more than a rounding amount, set v.
-    if (Math.abs(v-loc)>=0.01) {
-      this.set('value', loc); // adjust 
-    }
+    if (Math.abs(v-loc)>=0.01) this.set('value', loc); // adjust 
     return YES ;
   },
   
@@ -207,7 +208,7 @@ SC.SliderView = SC.View.extend(SC.Control,
       this._isFocused = YES ;
       this.becomeFirstResponder();
       if (this.get('isVisibleInWindow')) {
-        if (this.renderer) this.renderer.focus();
+        this.$()[0].focus();
       }
     }
   },
@@ -282,4 +283,4 @@ SC.SliderView = SC.View.extend(SC.Control,
     .endPropertyChanges();
   }  
   
-});
+});

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

@@ -58,6 +58,13 @@ SC.RESIZE_BOTTOM_RIGHT = 'resize-bottom-right';
   This property should be set when the view is created. Changing it
   dynamically will have an unknown effect.
   
+  @property {Boolean} layoutDirection Either SC.HORIZONTAL or SC.VERTICAL.
+  Defaults to SC.HORIZONTAL. Use the :direction option with the split_view
+  viewhelper.
+  
+  @property {Boolean} canCollapseViews Set to NO when you don't want any of
+  the child views to collapse. Defaults to YES. 
+  
   In addition, the top/left and bottom/right child views can have these
   properties:
   
@@ -84,15 +91,11 @@ SC.SplitView = SC.View.extend(
     Direction of layout.  Must be SC.LAYOUT_HORIZONTAL or SC.LAYOUT_VERTICAL.
     
     @property {String}
-    @default SC.LAYOUT_HORIZONTAL
   */
   layoutDirection: SC.LAYOUT_HORIZONTAL,
   
   /**
     Set to NO to disable collapsing for all views.
-    
-    @property {Boolean}
-    @default YES
   */
   canCollapseViews: YES,
   
@@ -103,8 +106,6 @@ SC.SplitView = SC.View.extend(
     | SC.RESIZE_BOTTOM_RIGHT | (default) resizes bottomRightView |
     | SC.RESIZE_TOP_LEFT | resized topLeftView |
     
-    @property {String}
-    @default SC.RESIZE_BOTTOM_RIGHT
   */
   autoresizeBehavior: SC.RESIZE_BOTTOM_RIGHT,
   
@@ -117,87 +118,21 @@ SC.SplitView = SC.View.extend(
     autoresizeBehavior.
     
     @property {Number}
-    @default 0.5
   */
   defaultThickness: 0.5,
-
-  /**
-    Sets minimum thickness of topLeft view.
-
-    @property {Number}
-    @default null
-  */
-  topLeftMinThickness: null,
-
-  /**
-    Sets maximum thickness of topLeft view.
-
-    @property {Number}
-    @default null
-  */
-  topLeftMaxThickness: null,
-
-  /**
-    Sets minimum thickness of bottomRight view.
-
-    @property {Number}
-    @default null
-  */
-  bottomRightMinThickness: null,
-
-  /**
-    Sets maximum thickness of bottomRight view.
-
-    @property {Number}
-    @default null
-  */
-  bottomRightMaxThickness: null,
-
-  /**
-    Sets thickness of divider.
-
-    @property {Number}
-    @default null
-  */
-  dividerThickness: null,
- 
+  
   /**
     Yes, we're a split view.
-    
-    @property {Boolean}
-    @default YES
   */
   isSplitView: YES,
   
-  /**
-    The view to use for the top left
-    
-    @property {SC.View}
-    @default SC.View
-  */
+  // add default views
   topLeftView: SC.View,
-
-  /**
-    The view to use for the divider
-    
-    @property {SC.View}
-    @default SC.SplitDividerView
-  */
   dividerView: SC.SplitDividerView,
-  
-  /**
-    The view to use for the bottom right
-    
-    @property {SC.View}
-    @default SC.View
-  */
   bottomRightView: SC.View,
   
   /**
     The current thickness for the topLeftView
-    
-    @property {Number}
-    @isReadOnly
   */
   topLeftThickness: function() {
     var view = this.get('topLeftView');
@@ -206,9 +141,6 @@ SC.SplitView = SC.View.extend(
 
   /**
     The current thickness for the bottomRightView
-    
-    @property {Number}
-    @isReadOnly
   */
   bottomRightThickness: function() {
     var view = this.get('bottomRightView');
@@ -216,21 +148,16 @@ SC.SplitView = SC.View.extend(
   }.property('bottomRightView').cacheable(),
   
   /**
-    The cursor thumb views should use for themselves
-    
-    @property {SC.Cursor}
-    @default null
+    @property {SC.Cursor} the cursor thumb view should use for themselves
   */
   thumbViewCursor: null,
   
   /**
     Used by split divider to decide if the view can be collapsed.
-    
-    @property {Boolean}
-    @isReadOnly
   */
   canCollapseView: function(view) {
-    return this.invokeDelegateMethod(this.delegate, 'splitViewCanCollapse', this, view);
+    return this.invokeDelegateMethod(this.delegate, 'splitViewCanCollapse', 
+      this, view) ;
   },
   
   /**
@@ -240,35 +167,28 @@ SC.SplitView = SC.View.extend(
     @returns the view with the width.
   */
   thicknessForView: function(view) {
-    var direction = this.get('layoutDirection'),
-        ret = view.get('frame');
-    return (direction === SC.LAYOUT_HORIZONTAL) ? ret.width : ret.height;
+    var direction = this.get('layoutDirection') ,
+        ret = view.get('frame') ;
+    return (direction === SC.LAYOUT_HORIZONTAL) ? ret.width : ret.height ;
   },
   
-  /**
-    Creates the topLeftView/dividerView/bottomRightView and adds them to the
-    childViews array
-    
-    @returns SC.View the SplitDivider view (this)
-  */
   createChildViews: function() {
-    var childViews = [],
-        views = ['topLeftView', 'dividerView', 'bottomRightView'],
-        l = views.length,
-        view, i;
-    
-    for (i=0; i<l; ++i) {
-      if (view = this.get(views[i])) {
-        view = this[views[i]] = this.createChildView(view, {
+    var childViews = [] ,
+        viewAry = ['topLeftView', 'dividerView', 'bottomRightView'] ,
+        view, idx, len ;
+    
+    for (idx=0, len=viewAry.length; idx<len; ++idx) {
+      if (view = this.get(viewAry[idx])) {
+        view = this[viewAry[idx]] = this.createChildView(view, {
           layoutView: this,
-          rootElementPath: [i]
-        });
-        childViews.push(view);
+          rootElementPath: [idx]
+        }) ;
+        childViews.push(view) ;
       }
     }
     
-    this.set('childViews', childViews);
-    return this;
+    this.set('childViews', childViews) ;
+    return this ; 
   },
   
   /**
@@ -279,60 +199,56 @@ SC.SplitView = SC.View.extend(
     that they can resize appropriately.
   */
   updateChildLayout: function() {
-    var topLeftView = this.get('topLeftView'),
-        bottomRightView = this.get('bottomRightView'),
-        dividerView = this.get('dividerView'),
-        autoresizeBehavior = this.get('autoresizeBehavior'),
-        direction = this.get('layoutDirection'),
-        frame = this.get('frame'),
-        topLeftThickness = this._desiredTopLeftThickness,
-        dividerThickness = this.get('dividerThickness'),
-        splitViewThickness = (direction === SC.LAYOUT_HORIZONTAL) ? frame.width : frame.height,
-        bottomRightThickness = splitViewThickness - dividerThickness - topLeftThickness,
-        layout, isCollapsed;
-    
-    dividerThickness = (!SC.none(dividerThickness)) ? dividerThickness : 7;
+    var topLeftView = this.get('topLeftView') ,
+        bottomRightView = this.get('bottomRightView') ,
+        dividerView = this.get('dividerView') ,
+        direction = this.get('layoutDirection') ,
+        topLeftThickness = this._desiredTopLeftThickness ;
+    var dividerThickness = this.get('dividerThickness') ;
+        dividerThickness = (!SC.none(dividerThickness)) ? dividerThickness : 7 ;
+    var splitViewThickness = (direction === SC.LAYOUT_HORIZONTAL) ? this.get('frame').width : this.get('frame').height ,
+        bottomRightThickness = splitViewThickness - dividerThickness - topLeftThickness ,
+        autoresizeBehavior = this.get('autoresizeBehavior') ,
+        layout , isCollapsed ;
+    
     
     // top/left view
-    isCollapsed = topLeftView.get('isCollapsed') || NO;
-    topLeftView.setIfChanged('isVisible', !isCollapsed);
+    isCollapsed = topLeftView.get('isCollapsed') || NO ;
+    topLeftView.setIfChanged('isVisible', !isCollapsed) ;
     layout = SC.clone(topLeftView.get('layout'));
-    
     if (direction === SC.LAYOUT_HORIZONTAL) {
-      layout.top = 0;
-      layout.left = 0;
-      layout.bottom = 0;
-      
+      layout.top = 0 ;
+      layout.left = 0 ;
+      layout.bottom = 0 ;
       switch (autoresizeBehavior) {
         case SC.RESIZE_BOTH:
           throw "SC.RESIZE_BOTH is currently unsupported.";
         case SC.RESIZE_TOP_LEFT:
-          layout.right = bottomRightThickness + dividerThickness;
-          delete layout.width;
-          break;
+          layout.right = bottomRightThickness + dividerThickness ;
+          delete layout.width ;
+          break ;
         case SC.RESIZE_BOTTOM_RIGHT:
-          delete layout.right;
-          delete layout.height;
-          layout.width = topLeftThickness;
-          break;
+          delete layout.right ;
+          delete layout.height ;
+          layout.width = topLeftThickness ;
+          break ;
       }
     } else {
       layout.top = 0;
-      layout.left = 0;
-      layout.right = 0;
-      
+      layout.left = 0 ;
+      layout.right = 0 ;
       switch (autoresizeBehavior) {
         case SC.RESIZE_BOTH:
           throw "SC.RESIZE_BOTH is currently unsupported.";
         case SC.RESIZE_TOP_LEFT:
-          layout.bottom = bottomRightThickness + dividerThickness;
-          delete layout.height;
-          break;
+          layout.bottom = bottomRightThickness + dividerThickness ;
+          delete layout.height ;
+          break ;
         case SC.RESIZE_BOTTOM_RIGHT:
-          layout.height = topLeftThickness;
-          delete layout.bottom;
-          delete layout.width;
-          break;
+          delete layout.bottom ;
+          delete layout.width ;
+          layout.height = topLeftThickness ;
+          break ;
       }
     }
     topLeftView.set('layout', layout);
@@ -340,13 +256,11 @@ SC.SplitView = SC.View.extend(
     // split divider view
     if (dividerView) {
       layout = SC.clone(dividerView.get('layout'));
-      
       if (direction === SC.LAYOUT_HORIZONTAL) {
         layout.width = dividerThickness;
-        layout.top = 0;
-        layout.bottom = 0;
-        delete layout.height;
-        
+        delete layout.height ;
+        layout.top = 0 ;
+        layout.bottom = 0 ;
         switch (autoresizeBehavior) {
           case SC.RESIZE_BOTH:
             throw "SC.RESIZE_BOTH is currently unsupported.";
@@ -356,24 +270,23 @@ SC.SplitView = SC.View.extend(
             // delete layout.centerY ;
             //break ;
           case SC.RESIZE_TOP_LEFT:
-            layout.right = bottomRightThickness;
-            delete layout.left;
-            delete layout.centerX;
-            delete layout.centerY;
-            break;
+            delete layout.left ;
+            layout.right = bottomRightThickness ;
+            delete layout.centerX ;
+            delete layout.centerY ;
+            break ;
           case SC.RESIZE_BOTTOM_RIGHT:
-            layout.left = topLeftThickness;
-            delete layout.right;
-            delete layout.centerX;
-            delete layout.centerY;
-            break;
+            layout.left = topLeftThickness ;
+            delete layout.right ;
+            delete layout.centerX ;
+            delete layout.centerY ;
+            break ;
         }
       } else {
-        layout.height = dividerThickness;
-        layout.left = 0;
-        layout.right = 0;
-        delete layout.width;
-        
+        delete layout.width ;
+        layout.height = dividerThickness ;
+        layout.left = 0 ;
+        layout.right = 0 ;
         switch (autoresizeBehavior) {
           case SC.RESIZE_BOTH:
             throw "SC.RESIZE_BOTH is currently unsupported.";
@@ -383,16 +296,16 @@ SC.SplitView = SC.View.extend(
             // layout.centerY = topLeftThickness + (dividerThickness / 2) ;
             //break ;
           case SC.RESIZE_TOP_LEFT:
-            layout.bottom = bottomRightThickness;
-            delete layout.top;
-            delete layout.centerX;
-            delete layout.centerY;
+            delete layout.top ;
+            layout.bottom = bottomRightThickness ;
+            delete layout.centerX ;
+            delete layout.centerY ;
             break ;
           case SC.RESIZE_BOTTOM_RIGHT:
-            layout.top = topLeftThickness;
-            delete layout.bottom;
-            delete layout.centerX;
-            delete layout.centerY;
+            layout.top = topLeftThickness ;
+            delete layout.bottom ;
+            delete layout.centerX ;
+            delete layout.centerY ;
             break ;
         }
       }
@@ -400,126 +313,123 @@ SC.SplitView = SC.View.extend(
     }
     
     // bottom/right view
-    isCollapsed = bottomRightView.get('isCollapsed') || NO;
-    bottomRightView.setIfChanged('isVisible', !isCollapsed);
+    isCollapsed = bottomRightView.get('isCollapsed') || NO ;
+    bottomRightView.setIfChanged('isVisible', !isCollapsed) ;
     layout = SC.clone(bottomRightView.get('layout'));
-    
     if (direction === SC.LAYOUT_HORIZONTAL) {
-      layout.top = 0;
-      layout.bottom = 0;
-      layout.right = 0;
-      
+      layout.top = 0 ;
+      layout.bottom = 0 ;
+      layout.right = 0 ;
       switch (autoresizeBehavior) {
         case SC.RESIZE_BOTH:
           throw "SC.RESIZE_BOTH is currently unsupported.";
+          //break ;
         case SC.RESIZE_BOTTOM_RIGHT:
-          layout.left = topLeftThickness + dividerThickness;
-          delete layout.width;
-          break;
+          layout.left = topLeftThickness + dividerThickness ;
+          delete layout.width ;
+          break ;
         case SC.RESIZE_TOP_LEFT:
-          layout.width = bottomRightThickness;
-          delete layout.left;
-          break;
+          delete layout.left ;
+          layout.width = bottomRightThickness ;
+          break ;
       }
     } else {
-      layout.left = 0;
-      layout.right = 0;
-      layout.bottom = 0;
-      
+      layout.left = 0 ;
+      layout.right = 0 ;
+      layout.bottom = 0 ;
       switch (autoresizeBehavior) {
         case SC.RESIZE_BOTH:
           throw "SC.RESIZE_BOTH is currently unsupported.";
+          //break ;
         case SC.RESIZE_BOTTOM_RIGHT:
-          layout.top = topLeftThickness + dividerThickness;
-          delete layout.height;
-          break;
+          layout.top = topLeftThickness + dividerThickness ;
+          delete layout.height ;
+          break ;
         case SC.RESIZE_TOP_LEFT:
-          delete layout.top;
-          layout.height = bottomRightThickness;
-          break;
+          delete layout.top ;
+          layout.height = bottomRightThickness ;
+          break ;
       }
     }
     bottomRightView.set('layout', layout);
     
-    this
-      .notifyPropertyChange('topLeftThickness')
-      .notifyPropertyChange('bottomRightThickness');
+    this.notifyPropertyChange('topLeftThickness')
+        .notifyPropertyChange('bottomRightThickness');
   },
   
   /** @private */
   renderLayout: function(context, firstTime) {
     if (firstTime || this._recalculateDivider) {
-      
-      var layoutDirection = this.get('layoutDirection'),
-          frame = this.get('frame'),
-          elem = this.$(),
-          desiredThickness = this.get('defaultThickness') ,
-          autoResizeBehavior = this.get('autoresizeBehavior'),
-          dividerThickness = this.get('dividerThickness'),
-          splitViewThickness;
-      
       if (!this.get('thumbViewCursor')) {
-        this.set('thumbViewCursor', SC.Cursor.create());
+        this.set('thumbViewCursor', SC.Cursor.create()) ;
       }
       
-      dividerThickness = !SC.none(dividerThickness) ? dividerThickness : 7;
-      
+      var layoutDirection = this.get('layoutDirection') ,
+          fr = this.get('frame'),
+          splitViewThickness, elemRendered = this.$(),
+          desiredThickness = this.get('defaultThickness') ,
+          autoResizeBehavior = this.get('autoresizeBehavior') ;
+      var dividerThickness = this.get('dividerThickness') ;
+      dividerThickness = (!SC.none(dividerThickness)) ? dividerThickness : 7 ;
       // Turn a flag on to recalculate the spliting if the desired thickness
       // is a percentage
-      if (this._recalculateDivider === undefined && desiredThickness < 1) {
-        this._recalculateDivider = YES;
-      } else if (this._recalculateDivider) {
-        this._recalculateDivider = NO;
+      if(this._recalculateDivider===undefined && desiredThickness<1) {
+        this._recalculateDivider=YES;
       }
+      else if(this._recalculateDivider) this._recalculateDivider=NO;
       
-      if (elem[0]) {
-        splitViewThickness = (layoutDirection === SC.LAYOUT_HORIZONTAL) ? elem[0].offsetWidth : elem[0].offsetHeight;
-      } else {
-        splitViewThickness = (layoutDirection === SC.LAYOUT_HORIZONTAL) ? frame.width : frame.height;
-      }
       
+      if(elemRendered[0]) {
+        splitViewThickness = (layoutDirection === SC.LAYOUT_HORIZONTAL) ? 
+              elemRendered[0].offsetWidth : elemRendered[0].offsetHeight ;
+      }else{
+        splitViewThickness = (layoutDirection === SC.LAYOUT_HORIZONTAL) ? 
+              fr.width : fr.height ;
+      }
       // if default thickness is < 1, convert from percentage to absolute
-      if (SC.none(desiredThickness) || (desiredThickness > 0 && desiredThickness < 1)) {
-        desiredThickness = Math.floor((splitViewThickness - (dividerThickness)) * (desiredThickness || 0.5));
+      if (SC.none(desiredThickness) || 
+        (desiredThickness > 0 && desiredThickness < 1)) {
+        desiredThickness =  Math.floor((splitViewThickness - 
+                            (dividerThickness))* (desiredThickness || 0.5)) ;
       }
-      
       if (autoResizeBehavior === SC.RESIZE_BOTTOM_RIGHT) {
-        this._desiredTopLeftThickness = desiredThickness;
-      } else {
-        this._desiredTopLeftThickness = splitViewThickness - dividerThickness - desiredThickness ;
+        this._desiredTopLeftThickness = desiredThickness ;
+      } else { // (autoResizeBehavior === SC.RESIZE_TOP_LEFT)
+        this._desiredTopLeftThickness =  splitViewThickness 
+                                      - dividerThickness - desiredThickness ;
       }
       
       // make sure we don't exceed our min and max values, and that collapse 
       // settings are respected
       // cached values are required by _updateTopLeftThickness() below...
-      this._topLeftView = this.get('topLeftView');
-      this._bottomRightView = this.get('bottomRightView');
+      this._topLeftView = this.get('topLeftView') ;
+      this._bottomRightView = this.get('bottomRightView') ;
       this._topLeftViewThickness = this.thicknessForView(this.get('topLeftView'));
       this._bottomRightThickness = this.thicknessForView(this.get('bottomRightView'));
-      this._dividerThickness = this.get('dividerThickness');
-      this._layoutDirection = this.get('layoutDirection');
+      this._dividerThickness = this.get('dividerThickness') ;
+      this._layoutDirection = this.get('layoutDirection') ;
       
       // this handles min-max settings and collapse parameters
-      this._updateTopLeftThickness(0);
+      this._updateTopLeftThickness(0) ;
       
       // update the cursor used by thumb views
-      this._setCursorStyle();
+      this._setCursorStyle() ;
       
       // actually set layout for our child views
-      this.updateChildLayout();
+      this.updateChildLayout() ;
     }
-    
-    sc_super();
+    sc_super() ;
   },
   
   /** @private */
   render: function(context, firstTime) {
-    sc_super();
+    sc_super() ;
     
-    if (this._inLiveResize) this._setCursorStyle();
+    if (this._inLiveResize) this._setCursorStyle() ;
     
-    if (this.get('layoutDirection') === SC.LAYOUT_HORIZONTAL) context.addClass('sc-horizontal');
-    else context.addClass('sc-vertical');
+    var dir = this.get('layoutDirection') ;
+    if (dir===SC.LAYOUT_HORIZONTAL) context.addClass('sc-horizontal') ;
+    else context.addClass('sc-vertical') ;
   },
   
   /**
@@ -532,44 +442,45 @@ SC.SplitView = SC.View.extend(
     @returns {Boolean}
   */
   mouseDownInThumbView: function(evt, thumbView) {
-    var responder = this.getPath('pane.rootResponder');
-    if (!responder) return NO; // nothing to do
+    var responder = this.getPath('pane.rootResponder') ;
+    if (!responder) return NO ; // nothing to do
       
     // we're not the source view of the mouseDown:, so we need to capture events manually to receive them
-    responder.dragDidStart(this);
+    responder.dragDidStart(this) ;
     
     // cache for later
-    this._mouseDownX = evt.pageX;
-    this._mouseDownY = evt.pageY;
-    this._thumbView = thumbView;
-    this._topLeftView = this.get('topLeftView');
-    this._bottomRightView = this.get('bottomRightView');
+    this._mouseDownX = evt.pageX ;
+    this._mouseDownY = evt.pageY ;
+    this._thumbView = thumbView ;
+    this._topLeftView = this.get('topLeftView') ;
+    this._bottomRightView = this.get('bottomRightView') ;
     this._topLeftViewThickness = this.thicknessForView(this.get('topLeftView'));
     this._bottomRightThickness = this.thicknessForView(this.get('bottomRightView'));
-    this._dividerThickness = this.get('dividerThickness');
-    this._layoutDirection = this.get('layoutDirection');
+    this._dividerThickness = this.get('dividerThickness') ;
+    this._layoutDirection = this.get('layoutDirection') ;
     
-    this.beginLiveResize();
-    this._inLiveResize = YES;
+    this.beginLiveResize() ;
+    this._inLiveResize = YES ;
     
-    return YES;
+    return YES ;
   },
   
   mouseDragged: function(evt) {
-    var offset = (this._layoutDirection === SC.LAYOUT_HORIZONTAL) ? evt.pageX - this._mouseDownX : evt.pageY - this._mouseDownY ;
-    this._updateTopLeftThickness(offset);
+    var offset = (this._layoutDirection === SC.LAYOUT_HORIZONTAL) ? evt.pageX 
+                - this._mouseDownX : evt.pageY - this._mouseDownY ;
+    this._updateTopLeftThickness(offset) ;
     return YES;
   },
   
   mouseUp: function(evt) {
     if (this._inLiveResize === YES) {
-    	this._thumbView = null; // avoid memory leaks
-    	this._inLiveResize = NO;
-    	this.endLiveResize();
-    	return YES;
+    	this._thumbView = null ; // avoid memory leaks
+    	this._inLiveResize = NO ;
+    	this.endLiveResize() ;
+    	return YES ;
 		}
 		
-		return NO;
+		return NO ;
   },
   
   touchesDragged: function(evt){
@@ -580,25 +491,25 @@ SC.SplitView = SC.View.extend(
     return this.mouseUp(evt);
   },
   
+  
   doubleClickInThumbView: function(evt, thumbView) {
     var view = this._topLeftView,
-        isCollapsed = view.get('isCollapsed') || NO;
-    
+        isCollapsed = view.get('isCollapsed') || NO ;
     if (!isCollapsed && !this.canCollapseView(view)) {
-      view = this._bottomRightView;
-      isCollapsed = view.get('isCollapsed') || NO;
+      view = this._bottomRightView ;
+      isCollapsed = view.get('isCollapsed') || NO ;
       if (!isCollapsed && !this.canCollapseView(view)) return NO;
     }
     
     if (!isCollapsed) {
       // remember thickness in it's uncollapsed state
-      this._uncollapsedThickness = this.thicknessForView(view);
+      this._uncollapsedThickness = this.thicknessForView(view)  ;
       // and collapse
       // this.setThicknessForView(view, 0) ;
       if (view === this._topLeftView) {
-        this._updateTopLeftThickness(this.topLeftThickness()*-1);
+        this._updateTopLeftThickness(this.topLeftThickness()*-1) ;
       } else {
-        this._updateBottomRightThickness(this.bottomRightThickness()*-1);
+        this._updateBottomRightThickness(this.bottomRightThickness()*-1) ;
       }
       
       // if however the splitview decided not to collapse, clear:
@@ -608,24 +519,24 @@ SC.SplitView = SC.View.extend(
     } else {
       // uncollapse to the last thickness in it's uncollapsed state
       if (view === this._topLeftView) {
-        this._updateTopLeftThickness(this._uncollapsedThickness);
+        this._updateTopLeftThickness(this._uncollapsedThickness) ;
       } else {
-        this._updateBottomRightThickness(this._uncollapsedThickness);
+        this._updateBottomRightThickness(this._uncollapsedThickness) ;
       }
-      view._uncollapsedThickness = null;
+      view._uncollapsedThickness = null ;
     }
-    this._setCursorStyle();
-    return true;
+    this._setCursorStyle() ;
+    return true ;
   },
   
   /** @private */
   _updateTopLeftThickness: function(offset) {
-    var topLeftView = this._topLeftView,
+    var topLeftView = this._topLeftView ,
         bottomRightView = this._bottomRightView,
         // the current thickness, not the original thickness
         topLeftViewThickness = this.thicknessForView(topLeftView), 
         bottomRightViewThickness = this.thicknessForView(bottomRightView),
-        minAvailable = this._dividerThickness,
+        minAvailable = this._dividerThickness ,
         maxAvailable = 0,
         proposedThickness = this._topLeftViewThickness + offset,
         direction = this._layoutDirection,
@@ -637,50 +548,53 @@ SC.SplitView = SC.View.extend(
         bottomRightThickness, tlCollapseAtThickness, brCollapseAtThickness;
     
     if (!topLeftView.get("isCollapsed")) {
-      maxAvailable += topLeftViewThickness;
+      maxAvailable += topLeftViewThickness ;
     }
     if (!bottomRightView.get("isCollapsed")) {
-      maxAvailable += bottomRightViewThickness;
+      maxAvailable += bottomRightViewThickness ;
     }
     
-    if (!SC.none(max)) thickness = Math.min(max, thickness);
-    if (!SC.none(min)) thickness = Math.max(min, thickness);
+    if (!SC.none(max)) thickness = Math.min(max, thickness) ;
+    if (!SC.none(min)) thickness = Math.max(min, thickness) ;
     
     // constrain to thickness set on bottom/right
-    max = this.get('bottomRightMaxThickness');
-    min = this.get('bottomRightMinThickness');
-    bottomRightThickness = maxAvailable - thickness;
+    max = this.get('bottomRightMaxThickness') ;
+    min = this.get('bottomRightMinThickness') ;
+    bottomRightThickness = maxAvailable - thickness ;
     if (!SC.none(max)) {
-      bottomRightThickness = Math.min(max, bottomRightThickness);
+      bottomRightThickness = Math.min(max, bottomRightThickness) ;
     }
     if (!SC.none(min)) {
-      bottomRightThickness = Math.max(min, bottomRightThickness);
+      bottomRightThickness = Math.max(min, bottomRightThickness) ;
     }
-    thickness = maxAvailable - bottomRightThickness;
+    thickness = maxAvailable - bottomRightThickness ;
     
     // constrain to thickness determined by delegate.
     thickness = this.invokeDelegateMethod(this.delegate, 
-      'splitViewConstrainThickness', this, topLeftView, thickness);
+      'splitViewConstrainThickness', this, topLeftView, thickness) ;
     
     // cannot be more than what's available
-    thickness = Math.min(thickness, maxAvailable);
+    thickness = Math.min(thickness, maxAvailable) ;
     
     // cannot be less than zero
-    thickness = Math.max(0, thickness);
+    thickness = Math.max(0, thickness) ;
     
-    tlCollapseAtThickness = topLeftView.get('collapseAtThickness');
-    if (!tlCollapseAtThickness) tlCollapseAtThickness = 0;
-    brCollapseAtThickness = bottomRightView.get('collapseAtThickness');
-    brCollapseAtThickness = SC.none(brCollapseAtThickness) ? maxAvailable : (maxAvailable - brCollapseAtThickness);
+    tlCollapseAtThickness = topLeftView.get('collapseAtThickness') ;
+    if (!tlCollapseAtThickness) tlCollapseAtThickness = 0 ;
+    brCollapseAtThickness = bottomRightView.get('collapseAtThickness') ;
+    brCollapseAtThickness = SC.none(brCollapseAtThickness) ?
+                      maxAvailable : (maxAvailable - brCollapseAtThickness);
     
-    if ((proposedThickness <= tlCollapseAtThickness) && this.canCollapseView(topLeftView)) {
+    if ((proposedThickness <= tlCollapseAtThickness) && 
+          this.canCollapseView(topLeftView)) {
       // want to collapse top/left, check if this doesn't violate the max thickness of bottom/right
       max = bottomRightView.get('maxThickness');
       if (!max || (minAvailable + maxAvailable) <= max) {
         // collapse top/left view, even if it has a minThickness
-        thickness = 0;
+        thickness = 0 ;
       }
-    } else if (proposedThickness >= brCollapseAtThickness && this.canCollapseView(bottomRightView)) {
+    } else if (proposedThickness >= brCollapseAtThickness && 
+              this.canCollapseView(bottomRightView)) {
       // want to collapse bottom/right, check if this doesn't violate the max thickness of top/left
       max = topLeftView.get('maxThickness');
       if (!max || (minAvailable + maxAvailable) <= max) {
@@ -691,11 +605,11 @@ SC.SplitView = SC.View.extend(
     
     // now apply constrained value
     if (thickness != this.thicknessForView(topLeftView)) {
-      this._desiredTopLeftThickness = thickness;
+      this._desiredTopLeftThickness = thickness ;
       
       // un-collapse if needed.
-      topLeftView.set('isCollapsed', thickness === 0);
-      bottomRightView.set('isCollapsed', thickness >= maxAvailable);
+      topLeftView.set('isCollapsed', thickness === 0) ;
+      bottomRightView.set('isCollapsed', thickness >= maxAvailable) ;
       
       this.updateChildLayout(); // updates child layouts
       this.displayDidChange(); // updates cursor
@@ -708,7 +622,7 @@ SC.SplitView = SC.View.extend(
         bottomRightView = this._bottomRightView,
         topLeftViewThickness = this.thicknessForView(topLeftView), // the current thickness, not the original thickness
         bottomRightViewThickness = this.thicknessForView(bottomRightView),
-        minAvailable = this._dividerThickness,
+        minAvailable = this._dividerThickness ,
         maxAvailable = 0,
         proposedThickness = this._topLeftViewThickness + offset,
         direction = this._layoutDirection,
@@ -719,32 +633,32 @@ SC.SplitView = SC.View.extend(
         min = this.get('topLeftMinThickness'),
         bottomRightThickness, tlCollapseAtThickness, brCollapseAtThickness;
     
-    if (!topLeftView.get("isCollapsed")) maxAvailable += topLeftViewThickness;
-    if (!bottomRightView.get("isCollapsed")) maxAvailable += bottomRightViewThickness;
+    if (!topLeftView.get("isCollapsed")) maxAvailable += topLeftViewThickness ;
+    if (!bottomRightView.get("isCollapsed")) maxAvailable += bottomRightViewThickness ;
     
-    if (!SC.none(max)) thickness = Math.min(max, thickness);
-    if (!SC.none(min)) thickness = Math.max(min, thickness);
+    if (!SC.none(max)) thickness = Math.min(max, thickness) ;
+    if (!SC.none(min)) thickness = Math.max(min, thickness) ;
     
     // constrain to thickness set on bottom/right
-    max = this.get('bottomRightMaxThickness');
-    min = this.get('bottomRightMinThickness');
+    max = this.get('bottomRightMaxThickness') ;
+    min = this.get('bottomRightMinThickness') ;
     bottomRightThickness = maxAvailable - thickness ;
-    if (!SC.none(max)) bottomRightThickness = Math.min(max, bottomRightThickness);
-    if (!SC.none(min)) bottomRightThickness = Math.max(min, bottomRightThickness);
-    thickness = maxAvailable - bottomRightThickness;
+    if (!SC.none(max)) bottomRightThickness = Math.min(max, bottomRightThickness) ;
+    if (!SC.none(min)) bottomRightThickness = Math.max(min, bottomRightThickness) ;
+    thickness = maxAvailable - bottomRightThickness ;
     
     // constrain to thickness determined by delegate.
-    thickness = this.invokeDelegateMethod(this.delegate, 'splitViewConstrainThickness', this, topLeftView, thickness);
+    thickness = this.invokeDelegateMethod(this.delegate, 'splitViewConstrainThickness', this, topLeftView, thickness) ;
     
     // cannot be more than what's available
-    thickness = Math.min(thickness, maxAvailable);
+    thickness = Math.min(thickness, maxAvailable) ;
     
     // cannot be less than zero
-    thickness = Math.max(0, thickness);
+    thickness = Math.max(0, thickness) ;
     
-    tlCollapseAtThickness = topLeftView.get('collapseAtThickness');
-    if (!tlCollapseAtThickness) tlCollapseAtThickness = 0;
-    brCollapseAtThickness = bottomRightView.get('collapseAtThickness');
+    tlCollapseAtThickness = topLeftView.get('collapseAtThickness') ;
+    if (!tlCollapseAtThickness) tlCollapseAtThickness = 0 ;
+    brCollapseAtThickness = bottomRightView.get('collapseAtThickness') ;
     brCollapseAtThickness = SC.none(brCollapseAtThickness) ? maxAvailable : (maxAvailable - brCollapseAtThickness);
     
     if ((proposedThickness <= tlCollapseAtThickness) && this.canCollapseView(topLeftView)) {
@@ -752,7 +666,7 @@ SC.SplitView = SC.View.extend(
       max = bottomRightView.get('maxThickness');
       if (!max || (minAvailable + maxAvailable) <= max) {
         // collapse top/left view, even if it has a minThickness
-        thickness = 0;
+        thickness = 0 ;
       }
     } else if (proposedThickness >= brCollapseAtThickness && this.canCollapseView(bottomRightView)) {
       // want to collapse bottom/right, check if this doesn't violate the max thickness of top/left
@@ -765,11 +679,11 @@ SC.SplitView = SC.View.extend(
     
     // now apply constrained value
     if (thickness != this.thicknessForView(topLeftView)) {
-      this._desiredTopLeftThickness = thickness;
+      this._desiredTopLeftThickness = thickness ;
       
       // un-collapse if needed.
-      topLeftView.set('isCollapsed', thickness === 0);
-      bottomRightView.set('isCollapsed', thickness >= maxAvailable);
+      topLeftView.set('isCollapsed', thickness === 0) ;
+      bottomRightView.set('isCollapsed', thickness >= maxAvailable) ;
       
       this.updateChildLayout(); // updates child layouts
       this.displayDidChange(); // updates cursor
@@ -790,21 +704,25 @@ SC.SplitView = SC.View.extend(
         // mouseDownInThumbView() to reflect the status of the drag
         tlThickness = this.thicknessForView(topLeftView),
         brThickness = this.thicknessForView(bottomRightView);
-    this._layoutDirection = this.get('layoutDirection');
+    this._layoutDirection = this.get('layoutDirection') ;
     if (topLeftView.get('isCollapsed') || 
-        tlThickness === this.get("topLeftMinThickness") || 
-        brThickness == this.get("bottomRightMaxThickness")) {
-      thumbViewCursor.set('cursorStyle', this._layoutDirection === SC.LAYOUT_HORIZONTAL ? "e-resize" : "s-resize");
+      tlThickness === this.get("topLeftMinThickness") || 
+      brThickness == this.get("bottomRightMaxThickness")) {
+      thumbViewCursor.set('cursorStyle', 
+        this._layoutDirection === SC.LAYOUT_HORIZONTAL ? "e-resize" : "s-resize") ;
     } else if (bottomRightView.get('isCollapsed') || 
-               tlThickness === this.get("topLeftMaxThickness") || 
-               brThickness == this.get("bottomRightMinThickness")) {
-      thumbViewCursor.set('cursorStyle', this._layoutDirection === SC.LAYOUT_HORIZONTAL ? "w-resize" : "n-resize");
+      tlThickness === this.get("topLeftMaxThickness") || 
+      brThickness == this.get("bottomRightMinThickness")) {
+      thumbViewCursor.set('cursorStyle', 
+        this._layoutDirection === SC.LAYOUT_HORIZONTAL ? "w-resize" : "n-resize") ;
     } else {
       if(SC.browser.msie) {
-        thumbViewCursor.set('cursorStyle', this._layoutDirection === SC.LAYOUT_HORIZONTAL ? "e-resize" : "n-resize");
+        thumbViewCursor.set('cursorStyle', 
+          this._layoutDirection === SC.LAYOUT_HORIZONTAL ? "e-resize" : "n-resize") ;
       }
       else {
-        thumbViewCursor.set('cursorStyle', this._layoutDirection === SC.LAYOUT_HORIZONTAL ? "ew-resize" : "ns-resize");
+        thumbViewCursor.set('cursorStyle', 
+          this._layoutDirection === SC.LAYOUT_HORIZONTAL ? "ew-resize" : "ns-resize") ;
       }
     }
   }.observes('layoutDirection'),
@@ -821,9 +739,9 @@ SC.SplitView = SC.View.extend(
     @returns {Boolean} YES to allow collapse.
   */
   splitViewCanCollapse: function(splitView, view) {
-    if (splitView.get('canCollapseViews') === NO) return NO;
-    if (view.get('canCollapse') === NO) return NO;
-    return YES;
+    if (splitView.get('canCollapseViews') === NO) return NO ;
+    if (view.get('canCollapse') === NO) return NO ;
+    return YES ;
   },
   
   /**
@@ -855,10 +773,9 @@ SC.SplitView = SC.View.extend(
     @returns {void}
   */
   viewDidResize: function() {
-    sc_super();
-    this
-      .notifyPropertyChange('topLeftThickness')
-      .notifyPropertyChange('bottomRightThickness');
+     sc_super();
+     this.notifyPropertyChange('topLeftThickness')
+         .notifyPropertyChange('bottomRightThickness');
    }.observes('layout')
 
 });