Make the passing of time observable in your Ember app.
Clone or download
Latest commit aed7fc4 Feb 16, 2016
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
addon services: Renamed "clock" -> "legacy" and "timestamp-clock" -> "clock" Feb 11, 2016
app app/services/clock: Fix typos in deprecation message Feb 16, 2016
blueprints blueprints/clock: Add --interval option Feb 16, 2016
config ember-try: Run tests with Ember 1.12 and 1.13 too Feb 3, 2016
tests services: Renamed "clock" -> "legacy" and "timestamp-clock" -> "clock" Feb 11, 2016
vendor Upgraded to the latest Ember and Ember CLI Feb 2, 2016
.bowerrc Upgraded to the latest Ember and Ember CLI Feb 2, 2016
.editorconfig Upgraded to the latest Ember and Ember CLI Feb 2, 2016
.ember-cli Upgraded to the latest Ember and Ember CLI Feb 2, 2016
.gitignore Upgraded to the latest Ember and Ember CLI Feb 2, 2016
.jshintrc Upgraded to the latest Ember and Ember CLI Feb 2, 2016
.npmignore Upgraded to the latest Ember and Ember CLI Feb 2, 2016
.travis.yml ember-try: Run tests with Ember 1.12 and 1.13 too Feb 3, 2016
.watchmanconfig Upgraded to the latest Ember and Ember CLI Feb 2, 2016
LICENSE.md Upgraded to the latest Ember and Ember CLI Feb 2, 2016
README.md Update README Feb 16, 2016
bower.json Use "lolex" library to fake timers in the test code Feb 3, 2016
ember-cli-build.js Use "lolex" library to fake timers in the test code Feb 3, 2016
index.js Upgraded to the latest Ember and Ember CLI Feb 2, 2016
package.json Tagged v2.1.1 Feb 16, 2016
testem.json Upgraded to the latest Ember and Ember CLI Feb 2, 2016

README.md

ember-cli-clock

Build Status

A simple clock service for Ember.js

Live Demo

View a live demo here: http://clock.jerel.co/

Installation

ember install ember-cli-clock

Usage

  1. Generate a clock service

    ember generate clock my-shiny-new-clock

  2. Inject the my-shiny-new-clock service into your component, controller, route, ...

    clock: Ember.inject.service('my-shiny-new-clock')

  3. Use the time (Date.now()) and date (Date instance) properties of the clock service

Examples

// app/components/iso-date.js

export default Ember.Component.extend({
  clock: Ember.inject.service('my-shiny-new-clock'),

  iso: Ember.computed('clock.date', function() {
    return this.get('clock.date').toISOString();
  })
});

Using {{iso}} in the template will output something like 2011-10-05T14:48:00.000Z and update it every second.

// app/components/device-status.js

export default Ember.Component.extend({
  clock: Ember.inject.service('my-shiny-new-clock'),

  isOnline: Ember.computed('lastContact', 'clock.time', function() {
    return this.get('clock.time') - this.get('lastContact') < 60 * 1000;
  })
});

The isOnline property is updated every second and will tell if the last contact of the device was less than 60 seconds ago.

API

Properties

  • interval (default: 1000ms) - the update interval of time and date
  • time (read-only) - will be set to Date.now() every interval milliseconds
  • date (read-only) - computed property: new Date(this.get('time'))

Methods

  • start() - starts the clock after it has been stopped
  • stop() - stops the clock from updating time and date until restarted

Authors

Legal

Copyright (c) 2014 Jerel Unruh and contributors

Licensed under the MIT license