Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

ember-cli-simple-store

Package Overview
Dependencies
Maintainers
2
Versions
74
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

ember-cli-simple-store

ember-cli addon that provides a simple identity map for ember.js web applications

  • 0.9.1
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
13
decreased by-35%
Maintainers
2
Weekly downloads
 
Created
Source

ember-cli-simple-store

Build Status Downloads Score

Description

ember-cli addon that provides a simple identity map for ember.js web applications

Installation

1) remove ember-data from your package.json file
2) remove ember-data from your bower.json file
3) rm -rf node_modules/ember-data
4) rm -rf bower_components/ember-data
5) npm install ember-cli-simple-store --save-dev

You get 5 methods: push/remove/find/findOne/clear

//create or update person model

this.store.push("person", {id: 1, name: "toran"});
//remove person model with id=123

this.store.remove("person", 123);
//find all person models

this.store.find("person");
//find a single person model with id=123

this.store.find("person", 123);
//find all person models with account_id=789

this.store.find("person", {account_id: 789});
//find all person models with name toran and salary > 100

var filter = function(person) {
    var name = person.get("name");
    var salary = person.get("salary");
    return name === "toran" && salary > 100;
}
this.store.find("person", filter, ["salary", "name"]);
//find the first person model

this.store.findOne("person");
//clear the entire identity map of all person models

this.store.clear("person");
//clear the entire identity map of all models

this.store.clear();

Using the store by example

Below I'll show how you can use the store with a simple ember object to find/add/remove/update

The full example below relies on a small xhr mixin PromiseMixin

import PromiseMixin from "js/mixins/promise";

var Person = Ember.Object.extend({
    firstName: "",
    lastName: "",
    phone: ""
}).reopenClass({
    find: function(store) {
        return PromiseMixin.xhr("/api/people/", "GET").then(function(response) {
            response.forEach(function(person) {
                store.push("person", person);
            });
            return store.find("person");
        });
    },
    findById: function(store, id) {
        return store.find("person", id);
    },
    insert: function(store, person) {
        var self = this;
        var hash = {data: JSON.stringify(person)};
        return new Ember.RSVP.Promise(function(resolve,reject) {
            return PromiseMixin.xhr("/api/people/", "POST", hash).then(function(persisted) {
                var inserted = store.push("person", persisted);
                resolve(inserted);
            }, function(err) {
                reject(err);
            });
        });
    },
    update: function(person) {
        var person_id = person.get("id");
        var hash = {data: JSON.stringify(person)};
        var endpoint = "/api/people/%@/".fmt(person_id);
        return PromiseMixin.xhr(endpoint, "PUT", hash);
    },
    remove: function(store, person) {
        var self = this;
        var person_id = person.get("id");
        var endpoint = "/api/people/%@/".fmt(person_id);
        return new Ember.RSVP.Promise(function(resolve,reject) {
            return PromiseMixin.xhr(endpoint, "DELETE").then(function(arg) {
                store.remove("person", person_id);
                resolve(arg);
            }, function(err) {
                reject(err);
            });
        });
    }
});

export default Person;

What about relationship support?

With this simple reference implementation you can side step the relationship complexity by adding what you need in your route(s)

import Action from "js/models/action";
import Person from "js/models/person";

var PeoplePersonRoute = Ember.Route.extend({
  model: function(params) {
    var store = this.get("store");
    var person = Person.findById(store, params.person_id);
    var actions = Action.findByPerson(store, params.person_id);
    return Ember.RSVP.hash({person: person, actions: actions});
  },
  setupController: function(controller, hash) {
    controller.set("model", hash.person);
    controller.set("actions", hash.actions);
  }
});

This approach is not without it's tradeoffs

  • additional http calls to fetch related data instead of using embedded json. You could make a single http call and parse this out if latency becomes problematic but you might find yourself managing complex object hierarchies all over again.
  • you will find yourself passing the store instance into model object class methods from the route/controller
  • you begin to use a different pattern for object materialization/filtering in the route objects because the models themselves are relationship-less.

I've personally found this is a great approach for apps that want to avoid the complexity of bigger projects like ember-data, but still need a single pointer /reference for the models in your ember application.

What about dirty tracking?

If you want the ability to track if your model is dirty use the attr for each field and the Model base class to get save/rollback

import { attr, Model } from "ember-cli-simple-store/model";

var Person = Model.extend({
    firstName: attr(),
    lastName: attr(),
    fullName: function() {
        var first = this.get("firstName");
        var last = this.get("lastName");
        return first + " " + last;
    }.property("firstName", "lastName")
});

//save your object to reset isDirty
var person = Person.create({id: 1, firstName: "x", lastName: "y"});
person.set("firstName", "toran");
person.save();

//rollback your object to reset isDirty and restore it
person.set("firstName", "foobar");
person.rollback();

If you want to know if an individual property isDirty you can ask like so

person.get("firstNameIsDirty"); //undefined
person.set("firstName", "foobar");
person.get("firstNameIsDirty"); //true

Running the unit tests

npm install
ember test

Example project

https://github.com/toranb/ember-cli-store-example

Example project with dirty tracking (save/rollback)

https://github.com/toranb/ember-cli-store-dirty-tracking-example

License

Copyright © 2015 Toran Billups http://toranbillups.com

Licensed under the MIT License

Keywords

FAQs

Package last updated on 05 Apr 2015

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc