sproutit-sproutcore 1.0.0.20090407205609 → 1.0.0.20090408130025

data/frameworks/sproutcore/frameworks/foundation/tests/debug/control_test_pane/ui.js

@@ -0,0 +1,113 @@
+// ==========================================================================
+// Project:   SproutCore - JavaScript Application Framework
+// Copyright: ©2006-2009 Sprout Systems, Inc. and contributors.
+//            portions copyright @2009 Apple, Inc.
+// License:   Licened under MIT license (see license.js)
+// ==========================================================================
+
+/*global module test htmlbody ok equals same stop start */
+
+(function() {
+  // var content = []
+  // for (var idx=0, len=20; idx<len; ++idx) {
+  //   content.push(SC.Record.create({
+  //     id: 'item_'+idx,
+  //     title: 'Item ' + idx
+  //   }))
+  // }
+  // 
+  // var singleSelection = [content[0]];
+  // var multiSelectionContiguous = [content[0], content[1], content[2]];
+  // var multiSelectionDiscontiguous = [content[0], content[2], content[4]];
+  // 
+  // var pane = SC.ControlTestPane.design({ height: 100 })
+  //   .add("basic", SC.ListView, {
+  //     content: content,
+  //     contentValueKey: 'title'
+  //   })
+  //   
+  //   .add("disabled", SC.ListView, {
+  //     isEnabled: NO,
+  //     content: content,
+  //     contentValueKey: 'title'
+  //   })
+  //   
+  //   .add("disabled - single selection", SC.ListView, {
+  //     isEnabled: NO,
+  //     content: content,
+  //     contentValueKey: 'title',
+  //     selection: singleSelection
+  //   })
+  //   
+  //   .add("single selection", SC.ListView, {
+  //     content: content,
+  //     contentValueKey: 'title',
+  //     selection: singleSelection
+  //   })
+  //   
+  //   .add("multiple selection, contiguous", SC.ListView, {
+  //     content: content,
+  //     contentValueKey: 'title',
+  //     selection: multiSelectionContiguous
+  //   })
+  //   
+  //   .add("multiple selection, discontiguous", SC.ListView, {
+  //     content: content,
+  //     contentValueKey: 'title',
+  //     selection: multiSelectionDiscontiguous
+  //   })
+  //   
+  // pane.show(); // add a test to show the test pane
+  
+  // ..........................................................
+  // TEST PANE
+  // 
+  
+  module('SC.ControlTestPane UI');
+  
+  test("showing/removing a pane", function() {
+    var pane = SC.ControlTestPane.design() ;
+    pane = pane.create() ;
+    
+    ok(pane.$().hasClass('sc-control-test-pane'), 'should have class sc-control-test-pane');
+    
+    ok(pane.get('isVisible'), 'control test pane should be visible after we create it');
+    ok(pane.get('isVisibleInWindow'), 'control tast pane should be visible in the window after we create it');
+    
+    pane.remove() ;
+    
+    ok(pane.get('isVisible'), 'control test pane still should be visible after we remove it');
+    ok(!pane.get('isVisibleInWindow'), 'control tast pane should NOT be visible in the window after we remove it');
+  });
+  
+  test("adding named children to the pane", function() {
+    var pane = SC.ControlTestPane.design() ;
+    pane.add('first', SC.View) ;
+    pane.add('second', SC.View) ;
+    pane.add('third', SC.View) ;
+    
+    equals(pane.prototype.childViews.length, 6, 'control test pane has correct number of children before create') ;
+    pane = pane.create() ;
+    equals(pane.getPath('childViews.length'), 6, 'control test pane has correct number of children after create') ;
+    
+    var childViews = pane.get('childViews') ;
+    var firstLabel = childViews[0] ;
+    equals(firstLabel.$().text(), 'first:', 'first label should be correct') ;
+    
+    var secondLabel = childViews[2] ;
+    equals(secondLabel.$().text(), 'second:', 'second label should be correct') ;
+    
+    var thirdLabel = childViews[4] ;
+    equals(thirdLabel.$().text(), 'third:', 'third label should be correct') ;
+    
+    var paneLayer = pane.get('layer') ;
+    for (var idx=0, len=6; idx<len; ++idx) {
+      var view = childViews[idx] ;
+      var layer = view.get('layer') ;
+      equals(layer.parentNode, paneLayer, 'control test pane childView has layer with correct parentNode');
+    }
+    
+    pane.remove() ;
+  });
+  
+})();

