background preloader

Ember/js

Facebook Twitter

EPF: Ember.js Persistence Foundation. Heretical Guide To Ember JS. I've written a new ebook.

Heretical Guide To Ember JS

It provides a detailed introduction to Ember.js. One enormous caveat: it doesn't deal with the data layer at all. I think this is fine, because Ember Data hasn't gotten near 1.0 yet, and Discourse and some other Ember projects roll their own data layers anyway. Nonetheless, my new book's 108 pages long, with extensive code samples, because there's a lot of other material in Ember to cover. The book covers a few different Ember "hello world" implementations, then shows you how to build a trivial GitHub notifications API reader, and then walks you through building a complete chess game, with HTML5 drag and drop, and similar user interface flourishes. Billysbilling/ember-animated-outlet. Emberjs-addons/ember-touch. Emberjs-touch/lib/ember-fastclick.js at master · JamesHight/emberjs-touch.

Emberjs-addons/ember-bootstrap. Understanding Ember.Object. Almost every object in Ember.js is derived from a common object: Ember.Object.

Understanding Ember.Object

This object is used as the basis for views, controllers, models, and even the application itself. This simple architectural decision is responsible for much of the consistency across Ember. Because every object has been derived from the same core object, they all share some core capabilities. Every Ember object can observe the properties of other objects, bind their properties to the properties of other objects, specify and update computed properties, and much more. As you'll see in this post, it's easy to get started with Ember.Object, but also easy to overlook some of its capabilities. Creating objects. A Javascript library that makes working with the HTML5 Canvas element easy.

Recent Updates Follow @CreateJS November 2014 Updates in preparation for next release (coming soon).New class model, with big performance increases October 2014 Lots of bug fixes and pull requests.New 'Extras' folder in GitHub with useful tools and classes July 2014 Major overhaul of Graphics to include a useful command pattern, and a big performance increase.Added Graphics.store() / unstore() The Story Why we built EaselJS About EaselJS EaselJS provides straight forward solutions for working with rich graphics and interactivity with HTML5 Canvas.

Featured Projects. Codegram/ember-forms. Searching for Ember.js » Balanced: Blog. Last week, we shared some thoughts on basic Ember.js concepts.

Searching for Ember.js » Balanced: Blog

To continue digging into Ember.js, we wanted to walk through how we built the search system in Balanced’s dashboard. This should help illustrate our design and development process. More specifically, we’ll dive into how to construct models, choosing the right Ember.js components, and developing reusable widgets. Design We started out with an open discussion on GitHub of how search should work and what data it should return. If you browse the thread, you’ll see the high level of detail our designer Damon gave us including font sizing, column layouts, opacity, and rollover behavior. Data Model We started out by creating types for the data that needed to be returned in search results. The tough decision was choosing how to perform search queries themselves. Write a custom AJAX query and parse the data when it returns Treat a search query as a model object We tried both and opted for the second option.

User Interface Testing. List-view by emberjs. An efficient incremental rendering list view for large lists.

List-view by emberjs

Ember.ListView works on mobile phones that support web overflow touch css, doesn't work on iOS because iOS doesn't emit scroll events during the momentum phase of a scroll nor do the elements know there offset top during that scroll phase. Dependencies You will need to include jquery, handlebars, ember.js and list view extension. Usage First, let's create a template: <script type="text/x-handlebars" data-template-name="index"> {{#collection Ember.ListView contentBinding="controller" height=500 rowHeight=50 width=500}} {{name}} {{/collection}}</script> Next, let's feed our template with some data: Shazam!

Virtual List View Item 0 Item 1 Item 2 Item 3 Item 4 Item 5 Item 6 Item 7 Item 8. Ember Table by Addepar. Tree Table Sort, freeze, resize, and rearrange columns.

Ember Table by Addepar

Collapse and select rows. Freeze headers and footers. Navigate with keyboard. Table With Lots of Rows Lazy rendering means huge tables stay incredibly fast. Editable Table Cells It is easy to add custom content to cells. Table with Bar Charts Table with D3 Sparkline Inspired by example from Edward Tufte's book Beautiful Evidence. Table with D3 Horizon Table with Ajax Loading Github events using Ajax! Getting Started Compile with grunt : $ npm install -g grunt $ npm install $ grunt $ python -m SimpleHTTPServer Dependencies Future Work Bug fixes - we are aware that there are bugs. Authors & Contributors ppong , ldevalliere and sherb. Searching for Ember.js » Balanced: Blog. Ember.js - Iterating over a model's attributes in EmberJS handlebars template.