{"id":1377,"date":"2012-01-01T17:59:14","date_gmt":"2012-01-01T23:59:14","guid":{"rendered":"http:\/\/www.wiredprairie.us\/blog\/?p=1377"},"modified":"2012-01-04T19:56:47","modified_gmt":"2012-01-05T01:56:47","slug":"ezdata-for-ember-js","status":"publish","type":"post","link":"https:\/\/www.wiredprairie.us\/blog\/index.php\/archives\/1377","title":{"rendered":"EzData for Ember.js"},"content":{"rendered":"

Previous post: Entity reference<\/a><\/p>\n

I\u2019ve been extending my original post (above) in an effort to create a simple entity system using Ember.js<\/a> (SproutCore 2.0). While it\u2019s grown in sophistication, it is far from complete. \"Smile\"<\/p>\n

The project is now located on GitHub<\/a>.<\/p>\n

This is the introduction, from the readme on GitHub.<\/p>\n

EmberJS – EZData<\/h3>\n

EZData is a library intended to a simple way of accessing data from a relational database when using Ember.js<\/a>. It will never try to be everything to everyone. :) Instead, it’s intended to be small, efficient, and easy to learn and use javascript library.<\/p>\n

The basic functionality is that it’s designed to manipulate individual entities (or Records), not a complex object structure that is often stored as JavaScript objects. This mirrors what’s found in many web systems today in the data model.<\/p>\n

Right now, the project is brand new and quite in flux.<\/p>\n

Essentials<\/h4>\n

Create types by calling Entity.define<\/code> (instead of the typical Ember.Object.extend).<\/p>\n

DemoApp.Person = Entity.define(Entity, "Person", {\n    firstName:String,\n    lastName:String,\n    DOB:Date,\n\n    fullName:function () {\n        return this.get('lastName') + ", " + this.get('firstName');\n    }.property('firstName', 'lastName')\n});<\/pre>\n

This will create a new Class internally by using Ember.extend<\/code> but it also does some other magic (e.g., creating a data store for all entities of a given type). First and foremost, by calling define<\/code>, it’s expected that you’re mirroring a relational data structure of some sort which may have foreign key relationships to other tables.<\/p>\n

In the example above, the Person<\/code> entity is expected to have the following columns in a database table:<\/p>\n

    \n
  • id => Number (from the basic Entity type) <\/li>\n
  • firstName => String <\/li>\n
  • lastName => String <\/li>\n
  • DOB => DOB<\/li>\n<\/ul>\n

    Each property is assigned the basic data type that it will contain. The data type is used for linking and serialization.<\/p>\n

    Linking<\/h4>\n

    The second example is a Gift<\/code>:<\/p>\n

    DemoApp.Gift = Entity.define(Entity, "Gift", {\n    from:DemoApp.Person\n});<\/pre>\n

    The Gift class is more interesting as one of the properties links to another type\/Class (Person). As a direct connection to a Person as an object instance isn’t possible in traditional relational tables, some automatic linking occurs by declaring this linkage.<\/p>\n

    The from<\/code> property is mapped to a second, hidden property that is only used for the foreign key relationship. By default, the hidden property will be calledfromPersonId<\/code>. This can be overridden by creating a custom naming function, replacing the default stored atEntity.Settings.FOREIGN_KEY_GENERATOR_FUNCTION<\/code>.<\/p>\n

    By making the linkage between the two types in the way demonstrated above, the standard Ember.js handlebar templating engine (and automatic value updating) features just work (see from.fullName<\/code> below).<\/p>\n

    {{#each gifts}}\n<tr>\n    <td>\n        {{ name }}\n    <\/td>\n    <td>\n        {{ excitement }}\n    <\/td>\n    <td>\n        {{ from.fullName }}\n    <\/td>\n<\/tr><\/pre>\n

    The fullName<\/code> property of Person is a computed property, and continues to work as expected.<\/p>\n

    Getting the Data<\/h4>\n

    If you want to retrieve a list from one of the data stores (or data tables), it’s a simple as calling the live<\/code> function for one of the stores.<\/p>\n

    In the example below, there are two live collections. The first returns all of the gifts, and the second only returns gifts that have a lowercase letter o<\/code> in the name.<\/p>\n

    \/\/ create some "live" connections to the data store\nDemoApp.mainController.set('gifts', Entity.Stores.get(DemoApp.Gift).live());\n\/\/ create a live connection with a filter (returns true if it contains the letter 'o')\nDemoApp.mainController.set('giftsFiltered', Entity.Stores.get(DemoApp.Gift).live(\n    function () {\n        return this.get('name').indexOf('o') > -1;\n    }));<\/pre>\n

    To get access to one of the automatically created data stores, call Entity.Stores.get({Class})<\/code> where {Class}<\/code> is the type that was created using thedefine<\/code> method.<\/p>\n

    Notes \/ Cautions<\/h4>\n

    Right now, all entities are required to have a property called id and be of type Number.<\/p>\n","protected":false},"excerpt":{"rendered":"

    Previous post: Entity reference I\u2019ve been extending my original post (above) in an effort to create a simple entity system using Ember.js (SproutCore 2.0). While it\u2019s grown in sophistication, it is far from complete. The project is now located on GitHub. This is the introduction, from the readme on GitHub. EmberJS – EZData EZData is […]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"spay_email":"","jetpack_publicize_message":"","jetpack_is_tweetstorm":false,"jetpack_publicize_feature_enabled":true},"categories":[4],"tags":[53,50,38,51,52],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/pd5QIe-md","jetpack_likes_enabled":true,"jetpack-related-posts":[{"id":1345,"url":"https:\/\/www.wiredprairie.us\/blog\/index.php\/archives\/1345","url_meta":{"origin":1377,"position":0},"title":"Creating a simple Entity Reference system for Ember.js","date":"December 28, 2011","format":false,"excerpt":"I had some data stored in a structure similar to this: Nothing too fancy. A table of Gift(s) and a table of Person(s). Each gift had a foreign key relationship to a Person (the person who \u201cgave\u201d the gift). Since some people may give several gifts, I didn\u2019t want to\u2026","rel":"","context":"In "Coding"","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":1430,"url":"https:\/\/www.wiredprairie.us\/blog\/index.php\/archives\/1430","url_meta":{"origin":1377,"position":1},"title":"Ember.JS and EZdata, and Rails","date":"January 7, 2012","format":false,"excerpt":"I\u2019ve been trying to do some additional work on my ember.js extension for data management. At the same time though, I\u2019ve been trying (to learn and) build a simple Ruby on Rails web demo application using the new JavaScript library. There have been more than a few things that have\u2026","rel":"","context":"In "Coding"","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":1563,"url":"https:\/\/www.wiredprairie.us\/blog\/index.php\/archives\/1563","url_meta":{"origin":1377,"position":2},"title":"Knockout.JS: AsDictionary","date":"March 9, 2012","format":false,"excerpt":"I frequently find that I have an array of objects in JavaScript that I want to display in a particular order and also have the ability to quickly locate an object by an ID or a key (and not use the indexOf function). As my recent project is using Knockout.JS,\u2026","rel":"","context":"In "Coding"","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/www.wiredprairie.us\/blog\/wp-content\/uploads\/2012\/03\/image3.png?resize=350%2C200","width":350,"height":200},"classes":[]},{"id":1449,"url":"https:\/\/www.wiredprairie.us\/blog\/index.php\/archives\/1449","url_meta":{"origin":1377,"position":3},"title":".NET API for Nest Thermostat","date":"January 9, 2012","format":false,"excerpt":"I just finished a preliminary read-only (think version 0.1) wrapper around the Nest Thermostat API that is used by their mobile phone and web applications. As Nest doesn\u2019t have a formal API yet, the code could break at any time and may not be suitable for any use. However, it\u2026","rel":"","context":"In "Coding"","img":{"alt_text":"SNAGHTML88bff0b3","src":"https:\/\/i0.wp.com\/www.wiredprairie.us\/blog\/wp-content\/uploads\/2012\/01\/SNAGHTML88bff0b3_thumb.png?resize=350%2C200","width":350,"height":200},"classes":[]},{"id":1565,"url":"https:\/\/www.wiredprairie.us\/blog\/index.php\/archives\/1565","url_meta":{"origin":1377,"position":4},"title":"Knockout.JS: Dictionary\/Index and ObservableArray, Part 2","date":"March 10, 2012","format":false,"excerpt":"Ryan suggested an alternative in a comment (and corresponding jsFiddle) to the technique that I\u2019d used in my previous Knockout.JS post. Following his suggestion, I made a few tweaks to my original function (and renamed it yet again): ko.observableArray.fn.withIndex = function (keyName) { var index = ko.computed(function () { var\u2026","rel":"","context":"In "Coding"","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":890,"url":"https:\/\/www.wiredprairie.us\/blog\/index.php\/archives\/890","url_meta":{"origin":1377,"position":5},"title":"Disabling automatic Sys.UI.Control attachment","date":"January 17, 2010","format":false,"excerpt":"If you\u2019re using the Microsoft Ajax Library (learn), you may not always want to start the automatic \u201cattach\u201d process that takes place when the page loads. It\u2019s easy to disable, but not yet documented any place I could find easily.