sproutcore 1.9.2 → 1.10.0.rc.1

data/lib/frameworks/sproutcore/frameworks/foundation/tests/views/label/ui.js

@@ -34,14 +34,8 @@ var pane = SC.ControlTestPane.design()
     value: "hello"
   })
 
-  .add("centered", SC.LabelView, {
+  .add("icon", SC.LabelView, {
      value: "hello",
-     textAlign: SC.ALIGN_CENTER
-  })
-
-  .add("centered,icon", SC.LabelView, {
-     value: "hello",
-     textAlign: SC.ALIGN_CENTER ,
      icon: iconURL
   })
 
@@ -60,17 +54,6 @@ var pane = SC.ControlTestPane.design()
      controlSize: SC.TINY_CONTROL_SIZE
   })
 
-  .add("bold", SC.LabelView, {
-     value: "hello",
-     fontWeight: SC.BOLD_WEIGHT
-  })
-
-  .add("bold height", SC.LabelView, {
-     value: "hello",
-     fontWeight: SC.BOLD_WEIGHT,
-     height: 16
-  })
-
   .add("editable", SC.LabelView, {
      value: "double click me",
      isEditable: YES
@@ -84,14 +67,14 @@ var pane = SC.ControlTestPane.design()
      value: undefined
   });
 
-pane.show(); // add a test to show the test pane
-
 
 module('SC.LabelView ui', {
   setup: function() {
     htmlbody('<style> .sc-static-layout { border: 1px red dotted; } </style>');
+    pane.standardSetup().setup();
   },
   teardown: function(){
+    pane.standardSetup().teardown();
     clearHtmlbody();
   }
 });
@@ -100,13 +83,10 @@ test("Check that all Label are visible", function() {
   ok(pane.view('basic').get('isVisibleInWindow'), 'basic.isVisibleInWindow should be YES');
   ok(pane.view('disabled').get('isVisibleInWindow'), 'title.isVisibleInWindow should be YES');
   ok(pane.view('selectable').get('isVisibleInWindow'), 'icon.isVisibleInWindow should be YES');
-  ok(pane.view('centered').get('isVisibleInWindow'), 'title,icon.isVisibleInWindow should be YES');
-  ok(pane.view('centered,icon').get('isVisibleInWindow'), 'title,icon,disabled.isVisibleInWindow should be YES');
+  ok(pane.view('icon').get('isVisibleInWindow'), 'title,icon,disabled.isVisibleInWindow should be YES');
   ok(pane.view('regular size').get('isVisibleInWindow'), 'title,icon,default.isVisibleInWindow should be YES');
   ok(pane.view('small size').get('isVisibleInWindow'), 'title.icon,selected.isVisibleInWindow should be YES');
   ok(pane.view('tiny size').get('isVisibleInWindow'), 'title,toolTip.isVisibleInWindow should be YES');
-  ok(pane.view('bold').get('isVisibleInWindow'), 'title,toolTip.isVisibleInWindow should be YES');
-  ok(pane.view('bold height').get('isVisibleInWindow'), 'title,toolTip.isVisibleInWindow should be YES');
   ok(pane.view('editable').get('isVisibleInWindow'), 'title,toolTip.isVisibleInWindow should be YES');
   ok(pane.view('null value').get('isVisibleInWindow'), 'null value.isVisibleInWindow should be YES');
 });
