https://github.com/minutebase/ember-time-field
Time field for ember with keyboard navigation
https://github.com/minutebase/ember-time-field
Last synced: about 1 year ago
JSON representation
Time field for ember with keyboard navigation
- Host: GitHub
- URL: https://github.com/minutebase/ember-time-field
- Owner: minutebase
- License: mit
- Created: 2015-11-02T10:30:31.000Z (over 10 years ago)
- Default Branch: master
- Last Pushed: 2019-12-08T01:57:36.000Z (over 6 years ago)
- Last Synced: 2025-04-11T18:06:57.996Z (about 1 year ago)
- Language: JavaScript
- Homepage: http://minutebase.github.io/ember-time-field/
- Size: 286 KB
- Stars: 12
- Watchers: 1
- Forks: 10
- Open Issues: 9
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE.md
Awesome Lists containing this project
README
# ember-time-field
Time field input, like Chrome's, with keyboard navigation within sections.
## Installation
```
ember install ember-time-field
```
## Usage
```handlebars
{{time-field on-change=(action "timeChanged") value=time hour12=true}}
```
* `value` is a `Time`
* `hour12` (default false) whether or not to display in 12 hour format with am/pm field.
* `on-change` action is triggered with a `Time` whenever the input value changes.
`Time` is simply a POJO with `hours` and `minutes` properties and is always 24 hours.
## Keyboard / Mouse Integration
* Clicking on a segment selects that segment (hours/minutes/period)
* Up/down increment/decrement the selected segment
* Left/right moves between segments
* Typing moves along the segments - eg typing "945p" will enter "09:45 pm"
## TODO pre 1.0
* Tests
* Ensure 12 hour times work correctly
## Installation
* `git clone` this repository
* `npm install`
## Running
* `ember server`
* Visit your app at http://localhost:4200.
## Running Tests
* `ember test`
* `ember test --server`
## Building
* `ember build`
For more information on using ember-cli, visit [http://www.ember-cli.com/](http://www.ember-cli.com/).