sproutcore 1.6.0.beta.3 → 1.6.0.rc.1

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

@@ -26,3 +26,399 @@ test("Views only attempt to call performKeyEquivalent on child views that suppor
   
   ok(performKeyEquivalentCalled > 0, "performKeyEquivalent is called on the view that supports it");
 });
+
+/**
+  nextValidKeyView tests
+*/
+
+test("nextValidKeyView is receiver if it is the only view that acceptsFirstResponder", function() {
+  var testView = SC.View.extend({acceptsFirstResponder: YES}),
+  pane = SC.Pane.create({
+    childViews: ['view1', 'view2'],
+
+    view1: SC.View.extend({
+      childViews: ['view3', 'view4'],
+
+      view3: SC.View,
+
+      view4: testView
+    }),
+
+    view2: SC.View.extend({
+      childViews: ['view5', 'view6'],
+
+      view5: SC.View,
+
+      view6: SC.View
+    })
+  });
+
+  // fake the pane being attached
+  pane.set('isPaneAttached', YES);
+  pane.recomputeIsVisibleInWindow();
+
+  equals(pane.view1.view4.get('nextValidKeyView'), pane.view1.view4, "nextValidKeyView is receiver");
+});
+
+test("nextValidKeyView is null if no views have acceptsFirstResponder === YES", function() {
+  var testView = SC.View.extend({acceptsFirstResponder: YES}),
+  pane = SC.Pane.create({
+    childViews: ['view1', 'view2'],
+
+    view1: SC.View.extend({
+      childViews: ['view3', 'view4'],
+
+      view3: SC.View,
+
+      view4: SC.View
+    }),
+
+    view2: SC.View.extend({
+      childViews: ['view5', 'view6'],
+
+      view5: SC.View,
+
+      view6: SC.View
+    })
+  });
+
+  // fake the pane being attached
+  pane.set('isPaneAttached', YES);
+  pane.recomputeIsVisibleInWindow();
+
+  ok(SC.none(pane.view1.view4.get('nextValidKeyView')), "nextValidKeyView is null");
+});
+
+test("firstKeyView and nextKeyView of parents are respected", function() {
+  var testView = SC.View.extend({acceptsFirstResponder: YES}),
+  pane = SC.Pane.create({
+    childViews: ['view1', 'view2', 'view7'],
+
+    view1: SC.View.extend({
+      childViews: ['view3', 'view4'],
+
+      view3: testView,
+
+      view4: testView
+    }),
+
+    view2: SC.View.extend({
+      childViews: ['view5', 'view6'],
+
+      view5: testView,
+
+      view6: testView
+    }),
+
+    view7: SC.View.extend({
+      childViews: ['view8', 'view9'],
+
+      view8: testView,
+
+      view9: testView
+    })
+  });
+
+  // fake the pane being attached
+  pane.set('isPaneAttached', YES);
+  pane.recomputeIsVisibleInWindow();
+
+  equals(pane.view2.view6.get('nextValidKeyView'), pane.view7.view8, "order is correct when first and next not set");
+
+  pane.set('firstKeyView', pane.view2);
+  pane.view2.set('nextKeyView', pane.view1);
+  pane.view1.set('nextKeyView', pane.view7);
+
+  equals(pane.view2.view6.get('nextValidKeyView'), pane.view1.view3, "order is respected when first and next are set");
+});
+
+test("nextValidKeyView is chosen correctly when nextKeyView is not a sibling", function() {
+  var testView = SC.View.extend({acceptsFirstResponder: YES}),
+  pane = SC.Pane.create({
+    childViews: ['view1', 'view2'],
+
+    view1: SC.View.extend({
+      childViews: ['view3', 'view4'],
+
+      view3: SC.View,
+
+      view4: testView
+    }),
+
+    view2: SC.View.extend({
+      childViews: ['view5', 'view6'],
+
+      view5: testView,
+
+      view6: SC.View
+    })
+  });
+
+  // fake the pane being attached
+  pane.set('isPaneAttached', YES);
+  pane.recomputeIsVisibleInWindow();
+
+  pane.view1.view4.set('nextKeyView', pane.view2.view5);
+  pane.view2.view5.set('nextKeyView', pane.view1.view4);
+
+  equals(pane.view1.view4.get('nextValidKeyView'), pane.view2.view5, "nextValidKeyView is correct");
+  equals(pane.view2.view5.get('nextValidKeyView'), pane.view1.view4, "nextValidKeyView is correct");
+});
+
+test("nextValidKeyView is chosen correctly when child of parent's previous sibling has nextKeyView set", function() {
+  var testView = SC.View.extend({acceptsFirstResponder: YES}),
+  pane = SC.Pane.create({
+    childViews: ['view1', 'view2'],
+
+    view1: SC.View.extend({
+      childViews: ['view3', 'view4'],
+
+      view3: testView,
+
+      view4: testView
+    }),
+
+    view2: SC.View.extend({
+      childViews: ['view5', 'view6'],
+
+      view5: testView,
+
+      view6: testView
+    })
+  });
+
+  pane.view1.view3.set('nextKeyView', pane.view1.view4);
+
+  // fake the pane being attached
+  pane.set('isPaneAttached', YES);
+  pane.recomputeIsVisibleInWindow();
+
+  equals(pane.view2.view5.get('nextValidKeyView'), pane.view2.view6, "nextValidKeyView chosen is next sibling");
+});
+
+test("nextValidKeyView checks for acceptsFirstResponder", function() {
+  var pane = SC.Pane.create({
+    childViews: ['view1', 'view2'],
+
+    view1: SC.View.extend({
+      acceptsFirstResponder: YES
+    }),
+
+    view2: SC.View.extend({
+      acceptsFirstResponder: NO
+    })
+  });
+
+  pane.view1.set('nextKeyView', pane.view2);
+
+  // fake the pane being attached
+  pane.set('isPaneAttached', YES);
+  pane.recomputeIsVisibleInWindow();
+
+  ok(pane.view1.get('nextValidKeyView') !== pane.view2, "nextValidKeyView is not nextKeyView because nextKeyView acceptsFirstResponder === NO");
+});
+
+test("nextValidKeyView prioritizes parent's lastKeyView even if nextKeyView is set", function() {
+  var testView = SC.View.extend({acceptsFirstResponder: YES}),
+  pane = SC.Pane.create({
+    childViews: ['view1', 'view2'],
+
+    view1: SC.View.extend({
+      childViews: ['view3', 'view4'],
+
+      lastKeyView: function() {
+        return this.view3;
+      }.property(),
+
+      view3: testView,
+
+      view4: testView
+    }),
+
+    view2: SC.View.extend({
+      childViews: ['view5', 'view6'],
+
+      view5: testView,
+
+      view6: testView
+    })
+  });
+
+  // fake the pane being attached
+  pane.set('isPaneAttached', YES);
+  pane.recomputeIsVisibleInWindow();
+
+  equals(pane.view1.view3.get('nextValidKeyView'), pane.view2.view5, "lastKeyView was respected; views after lastKeyView were skipped");
+});
+
+/**
+  previousValidKeyView tests
+*/
+
+test("previousValidKeyView is receiver if it is the only view that acceptsFirstResponder", function() {
+  var testView = SC.View.extend({acceptsFirstResponder: YES}),
+  pane = SC.Pane.create({
+    childViews: ['view1', 'view2'],
+
+    view1: SC.View.extend({
+      childViews: ['view3', 'view4'],
+
+      view3: SC.View,
+
+      view4: testView
+    }),
+
+    view2: SC.View.extend({
+      childViews: ['view5', 'view6'],
+
+      view5: SC.View,
+
+      view6: SC.View
+    })
+  });
+
+  // fake the pane being attached
+  pane.set('isPaneAttached', YES);
+  pane.recomputeIsVisibleInWindow();
+
+  equals(pane.view1.view4.get('previousValidKeyView'), pane.view1.view4, "previousValidKeyView is receiver");
+});
+
+test("previousValidKeyView is null if no views have acceptsFirstResponder === YES", function() {
+  var testView = SC.View.extend({acceptsFirstResponder: YES}),
+  pane = SC.Pane.create({
+    childViews: ['view1', 'view2'],
+
+    view1: SC.View.extend({
+      childViews: ['view3', 'view4'],
+
+      view3: SC.View,
+
+      view4: SC.View
+    }),
+
+    view2: SC.View.extend({
+      childViews: ['view5', 'view6'],
+
+      view5: SC.View,
+
+      view6: SC.View
+    })
+  });
+
+  // fake the pane being attached
+  pane.set('isPaneAttached', YES);
+  pane.recomputeIsVisibleInWindow();
+
+  ok(SC.none(pane.view1.view4.get('previousValidKeyView')), "previousValidKeyView is null");
+});
+
+test("lastKeyView and previousKeyView of parents are respected", function() {
+  var testView = SC.View.extend({acceptsFirstResponder: YES}),
+  pane = SC.Pane.create({
+    childViews: ['view1', 'view2', 'view7'],
+
+    view1: SC.View.extend({
+      childViews: ['view3', 'view4'],
+
+      view3: testView,
+
+      view4: testView
+    }),
+
+    view2: SC.View.extend({
+      childViews: ['view5', 'view6'],
+
+      view5: testView,
+
+      view6: testView
+    }),
+
+    view7: SC.View.extend({
+      childViews: ['view8', 'view9'],
+
+      view8: testView,
+
+      view9: testView
+    })
+  });
+
+  // fake the pane being attached
+  pane.set('isPaneAttached', YES);
+  pane.recomputeIsVisibleInWindow();
+
+  equals(pane.view2.view5.get('previousValidKeyView'), pane.view1.view4, "order is correct when last and previous not set");
+
+  pane.set('lastKeyView', pane.view2);
+  pane.view2.set('previousKeyView', pane.view7);
+  pane.view1.set('previousKeyView', pane.view1);
+
+  equals(pane.view2.view5.get('previousValidKeyView'), pane.view7.view9, "order is respected when last and previous are set");
+});
+
+test("previousValidKeyView is chosen correctly when previousKeyView is not a sibling", function() {
+  var testView = SC.View.extend({acceptsFirstResponder: YES}),
+  pane = SC.Pane.create({
+    childViews: ['view1', 'view2'],
+
+    view1: SC.View.extend({
+      childViews: ['view3', 'view4'],
+
+      view3: SC.View,
+
+      view4: testView
+    }),
+
+    view2: SC.View.extend({
+      childViews: ['view5', 'view6'],
+
+      view5: testView,
+
+      view6: SC.View
+    })
+  });
+
+  // fake the pane being attached
+  pane.set('isPaneAttached', YES);
+  pane.recomputeIsVisibleInWindow();
+
+  pane.view1.view4.set('previousKeyView', pane.view2.view5);
+  pane.view2.view5.set('previousKeyView', pane.view1.view4);
+
+  equals(pane.view1.view4.get('previousValidKeyView'), pane.view2.view5, "previousValidKeyView is correct");
+  equals(pane.view2.view5.get('previousValidKeyView'), pane.view1.view4, "previousValidKeyView is correct");
+});
+
+test("previousValidKeyView prioritizes parent's firstKeyView even if previousKeyView is set", function() {
+  var testView = SC.View.extend({acceptsFirstResponder: YES}),
+  pane = SC.Pane.create({
+    childViews: ['view1', 'view2'],
+
+    view1: SC.View.extend({
+      childViews: ['view3', 'view4'],
+
+      view3: testView,
+
+      view4: testView
+    }),
+
+    view2: SC.View.extend({
+      childViews: ['view5', 'view6'],
+
+      firstKeyView: function() {
+        return this.view6;
+      }.property(),
+
+      view5: testView,
+
+      view6: testView
+    })
+  });
+
+  // fake the pane being attached
+  pane.set('isPaneAttached', YES);
+  pane.recomputeIsVisibleInWindow();
+
+  equals(pane.view2.view6.get('previousValidKeyView'), pane.view1.view4, "firstKeyView was respected; views before firstKeyView were skipped");
+});
+

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

