sproutcore 1.5.0-java → 1.6.0.beta.2-java

data/lib/frameworks/sproutcore/frameworks/core_foundation/controllers/object.js

@@ -18,15 +18,15 @@ sc_require('controllers/controller') ;
   object controller one time for all of your views and then swap out the 
   content as needed.
   
-  h2. Working with Arrays
+  ## Working with Arrays
   
   An ObjectController can accept both arrays and single objects as content.  
   If the content is an array, the ObjectController will do its best to treat 
   the array as a single object.  For example, if you set the content of an
   ObjectController to an array of Contact records and then call:
   
-    contactController.get('name');
-    
+      contactController.get('name');
+
   The controller will check the name property of each Contact in the array.  
   If the value of the property for each Contact is the same, that value will 
   be returned.  If the any values are different, then an array will be 
@@ -41,7 +41,7 @@ sc_require('controllers/controller') ;
   setup your bindings so that they will convert the content to a single object 
   like so:
   
-    contentBinding: SC.Binding.single('MyApp.listController.selection') ;
+      contentBinding: SC.Binding.single('MyApp.listController.selection') ;
 
   This will ensure that your content property is always a single object 
   instead of an array.

data/lib/frameworks/sproutcore/frameworks/core_foundation/controls/button.js

@@ -0,0 +1,49 @@
+sc_require('views/template');
+
+SC.Button = SC.TemplateView.extend({
+  classNames: ['sc-button'],
+
+  // Setting isActive to true will trigger the classBinding and add
+  // 'is-active' to our layer's class names.
+  mouseDown: function() {
+    this.set('isActive', true);
+    this._isMouseDown = YES;
+  },
+
+  mouseExited: function() {
+    this.set('isActive', false);
+  },
+
+  mouseEntered: function() {
+    if (this._isMouseDown) {
+      this.set('isActive', true);
+    }
+  },
+
+  // Setting isActive to false will remove 'is-active' from our
+  // layer's class names.
+  mouseUp: function(event) {
+    if (this.get('isActive')) {
+      var action = this.get('action'),
+          target = this.get('target') || null,
+          rootResponder = this.getPath('pane.rootResponder');
+
+      if (action && rootResponder) {
+        rootResponder.sendAction(action, target, this, this.get('pane'), null, this);
+      }
+
+      this.set('isActive', false);
+    }
+
+    this._isMouseDown = NO;
+  },
+
+  touchStart: function(touch) {
+    this.mouseDown(touch);
+  },
+
+  touchEnd: function(touch) {
+    this.mouseUp(touch);
+  }
+});
+

data/lib/frameworks/sproutcore/frameworks/core_foundation/ext/handlebars/collection.js

