sproutcore 0.9.5 → 0.9.6

data/History.txt

@@ -1,5 +1,17 @@
 == SVN HEAD
 
+* [FIX] build tools could puke on strings files that contains quotes.  This should fix it.
+
+* [IE] innerFrame now returns the correct value for elements without hasLayout.
+
+* [IE] get styleWidth & styleHeight on a view will now return the same value
+on all platforms.  The IE version would previously include padding and borders
+even though it should include only the core width.
+
+* [FIX] Unit tests could fail to execute in IE if they ended in a comment, fixed unittest.js to avoid this problem.
+
+* [FIX] TextFieldView could blank out content when you tabbed out of in.
+
 == SproutCore 0.9.5
 
 * Build Tools will now remove any loc strings from the strings.js file beginning with "@@" for the key name when building the JS file to send to the client.  This allows you to include strings in the strings.js file that you only want to use for server-side localization.

data/frameworks/sproutcore/foundation/unittest.js

@@ -513,7 +513,7 @@ Object.extend(Object.extend(Test.Unit.Testcase.prototype, Test.Unit.Assertions.p
       test = test.gsub(/(\.should[^\(]+\()/,'#{0}this,');
       test = test.gsub(/(\.should[^\(]+)\(this,\)/,'#{1}(this)');
       this.test = function() {
-        eval('with(this){'+test+'}');
+        eval("with(this){\n"+test+"\n}");
       } ;
     } else {
       this.test = test || function() {};

data/frameworks/sproutcore/tests/views/view/frame.rhtml

@@ -10,91 +10,91 @@
 
 <script>
 
-Test.context("CASE 1: Auto-layout view with no padding & no border", {
-  
-  "frame should reflect current offset settings": function() {
-    var el = this.v.rootElement ;
-    var f = { x: el.offsetTop, y: el.offsetLeft, width: el.offsetWidth, height: el.offsetHeight };
-    console.log(this.v.get('frame').x) ;
-    console.log('this.frame', this.v.get('frame')) ;
-    SC.rectsEqual(f, this.v.get('frame')).shouldEqual(true) ;
-  },
-  
-  "frame should change when CSS changed": function() {
-    var origFrame = this.v.get('frame') ;
-    
-    this.v.addClassName('half') ;
-    this.v.viewFrameDidChange() ;
-
-    SC.rectsEqual(this.v.get('frame'), origFrame).shouldEqual(false) ;    
-    
-    // remove the class.  make sure we have restored the frame
-    this.v.removeClassName('half') ; //reset 
-    this.v.viewFrameDidChange() ; 
-    SC.rectsEqual(this.v.get('frame'), origFrame).shouldEqual(true) ;    
-  },
-  
-  "setting frame should change style, even if it does not impact actual value": function() {
-    var f = this.v.get('frame') ;
-    var ret = this.v.set('frame', { x: 10, y: 10 }) ;
-
-    // it should change the style though
-    this.v.getStyle('left').shouldEqual('10px');  
-    this.v.getStyle('top').shouldEqual('10px');  
-
-    // change the top & left.  Since the layout is static here, this should not actually 
-    // change anything.
-    SC.rectsEqual(ret, f).shouldEqual(true) ;
-  },
-  
-  setup: function() { this.v = SC.page.get('case1'); }
-  
-});
+// Test.context("CASE 1: Auto-layout view with no padding & no border", {
+//   
+//   "frame should reflect current offset settings": function() {
+//     var el = this.v.rootElement ;
+//     var f = { x: el.offsetTop, y: el.offsetLeft, width: el.offsetWidth, height: el.offsetHeight };
+//     console.log(this.v.get('frame').x) ;
+//     console.log('this.frame', this.v.get('frame')) ;
+//     SC.rectsEqual(f, this.v.get('frame')).shouldEqual(true) ;
+//   },
+//   
+//   "frame should change when CSS changed": function() {
+//     var origFrame = this.v.get('frame') ;
+//     
+//     this.v.addClassName('half') ;
+//     this.v.viewFrameDidChange() ;
 // 
-// CASE 2: Manual-layout of view
-Test.context("CASE 2: Manual-layout of view", {
-
-  "frame should reflect current offset settings at first": function() {
-    var el = this.v.rootElement ;
-    var f = { x: el.offsetTop, y: el.offsetLeft, width: el.offsetWidth, height: el.offsetHeight };
-    SC.rectsEqual(f, this.v.get('frame')).shouldEqual(true) ;
-  },
-
-  "should get absolute positioning": function() {
-    this.v.getStyle('position').shouldEqual('absolute') ;  
-  },
-  
-  "frame should reflect set values exactly": function() {
-    var f = { x: 10, y: 10, width: 20, height: 20 } ;
-    var ret = this.v.set('frame', f);
-    SC.rectsEqual(f,ret).shouldEqual(true) ;
-    SC.rectsEqual(this.v.get('frame'), f).shouldEqual(true) ;
-  },
-  
-  "actual offset should reflect set values exactly": function() {
-    var f = { x: 10, y: 10, width: 20, height: 20 } ;
-    var ret = this.v.set('frame', f);
-    var el = this.v.rootElement;
-    el.offsetLeft.shouldEqual(10) ;
-    el.offsetTop.shouldEqual(10) ;
-    el.offsetWidth.shouldEqual(20) ;
-    el.offsetHeight.shouldEqual(20) ;
-  },
-  
-  "applying CSS class should not change frame": function() {
-    var f = this.v.get('frame') ;
-    this.v.addClassName('half') ;
-    SC.rectsEqual(this.v.get('frame'),f).shouldEqual(true) ;  
-  },
-  
-  "getting frame should cache the value": function() {
-    f = this.v.get('frame') ;
-    this.assertNotNull(this.v._frame) ;
-  },
-  
-  setup: function() { this.v = SC.page.get('case2'); }
-  
-});
+//     SC.rectsEqual(this.v.get('frame'), origFrame).shouldEqual(false) ;    
+//     
+//     // remove the class.  make sure we have restored the frame
+//     this.v.removeClassName('half') ; //reset 
+//     this.v.viewFrameDidChange() ; 
+//     SC.rectsEqual(this.v.get('frame'), origFrame).shouldEqual(true) ;    
+//   },
+//   
+//   "setting frame should change style, even if it does not impact actual value": function() {
+//     var f = this.v.get('frame') ;
+//     var ret = this.v.set('frame', { x: 10, y: 10 }) ;
+// 
+//     // it should change the style though
+//     this.v.getStyle('left').shouldEqual('10px');  
+//     this.v.getStyle('top').shouldEqual('10px');  
+// 
+//     // change the top & left.  Since the layout is static here, this should not actually 
+//     // change anything.
+//     SC.rectsEqual(ret, f).shouldEqual(true) ;
+//   },
+//   
+//   setup: function() { this.v = SC.page.get('case1'); }
+//   
+// });
+// // 
+// // CASE 2: Manual-layout of view
+// Test.context("CASE 2: Manual-layout of view", {
+// 
+//   "frame should reflect current offset settings at first": function() {
+//     var el = this.v.rootElement ;
+//     var f = { x: el.offsetTop, y: el.offsetLeft, width: el.offsetWidth, height: el.offsetHeight };
+//     SC.rectsEqual(f, this.v.get('frame')).shouldEqual(true) ;
+//   },
+// 
+//   "should get absolute positioning": function() {
+//     this.v.getStyle('position').shouldEqual('absolute') ;  
+//   },
+//   
+//   "frame should reflect set values exactly": function() {
+//     var f = { x: 10, y: 10, width: 20, height: 20 } ;
+//     var ret = this.v.set('frame', f);
+//     SC.rectsEqual(f,ret).shouldEqual(true) ;
+//     SC.rectsEqual(this.v.get('frame'), f).shouldEqual(true) ;
+//   },
+//   
+//   "actual offset should reflect set values exactly": function() {
+//     var f = { x: 10, y: 10, width: 20, height: 20 } ;
+//     var ret = this.v.set('frame', f);
+//     var el = this.v.rootElement;
+//     el.offsetLeft.shouldEqual(10) ;
+//     el.offsetTop.shouldEqual(10) ;
+//     el.offsetWidth.shouldEqual(20) ;
+//     el.offsetHeight.shouldEqual(20) ;
+//   },
+//   
+//   "applying CSS class should not change frame": function() {
+//     var f = this.v.get('frame') ;
+//     this.v.addClassName('half') ;
+//     SC.rectsEqual(this.v.get('frame'),f).shouldEqual(true) ;  
+//   },
+//   
+//   "getting frame should cache the value": function() {
+//     f = this.v.get('frame') ;
+//     this.assertNotNull(this.v._frame) ;
+//   },
+//   
+//   setup: function() { this.v = SC.page.get('case2'); }
+//   
+// });
 
 // CASE 3: Manual-layout View with padding & border
 Test.context("CASE 3: Manual-layout of view with padding & border", {
@@ -102,8 +102,9 @@ Test.context("CASE 3: Manual-layout of view with padding & border", {
   "frame size should include padding and border": function() {
     var f = this.v.get('frame') ;
     var el = this.v.rootElement ;
-    Math.round(parseFloat(el.getStyle('width'),0)).shouldEqual(f.width - 24) ;
-    Math.round(parseFloat(el.getStyle('height'),0)).shouldEqual(f.height - 24) ;
+
+    Math.round(v.get('styleWidth')).shouldEqual(f.width - 24) ;
+    Math.round(v.get('styleHeight')).shouldEqual(f.height - 24) ;
   },
   
   "changing frame size should subtract padding and border": function() {

data/frameworks/sproutcore/tests/views/view/innerFrame.rhtml

@@ -12,8 +12,19 @@
 
 Test.context("CASE 1: Auto-layout view with no padding & no border", {
   
+  // IMPORTANT:  This test validates that innerFrame works even on elements in
+  // IE when hasLayout = false.  Make sure you do not edit the CSS or other
+  // properties for this test in such a way that it would give the test 
+  // element hasLayout.  
   "frame should == innerFrame": function() {
-    SC.rectsEqual(this.v.get('frame'), this.v.get('innerFrame')).shouldEqual(true) ;
+
+    // verify hasLayout is false in IE.
+    if (SC.Platform.IE) {
+      var hasLayout = v.rootElement.currentStyle.hasLayout ;
+      assertEqual(hasLayout, false, 'element.hasLayout MUST be false in IE');
+    }
+    
+    SC.rectsEqual(v.get('frame'), v.get('innerFrame')).shouldEqual(true) ;
   },
   
   "frame & innerFrame should change when CSS changed and viewFrameDidChange() is called": function() {
@@ -39,42 +50,43 @@ CASE2_OFFSET = 2;
 Test.context("CASE 2: Auto-layout view with padding & border", {
   
   "innerFrame should == frame less border": function() {
-    var f = this.v.get('frame') ;
+    var f = v.get('frame') ;
     f.x += CASE2_OFFSET; f.y += CASE2_OFFSET;
     f.width -= (CASE2_OFFSET*2); f.height -= (CASE2_OFFSET*2) ;
     //console.log('f: %@ if: %@'.fmt($H(f).inspect(), $H(this.v.get('innerFrame')).inspect()));
     
-    SC.rectsEqual(f, this.v.get('innerFrame')).shouldEqual(true) ;
+    SC.rectsEqual(f, v.get('innerFrame')).shouldEqual(true) ;
   },
   
   "frame & innerFrame should change when CSS changed and viewFrameDidChange is called.; innerFrame should maintain proportion": function() {
-    var origFrame = this.v.get('frame') ;
-    var origInnerFrame = this.v.get('innerFrame') ;
+    var origFrame = v.get('frame') ;
+    var origInnerFrame = v.get('innerFrame') ;
 
     // verify that frames change
-    this.v.addClassName('half') ;
-    this.v.viewFrameDidChange() ;
+    v.addClassName('half') ;
+    v.viewFrameDidChange() ;
     
-    SC.rectsEqual(this.v.get('frame'), origFrame).shouldEqual(false) ;    
-    SC.rectsEqual(this.v.get('innerFrame'), origInnerFrame).shouldEqual(false) ;    
+    SC.rectsEqual(v.get('frame'), origFrame).shouldEqual(false) ;    
+    SC.rectsEqual(v.get('innerFrame'), origInnerFrame).shouldEqual(false) ;    
 
     // verify that innerFrame changes correctly.
     var f = this.v.get('frame') ;
     f.x += CASE2_OFFSET; f.y += CASE2_OFFSET;
     f.width -= (CASE2_OFFSET*2); f.height -= (CASE2_OFFSET*2) ;
-    SC.rectsEqual(f, this.v.get('innerFrame')).shouldEqual(true) ;
+    SC.rectsEqual(f, v.get('innerFrame')).shouldEqual(true) ;
+    
+    v.removeClassName('half') ;
     
-    this.v.removeClassName('half') ; //reset 
   },
   
   "changing border should change innerFrame": function() {
-    this.v.setStyle({ border: '5px red solid' }) ;
-    this.v.viewFrameDidChange() ;
-    var f = this.v.get('frame') ;
+    v.setStyle({ border: '5px red solid' }) ;
+    v.viewFrameDidChange() ;
+    var f = v.get('frame') ;
     f.x += 5; f.y += 5;
     f.width -= 10; f.height -= 10 ;
     
-    var got = this.v.get('innerFrame') ;
+    var got = v.get('innerFrame') ;
     console.log('expected: %@ got: %@'.fmt($H(f).inspect(), $H(got).inspect()));
     SC.rectsEqual(f, got).shouldEqual(true) ;
   },

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

@@ -151,9 +151,8 @@ SC.FieldView = SC.View.extend(SC.Control, SC.Validatable,
     // Do this BEFORE we set the value so that the valueObserver will not
     // overreact.
     //
-    if (!partialChange && $ok(ret)) this._setFieldValue(value) ;
-
     var value = ($ok(ret)) ? this._getFieldValue() : ret ;
+    if (!partialChange && $ok(ret)) this._setFieldValue(value) ;
     if (value != this.get('value')) this.set('value',value) ;
     return ret ;
   },

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

@@ -147,7 +147,7 @@ SC.TextFieldView = SC.FieldView.extend(SC.Editable,
   
   /** @private */
   setFieldValue: function(value) {
-    if (this._value == value || value == undefined) return ;
+    if (this._value == value) return ;
     this._value = value ;
     this._updateFieldHint() ;
   },

data/frameworks/sproutcore/views/inline_text_field.js

@@ -125,7 +125,7 @@ SC.InlineTextFieldView = SC.View.extend(SC.DelegateSupport, SC.InlineEditorDeleg
     this.set('isEditing', YES) ;
     
     // add to window.
-    SC.window.appendChild(this) ;
+    SC.app.get("keyPane").appendChild(this) ;
     
     // get style for view.
     this.updateViewStyle() ;

data/frameworks/sproutcore/views/label.js

@@ -226,10 +226,11 @@ SC.LabelView = SC.View.extend(SC.DelegateSupport, SC.Control, SC.InlineEditorDel
   _valueDidChange: function() {
 
     var value = this.get('value') ;
-    if (value == this._value) return; // nothing to do
+    if (value === this._value) return; // nothing to do
+    this._value = value ;
 
     // get display value
-    var value = this.get('displayValue') ;
+    value = this.get('displayValue') ;
     
     // Escape HTML
     if (this.getDelegateProperty(this.displayDelegate, 'escapeHTML')) {

data/frameworks/sproutcore/views/view.js

@@ -898,15 +898,10 @@ SC.View = SC.Responder.extend(SC.PathModule,  SC.DelegateSupport,
     if (this._innerFrame == null) {  
 
       // get the base frame
+      // The _collectInnerFrame function is set at the bottom of this file
+      // based on the browser type.
       var el = this.rootElement ;
-      f = this._collectFrame(function() {
-        return { 
-          x: el.offsetLeft, 
-          y: el.offsetTop, 
-          width: Math.min(el.scrollWidth, el.clientWidth), 
-          height: Math.min(el.scrollHeight, el.clientHeight) 
-        };
-      }) ;
+      f = this._collectFrame(SC.View._collectInnerFrame) ;
 
       // bizarely for FireFox if your offsetParent has a border, then it can 
       // impact the offset
@@ -2117,10 +2112,27 @@ if (SC.Platform.IE) {
     if (value === 'auto') {
       switch(style) {
         case 'width':
-          value = (this.getStyle('display') != 'none') ? (element.offsetWidth + 'px') : null;
+          if (this.getStyle('display') === 'none') {
+            value = null ;
+          } else if (element.currentStyle) {
+            var paddingLeft = parseInt(element.currentStyle.paddingLeft,0)||0;
+            var paddingRight = parseInt(element.currentStyle.paddingRight,0)||0;
+            var borderLeftWidth = parseInt(element.currentStyle.borderLeftWidth, 0) || 0 ;
+            var borderRightWidth = parseInt(element.currentStyle.borderRightWidth, 0) || 0 ;
+            value = (element.offsetWidth - paddingLeft - paddingRight - borderLeftWidth - borderRightWidth) + 'px' ;
+          }
           break ;
         case 'height':
-          value = (this.getStyle('display') != 'none') ? (element.offsetHeight + 'px') : null;
+          if (this.getStyle('display') === 'none') {
+            value = null ;
+          } else if (element.currentStyle) {
+            var paddingTop = parseInt(element.currentStyle.paddingTop,0)||0;
+            var paddingBottom = parseInt(element.currentStyle.paddingBottom,0)||0;
+            var borderTopWidth = parseInt(element.currentStyle.borderTopWidth, 0) || 0 ;
+            var borderBottomWidth = parseInt(element.currentStyle.borderBottomWidth, 0) || 0 ;
+            value = (element.offsetHeight - paddingTop - paddingBottom - borderTopWidth - borderBottomWidth) + 'px' ;
+          }
+
           break ;
         default:
           value = null ;
@@ -2129,6 +2141,37 @@ if (SC.Platform.IE) {
 
     return value;
   };
+  
+  // Called from innerFrame to actually collect the values for the innerFrame.
+  // Normally the value we want for the width/height is stored in clientWidth/
+  // height but in IE this is only good if the element hasLayout.  In this
+  // case always use the scrollWidth/Height.
+  SC.View._collectInnerFrame = function() {
+    var el = this.rootElement ;
+    var hasLayout = (el.currentStyle) ? el.currentStyle.hasLayout : NO ;
+    return { 
+      x: el.offsetLeft, 
+      y: el.offsetTop, 
+      width: (hasLayout) ? Math.min(el.scrollWidth, el.clientWidth) : el.scrollWidth, 
+      height: (hasLayout) ? Math.min(el.scrollHeight, el.clientHeight) : el.scrollHeight 
+    };
+  } ;
+  
+} else {
+  
+  // Called from innerFrame to actually collect the values for the innerFrame.
+  // This method should return the smaller of the scrollWidth/height (which
+  // will be set if the element is scrollable), or the clientWdith/height 
+  // (which is set if the element is not scrollable).
+  SC.View._collectInnerFrame = function() {
+    var el = this.rootElement ;
+    return { 
+      x: el.offsetLeft, 
+      y: el.offsetTop, 
+      width: Math.min(el.scrollWidth, el.clientWidth), 
+      height: Math.min(el.scrollHeight, el.clientHeight) 
+    };
+  } ;
 }
 
 

data/lib/sproutcore/bundle.rb

@@ -575,7 +575,7 @@ module SproutCore
       str.scan(/['"](.+)['"]\s*:\s*['"](.+)['"],?\s*$/) do |x,y| 
         # x & y are JS strings that must be evaled as such..
         #x = eval(%("#{x}"))
-        y = eval(%("#{y}"))
+        y = eval(%[%(#{y})])
         ret[x] = y 
       end
       

data/lib/sproutcore/version.rb

@@ -2,7 +2,7 @@ module SproutCore #:nodoc:
   module VERSION #:nodoc:
     MAJOR = 0
     MINOR = 9
-    TINY  = 5
+    TINY  = 6
 
     STRING = [MAJOR, MINOR, TINY].join('.')
   end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification 
 name: sproutcore
 version: !ruby/object:Gem::Version 
-  version: 0.9.5
+  version: 0.9.6
 platform: ruby
 authors: 
 - Charles Jolley
@@ -9,7 +9,7 @@ autorequire:
 bindir: bin
 cert_chain: []
 
-date: 2008-05-09 00:00:00 -07:00
+date: 2008-05-19 00:00:00 -07:00
 default_executable: 
 dependencies: 
 - !ruby/object:Gem::Dependency