appetizer-ui 0.7.1 → 0.8.0

data/lib/appetizer/ui/jasmine/js/backbone.modelbinding/radioButtonConventionBinding.spec.js

@@ -0,0 +1,41 @@
+describe("radio button convention binding", function(){
+  beforeEach(function(){
+    this.model = new AModel({
+      graduated: "maybe",
+      us_citizen: false
+    });
+    this.view = new AView({model: this.model});
+    this.view.render();
+  });
+
+  it("bind view changes to the model's field, by convention of id", function(){
+    var el = $(this.view.el).find("#graduated_no");
+    el.attr("checked", "checked");
+    el.trigger('change');
+    expect(this.model.get('graduated')).toEqual("no");
+  });
+
+  it("bind model field changes to the form input, by convention of id", function(){
+    this.model.set({graduated: "yes"});
+    var el = this.view.$("#graduated_yes");
+    var selected = el.attr("checked");
+
+    expect(selected).toBeTruthy();
+  });
+
+  it("binds the model's value to the form field on render (graduated)", function(){
+    var el = this.view.$("input[type=radio][name=graduated]:checked");
+    var selected = el.val();
+
+    expect(selected).toBe("maybe");
+  });
+
+  it("binds the model's value to the form field on render (us_citizen)", function(){
+    var el = this.view.$("#us_citizen_false");
+    expect(el.is(':checked')).toBe(true);
+  });
+
+  it("binds the view's value to the model, when there is no value in the model", function(){
+    expect(this.model.get("another_radio")).toBeTruthy();
+  });
+});

data/lib/appetizer/ui/jasmine/js/backbone.modelbinding/selectboxConventionBindings.spec.js

@@ -0,0 +1,60 @@
+describe("select element convention binding", function(){
+  beforeEach(function(){
+    this.model = new AModel({
+      name: "Ashelia Bailey", 
+      education: "graduate", 
+      age_level: 0,
+      graduated: "maybe",
+      us_citizen: false,
+      drivers_license: true,
+      motorcycle_license: false,
+      bio: "my baby girl",
+      operating_system: "non existent value"
+    });
+    this.view = new AView({model: this.model});
+    this.view.render();
+  });
+
+  it("bind view changes to the model's field, by convention of id", function(){
+    var el = this.view.$("#education");
+    el.val("college");
+    el.trigger('change');
+
+    expect(this.model.get('education')).toEqual("college");
+  });
+
+  it("bind model field changes to the form input, by convention of id", function(){
+    this.model.set({education: "high school"});
+    var el = this.view.$("#education");
+    expect(el.val()).toEqual("high school");
+  });
+
+  it("binds the model's value to the form field on render (education)", function(){
+    var el = this.view.$("#education");
+    expect(el.val()).toEqual("graduate");
+  });
+
+  it("binds the model's value to the form field on render (age_level)", function(){
+    var el = this.view.$("#age_level");
+    expect(el.val()).toEqual("0");
+  });
+
+  it("applies the text of the selection to the model", function(){
+    var el = this.view.$("#education");
+    el.val("grade_school");
+    el.trigger('change');
+
+    expect(this.model.get('education_text')).toEqual("i dun learned at grade skool");
+  });
+
+  it("updates the model to the selected value when the model is set to a value that doesn't exist, on render", function(){
+    var el = this.view.$("#operating_system");
+    var elVal = el.val();
+
+    expect(this.model.get('operating_system')).toEqual(elVal);
+  });
+
+  it("binds the select box value to the model, when there is no model value, on render", function(){
+    expect(this.model.get("another_select")).toEqual("pre_selected");
+  });
+});

data/lib/appetizer/ui/jasmine/js/backbone.modelbinding/textareaConventionBinding.spec.js