@@ -1,9 +1,12 @@
+/*globals Handlebars */
+
 sc_require('ext/handlebars');
 
 Handlebars.registerHelper('collection', function(path, options) {
   var fn = options.fn;
   var data = options.data;
   var inverse = options.inverse;
+  var hash = options.hash;
   var collectionClass, collectionObject;
 
   collectionClass = path ? SC.objectForPropertyPath(path) : SC.TemplateCollectionView;
@@ -13,34 +16,33 @@ Handlebars.registerHelper('collection', function(path, options) {
   }
   //@ endif
 
-  var hash = fn.hash, itemHash = {}, match;
+  var extensions = {};
+
+  if (hash) {
+    var itemHash = {}, match;
 
-  for (var prop in hash) {
-    if (fn.hash.hasOwnProperty(prop)) {
-      match = prop.match(/^item(.)(.*)$/);
+    for (var prop in hash) {
+      if (hash.hasOwnProperty(prop)) {
+        match = prop.match(/^item(.)(.*)$/);
 
-      if(match) {
-        itemHash[match[1].toLowerCase() + match[2]] = hash[prop];
-        delete hash[prop];
+        if(match) {
+          itemHash[match[1].toLowerCase() + match[2]] = hash[prop];
+          delete hash[prop];
+        }
       }
     }
-  }
 
-  if(fn) {
-    var extensions = SC.clone(hash);
+    extensions = SC.clone(hash);
+    extensions.itemViewOptions = itemHash;
+  }
 
-    SC.mixin(extensions, {
-      itemViewTemplate: fn,
-      inverseTemplate: inverse,
-      itemViewOptions: itemHash
-    });
+  if (fn) { extensions.itemViewTemplate = fn; }
+  if (inverse) { extensions.inverseTemplate = inverse; }
 
-    if(collectionClass.isClass) {
-      collectionObject = collectionClass.extend(extensions);
-    } else {
-      SC.mixin(collectionClass, extensions);
-      collectionObject = collectionClass;
-    }
+  if(collectionClass.isClass) {
+    collectionObject = collectionClass.extend(extensions);
+  } else {
+    collectionObject = SC.mixin(collectionClass, extensions);
   }
 
   options.fn = function() { return ""; };

data/lib/frameworks/sproutcore/frameworks/core_foundation/mixins/delegate_support.js

@@ -18,7 +18,7 @@
   The methods provided by this mixin make it easier to implement this pattern
   but they are not required to support delegates.
 
-  h2. The Pattern
+  ## The Pattern
 
   The delegate design pattern typically means that you provide a property,
   usually ending in "delegate", that can be set to another object in the

data/lib/frameworks/sproutcore/frameworks/core_foundation/mixins/template_helpers/checkbox_support.js

@@ -4,9 +4,44 @@
 //            ©2008-2011 Apple Inc. All rights reserved.
 // License:   Licensed under MIT license (see license.js)
 // ==========================================================================
+
+sc_require('views/template');
+
 /** @class */
 
-SC.CheckboxSupport = /** @scope SC.CheckboxSupport.prototype */{
+SC.Checkbox = SC.TemplateView.extend(
+  /** @scope SC.Checkbox.prototype */ {
+
+  title: null,
+  value: null,
+
+  classNames: ['sc-checkbox'],
+  template: SC.Handlebars.compile('<label><input type="checkbox">{{title}}</label>'),
+
+  didCreateLayer: function() {
+    var self = this;
+
+    this.$('input').bind('change', function() {
+      self.domValueDidChange(this);
+    });
+  },
+
+  domValueDidChange: function(node) {
+    this.set('value', !!$(node).attr('checked'));
+  },
+
+  value: function(key, value) {
+    if (value !== undefined) {
+      this.$('input').attr('checked', value);
+    } else {
+      value = this.$('input').attr('checked');
+    }
+
+    return value;
+  }.property()
+});
+
+SC.CheckboxSupport = /** @scope SC.CheckboxSupport */{
   didCreateLayer: function() {
     this.$('input').change(jQuery.proxy(function() {
       SC.RunLoop.begin();

data/lib/frameworks/sproutcore/frameworks/core_foundation/mixins/template_helpers/text_field_support.js

@@ -4,23 +4,142 @@
 //            ©2008-2011 Apple Inc. All rights reserved.
 // License:   Licensed under MIT license (see license.js)
 // ==========================================================================
-/** @class
 
-*/
-SC.TextFieldSupport = /** @scope SC.TextFieldSupport.prototype */{
+sc_require('views/template');
+
+/** @class */
+
+SC.TextField = SC.TemplateView.extend(
+  /** @scope SC.TextField.prototype */ {
+
+  classNames: ['sc-text-field'],
+
+  // we can't use bindAttr because of a race condition:
+  //
+  // when `value` is set, the bindAttr observer immediately calls
+  // `get` in order to persist it to the DOM, but because we made
+  // the `value` property idempotent, when it gets called by
+  // bindAttr, it fetches the not-yet-updated value from the DOM
+  // and returns it.
+  //
+  // In short, because we need to be able to catch changes to the
+  // DOM made directly, we cannot also rely on bindAttr to update
+  // the property: a chicken-and-egg problem.
+  template: SC.Handlebars.compile('<input type="text">'),
+
+  didCreateLayer: function() {
+    var self = this;
+
+    var input = this.$('input');
+    input.val(this._value);
+
+    SC.Event.add(input, 'focus', this, this.focusIn);
+    SC.Event.add(input, 'blur', this, this.focusOut);
+
+    this.$('input').bind('change', function() {
+      self.domValueDidChange(SC.$(this));
+    });
+  },
+
+  /**
+    The problem this property is trying to solve is twofold:
+
+    1. Make it possible to set the value of a text field that has
+       not yet been inserted into the DOM
+    2. Make sure that `value` properly reflects changes made directly
+       to the element's `value` property.
+
+    In order to achieve (2), we need to make the property volatile,
+    so that SproutCore will call the getter no matter what if get()
+    is called.
+
+    In order to achieve (1), we need to store a local cache of the
+    value, so that SproutCore can set the proper value as soon as
+    the underlying DOM element is created.
+  */
+  value: function(key, value) {
+    var input = this.$('input');
+
+    if (value !== undefined) {
+      this._value = value;
+      input.val(value);
+    } else if (input.length) {
+      if(window.billy) { debugger; }
+      this._value = value = input.val();
+    } else {
+      if(window.billy) { debugger; }
+      value = this._value;
+    }
+
+    return value;
+  }.property().idempotent(),
+
+  domValueDidChange: function(jquery) {
+    this.set('value', jquery.val());
+  },
+
+  focusIn: function(event) {
+    this.becomeFirstResponder();
+    this.tryToPerform('focus', event);
+  },
+
+  focusOut: function(event) {
+    this.resignFirstResponder();
+    this.tryToPerform('blur', event);
+  },
+
+  willLoseFirstResponder: function() {
+    this.notifyPropertyChange('value');
+  },
+
+  keyUp: function(evt) {
+    this.domValueDidChange(this.$('input'));
+
+    if (evt.keyCode === 13) {
+      return this.insertNewline(evt);
+    } else if (evt.keyCode === 27) {
+      return this.cancel(evt);
+    }
+
+    return true;
+  }
+});
+
+SC.TextFieldSupport = /** @scope SC.TextFieldSupport */{
+
+  /** @private
+    Used internally to store value because the layer may not exist
+  */
+  _value: null,
+  
+  /**
+    @type String
+    @default null
+  */
   value: function(key, value) {
+    var input = this.$('input');
+
     if (value !== undefined) {
-      this.$('input').val(value);
+      this._value = value;
+      input.val(value);
     } else {
-      value = this.$('input').val();
+      if (input.length > 0) {
+        value = this._value = input.val();
+      } else {
+        value = this._value;
+      }
     }
 
     return value;
   }.property().idempotent(),
 
   didCreateLayer: function() {
-    SC.Event.add(this.$('input'), 'focus', this, this.focusIn);
-    SC.Event.add(this.$('input'), 'blur', this, this.focusOut);
+    var input = this.$('input');
+
+    input.val(this._value);
+
+    SC.Event.add(input, 'focus', this, this.focusIn);
+    SC.Event.add(input, 'blur', this, this.focusOut);
   },
 
   focusIn: function(event) {

data/lib/frameworks/sproutcore/frameworks/core_foundation/panes/pane.js

@@ -24,7 +24,7 @@ SC.MIXED_STATE = '__MIXED__' ;
   Usually you will not work directly with the SC.Pane class, but with one of
   its subclasses such as SC.MainPane, SC.Panel, or SC.PopupPane.
 
-  h1. Showing a Pane
+  ## Showing a Pane
 
   To make a pane visible, you need to add it to your HTML document.  The
   simplest way to do this is to call the append() method:
@@ -47,7 +47,7 @@ SC.MIXED_STATE = '__MIXED__' ;
   resize with the window if needed, relaying resize notifications to children
   as well.
 
-  h1. Hiding a Pane
+  ## Hiding a Pane
 
   When you are finished with a pane, you can hide the pane by calling the
   remove() method.  This method will actually remove the Pane from the
@@ -61,7 +61,7 @@ SC.MIXED_STATE = '__MIXED__' ;
   You can readd a pane to the document again any time in the future by using
   any of the insertion methods defined in the previous section.
 
-  h1. Receiving Events
+  ## Receiving Events
 
   Your pane and its child views will automatically receive any mouse or touch
   events as long as it is on the screen.  To receive keyboard events, however,

data/lib/frameworks/sproutcore/frameworks/core_foundation/panes/template.js

@@ -16,7 +16,19 @@
     })
   }
 */
-SC.TemplatePane = SC.Object.extend({});
+SC.TemplatePane = SC.Object.extend({
+  touchStart: function(touch) {
+    touch.allowDefault();
+  },
+
+  touchesDragged: function(evt, touches) {
+    evt.allowDefault();
+  },
+
+  touchEnd: function(touch) {
+    touch.allowDefault();
+  }
+});
 
 SC.mixin(SC.TemplatePane, {
   append: function(attrs) {

data/lib/frameworks/sproutcore/frameworks/core_foundation/system/device.js

@@ -19,11 +19,11 @@ SC.NO_ORIENTATION = 'desktop'; // value 'desktop' for backwards compatibility
   orientation and if the device is offline, as well as observe when they change 
   state.
   
-  h1. Orientation
+  ## Orientation
   When a touch device changes orientation, the orientation property will be
   set accordingly which you can observe
   
-  h1. Offline support
+  ## Offline support
   In order to build a good offline-capable web application, you need to know 
   when your app has gone offline so you can for instance queue your server 
   requests for a later time or provide a specific UI/message.

data/lib/frameworks/sproutcore/frameworks/core_foundation/system/event.js

@@ -195,10 +195,10 @@ SC.mixin(SC.Event, /** @scope SC.Event */ {
     relevant event occurs on the named element.  This method supports a
     variety of handler types, depending on the kind of support you need.
     
-    h2. Simple Function Handlers
+    ## Simple Function Handlers
+
+        SC.Event.add(anElement, "click", myClickHandler) ;
     
-      SC.Event.add(anElement, "click", myClickHandler) ;
-      
     The most basic type of handler you can pass is a function.  This function
     will be executed everytime an event of the type you specify occurs on the
     named element.  You can optionally pass an additional context object which
@@ -209,24 +209,24 @@ SC.mixin(SC.Event, /** @scope SC.Event */ {
     
     The click handler for this method must have a method signature like:
     
-      function(event) { return YES|NO; }
-      
-    h2. Method Invocations
+        function(event) { return YES|NO; }
     
-      SC.Event.add(anElement, "click", myObject, myObject.aMethod) ;
-      
+    ## Method Invocations
+
+        SC.Event.add(anElement, "click", myObject, myObject.aMethod) ;
+
     Optionally you can specify a target object and a method on the object to 
     be invoked when the event occurs.  This will invoke the method function
     with the target object you pass as "this".  The method should have a 
     signature like:
     
-      function(event, targetElement) { return YES|NO; }
-      
+        function(event, targetElement) { return YES|NO; }
+
     Like function handlers, you can pass an additional context data paramater
     that will be included on the event in the event.data property.
-      
-    h2. Handler Return Values
     
+    ## Handler Return Values
+
     Both handler functions should return YES if you want the event to 
     continue to propagate and NO if you want it to stop.  Returning NO will
     both stop bubbling of the event and will prevent any default action 
@@ -234,7 +234,7 @@ SC.mixin(SC.Event, /** @scope SC.Event */ {
     by calling the stopPropagation() or preventDefault() methods on the event
     itself, returning YES from your method.
     
-    h2. Limitations
+    ## Limitations
     
     Although SproutCore's event implementation is based on jQuery, it is 
     much simpler in design.  Notably, it does not support namespaced events
@@ -315,7 +315,7 @@ SC.mixin(SC.Event, /** @scope SC.Event */ {
     and element, then all handlers for all events on that element will be
     removed.
     
-    h2. Limitations
+    ## Limitations
     
     Although SproutCore's event implementation is based on jQuery, it is 
     much simpler in design.  Notably, it does not support namespaced events
@@ -523,8 +523,8 @@ SC.mixin(SC.Event, /** @scope SC.Event */ {
     be the element the event occurred on, so you should always call this 
     method like:
     
-      SC.Event.handle.call(element, event) ;
-      
+        SC.Event.handle.call(element, event) ;
+
     Note that like other parts of this library, the handle function does not
     support namespaces.