sproutit-sproutcore 1.0.0.20090407205609 → 1.0.0.20090408130025

data/frameworks/sproutcore/frameworks/deprecated/tests/application/application.rhtml

@@ -0,0 +1,125 @@
+<% popup_menu_view :a_menu, :pane => 'menu', :class => 'menu' do %>
+  <%= menu_item_view :item_enabled_key_equiv_no_target, 
+    :outlet => true, 
+    :label => "", 
+    :action => "onAltShiftA",
+    :key_equivalent => 'alt_shift_a' 
+  %>
+  <%= menu_item_view :item_enabled_key_equiv_with_target, 
+    :outlet => true, 
+    :label => "", 
+    :action => "onAltShiftB",
+    :target => "SC.exampleController",
+    :key_equivalent => 'alt_shift_b' 
+  %>
+  <%= menu_item_view :item_disabled_key_equiv, 
+    :outlet => true, 
+    :label => "", 
+    :enabled => false, 
+    :action => "onAltShiftB",
+    :key_equivalent => 'alt_shift_b' 
+  %>
+<% end %>
+
+<% view :view_1 do %>
+  <% view :view_1_1, :outlet => true do %>
+    <% view :view_1_1_1, :outlet => true do %>
+    <% end %>
+  <% end %>
+  <% view :view_1_2, :outlet => true do %>
+    <% view :view_1_2_1, :outlet => true do %>
+    <% end %>
+  <% end %>
+<% end %>
+
+
+<% content_for('final') do %>
+<script>
+
+Test.context("SC.Application", {
+
+  "Should be instantiated and placed in SC.app on page load": function()
+  {
+    SC.app.kindOf(SC.Application).shouldEqual(true);
+  },
+  "SC.app keyPane should be set to SC.window by default": function()
+  {
+    var keyPane = SC.app.get('keyPane');
+    ( keyPane == SC.window ).shouldEqual(true);
+  },
+  "SC.app mainPane should be set to SC.window by default": function()
+  {
+    var mainPane = SC.app.get('mainPane');
+    ( mainPane == SC.window ).shouldEqual(true);
+  },
+  "Setting the keyPane shouldn't change the mainPane": function()
+  {
+    ( SC.app.get('mainPane') == SC.window ).shouldEqual(true);
+
+    var pane = SC.ClassicPaneView.viewFor(null);
+    SC.app.set('keyPane', pane);
+    ( SC.app.get('mainPane') == SC.window ).shouldEqual(true);
+  },
+
+  setup: function()
+  {
+  },
+  teardown: function()
+  {
+  }
+
+});
+
+
+
+Test.context("SC.Application's sendAction method", {
+
+  "Should not handle actions that are not strings": function()
+  {
+    SC.app.sendAction( null, null, null ).shouldEqual(false);
+    SC.app.sendAction( false, null, null ).shouldEqual(false);
+    SC.app.sendAction( {}, null, null ).shouldEqual(false);
+    SC.app.sendAction( function(){}, null, null ).shouldEqual(false);
+  },
+  "Should return boolean for whether an action is handled": function()
+  {
+    var leaf1 = SC.page.get('view1').view11.view111;
+        
+    leaf1.anActionThatReturnsNothing = this.anActionThatReturnsNothing;
+    leaf1.anActionThatReturnsTrue    = this.anActionThatReturnsTrue;
+    leaf1.anActionThatReturnsFalse   = this.anActionThatReturnsFalse;
+    leaf1.becomeFirstResponder();
+
+    SC.app.sendAction( "anActionThatReturnsNothing", leaf1, null ).shouldEqual(true);
+    SC.app.sendAction( "anActionThatReturnsTrue", leaf1, null ).shouldEqual(true);
+
+    SC.app.sendAction( "anActionThatReturnsFalse", leaf1, null ).shouldEqual(false);
+    SC.app.sendAction( "anActionThatDoesNotExist", leaf1, null ).shouldEqual(false);
+  },
+  "Should ...": function()
+  {
+    var leaf1 = SC.page.get('view1').view11.view111;
+    var leaf2 = SC.page.get('view1').view12.view121;
+    
+    leaf1.bubblingAction = this.anActionThatReturnsNothing;
+    leaf2.bubblingAction = this.anActionThatReturnsNothing;
+    
+    leaf1.becomeFirstResponder();
+  },
+
+  setup: function()
+  {
+    this.anActionThatReturnsNothing = function() { this.__action_called__ = true; };
+    this.anActionThatReturnsTrue    = function() { this.__action_called__ = true; return true; };
+    this.anActionThatReturnsFalse   = function() { this.__action_called__ = true; return false; };
+    SC.page.awake();
+  },
+  teardown: function()
+  {
+  }
+
+});
+
+
+</script>
+<% end %>