data/frameworks/sproutcore/frameworks/foundation/tests/integration/creating_views.js

@@ -0,0 +1,113 @@
+// ==========================================================================
+// Project:   SproutCore - JavaScript Application Framework
+// Copyright: ©2006-2009 Apple, Inc. and contributors.
+// License:   Licened under MIT license (see license.js)
+// ==========================================================================
+
+/*global module test equals context ok same htmlbody */
+
+module("Create a pane with some custom views and adding it to the window");
+
+htmlbody('<style>.sc-view { border: 1px red solid; z-index: -1; position: absolute; }</style>');
+
+test("layer creation and management", function() {
+  
+  // create custom view w/ render method
+  var MyView = SC.View.extend({
+    cv: 0,
+    
+    displayProperties: 'cv'.w(),
+    
+    render: function(context, firstTime) {
+      this.renderChildViews(context, YES); // always re-render...
+      context.begin()
+        .push('View %@'.fmt(this.get('cv')))
+      .end();
+    }
+  });
+  
+  // create design
+  var pane = SC.Pane.design()
+    .layout({ bottom: 10, right: 20, top: 20, left: 20 })
+    .childView(MyView.design({ cv: 1 })
+      .classNames('view-1')
+      .layout({ top: 50 })
+      .childView(MyView.design({ cv: 2 })
+        .classNames('view-2')
+        .layout({ bottom: 10, right: 20, width: 100, height: 23 })));
+    
+  
+  // instantiate pane...
+  pane = pane.create();
+  var cv1 = pane.childViews[0], cv2 = cv1.childViews[0];
+  
+  // pane should have nested child views.
+  equals(cv1.cv, 1, 'has childView 1');
+  equals(cv2.cv, 2, 'has childView 2');
+  
+  // it should not have a layer yet (nor should children)
+  ok(!pane.get('layer'), 'pane has no layer');
+  ok(!cv1.get('layer'), 'cv1 has no layer');
+  ok(!cv2.get('layer'), 'cv2 has no layer');
+  
+  // if we mark cv2 as needed an update, it should not do anything, even at
+  // end of the runloop.
+  // -- temporarily replace updateLayer()
+  var runCount = 0; 
+  cv2.updateLayer = function() { runCount++; };
+  SC.RunLoop.begin();
+  cv2.set('displayNeedsUpdate', YES) ;
+  SC.RunLoop.end();
+  
+  // updateLayer should NOT have run...
+  equals(runCount, 0, 'cv2.updateLayer did not run');
+  
+  // restore original updateLayer
+  delete cv2.updateLayer ;
+  
+  // all the views should have their isVisibleInWindow set to NO now
+  ok(!pane.get('isVisibleInWindow'), 'pane.isVisibleInWindow should be NO');
+  ok(!cv1.get('isVisibleInWindow'), 'cv1.isVisibleInWindow should be NO');
+  ok(!cv2.get('isVisibleInWindow'), 'cv2.isVisibleInWindow should be NO');
+  // -----
+  // OK, let's add this baby to the window
+  SC.RunLoop.begin();
+  pane.append();
+  SC.RunLoop.end();
+  
+  // all the views should have their isVisibleInWindow set to YES now
+  ok(pane.get('isVisibleInWindow'), 'pane.isVisibleInWindow should be YES');
+  ok(cv1.get('isVisibleInWindow'), 'cv1.isVisibleInWindow should be YES');
+  ok(cv2.get('isVisibleInWindow'), 'cv2.isVisibleInWindow should be YES');
+
+  // pane should have layer...cv's should not have had to find their layers
+  // yet.
+  ok(pane.get('layer'), 'pane has layer');
+  ok(!cv1._view_pane, 'cv1 has not found its layer yet') ;
+  ok(!cv2._view_pane, 'cv2 has not found its layer yet') ;
+  
+  // now let's make sure the pane layer has some of the things we expect...
+  var layer = pane.get('layer');
+  equals(layer.firstChild.id, cv1.get('layerId'), 'has cv1 elem');
+  equals(layer.firstChild.firstChild.id, cv2.get('layerId'), 'has cv2 elem');
+  layer = null;
+  
+  // but if we get the layer for cv1 & cv2 they should find them...
+  ok(cv1.get('layer'), 'cv1 can find its layer');
+  ok(cv2.get('layer'), 'cv2 can find its layer');
+  
+  // also, the pane should now belong to the main document body.  it should 
+  // have a parent.
+  equals(pane.get('layer').parentNode, document.body, 'panes layer is in document body');
+  
+  // ok, now we're going to change the view number for cv2 and see if that
+  // updates the UI.
+  SC.RunLoop.begin();
+  cv2.set('cv', 'foo');
+  SC.RunLoop.end();
+  
+  // the innerHTML for cv2 should now contain 'View foo'
+  layer = cv2.get('layer');
+  ok(layer.innerHTML.toString().match(/View foo/), 'does not have new label!');
+  
+});