@@ -137,32 +117,17 @@ test("Check that all labels have the right classes and styles set", function() {
   ok(viewElem.hasClass('icon'), 'view element should have "icon" class');
   ok(viewElem.find('img').hasClass('icon'), 'img element inside view should have "icon" class');
 
-  viewElem=pane.view('centered').$();
-  ok(viewElem.hasClass('sc-view'), 'title,icon.hasClass(sc-view) should be YES');
-  ok(viewElem.hasClass('sc-label-view'), 'title,icon.hasClass(sc-label-view) should be YES');
-  ok(!viewElem.hasClass('icon'), 'title,icon.hasClass(icon) should be YES');
-  ok(!viewElem.hasClass('disabled'), 'title,icon.hasClass(disabled) should be NO');
-  ok(viewElem.css('textAlign') === 'center', 'centered should have center textAlign');
-
-  viewElem=pane.view('centered,icon').$();
+  viewElem=pane.view('icon').$();
   ok(viewElem.hasClass('sc-view'), 'title,icon,disabled.hasClass(sc-view) should be YES');
   ok(viewElem.hasClass('sc-label-view'), 'title,icon,disabled.hasClass(sc-label-view) should be YES');
   ok(viewElem.hasClass('icon'), 'title,icon,disabled.hasClass(icon) should be YES');
   ok(!viewElem.hasClass('disabled'), 'title,icon,disabled.hasClass(disabled) should be YES');
-  ok(viewElem.css('textAlign') === 'center', 'centered,icon should have center textAlign');
 
   viewElem=pane.view('regular size').$();
   ok(viewElem.hasClass('sc-view'), 'title,icon,default.hasClass(sc-view) should be YES');
   ok(viewElem.hasClass('sc-label-view'), 'title,icon,default.hasClass(sc-label-view) should be YES');
   ok(viewElem.hasClass('sc-regular-size'), 'title,icon,default.hasClass(sc-regular-size) should be YES');
   ok(!viewElem.hasClass('disabled'), 'title,icon,default.hasClass(disabled) should be NO');
-
-  viewElem=pane.view('bold').$();
-  ok(viewElem.hasClass('sc-view'), 'title,icon,selected.hasClass(sc-view) should be YES');
-  ok(viewElem.hasClass('sc-label-view'), 'title,icon,selected.hasClass(sc-label-view) should be YES');
-  ok(!viewElem.hasClass('icon'), 'title,icon,selected.hasClass(icon) should be YES');
-  ok(!viewElem.hasClass('disabled'), 'title,icon,selected.hasClass(disabled) should be NO');
-  ok(viewElem[0].style.fontWeight === 'bold', 'bold view should have bold fontWeight');
 });
 
 
@@ -170,7 +135,7 @@ test("Check that the title is set or not and if it is in the appropriate element
   var viewElem=pane.view('basic').$();
   equals(viewElem.text(), 'hello', 'has a value set');
 
-  viewElem=pane.view('centered,icon').$('img');
+  viewElem=pane.view('icon').$('img');
   ok((viewElem!==null), 'should have an image corresponding to an icon');
 
   viewElem=pane.view('null value').$();

data/lib/frameworks/sproutcore/frameworks/foundation/tests/views/text_field/methods.js

@@ -42,7 +42,7 @@ module("SC.TextFieldView",{
   },
 
   teardown: function() {
-      pane.remove();
+      pane.destroy();
       pane = view = null ;
     }
 });
@@ -105,20 +105,64 @@ test("isEnabled=YES isEditable=YES should not add disable or readOnly attribute"
   ok(!view.$input().attr('readOnly'), 'should not have readOnly attribute');
 });
 
