/angular-ui-timepicker

A fancy timepicker (angular directive)

Primary LanguageCSSMIT LicenseMIT

angular-ui-timepicker built with gulp Stories in Ready

circular slider for selecting time

Screenshot

Getting started

Install manually

  • Minified Download JS and CSS
  • Unminified Download JS and CSS

Dependecies: angular, moment, angular moment, d3, bootstrap and jquery.

Install with bower

bower install angular-ui-timepicker

Usage

Include the javascript and css files:

<script src="jquery.min.js"></script>
<script src="boostrap.min.js"></script>
<script src="d3.min.js"></script>
<script src="moment.min.js"></script>
<script src="angular.min.js"></script>
<script src="angular-moment.min.js"></script>
<script src="angular-ui-timepicker.min.js"></script>

<link rel="stylesheet" href="boostrap.min.css">
<link rel="stylesheet" href="angular-ui-timepicker.css">

Use in your html:

    <div class="input-group">
        <input class="form-control" ui-timepicker ng-model="mydatetime" type="text" placeholder="time" />
        <span class="input-group-addon">
            <span class="glyphicon glyphicon-time"></span>
        </span>
    </div>

Configuration information can be found on the project home page.

Issue tracking

All upcoming features and issues can be tracked at waffle.io.

Contributions

This is a large rewrite and packaging of @zarknight. Additional thanks go to @eonasdan for his work on interactive popovers on inputs without losing focus.

License

MIT License