@@ -0,0 +1,29 @@
+describe("text area convention binding", function(){
+  beforeEach(function(){
+    this.model = new AModel({
+      bio: "my biography"
+    });
+    this.view = new AView({model: this.model});
+    this.view.render();
+  });
+
+  it("bind view changes to the model's field, by convention of id", function(){
+    var el = this.view.$("#bio");
+    el.val("my biography");
+    el.trigger('change');
+
+    expect(this.model.get('bio')).toEqual("my biography");
+  });
+
+  it("bind model field changes to the form input, by convention of id", function(){
+    this.model.set({bio: "a modified biogrpahy"});
+    var el = this.view.$("#bio");
+    expect(el.val()).toEqual("a modified biogrpahy");
+  });
+
+  it("binds the model's value to the form field on render", function(){
+    var el = this.view.$("#bio");
+    expect(el.val()).toEqual("my biography");
+  });
+
+});

data/lib/appetizer/ui/jasmine/js/backbone.modelbinding/textboxConventionBinding.spec.js

@@ -0,0 +1,66 @@
+describe("textbox convention bindings", function(){
+  beforeEach(function(){
+    this.model = new AModel({
+      name: "Ashelia Bailey", 
+      noType: 'there is no type'
+    });
+    this.view = new AView({model: this.model});
+  });
+
+  describe("text element binding", function(){
+    beforeEach(function(){
+      this.view.render();
+      this.el = this.view.$("#name");
+    });
+
+    it("bind view changes to the model's field, by convention of id", function(){
+      this.el.val("Derick Bailey");
+      this.el.trigger('change');
+
+      expect(this.model.get('name')).toEqual("Derick Bailey");
+    });
+
+    it("bind model field changes to the form input, by convention of id", function(){
+      this.model.set({name: "Ian Bailey"});
+      expect(this.el.val()).toEqual("Ian Bailey");
+    });
+
+    it("binds the model's value to the form field on render", function(){
+      expect(this.el.val()).toEqual("Ashelia Bailey");
+    });
+  });
+
+  describe("when the form field has a value but the model does not", function(){
+    beforeEach(function(){
+      this.view.render();
+      var el = this.view.$("#prefilled_name");
+    });
+
+    it("binds the form field's value to the model, on render", function(){
+      expect(this.model.get("prefilled_name")).toBe("a name");
+    });
+  });
+
+  describe("input with no type specified, binding", function(){
+    beforeEach(function(){
+      this.view.render();
+      this.el = this.view.$("#noType");
+    });
+
+    it("bind view changes to the model's field, by convention of id", function(){
+      this.el.val("something changed");
+      this.el.trigger('change');
+
+      expect(this.model.get('noType')).toEqual("something changed");
+    });
+
+    it("bind model field changes to the form input, by convention of id", function(){
+      this.model.set({noType: "Ian Bailey"});
+      expect(this.el.val()).toEqual("Ian Bailey");
+    });
+
+    it("binds the model's value to the form field on render", function(){
+      expect(this.el.val()).toEqual("there is no type");
+    });
+  });
+});

data/lib/appetizer/ui/jasmine/js/jasmine-jquery-matchers.js

@@ -1,7 +1,7 @@
 
 var sandbox = function() {
     if ($("#sandbox").length == 0)
-      $("<div id=sandbox class=hide></div>").appendTo($("body"));
+      $("<div id=sandbox></div>").appendTo($("body"));
     return $("#sandbox");
  }
 

data/lib/appetizer/ui/jasmine/js/spec-runner.coffee

@@ -1,6 +1,7 @@
 #= require ./jasmine
 #= require ./jasmine-html
 #= require ./jasmine-jquery-matchers
+#= require_tree ./backbone.modelbinding
 
 jasmineEnv = jasmine.getEnv()
 jasmineEnv.updateInterval = 1000

data/lib/appetizer/ui/vendor/js/backbone.modelbinding.js

@@ -1,5 +1,7 @@
 // Backbone.ModelBinding v0.4.3
 // [jbarnette] Added getAttributeValue, allowing values to come from functions.
+// [cmorse]    Added mediate support
+// [toots]     Added foo.bar.baz syntax for bound attributes
 //
 // Copyright (C)2011 Derick Bailey, Muted Solutions, LLC
 // Distributed Under MIT Liscene
@@ -29,14 +31,36 @@ var modelbinding = (function(Backbone, _, $) {
     }
   };
 
