{"_id":"clockpicker","_rev":"5-ed30949cffc935c6a617361ac20d1715","name":"clockpicker","description":"A clock-style timepicker for Bootstrap (or jQuery)","dist-tags":{"latest":"0.0.7"},"versions":{"0.0.7":{"name":"clockpicker","description":"A clock-style timepicker for Bootstrap (or jQuery)","version":"0.0.7","author":{"name":"Wang Shenwei","email":"wangshenwei@qq.com","url":"http://wangshenwei.com/"},"homepage":"http://weareoutman.github.io/clockpicker/","repository":{"type":"git","url":"git://github.com/weareoutman/clockpicker.git"},"scripts":{"test":"gulp test"},"dependencies":{},"devDependencies":{"gulp":"~3.8.7","gulp-uglify":"~0.3.1","gulp-minify-css":"~0.3.1","gulp-rename":"~1.2.0","gulp-concat":"~2.3.4","gulp-qunit":"^0.3.3","gulp-replace":"^0.4.0"},"gitHead":"e6ac014b3c167281ac37cf122ab19b6967d8fae4","bugs":{"url":"https://github.com/weareoutman/clockpicker/issues"},"_id":"clockpicker@0.0.7","_shasum":"32d02c3a6cb00a3b6ea6d1ec2c5fc147d7bec06e","_from":".","_npmVersion":"1.4.28","_npmUser":{"name":"approach","email":"alexejkloos@gmail.com"},"maintainers":[{"name":"approach","email":"alexejkloos@gmail.com"}],"dist":{"shasum":"32d02c3a6cb00a3b6ea6d1ec2c5fc147d7bec06e","tarball":"https://registry.npmjs.org/clockpicker/-/clockpicker-0.0.7.tgz","integrity":"sha512-YFVZhnDqPKsfzw698x1H4EMwVGxAhpP959xXvmLCZcJfYD4EeWIKUVNlFyxXGYDBItSSipeRoWwIUmHeVwn+Cg==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC2lAE/FSclwne3upEIx7Ia8IP5nAm+Hs/FKeFcQF5uAQIhALmYI4JxtEjZWNmMEbed8zk5uTf/R+k38bWM1QwP+jb2"}]}}},"readme":"# ClockPicker [![Bower version](https://badge.fury.io/bo/clockpicker.svg)](http://badge.fury.io/bo/clockpicker) [![Build Status](https://travis-ci.org/weareoutman/clockpicker.svg)](https://travis-ci.org/weareoutman/clockpicker)  [![devDependency Status](https://david-dm.org/weareoutman/clockpicker/dev-status.svg)](https://david-dm.org/weareoutman/clockpicker#info=devDependencies)\n\nA clock-style timepicker for Bootstrap (or jQuery).\n[Documentation and examples](http://weareoutman.github.io/clockpicker/).\n\n![Screenshot](http://weareoutman.github.io/clockpicker/assets/images/screenshot-1.png)\n![clockpicker-12-hour-screenshot](https://cloud.githubusercontent.com/assets/5218249/3613434/03da9888-0db8-11e4-8bdb-dbabb5e91e5c.png)\n## Browser support\n\nAll major browsers are supported, including IE 9+. It should look and behave well enough in IE 8.\n\n## Device support\n\nBoth desktop and mobile device are supported. It also works great in touch screen device.\n\n## Dependencies\n\nClockPicker was designed for Bootstrap in the beginning. So Bootstrap (and jQuery) is the only dependency(s).\n\nSince it only used `.popover` and some of `.btn` styles of Bootstrap, I picked these styles to build a jQuery plugin.\nFeel free to use `jquery-*` files instead of `bootstrap-*` , for non-bootstrap project.\n\n## Usage\n\n```html\n<!-- Bootstrap stylesheet -->\n<link rel=\"stylesheet\" type=\"text/css\" href=\"assets/css/bootstrap.min.css\">\n\n<!-- ClockPicker Stylesheet -->\n<link rel=\"stylesheet\" type=\"text/css\" href=\"dist/bootstrap-clockpicker.min.css\">\n\n<!-- Input group, just add class 'clockpicker', and optional data-* -->\n<div class=\"input-group clockpicker\" data-placement=\"right\" data-align=\"top\" data-autoclose=\"true\">\n\t<input type=\"text\" class=\"form-control\" value=\"09:32\">\n\t<span class=\"input-group-addon\">\n\t\t<span class=\"glyphicon glyphicon-time\"></span>\n\t</span>\n</div>\n\n<!-- Or just a input -->\n<input id=\"demo-input\" />\n\n<!-- jQuery and Bootstrap scripts -->\n<script type=\"text/javascript\" src=\"assets/js/jquery.min.js\"></script>\n<script type=\"text/javascript\" src=\"assets/js/bootstrap.min.js\"></script>\n\n<!-- ClockPicker script -->\n<script type=\"text/javascript\" src=\"dist/bootstrap-clockpicker.min.js\"></script>\n\n<script type=\"text/javascript\">\n$('.clockpicker').clockpicker()\n\t.find('input').change(function(){\n\t\t// TODO: time changed\n\t\tconsole.log(this.value);\n\t});\n$('#demo-input').clockpicker({\n\tautoclose: true\n});\n\nif (something) {\n\t// Manual operations (after clockpicker is initialized).\n\t$('#demo-input').clockpicker('show') // Or hide, remove ...\n\t\t\t.clockpicker('toggleView', 'minutes');\n}\n</script>\n```\n\n## Options\n\n| Name | Default | Description |\n| ---- | ------- | ----------- |\n| default | '' | default time, 'now' or '13:14' e.g. |\n| placement | 'bottom' | popover placement |\n| align | 'left' | popover arrow align |\n| donetext | '完成' | done button text |\n| autoclose | false | auto close when minute is selected |\n| twelvehour | false | enables twelve hour mode with AM & PM buttons |\n| vibrate | true | vibrate the device when dragging clock hand |\n| fromnow | 0 | set default time to * milliseconds from now (using with default = 'now') |\n| init | | callback function triggered after the colorpicker has been initiated |\n| beforeShow | | callback function triggered before popup is shown |\n| afterShow | | callback function triggered after popup is shown |\n| beforeHide | | callback function triggered before popup is hidden Note:will be triggered between a beforeDone and afterDone |\n| afterHide | | callback function triggered after popup is hidden Note:will be triggered between a beforeDone and afterDone |\n| beforeHourSelect | | callback function triggered before user makes an hour selection |\n| afterHourSelect | | callback function triggered after user makes an hour selection |\n| beforeDone | | callback function triggered before time is written to input |\n| afterDone | | callback function triggered after time is written to input |\n\n## Operations\n\n| operation | Arguments | Description |\n| --------- | --------- | ----------- |\n| show |   | show the clockpicker |\n| hide |   | hide the clockpicker |\n| remove |   | remove the clockpicker (and event listeners) |\n| toggleView | 'hours' or 'minutes' | toggle to hours or minutes view |\n\n## What's included\n\n```bash\nclockpicker/\n├── dist/\n│   ├── bootstrap-clockpicker.css      # full code for bootstrap\n│   ├── bootstrap-clockpicker.js\n│   ├── bootstrap-clockpicker.min.css  # compiled and minified files for bootstrap\n│   ├── bootstrap-clockpicker.min.js\n│   ├── jquery-clockpicker.css         # full code for jquery\n│   ├── jquery-clockpicker.js\n│   ├── jquery-clockpicker.min.css     # compiled and minified files for jquery\n│   └── jquery-clockpicker.min.js\n└── src/                               # source code\n    ├── clockpicker.css\n    ├── clockpicker.js\n    └── standalone.css                 # some styles picked from bootstrap\n```\n\n## Development\n\n```bash\ngit clone https://github.com/weareoutman/clockpicker.git\ncd clockpicker\nnpm install -g gulp\nnpm install\ngulp\n# gulp test\n```\n\n## Todo\n\n- [ ] Auto placement and align.\n- [ ] Events.\n- [ ] Customize format.\n- [ ] Seconds View ?\n\n## Change log\n\n0.0.7\n\n* Enables twelve hour mode with AM & PM buttons.\n\n0.0.6\n\n* Default time can be setted to `now`.\n* Registered as a bower package.\n\n0.0.5\n\n* Functional operations.\n\n## License\n\nMIT\n","maintainers":[{"name":"approach","email":"alexejkloos@gmail.com"}],"time":{"modified":"2022-06-13T06:11:23.327Z","created":"2015-06-28T13:26:20.135Z","0.0.7":"2015-06-28T13:26:20.135Z"},"homepage":"http://weareoutman.github.io/clockpicker/","repository":{"type":"git","url":"git://github.com/weareoutman/clockpicker.git"},"author":{"name":"Wang Shenwei","email":"wangshenwei@qq.com","url":"http://wangshenwei.com/"},"bugs":{"url":"https://github.com/weareoutman/clockpicker/issues"},"readmeFilename":"README.md","users":{"ux_web":true,"odahcam":true}}