data/frameworks/sproutcore/frameworks/deprecated/tests/views/classic_view/clippingFrame.rhtml

@@ -0,0 +1,401 @@
+<% # ========================================================================
+   # SC.ClassicView clippingFrame Unit Test
+   #
+   # The clippingFrame tells you what portion of the view is actually visible
+   # on screen.  If the view is not on screen or is scrolled out of view,
+   # then the size of the clipping frame will be 0.
+   #
+   # ========================================================================
+%>
+<% content_for('final') do %>
+
+<script>
+
+VIEW_HEIGHT = 90 ;
+CHILD_HEIGHT = 150;
+NESTED_CHILD_HEIGHT = 40 ;
+
+Test.context("CASE 1: Non-scrollable view - all view fits within content", {
+
+  "child clippingFrame should == child innerFrame": function() {
+    //debugger ;
+    var v = this.v.child ;
+    var f = v.get('frame') ;
+    var cf = v.get('clippingFrame') ;
+
+    SC.rectsEqual(f, cf).shouldEqual(true) ;  
+  },
+  
+  "resizing child frame should reflect child clippingFrame -also should notify change": function() {
+    var v = this.v.child ;
+    var f = v.get('frame') ;
+    var cf = v.get('clippingFrame') ; // give system a chance to cache
+
+    var didChange = false ;
+    v.addObserver('clippingFrame', function() { didChange = true; }) ;
+    v.set('frame', { width: 50, height: 50 }); 
+    didChange.shouldEqual(true) ;
+
+    var f = v.get('frame') ;
+    var cf = v.get('clippingFrame') ;
+    SC.rectsEqual(f, cf).shouldEqual(true) ;  
+  },
+  
+  "resizing parent frame should not change child clippingFrame - also should notify change": function() {
+    var v = this.v.child ;
+    var f = v.get('frame') ;
+    var cf = v.get('clippingFrame') ; // give system a chance to cache
+
+    var didChange = false ;
+    v.addObserver('clippingFrame', function() { didChange = true; }) ;
+    this.v.set('frame', { width: 80, height: 80 }) ;
+    didChange.shouldEqual(true) ;
+
+
+    var nf = v.get('frame') ;
+    var cf = v.get('clippingFrame') ;
+    SC.rectsEqual(nf, f).shouldEqual(false) ;  
+    SC.rectsEqual(nf, cf).shouldEqual(true) ;  
+  },
+  
+  setup: function() { this.v = SC.page.get('case1'); }
+  
+});
+
+Test.context("CASE 2: A scrollable view - child view cannot fit within visible area", {
+
+  "clippingFrame should reflect only the visible portion of the view": function() {
+    var v = this.v.child ;
+    var cf = v.get('clippingFrame') ;
+    
+    var f = v.get('frame') ;
+    f.height = VIEW_HEIGHT ;
+    
+    console.log('cf = %@ - f = %@ - pos = %@'.fmt($I(cf), $I(f), v.getStyle('position'))) ;
+    
+    SC.rectsEqual(f,cf).shouldEqual(true) ;
+  },
+  
+    "scrolling parent frame should change child clippingFrame (and notify)": function() {
+      var child = this.v.child ;
+      var cf = child.get('clippingFrame') ;
+      
+      var didChange = false ;
+      child.addObserver('clippingFrame', function() { didChange = true; }) ;
+      
+      // scroll
+      this.v.set('scrollFrame', { y: -20 }) ;
+    
+      var ncf = child.get('clippingFrame') ;
+      cf.y = 20 ; // adjust expected frame
+    
+      SC.rectsEqual(ncf, cf).shouldEqual(true) ;
+      didChange.shouldEqual(true) ;
+    
+      this.v.set('scrollFrame', { y: 0 }) ;
+    },
+    
+    "resizing parent frame should change child clippingFrame (and notify)": function() {
+      var child = this.v.child ;
+      var cf = child.get('clippingFrame') ;
+      
+      var didChange = false ;
+      child.addObserver('clippingFrame', function() { didChange = true; }) ;
+    
+      // scroll
+      this.v.set('frame', { height: 50 }) ;
+    
+      var ncf = child.get('clippingFrame') ;
+      cf.height = 48 ; // adjust expected frame
+    
+      SC.rectsEqual(ncf, cf).shouldEqual(true) ;
+      didChange.shouldEqual(true) ;
+    
+      this.v.set('frame', { height: 90 }) ;
+    },
+    
+    "resizing child should change clippingFrame (and notify)": function() {
+      var child = this.v.child ;
+      var cf = child.get('clippingFrame') ;
+      
+      var didChange = false ;
+      child.addObserver('clippingFrame', function() { didChange = true; }) ;
+    
+      // scroll
+      child.set('frame', { height: 50 }) ;
+    
+      var ncf = child.get('clippingFrame') ;
+      cf.height = 50 ; // adjust expected frame
+    
+      SC.rectsEqual(ncf, cf).shouldEqual(true) ;
+      didChange.shouldEqual(true) ;
+      
+      // reset
+      child.set('frame', { height: 152 }) ;
+    },
+    
+    "moving child should change clipping frame (and notify)": function() {
+      var child = this.v.child ;
+      var cf = child.get('clippingFrame') ;
+      
+      var didChange = false ;
+      child.addObserver('clippingFrame', function() { didChange = true; }) ;
+    
+      // scroll
+      child.set('frame', { y: 20 }) ;
+    
+      var ncf = child.get('clippingFrame') ;
+      cf.y = 20; cf.height -= 20 ; // adjust expected frame
+    
+      SC.rectsEqual(ncf, cf).shouldEqual(true) ;
+      didChange.shouldEqual(true) ;
+      
+      // reset
+      child.set('frame', { y: 0 }) ;
+    },
+    
+    "moving parent should NOT change child clipping frame": function() {  
+      var child = this.v.child ;
+      var cf = child.get('clippingFrame') ;
+    
+      // move parent frame -- make sure this does not exceed the parent or 
+      // else the clipping frame will be miscalculated.
+      this.v.set('frame', { y: 5 }) ;
+    
+      var ncf = child.get('clippingFrame') ;
+      SC.rectsEqual(ncf, cf).shouldEqual(true) ;
+      
+      // reset
+      this.v.set('frame', { y: 0 }) ;
+    },
+  
+  setup: function() { this.v = SC.page.get('case2'); }
+  
+});
+
+Test.context("CASE 3: A scrollable view with extra height - nested child view can fit within visible area", {
+
+  "clippingFrame should == frame when view is entirely visible": function() {
+  
+     var f = nested.get('frame') ;
+     var cf = nested.get('clippingFrame') ; 
+     console.log('%@: f=%@ -- cf=%@'.fmt(nested, $I(f), $I(cf))); 
+     SC.rectsEqual(f,cf).shouldEqual(true) ;
+   },
+  
+  "clippingFrame should be partial when view is partially scrolled out (and notify)": function() {
+
+    // register observer
+    var didChange = false ;
+    this.nested.addObserver('clippingFrame', function() { didChange = true; }) ;
+    
+    // adjust expected.  Note that this expects .case .child to be statically positioned
+    // so that clippingFrame is based on .case3.
+    var cf = this.nested.get('clippingFrame') ;  
+    cf.y = 30; cf.height -= 20 ;
+
+    // scroll
+    this.v.set('scrollFrame', { y: -30 }) ;
+    
+    // collect new frame and compare
+    this.nested._clippingFrame = null ;
+    var ncf = this.nested.get('clippingFrame') ;
+    
+    window.case3 = this ;
+    
+    console.log("ncf = %@ - cf = %@".fmt($I(ncf), $I(cf))) ;
+    //equals(true, SC.rectsEqual(ncf,cf), 'rectsEqual') ;
+    
+    // force notifications
+    equals(true, didChange, 'didChange') ;
+    
+    // reset
+    this.v.set('scrollFrame', { y: 0 }) ;
+  },
+    
+    "clippingFrame should be 0 height when scroll completely out of view": function() {
+      this.v.set('scrollFrame', { y: -150 }) ;
+      this.nested.get('clippingFrame').height.shouldEqual(0) ;
+      this.v.set('scrollFrame', { y: 0 }) ; // reset  
+    },
+    
+    "clippingFrame should == frame when moved around within view (and notify)": function() {
+      var of= this.nested.get('frame') ;
+      this.nested.set('frame', { x: 20, y: 20 }) ;
+    
+      var f = this.nested.get('frame') ;
+      var cf = this.nested.get('clippingFrame') ;  
+      SC.rectsEqual(f,cf).shouldEqual(true) ;
+      
+      // reset
+      this.nested.set('frame', of) ;
+    },
+  
+  setup: function() { 
+    this.v = SC.page.get('case3'); 
+    this.nested = this.v.child.nestedChild; 
+  }
+  
+});
+
+Test.context("CASE 4: Child view is not actually in window", {
+
+  "clippingFrame should have 0 width or height": function() {
+
+    // get clipping frame to force caching
+    this.child.get('clippingFrame') ;
+    
+    // remove child and get clippingFrame again
+    this.child.removeFromParent() ;
+    var cf = this.child.get('clippingFrame') ;
+    cf.width.shouldEqual(0) ;
+    cf.height.shouldEqual(0) ;  
+  },
+  
+  setup: function() { 
+    this.v = SC.page.get('case4'); 
+    this.child = this.v.child ;
+  }
+  
+});
+
+
+Test.context("CASE 5: Child view's parent is not actually in window", {
+
+  "clippingFrame should have 0 width of height for nested view": function() {
+    
+    // get clipping frame to cause caching
+    this.nested.get('clippingFrame') ;
+    
+    this.v.child.removeFromParent() ;
+    var cf = this.nested.get('clippingFrame') ;
+    cf.width.shouldEqual(0) ;
+    cf.height.shouldEqual(0) ;  
+  },
+  
+  setup: function() { 
+    this.v = SC.page.get('case5'); 
+    this.nested = this.v.child.nestedChild;
+  }
+  
+});
+
+
+
+main = function() { SC.page.awake(); };
+
+</script>
+
+<% end %>
+
+<% content_for('body') do %>
+
+<style>
+
+.case { 
+  background-color: white; 
+  position: absolute; 
+  width: 190px; 
+  height: 90px; 
+  border: 1px blue solid; 
+  overflow: auto; 
+  border-left-width: 5px;
+}
+
+.case .child { 
+  border: 1px red solid;  
+}
+
+.case .nested_child { 
+  border: 1px green solid; 
+  width: 40px; 
+  height: 40px; 
+  position: absolute; 
+  top: 10px; 
+  left: 10px; 
+}
+
+.base {
+  float: left;
+  width: 200px;
+  height: 100px;
+  border: 1px #aaa solid;
+  position: relative;
+  margin: 2px;
+}
+
+.cases { 
+  position: absolute; 
+  bottom: 0 ; 
+  left: 0; 
+  right: 0; 
+  border-top: 1px #ccc solid; 
+}
+
+.base label {
+  position: absolute;
+  bottom: 4px;
+  left: 4px;
+}
+
+.case1 .child { width: 60px; height: 60px; }
+
+.case2 .child,
+.case4 .child {
+  position: relative;
+  height: 150px;
+}
+
+/* case3 child is statically positioned, so offset parent of nested child should be .case3 */
+.case3 .child,
+.case5 .child {
+  height: 150px;
+}
+
+
+
+</style>
+
+<div class="cases">
+<div class="base">
+<label>Case 1</label>
+<% view :case1, :class => 'case' do %>
+  <%= view :child, :outlet => true, :inner_html => 'Child', :properties => { :needs_clipping_frame => true } %>
+<% end %>
+</div>
+
+<div class="base">
+  <label>Case 2</label>
+<% view :case2, :class => 'case', :properties => { :is_scrollable => true } do %>
+  <%= view :child, :outlet => true, :inner_html => 'Child', :properties => { :needs_clipping_frame => true } %>
+<% end %>
+</div>
+
+<div class="base">
+  <label>Case 3</label>
+<% view :case3, :class => 'case', :properties => { :is_scrollable => true } do %>
+  <%  view :child, :outlet => true do %>
+   <%= view :nested_child, :outlet => true, :inner_html => 'Nested Child', :properties => { :needs_clipping_frame => true } %>
+  <% end %>
+<% end %>
+</div>
+
+<div class="base">
+  <label>Case 4</label>
+<% view :case4, :class => 'case', :properties => { :is_scrollable => true } do %>
+  <%= view :child, :outlet => true, :inner_html => 'Child', :properties => { :needs_clipping_frame => true } %>
+<% end %>
+</div>
+
+<div class="base">
+  <label>Case 5</label>
+<% view :case5, :class => 'case', :properties => { :is_scrollable => true } do %>
+  <%  view :child, :outlet => true do %>
+   <%= view :nested_child, :outlet => true, :inner_html => 'Nested Child', :properties => { :needs_clipping_frame => true } %>
+  <% end %>
+<% end %>
+</div>
+
+</div>
+
+<% end %>