Ember Latest

The latest build of Ember.

by Kevin Jhangiani

HTML

<script src="http://builds.emberjs.com/handlebars-1.0.0.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-mockjax/1.5.2/jquery.mockjax.js"></script>
<script src="http://builds.emberjs.com/tags/v1.7.1/ember.js"></script>
<script src="http://builds.emberjs.com/tags/v1.7.1/ember-template-compiler.js"></script>
<script src="http://builds.emberjs.com/tags/v1.0.0-beta.11/ember-data.js"></script>
<script type="text/x-handlebars" data-template-name="application">
    <h1>Ember Data Parent/Child Render</h1>
    {{#link-to 'parent_model' 1}}Parent 1{{/link-to}}
    {{outlet}}
</script>
<script type="text/x-handlebars" data-template-name="parent_model">
  <h2>Parent Model</h2>
  <h3>name: {{model.name}}</h3>
  <p>
      <a {{action 'saveParent' on='click'}}>click here to save</a>
  </p>
  <ul>
  {{#each child in model.children}}
      {{render "childModel" child}}
  {{/each}}
   </ul>
</script>

<script type="text/x-handlebars" data-template-name="child_model">
  <li>
      <h2>Child Template - {{child.name}}</h2>
      <a {{action 'toggleExpand' on='click'}}>click here to expandddddd</a>
      {{#if isExpanded}}
          <div style="height: 200px; background: red;">
              this is the expanded part of the child
          </div>
      {{/if}}
    
  </li>
</script>

CSS

h1 { font-size: 1.6em; padding-bottom: 10px; }
h2 { font-size: 1.4em; }
ul { padding: 15px; font-size: 1.4em; color: green; }

JavaScript

/* packages/mixins/lib/embedded_mixin.min.js */
!function(e,t){function i(e){return e&&("always"===e.embedded||"load"===e.embedded)}function r(e){return e&&"ids"===e.embedded}function a(e,t){var i=e+"_id";t.hasOwnProperty(i)&&delete t[i]}function n(e,t,r,a){var n=l(this,"attrs");n&&t.eachRelationship(function(t,l){var o=n[t];i(o)&&("hasMany"===l.kind&&s.call(this,e,t,l,r,a),"belongsTo"===l.kind&&y.call(this,e,t,l,r,a))},this)}function s(t,i,r,a,s){var y=t.serializerFor(r.type.typeKey),u=l(this,"primaryKey"),p=r.type.typeKey,h="_"+e.String.pluralize(p),d=this.keyForRelationship(i,r.kind),c=this.keyForAttribute(i),f=[];s[c]&&(a[h]=a[h]||[],o(s[c],function(e){var i=t.modelFor(p);n.call(y,t,i,a,e),f.push(e[u]),a[h].push(e)}),s[d]=f,delete s[c])}function y(t,r,a,s,y){var o=this.get("attrs");if(o&&(i(o[e.String.camelize(r)])||i(o[r]))){var u=a.type.typeKey,p=t.serializerFor(a.type.typeKey),h=(l(p,"primaryKey"),e.String.pluralize(u)),d=p.keyForRelationship(r,a.kind),c=p.keyForAttribute(r);if(y[c]){s[h]=s[h]||[];var f=t.modelFor(a.type.typeKey);for(var v in y)y.hasOwnProperty(v)&&v.camelize()===u&&n.call(p,t,f,s,y[v]);y[d]=y[c].id,s[h].push(y[c]),y[c][a.parentType.typeKey+"_id"]=y.id,delete y[c]}}}var l=e.get,o=e.EnumerableUtils.forEach;t.EmbeddedMixin=e.Mixin.create({serializeBelongsTo:function(e,t,r){var n=r.key,s=this.get("attrs");if(!s||!i(s[n]))return void this._super(e,t,r);var y=this.keyForAttribute(n),l=e.get(n);if(l){t[y]=l.serialize();var o=l.get("id");o&&(t[y].id=o);var u=this.keyForAttribute(r.parentType.typeKey);u&&a(u,t[y]),delete t[y][u]}else t[y]=null},serializeHasMany:function(e,t,a){var n,s=a.key,y=this.get("attrs");return y&&(i(y[s])||r(y[s]))?void(r(y[s])?(n=this.keyForRelationship(s,a.kind),t[n]=l(e,s).mapBy(l(this,"primaryKey"))):(n=this.keyForAttribute(s),t[n]=l(e,s).map(function(e){var t=e.serialize(),i=l(this,"primaryKey");return t[i]=l(e,i),null===t.id&&delete t.id,t},this))):void this._super(e,t,a)},extractSingle:function(e,t,i,r,a){var...