sproutit-sproutcore 1.0.0.20090416161445 → 1.0.0.20090720093355

data/frameworks/sproutcore/frameworks/foundation/tests/views/view/isVisibleInWindow.js

@@ -29,7 +29,7 @@ module("isVisibleInWindow", {
   
   teardown: function() {
     view = null ;
-    pane.remove() ;
+    pane.remove().destroy() ;
     pane = null ;
   }
   
@@ -99,4 +99,15 @@ test("layoutChildViewsIfNeeded should not be invoked even if layer needs layout
 	equals(callCount, 1, 'layoutChildViews should exec now b/c isVisibleInWindow is YES');
 });
 
+test("setting isVisible to NO should trigger a layer update to hide the view", function() {
   
+  SC.RunLoop.begin();
+  pane.appendChild(view);
+  SC.RunLoop.end();
+  
+  SC.RunLoop.begin();
+  view.set('isVisible', NO);
+  SC.RunLoop.end();
+  
+  ok(view.renderContext(view.get('layer')).classNames().indexOf('hidden') >= 0, "layer should have the 'hidden' class");
+});

data/frameworks/sproutcore/frameworks/foundation/tests/views/view/layoutStyle.js

@@ -2,12 +2,27 @@
 // View Layout Unit Tests
 // ========================================================================
 
-/*globals module test ok isObj */
+/*globals module test ok same equals */
 
 /* These unit tests verify:  layout(), frame(), styleLayout() and clippingFrame(). */
 
 var parent, child;
 
+/*
+  helper method to test the layout of a view.  Applies the passed layout to a
+  view, then compares both its frame and layoutStyle properties both before
+  and after adding the view to a parent view.  
+
+  You can pass frame rects with some properties missing and they will be
+  filled in for you just so you don't have to write so much code.
+  
+  @param {Hash} layout layout hash to test
+  @param {Hash} no_f expected frame for view with no parent
+  @param {Hash} no_s expected layoutStyle for view with no parent
+  @param {Hash} with_f expected frame for view with parent
+  @param {Hash} with_s expected layoutStyle for view with parent
+  @returns {void}
+*/
 function performLayoutTest(layout, no_f, no_s, with_f, with_s) {
   
   // make sure we add null properties and convert numbers to 'XXpx' to style layout.
@@ -30,7 +45,9 @@ function performLayoutTest(layout, no_f, no_s, with_f, with_s) {
   });
   
   // add parent
+  SC.RunLoop.begin();
   parent.appendChild(child);
+  SC.RunLoop.end();
   
   // test again
   same(child.get('frame'), with_f, "FRAME WITH PARENT".fmt(SC.inspect(child.get('frame')), SC.inspect(with_f))) ;  
@@ -39,6 +56,10 @@ function performLayoutTest(layout, no_f, no_s, with_f, with_s) {
   });
 }
 