data/frameworks/sproutcore/frameworks/foundation/tests/mixins/button/content.js

@@ -0,0 +1,195 @@
+// ==========================================================================
+// Project:   SproutCore - JavaScript Application Framework
+// Copyright: ©2006-2009 Apple, Inc. and contributors.
+// License:   Licened under MIT license (see license.js)
+// ==========================================================================
+
+/*global module test equals context ok same */
+
+// ..........................................................
+// contentPropertyDidChange()
+// 
+var view, content ;
+module('SC.Button#contentPropertyDidChange', {
+  setup: function() {
+    content = SC.Object.create();
+    view = SC.View.create(SC.Control, SC.Button);
+    view.set('title', 'hello world');
+  },
+  
+  teardown: function() {
+    content = null;
+    view.destroy();
+  }
+});
+
+test("invoked with key = * whenever content changes", function() {
+  view.contentPropertyDidChange = function(target, key) {
+    ok(target === content, 'should pass content object as target target=%@'.fmt(target));
+    equals(key, '*', 'should pass * as key');    
+  };
+  view.set('content', content);
+});
+
+test("invoked with key = foo whenever a propery on content is changed", function() {
+  var isTesting = NO, curKey ;
+  view.contentPropertyDidChange = function(target, key) {
+    if (!isTesting) return ; //wait until testing should begin...
+    ok(target === content, 'should pass content object as target');
+    equals(key, curKey, 'should pass * as key');    
+  };
+  view.set('content', content);
+  
+  isTesting = YES ;
+  
+  curKey= 'foo';
+  content.set('foo', 'foo');
+  
+  curKey = 'bar';
+  content.set('bar', 'bar');
+});
+
+test("should no longer be invoked when a key is changed on a former content object", function() {
+  var isTesting = NO;
+  view.contentPropertyDidChange = function(target, key) {
+    if (!isTesting) return ; //wait until testing should begin...
+    ok(NO, 'should not invoke contentPropertyDidChange after content is removed');
+  };
+  
+  view.set('content', content);
+  content.set('foo', 'foo');
+  view.set('content', null);
+  
+  isTesting= YES ;
+  content.set('bar', 'bar');
+});
+
+test("should fire even on a content object set when the object is created", function() {
+  var callCount = 0;
+  var view = SC.View.create(SC.Control, {
+    contentPropertyDidChange: function() { callCount++; },
+    content: content
+  });
+  
+  equals(callCount, 1, 'should call contentPropertyDidChange on init to do initial setup');
+  
+  content.set('foo', 'foo');
+  equals(callCount, 2, 'should call contentPropertyDidChange when changing content.foo');
+});
+
+
+module('SC.Button#titleRendering', {
+  setup: function() {
+    content = SC.Object.create();
+    view = SC.View.create(SC.Control, SC.Button);
+    view.set('title', 'hello world');
+  },
+  
+  teardown: function() {
+    content = null;
+    view.destroy();
+  }
+});
+
+
+test("should return the title localized or not", function() {
+  
+  equals(view.displayTitle(), 'hello world', 'should return an empty string as the title is not localized');
+});
+
+test("should return the button view context with the title set", function() {
+  context = SC.RenderContext();
+  ok((view.renderTitle(context, true).length>0), 'title string were added to the context');
+});
+
+
+
+
+// ..........................................................
+// updatePropertyFromContent()
+// 
+module("SC.Button#updatePropertyFromContent()", {
+  setup: function() {
+    content = SC.Object.create({ foo: "foo", bar: "bar" });
+    view = SC.View.create(SC.Control, SC.Button, { content: content });
+  },
+  teardown: function() {
+    content = null ;
+    view.destroy();
+  }
+}) ;
+
+test("copies value of content[key] to this[prop] if changed key.  Gets key from contentKey property", function() {
+  view.contentValueKey = 'foo'; // set key mapping.
+  view.updatePropertyFromContent('value', 'foo', 'contentValueKey');
+  equals(view.get('value'), 'foo', 'should copy foo from content.foo to value');
+});
+
+test("does nothing of changed key does not match contentKey value" ,function() {
+  view.value = "foo";
+  view.contentValueKey = "foo" ;
+  view.updatePropertyFromContent('value', 'bar', 'contentValueKey');
+  equals(view.get('value'), 'foo', 'should not have changed "value"');
+});
+
+test("if contentKey is not passed, assume contentPROPKey", function() {
+  view.contentValueKey = "foo";
+  view.updatePropertyFromContent("value", "foo");
+  equals(view.get('value'), 'foo', 'should have looked at foo since contentValueKey is set to foo');
+});
+
+test("if contentFooKey is not set on receiver, ask displayDelegate", function() {
+  view.displayDelegate = SC.Object.create({ contentValueKey: "foo" });
+  view.updatePropertyFromContent("value", "foo", "contentValueKey");
+  equals(view.get('value'), 'foo', 'should have looked at foo since contentValueKey is set to foo');
+});
+
+test("should be able to get value from a content object that is not SC.Object", function() {
+  view.content = { foo: "foo" };
+  view.contentValueKey = "foo";
+  view.updatePropertyFromContent("value", "foo", "contentValueKey");
+  equals(view.get('value'), 'foo', 'should have looked at foo since contentValueKey is set to foo');
+});
+
+
+
+
+
+// ..........................................................
+// updateContentWithValueObserver()
+// 
+module("SC.Button#updatePropertyFromContent()", {
+  setup: function() {
+    content = SC.Object.create({ foo: "foo", bar: "bar" });
+    view = SC.View.create(SC.Control, SC.Button, { 
+      value: "bar",
+      content: content,
+      contentValueKey: "bar",
+      displayDelegate: SC.Object.create({ contentValueKey: "foo" }) 
+    });
+  },
+  teardown: function() {
+    content = null ;
+    view.destroy();
+  }
+}) ;
+
+test("if contentValueKey is set, changing value will be pushed to content", function() {
+  view.set('value', 'baz');
+  equals(content.get('bar'), 'baz', 'should copy from view.value to content');
+});
+
+test("if contentValueKey is undefined, asks display delegate instead", function() {
+  delete view.contentValueKey ;
+  view.set('value', 'baz');
+  equals(content.get('foo'), 'baz', 'should copy from view.value to content');
+});
+
+test("if contentValueKey is not set & displayDelegate not set, does nothing", function() {
+  delete view.contentValueKey;
+  delete view.displayDelegate;
+  view.set('value', 'baz');
+  equals(content.get('foo'), 'foo', 'should not change');
+});
+
+

