sproutcore 1.7.1.beta → 1.8.0

data/lib/frameworks/sproutcore/frameworks/core_foundation/tests/system/render_context/helpers_style.js

@@ -11,7 +11,7 @@ var context = null;
 
 // ..........................................................
 // styles
-// 
+//
 module("SC.RenderContext#styles", {
   setup: function() {
     context = SC.RenderContext() ;
@@ -37,11 +37,11 @@ test("returns styles if set", function() {
 test("clone on next retrieval if styles(foo) set with cloneOnModify=YES", function() {
   var styles = { foo: 'bar' };
   context.styles(styles, YES);
-  
+
   var result = context.styles();
   ok(result !== styles, "styles is NOT same instance");
   same(result, styles, "but styles are equivalent");
-  
+
   equals(result, context.styles(), "2nd retrieval is same instance");
 });
 
@@ -49,10 +49,10 @@ test("extracts styles from element on first retrieval", function() {
   var elem = document.createElement('div');
   SC.$(elem).attr('style', 'color: black; height: 20px; border-top: 1px solid hotpink; -webkit-column-count: 3');
   context = SC.RenderContext(elem);
-  
+
   var result = context.styles();
-  
-  if(SC.browser.msie){
+
+  if(SC.browser.isIE){
     same(result, { color: 'black', height: '20px', borderTop: 'hotpink 1px solid', WebkitColumnCount: '3' }, 'extracted style. This is failing in IE8 because it return styles like cOLOR.');
   }else{
     same(result, { color: 'black', height: '20px', borderTop: '1px solid hotpink', WebkitColumnCount: '3' }, 'extracted style. This is failing in IE8 because it return styles like cOLOR.');
@@ -62,7 +62,7 @@ test("extracts styles from element on first retrieval", function() {
 
 // ..........................................................
 // addStyle
-// 
+//
 module("SC.RenderContext#addStyle", {
   setup: function() {
     context = SC.RenderContext().styles({ foo: 'foo' }) ;
@@ -86,7 +86,7 @@ test("should return receiver", function() {
 test("should create styles hash if needed", function() {
   context = SC.RenderContext();
   equals(context._styles, null, 'precondition - has no styles');
-  
+
   context.addStyle('foo', 'bar');
   equals('bar', context.styles().foo, 'has styles');
 });

data/lib/frameworks/sproutcore/frameworks/core_foundation/tests/system/render_context/update.js

@@ -14,7 +14,7 @@ module("SC.RenderContext#update", {
     elem = document.createElement('div');
     context = SC.RenderContext(elem) ;
   },
-  
+
   teardown: function() {
     elem = context = null; // avoid memory leaks
   }
@@ -49,14 +49,14 @@ test("clears internal _elem to avoid memory leaks on update", function() {
 
 // ..........................................................
 // Attribute Editing
-// 
+//
 module("SC.RenderContext#update - attrs", {
   setup: function() {
     elem = document.createElement('div');
     SC.$(elem).attr("foo", "initial");
     context = SC.RenderContext(elem);
   },
-  
+
   teardown: function() {
     elem = context = null ;
   }
@@ -87,14 +87,14 @@ test("removes attribute if value is null", function() {
 
 // ..........................................................
 // ID
-// 
+//
 module("SC.RenderContext#update - id", {
   setup: function() {
     elem = document.createElement('div');
     SC.$(elem).attr("id", "foo");
     context = SC.RenderContext(elem);
   },
-  
+
   teardown: function() {
     elem = context = null ;
   }
@@ -121,14 +121,14 @@ test("set id overrides attr", function() {
 
 // ..........................................................
 // Class Name Editing
-// 
+//
 module("SC.RenderContext#update - className", {
   setup: function() {
     elem = document.createElement('div');
     SC.$(elem).attr("class", "foo bar");
     context = SC.RenderContext(elem);
   },
-  
+
   teardown: function() {
     elem = context = null ;
   }
@@ -155,14 +155,14 @@ test("set class names override class attr", function() {
 
 // ..........................................................
 // Style Editing
-// 
+//
 module("SC.RenderContext#update - style", {
   setup: function() {
     elem = document.createElement('div');
     SC.$(elem).attr("style", "color: red;");
     context = SC.RenderContext(elem);
   },
-  
+
   teardown: function() {
     elem = context = null ;
   }
@@ -173,19 +173,19 @@ test("does not change styles if retrieved but not edited", function() {
   context.update();
   var style = SC.$(elem).attr("style");
   if (!style.match(/;$/)) style += ';' ;
-  
+
   equals(style.toLowerCase(), "color: red;", "style");
 });
 
 test("replaces style name if styles edited", function() {
   context.styles({ color: "black" });
   context.update();
-  
+
   // Browsers return single attribute styles differently, sometimes with a trailing ';'
   // sometimes, without one. Normalize it here.
   var style = SC.$(elem).attr("style");
   if (!style.match(/;$/)) style += ';' ;
-  
+
   equals(style.toLowerCase(), "color: black;", "attribute");
 });
 
@@ -194,12 +194,12 @@ test("set styles override style attr", function() {
   context.attr("style", "color: green");
   context.styles({ color: "black" });
   context.update();
-  
+
   // Browsers return single attribute styles differently, sometimes with a trailing ';'
   // sometimes, without one. Normalize it here.
   var style = SC.$(elem).attr("style");
   if (!style.match(/;$/)) style += ';' ;
-  
+
   equals(style.toLowerCase(), "color: black;", "attribute");
 });
 
@@ -213,7 +213,8 @@ test("set styles handle custom browser attributes", function() {
   if (!style.match(/;$/)) style += ';' ;
 
   // Older Gecko completely ignores css attributes that it doesn't understand.
-  if(SC.browser.mozilla && parseInt(SC.browser.mozilla) < 2.0) equals(style, "-moz-column-count: 3;");
-  else if (SC.browser.msie) equals(style, "-webkit-column-count: 3; -moz-column-count: 3; -o-column-count: 3; -ms-column-count: 3;");
+  if(SC.browser.isMozilla &&
+      SC.browser.compare(SC.browser.engineVersion, '2.0') < 0) equals(style, "-moz-column-count: 3;");
+  else if (SC.browser.isIE) equals(style, "-webkit-column-count: 3; -moz-column-count: 3; -o-column-count: 3; -ms-column-count: 3;");
   else equals(style, "-moz-column-count: 3; -webkit-column-count: 3; -o-column-count: 3; -ms-column-count: 3;");
 });

data/lib/frameworks/sproutcore/frameworks/core_foundation/tests/system/selection_set/remove.js

@@ -97,7 +97,7 @@ test("removing index set should also remove individually added objects", functio
   
   ok(set.contains(objToRemove), 'set should contain objToRemove');
   ok(set.contains(objToNotRemove), 'set should contain objToNotRemove');
-  equals(set.get('length'), 5, 'set.length sould == two objects + index.length');
+  equals(set.get('length'), 5, 'set.length should == two objects + index.length');
     
   // now remove from array set
   set.remove(array, 2, 4);  

data/lib/frameworks/sproutcore/frameworks/core_foundation/tests/views/view/build_children.js

@@ -57,7 +57,7 @@ test("Calling buildInChild adds child and builds it in.", function(){
   // check right after build in is called
   ok(v.called_buildIn, "child started build in.");
   ok(v.isBuildingIn, "child is building in.");
-  ok(!p.called_buildInDidFinsihFor, "child has not finished building in, according to parent.");
+  ok(!p.called_buildInDidFinishFor, "child has not finished building in, according to parent.");
   
   // the parent view should be set already
   equals(v.get("parentView"), p, "Parent view should be the parent");

data/lib/frameworks/sproutcore/frameworks/core_foundation/tests/views/view/class_name_bindings_test.js

@@ -45,3 +45,18 @@ test("should add, remove, or change class names if changed after element is crea
   ok(!view.$().hasClass('is-urgent', "removes dasherized class when changed from true to false"));
   ok(view.$().hasClass('can-ignore'), "adds dasherized class when changed from false to true");
 });
+
+test("should preserve class names applied via classNameBindings when view layer is updated",
+function(){
+  var view = SC.View.create({
+    classNameBindings: ['isUrgent'],
+    isUrgent: false
+  });
+  view.createLayer();
+  ok(!view.$().hasClass('is-urgent', "removes dasherized class when changed from true to false"));
+  view.set('isUrgent', true);
+  ok(view.$().hasClass('is-urgent', "adds dasherized class when changed from true to false"));
+  view.set('layerNeedsUpdate', YES);
+  view.updateLayer();
+  ok(view.$().hasClass('is-urgent', "still has class when view display property is updated"));
+});

data/lib/frameworks/sproutcore/frameworks/core_foundation/tests/views/view/createChildViews.js

@@ -20,7 +20,7 @@ test("calls createChildView() for each class or string in childViews array", fun
       'customClassName'           // string - should be called
     ],
 
-    // this shuld be used for the 'customClassName' item above
+    // this should be used for the 'customClassName' item above
     customClassName: SC.View.extend({ key: 2 }),
 
     // patch to record results...
@@ -49,10 +49,10 @@ test("should not error when there is a dud view name in childViews list.", funct
   var called = [];
   var v = SC.View.create({
     childViews: [
-      "nonExistantClassNme",       // string - should NOT be called
-        'customClassName'          // string - should be called
+      'nonExistantClassName',       // string - should NOT be called
+      'customClassName'          // string - should be called
     ],
-    // this shuld be used for the 'customClassName' item above
+    // this should be used for the 'customClassName' item above
     customClassName: SC.View.extend({ key: 2 }),
 
     // patch to record results...
@@ -71,7 +71,7 @@ test("should not throw error when there is an extra space in the childViews list
   var called = [];
   var v = SC.View.create({
     childViews: "customClassName  customKlassName".w(),
-    // this shuld be used for the 'customClassName' item above
+    // this should be used for the 'customClassName' item above
     customClassName: SC.View.extend({ key: 2 }),
     customKlassName: SC.View.extend({ key: 3 })
   });

data/lib/frameworks/sproutcore/frameworks/core_foundation/views/view.js

@@ -44,6 +44,29 @@ SC.CoreView.reopen(
 
   concatenatedProperties: ['outlets', 'displayProperties', 'classNames', 'renderMixin', 'didCreateLayerMixin', 'willDestroyLayerMixin', 'classNameBindings', 'attributeBindings'],
 
+  /**
+    The WAI-ARIA role of the control represented by this view. For example, a
+    button may have a role of type 'button', or a pane may have a role of
+    type 'alertdialog'. This property is used by assistive software to help
+    visually challenged users navigate rich web applications.
+
+    The full list of valid WAI-ARIA roles is available at:
+    http://www.w3.org/TR/wai-aria/roles#roles_categorization
+
+    @property {String}
+  */
+
+  ariaRole: null,
+
+  /**
+    The full list of valid WAI-ARIA roles is available at:
+    http://www.w3.org/TR/wai-aria/roles#roles_categorization
+
+    @property {String}
+  */
+
+  ariaHidden: null,
+
   /**
     The current pane.
     @property {SC.Pane}
@@ -296,7 +319,7 @@ SC.CoreView.reopen(
     run at the end of the run loop, or you can call updateLayerIfNeeded()
     to force the layer to update immediately.
 
-    Instead of overriding this method, consider overidding the render() method
+    Instead of overriding this method, consider overriding the render() method
     instead, which is called both when creating and updating a layer.  If you
     do not want your render() method called when updating a layer, then you
     should override this method instead.
@@ -405,6 +428,8 @@ SC.CoreView.reopen(
   _notifyDidCreateLayer: function() {
     this.notifyPropertyChange('layer');
 
+    if (this.get('useStaticLayout')) this.viewDidResize();
+
     if (this.didCreateLayer) { this.didCreateLayer() ; }
 
     // and notify others
@@ -480,8 +505,8 @@ SC.CoreView.reopen(
   */
   replaceLayer: function() {
     this.destroyLayer();
-    //this.set('layerLocationNeedsUpdate', YES) ;
-    this.invokeOnce(this.updateLayerLocation) ;
+    this.set('layerLocationNeedsUpdate', YES) ;
+    this.invokeOnce(this.updateLayerLocationIfNeeded);
   },
 
   /**
@@ -566,7 +591,10 @@ SC.CoreView.reopen(
       // before we add to parent node, make sure that the nextNode exists...
       if (nextView && (!nextNode || nextNode.parentNode!==parentNode)) {
         nextView.updateLayerLocationIfNeeded() ;
-        nextNode = nextView.get('layer') ;
+
+        // just in case it still couldn't generate the layer, force to null, because
+        // IE doesn't support insertBefore(blah, undefined) in version IE9.
+        nextNode = nextView.get('layer') || null;
       }
 
       // add to parentNode if needed.
@@ -679,15 +707,16 @@ SC.CoreView.reopen(
 
     if (this.get('isTextSelectable')) { context.addClass('allow-select'); }
     if (!this.get('isVisible')) { context.addClass('sc-hidden'); }
-    if (this.get('isFirstResponder')) { 
-      context.addClass('focus');
-      context.attr('tabindex', '0'); 
-    }else{
-      context.attr('tabindex', '-1');
-    }
+    if (this.get('isFirstResponder')) { context.addClass('focus'); }
 
     context.id(this.get('layerId'));
     context.attr('role', this.get('ariaRole'));
+
+    var _ariaHidden = this.get('ariaHidden');
+    if(_ariaHidden!==null){
+      if(_ariaHidden === NO) context.removeAttr('aria-hidden');
+      else context.attr('aria-hidden', _ariaHidden);
+    }
   },
 
   /**
@@ -717,7 +746,7 @@ SC.CoreView.reopen(
 
       // Set up an observer on the context. If the property changes, toggle the
       // class name.
-      observer = function() {
+      var observer = function() {
         // Get the current value of the property
         newClass = this._classStringForProperty(property);
         elem = this.$();
@@ -725,12 +754,14 @@ SC.CoreView.reopen(
         // If we had previously added a class to the element, remove it.
         if (oldClass) {
           elem.removeClass(oldClass);
+          classNames.removeObject(oldClass);
         }
 
         // If necessary, add a new class. Make sure we keep track of it so
         // it can be removed in the future.
         if (newClass) {
           elem.addClass(newClass);
+          classNames.push(newClass);
           oldClass = newClass;
         } else {
           oldClass = null;
@@ -936,18 +967,7 @@ SC.CoreView.reopen(
   */
   tagName: 'div',
 
-  /**
-    The WAI-ARIA role of the control represented by this view. For example, a
-    button may have a role of type 'button', or a pane may have a role of
-    type 'alertdialog'. This property is used by assistive software to help
-    visually challenged users navigate rich web applications.
-
-    The full list of valid WAI-ARIA roles is available at:
-    http://www.w3.org/TR/wai-aria/roles#roles_categorization
 
-    @property {String}
-  */
-  ariaRole: null,
 
   /**
     Standard CSS class names to apply to the view's outer element.  This
@@ -1015,7 +1035,7 @@ SC.CoreView.reopen(
     @property {Array}
     @readOnly
   */
-  displayProperties: [],
+  displayProperties: ['ariaHidden'],
 
   // .......................................................
   // SC.RESPONDER SUPPORT
@@ -1031,7 +1051,7 @@ SC.CoreView.reopen(
 
   /** @property
     Set to YES if your view is willing to accept first responder status.  This
-    is used when calculcating key responder loop.
+    is used when calculating key responder loop.
   */
   acceptsFirstResponder: NO,
 
@@ -1342,7 +1362,7 @@ SC.CoreView.reopen(
     } else {
       // attrs should always exist...
       if (!attrs) { attrs = {} ; }
-      // clone the hash that was given so we dont pollute it if it's being reused
+      // clone the hash that was given so we do not pollute it if it's being reused
       else { attrs = SC.clone(attrs); }
     }
 
@@ -1375,7 +1395,7 @@ SC.CoreView.reopen(
     to override this function to always return YES , instead of setting
     isTextSelectable to true.
 
-    For example in textfield you dont want to enable textSelection on the text
+    For example in textfield you do not want to enable textSelection on the text
     hint only on the actual text you are entering. You can achieve that by
     only overriding this method.
 
@@ -1584,7 +1604,7 @@ SC.CoreView.mixin(/** @scope SC.CoreView.prototype */ {
   },
 
   /**
-    Internal method actually updates the localizated attributes on the view
+    Internal method actually updates the localized attributes on the view
     class.  This is overloaded in design mode to also save the attributes.
   */
   applyLocalizedAttributes: function(loc) {
@@ -1643,7 +1663,7 @@ SC.CoreView.unload = function() {
 
    - `init` -- override this method for any general object setup (such as
      observers, starting timers and animations, etc) that you need to happen
-     everytime the view is created, regardless of whether or not its layer
+     every time the view is created, regardless of whether or not its layer
      exists yet.
    - `render` -- override this method to generate or update your HTML to reflect
      the current state of your view.  This method is called both when your view
@@ -1674,11 +1694,11 @@ SC.CoreView.unload = function() {
 */
 SC.View = SC.CoreView.extend(/** @scope SC.View.prototype */{
   classNames: ['sc-view'],
-  
+
   displayProperties: ['isFirstResponder']
 });
 
 //unload views for IE, trying to collect memory.
-if(SC.browser.msie) SC.Event.add(window, 'unload', SC.View, SC.View.unload) ;
+if(SC.browser.isIE) SC.Event.add(window, 'unload', SC.View, SC.View.unload) ;
 
 

data/lib/frameworks/sproutcore/frameworks/core_foundation/views/view/acceleration.js

@@ -0,0 +1,46 @@
+// ==========================================================================
+// Project:   SproutCore - JavaScript Application Framework
+// Copyright: ©2006-2011 Strobe Inc. and contributors.
+//            Portions ©2008-2011 Apple Inc. All rights reserved.
+// License:   Licensed under MIT license (see license.js)
+// ==========================================================================
+
+sc_require("views/view");
+sc_require("views/view/layout");
+sc_require("views/view/layout_style");
+
+SC.View.reopen({
+  /**
+    Setting wantsAcceleratedLayer to YES will use transforms to move the
+    layer when available. On some platforms transforms are hardware accelerated.
+  */
+  wantsAcceleratedLayer: NO,
+
+  /**
+    Specifies whether transforms can be used to move the layer.
+  */
+  hasAcceleratedLayer: function(){
+    if (this.get('wantsAcceleratedLayer') && SC.platform.supportsAcceleratedLayers) {
+      var layout = this.get('layout'),
+          animations = layout.animate,
+          AUTO = SC.LAYOUT_AUTO,
+          key;
+
+      if (animations && (animations.top || animations.left)) {
+        for (key in animations) {
+          // If we're animating other transforms at different speeds, don't use acceleratedLayer
+          if (SC.CSS_TRANSFORM_MAP[key] &&
+              ((animations.top &&
+                animations.top.duration !== animations[key].duration) ||
+               (animations.left &&
+                animations.left.duration !== animations[key].duration))) {
+            return NO;
+          }
+        }
+      }
+
+      return this.get('isFixedLayout');
+    }
+    return NO;
+  }.property('wantsAcceleratedLayer').cacheable()
+});