Skip to content

Commit 16bef4b

Browse files
siddiisiddii
committed
Merge pull request siddii#46 from mp1erce/master
Add reset method
2 parents 31de9f0 + 2edffcc commit 16bef4b

File tree

2 files changed

+103
-1
lines changed

2 files changed

+103
-1
lines changed

‎app/js/timer.js

Lines changed: 15 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -54,7 +54,11 @@ var timerModule = angular.module('timer', [])
5454
$scope.$on('timer-clear', function () {
5555
$scope.clear();
5656
});
57-
57+
58+
$scope.$on('timer-reset', function () {
59+
$scope.reset();
60+
});
61+
5862
$scope.$on('timer-set-countdown', function (e, countdown) {
5963
$scope.countdown = countdown;
6064
});
@@ -100,6 +104,16 @@ var timerModule = angular.module('timer', [])
100104
$scope.isRunning = false;
101105
};
102106

107+
$scope.reset = $element[0].reset = function () {
108+
$scope.startTime = $scope.startTimeAttr ? new Date($scope.startTimeAttr) : new Date();
109+
$scope.endTime = $scope.endTimeAttr ? new Date($scope.endTimeAttr) : null;
110+
$scope.countdown = $scope.countdownattr && parseInt($scope.countdownattr, 10) > 0 ? parseInt($scope.countdownattr, 10) : undefined;
111+
resetTimeout();
112+
tick();
113+
$scope.isRunning = false;
114+
$scope.clear();
115+
};
116+
103117
$element.bind('$destroy', function () {
104118
resetTimeout();
105119
$scope.isRunning = false;

‎examples/angularjs-reset-timer

Lines changed: 88 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,88 @@
1+
<!DOCTYPE html>
2+
<html ng-app="doUI">
3+
4+
<head>
5+
<title>AngularJS Example - Reset Countdown</title>
6+
<script src="../bower_components/angular/angular.min.js"></script>
7+
<script src="../app/js/timer.js"></script>
8+
9+
<style>
10+
#ui ul {
11+
margin: 0;
12+
display: inline-block;
13+
list-style-type: none;
14+
width: 33%;
15+
float: left;
16+
font-family: myriad pro;
17+
}
18+
li {
19+
margin: 10px 0;
20+
padding: 5px;
21+
color: #333;
22+
}
23+
li.control {
24+
cursor: pointer;
25+
background-color: aliceblue;
26+
}
27+
</style>
28+
<script>
29+
angular.module('doUI', ['timer']);
30+
31+
function doController($scope) {
32+
33+
$scope.timerRunning = true;
34+
var timeStarted = false;
35+
$scope.countdownVal = 900;
36+
37+
$scope.startClock = function() {
38+
if (!timeStarted) {
39+
$scope.$broadcast('timer-start');
40+
$scope.timerRunning = true;
41+
timeStarted = true
42+
} else if ((timeStarted) && (!$scope.timerRunning)) {
43+
$scope.$broadcast('timer-resume');
44+
$scope.timerRunning = true;
45+
}
46+
47+
};
48+
49+
$scope.stopClock = function() {
50+
if ((timeStarted) && ($scope.timerRunning)) {
51+
$scope.$broadcast('timer-stop');
52+
$scope.timerRunning = false;
53+
}
54+
55+
};
56+
57+
$scope.resetClock = function() {
58+
if ((!$scope.timerRunning))
59+
$scope.$broadcast('timer-reset');
60+
}
61+
62+
$scope.$on('timer-stopped', function(event, data) {
63+
timeStarted = true;
64+
});
65+
}
66+
67+
doController.$inject = ['$scope'];
68+
</script>
69+
</head>
70+
71+
<body ng-controller="doController">
72+
<div id="ui">
73+
<ul class="timerNew">
74+
<li>
75+
<timer interval="1000" countdown="countdownVal" autostart="false">{{millis | date:'mm:ss'}}</timer>
76+
</li>
77+
78+
<li ng-click="startClock()" ng-disabled="timerRunning" class="control">Start/Resume</li>
79+
<li ng-click="stopClock()" ng-disabled="!timerRunning" class="control">Stop</li>
80+
<li ng-click="resetClock()" class="control">Reset</li>
81+
82+
</ul>
83+
84+
85+
</div>
86+
</body>
87+
88+
</html>

0 commit comments

Comments
 (0)