data/frameworks/sproutcore/frameworks/foundation/tests/mixins/button/displayProperties.js

@@ -0,0 +1,89 @@
+// ==========================================================================
+// Project:   SproutCore - JavaScript Application Framework
+// Copyright: ©2006-2009 Apple, Inc. and contributors.
+// License:   Licened under MIT license (see license.js)
+// ==========================================================================
+
+/*global module test equals context ok same */
+
+var view ;
+module("SC.Button#displayProperties", {
+  setup: function() {
+    view = SC.View.create(SC.Control, SC.Button, { 
+        isVisibleInWindow: YES 
+    }).createLayer();
+  },
+  
+  teardown: function() {
+    view.destroy();
+  }
+});
+
+test("setting isSelected to YES adds sel class name", function() {
+  SC.RunLoop.begin();
+  view.set('isSelected', YES);
+  SC.RunLoop.end();
+  ok(view.$().hasClass('sel'), 'should have css class sel');
+});
+
+test("setting isSelected to SC.MIXED_STATE add mixed class name, and removes sel class name", function() {
+  SC.RunLoop.begin();
+  view.set('isSelected', SC.MIXED_STATE);
+  SC.RunLoop.end();
+  ok(view.$().hasClass('mixed'), 'should have css class mixed');
+  ok(!view.$().hasClass('sel'), 'should NOT have css class sel');
+});
+
+test("setting isSelected to ON removes sel class name", function() {
+  SC.RunLoop.begin();
+  view.set('isSelected', YES);
+  SC.RunLoop.end();
+  ok(view.$().hasClass('sel'), 'precond - should have sel class');
+  
+  SC.RunLoop.begin();
+  view.set('isSelected', NO);
+  SC.RunLoop.end();
+  ok(!view.$().hasClass('sel'), 'should no longer have sel class');
+});
+
+test("setting isEnabled to NO adds disabled class", function() {
+  SC.RunLoop.begin();
+  view.set('isEnabled', NO);
+  SC.RunLoop.end();
+  ok(view.$().hasClass('disabled'), 'should have disabled class');
+
+  SC.RunLoop.begin();
+  view.set('isEnabled', YES);
+  SC.RunLoop.end();
+  ok(!view.$().hasClass('disabled'), 'should remove disabled class');
+});
+
+test("should gain focus class if isFirstResponder", function() {
+  SC.RunLoop.begin();
+  view.set('isFirstResponder', YES);
+  SC.RunLoop.end();
+  ok(view.$().hasClass('focus'), 'should have focus class');
+
+  SC.RunLoop.begin();
+  view.set('isFirstResponder', NO);
+  SC.RunLoop.end();
+  ok(!view.$().hasClass('focus'), 'should remove focus class');
+});
+
+test("should gain active class if isActive", function() {
+  SC.RunLoop.begin();
+  view.set('isActive', YES);
+  SC.RunLoop.end();
+  ok(view.$().hasClass('active'), 'should have active class');
+
+  SC.RunLoop.begin();
+  view.set('isActive', NO);
+  SC.RunLoop.end();
+  ok(!view.$().hasClass('active'), 'should remove active class');
+});
+
+test("should get controlSize class on init", function() {
+  ok(view.$().hasClass(SC.REGULAR_CONTROL_SIZE), 'should have regular control size class');
+});
+
+

