Ember Storage

A simple but powerful way for managing data that you wish to last through a page reload. This add-on synchronizes data between browser tabs when using localStorage and it is observable.

Live Demo

Installation

• ember install:addon ember-storage

Usage

This service is injected into all routes and components as storage. You may get, set, and observe data on storage just like a regular Ember Object:

exportdefaultEmber.Component.extend({fullWidth: function(){return!this.get('storage.sideBarOpen');}.property('storage.sideBarOpen'),actions: {toggleMenu: function(){this.toggleProperty('storage.sideBarOpen');},},});

<!-- some component template --><divid="sidebar" class="{{if storage.sideBarOpen 'open' ''}}">
sidebar contents
</div><button{{action 'toggleMenu'}}>Toggle Sidebar</button>

API

• prefix (property). Set a key prefix. Handy for saving user specific device config. Defaults to 'es'.
• type (property). Either 'session' or 'local'. Defaults to 'local'. Due to the way sessionStorage works tab sync does not work if type is set to 'session'.
• clear (function). Clear all data for the specified key. Defaults to the key currently set in prefix.

Examples:

// application routeexportdefaultEmber.Route.extend({afterModel: function(model){this.currentUserID=model.id;// now multiple users could use this device without sharing datathis.storage.set('prefix',this.currentUserID);},actions: {resetUserPreferences: function(){this.storage.clear(this.currentUserID);},},});

To create an additional instance (maybe one for sessionStorage) add an initializer to your app:

// app/initializers/session-service.jsimportSessionfrom'../services/storage';varsession=Session.create({type: 'session',});exportfunctioninitialize(container,application){container.register('service:session',session,{instantiate: false});application.inject('route','session','service:session');application.inject('component','session','service:session');}exportdefault{name: 'session-service',initialize: initialize};

Running Tests

• ember test
• ember test --server

For more information on using ember-cli, visit http://www.ember-cli.com/.