+/**
+  Helper setup that creates a parent and child view so that you can do basic
+  tests.
+*/
 var commonSetup = {
   setup: function() {
     
@@ -117,6 +138,30 @@ test("layout {centerX, centerY, width, height}", function() {
   performLayoutTest(layout, no_f, s, with_f, s) ;
 }) ;
 
+test("layout {top, left, width: auto, height: auto}", function() {
+  child = SC.View.create({
+    useStaticLayout: YES,
+    render: function(context) {
+      // needed for auto
+      context.push('<div style="padding: 10px"></div>');
+    }
+  });
+
+  // parent MUST have a layer.
+  parent.createLayer();
+  var layer = parent.get('layer');
+  document.body.appendChild(layer);
+  
+  var layout = { top: 0, left: 0, width: 'auto', height: 'auto' };
+  var no_f = { x: 0, y: 0, width: 0, height: 0 };
+  var with_f = { x: 0, y: 0, width: 20, height: 20 };
+  var s = { top: 0, left: 0, width: 'auto', height: 'auto' };
+  
+  performLayoutTest(layout, no_f, s, with_f, s);
+  
+  layer.parentNode.removeChild(layer);
+});
+
 // ..........................................................
 // TEST FRAME/STYLEFRAME WITH INVALID LAYOUT VARIATIONS
 // 
@@ -201,6 +246,22 @@ test("layout {top, left, bottom, right, centerX, centerY, height, width} - top/l
   
 }) ;
 
+
+test("layout {centerX, centerY, width:auto, height:auto}", function() {
+  var error=null;
+  var layout = { centerX: 10, centerY: 10, width: 'auto', height: 'auto' };
+  child.set('layout', layout) ;
+  try{
+    child.layoutStyle();
+  }catch(e){
+    error=e;
+  }
+  equals(SC.T_ERROR,SC.typeOf(error),'Layout style functions should throw and '+
+  'error if centerx/y and width/height are set at the same time ' + error );
+  
+}) ;
+
+
 // ..........................................................
 // TEST FRAME/STYLEFRAME WHEN PARENT VIEW IS RESIZED
 // 
@@ -211,11 +272,11 @@ function verifyFrameResize(layout, before, after) {
   parent.appendChild(child);
   child.set('layout', layout);
   
-  isObj(child.get('frame'), before, "Before: %@ == %@".fmt(SC.inspect(child.get('frame')), SC.inspect(before))) ;
+  same(child.get('frame'), before, "Before: %@ == %@".fmt(SC.inspect(child.get('frame')), SC.inspect(before))) ;
   
   parent.adjust('width', 300).adjust('height', 300);
   
-  isObj(child.get('frame'), after, "After: %@ == %@".fmt(SC.inspect(child.get('frame')), SC.inspect(after)));
+  same(child.get('frame'), after, "After: %@ == %@".fmt(SC.inspect(child.get('frame')), SC.inspect(after)));
   
 }
 
@@ -246,3 +307,22 @@ test("frame loc shifts with centerX/centerY", function(){
   var after =  { x: 130, y: 130, width: 60, height: 60 };
   verifyFrameResize(layout, before, after);
 });
+
+
+// test("frame size shifts with top/left/bottom/right", function(){
+//   var error=null;
+//   var layout = { top: 10, left: 10, bottom: 10, right: 10 };
+//   parent.appendChild(child);
+//   child.set('layout', layout);
+//   child.get('frame');
+//   parent.adjust('width', 'auto').adjust('height', 'auto');
+//   try{
+//     child.get('frame');
+//   }catch(e){
+//     error=e;
+//   }
+//   equals(SC.T_ERROR,SC.typeOf(error),'Layout style functions should throw and '+
+//   'error if centerx/y and width/height are set at the same time ' + error );
+//       
+//    
+// });

data/frameworks/sproutcore/frameworks/foundation/tests/views/view/prepareContext.js

@@ -24,7 +24,7 @@ test("populates context with layerId & classNames from view if firstTime", funct
   context = view.renderContext();
   view.prepareContext(context, NO);
   ok(context.id() !== 'foo', 'did not set id');
-  ok(!context.hasClass('bar'), 'did not set class name');
+  ok(context.hasClass('bar'), 'did set class name');
 });
 
 test("invokes renderLayout if first time", function() {

data/frameworks/sproutcore/frameworks/foundation/tests/views/view/updateLayer.js

@@ -35,7 +35,9 @@ module("SC.View#updateLayerIfNeeded", {
   setup: function() {
     // setup a fake view class so that updateLayerIfNeeded() will call
     // updateLayer() if needed.  updateLayer() is faked to isolate test
+    var layer = document.createElement('div');
     view = SC.View.create({
+      layer: layer, // fake it...
       isVisibleInWindow: YES,
       layerNeedsUpdate: YES,
       updateLayer: function() { callCount++; }
@@ -120,7 +122,9 @@ module("SC.View#updateLayer - integration");
 
 test("layerNeedsUpdate actually triggers updateLayer", function() {
   var callCount = 0 ;
+  var layer = document.createElement('div');
   var view = SC.View.create({
+    layer: layer, // fake it...
     isVisibleInWindow: YES,
     updateLayer: function() { callCount++; }
   });

data/frameworks/sproutcore/frameworks/foundation/views/container.js

@@ -70,7 +70,7 @@ SC.ContainerView = SC.View.extend(
   /** @private */
   createChildViews: function() {
     // if contentView is defined, then create the content
-    var view = this.contentView ;
+    var view = this.get('contentView') ;
     if (view) {
       view = this.contentView = this.createChildView(view) ;
       this.childViews = [view] ;

data/frameworks/sproutcore/frameworks/foundation/views/field.js

@@ -27,10 +27,16 @@ sc_require('mixins/validatable') ;
 */
 SC.FieldView = SC.View.extend(SC.Control, SC.Validatable,
 /** @scope SC.FieldView.prototype */ {
+  
+  /**
+     If YES then we use textarea instead of input. 
+     WARNING: Use only with textField** Juan
+  */
+  isTextArea: NO,
 
   /**
     The raw value of the field itself.  This is computed from the 'value'
-    propery by passing it through any validator you might have set.  This is 
+    property by passing it through any validator you might have set.  This is 
     the value that will be set on the field itself when the view is updated.
     
     @property {String}
@@ -52,12 +58,16 @@ SC.FieldView = SC.View.extend(SC.Control, SC.Validatable,
     current isEnabled state among other things.
   */
   $input: function() { 
-    return this.$('input').andSelf().filter('input'); 
+    if(this.get('isTextArea')){
+      return this.$('textarea').andSelf().filter('textarea'); 
+    }else{
+      return this.$('input').andSelf().filter('input');
+    }
   },
   
   /**
     Override to set the actual value of the field.
-
+    
     The default implementation will simple copy the newValue to the value
     attribute of any input tags in the receiver view.  You can override this
     method to provide specific functionality needed by your view.
@@ -70,7 +80,7 @@ SC.FieldView = SC.View.extend(SC.Control, SC.Validatable,
     this.$input().val(newValue);
     return this ;
   },
-
+  
   /**
     Override to retrieve the actual value of the field.
     
@@ -104,7 +114,6 @@ SC.FieldView = SC.View.extend(SC.Control, SC.Validatable,
     @returns {Boolean|SC.Error} result of validation.
   */
   fieldValueDidChange: function(partialChange) {
-
     // collect the field value and convert it back to a value
     var fieldValue = this.getFieldValue();
     var value = this.objectForFieldValue(fieldValue, partialChange);
@@ -174,13 +183,13 @@ SC.FieldView = SC.View.extend(SC.Control, SC.Validatable,
     // only change field value if it has changed from the last time we 
     // set it.  This allows the browser-native field value to change without
     // this method interfering with it.
-    var fieldValue = this.get('fieldValue');
-    this.setFieldValue(fieldValue);
+    //var fieldValue = this.get('fieldValue');
+    //this.setFieldValue(fieldValue);
   },
   
   // ACTIONS
   // You generally do not need to override these but they may be used.
-
+  
   /**
     Called to perform validation on the field just before the form 
     is submitted.  If you have a validator attached, this will get the
@@ -196,20 +205,23 @@ SC.FieldView = SC.View.extend(SC.Control, SC.Validatable,
   
   // OVERRIDE IN YOUR SUBCLASS
   // Override these primitives in your subclass as required.
-
+  
   /**
     Allow the browser to do its normal event handling for the mouse down
     event.  But first, set isActive to YES.
   */
   mouseDown: function(evt) { 
+    // This has to be fixed for safari... for now we don't set is active 
+    // because any re rendering causes text selection to behave erratically
+    
     if (this.get('isEnabled')) {
-      this.set('isActive', YES); 
-      this._field_isMouseDown = YES;
-    }
+              this.set('isActive', YES); 
+              this._field_isMouseDown = YES;
+            }
     evt.allowDefault(); 
     return YES; 
   },
-
+  
   /** @private
     Remove the active class on mouseOut if mouse is down.
   */  
@@ -218,7 +230,7 @@ SC.FieldView = SC.View.extend(SC.Control, SC.Validatable,
     evt.allowDefault();
     return YES;
   },
-
+  
   /** @private
     If mouse was down and we renter the button area, set the active state again.
   */  
@@ -227,7 +239,7 @@ SC.FieldView = SC.View.extend(SC.Control, SC.Validatable,
     evt.allowDefault();
     return YES;
   },
-
+  
   _field_isMouseDown: NO,
   
   /** @private
@@ -255,7 +267,6 @@ SC.FieldView = SC.View.extend(SC.Control, SC.Validatable,
   // these methods use the validator to convert the raw field value returned
   // by your subclass into an object and visa versa.
   _field_setFieldValue: function(newValue) {
-    
     this.propertyWillChange('fieldValue');
     if (this.fieldValueForObject) {
       newValue = this.fieldValueForObject(newValue) ;

data/frameworks/sproutcore/frameworks/foundation/views/image.js

@@ -107,8 +107,11 @@ SC.ImageView = SC.View.extend(SC.Control,
     an image to load.
   */
   _image_valueDidChange: function() {
-    var value = this.get('value'), isUrl = SC.ImageView.valueIsUrl(value);
+    var value = this.get('value'), isUrl;
+    if(value && value.isEnumerable) value = value.firstObject();
     
+    isUrl = SC.ImageView.valueIsUrl(value);
+
     // if the old image is still loading, cancel it
     // if (this._loadingUrl) SC.imageCache.abortImage(this._loadingUrl);
     

data/frameworks/sproutcore/frameworks/foundation/views/label.js

@@ -97,7 +97,7 @@ SC.LabelView = SC.View.extend(SC.Control,
     var value = this.get('value') ;
     
     // 1. apply the formatter
-    var formatter = this.getDelegateProperty(this.displayDelegate, 'formatter') ;
+    var formatter = this.getDelegateProperty('formatter', this.displayDelegate) ;
     if (formatter) {
       var formattedValue = (SC.typeOf(formatter) === SC.T_FUNCTION) ? formatter(value, this) : formatter.fieldValueForObject(value, this) ;
       if (!SC.none(formattedValue)) value = formattedValue ;
@@ -119,7 +119,7 @@ SC.LabelView = SC.View.extend(SC.Control,
     if (!SC.none(value) && value.toString) value = value.toString() ;
     
     // 4. Localize
-    if (value && this.getDelegateProperty(this.displayDelegate, 'localize')) value = value.loc() ;
+    if (value && this.getDelegateProperty('localize', this.displayDelegate)) value = value.loc() ;
 
     // 5. escapeHTML if needed
     if (this.get('escapeHTML')) value = SC.RenderContext.escapeHTML(value);
@@ -167,16 +167,20 @@ SC.LabelView = SC.View.extend(SC.Control,
   beginEditing: function() {
     if (this.get('isEditing')) return YES ;
     if (!this.get('isEditable')) return NO ;
-    
+
+    var el = this.$();
     var value = this.get('value') || '' ;
-    var f = this.convertFrameToView(this.get('frame'), null) ;
-    var el = this.rootElement;
+    var f = SC.viewportOffset(el[0]) ;
+    var frameTemp = this.convertFrameFromView(this.get('frame'), null) ;
+    f.width=frameTemp.width;
+    f.height=frameTemp.height;
     SC.InlineTextFieldView.beginEditing({
       frame: f,
       delegate: this,
       exampleElement: el,
       value: value, 
       multiline: NO, 
+      isCollection: NO,
       validator: this.get('validator')
     });
   },
@@ -233,7 +237,9 @@ SC.LabelView = SC.View.extend(SC.Control,
     this.set('isEditing', NO) ;
   },
 
-  displayProperties: ['displayValue', 'textAlign', 'fontWeight', 'icon'],
+  displayProperties: 'displayValue textAlign fontWeight icon'.w(),
+  
+  _TEMPORARY_CLASS_HASH: {},
   
   render: function(context, firstTime) {
     var value = this.get('displayValue');
@@ -254,6 +260,10 @@ SC.LabelView = SC.View.extend(SC.Control,
     context.addStyle('text-align',  this.get('textAlign'))
            .addStyle('font-weight', this.get('fontWeight'));
            
+    var classes = this._TEMPORARY_CLASS_HASH;
+    classes.icon = !!this.get('icon');
+    context.setClass(classes);
+           
     // if we are editing, set the opacity to 0
     if (this.get('isEditing')) context.addStyle('opacity', 0.0);
   }

data/frameworks/sproutcore/frameworks/{desktop → foundation}/views/text_field.js

@@ -5,6 +5,8 @@
 // License:   Licened under MIT license (see license.js)
 // ==========================================================================
 
+
+sc_require('views/field') ;
 /**
   @class
   
@@ -25,6 +27,11 @@ SC.TextFieldView = SC.FieldView.extend(SC.StaticLayout, SC.Editable,
   // PROPERTIES
   // 
   
+  /**
+    If YES, the field will hide its text from display. The default value is NO.
+  */
+  isPassword: NO,
+  
   /**
     The hint to display while the field is not active.  Can be a loc key.
   */  
@@ -34,6 +41,7 @@ SC.TextFieldView = SC.FieldView.extend(SC.StaticLayout, SC.Editable,
     If YES then the text field is currently editing. 
   */
   isEditing: NO,
+
   
   /** isEditable maps to isEnabled with a TextField. */
   isEditable: function() {
@@ -47,9 +55,11 @@ SC.TextFieldView = SC.FieldView.extend(SC.StaticLayout, SC.Editable,
   displayProperties: 'hint fieldValue isEditing'.w(),
   
   render: function(context, firstTime) {
+    
     var disabled = this.get('isEnabled') ? '' : 'disabled="disabled"';
     var name = SC.guidFor(this);
     var hint = this.get('hint');
+    var type = this.get('isPassword') ? 'password' : 'text';
 
     // always have at least an empty string
     var v = this.get('fieldValue');
@@ -60,20 +70,35 @@ SC.TextFieldView = SC.FieldView.extend(SC.StaticLayout, SC.Editable,
     
     if (firstTime) {
       context.push('<span class="sc-hint">', hint, '</span>');
-      context.push('<input type="text" name="%@" %@ value="%@" />'.fmt(name, disabled, v));
-      
+      if(this.get('isTextArea')){
+          context.push('<textarea name="%@" %@ value="%@"></textarea>'.fmt(name, disabled, v));
+      }else{
+        context.push('<input type="%@" name="%@" %@ value="%@"></input>'.fmt(type, name, disabled, v));
+      }
     // if this is not first time rendering, update the hint itself since we
     // can't just blow away the text field like we might most other controls
     } else {
       if (hint !== this._textField_currentHint) {
         this._textField_currentHint = hint ;
         this.$('.sc-hint').text(hint);
-      }          
+      }  
+      if(!this.get('isEnabled')){
+        this.$field()[0].disabled='true';
+      }else{
+        this.$field()[0].disabled=null;
+      }
+              
     }
   },
 
   // more efficient input
-  $input: function() { return this.$('input'); },
+  $field: function() { 
+    if(this.get('isTextArea')){
+      return this.$('textarea'); 
+    }else{
+      return this.$('input');
+    }
+  },
   
   // ..........................................................
   // HANDLE NATIVE CONTROL EVENTS
@@ -82,7 +107,7 @@ SC.TextFieldView = SC.FieldView.extend(SC.StaticLayout, SC.Editable,
   didCreateLayer: function() {
     sc_super();
 
-    var input = this.$input();
+    var input = this.$field();
     SC.Event.add(input, 'focus', this, this._textField_fieldDidFocus);
     SC.Event.add(input, 'blur',  this, this._textField_fieldDidBlur);
   },
@@ -90,7 +115,7 @@ SC.TextFieldView = SC.FieldView.extend(SC.StaticLayout, SC.Editable,
   willDestroyLayer: function() {
     sc_super();
     
-    var input = this.$input();
+    var input = this.$field();
     SC.Event.remove(input, 'focus', this, this._textField_fieldDidFocus);
     SC.Event.remove(input, 'blur',  this, this._textField_fieldDidBlur);
   },
@@ -131,17 +156,17 @@ SC.TextFieldView = SC.FieldView.extend(SC.StaticLayout, SC.Editable,
           left   = p.x, 
           width  = layer.offsetWidth, 
           height = layer.offsetHeight ;
-
-      // brittle, but the layout is correct :(
-      top += 3; left += 3; width -= 6; height -= 6; 
+          
+      top -= 2; 
+      left -= 2;  
       
       var style = 'position: fixed; top: %@px; left: %@px; width: %@px; height: %@px;'.fmt(top, left, width, height) ;
-      this.$input().attr('style', style) ;
+      this.$field().attr('style', style) ;
     }
   },
 
   _removeFirefoxCursorFix: function() {
-    if (SC.browser.mozilla) this.$input().attr('style', '') ;
+    if (SC.browser.mozilla) this.$field().attr('style', '') ;
   },
   
   /** tied to the isEnabled state */
@@ -163,7 +188,7 @@ SC.TextFieldView = SC.FieldView.extend(SC.StaticLayout, SC.Editable,
     if (!this._isFocused) {
       this._isFocused = YES ;
       if (this.get('isVisibleInWindow')) {
-        this.$input().get(0).focus();
+        this.$field().get(0).focus();
         this.invokeOnce(this._selectRootElement) ;
       }
     }
@@ -172,7 +197,7 @@ SC.TextFieldView = SC.FieldView.extend(SC.StaticLayout, SC.Editable,
   // In IE, you can't modify functions on DOM elements so we need to wrap the 
   // call to select() like this.
   _selectRootElement: function() {
-    this.$input().get(0).select() ;
+    this.$field()[0].select() ;
   },
   
   // when we lose first responder, blur the text field if needed and show
@@ -181,7 +206,7 @@ SC.TextFieldView = SC.FieldView.extend(SC.StaticLayout, SC.Editable,
   didLoseKeyResponderTo: function(keyView) {
     if (this._isFocused) {
       this._isFocused = NO ;
-      this.$input().get(0).blur() ;
+      this.$field().get(0).blur() ;
     } else {
       this.fieldValueDidChange() ;
     }
@@ -229,5 +254,4 @@ SC.TextFieldView = SC.FieldView.extend(SC.StaticLayout, SC.Editable,
     } else return sc_super();
   }
   
-
 }) ;