- This topic has 6 replies, 2 voices, and was last updated 9 years ago by .
Having an issue with a counter and the reset button. The issue is I have a START, STOP and RESET button. I also added a “GRAB TIME” button which just gets the counter time and puts it in a textbox.
Everything works, except if I hit STOP, and then RESET, the counter display does not reset to zero….BUT if I click grab time, it shows zero, so the data is resetting correctly, but the counter display doesn’t change – it still shows the time at which I stopped it….
Code below and attached.
<!doctype html>
<html>
<head>
<title>Timer</title>
<script type=”text/javascript” src=”https://code.jquery.com/jquery-1.12.4.min.js”></script>
<link rel=”stylesheet” type=”text/css” href=”pack/counter.pack.css”>
<script type=”text/javascript” src=”pack/counter.pack.js”></script>
<link rel=”stylesheet” type=”text/css” href=”dist/counter.skin.flip.min.css”>
<script type=”text/javascript” src=”dist/counter.skin.flip.min.js”></script>
<script type=”text/javascript”>
jQuery(document).ready(function() {
jQuery(“#my-counter-example”).smartTimerCounter({
skin: “Animated”,
mode: “Clock”,
display: {
style: “crystal-dark”,
labels: “hide”,
hideDots: false,
blinkDots: true,
space: “12px”,
animation: “SlideUp”,
animationSpeed: 800
},
model: {
layout: “h:m:s”
},
});
});
</script>
<script type=”text/javascript”>
jQuery(document).ready(function() {
jQuery(“#my-counter-example2”).smartTimerCounter({
skin: “Flip”,
mode: “Counter”,
display: {
uiOverride: true,
labels: “bottom”,
hideDots: false,
space: “6px”,
ui_days_background: “#00aa00”,
ui_hours_background: “#00aa00”,
ui_minutes_background: “#00aa00”,
ui_seconds_background: “#00aa00”,
ui_width: 30,
ui_height: 50,
ui_color: “#ffffff”,
ui_fontSize: “40px”,
ui_fontWeight: “900”,
ui_labelColor: “#000000”,
ui_labelFontSize: “18px”
},
model: {
layout: “h|m:s”,
method: “target”,
value: 9999999,
startValue: 0
}
});
});
</script>
<script>
function secondsToHms(d) {
d = Number(d);
var h = Math.floor(d / 3600);
var m = Math.floor(d % 3600 / 60);
var s = Math.floor(d % 3600 % 60);
return (‘0’ + h).slice(-2) + “:” + (‘0’ + m).slice(-2) + “:” + (‘0’ + s).slice(-2);
}
function getTheTime(){
var myTS = jQuery(“#my-counter-example2”).smartTimerCounter(“get”, “timestamp”);
document.getElementById(“mytime”).value=secondsToHms(myTS/1000);
}
</script>
</head>
<body>
<p> </p>
<p> </p>
<p> </p>
<input type=”button” value=”Stop” data-method=”stop” />
<input type=”button” value=”Start” data-method=”start” />
<input type=”button” value=”Reset” data-method=”reset” />
<input type=”button” value=”GRAB TIME” onClick=”getTheTime();” />
<p> </p>
<script type=”text/javascript”>
jQuery(document).ready(function() {
jQuery(“#stac-event-info input[type=button]”).click(function(e){
var method = jQuery(this).data(“method”);
if (method === “start”) {
jQuery(“#my-counter-example2”).smartTimerCounter(“start”);
} else if (method === “stop”) {
jQuery(“#my-counter-example2”).smartTimerCounter(“stop”);
} else if (method === “reset”) {
jQuery(“#my-counter-example2”).smartTimerCounter(“reset”);
}
});
});
</script>
</body>
</html>
- The topic ‘Reset button Problems’ is closed to new replies.
