sproutcore 1.0.1049.pre.2 → 1.4.0.rc

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

@@ -1677,12 +1677,14 @@ SC.CollectionView = SC.View.extend(
       
       // Ensure we are not out of bounds
       if (SC.none(selTop) || (selTop < 0)) selTop = 0 ;
+      if (!content.objectAt(selTop)) selTop = sel ? sel.get('min') : -1;
       if (selBottom < selTop) selBottom = selTop ;
       
     // if not extending, just select the item previous to the selTop
     } else {
       selTop = this._findPreviousSelectableItemFromIndex(selTop - numberOfItems);
       if (SC.none(selTop) || (selTop < 0)) selTop = 0 ;
+      if (!content.objectAt(selTop)) selTop = sel ? sel.get('min') : -1;
       selBottom = selTop ;
       anchor = null ;
     }
@@ -1740,6 +1742,11 @@ SC.CollectionView = SC.View.extend(
       
       // Ensure we are not out of bounds
       if (selBottom >= lim) selBottom = lim-1;
+      
+      // we also need to check that the item exists
+      if (!content.objectAt(selBottom)) selBottom = sel ? sel.get('max') - 1 : -1;
+      
+      // and if top has eclipsed bottom, handle that too.
       if (selTop > selBottom) selTop = selBottom ;
       
     // if not extending, just select the item next to the selBottom
@@ -1747,6 +1754,7 @@ SC.CollectionView = SC.View.extend(
       selBottom = this._findNextSelectableItemFromIndex(selBottom + numberOfItems, selBottom);
       
       if (selBottom >= lim) selBottom = lim-1;
+      if (!content.objectAt(selBottom)) selBottom = sel ? sel.get('max') - 1 : -1;
       selTop = selBottom ;
       anchor = null ;
     }
@@ -2294,7 +2302,9 @@ SC.CollectionView = SC.View.extend(
   // ..........................................................
   // TOUCH EVENTS
   //
-  touchStart: function(touch, evt) {
+  
+  touchStart: function(ev) {
+
     // When the user presses the mouse down, we don't do much just yet.
     // Instead, we just need to save a bunch of state about the mouse down
     // so we can choose the right thing to do later.
@@ -2305,15 +2315,16 @@ SC.CollectionView = SC.View.extend(
     // find the actual view the mouse was pressed down on.  This will call
     // hitTest() on item views so they can implement non-square detection
     // modes. -- once we have an item view, get its content object as well.
-    var itemView      = this.itemViewForEvent(touch),
+    var itemView      = this.itemViewForEvent(ev),
         content       = this.get('content'),
         contentIndex  = itemView ? itemView.get('contentIndex') : -1,
         info, anchor ;
-        
+
     // become first responder if possible.
     this.becomeFirstResponder() ;
+    this.select(contentIndex, NO);
     
-    this.invokeLater("select", 1, contentIndex);
+    this._cv_performSelectAction(this, ev);
     
     return YES;
   },
@@ -2330,13 +2341,6 @@ SC.CollectionView = SC.View.extend(
     }, this);
 
   },
-  
-  touchEnd: function(touch) {
-    var itemView = this.itemViewForEvent(touch);
-    
-    // If actOnSelect is implemented, the action will be fired.
-    this._cv_performSelectAction(itemView, touch, 0);
-  },
 
   touchCancelled: function(evt) {
     this.select(null, NO);

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

@@ -22,7 +22,7 @@ SC.DisclosureView = SC.ButtonView.extend(
   
   classNames: ['sc-disclosure-view'],
   
-  controlStyle: 'disclosure',
+  theme: 'disclosure',
   buttonBehavior: SC.TOGGLE_BEHAVIOR,
   
   /**
@@ -39,24 +39,23 @@ SC.DisclosureView = SC.ButtonView.extend(
   /** @private */
   valueBindingDefault: SC.Binding.bool() ,
   
-  createRenderer: function(theme) {
-    var ret = theme.disclosureControl();
-    this.updateRenderer(ret);
-    return ret;
+  /** @private */
+  render: function(context, firstTime) {
+    var title = this.get('displayTitle');
+    if(firstTime) {
+      context.push('<img src="', SC.BLANK_IMAGE_URL, '" class="button" alt="" />');
+      if(this.get('needsEllipsis')) {
+        context.push('<span class="ellipsis sc-button-label">',title,'</span>');
+      }
+      else {
+        context.push('<span class="sc-button-label">', title,'</span>');  
+      }
+    }
+    else {
+      this.$('label').text(title);
+    }
   },
   
-  updateRenderer: function(renderer) {
-    renderer.attr({
-      icon: this.get('icon'),
-      isActive: this.get('isActive'),
-      isEnabled: this.get('isEnabled'),
-      isSelected: this.get('isSelected'),
-      needsEllipsis: this.get('needsEllipsis'),
-      state: this.value === this.get('toggleOnValue') ? YES : NO,
-      title: this.get('displayTitle')
-    });
-  },
-    
   /**
     Allows toggling of the value with the right and left arrow keys. 
     Extends the behavior inherted from SC.ButtonView.

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

@@ -27,25 +27,11 @@ SC.LIST_ITEM_ACTION_EJECT = 'sc-list-item-cancel-eject';
   @since SproutCore 1.0
 */
 SC.ListItemView = SC.View.extend(
-    SC.StaticLayout,
     SC.Control,
 /** @scope SC.ListItemView.prototype */ {
   
   classNames: ['sc-list-item-view'],
   
-  displayProperties: ['disclosureState', 'escapeHTML'],
-  
-  
-  init: function() {
-    sc_super();
-    
-    // add support for deprecated render method
-    if (this.render !== SC.View.prototype.render) {
-      // we have a custom render method, freak out!
-      this.render.base = this.__DEPRECATED__render;
-    }
-  },
-  
   // ..........................................................
   // KEY PROPERTIES
   // 
@@ -90,12 +76,6 @@ SC.ListItemView = SC.View.extend(
   */
   contentCheckboxKey: null,
   
-  /**
-    The URL or CSS class name to use for the icon. This is only used if
-    contentIconKey is null, or returns null from the delegate.
-  */
-  icon: null,
-  
   /**
     (displayDelegate) Property key to use for the icon url
 
@@ -104,12 +84,6 @@ SC.ListItemView = SC.View.extend(
   */
   contentIconKey: null,
  
-  /**
-    The URL or CSS class name to use for the right icon. This is only used if
-    contentRightIconKey is null, or returns null from the delegate.
-  */
-  rightIcon: null,
-  
   /**
     (displayDelegate) Property key to use for the right icon url
 
@@ -200,91 +174,208 @@ SC.ListItemView = SC.View.extend(
     return content && (content.get ? content.get('isEditable')!==NO : NO);
   }.property('content').cacheable(),
   
-  
-  createRenderer: function(theme) {
-    var ret = theme.listItem();
-    this.updateRenderer(ret);
-    return ret;
-  },
-  
-  updateRenderer: function(renderer) {
+  /**
+    Fills the passed html-array with strings that can be joined to form the
+    innerHTML of the receiver element.  Also populates an array of classNames
+    to set on the outer element.
+    
+    @param {SC.RenderContext} context
+    @param {Boolean} firstTime
+    @returns {void}
+  */
+  render: function(context, firstTime) {
     var content = this.get('content'),
-        del = this.displayDelegate,
-        key, value;
-    
-    var attrs = {
-      contentIndex: this.get('contentIndex'),
-      contentIsEditable: this.get('contentIsEditable'),
-      escapeHTML: this.get('escapeHTML'),
-      isEnabled: this.get('isEnabled'),
-      outlineIndent: this.get('outlineIndent'),
-      outlineLevel: this.get('outlineLevel')
-    };
-    
-    // disclosure
+        del     = this.displayDelegate,
+        level   = this.get('outlineLevel'),
+        indent  = this.get('outlineIndent'),
+        key, value, working, classArray = [];
+    
+    // add alternating row classes
+    classArray.push((this.get('contentIndex')%2 === 0) ? 'even' : 'odd');
+    context.setClass('disabled', !this.get('isEnabled'));
+
+    // outline level wrapper
+    working = context.begin("div").addClass("sc-outline");
+    if (level>=0 && indent>0) working.addStyle("left", indent*(level+1));
+
+    // handle disclosure triangle
     value = this.get('disclosureState');
     if (value !== SC.LEAF_NODE) {
-      attrs.disclosureState = value === SC.BRANCH_OPEN ? YES : NO;
-    } else {
-      // nullify as renderer may have been true/false before
-      attrs.disclosureState = null;
+      this.renderDisclosure(working, value);
+      classArray.push('has-disclosure');
     }
     
-    // checkbox
-    if (key = this.getDelegateProperty('contentCheckboxKey', del)) {
-      value = content ? (content.get ? content.get(key) : content[key]) : NO;
-      attrs.checkbox = value;
+    
+    // handle checkbox
+    key = this.getDelegateProperty('contentCheckboxKey', del) ;
+    if (key) {
+      value = content ? (content.get ? content.get(key) : content[key]) : NO ;
+      this.renderCheckbox(working, value);
+      classArray.push('has-checkbox');
     }
     
-    // icon
+    // handle icon
     if (this.getDelegateProperty('hasContentIcon', del)) {
-      key = this.getDelegateProperty('contentIconKey', del);
-      value = (key && content) ? (content.get ? content.get(key) : content[key]) : null;
-      attrs.icon = value;
-    } else if (!SC.none(this.icon)) {
-      attrs.icon = this.get('icon');
+      key = this.getDelegateProperty('contentIconKey', del) ;
+      value = (key && content) ? (content.get ? content.get(key) : content[key]) : null ;
+      
+      this.renderIcon(working, value);
+      classArray.push('has-icon');      
     }
     
-    // label, always on
+    // handle label -- always invoke
     key = this.getDelegateProperty('contentValueKey', del) ;
-    value = (key && content) ? (content.get ? content.get(key) : content[key]) : content;
-    if (value && SC.typeOf(value) !== SC.T_STRING) {
-      value = value.toString();
-    }
-    attrs.label = value;
-    
-    // right icon
+    value = (key && content) ? (content.get ? content.get(key) : content[key]) : content ;
+    if (value && SC.typeOf(value) !== SC.T_STRING) value = value.toString();
+    if (this.get('escapeHTML')) value = SC.RenderContext.escapeHTML(value);
+    this.renderLabel(working, value);
+
+    // handle right icon
     if (this.getDelegateProperty('hasContentRightIcon', del)) {
-      key = this.getDelegateProperty('contentRightIconKey', del);
-      value = (key && content) ? (content.get ? content.get(key) : content[key]) : null;
-      attrs.rightIcon = value;
-    } else if (!SC.none(this.rightIcon)) {
-      attrs.rightIcon = this.get('rightIcon');
+      key = this.getDelegateProperty('contentRightIconKey', del) ;
+      value = (key && content) ? (content.get ? content.get(key) : content[key]) : null ;
+      
+      this.renderRightIcon(working, value);
+      classArray.push('has-right-icon');
     }
     
-    // unread count
+    // handle unread count
     key = this.getDelegateProperty('contentUnreadCountKey', del) ;
-    value = (key && content) ? (content.get ? content.get(key) : content[key]) : null;
-    attrs.count = value;
-    
-    // WTF does the listItemActionProperty do?
-    // its render function does essentially nothing?
-    // key = this.getDelegateProperty('listItemActionProperty', del) ;
-    // value = (key && content) ? (content.get ? content.get(key) : content[key]) : null ;
-    // if (value) {
-    //   this.renderAction(working, value);
-    //   classArray.push('has-action');
-    // }
+    value = (key && content) ? (content.get ? content.get(key) : content[key]) : null ;
+    if (!SC.none(value) && (value !== 0)) {
+      this.renderCount(working, value) ;
+      var digits = ['zero', 'one', 'two', 'three', 'four', 'five'];
+      var valueLength = value.toString().length;
+      var digitsLength = digits.length;
+      var digit = (valueLength < digitsLength) ? digits[valueLength] : digits[digitsLength-1];
+      classArray.push('has-count '+digit+'-digit');
+    }
+    
+    // handle action 
+    key = this.getDelegateProperty('listItemActionProperty', del) ;
+    value = (key && content) ? (content.get ? content.get(key) : content[key]) : null ;
+    if (value) {
+      this.renderAction(working, value);
+      classArray.push('has-action');
+    }
     
+    // handle branch
     if (this.getDelegateProperty('hasContentBranch', del)) {
       key = this.getDelegateProperty('contentIsBranchKey', del);
-      value = (key && content) ? (content.get ? content.get(key) : content[key]) : NO;
-      attrs.branch = value;
+      value = (key && content) ? (content.get ? content.get(key) : content[key]) : NO ;
+      this.renderBranch(working, value);
+      classArray.push('has-branch');
+    }
+    context.addClass(classArray);
+    context = working.end();
+  },
+  
+  /**
+    Adds a disclosure triangle with the appropriate display to the content.
+    This method will only be called if the disclosure state of the view is
+    something other than SC.LEAF_NODE.
+
+    @param {SC.RenderContext} context the render context
+    @param {Boolean} state YES, NO or SC.MIXED_STATE
+    @returns {void}
+  */
+  renderDisclosure: function(context, state) {
+    var key = (state === SC.BRANCH_OPEN) ? "open" : "closed",
+        cache = this._scli_disclosureHtml,
+        html, tmp;
+        
+    if (!cache) cache = this.constructor.prototype._scli_disclosureHtml = {};
+    html = cache[key];
+
+    if (!html) {
+      html = cache[key] = '<img src="'+SC.BLANK_IMAGE_URL+'" class="disclosure button '+key+'" />';
     }
+    
+    context.push(html);
+  },
+  
+  /**
+    Adds a checkbox with the appropriate state to the content.  This method
+    will only be called if the list item view is supposed to have a 
+    checkbox.
+    
+    @param {SC.RenderContext} context the render context
+    @param {Boolean} state YES, NO or SC.MIXED_STATE
+    @returns {void}
+  */
+  renderCheckbox: function(context, state) {
+    
+    var key = (state === SC.MIXED_STATE) ? "mixed" : state ? "sel" : "nosel",
+        cache = this._scli_checkboxHtml,
+        isEnabled = this.get('contentIsEditable') && this.get('isEnabled'),
+        html, tmp, classArray=[];
         
-    renderer.attr(attrs);
+    if (!isEnabled) key = SC.keyFor('disabled', key);
+    if (!cache) cache = this.constructor.prototype._scli_checkboxHtml = {};
+    html = cache[key];
+    
+    if (!html) {
+      tmp = SC.RenderContext('div').attr('role', 'button')
+        .classNames(SC.clone(SC.CheckboxView.prototype.classNames));
+
+      // set state on html
+      if (state === SC.MIXED_STATE) classArray.push('mixed');
+      else if(state) classArray.push('sel');
+      
+      // disabled
+      if(!isEnabled) classArray.push('disabled');
+      
+      tmp.addClass(classArray);
+
+      // now add inner content.  note we do not add a real checkbox because
+      // we don't want to have to setup a change observer on it.
+      tmp.push('<span class="button"></span>');
+
+      // apply edit
+      html = cache[key] = tmp.join();
+    }
+    
+    context.push(html);
   },
+  
+  /** 
+    Generates an icon for the label based on the content.  This method will
+    only be called if the list item view has icons enabled.  You can override
+    this method to display your own type of icon if desired.
+    
+    @param {SC.RenderContext} context the render context
+    @param {String} icon a URL or class name.
+    @returns {void}
+  */
+  renderIcon: function(context, icon){
+    // get a class name and url to include if relevant
+    var url = null, className = null , classArray=[];
+    if (icon && SC.ImageView.valueIsUrl(icon)) {
+      url = icon; className = '' ;
+    } else {
+      className = icon; url = SC.BLANK_IMAGE_URL ;
+    }
     
+    // generate the img element...
+    classArray.push(className,'icon');
+    context.begin('img')
+            .addClass(classArray)
+            .attr('src', url)
+            .end();
+  },
+  
+  /** 
+   Generates a label based on the content.  You can override this method to 
+   render your own label if desired.
+
+   @param {SC.RenderContext} context the render context
+   @param {String} label the label to display, already HTML escaped.
+   @returns {void}
+  */
+  renderLabel: function(context, label) {
+    context.push('<label>', label || '', '</label>') ;
+  },
+  
   /**
     Finds and retrieves the element containing the label.  This is used
     for inline editing.  The default implementation returns a CoreQuery
@@ -296,6 +387,46 @@ SC.ListItemView = SC.View.extend(
   $label: function() {
     return this.$('label') ;
   },
+
+  /** 
+    Generates a right icon for the label based on the content. This method
+    will only be called if the list item view has icons enabled. You can
+    override this method to display your own type of icon if desired.
+    
+    @param {SC.RenderContext} context the render context
+    @param {String} icon a URL or class name.
+    @returns {void}
+  */
+  renderRightIcon: function(context, icon){
+    // get a class name and url to include if relevant
+    var url = null, className = null, classArray=[];
+    if (icon && SC.ImageView.valueIsUrl(icon)) {
+      url = icon; className = '' ;
+    } else {
+      className = icon; url = SC.BLANK_IMAGE_URL ;
+    }
+    
+    // generate the img element...
+    classArray.push('right-icon',className);
+    context.begin('img')
+      .addClass(classArray)
+      .attr('src', url)
+    .end();
+  },
+  
+  /** 
+   Generates an unread or other count for the list item.  This method will
+   only be called if the list item view has counts enabled.  You can 
+   override this method to display your own type of counts if desired.
+   
+   @param {SC.RenderContext} context the render context
+   @param {Number} count the count
+   @returns {void}
+  */
+  renderCount: function(context, count) {
+    context.push('<span class="count"><span class="inner">',
+                  count.toString(),'</span></span>') ;
+  },
   
   /**
     Generates the html string used to represent the action item for your 
@@ -309,6 +440,23 @@ SC.ListItemView = SC.View.extend(
     context.push('<img src="',SC.BLANK_IMAGE_URL,'" class="action" />');
   },
   
+  /**
+   Generates the string used to represent the branch arrow. override this to 
+   return your own custom HTML
+   
+   @param {SC.RenderContext} context the render context
+   @param {Boolean} hasBranch YES if the item has a branch
+   @returns {void}
+  */
+  renderBranch: function(context, hasBranch) {
+    var classArray=[];
+    classArray.push('branch',hasBranch ? 'branch-visible' : 'branch-hidden');
+    context.begin('span')
+          .addClass(classArray)
+          .push('&nbsp;')
+          .end();
+  },
+  
   /** 
     Determines if the event occured inside an element with the specified
     classname or not.
@@ -453,22 +601,22 @@ SC.ListItemView = SC.View.extend(
       this._addCheckboxActiveState() ;
       this._isMouseInsideCheckbox = YES ;
     } else if (this._isMouseDownOnCheckbox) {
-     this._removeCheckboxActiveState() ;
-     this._isMouseInsideCheckbox = NO ;
+      this._removeCheckboxActiveState() ;
+      this._isMouseInsideCheckbox = NO ;
     } else if (this._isMouseDownOnDisclosure && this._isInsideDisclosure(evt)) {
       this._addDisclosureActiveState();
       this._isMouseInsideDisclosure = YES;
-   } else if (this._isMouseDownOnDisclosure) {
-     this._removeDisclosureActiveState();
-     this._isMouseInsideDisclosure = NO ;
+    } else if (this._isMouseDownOnDisclosure) {
+      this._removeDisclosureActiveState();
+      this._isMouseInsideDisclosure = NO ;
     } else if (this._isMouseDownOnRightIcon && this._isInsideRightIcon(evt)) {
       this._addRightIconActiveState();
       this._isMouseInsideRightIcon = YES;
-   } else if (this._isMouseDownOnRightIcon) {
-     this._removeRightIconActiveState();
-     this._isMouseInsideRightIcon = NO ;
-   }
-   return NO ;
+    } else if (this._isMouseDownOnRightIcon) {
+      this._removeRightIconActiveState();
+      this._isMouseInsideRightIcon = NO ;
+    }
+    return NO ;
   },
   
   touchStart: function(evt){
@@ -489,43 +637,29 @@ SC.ListItemView = SC.View.extend(
   
   
   _addCheckboxActiveState: function() {
-    if (this.get('isEnabled')) {
-      this.renderer.attr({
-        checkboxActive: YES
-      });
-      this.displayDidChange();
-    }
+    var enabled = this.get('isEnabled');
+    this.$('.sc-checkbox-view').setClass('active', enabled);
   },
   
   _removeCheckboxActiveState: function() {
-   this.renderer.attr({
-     checkboxActive: NO
-   });
-   this.displayDidChange();
+    this.$('.sc-checkbox-view').removeClass('active');
   },
 
   _addDisclosureActiveState: function() {
-    if (this.get('isEnabled')) {
-      this.renderer.attr({
-        disclosureActive: YES
-      });
-      this.displayDidChange();
-    }
+    var enabled = this.get('isEnabled');
+    this.$('img.disclosure').setClass('active', enabled);
   },
   
   _removeDisclosureActiveState: function() {
-    this.renderer.attr({
-      disclosureActive: NO
-    });
-    this.displayDidChange();
+    this.$('img.disclosure').removeClass('active');
   },
 
   _addRightIconActiveState: function() {
-   this.$('img.right-icon').setClass('active', YES);
+    this.$('img.right-icon').setClass('active', YES);
   },
   
   _removeRightIconActiveState: function() {
-   this.$('img.right-icon').removeClass('active');
+    this.$('img.right-icon').removeClass('active');
   },
   
   /**
@@ -539,27 +673,27 @@ SC.ListItemView = SC.View.extend(
     @returns {Boolean} YES if the mouse was on the content element itself.
   */
   contentHitTest: function(evt) {
-   // if not content value is returned, not much to do.
-   var del = this.displayDelegate ;
-   var labelKey = this.getDelegateProperty('contentValueKey', del) ;
-   if (!labelKey) return NO ;
-   
-   // get the element to check for.
-   var el = this.$label()[0] ;
-   if (!el) return NO ; // no label to check for.
-   
-   var cur = evt.target, layer = this.get('layer') ;
-   while(cur && (cur !== layer) && (cur !== window)) {
-     if (cur === el) return YES ;
-     cur = cur.parentNode ;
-   }
-   
-   return NO;
-  },
-  
-  beginEditing: function() {
-    if (this.get('isEditing')) return YES ;
-    //if (!this.get('contentIsEditable')) return NO ;
+    // if not content value is returned, not much to do.
+    var del = this.displayDelegate ;
+    var labelKey = this.getDelegateProperty('contentValueKey', del) ;
+    if (!labelKey) return NO ;
+
+    // get the element to check for.
+    var el = this.$label()[0] ;
+    if (!el) return NO ; // no label to check for.
+
+    var cur = evt.target, layer = this.get('layer') ;
+    while(cur && (cur !== layer) && (cur !== window)) {
+      if (cur === el) return YES ;
+      cur = cur.parentNode ;
+    }
+
+    return NO;
+  },
+  
+  beginEditing: function() {
+    if (this.get('isEditing')) return YES ;
+    //if (!this.get('contentIsEditable')) return NO ;
     return this._beginEditing(YES);
   },
   
@@ -590,10 +724,10 @@ SC.ListItemView = SC.View.extend(
     // nothing to do...    
     if (!parent || !el || el.get('length')===0) return NO ;
     v = (labelKey && content && content.get) ? content.get(labelKey) : null ;
-
+    
     f = this.computeFrameWithParentFrame(null);
     offset = SC.viewportOffset(el[0]);
-
+    
     // if the label has a large line height, try to adjust it to something
     // more reasonable so that it looks right when we show the popup editor.
     oldLineHeight = el.css('lineHeight');
@@ -650,14 +784,6 @@ SC.ListItemView = SC.View.extend(
    return SC.InlineTextFieldView.discardEditing();
   },
   
-  
-  /** @private
-    Allow editing.
-  */
-  inlineEditorShouldBeginEditing: function(inlineEditor) {
-    return YES ;
-  },
-  
   /** @private
    Set editing to true so edits will no longer be allowed.
   */
@@ -704,312 +830,7 @@ SC.ListItemView = SC.View.extend(
     if (labelKey && content && content.set) {
      content.set(labelKey, finalValue) ;
     }
-
-    this.$label().css("opacity", this._oldOpacity);
-
     this.displayDidChange();
-  },
-
-  // ..........................................................
-  // DEPRECATED RENDER SUPPORT
-  //
-
-  deprecatedRenderWarning: function() {
-    if (!SC.ListItemView._deprecatedRenderWarningHasBeenIssued) {
-      SC.ListItemView._deprecatedRenderWarningHasBeenIssued = true;
-      SC.Logger.warn("!!!DEPRECATED LIST ITEM RENDER METHODS BEING USED!!!\n" +
-        "Quilmes comes with a new Renderer system, please consider using it in your custom views to future-proof your application!");
-    }
-  },
-
-  /** @private
-    Fills the passed html-array with strings that can be joined to form the
-    innerHTML of the receiver element.  Also populates an array of classNames
-    to set on the outer element.
-
-    @param {SC.RenderContext} context
-    @param {Boolean} firstTime
-    @returns {void}
-  */
-  __DEPRECATED__render: function(context, firstTime) {
-    this.deprecatedRenderWarning();
-
-    var content = this.get('content'),
-        del     = this.displayDelegate,
-        level   = this.get('outlineLevel'),
-        indent  = this.get('outlineIndent'),
-        key, value, working, classArray = [];
-
-    // add alternating row classes
-    classArray.push((this.get('contentIndex')%2 === 0) ? 'even' : 'odd');
-    context.setClass('disabled', !this.get('isEnabled'));
-
-    // outline level wrapper
-    working = context.begin("div").addClass("sc-outline");
-    if (level>=0 && indent>0) working.addStyle("left", indent*(level+1));
-
-    // handle disclosure triangle
-    value = this.get('disclosureState');
-    if (value !== SC.LEAF_NODE) {
-      this.renderDisclosure(working, value);
-      classArray.push('has-disclosure');
-    }
-
-
-    // handle checkbox
-    key = this.getDelegateProperty('contentCheckboxKey', del) ;
-    if (key) {
-      value = content ? (content.get ? content.get(key) : content[key]) : NO ;
-      this.renderCheckbox(working, value);
-      classArray.push('has-checkbox');
-    }
-
-    // handle icon
-    if (this.getDelegateProperty('hasContentIcon', del)) {
-      key = this.getDelegateProperty('contentIconKey', del) ;
-      value = (key && content) ? (content.get ? content.get(key) : content[key]) : null ;
-
-      this.renderIcon(working, value);
-      classArray.push('has-icon');
-    }
-
-    // handle label -- always invoke
-    key = this.getDelegateProperty('contentValueKey', del) ;
-    value = (key && content) ? (content.get ? content.get(key) : content[key]) : content ;
-    if (value && SC.typeOf(value) !== SC.T_STRING) value = value.toString();
-    if (this.get('escapeHTML')) value = SC.RenderContext.escapeHTML(value);
-    this.renderLabel(working, value);
-
-    // handle right icon
-    if (this.getDelegateProperty('hasContentRightIcon', del)) {
-      key = this.getDelegateProperty('contentRightIconKey', del) ;
-      value = (key && content) ? (content.get ? content.get(key) : content[key]) : null ;
-
-      this.renderRightIcon(working, value);
-      classArray.push('has-right-icon');
-    }
-
-    // handle unread count
-    key = this.getDelegateProperty('contentUnreadCountKey', del) ;
-    value = (key && content) ? (content.get ? content.get(key) : content[key]) : null ;
-    if (!SC.none(value) && (value !== 0)) {
-      this.renderCount(working, value) ;
-      var digits = ['zero', 'one', 'two', 'three', 'four', 'five'];
-      var valueLength = value.toString().length;
-      var digitsLength = digits.length;
-      var digit = (valueLength < digitsLength) ? digits[valueLength] : digits[digitsLength-1];
-      classArray.push('has-count '+digit+'-digit');
-    }
-
-    // handle action
-    key = this.getDelegateProperty('listItemActionProperty', del) ;
-    value = (key && content) ? (content.get ? content.get(key) : content[key]) : null ;
-    if (value) {
-      this.renderAction(working, value);
-      classArray.push('has-action');
-    }
-
-    // handle branch
-    if (this.getDelegateProperty('hasContentBranch', del)) {
-      key = this.getDelegateProperty('contentIsBranchKey', del);
-      value = (key && content) ? (content.get ? content.get(key) : content[key]) : NO ;
-      this.renderBranch(working, value);
-      classArray.push('has-branch');
-    }
-    context.addClass(classArray);
-    context = working.end();
-  },
-
-  /** @private
-    Adds a disclosure triangle with the appropriate display to the content.
-    This method will only be called if the disclosure state of the view is
-    something other than SC.LEAF_NODE.
-
-    @param {SC.RenderContext} context the render context
-    @param {Boolean} state YES, NO or SC.MIXED_STATE
-    @returns {void}
-  */
-  renderDisclosure: function(context, state) {
-    this.deprecatedRenderWarning();
-
-    var key = (state === SC.BRANCH_OPEN) ? "open" : "closed",
-        cache = this._scli_disclosureHtml,
-        html, tmp;
-
-    if (!cache) cache = this.constructor.prototype._scli_disclosureHtml = {};
-    html = cache[key];
-
-    if (!html) {
-      html = cache[key] = '<img src="'+SC.BLANK_IMAGE_URL+'" class="disclosure button '+key+'" />';
-    }
-
-    context.push(html);
-  },
-
-  /** @private
-    Adds a checkbox with the appropriate state to the content.  This method
-    will only be called if the list item view is supposed to have a
-    checkbox.
-
-    @param {SC.RenderContext} context the render context
-    @param {Boolean} state YES, NO or SC.MIXED_STATE
-    @returns {void}
-  */
-  renderCheckbox: function(context, state) {
-    this.deprecatedRenderWarning();
-
-    var key = (state === SC.MIXED_STATE) ? "mixed" : state ? "sel" : "nosel",
-        cache = this._scli_checkboxHtml,
-        isEnabled = this.get('contentIsEditable') && this.get('isEnabled'),
-        html, tmp, classArray=[];
-
-    if (!isEnabled) key = SC.keyFor('disabled', key);
-    if (!cache) cache = this.constructor.prototype._scli_checkboxHtml = {};
-    html = cache[key];
-
-    if (!html) {
-      tmp = SC.RenderContext('div').attr('role', 'button')
-        .classNames(SC.clone(SC.CheckboxView.prototype.classNames));
-
-      // set state on html
-      if (state === SC.MIXED_STATE) classArray.push('mixed');
-      else if(state) classArray.push('sel');
-
-      // disabled
-      if(!isEnabled) classArray.push('disabled');
-
-      tmp.addClass(classArray);
-
-      // now add inner content.  note we do not add a real checkbox because
-      // we don't want to have to setup a change observer on it.
-      tmp.push('<span class="button"></span>');
-
-      // apply edit
-      html = cache[key] = tmp.join();
-    }
-
-    context.push(html);
-  },
-
-  /** @private
-    Generates an icon for the label based on the content.  This method will
-    only be called if the list item view has icons enabled.  You can override
-    this method to display your own type of icon if desired.
-
-    @param {SC.RenderContext} context the render context
-    @param {String} icon a URL or class name.
-    @returns {void}
-  */
-  renderIcon: function(context, icon) {
-    this.deprecatedRenderWarning();
-
-    // get a class name and url to include if relevant
-    var url = null, className = null , classArray=[];
-    if (icon && SC.ImageView.valueIsUrl(icon)) {
-      url = icon; className = '' ;
-    } else {
-      className = icon; url = SC.BLANK_IMAGE_URL ;
-    }
-
-    // generate the img element...
-    classArray.push(className,'icon');
-    context.begin('img')
-            .addClass(classArray)
-            .attr('src', url)
-            .end();
-  },
-
-  /** @private
-   Generates a label based on the content.  You can override this method to
-   display your own type of icon if desired.
-
-   @param {SC.RenderContext} context the render context
-   @param {String} label the label to display, already HTML escaped.
-   @returns {void}
-  */
-  renderLabel: function(context, label) {
-    this.deprecatedRenderWarning();
-
-    context.push('<label>', label || '', '</label>') ;
-  },
-
-  /** @private
-    Generates a right icon for the label based on the content.  This method will
-    only be called if the list item view has icons enabled.  You can override
-    this method to display your own type of icon if desired.
-
-    @param {SC.RenderContext} context the render context
-    @param {String} icon a URL or class name.
-    @returns {void}
-  */
-  renderRightIcon: function(context, icon) {
-    this.deprecatedRenderWarning();
-
-    // get a class name and url to include if relevant
-    var url = null, className = null, classArray=[];
-    if (icon && SC.ImageView.valueIsUrl(icon)) {
-      url = icon; className = '' ;
-    } else {
-      className = icon; url = SC.BLANK_IMAGE_URL ;
-    }
-
-    // generate the img element...
-    classArray.push('right-icon',className);
-    context.begin('img')
-      .addClass(classArray)
-      .attr('src', url)
-    .end();
-  },
-
-  /** @private
-   Generates an unread or other count for the list item.  This method will
-   only be called if the list item view has counts enabled.  You can
-   override this method to display your own type of counts if desired.
-
-   @param {SC.RenderContext} context the render context
-   @param {Number} count the count
-   @returns {void}
-  */
-  renderCount: function(context, count) {
-    this.deprecatedRenderWarning();
-
-    context.push('<span class="count"><span class="inner">',
-                  count.toString(),'</span></span>') ;
-  },
-
-  /** @private
-    Generates the html string used to represent the action item for your
-    list item.  override this to return your own custom HTML
-
-    @param {SC.RenderContext} context the render context
-    @param {String} actionClassName the name of the action item
-    @returns {void}
-  */
-  renderAction: function(context, actionClassName) {
-    this.deprecatedRenderWarning();
-
-    context.push('<img src="',SC.BLANK_IMAGE_URL,'" class="action" />');
-  },
-
-  /** @private
-   Generates the string used to represent the branch arrow. override this to
-   return your own custom HTML
-
-   @param {SC.RenderContext} context the render context
-   @param {Boolean} hasBranch YES if the item has a branch
-   @returns {void}
-  */
-  renderBranch: function(context, hasBranch) {
-    this.deprecatedRenderWarning();
-
-    var classArray=[];
-    classArray.push('branch',hasBranch ? 'branch-visible' : 'branch-hidden');
-    context.begin('span')
-          .addClass(classArray)
-          .push('&nbsp;')
-          .end();
   }
   
 });
-
-SC.ListItemView._deprecatedRenderWarningHasBeenIssued = false;