data/frameworks/sproutcore/frameworks/foundation/tests/mixins/control/content.js

@@ -0,0 +1,168 @@
+// ==========================================================================
+// Project:   SproutCore - JavaScript Application Framework
+// Copyright: ©2006-2009 Apple, Inc. and contributors.
+// License:   Licened under MIT license (see license.js)
+// ==========================================================================
+
+/*global module test equals context ok same */
+
+// ..........................................................
+// contentPropertyDidChange()
+// 
+var view, content ;
+module('SC.Control#contentPropertyDidChange', {
+  setup: function() {
+    content = SC.Object.create();
+    view = SC.View.create(SC.Control);
+  },
+  
+  teardown: function() {
+    content = null;
+    view.destroy();
+  }
+});
+
+test("invoked with key = * whenever content changes", function() {
+  view.contentPropertyDidChange = function(target, key) {
+    ok(target === content, 'should pass content object as target target=%@'.fmt(target));
+    equals(key, '*', 'should pass * as key');    
+  };
+  view.set('content', content);
+});
+
+test("invoked with key = foo whenever a propery on content is changed", function() {
+  var isTesting = NO, curKey ;
+  view.contentPropertyDidChange = function(target, key) {
+    if (!isTesting) return ; //wait until testing should begin...
+    ok(target === content, 'should pass content object as target');
+    equals(key, curKey, 'should pass * as key');    
+  };
+  view.set('content', content);
+  
+  isTesting = YES ;
+  
+  curKey= 'foo';
+  content.set('foo', 'foo');
+  
+  curKey = 'bar';
+  content.set('bar', 'bar');
+});
+
+test("should no longer be invoked when a key is changed on a former content object", function() {
+  var isTesting = NO;
+  view.contentPropertyDidChange = function(target, key) {
+    if (!isTesting) return ; //wait until testing should begin...
+    ok(NO, 'should not invoke contentPropertyDidChange after content is removed');
+  };
+  
+  view.set('content', content);
+  content.set('foo', 'foo');
+  view.set('content', null);
+  
+  isTesting= YES ;
+  content.set('bar', 'bar');
+});
+
+test("should fire even on a content object set when the object is created", function() {
+  var callCount = 0;
+  var view = SC.View.create(SC.Control, {
+    contentPropertyDidChange: function() { callCount++; },
+    content: content
+  });
+  
+  equals(callCount, 1, 'should call contentPropertyDidChange on init to do initial setup');
+  
+  content.set('foo', 'foo');
+  equals(callCount, 2, 'should call contentPropertyDidChange when changing content.foo');
+});
+
+// ..........................................................
+// updatePropertyFromContent()
+// 
+module("SC.Control#updatePropertyFromContent()", {
+  setup: function() {
+    content = SC.Object.create({ foo: "foo", bar: "bar" });
+    view = SC.View.create(SC.Control, { content: content });
+  },
+  teardown: function() {
+    content = null ;
+    view.destroy();
+  }
+}) ;
+
+test("copies value of content[key] to this[prop] if changed key.  Gets key from contentKey property", function() {
+  view.contentValueKey = 'foo'; // set key mapping.
+  view.updatePropertyFromContent('value', 'foo', 'contentValueKey');
+  equals(view.get('value'), 'foo', 'should copy foo from content.foo to value');
+});
+
+test("does nothing of changed key does not match contentKey value" ,function() {
+  view.value = "foo";
+  view.contentValueKey = "foo" ;
+  view.updatePropertyFromContent('value', 'bar', 'contentValueKey');
+  equals(view.get('value'), 'foo', 'should not have changed "value"');
+});
+
+test("if contentKey is not passed, assume contentPROPKey", function() {
+  view.contentValueKey = "foo";
+  view.updatePropertyFromContent("value", "foo");
+  equals(view.get('value'), 'foo', 'should have looked at foo since contentValueKey is set to foo');
+});
+
+test("if contentFooKey is not set on receiver, ask displayDelegate", function() {
+  view.displayDelegate = SC.Object.create({ contentValueKey: "foo" });
+  view.updatePropertyFromContent("value", "foo", "contentValueKey");
+  equals(view.get('value'), 'foo', 'should have looked at foo since contentValueKey is set to foo');
+});
+
+test("should be able to get value from a content object that is not SC.Object", function() {
+  view.content = { foo: "foo" };
+  view.contentValueKey = "foo";
+  view.updatePropertyFromContent("value", "foo", "contentValueKey");
+  equals(view.get('value'), 'foo', 'should have looked at foo since contentValueKey is set to foo');
+});
+
+// ..........................................................
+// updateContentWithValueObserver()
+// 
+module("SC.Control#updatePropertyFromContent()", {
+  setup: function() {
+    content = SC.Object.create({ foo: "foo", bar: "bar" });
+    view = SC.View.create(SC.Control, { 
+      value: "bar",
+      content: content,
+      contentValueKey: "bar",
+      displayDelegate: SC.Object.create({ contentValueKey: "foo" }) 
+    });
+  },
+  teardown: function() {
+    content = null ;
+    view.destroy();
+  }
+}) ;
+
+test("if contentValueKey is set, changing value will be pushed to content", function() {
+  view.set('value', 'baz');
+  equals(content.get('bar'), 'baz', 'should copy from view.value to content');
+});
+
+test("does nothing if content is null", function() {
+  view.set('content', null);
+  view.set('value', 'baz'); // should be no errors here...
+  equals(content.get('bar'), 'bar', 'should not change');
+  equals(content.get('foo'), 'foo', 'should not change');
+});
+
+test("if contentValueKey is undefined, asks display delegate instead", function() {
+  delete view.contentValueKey ;
+  view.set('value', 'baz');
+  equals(content.get('foo'), 'baz', 'should copy from view.value to content');
+});
+
+test("if contentValueKey is not set & displayDelegate not set, does nothing", function() {
+  delete view.contentValueKey;
+  delete view.displayDelegate;
+  view.set('value', 'baz');
+  equals(content.get('bar'), 'bar', 'should not change');
+  equals(content.get('foo'), 'foo', 'should not change');
+});