ember-clock-face

A clock face for Ember.

Usage no npm install needed!

<script type="module">
  import emberClockFace from 'https://cdn.skypack.dev/ember-clock-face';
</script>

README

ember-clock-face

This is an Ember addon that provides a clock face.

It uses ember-clock as a dependency. If you don't need a clock face, but you want to use a clock to update time sensitive properties, use ember-clock instead.

Use

Basic clock face using the default parameters.

{{clock-face}}

Clock face, 150px in size, with numbers.

{{clock-face size="150" showClockNumbers=true}}

Styling

The clock can be styled using CSS.

The clock face's svg element has the class name clock-face. The circle that makes up the background of the clock face has a class name of face.

The clock hands have hour-hand, minute-hand and second-hand class names.
The markers have hour-mark and minute-mark class names.

The clock numbers have the class name clock-number.

Dependencies

Installation

npm install ember-clock-face --save-dev

Demo

To try out a demo..

  • git clone this repository
  • npm install
  • bower install
  • ember server
  • Visit the demo app at http://localhost:4200.

Running Tests

  • ember test
  • ember test --server

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