Ember Js

by Suchit Puri




MVC Code Structure

Models

Storm.NewProperty = Ember.Object.extend({
  building_name:"",
  estate_name: "",
  street_number_high: "",
  street_number_low: "",
  unit_number:"",
  level_number:"",
  street_name: "",
  state: Storm.Options.state_names.content[0].abbreviation,
  suburb: "",
  formatted_address: function(){
   return //do something on existing properties and compute a new one  }.property('street_number_high','street_number_low')
});

Views

Storm.TextField = Ember.View.extend( Storm.AsyncValidation,  {    className: "span4",
    classNames: "control-group",
    type: 'text',
    value: "",
    maxlength:"255",
    placeholder: "",
    code: '',
    appended_text: null,
    classNameBindings: ['code'],
    message: "",
    templateName: "inputs/text-field"
});

Controller

Storm.AccessController=Ember.ObjectController.extend(Storm.EnquiryHelper,{
contact_type_options: Storm.Options.contact_type, update_enquiry_details: function(enquiry){ }, validation_check: function(){ if(Ember.isEmpty(this.get('contact_name'))) { var element = $('.validation-check'); element.trigger(Storm.validInputEvent(element.attr("id"))); $('.validation-check .close_button').trigger('click'); } }.observes('contact_name') });

Templates

 partial "inputs/error_message"
.span12.search-box.asset-box
  Storm.AssetSearchBox classNames="span12 asset-search-field"
  table.table.table-hover.table-condensed.hidden.asset_search_result.search-result
    tbody
      each result in view.asset_search_results
        Storm.AssetSearchResultView contentBinding='result'
      else
        tr
          td No results found ...




INTERESTING features




Computed properties




Observers




Simple INHERITANCE





Mixins




Convention Over Configuration

Just like Rails




Powerful Router




Models with pluggable backend




Lessons Learnt so far




Neat and organized code




Reusability is built-in





Two way binding is effortless




Very Easy to Test

integrates seamlessly with jasmine




Seamless rails integration




Learning Curve is a bit steep




Jquery plugins needs to be emberized



Community is small , but its growing fast 

Ember Js

By Suchit Puri

Ember Js

Suchit Puri

  • 2,323