@@ -56,7 +56,7 @@ test("it still works with the backward compatible theme property when extending"
     }.observes('theme')
   });
 
-  view = View.create();
+  var view = View.create();
   equals(SC.Theme.find('sc-base'), view.get('theme'));
   view.set('themeName', 'hello');
   equals(1, count, "theme observers should get called");

data/lib/frameworks/sproutcore/frameworks/core_foundation/{system → views}/bindable_span.js

@@ -11,7 +11,8 @@ sc_require('views/template');
   set up. When the associated property changes, just the template for this view
   will re-render.
 */
-SC._BindableSpan = SC.TemplateView.extend({
+SC._BindableSpan = SC.TemplateView.extend(
+  /** @scope SC._BindableSpan.prototype */{
   /**
    The type of HTML tag to use. To ensure compatibility with
    Internet Explorer 7, a <span> tag is used to ensure that inline elements are

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

@@ -1,6 +1,15 @@
 sc_require('views/template');
 
-SC.TemplateCollectionView = SC.TemplateView.extend({
+/** @class
+
+  @author Tom Dale
+  @author Yehuda Katz
+  @extends SC.TemplateView
+  @since SproutCore 1.5
+*/
+SC.TemplateCollectionView = SC.TemplateView.extend(
+  /** @scope SC.TemplateCollectionView.prototype */{
+
   tagName: 'ul',
   content: null,
   template: SC.Handlebars.compile(''),
@@ -127,9 +136,11 @@ SC.TemplateCollectionView = SC.TemplateView.extend({
   }.observes('content'),
 
   arrayContentWillChange: function(start, removedCount, addedCount) {
+    if (!this.get('layer')) { return; }
+
     // If the contents were empty before and this template collection has an empty view
     // remove it now.
-    emptyView = this.get('emptyView');
+    var emptyView = this.get('emptyView');
     if (emptyView) { emptyView.$().remove(); emptyView.removeFromParent(); }
 
     // Loop through child views that correspond with the removed items.
@@ -167,59 +178,62 @@ SC.TemplateCollectionView = SC.TemplateView.extend({
         addedViews    = [],
         renderFunc, childView, itemOptions, elem, insertAtElement, item, itemElem, idx, len;
 
-    var addedObjects = content.slice(start, start+addedCount);
-
-    // If we have content to display, create a view for
-    // each item.
-    itemOptions = this.get('itemViewOptions') || {};
-
-    elem = this.$();
-    insertAtElement = elem.find('li')[start-1] || null;
-    len = addedObjects.get('length');
-
-    // TODO: This logic is duplicated from the view helper. Refactor
-    // it so we can share logic.
-    var itemAttrs = {
-      "id": itemOptions.id,
-      "class": itemOptions['class'],
-      "classBinding": itemOptions.classBinding
-    };
-
-    renderFunc = function(context) {
-      sc_super();
-      SC.Handlebars.ViewHelper.applyAttributes(itemAttrs, this, context);
-    };
-
-    itemOptions = SC.clone(itemOptions);
-    delete itemOptions.id;
-    delete itemOptions['class'];
-    delete itemOptions.classBinding;
-
-    for (idx = 0; idx < len; idx++) {
-      item = addedObjects.objectAt(idx);
-      view = this.createChildView(itemViewClass.extend(itemOptions, {
-        content: item,
-        render: renderFunc
-      }));
-
-      var contextProperty = view.get('contextProperty');
-      if (contextProperty) {
-        view.set('context', view.get(contextProperty));
-      }
-
-      itemElem = view.createLayer().$();
-      if (!insertAtElement) {
-        elem.append(itemElem);
-      } else {
-        itemElem.insertAfter(insertAtElement);
+    if (content) {
+      var addedObjects = content.slice(start, start+addedCount);
+
+      // If we have content to display, create a view for
+      // each item.
+      itemOptions = this.get('itemViewOptions') || {};
+
+      elem = this.$();
+      insertAtElement = elem.find('li')[start-1] || null;
+      len = addedObjects.get('length');
+
+      // TODO: This logic is duplicated from the view helper. Refactor
+      // it so we can share logic.
+      var itemAttrs = {
+        "id": itemOptions.id,
+        "class": itemOptions['class'],
+        "classBinding": itemOptions.classBinding
+      };
+
+      renderFunc = function(context) {
+        sc_super();
+        SC.Handlebars.ViewHelper.applyAttributes(itemAttrs, this, context);
+      };
+
+      itemOptions = SC.clone(itemOptions);
+      delete itemOptions.id;
+      delete itemOptions['class'];
+      delete itemOptions.classBinding;
+
+      for (idx = 0; idx < len; idx++) {
+        item = addedObjects.objectAt(idx);
+        view = this.createChildView(itemViewClass.extend(itemOptions, {
+          content: item,
+          render: renderFunc,
+          tagName: itemViewClass.prototype.tagName || this.get('itemTagName')
+        }));
+
+        var contextProperty = view.get('contextProperty');
+        if (contextProperty) {
+          view.set('context', view.get(contextProperty));
+        }
+
+        itemElem = view.createLayer().$();
+        if (!insertAtElement) {
+          elem.append(itemElem);
+        } else {
+          itemElem.insertAfter(insertAtElement);
+        }
+        insertAtElement = itemElem;
+
+        addedViews.push(view);
       }
-      insertAtElement = itemElem;
 
-      addedViews.push(view);
+      childViews.replace(start, 0, addedViews);
     }
 
-    childViews.replace(start, 0, addedViews);
-
     var inverseTemplate = this.get('inverseTemplate');
     if (childViews.get('length') === 0 && inverseTemplate) {
       view = this.createChildView(SC.TemplateView.extend({
@@ -237,6 +251,19 @@ SC.TemplateCollectionView = SC.TemplateView.extend({
     this.invokeLast('invalidateFrame');
   },
 
+  itemTagName: function() {
+    switch(this.get('tagName')) {
+      case 'ul':
+      case 'ol':
+        return 'li';
+      case 'table':
+      case 'thead':
+      case 'tbody':
+      case 'tfoot':
+        return 'tr'
+    }
+  }.property('tagName'),
+
   invalidateFrame: function() {
     this.notifyPropertyChange('frame');
   }