Add minHours option

_config.yml

@@ -2,3 +2,4 @@ permalink: /:title
 auto: true
 server: true
 pygments: true
+highlighter: rouge

index.html

@@ -40,7 +40,7 @@ <h1>Installation</h1>
     $ bower install bootstrap-timepicker
 </pre>
         <p>
-            You can also download our latest release (and any previous release) 
+            You can also download our latest release (and any previous release)
             <a href="https://github.com/jdewit/bootstrap-timepicker/releases">here</a>.
         </p>
     </div>
@@ -281,10 +281,15 @@ <h3>template <small>The picker widget template</small></h3>
                         Don't show a widget
                     </td>
                 </tr>
+                <tr>
+                    <td>minHours</td>
+                    <td>0</td>
+                    <td>Specify the lowest hour available. showMeridian must be set to false</td>
+                </tr>
                 <tr>
                     <td>maxHours</td>
                     <td>24</td>
-                    <td>Specify a maximum number of hours the TimePicker can handle. showMeridian must be set to false</td>
+                    <td>Specify the highest hour available. showMeridian must be set to false</td>
                 </tr>
                 <tr>
                     <td>snapToStep</td>

js/bootstrap-timepicker.js

@@ -32,6 +32,7 @@
     this.showWidgetOnAddonClick = options.showWidgetOnAddonClick;
     this.icons = options.icons;
     this.maxHours = options.maxHours;
+    this.minHours = options.minHours;
     this.explicitMode = options.explicitMode; // If true 123 = 1:23, 12345 = 1:23:45, else invalid.
 
     this.handleDocumentClick = function (e) {
@@ -133,7 +134,7 @@
           this.hour--;
         }
       } else {
-        if (this.hour <= 0) {
+        if (this.hour <= this.minHours) {
           this.hour = this.maxHours - 1;
         } else {
           this.hour--;
@@ -542,11 +543,11 @@
           this.hour++;
           return this.toggleMeridian();
         } else if (this.hour === 12) {
-          this.hour = 0;
+          this.hour = this.minHours;
         }
       }
       if (this.hour === this.maxHours - 1) {
-        this.hour = 0;
+        this.hour = this.minHours;
 
         return;
       }
@@ -870,6 +871,10 @@
           // No day/date handling.
           hour = this.maxHours - 1;
         }
+        if (hour <= this.minHours) {
+          // No day/date handling.
+          hour = this.minHours;
+        }
 
         if (this.showMeridian) {
           if (hour > 12) {
@@ -890,7 +895,7 @@
           if (hour >= this.maxHours) {
             hour = this.maxHours - 1;
           } else if ((hour < 0) || (hour === 12 && timeMode === 1)){
-            hour = 0;
+            hour = this.minHours;
           }
         }
       }
@@ -1155,6 +1160,7 @@
       down: 'glyphicon glyphicon-chevron-down'
     },
     maxHours: 24,
+    minHours: 0,
     explicitMode: false
   };
 

spec/js/TimepickerSpec.js

@@ -6,16 +6,19 @@ describe('Timepicker feature', function() {
     $input3,
     $input4,
     $input5,
+    $input6,
     $timepicker1,
     $timepicker2,
     $timepicker3,
     $timepicker4,
     $timepicker5,
+    $timepicker6,
     tp1,
     tp2,
     tp3,
     tp4,
-    tp5;
+    tp5,
+    tp6;
 
   beforeEach(function () {
     loadFixtures('timepicker.html');
@@ -54,6 +57,16 @@ describe('Timepicker feature', function() {
       defaultTime: '12:00 AM'
     });
     tp5 = $timepicker5.data('timepicker');
+
+    $input6 = $('#timepicker6');
+    $timepicker6 = $input6.timepicker({
+      showMeridian: false,
+      showSeconds: true,
+      defaultTime: '13:25:15',
+      minHours: 12
+    });
+    tp6 = $timepicker6.data('timepicker');
+
   });
 
   afterEach(function () {
@@ -72,11 +85,15 @@ describe('Timepicker feature', function() {
     if ($input5.data('timepicker') !== undefined) {
       $input5.data('timepicker').remove();
     }
+    if ($input6.data('timepicker') !== undefined) {
+      $input6.data('timepicker').remove();
+    }
     $input1.remove();
     $input2.remove();
     $input3.remove();
     $input4.remove();
     $input5.remove();
+    $input6.remove();
   });
 
   it('should be available on the jquery object', function() {
@@ -102,6 +119,7 @@ describe('Timepicker feature', function() {
     expect(tp1.modalBackdrop).toBe(false);
     expect(tp1.isOpen).toBe(false);
     expect(tp1.showWidgetOnAddonClick).toBe(true);
+    expect(tp1.minHours).toBe(0);
     expect(tp1.maxHours).toBe(24);
   });
 
@@ -401,6 +419,28 @@ describe('Timepicker feature', function() {
     expect(tp3.second).toBe(30);
   });
 
+  it('should set hour to minHours if hour increments on "maxHours-1" for 24h clock', function() {
+    $input6.val('22:15:30');
+    tp6.updateFromElementVal();
+    tp6.incrementHour();
+    tp6.incrementHour();
+
+    expect(tp6.hour).toBe(12);
+    expect(tp6.minute).toBe(15);
+    expect(tp6.second).toBe(30);
+  });
+
+  it('should set hour to "maxHours-1" if hour decrement on "minHours-1" for 24h clock', function() {
+    $input6.val('13:15:30');
+    tp6.updateFromElementVal();
+    tp6.decrementHour();
+    tp6.decrementHour();
+
+    expect(tp6.hour).toBe(23);
+    expect(tp6.minute).toBe(15);
+    expect(tp6.second).toBe(30);
+  });
+
   it('should increment minutes with incrementMinute method', function() {
     tp1.minute = 10;
     tp1.incrementMinute();

spec/js/fixtures/timepicker.html

@@ -16,6 +16,10 @@
     <input id="timepicker5" type="text" class="form-control input-small">
     <span class="input-group-addon"><i class="glyphicon glyphicon-time"></i></span>
 </div>
+<div class="input-group bootstrap-timepicker">
+    <input id="timepicker6" type="text" class="form-control input-small">
+    <span class="input-group-addon"><i class="glyphicon glyphicon-time"></i></span>
+</div>
 <div style="z-index:1000; position:relative;">
     <div class="bootstrap-timepicker">
         <input id="timepicker-z-index" type="text" class="form-control">