-  var getAttributeValue = function(model, name) {
+  // pop attribute name from model. It takes, in order
+  // of priority:
+  // model[name] if defined and not a function
+  // model[name]() if defined and a function
+  // model.get(name) otherwise
+  var popAttribute = function (model, name) {
     var value = model[name];
-
-    if (value && _.isFunction(value)) {
-      value = value.apply(model)
+    if (value) {
+      if (_.isFunction(value))
+        value = value.apply(model)
     } else {
-      value = model.get(name);
+      if (model.get) {
+        value = model.get(name);
+      } else {
+        return undefined;
+      }
     }
+    return value;
+  }
+
+  var getAttributeValue = function(model, name) {
+    var value = model;
+
+    name = "" + name;
+
+    names = name.split(".");
+    
+    _.each(names, function (name) { 
+      value = popAttribute(value, name);
+    });
 
     return value;
   };
@@ -195,13 +219,35 @@ var modelbinding = (function(Backbone, _, $) {
         var elementType = _getElementType(element);
         var attribute_name = config.getBindingValue(element, elementType);
         if (!attribute_name) return;
+        var mediator = modelBinding.getMediator(element);
 
-        var modelChange = function(changed_model, val){ element.val(val); };
+        var modelChange = function(changed_model, val) {
+          element.val(mediator.render(val));
+        };
+
+        var popData = function (options, name) {
+          var target;
+          if (target = options.model[name]) {
+            options.model = _.isFunction(target) ? target() : target
+          } else {
+            options.data[name] = options.model.get(name) || {};
+            options.data = options.data[name];
+          }
+        }
 
         var setModelValue = function(attr_name, value){
-          var data = {};
-          data[attr_name] = value;
-          model.set(data);
+          var origData = {};
+          var options = { data: origData, model: model };
+
+          attr_names = attr_name.split(".");
+          attr_name  = attr_names.pop();
+
+          _.each(attr_names, function (name) {
+            popData(options, name);
+          });
+
+          options.data[attr_name] = mediator.parse(value);
+          options.model.set(origData);
         };
 
         var elementChange = function(ev){
@@ -214,7 +260,7 @@ var modelbinding = (function(Backbone, _, $) {
         // set the default value on the form, from the model
         var attr_value = getAttributeValue(model, attribute_name);
         if (typeof attr_value !== "undefined" && attr_value !== null) {
-          element.val(attr_value);
+          element.val(mediator.render(attr_value));
         } else {
           var elVal = element.val();
           if (elVal){
@@ -440,6 +486,7 @@ var modelbinding = (function(Backbone, _, $) {
     var setOnElement = function(element, attr, val){
       var valBefore = val;
       val = modelBinding.Configuration.getDataBindSubst(attr, val);
+      val = modelBinding.getMediator(element).render(val);
       switch(attr){
         case "html":
           element.html(val);
@@ -513,6 +560,7 @@ var modelbinding = (function(Backbone, _, $) {
         _.each(databindList, function(databind){
           var eventConfig = getEventConfiguration(element, databind);
           modelBinder.registerDataBinding(model, eventConfig.name, eventConfig.callback);
+
           // set default on data-bind element
           setOnElement(element, databind.elementAttr, getAttributeValue(model, databind.modelAttr));
         });
@@ -544,6 +592,16 @@ var modelbinding = (function(Backbone, _, $) {
     email: {selector: "input[type=email]", handler: StandardBinding}
   };
 
+  modelBinding.Mediators = {}
+
+  modelBinding.getMediator = function(element) {
+    var mediator = modelBinding.Mediators[$(element).attr("data-mediator")] || {};
+
+    mediator.parse = mediator.parse || function(t) { return t; }
+    mediator.render = mediator.render || function(t) { return t; }
+    return mediator;
+  }
+  
   return modelBinding;
 });
 

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: appetizer-ui
 version: !ruby/object:Gem::Version
-  version: 0.7.1
+  version: 0.8.0
   prerelease: 
 platform: ruby
 authors:
@@ -9,11 +9,11 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2012-01-27 00:00:00.000000000Z
+date: 2012-02-11 00:00:00.000000000Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: appetizer
-  requirement: &70317561442100 !ruby/object:Gem::Requirement
+  requirement: &70341507624460 !ruby/object:Gem::Requirement
     none: false
     requirements:
     - - ~>
@@ -21,10 +21,10 @@ dependencies:
         version: '0.0'
   type: :runtime
   prerelease: false
-  version_requirements: *70317561442100
+  version_requirements: *70341507624460
 - !ruby/object:Gem::Dependency
   name: coffee-script
-  requirement: &70317561739000 !ruby/object:Gem::Requirement
+  requirement: &70341507623380 !ruby/object:Gem::Requirement
     none: false
     requirements:
     - - ~>
@@ -32,10 +32,10 @@ dependencies:
         version: '2.2'
   type: :runtime
   prerelease: false
-  version_requirements: *70317561739000
+  version_requirements: *70341507623380
 - !ruby/object:Gem::Dependency
   name: eco
-  requirement: &70317561932360 !ruby/object:Gem::Requirement
+  requirement: &70341507622620 !ruby/object:Gem::Requirement
     none: false
     requirements:
     - - ~>
@@ -43,10 +43,10 @@ dependencies:
         version: '1.0'
   type: :runtime
   prerelease: false
-  version_requirements: *70317561932360
+  version_requirements: *70341507622620
 - !ruby/object:Gem::Dependency
   name: rack-contrib
-  requirement: &70317565973760 !ruby/object:Gem::Requirement
+  requirement: &70341507621760 !ruby/object:Gem::Requirement
     none: false
     requirements:
     - - ~>
@@ -54,10 +54,10 @@ dependencies:
         version: '1.1'
   type: :runtime
   prerelease: false
-  version_requirements: *70317565973760
+  version_requirements: *70341507621760
 - !ruby/object:Gem::Dependency
   name: rack-ssl
-  requirement: &70317566240660 !ruby/object:Gem::Requirement
+  requirement: &70341507620920 !ruby/object:Gem::Requirement
     none: false
     requirements:
     - - ~>
@@ -65,10 +65,10 @@ dependencies:
         version: '1.3'
   type: :runtime
   prerelease: false
-  version_requirements: *70317566240660
+  version_requirements: *70341507620920
 - !ruby/object:Gem::Dependency
   name: sass
-  requirement: &70317566239800 !ruby/object:Gem::Requirement
+  requirement: &70341507620120 !ruby/object:Gem::Requirement
     none: false
     requirements:
     - - ~>
@@ -76,10 +76,10 @@ dependencies:
         version: '3.1'
   type: :runtime
   prerelease: false
-  version_requirements: *70317566239800
+  version_requirements: *70341507620120
 - !ruby/object:Gem::Dependency
   name: sinatra
-  requirement: &70317566239140 !ruby/object:Gem::Requirement
+  requirement: &70341507619240 !ruby/object:Gem::Requirement
     none: false
     requirements:
     - - ~>
@@ -87,10 +87,10 @@ dependencies:
         version: '1.3'
   type: :runtime
   prerelease: false
-  version_requirements: *70317566239140
+  version_requirements: *70341507619240
 - !ruby/object:Gem::Dependency
   name: sprockets
-  requirement: &70317566238380 !ruby/object:Gem::Requirement
+  requirement: &70341507618520 !ruby/object:Gem::Requirement
     none: false
     requirements:
     - - ~>
@@ -98,10 +98,10 @@ dependencies:
         version: '2.1'
   type: :runtime
   prerelease: false
-  version_requirements: *70317566238380
+  version_requirements: *70341507618520
 - !ruby/object:Gem::Dependency
   name: sprockets-sass
-  requirement: &70317566237600 !ruby/object:Gem::Requirement
+  requirement: &70341507617060 !ruby/object:Gem::Requirement
     none: false
     requirements:
     - - ~>
@@ -109,10 +109,10 @@ dependencies:
         version: '0.6'
   type: :runtime
   prerelease: false
-  version_requirements: *70317566237600
+  version_requirements: *70341507617060
 - !ruby/object:Gem::Dependency
   name: uglifier
-  requirement: &70317566236760 !ruby/object:Gem::Requirement
+  requirement: &70341507616160 !ruby/object:Gem::Requirement
     none: false
     requirements:
     - - ~>
@@ -120,10 +120,10 @@ dependencies:
         version: '1.0'
   type: :runtime
   prerelease: false
-  version_requirements: *70317566236760
+  version_requirements: *70341507616160
 - !ruby/object:Gem::Dependency
   name: yajl-ruby
-  requirement: &70317566235940 !ruby/object:Gem::Requirement
+  requirement: &70341507615220 !ruby/object:Gem::Requirement
     none: false
     requirements:
     - - ~>
@@ -131,10 +131,10 @@ dependencies:
         version: '1.0'
   type: :runtime
   prerelease: false
-  version_requirements: *70317566235940
+  version_requirements: *70341507615220
 - !ruby/object:Gem::Dependency
   name: yui-compressor
-  requirement: &70317566235180 !ruby/object:Gem::Requirement
+  requirement: &70341507613700 !ruby/object:Gem::Requirement
     none: false
     requirements:
     - - ~>
@@ -142,7 +142,7 @@ dependencies:
         version: '0.9'
   type: :runtime
   prerelease: false
-  version_requirements: *70317566235180
+  version_requirements: *70341507613700
 description: A painfully opinionated Appetizer extension for web apps.
 email:
 - tech@audiosocket.com
@@ -166,6 +166,25 @@ files:
 - lib/appetizer/ui/assets.rb
 - lib/appetizer/ui/assets/delivery.rb
 - lib/appetizer/ui/jasmine/css/jasmine.css
+- lib/appetizer/ui/jasmine/js/backbone.modelbinding/appetizerExtensions.spec.js
+- lib/appetizer/ui/jasmine/js/backbone.modelbinding/checkboxConventionBindings.spec.js
+- lib/appetizer/ui/jasmine/js/backbone.modelbinding/configurableBindingAttributes.spec.js
+- lib/appetizer/ui/jasmine/js/backbone.modelbinding/configureAllBindingAttributes.spec.js
+- lib/appetizer/ui/jasmine/js/backbone.modelbinding/customConvention.spec.js
+- lib/appetizer/ui/jasmine/js/backbone.modelbinding/dataBindConvention.spec.js
+- lib/appetizer/ui/jasmine/js/backbone.modelbinding/dataBindMultiple.spec.js
+- lib/appetizer/ui/jasmine/js/backbone.modelbinding/dataBindSubstitutions.spec.js
+- lib/appetizer/ui/jasmine/js/backbone.modelbinding/globalConfiguraAllBindingAttributes.spec.js
+- lib/appetizer/ui/jasmine/js/backbone.modelbinding/globalConfigurableBindingAttributes.spec.js
+- lib/appetizer/ui/jasmine/js/backbone.modelbinding/helpers/SpecHelper.js
+- lib/appetizer/ui/jasmine/js/backbone.modelbinding/helpers/sample.backbone.app.js
+- lib/appetizer/ui/jasmine/js/backbone.modelbinding/html5inputConventionBinding.spec.js
+- lib/appetizer/ui/jasmine/js/backbone.modelbinding/modelUnbinding.spec.js
+- lib/appetizer/ui/jasmine/js/backbone.modelbinding/noConflict.spec.js
+- lib/appetizer/ui/jasmine/js/backbone.modelbinding/radioButtonConventionBinding.spec.js
+- lib/appetizer/ui/jasmine/js/backbone.modelbinding/selectboxConventionBindings.spec.js
+- lib/appetizer/ui/jasmine/js/backbone.modelbinding/textareaConventionBinding.spec.js
+- lib/appetizer/ui/jasmine/js/backbone.modelbinding/textboxConventionBinding.spec.js
 - lib/appetizer/ui/jasmine/js/jasmine-html.js
 - lib/appetizer/ui/jasmine/js/jasmine-jquery-matchers.js
 - lib/appetizer/ui/jasmine/js/jasmine.js