sproutcore 1.10.0 → 1.10.1

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

@@ -49,14 +49,14 @@ SC.MenuScrollerView = SC.ScrollerView.extend(
     @type Number
     @observes maximum
   */
-  value: function(key, val) {
+  value: function (key, val) {
     if (val !== undefined) {
       // Don't enforce the maximum now, because the scroll view could change
       // height and we want our content to stay put when it does.
-      this._value = val ;
+      this._value = val;
     } else {
-      var value = this._value || 0 ; // default value is at top/left
-      return Math.min(value, this.get('maximum')) ;
+      var value = this._value || 0; // default value is at top/left
+      return Math.min(value, this.get('maximum'));
     }
   }.property('maximum').cacheable(),
 
@@ -111,7 +111,7 @@ SC.MenuScrollerView = SC.ScrollerView.extend(
     @type String
     @default 'verticalScrollOffset'
   */
-  ownerScrollValueKey: function() {
+  ownerScrollValueKey: function () {
     return 'verticalScrollOffset';
   }.property('layoutDirection').cacheable(),
 
@@ -121,67 +121,53 @@ SC.MenuScrollerView = SC.ScrollerView.extend(
   //
 
   /** @private */
-  init: function() {
+  init: function () {
     // Set the scrollerThickness based on controlSize
     switch (this.get('controlSize')) {
-      case SC.TINY_CONTROL_SIZE:
-        this.set('scrollerThickness', SC.MenuScrollerView.TINY_SCROLLER_THICKNESS);
-        break;
-      case SC.SMALL_CONTROL_SIZE:
-        this.set('scrollerThickness', SC.MenuScrollerView.SMALL_SCROLLER_THICKNESS);
-        break;
-      case SC.REGULAR_CONTROL_SIZE:
-        this.set('scrollerThickness', SC.MenuScrollerView.REGULAR_SCROLLER_THICKNESS);
-        break;
-      case SC.LARGE_CONTROL_SIZE:
-        this.set('scrollerThickness', SC.MenuScrollerView.LARGE_SCROLLER_THICKNESS);
-        break;
-      case SC.HUGE_CONTROL_SIZE:
-        this.set('scrollerThickness', SC.MenuScrollerView.HUGE_SCROLLER_THICKNESS);
-        break;
+    case SC.TINY_CONTROL_SIZE:
+      this.set('scrollerThickness', SC.MenuScrollerView.TINY_SCROLLER_THICKNESS);
+      break;
+    case SC.SMALL_CONTROL_SIZE:
+      this.set('scrollerThickness', SC.MenuScrollerView.SMALL_SCROLLER_THICKNESS);
+      break;
+    case SC.REGULAR_CONTROL_SIZE:
+      this.set('scrollerThickness', SC.MenuScrollerView.REGULAR_SCROLLER_THICKNESS);
+      break;
+    case SC.LARGE_CONTROL_SIZE:
+      this.set('scrollerThickness', SC.MenuScrollerView.LARGE_SCROLLER_THICKNESS);
+      break;
+    case SC.HUGE_CONTROL_SIZE:
+      this.set('scrollerThickness', SC.MenuScrollerView.HUGE_SCROLLER_THICKNESS);
+      break;
     }
 
     return sc_super();
   },
 
   /** @private */
-  render: function(context, firstTime) {
-    context.addClass('sc-vertical') ;
+  render: function (context, firstTime) {
+    context.addClass('sc-vertical');
     context.addClass(this.get('controlSize'));
     if (firstTime) {
-      var direction = this.get('scrollDown') ? 'arrowDown' : 'arrowUp' ;
-      context.push('<span class="scrollArrow '+direction+'">&nbsp;</span>') ;
+      var direction = this.get('scrollDown') ? 'arrowDown' : 'arrowUp';
+      context.push('<span class="scrollArrow ' + direction + '">&nbsp;</span>');
     }
   },
 
   /** @private */
-  didCreateLayer: function() {
-    // var callback, amt, layer;
-    //
-    // callback = this._sc_scroller_scrollDidChange ;
-    // SC.Event.add(this.$(), 'scroll', this, callback) ;
-    //
-    // // set scrollOffset first time
-    // amt = this.get('value') ;
-    // layer = this.get('layer') ;
-    //
-    // layer.scrollTop = amt ;
+  willDestroyLayer: function () {
+    var callback = this._sc_scroller_scrollDidChange;
+    SC.Event.remove(this.$(), 'scroll', this, callback);
   },
 
   /** @private */
-  willDestroyLayer: function() {
-    var callback = this._sc_scroller_scrollDidChange ;
-    SC.Event.remove(this.$(), 'scroll', this, callback) ;
-  },
-
-  /** @private */
-  mouseEntered: function(evt) {
+  mouseEntered: function (evt) {
     this.set('isMouseOver', YES);
     this._invokeScrollOnMouseOver();
   },
 
   /** @private */
-  mouseExited: function(evt) {
+  mouseExited: function (evt) {
     this.set('isMouseOver', NO);
   },
 
@@ -190,38 +176,36 @@ SC.MenuScrollerView = SC.ScrollerView.extend(
     SC.MenuScroller and SC.MenuScroll use valueBinding so this function is
     not necessary.
   */
-  _sc_scroller_valueDidChange: function() {}.observes('value'),
+  _sc_scroller_valueDidChange: function () {}.observes('value'),
 
 
   /** @private */
-  _sc_scroller_armScrollTimer: function() {
+  _sc_scroller_armScrollTimer: function () {
     if (!this._sc_scrollTimer) {
-      SC.RunLoop.begin() ;
-      var method = this._sc_scroller_scrollDidChange ;
-      this._sc_scrollTimer = this.invokeLater(method, 50) ;
-      SC.RunLoop.end() ;
+      SC.run(function () {
+        var method = this._sc_scroller_scrollDidChange;
+        this._sc_scrollTimer = this.invokeLater(method, 50);
+      });
     }
   },
 
   /** @private */
-  _sc_scroller_scrollDidChange: function() {
+  _sc_scroller_scrollDidChange: function () {
     var now = Date.now(),
         last = this._sc_lastScroll,
         layer = this.get('layer'),
-        scroll = 0 ;
-
-    if (last && (now-last)<50) return this._sc_scroller_armScrollTimer() ;
-    this._sc_scrollTimer = null ;
-    this._sc_lastScroll = now ;
+        scroll = 0;
 
-    SC.RunLoop.begin();
+    if (last && (now - last) < 50) return this._sc_scroller_armScrollTimer();
+    this._sc_scrollTimer = null;
+    this._sc_lastScroll = now;
 
-    if (!this.get('isEnabledInPane')) return ; // nothing to do.
+    SC.run(function () {
+      if (!this.get('isEnabledInPane')) return; // nothing to do.
 
-    this._sc_scrollValue = scroll = layer.scrollTop ;
-    this.set('value', scroll) ; // will now enforce minimum and maximum
-
-    SC.RunLoop.end();
+      this._sc_scrollValue = scroll = layer.scrollTop;
+      this.set('value', scroll); // will now enforce minimum and maximum
+    });
   },
 
 
@@ -229,22 +213,22 @@ SC.MenuScrollerView = SC.ScrollerView.extend(
     Scroll the menu if it is is an up or down arrow. This is called by
     the function that simulates mouseOver.
   */
-  _scrollMenu: function(){
+  _scrollMenu: function () {
     var val = this.get('value'), newval;
-    if(this.get('scrollDown')) {
-      newval = val+this.verticalLineScroll;
-      if(newval<=this.get('maximum')){
+    if (this.get('scrollDown')) {
+      newval = val + this.verticalLineScroll;
+      if (newval <= this.get('maximum')) {
         this.set('value', newval);
       }
-    }
-    else {
-      newval = val-this.verticalLineScroll;
-      if(newval>=0){
+    } else {
+      newval = val - this.verticalLineScroll;
+      if (newval >= 0) {
         this.set('value', newval);
-      }else if(val<=this.verticalLineScroll && val>0){
+      } else if (val <= this.verticalLineScroll && val > 0) {
         this.set('value', 0);
       }
     }
+
     return YES;
   },
 
@@ -254,9 +238,9 @@ SC.MenuScrollerView = SC.ScrollerView.extend(
     isMouseOver which is turned on when mouseEntered is called and turned off
     when mouseExited is called.
   */
-  _invokeScrollOnMouseOver: function(){
+  _invokeScrollOnMouseOver: function () {
     this._scrollMenu();
-    if(this.get('isMouseOver')){
+    if (this.get('isMouseOver')) {
       this.invokeLater(this._invokeScrollOnMouseOver, 50);
     }
   }
@@ -474,11 +458,11 @@ SC.MenuScrollView = SC.ScrollView.extend(
   /**
     @param {SC.View} view
   */
-  scrollToVisible: function(view) {
+  scrollToVisible: function (view) {
     // if no view is passed, do default
     if (arguments.length === 0) return sc_super();
 
-    var contentView = this.get('contentView') ;
+    var contentView = this.get('contentView');
     if (!contentView) return NO; // nothing to do if no contentView.
 
     // get the frame for the view - should work even for views with static
@@ -488,7 +472,7 @@ SC.MenuScrollView = SC.ScrollView.extend(
 
     // convert view's frame to an offset from the contentView origin.  This
     // will become the new scroll offset after some adjustment.
-    vf = contentView.convertFrameFromView(vf, view.get('parentView')) ;
+    vf = contentView.convertFrameFromView(vf, view.get('parentView'));
 
     var vscroll2 = this.get('verticalScrollerView2');
     if (vscroll2 && vscroll2.get('isVisible')) {
@@ -511,22 +495,22 @@ SC.MenuScrollView = SC.ScrollView.extend(
     You may also want to override this method to handle layout for any
     additional controls you have added to the view.
   */
-  tile: function() {
+  tile: function () {
     // get vertical scroller/determine if we should have a scroller
     var hasScroller, vscroll, vscroll2, hasVertical, clip, clipLayout, viewportHeight;
     hasScroller = this.get('hasVerticalScroller');
-    vscroll = hasScroller ? this.get('verticalScrollerView') : null ;
-    vscroll2 = hasScroller ? this.get('verticalScrollerView2') : null ;
-    hasVertical = vscroll && this.get('isVerticalScrollerVisible') ;
+    vscroll = hasScroller ? this.get('verticalScrollerView') : null;
+    vscroll2 = hasScroller ? this.get('verticalScrollerView2') : null;
+    hasVertical = vscroll && this.get('isVerticalScrollerVisible');
 
     // get the containerView
-    clip = this.get('containerView') ;
-    clipLayout = { left: 0, top: 0 } ;
+    clip = this.get('containerView');
+    clipLayout = { left: 0, top: 0 };
 
     if (hasVertical) {
-      viewportHeight =0;
+      viewportHeight = 0;
       var scrollerThickness = vscroll.get('scrollerThickness') || vscroll2.get('scrollerThickness');
-      var view   = this.get('contentView'), view2,
+      var view   = this.get('contentView'),
             f      = (view) ? view.get('frame') : null,
             height = (f) ? f.height : 0,
             elem = this.containerView.$()[0],
@@ -536,36 +520,38 @@ SC.MenuScrollView = SC.ScrollView.extend(
             bottomArrowVisible = { height: scrollerThickness, bottom: 0, right: 0, left: 0 },
             bottomArrowInvisible = { height: 0, bottom: 0, right: 0, left: 0 };
 
-      if(elem) viewportHeight = elem.offsetHeight;
+      if (elem) viewportHeight = elem.offsetHeight;
 
-      if(verticalOffset===0){
-        clipLayout.top = 0 ;
+      if (verticalOffset === 0) {
+        clipLayout.top = 0;
         clipLayout.bottom = scrollerThickness;
-        vscroll.set('layout', topArrowInvisible) ;
-        vscroll2.set('layout', bottomArrowVisible) ;
-      }else if(verticalOffset>=(height-viewportHeight-scrollerThickness)){
-        clipLayout.top = scrollerThickness ;
-        clipLayout.bottom = 0 ;
-        vscroll.set('layout', topArrowVisible) ;
-        vscroll2.set('layout', bottomArrowInvisible) ;
-      }else{
-        clipLayout.top = scrollerThickness ;
-        clipLayout.bottom = scrollerThickness ;
-        vscroll.set('layout', topArrowVisible) ;
-        vscroll2.set('layout', bottomArrowVisible) ;
+        vscroll.set('layout', topArrowInvisible);
+        vscroll2.set('layout', bottomArrowVisible);
+      } else if (verticalOffset >= (height - viewportHeight - scrollerThickness)) {
+        clipLayout.top = scrollerThickness;
+        clipLayout.bottom = 0;
+        vscroll.set('layout', topArrowVisible);
+        vscroll2.set('layout', bottomArrowInvisible);
+      } else {
+        clipLayout.top = scrollerThickness;
+        clipLayout.bottom = scrollerThickness;
+        vscroll.set('layout', topArrowVisible);
+        vscroll2.set('layout', bottomArrowVisible);
       }
     }
-    if (vscroll){
-     vscroll.set('isVisible', hasVertical) ;
-     vscroll2.set('isVisible', hasVertical) ;
+
+    if (vscroll) {
+      vscroll.set('isVisible', hasVertical);
+      vscroll2.set('isVisible', hasVertical);
     }
-    clip.set('layout', clipLayout) ;
+
+    clip.set('layout', clipLayout);
   },
 
   /** @private
     Called whenever a scroller visibility changes.  Calls the tile() method.
   */
-  scrollerVisibilityDidChange: function() {
+  scrollerVisibilityDidChange: function () {
     this.tile();
   }.observes('isVerticalScrollerVisible', 'isHorizontalScrollerVisible', 'verticalScrollOffset'),
 
@@ -578,8 +564,8 @@ SC.MenuScrollView = SC.ScrollView.extend(
     Instantiate scrollers & container views as needed.  Replace their classes
     in the regular properties.
   */
-  createChildViews: function() {
-    var childViews = [], view, view2, controlSize = this.get('controlSize') ;
+  createChildViews: function () {
+    var childViews = [], view, view2, controlSize = this.get('controlSize');
 
     // create the containerView.  We must always have a container view.
     // also, setup the contentView as the child of the containerView...
@@ -593,53 +579,53 @@ SC.MenuScrollView = SC.ScrollView.extend(
     this.contentView = this.containerView.get('contentView');
 
     // create a vertical scroller
-    if ((view=this.verticalScrollerView) && (view2=this.verticalScrollerView2)) {
+    if ((view = this.verticalScrollerView) && (view2 = this.verticalScrollerView2)) {
       if (this.get('hasVerticalScroller')) {
         view = this.verticalScrollerView = this.createChildView(view, {
           layout: {top: 0, left: 0, right: 0},
           controlSize: controlSize,
           valueBinding: '*owner.verticalScrollOffset'
-        }) ;
+        });
         childViews.push(view);
         view2 = this.verticalScrollerView2 = this.createChildView(view2, {
           scrollDown: YES,
-          layout: {bottom: 0, left: 0, right: 0 },
+          layout: { bottom: 0, left: 0, right: 0 },
           controlSize: controlSize,
           valueBinding: '*owner.verticalScrollOffset'
-        }) ;
+        });
         childViews.push(view2);
       } else {
-        this.verticalScrollerView = null ;
-        this.verticalScrollerView2 = null ;
+        this.verticalScrollerView = null;
+        this.verticalScrollerView2 = null;
       }
     }
 
     // set childViews array.
-    this.childViews = childViews ;
+    this.childViews = childViews;
 
-    this.contentViewFrameDidChange() ; // setup initial display...
-    this.tile() ; // set up initial tiling
+    this.contentViewFrameDidChange(); // setup initial display...
+    this.tile(); // set up initial tiling
   },
 
   /** @private */
-  init: function() {
+  init: function () {
     sc_super();
 
     // start observing initial content view.  The content view's frame has
     // already been setup in prepareDisplay so we don't need to call
     // viewFrameDidChange...
-    this._scroll_contentView = this.get('contentView') ;
-    var contentView = this._scroll_contentView ;
+    this._scroll_contentView = this.get('contentView');
+    var contentView = this._scroll_contentView;
 
     if (contentView) {
-      contentView.addObserver('frame', this, this.contentViewFrameDidChange) ;
+      contentView.addObserver('frame', this, this.contentViewFrameDidChange);
     }
 
-    if (this.get('isVisibleInWindow')) this._scsv_registerAutoscroll() ;
+    if (this.get('isVisibleInWindow')) this._scsv_registerAutoscroll();
   },
 
   /** @private Registers/deregisters view with SC.Drag for autoscrolling */
-  _scsv_registerAutoscroll: function() {
+  _scsv_registerAutoscroll: function () {
     if (this.get('isVisibleInWindow')) SC.Drag.addScrollableView(this);
     else SC.Drag.removeScrollableView(this);
   }.observes('isVisibleInWindow'),
@@ -650,32 +636,32 @@ SC.MenuScrollView = SC.ScrollView.extend(
     size of the contentView changes.  We don't care about the origin since
     that is tracked separately from the offset values.
   */
-  contentViewFrameDidChange: function() {
+  contentViewFrameDidChange: function () {
     var view   = this.get('contentView'), view2,
         f      = (view) ? view.get('frame') : null,
         width  = (f) ? f.width : 0,
         height = (f) ? f.height : 0,
         dim    = this.get('frame'),
-        viewportHeight, elem ;
+        viewportHeight, elem;
 
     // cache out scroll settings...
-    //if ((width === this._scroll_contentWidth) && (height === this._scroll_contentHeight)) return ;
+    //if ((width === this._scroll_contentWidth) && (height === this._scroll_contentHeight)) return;
     this._scroll_contentWidth = width;
-    this._scroll_contentHeight = height ;
+    this._scroll_contentHeight = height;
 
     if (this.get('hasVerticalScroller') && (view = this.get('verticalScrollerView')) && (view2 = this.get('verticalScrollerView2'))) {
-      height -= 1 ; // accurately account for our layout
+      height -= 1; // accurately account for our layout
       // decide if it should be visible or not
       if (this.get('autohidesVerticalScroller')) {
         this.set('isVerticalScrollerVisible', height > dim.height);
       }
-      height -= this.get('verticalScrollerBottom') ;
+      height -= this.get('verticalScrollerBottom');
       viewportHeight = 0;
       elem = this.containerView.$()[0];
-      if(elem) viewportHeight = elem.offsetHeight;
+      if (elem) viewportHeight = elem.offsetHeight;
       height = height - viewportHeight;
-      view.setIfChanged('maximum', height) ;
-      view2.setIfChanged('maximum', height) ;
+      view.setIfChanged('maximum', height);
+      view2.setIfChanged('maximum', height);
     }
   },
 
@@ -683,18 +669,18 @@ SC.MenuScrollView = SC.ScrollView.extend(
     Whenever the horizontal scroll offset changes, update the scrollers and
     edit the location of the contentView.
   */
-  _scroll_horizontalScrollOffsetDidChange: function() {},
+  _scroll_horizontalScrollOffsetDidChange: function () {},
 
   /** @private
     Whenever the vertical scroll offset changes, update the scrollers and
     edit the location of the contentView.
   */
-  _scroll_verticalScrollOffsetDidChange: function() {
-    var offset = this.get('verticalScrollOffset') ;
+  _scroll_verticalScrollOffsetDidChange: function () {
+    var offset = this.get('verticalScrollOffset');
 
     // update the offset for the contentView...
     var contentView = this.get('contentView');
-    if (contentView) contentView.$().css('top', (0-offset) + "px");
+    if (contentView) contentView.$().css('top', (0 - offset) + "px");
 
   }.observes('verticalScrollOffset')