Skip to content

Commit 2df4c9c

Browse files
committed
adding new attr - max time unit
adding test scenario, updating docs, updating code.
1 parent 0711c00 commit 2df4c9c

File tree

5 files changed

+138
-17
lines changed

5 files changed

+138
-17
lines changed

app/js/timer.js

Lines changed: 26 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,8 @@ angular.module('timer', [])
88
startTimeAttr: '=startTime',
99
endTimeAttr: '=endTime',
1010
countdownattr: '=countdown',
11-
autoStart: '&autoStart'
11+
autoStart: '&autoStart',
12+
maxTimeUnit: '='
1213
},
1314
controller: ['$scope', '$element', '$attrs', '$timeout', function ($scope, $element, $attrs, $timeout) {
1415

@@ -96,15 +97,34 @@ angular.module('timer', [])
9697

9798
function calculateTimeUnits() {
9899

99-
$scope.seconds = Math.floor(($scope.millis / 1000) % 60);
100+
// compute time values based on maxTimeUnit specification
101+
if(!$scope.maxTimeUnit) {
102+
$scope.seconds = Math.floor(($scope.millis / 1000) % 60);
103+
$scope.minutes = Math.floor((($scope.millis / (60000)) % 60));
104+
$scope.hours = Math.floor((($scope.millis / (3600000)) % 24));
105+
$scope.days = Math.floor((($scope.millis / (3600000)) / 24));
106+
} else if($scope.maxTimeUnit === 'second') {
107+
$scope.seconds = Math.floor($scope.millis / 1000);
108+
$scope.minutes = 0;
109+
$scope.hours = 0;
110+
$scope.days = 0;
111+
} else if($scope.maxTimeUnit === 'minute') {
112+
$scope.seconds = Math.floor(($scope.millis / 1000) % 60);
113+
$scope.minutes = Math.floor($scope.millis / 60000);
114+
$scope.hours = 0;
115+
$scope.days = 0;
116+
} else if($scope.maxTimeUnit === 'hour') {
117+
$scope.seconds = Math.floor(($scope.millis / 1000) % 60);
118+
$scope.minutes = Math.floor((($scope.millis / (60000)) % 60));
119+
$scope.hours = Math.floor($scope.millis / 3600000);
120+
$scope.days = 0;
121+
}
122+
123+
// plural - singular unit decision
100124
$scope.secondsS = $scope.seconds==1 ? '' : 's';
101-
$scope.minutes = Math.floor((($scope.millis / (60000)) % 60));
102125
$scope.minutesS = $scope.minutes==1 ? '' : 's';
103-
$scope.hours = Math.floor((($scope.millis / (3600000)) % 24));
104126
$scope.hoursS = $scope.hours==1 ? '' : 's';
105-
$scope.days = Math.floor((($scope.millis / (3600000)) / 24));
106127
$scope.daysS = $scope.days==1 ? '' : 's';
107-
108128
//add leading zero if number is smaller than 10
109129
$scope.sseconds = $scope.seconds < 10 ? '0' + $scope.seconds : $scope.seconds;
110130
$scope.mminutes = $scope.minutes < 10 ? '0' + $scope.minutes : $scope.minutes;

dist/angular-timer.js

Lines changed: 27 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/**
2-
* angular-timer - v1.0.12 - 2014-03-18 4:02 PM
2+
* angular-timer - v1.0.12 - 2014-04-20 7:17 PM
33
* https://github.com/siddii/angular-timer
44
*
55
* Copyright (c) 2014 Siddique Hameed
@@ -15,7 +15,8 @@ angular.module('timer', [])
1515
startTimeAttr: '=startTime',
1616
endTimeAttr: '=endTime',
1717
countdownattr: '=countdown',
18-
autoStart: '&autoStart'
18+
autoStart: '&autoStart',
19+
maxTimeUnit: '='
1920
},
2021
controller: ['$scope', '$element', '$attrs', '$timeout', function ($scope, $element, $attrs, $timeout) {
2122

@@ -103,23 +104,40 @@ angular.module('timer', [])
103104

104105
function calculateTimeUnits() {
105106

106-
$scope.seconds = Math.floor(($scope.millis / 1000) % 60);
107+
// compute time values based on maxTimeUnit specification
108+
if(!$scope.maxTimeUnit) {
109+
$scope.seconds = Math.floor(($scope.millis / 1000) % 60);
110+
$scope.minutes = Math.floor((($scope.millis / (60000)) % 60));
111+
$scope.hours = Math.floor((($scope.millis / (3600000)) % 24));
112+
$scope.days = Math.floor((($scope.millis / (3600000)) / 24));
113+
} else if($scope.maxTimeUnit === 'second') {
114+
$scope.seconds = Math.floor($scope.millis / 1000);
115+
$scope.minutes = 0;
116+
$scope.hours = 0;
117+
$scope.days = 0;
118+
} else if($scope.maxTimeUnit === 'minute') {
119+
$scope.seconds = Math.floor(($scope.millis / 1000) % 60);
120+
$scope.minutes = Math.floor($scope.millis / 60000);
121+
$scope.hours = 0;
122+
$scope.days = 0;
123+
} else if($scope.maxTimeUnit === 'hour') {
124+
$scope.seconds = Math.floor(($scope.millis / 1000) % 60);
125+
$scope.minutes = Math.floor((($scope.millis / (60000)) % 60));
126+
$scope.hours = Math.floor($scope.millis / 3600000);
127+
$scope.days = 0;
128+
}
129+
130+
// plural - singular unit decision
107131
$scope.secondsS = $scope.seconds==1 ? '' : 's';
108-
$scope.minutes = Math.floor((($scope.millis / (60000)) % 60));
109132
$scope.minutesS = $scope.minutes==1 ? '' : 's';
110-
$scope.hours = Math.floor((($scope.millis / (3600000)) % 24));
111133
$scope.hoursS = $scope.hours==1 ? '' : 's';
112-
$scope.days = Math.floor((($scope.millis / (3600000)) / 24));
113134
$scope.daysS = $scope.days==1 ? '' : 's';
114-
115-
116135
//add leading zero if number is smaller than 10
117136
$scope.sseconds = $scope.seconds < 10 ? '0' + $scope.seconds : $scope.seconds;
118137
$scope.mminutes = $scope.minutes < 10 ? '0' + $scope.minutes : $scope.minutes;
119138
$scope.hhours = $scope.hours < 10 ? '0' + $scope.hours : $scope.hours;
120139
$scope.ddays = $scope.days < 10 ? '0' + $scope.days : $scope.days;
121140

122-
123141
}
124142
//determine initial values of time units and add AddSeconds functionality
125143
if ($scope.countdownattr) {

dist/angular-timer.min.js

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

index.html

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -181,6 +181,34 @@ <h3 class="plural-counter">
181181
</div>
182182
</section>
183183

184+
<section id="max-time-unit-countdown-timer">
185+
<h3>countdown Time Display according to specified max Time Unit</h3>
186+
187+
<div class="bs-docs-example">
188+
<p>
189+
This markup will display countdown time in minute and seconds only. This attribute can be applied to regular clock timer as well.
190+
<code ng-non-bindable="">
191+
&lt;timer countdown="10041" max-time-unit="'minute'" interval="1000"&gt;{{mminutes}} minute{{minutesS}}, {{sseconds}} second{{secondsS}}&lt;/timer&gt;
192+
</code>
193+
</p>
194+
195+
<p class="muted">countdown Time with max time unit option - minute</p>
196+
<h3 class="WithMaxTimeUnitAsMinute">
197+
<timer countdown="10041" max-time-unit="'minute'" interval="1000"> {{mminutes}} minute{{minutesS}}, {{sseconds}} second{{secondsS}}</timer>
198+
</h3>
199+
200+
<p class="muted">countdown Time with max time unit option - second</p>
201+
<h3 class="WithMaxTimeUnitAsSecond">
202+
<timer countdown="10041" max-time-unit="'second'" interval="1000"> {{mminutes}} minute{{minutesS}}, {{sseconds}} second{{secondsS}}</timer>
203+
</h3>
204+
205+
<p class="muted">countdown Time without max time unit option - minute</p>
206+
<h3 class="WithoutMaxTimeUnit">
207+
<timer countdown="10041" interval="1000"> {{ddays}} day{{daysS}}, {{hhours}} hour{{hoursS}}, {{mminutes}} minute{{minutesS}}, {{sseconds}} second{{secondsS}}</timer>
208+
</h3>
209+
</div>
210+
</section>
211+
184212
<section id="markup">
185213
<h3>
186214
Markup</h3>
@@ -268,6 +296,16 @@ <h4>
268296
<td>Sets the countdown based on predefined end time (in milliseconds).
269297
</td>
270298
</tr>
299+
<tr>
300+
<td>
301+
max-time-unit
302+
</td>
303+
<td>
304+
false
305+
</td>
306+
<td> no default value. But you can give value, 'minute', 'second', or 'hour'.
307+
</td>
308+
</tr>
271309
</tbody>
272310
</table>
273311
<h4>

test/e2e/scenarios.js

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,39 @@ describe('Angular Timer E2E Tests', function () {
2323
return totalSeconds(actualValue) > totalSeconds(futureValue);
2424
});
2525

26+
angular.scenario.matcher('toCompareWith', function(future) {
27+
function getUnitValue (text, unitName) {
28+
var arr = text.toLowerCase().match(/\w+/g),
29+
returnVal,
30+
numInd= -1;
31+
arr.every(function (item,index,list) {
32+
if(isNaN(item)) {
33+
if(index===0) {
34+
numInd=1;
35+
}
36+
if(item === unitName) {
37+
returnVal = list[index+numInd];
38+
return false;
39+
}
40+
}
41+
return true;
42+
});
43+
return returnVal;
44+
}
45+
46+
var unitVal = getUnitValue(this.future.timerText.value,this.future.unit),
47+
compareResultFlag=false;
48+
if(this.future.compareTo === 'GreaterThan') {
49+
compareResultFlag = Number(unitVal) > Number(future);
50+
} else if(this.future.compareTo === 'LessThan') {
51+
compareResultFlag = Number(unitVal) < Number(future);
52+
} else if(this.future.compareTo === 'EqualTo') {
53+
compareResultFlag = Number(unitVal) == Number(future);
54+
}
55+
56+
return compareResultFlag;
57+
});
58+
2659
beforeEach(function () {
2760
if (window.location.host.indexOf("github.io") > -1) {
2861
browser().navigateTo('/angular-timer/index.html');
@@ -110,4 +143,16 @@ describe('Angular Timer E2E Tests', function () {
110143
expect(element('#clock-timer-leading-zero timer').html()).toMatch(/11 seconds./);
111144
});
112145

146+
it('Countdown timer with maxTimeUnit- should display time value from lower to specified maxTimeUnit', function() {
147+
var timer1Val = element('#max-time-unit-countdown-timer .WithMaxTimeUnitAsMinute timer').text();
148+
149+
expect({'timerText': timer1Val, 'unit': 'minutes', 'compareTo': 'GreaterThan'}).toCompareWith(59);
150+
expect({'timerText': timer1Val, 'unit': 'seconds', 'compareTo': 'LessThan'}).toCompareWith(60);
151+
152+
var timer2Val = element('#max-time-unit-countdown-timer .WithMaxTimeUnitAsSecond timer').text();
153+
expect({'timerText': timer2Val, 'unit': 'minutes', 'compareTo': 'EqualTo'}).toCompareWith(0);
154+
expect({'timerText': timer2Val, 'unit': 'seconds', 'compareTo': 'GreaterThan'}).toCompareWith(59);
155+
156+
});
157+
113158
});

0 commit comments

Comments
 (0)