Merge branch 'ui'

Rakefile

@@ -35,7 +35,7 @@ def sprocketize(path, source, destination = source)
     :source_files => [source]
   )
 
-  secretary.concatenation.save_to(File.join(SCRIPTY2_DEBUG_DIR, destination))
+  secretary.concatenation.save_to(File.join(SCRIPTY2_DIST_DIR, destination))
 end
 
 task :default => [:clean, :dist, :unified, :doc, :package, :clean_package_source]
@@ -51,7 +51,7 @@ end
 desc "Builds the distribution."
 task :dist do
   sprocketize("src", "s2.js")
-  cp File.join(SCRIPTY2_ROOT,'lib','prototype.js'), File.join(SCRIPTY2_DEBUG_DIR,'prototype.js')
+  cp File.join(SCRIPTY2_ROOT,'lib','prototype.js'), File.join(SCRIPTY2_DIST_DIR,'prototype.js')
 end
 
 def minify(src, target)

src/css.js

@@ -201,7 +201,10 @@ S2.CSS = {
    *      S2.CSS.interpolateLength('10%','30%',0.7) -> '24%'
   **/
   interpolateLength: function(from, to, position){
-    if(!from || parseFloat(from)===0) from = '0'+to.gsub(S2.CSS.NUMBER,'');
+    // Firefox will give '0pt' for a computed '0' value. Ensure units match.
+    if (!from || parseFloat(from) === 0) {
+      from = '0' + to.gsub(S2.CSS.NUMBER,'');
+    }
     to.scan(S2.CSS.NUMBER, function(match){ to = 1*(match[1]); });
     return from.gsub(S2.CSS.NUMBER, function(match){
       return (1*(parseFloat(match[1]).tween(to, position).toFixed(3))).toString();

src/effects.js

@@ -7,6 +7,7 @@
 //= require "effects/morph"
 //= require "effects/parallel"
 //= require "effects/scroll"
+//= require "effects/slide"
 
 //= require "effects/transitions/transitions"
 //= require "effects/webkit"

src/effects/slide.js

@@ -0,0 +1,66 @@
+
+
+S2.FX.SlideDown = Class.create(S2.FX.Element, {
+  setup: function() {
+    var element = this.destinationElement || this.element;
+    var layout = element.getLayout();
+
+    var style = {
+      height:        layout.get('height') + 'px',
+      paddingTop:    layout.get('padding-top') + 'px',
+      paddingBottom: layout.get('padding-bottom') + 'px'
+    };
+
+    element.setStyle({
+      height:         '0',
+      paddingTop:     '0',
+      paddingBottom:  '0',
+      overflow:       'hidden'
+    }).show();
+
+    this.animate('style', element, {
+      style: style,
+      propertyTransitions: {}
+    });
+  },
+
+  teardown: function() {
+    var element = this.destinationElement || this.element;    
+    element.setStyle({
+      height:         '',
+      paddingTop:     '',
+      paddingBottom:  '',
+      overflow:       'visible'
+    });
+  }
+});
+
+S2.FX.SlideUp = Class.create(S2.FX.Morph, {
+  setup: function() {
+    var element = this.destinationElement || this.element;
+    var layout = element.getLayout();
+
+    var style = {
+      height:        '0px',
+      paddingTop:    '0px',
+      paddingBottom: '0px'
+    };
+
+    element.setStyle({ overflow: 'hidden' });
+
+    this.animate('style', element, {
+      style: style,
+      propertyTransitions: {}
+    });
+  },
+
+  teardown: function() {
+    var element = this.destinationElement || this.element;    
+    element.setStyle({
+      height:         '',
+      paddingTop:     '',
+      paddingBottom:  '',
+      overflow:       'visible'
+    }).hide();
+  }
+});

src/extensions/misc.js

@@ -26,14 +26,21 @@
  *      logOptions(1,2,3, {hello: "world"}) -> logs 3
 **/
 Function.prototype.optionize = function(){
-  var self = this, argumentNames = self.argumentNames(), optionIndex = argumentNames.length - 1, 
-    method = function(){
-    var args = $A(arguments), options = typeof args.last() == 'object' ? args.pop() : {},
-      prefilledArgs = (optionIndex == 0 ? [] : 
-        ((args.length > 0 ? args : [null]).inGroupsOf(optionIndex).flatten())).concat(options);
-    return self.apply(this, prefilledArgs);
+  var self = this, argumentNames = self.argumentNames(), optionIndex = this.length - 1;
+
+  var method = function() {
+    var args = $A(arguments);
+
+    var options = (typeof args.last() === 'object') ? args.pop() : {};
+    var prefilledArgs = [];
+    if (optionIndex > 0) {
+      prefilledArgs = ((args.length > 0 ? args : [null]).inGroupsOf(
+       optionIndex).flatten()).concat(options);
+    }
+
+    return self.apply(this, prefilledArgs);    
   };
-  method.argumentNames = function(){ return argumentNames };
+  method.argumentNames = function() { return argumentNames; };
   return method;
 };
 
@@ -42,21 +49,57 @@ Function.prototype.optionize = function(){
  *  
  *  Extensions to the built-in `Number` object.
 **/
-
-/**
- *  Number#tween(target, position) -> Number
- *  - target (Number): tween target
- *  - position (Number): position between 0 (start of tween) and (end of tween); can also be < 0 and > 1.
- *
- *  Returns the number that is a given percentage between this number and a target number.
- *
- *      (1).tween(2, 0.5) -> 1.5
- *      (1).tween(2, 0) -> 1
- *      (1).tween(2, 1) -> 2
-**/
-Number.prototype.tween = function(target, position){
-  return this + (target-this) * position;
-};
+Object.extend(Number.prototype, {
+  /**
+   *  Number#constrain(min, max) -> Number
+   *  
+   *  Returns `min` if number is less than `min`, `max` if number is greater
+   *  than `max`. Returns itself otherwise.
+  **/
+  constrain: function(n1, n2) {
+    var min = (n1 < n2) ? n1 : n2;
+    var max = (n1 < n2) ? n2 : n1;
+
+    var num = Number(this);
+
+    if (num < min) num = min;
+    if (num > max) num = max;
+
+    return num;
+  },
+
+  /**
+   *  Number#nearer(n1, n2) -> Number
+   *  
+   *  Returns either `n1` or `n2` — whichever is closer to the number, in
+   *  absolute terms.
+  **/
+  nearer: function(n1, n2) {
+    var num = Number(this);
+
+    var diff1 = Math.abs(num - n1);
+    var diff2 = Math.abs(num - n2);
+
+    return (diff1 < diff2) ? n1 : n2;
+  },
+
+  /**
+   *  Number#tween(target, position) -> Number
+   *  - target (Number): tween target
+   *  - position (Number): position between 0 (start of tween) and (end of
+   *    tween); can also be < 0 and > 1.
+   *
+   *  Returns the number that is a given percentage between this number and
+   *  a target number.
+   *
+   *      (1).tween(2, 0.5) -> 1.5
+   *      (1).tween(2, 0) -> 1
+   *      (1).tween(2, 1) -> 2
+  **/
+  tween: function(target, position) {
+    return this + (target-this) * position;
+  }
+});
 
 /** section: scripty2 core
  * class Object