Bootstrap 4 full support

README.md

@@ -1,7 +1,17 @@
 # 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)
 
-A clock-style timepicker for Bootstrap (or jQuery).
-[Documentation and examples](http://weareoutman.github.io/clockpicker/).
+A clock-style timepicker for Bootstrap 4 (or Bootstrap 3 or jQuery).
+
+[Light documentation and examples for Bootstrap 4](https://jsfiddle.net/djibe89/9wj67d5u/).
+
+[Original documentation and examples for Bootstrap 3](http://weareoutman.github.io/clockpicker/).
+
+Below are the screens for Bootstrap 4 and Bootstrap 4 with Daemonite material UI
+
+![Bootstrap 4 clockpicker](assets/images/clockpicker-bs4.png?raw=true "Clockpicker for Bootstrap 4")
+![Bootstrap 4 clockpicker](assets/images/clockpicker-bs4-material.png?raw=true "Clockpicker for Bootstrap 4 with material design")
+
+And the original screens from Weareoutman for Bootstrap 3
 
 ![Screenshot](http://weareoutman.github.io/clockpicker/assets/images/screenshot-1.png)
 ![clockpicker-12-hour-screenshot](https://cloud.githubusercontent.com/assets/5218249/3613434/03da9888-0db8-11e4-8bdb-dbabb5e91e5c.png)
@@ -15,7 +25,7 @@ Both desktop and mobile device are supported. It also works great in touch scree
 
 ## Dependencies
 
-ClockPicker was designed for Bootstrap in the beginning. So Bootstrap (and jQuery) is the only dependency(s).
+ClockPicker was designed for Bootstrap in the beginning. So Bootstrap (3 or 4 and jQuery) is the only dependency(s).
 
 Since it only used `.popover` and some of `.btn` styles of Bootstrap, I picked these styles to build a jQuery plugin.
 Feel free to use `jquery-*` files instead of `bootstrap-*` , for non-bootstrap project.
@@ -72,7 +82,7 @@ if (something) {
 | default | '' | default time, 'now' or '13:14' e.g. |
 | placement | 'bottom' | popover placement |
 | align | 'left' | popover arrow align |
-| donetext | '完成' | done button text |
+| donetext | 'OK' ('完成' in BS3) | done button text |
 | autoclose | false | auto close when minute is selected |
 | twelvehour | false | enables twelve hour mode with AM & PM buttons |
 | vibrate | true | vibrate the device when dragging clock hand |
@@ -101,10 +111,14 @@ if (something) {
 ```bash
 clockpicker/
 ├── dist/
-│   ├── bootstrap-clockpicker.css      # full code for bootstrap
+│   ├── bootstrap-clockpicker.css      # full code for bootstrap 3
 │   ├── bootstrap-clockpicker.js
-│   ├── bootstrap-clockpicker.min.css  # compiled and minified files for bootstrap
+│   ├── bootstrap-clockpicker.min.css  # compiled and minified files for bootstrap 3
 │   ├── bootstrap-clockpicker.min.js
+|   |── bootstrap4-clockpicker.css      # full code for bootstrap 4
+│   ├── bootstrap4-clockpicker.js
+│   ├── bootstrap4-clockpicker.min.css  # compiled and minified files for bootstrap 4
+│   ├── bootstrap4-clockpicker.min.js
 │   ├── jquery-clockpicker.css         # full code for jquery
 │   ├── jquery-clockpicker.js
 │   ├── jquery-clockpicker.min.css     # compiled and minified files for jquery
@@ -134,6 +148,38 @@ gulp
 - [ ] Seconds View ?
 
 ## Change log
+0.2.3
+
+* [Poradz : Prevented the popover position from overflowing outside the window](https://github.com/djibe/clockpicker/commit/191ca92ae612bf6cec4c9981e3704d9d482e0ad9).
+* [Poradz : Parsing input value in getTime function broke picked value when beforeHide or beforeDone callbacks were in use]( https://github.com/djibe/clockpicker/pull/2/commits/204417a37ad02f0f7581907368a3d0c03af865a7).
+
+0.2.2
+
+* phanku : Fixed clock picker so the clock picker will work when the trigger element is within a modal
+* SCSS source file added for easier maintenance
+* Minor CSS tweaks
+*  fallback added for a Bootstrap free use (ex: background-color: var(--primary, #007bff);)
+
+0.2.1
+
+* moved AM-PM buttons to the header and removed AM-PM block
+* inverted animation for top positioned picker
+* unified CSS files (compatible with BS 4.1.3, MDBootstrap 4.5.4 and Daemonite material UI)
+* need help to fix cancel button
+
+0.2
+
+* migrated all classes to BS4
+* enhenced material design
+* added popover opening animation
+* added Cancel button (doesn't work right now :( )
+* prevent user-select on all elements
+* next version : move AM and PM buttons in popover-header, fix cancel button
+
+0.1
+
+* Bootstrap 4 compatible (tested with BS 4.1.1)
+* Universal theming using CSS variables
 
 0.0.7
 

bower.json

@@ -1,10 +1,10 @@
 {
   "name": "clockpicker",
   "description": "A clock-style timepicker for Bootstrap (or jQuery)",
-  "version": "0.0.7",
+  "version": "0.2",
   "main": [
-    "dist/jquery-clockpicker.js",
-    "dist/jquery-clockpicker.css"
+    "dist/bootstrap4-clockpicker.js",
+    "dist/bootstrap4-clockpicker.css"
   ],
   "license": "MIT",
   "ignore": [
@@ -14,20 +14,20 @@
     "!LICENSE",
     "!README.md"
   ],
-  "keywords": ["timepicker", "jquery"],
+  "keywords": ["timepicker", "bootstrap4"],
   "authors": [
     {
       "name": "Wang Shenwei",
       "email": "[email protected]",
       "homepage": "http://wangshenwei.com/"
     }
   ],
-  "homepage": "http://weareoutman.github.io/clockpicker/",
+  "homepage": "https://github.com/djibe/clockpicker",
   "repository": {
     "type": "git",
     "url": "git://github.com/weareoutman/clockpicker.git"
   },
   "dependencies": {
     "jquery" : ">=1.7"
   }
-}
+}