sproutcore 0.9.4 → 0.9.5

data/frameworks/sproutcore/views/collection/grid.js

@@ -44,7 +44,6 @@ SC.GridView = SC.CollectionView.extend(
   // computed function for keyboard handling.
   itemsPerRow: function() {
     var ret = this._computeItemsPerRow() ;
-    console.log('ret = %@'.fmt(ret)) ;
     return ret ;
   }.property(),
   
@@ -167,49 +166,86 @@ SC.GridView = SC.CollectionView.extend(
     emptyElement: '<div class="grid-insertion-point"><span class="anchor"></span></div>'
   }),
   
-  showInsertionPointBefore: function(itemView) {
-    
+  showInsertionPoint: function(itemView, dropOperation) {
     if (!itemView) return ;
-  
-    if (!this._insertionPointView) {
-      this._insertionPointView = this.insertionPointClass.create() ;
-    } ;
+
+    // if drop on, then just add a class...
+    if (dropOperation === SC.DROP_ON) {
+      if (itemView !== this._dropOnInsertionPoint) {
+        this.hideInsertionPoint() ;
+        itemView.addClassName('drop-target') ;
+        this._dropOnInsertionPoint = itemView ;
+      }
+      
+    } else {
+      
+      if (this._dropOnInsertionPoint) {
+        this._dropOnInsertionPoint.removeClassName('drop-target') ;
+        this._dropOnInsertionPoint = null ;
+      }
     
-    var insertionPoint = this._insertionPointView ;
-    var itemViewFrame = itemView.get('frame') ;
-    f = { height: itemViewFrame.height - 6, 
-          x: itemViewFrame.x, 
-          y: itemViewFrame.y + 6, 
-          width: 0 
-        };
-        
-    if (!SC.rectsEqual(insertionPoint.get('frame'), f)) {
-      insertionPoint.set('frame', f) ;
-    }
-  
-    if (insertionPoint.parentNode != itemView.parentNode) {
-      itemView.parentNode.appendChild(insertionPoint) ;
+      if (!this._insertionPointView) {
+        this._insertionPointView = this.insertionPointClass.create() ;
+      } ;
+    
+      var insertionPoint = this._insertionPointView ;
+      var itemViewFrame = itemView.get('frame') ;
+      f = { height: itemViewFrame.height - 6, 
+            x: itemViewFrame.x, 
+            y: itemViewFrame.y + 6, 
+            width: 0 
+          };
+
+      if (!SC.rectsEqual(insertionPoint.get('frame'), f)) {
+        insertionPoint.set('frame', f) ;
+      }
+
+      if (insertionPoint.parentNode != itemView.parentNode) {
+        itemView.parentNode.appendChild(insertionPoint) ;
+      }
     }
+    
   },
-  
+    
   hideInsertionPoint: function() {
     var insertionPoint = this._insertionPointView ;
     if (insertionPoint) insertionPoint.removeFromParent() ;
+
+    if (this._dropOnInsertionPoint) {
+      this._dropOnInsertionPoint.removeClassName('drop-target') ;
+      this._dropOnInsertionPoint = null ;
+    }
   },
   
   // // We can do this much faster programatically using the rowHeight
-  insertionIndexForLocation: function(loc) {  
+  insertionIndexForLocation: function(loc, dropOperation) {  
     var f = this.get('frame') ;
     var sf = this.get('scrollFrame') ;
     
     var itemsPerRow = this._computeItemsPerRow(); 
     var columnWidth = Math.floor(f.width / itemsPerRow) ;
     var row = Math.floor((loc.y - f.y - sf.y) / this.get('rowHeight')) ;
-    var col = Math.floor(((loc.x - f.x - sf.x) / columnWidth) + 0.5) ;
+
+    var retOp = SC.DROP_BEFORE ;
     
+    var offset = (loc.x - f.x - sf.x) ;
+    var col = Math.floor(offset / columnWidth) ;
+    var percentage = (offset / columnWidth) - col ;
+    
+    // if the dropOperation is SC.DROP_ON and we are in the center 60%
+    // then return the current item.
+    if (dropOperation === SC.DROP_ON) {
+      if (percentage > 0.80) col++ ;
+      if ((percentage >= 0.20) && (percentage <= 0.80)) {
+        retOp = SC.DROP_ON;
+      }
+    } else {
+      if (percentage > 0.45) col++ ;
+    }
+    
+    // convert to index
     var ret= (row*itemsPerRow) + col ;
-    //console.log("insertionIndexForLocation = %@".fmt(ret)) ;
-    return ret ;
+    return [ret, retOp] ;
   }
   
 }) ;

data/frameworks/sproutcore/views/collection/list.js

@@ -49,16 +49,12 @@ SC.ListView = SC.CollectionView.extend(
     var min = Math.max(0,Math.floor(SC.minY(frame) / rowHeight)-1) ;
     var max = Math.ceil(SC.maxY(frame) / rowHeight) ;
     var ret = { start: min, length: max - min } ; 
-//    console.log('contentRangeInFrame(%@) = %@'.fmt($H(frame).inspect(), $H(ret).inspect()));
-    //if (frame.height < 100) debugger ;
     return ret ;
   },
   
   /** @private */
   layoutItemView: function(itemView, contentIndex, firstLayout) {
-    if (!itemView) debugger ;
-    SC.Benchmark.start('SC.ListView.layoutItemViewsFor') ;
-    
+
     var rowHeight = this.get('rowHeight') || 0 ;
     var parentView = itemView.get('parentView') ;
     var f = { 
@@ -72,7 +68,6 @@ SC.ListView = SC.CollectionView.extend(
       itemView.set('frame', f) ;      
       itemView.setStyle({ zIndex: contentIndex.toString() }) ;
     }
-    SC.Benchmark.end('SC.ListView.layoutItemViewsFor') ;
   },
   
   computeFrame: function() {
@@ -85,41 +80,82 @@ SC.ListView = SC.CollectionView.extend(
 
     f.x = f.y = 0;
     f.height = Math.max(f.height, rows * rowHeight) ;
-//    console.log('computeFrame(%@)'.fmt($H(f).inspect())) ;
     return f ;
   },
   
   insertionPointClass: SC.View.extend({
     emptyElement: '<div class="list-insertion-point"><span class="anchor"></span></div>'
   }),
-  
-  showInsertionPointBefore: function(itemView) {
+
+  showInsertionPoint: function(itemView, dropOperation) {
     if (!itemView) return ;
 
-    if (!this._insertionPointView) {
-      this._insertionPointView = this.insertionPointClass.create() ;
-    } ;
+    // if drop on, then just add a class...
+    if (dropOperation === SC.DROP_ON) {
+      if (itemView !== this._dropOnInsertionPoint) {
+        this.hideInsertionPoint() ;
+        itemView.addClassName('drop-target') ;
+        this._dropOnInsertionPoint = itemView ;
+      }
+      
+    } else {
+      
+      if (this._dropOnInsertionPoint) {
+        this._dropOnInsertionPoint.removeClassName('drop-target') ;
+        this._dropOnInsertionPoint = null ;
+      }
     
-    var insertionPoint = this._insertionPointView ;
-    f = { height: 0, x: 8, y: itemView.get('frame').y, width: itemView.owner.get('frame').width };
-    insertionPoint.set('frame', f) ;
+      if (!this._insertionPointView) {
+        this._insertionPointView = this.insertionPointClass.create() ;
+      } ;
+    
+      var insertionPoint = this._insertionPointView ;
+      f = { height: 0, x: 8, y: itemView.get('frame').y, width: itemView.owner.get('frame').width };
+      insertionPoint.set('frame', f) ;
 
-    if (insertionPoint.parentNode != itemView.parentNode) {
-      itemView.parentNode.appendChild(insertionPoint) ;
+      if (insertionPoint.parentNode != itemView.parentNode) {
+        itemView.parentNode.appendChild(insertionPoint) ;
+      }
     }
+    
   },
   
   hideInsertionPoint: function() {
     var insertionPoint = this._insertionPointView ;
     if (insertionPoint) insertionPoint.removeFromParent() ;
+
+    if (this._dropOnInsertionPoint) {
+      this._dropOnInsertionPoint.removeClassName('drop-target') ;
+      this._dropOnInsertionPoint = null ;
+    }
   },
-  
+
   // We can do this much faster programatically using the rowHeight
-  insertionIndexForLocation: function(loc) {  
+  insertionIndexForLocation: function(loc, dropOperation) {  
     var f = this.get('innerFrame') ;
     var sf = this.get('scrollFrame') ;
-    var ret = Math.floor(((loc.y - f.y - sf.y) / this.get('rowHeight')) + 0.4) ;
-    return ret ;
+    var rowHeight = this.get('rowHeight') || 0 ;
+
+    // find the row and offset to work with
+    var offset = loc.y - f.y - sf.y ;
+    var retOp = SC.DROP_BEFORE ;
+    var ret = Math.floor(offset / this.get('rowHeight')) ;
+     
+    // find the percent through the row...
+    var percentage = (offset / rowHeight) - ret ;
+    
+    // if the dropOperation is SC.DROP_ON and we are in the center 60%
+    // then return the current item.
+    if (dropOperation === SC.DROP_ON) {
+      if (percentage > 0.80) ret++ ;
+      if ((percentage >= 0.20) && (percentage <= 0.80)) {
+        retOp = SC.DROP_ON;
+      }
+    } else {
+      if (percentage > 0.45) ret++ ;
+    }
+    
+    return [ret, retOp] ;
   }
   
 }) ;

data/frameworks/sproutcore/views/collection/source_list.js

@@ -31,6 +31,12 @@ SC.SourceListView = SC.CollectionView.extend(
   */
   contentValueIsEditable: NO,
   
+  /**
+    Allows reordering without modifiying the selection
+  */
+  
+  selectOnMouseDown: false,
+  
   /**
     Set to YES if you want source list items to display an icon.
     
@@ -338,29 +344,51 @@ SC.SourceListView = SC.CollectionView.extend(
     emptyElement: '<div class="list-insertion-point"><span class="anchor"></span></div>'
   }),
   
-  showInsertionPointBefore: function(itemView) {
+  showInsertionPoint: function(itemView, dropOperation) {
     if (!itemView) return ;
 
-    if (!this._insertionPointView) {
-      this._insertionPointView = this.insertionPointClass.create() ;
-    } ;
+    // if drop on, then just add a class...
+    if (dropOperation === SC.DROP_ON) {
+      if (itemView !== this._dropOnInsertionPoint) {
+        this.hideInsertionPoint() ;
+        itemView.addClassName('drop-target') ;
+        this._dropOnInsertionPoint = itemView ;
+      }
+      
+    } else {
+      
+      if (this._dropOnInsertionPoint) {
+        this._dropOnInsertionPoint.removeClassName('drop-target') ;
+        this._dropOnInsertionPoint = null ;
+      }
     
-    var insertionPoint = this._insertionPointView ;
-    f = { height: 0, x: 8, y: itemView.get('frame').y, width: itemView.owner.get('frame').width };
-    insertionPoint.set('frame', f) ;
+      if (!this._insertionPointView) {
+        this._insertionPointView = this.insertionPointClass.create() ;
+      } ;
+    
+      var insertionPoint = this._insertionPointView ;
+      f = { height: 0, x: 8, y: itemView.get('frame').y, width: itemView.owner.get('frame').width };
+      insertionPoint.set('frame', f) ;
 
-    if (insertionPoint.parentNode != itemView.parentNode) {
-      itemView.parentNode.appendChild(insertionPoint) ;
+      if (insertionPoint.parentNode != itemView.parentNode) {
+        itemView.parentNode.appendChild(insertionPoint) ;
+      }
     }
+    
   },
   
   hideInsertionPoint: function() {
     var insertionPoint = this._insertionPointView ;
     if (insertionPoint) insertionPoint.removeFromParent() ;
+
+    if (this._dropOnInsertionPoint) {
+      this._dropOnInsertionPoint.removeClassName('drop-target') ;
+      this._dropOnInsertionPoint = null ;
+    }
   },
   
   // We can do this much faster programatically using the rowHeight
-  insertionIndexForLocation: function(loc) {  
+  insertionIndexForLocation: function(loc, dropOperation) {  
     var f = this.get('innerFrame') ;
     var sf = this.get('scrollFrame') ;
     var rowHeight = this.get('rowHeight') || 0 ;
@@ -368,6 +396,7 @@ SC.SourceListView = SC.CollectionView.extend(
     // find the offset to work with.
     var offset = loc.y - f.y - sf.y ;
     var ret = -1; // the return value
+    var retOp = SC.DROP_BEFORE ;
 
     // search groups until we find one that matches
     var top = 0;
@@ -380,8 +409,26 @@ SC.SourceListView = SC.CollectionView.extend(
       // we hit there.
       if (max >= offset) {
         offset -= top ;
-        ret = Math.floor((offset / rowHeight) + 0.4) ;
-        if (ret < 1) return -1 ; // top row!
+        ret = Math.floor(offset / rowHeight) ;
+
+        // find the percent through the row...
+        var percentage = (offset / rowHeight) - ret ;
+        
+        // if the dropOperation is SC.DROP_ON and we are in the center 60%
+        // then return the current item.
+        if (dropOperation === SC.DROP_ON) {
+          if (percentage > 0.80) ret++ ;
+          if ((percentage >= 0.20) && (percentage <= 0.80)) {
+            retOp = SC.DROP_ON;
+          }
+        } else {
+          if (percentage > 0.45) ret++ ;
+        }
+        
+        // handle dropping on top row...
+        if (ret < 1) return [-1, SC.DROP_BEFORE] ; // top row!
+        
+        // convert to index
         ret = (ret - 1) + idx ;
         
       // we are not yet within the group, go on to the next group.
@@ -390,7 +437,8 @@ SC.SourceListView = SC.CollectionView.extend(
         top = max ;
       }
     }
-    return ret ;
+    
+    return [ret, retOp] ;
   }
   
 }) ;

data/frameworks/sproutcore/views/image.js

@@ -105,11 +105,13 @@ SC.ImageView = SC.View.extend(SC.Control,
     if (!value || value.length == 0) {
       this.rootElement.src = SC.BLANK_IMAGE_URL;
       this.set('status', SC.IMAGE_STATE_NONE) ;
+      this._imageUrl = null; //clear
       
     // if a new value was set that is a URL, load the image URL.
     } else if (SC.ImageView.valueIsUrl(value)) {
       this.beginPropertyChanges() ;
       this.set('status', SC.IMAGE_STATE_LOADING) ;
+      this._imageUrl = value ; // save to verify later.
       SC.imageCache.loadImage(value, this, this._onLoadComplete) ;
       this.endPropertyChanges() ;
       
@@ -130,6 +132,11 @@ SC.ImageView = SC.View.extend(SC.Control,
     this method will be invoked immediately.
   */
   _onLoadComplete: function(url, status, img) {  
+    
+    // sometimes this method gets called later after the url has already
+    // changed.  If this is the case, bail...
+    if (url !== this._imageUrl) return ;
+    
     this.beginPropertyChanges() ;
     this.set('imageWidth', parseInt(img.width,0)) ;
     this.set('imageHeight', parseInt(img.height,0)) ;

data/frameworks/sproutcore/views/inline_text_field.js

@@ -104,11 +104,11 @@ SC.InlineTextFieldView = SC.View.extend(SC.DelegateSupport, SC.InlineEditorDeleg
       this.endPropertyChanges();  return NO ;
     }
 
-    this._frame = options.frame ;
+    this._optframe = options.frame ;
     this._exampleElement = options.exampleElement ;
     this._delegate = options.delegate ;
 
-    if (!this._frame || !this._delegate) {
+    if (!this._optframe || !this._delegate) {
       throw "At least frame and delegate options are required for inline editor";
     }
     
@@ -188,11 +188,10 @@ SC.InlineTextFieldView = SC.View.extend(SC.DelegateSupport, SC.InlineEditorDeleg
 
     // OK, we are allowed to end editing.  Notify delegate of final value
     // and clean up.
-    console.log('applying finalValue: %@'.fmt(finalValue)) ;
     this.invokeDelegateMethod(del, 'inlineEditorDidEndEditing', this, finalValue) ;
 
     // cleanup cached values
-    this._originalValue = this._delegate = this._exampleElement = this._frame = null ;
+    this._originalValue = this._delegate = this._exampleElement = this._optframe = null ;
     this.set('isEditing', NO) ;
 
     // resign first responder if not done already.  This may call us in a 
@@ -224,7 +223,7 @@ SC.InlineTextFieldView = SC.View.extend(SC.DelegateSupport, SC.InlineEditorDeleg
   */
   updateViewStyle: function() {
     // collect font and frame from target.
-    var f= this._frame ;
+    var f= this._optframe ;
     var el = this._exampleElement ;
     
     var styles = {

data/frameworks/sproutcore/views/slider.js

@@ -95,6 +95,8 @@ SC.SliderView = SC.View.extend(SC.Control,
   }.observes('value', 'minimum', 'maximum'),
   
   mouseDown: function(evt) {
+    
+    this.recacheFrames() ;
      
     if (!this.get('isEnabled')) return true ; // nothing to do
     

data/frameworks/sproutcore/views/view.js

@@ -659,7 +659,7 @@ SC.View = SC.Responder.extend(SC.PathModule,  SC.DelegateSupport,
     any of these properties to edit individual CSS style properties.
   */
   unknownProperty: function(key, value) {
-    if (key.match(/^style/)) {
+    if (key && key.match && key.match(/^style/)) {
       key = key.slice(5,key.length).replace(/^./, function(x) { 
         return x.toLowerCase(); 
       });
@@ -687,7 +687,6 @@ SC.View = SC.Responder.extend(SC.PathModule,  SC.DelegateSupport,
         }
         ret = this.getStyle(key) ;
       }
-      console.log('get Style: %@ -> %@'.fmt(key, ret)) ;
       return ret;
       
     } else return arguments.callee.base.call(this, key, value) ;
@@ -1763,6 +1762,7 @@ SC.View = SC.Responder.extend(SC.PathModule,  SC.DelegateSupport,
     // if state changes, update and notify children.
     if (visible != this.get('isVisibleInWindow')) {
       this.set('isVisibleInWindow', visible) ;
+      this.recacheFrames() ;
       var child = this.get('firstChild') ;
       while(child) {
         child._updateIsVisibleInWindow(visible) ;