-test("autoCapitalize=YES should add autocapitalize", function() {
+test("isBrowserFocusable should set tab index", function() {
+  SC.RunLoop.begin();
+  view.set('isBrowserFocusable', YES);
+  SC.RunLoop.end();
+  ok(view.$input().attr('tabindex') !== "-1", 'focusable field should not have unfocusable tab index');
+  SC.RunLoop.begin();
+  view.set('isBrowserFocusable', NO);
+  SC.RunLoop.end();
+  ok(view.$input().attr('tabindex') === "-1", 'unfocusable field should have unfocusable tab index');
+});
+
+test("autoCapitalize=SC.AUTOCAPITALIZE_NONE should add autocapitalize='none'", function() {
+  SC.RunLoop.begin();
+  view.set('autoCapitalize', SC.AUTOCAPITALIZE_NONE);
+  view.displayDidChange();
+  SC.RunLoop.end();
+  console.log(view.$input().attr('autocapitalize'))
+  ok(view.$input().attr('autocapitalize') === "none", 'should have an autocapitalize attribute set to "none"');
+});
+
+test("autoCapitalize=SC.AUTOCAPITALIZE_SENTENCES should add autocapitalize='sentences'", function() {
+  SC.RunLoop.begin();
+  view.set('autoCapitalize', SC.AUTOCAPITALIZE_SENTENCES);
+  view.displayDidChange();
+  SC.RunLoop.end();
+  ok(view.$input().attr('autocapitalize') === "sentences", 'should have an autocapitalize attribute set to "sentences"');
+});
+
+test("autoCapitalize=SC.AUTOCAPITALIZE_WORDS should add autocapitalize='words'", function() {
+  SC.RunLoop.begin();
+  view.set('autoCapitalize', SC.AUTOCAPITALIZE_WORDS);
+  view.displayDidChange();
+  SC.RunLoop.end();
+  ok(view.$input().attr('autocapitalize') === "words", 'should have an autocapitalize attribute set to "words"');
+});
+
+test("autoCapitalize=SC.AUTOCAPITALIZE_CHARACTERS should add autocapitalize='characters'", function() {
+  SC.RunLoop.begin();
+  view.set('autoCapitalize', SC.AUTOCAPITALIZE_CHARACTERS);
+  view.displayDidChange();
+  SC.RunLoop.end();
+  ok(view.$input().attr('autocapitalize') === "characters", 'should have an autocapitalize attribute set to "characters"');
+});
+
+test("autoCapitalize=YES should add autocapitalize='sentences'", function() {
   SC.RunLoop.begin();
   view.set('autoCapitalize', YES);
   view.displayDidChange();
   SC.RunLoop.end();
-  ok(view.$input().attr('autocapitalize') !== "off", 'should have an autocapitalize attribute');
+  ok(view.$input().attr('autocapitalize') === "sentences", 'should have an autocapitalize attribute set to "sentences"');
 });
 
-test("autoCapitalize=NO should add autocapitalize='off'", function() {
+test("autoCapitalize=NO should add autocapitalize='none'", function() {
   SC.RunLoop.begin();
   view.set('autoCapitalize', NO);
   view.displayDidChange();
   SC.RunLoop.end();
-  ok(view.$input().attr('autocapitalize') === "off", 'should have an autocapitalize attribute set to "off"');
+  ok(view.$input().attr('autocapitalize') === "none", 'should have an autocapitalize attribute set to "none"');
 });
 
 test("autoCapitalize=null should not add autocapitalize", function() {
@@ -129,12 +173,12 @@ test("autoCapitalize=null should not add autocapitalize", function() {
   ok(!view.$input().attr('autocapitalize'), 'should not have an autocapitalize attribute set');
 });
 
-test("autoCorrect=YES should add autocorrect", function() {
+test("autoCorrect=YES should add autocorrect='on'", function() {
   SC.RunLoop.begin();
   view.set('autoCorrect', YES);
   view.displayDidChange();
   SC.RunLoop.end();
-  ok(view.$input().attr('autocorrect') !== "off", 'should have an autocorrect attribute');
+  ok(view.$input().attr('autocorrect') === "on", 'should have an autocorrect attribute set to "on"');
 });
 
 test("autoCorrect=NO should add autocorrect='off'", function() {

data/lib/frameworks/sproutcore/frameworks/foundation/tests/views/text_field/ui.js

@@ -85,9 +85,6 @@
     isEditable: NO
   });
 
-
-pane.show(); // add a test to show the test pane
-
 // ..........................................................
 // VERIFY STANDARD STATES
 //
@@ -344,9 +341,8 @@ test("Setting the selection to a null value should fail", function() {
   var thrownException = null;
   try {
     view.set('selection', null);
-  }
-  catch(e) {
-    thrownException = e;
+  } catch(e) {
+    thrownException = e.message;
   }
   ok(thrownException.indexOf !== undefined, 'an exception should have been thrown');
   if (thrownException.indexOf !== undefined) {
@@ -362,9 +358,8 @@ test("Setting the selection to a non-SC.TextSelection value should fail", functi
   var thrownException = null;
   try {
     view.set('selection', {start: 0, end: 0});
-  }
-  catch(e) {
-    thrownException = e;
+  } catch(e) {
+    thrownException = e.message;
   }
   ok(thrownException.indexOf !== undefined, 'an exception should have been thrown');
   if (thrownException.indexOf !== undefined) {
@@ -478,7 +473,7 @@ test("Adding right accessory view", function() {
   view.set('rightAccessoryView', accessoryView);
   SC.RunLoop.end();
 
-  ok(view.get('rightAccessoryView').get('layout').left === null, "right accessory view created with 'left' rather than 'right' in layout should have layout.left set to null");
+  ok( SC.none(view.get('rightAccessoryView').get('layout').left), "right accessory view created with 'left' rather than 'right' in layout should not have a value for layout.left");
   ok(view.get('rightAccessoryView').get('layout').right === 0, "right accessory view created with 'left' rather than 'right' in layout should have layout.right set to 0");
 
 
@@ -590,9 +585,9 @@ test("Adding both left and right accessory views changes style -- using design()
   ok(!paddingElement.style.left, 'after removing the left accessory view the padding element should have no left style');
 });
 
-test("Accessory views should only be instantiated once", function() {  
+test("Accessory views should only be instantiated once", function() {
   var view = pane.view('with value');
-  
+
   // Test the left accessory view
   SC.RunLoop.begin();
   var leftAccessoryViewInitCount = 0;
@@ -605,13 +600,13 @@ test("Accessory views should only be instantiated once", function() {
   });
   view.set('leftAccessoryView', leftAccessoryView);
   SC.RunLoop.end();
-  
+
   // Check it
   equals(leftAccessoryViewInitCount, 1, 'the left accessory view should only be initialized once');
-  
+
   // Reset to null so it isn't created a second time when rightAccessoryView is set
   view.set('leftAccessoryView', null);
-  
+
   // Test the right accessory view
   SC.RunLoop.begin();
   var rightAccessoryViewInitCount = 0;
@@ -624,7 +619,7 @@ test("Accessory views should only be instantiated once", function() {
   });
   view.set('rightAccessoryView', rightAccessoryView);
   SC.RunLoop.end();
-  
+
   // Check it
   equals(rightAccessoryViewInitCount, 1, 'the right accessory view should only be initialized once');
 });

data/lib/frameworks/sproutcore/frameworks/foundation/transitions/adjust_bounce_transition.js

@@ -0,0 +1,80 @@
+// ==========================================================================
+// Project:   SproutCore
+// Copyright: @2013 7x7 Software, Inc.
+// License:   Licensed under MIT license (see license.js)
+// ==========================================================================
+
+
+SC.mixin(SC.View,
+  /** @scope SC.View */ {
+
+  /** @class
+
+    To modify the bounce animation, you may set the following transition
+    options in `transitionAdjustOptions`:
+
+      - bounces {Number} the number of bounce back iterations.  Default: 2
+      - bounciness {Number} the bounce coefficient.  Default: 0.25
+      - duration {Number} the number of seconds for the animation.  Default: 0.4
+
+    @extends SC.ViewTransitionProtocol
+    @see SC.View#animate for other timing functions.
+    @since Version 1.10
+  */
+  BOUNCE_ADJUST: {
+
+    /** @private */
+    run: function (view, options, finalLayout) {
+      var bounces = options.bounces || 2,
+        bounciness = options.bounciness || 0.25,
+        layout = view.get('layout'),
+        frames = [],
+        frameCount = (bounces * 2) + 1,
+        duration,
+        i;
+
+      // Split the duration evenly per frame.
+      duration = options.duration || 0.4;
+      duration = duration / frameCount;
+
+      // Construct the frame layouts.
+      for (i = 0; i < frameCount; i++) {
+        if (i % 2) {
+          // Bounce back.
+          frames[i] = { value: SC.clone(finalLayout), duration: duration, timing: 'ease-out' };
+        } else {
+          // Hit target.
+          if (i === frameCount - 1) {
+            frames[i] = { value: SC.clone(finalLayout), duration: duration, timing: 'ease-in-out' };
+          } else {
+            frames[i] = { value: SC.clone(finalLayout), duration: duration, timing: 'ease-in' };
+          }
+        }
+      }
+
+      // Adjust the bounce frame layouts.
+      for (var key in finalLayout) {
+        var finalValue = finalLayout[key],
+          // The bounce is based on the "distance" to the final value and the bounciness value.
+          bounce = Math.round((finalValue - layout[key]) * bounciness);
+
+        // Adjust the layout property for each bounce.
+        for (i = 0; i < bounces; i++) {
+          // Pull out the bounce frames only.
+          frames[(i * 2) + 1].value[key] = finalValue - bounce;
+
+          // Cut back the bounce amount after each bounce
+          bounce = Math.round(bounce * 0.5);
+        }
+      }
+
+      var callback = function () {
+        view.didTransitionAdjust();
+      };
+
+      // Animate through the frames.
+      view._animateFrames(frames, callback, options.delay || 0);
+    }
+  }
+
+});

data/lib/frameworks/sproutcore/frameworks/foundation/transitions/adjust_smooth_transition.js

@@ -0,0 +1,39 @@
+// ==========================================================================
+// Project:   SproutCore
+// Copyright: @2013 7x7 Software, Inc.
+// License:   Licensed under MIT license (see license.js)
+// ==========================================================================
+
+
+SC.mixin(SC.View,
+  /** @scope SC.View */ {
+
+  /** @class
+
+    To modify the smooth animation, you may set the following transition
+    options in `transitionAdjustOptions`:
+
+      - duration {Number} the number of seconds for the animation.  Default: 0.4
+
+    @extends SC.ViewTransitionProtocol
+    @see SC.View#animate for other timing functions.
+    @since Version 1.10
+  */
+  SMOOTH_ADJUST: {
+
+    /** @private */
+    run: function (view, options, finalLayout) {
+      var key,
+        value;
+
+      view.animate(finalLayout, {
+        delay: options.delay || 0,
+        duration: options.duration || 0.4,
+        timing: options.timing || 'ease'
+      }, function (data) {
+        this.didTransitionAdjust();
+      });
+    }
+  }
+
+});

data/lib/frameworks/sproutcore/frameworks/foundation/transitions/adjust_spring_transition.js

@@ -0,0 +1,77 @@
+// ==========================================================================
+// Project:   SproutCore
+// Copyright: @2013 7x7 Software, Inc.
+// License:   Licensed under MIT license (see license.js)
+// ==========================================================================
+
+
+SC.mixin(SC.View,
+  /** @scope SC.View */ {
+
+  /** @class
+
+    To modify the spring animation, you may set the following transition
+    options in `transitionAdjustOptions`:
+
+      - springs {Number} the number of spring back iterations.  Default: 4
+      - springiness {Number} the spring coefficient.  Default: 0.25
+      - duration {Number} the number of seconds for the animation.  Default: 0.4
+
+    @extends SC.ViewTransitionProtocol
+    @see SC.View#animate for other timing functions.
+    @since Version 1.10
+  */
+  SPRING_ADJUST: {
+
+    /** @private */
+    run: function (view, options, finalLayout) {
+      var springs = options.springs || 4,
+        springiness = options.springiness || 0.25,
+        layout = view.get('layout'),
+        frames = [],
+        frameCount = springs + 1,
+        duration,
+        i;
+
+      // Split the duration evenly per frame.
+      duration = options.duration || 0.4;
+      duration = duration / frameCount;
+
+      // Construct the frame layouts.
+      for (i = 0; i < frameCount; i++) {
+        if (i !== 0) {
+          frames[i] = { value: SC.clone(finalLayout), duration: duration, timing: 'ease-in-out' };
+        } else {
+          frames[i] = { value: SC.clone(finalLayout), duration: duration, timing: 'ease-out' };
+        }
+      }
+
+      // Adjust the spring frame layouts.
+      for (var key in finalLayout) {
+        var finalValue = finalLayout[key],
+          // The spring is based on the "distance" to the final value and the springiness value.
+          spring = Math.round((finalValue - layout[key]) * springiness);
+
+        // Adjust the layout property for each spring.
+        for (i = 0; i < springs; i++) {
+          if (i % 2) {
+            frames[i].value[key] = finalValue - spring; // Overshoot back.
+          } else {
+            frames[i].value[key] = finalValue + spring; // Overshoot forward.
+          }
+
+          // Cut back the spring amount after each spring
+          spring = Math.round(spring * 0.5);
+        }
+      }
+
+      var callback = function () {
+        view.didTransitionAdjust();
+      };
+
+      // Animate through the frames.
+      view._animateFrames(frames, callback, options.delay || 0);
+    }
+  }
+
+});