need a way to display a count down clock

  • 1
  • Question
  • Updated 2 years ago
  • Answered
I was wondering if anyone had a suggestion on a ap/widget that I could use to display a countdown clock. I would be very appreciative if anyone could share the best way to do this.
Photo of Joy

Joy

  • 290 Points 250 badge 2x thumb

Posted 2 years ago

  • 1
Photo of Shea

Shea, Official Rep

  • 5,188 Points 5k badge 2x thumb
Hi Joy, 

We have a Widget that is available in the Editor called the ComputerAid Countdown Widget. It comes with a free trial so you could try it out and see if it does what you're looking for. 

Thanks,
Shea
Photo of Joy

Joy

  • 290 Points 250 badge 2x thumb
Where can I find that widget?
Photo of Shea

Shea, Official Rep

  • 5,188 Points 5k badge 2x thumb
Here's a GIF showing how to go from a blank Presentation to adding the CountDown Widget. I am using the new Editor to do this which you can access here: https://apps.risevision.com/editor

Steps: 

- Add Presentation
- Select Blank Presentation 
- Add Placeholder
- Size and place as necessary
- Click More 
- Search CountDown
- Click the Widget
- Style as necessary 
- Save and Preview

Hope that helps. 

Thanks!
Photo of Wendi Borden

Wendi Borden, Champion

  • 6,028 Points 5k badge 2x thumb
If you are, or have access to a developer, this one is pretty easy..

http://flipclockjs.com/
Photo of Joy Wildes

Joy Wildes

  • 80 Points 75 badge 2x thumb
I found a developer to make me the countdown clock. But when we added the HTML and java to the HTML widget it only shows up in the widget , but the countdown portion doesn't show up in the preview. Any idea why it doesn't work. He used flipclickjs.com as a stepping off point
Photo of Wendi Borden

Wendi Borden, Champion

  • 6,028 Points 5k badge 2x thumb
Not sure what you mean.. flipclock has always shown up in preview fine for me. So you added the HTML widget and saved your presentation, but you still don't see it? You'd probably need to share some code to help further..

Side note, flipclock is HTML and Javascript not Java.. It's like ham is to hamburger, they're both food but completely different animals ;)
(Edited)
Photo of Joy Wildes

Joy Wildes

  • 80 Points 75 badge 2x thumb
Yes, JavaScript. Just shortened it since I'm in my phone. When I get home I will log in and share the code.
Photo of Wendi Borden

Wendi Borden, Champion

  • 6,028 Points 5k badge 2x thumb
JS is even shorter and more correct since Java is an actual language. If you post some code I don't mind having a look to see if I can help. :)
Photo of Joy

Joy

  • 290 Points 250 badge 2x thumb
So after looking at where I placed the code, I realized I put in in the wrong place. Corrected it and now it seems to work. I will watch it a couple of days and make sure it continues to work
I use a HTML Widget with some javascript I found to display a countdown to Christmas. The full coding is as follows, just change line 103 for a different date and time. Line 5 changes the font and size.

Or go to http://www.ricocheting.com/code/javascript/html-generator/countdown-timer
to create your own.


<!DOCTYPE html><html>
<body>

<h1 style="font-size:300%;font-family:verdana;"><!DOCTYPE html>
<html>
<body>

<script type="text/javascript">
//###################################################################
// Author: ricocheting.com
// Version: v3.0
// Date: 2014-09-05
// Description: displays the amount of time until the "dateFuture" entered below.

var CDown = function() {
this.state=0;// if initialized
this.counts=[];// array holding countdown date objects and id to print to {d:new Date(2013,11,18,18,54,36), id:"countbox1"}
this.interval=null;// setInterval object
}

CDown.prototype = {
init: function(){
this.state=1;
var self=this;
this.interval=window.setInterval(function(){self.tick();}, 1000);
},
add: function(date,id){
this.counts.push({d:date,id:id});
this.tick();
if(this.state==0) this.init();
},
expire: function(idxs){
for(var x in idxs) {
this.display(this.counts[idxs[x]], "Now!");
this.counts.splice(idxs[x], 1);
}
},
format: function(r){
var out="";
if(r.d != 0){out += r.d +" "+((r.d==1)?"day":"days")+", ";}
if(r.h != 0){out += r.h +" "+((r.h==1)?"hour":"hours")+", ";}
out += r.m +" "+((r.m==1)?"min":"mins")+", ";
out += r.s +" "+((r.s==1)?"sec":"secs")+", ";

return out.substr(0,out.length-2);
},
math: function(work){
var y=w=d=h=m=s=ms=0;

ms=(""+((work%1000)+1000)).substr(1,3);
work=Math.floor(work/1000);//kill the "milliseconds" so just secs

y=Math.floor(work/31536000);//years (no leapyear support)
w=Math.floor(work/604800);//weeks
d=Math.floor(work/86400);//days
work=work%86400;

h=Math.floor(work/3600);//hours
work=work%3600;

m=Math.floor(work/60);//minutes
work=work%60;

s=Math.floor(work);//seconds

return {y:y,w:w,d:d,h:h,m:m,s:s,ms:ms};
},
tick: function(){
var now=(new Date()).getTime(),
expired=[],cnt=0,amount=0;

if(this.counts)
for(var idx=0,n=this.counts.length; idx<n; ++idx){
cnt=this.counts[idx];
amount=cnt.d.getTime()-now;//calc milliseconds between dates

// if time is already past
if(amount<0){
expired.push(idx);
}
// date is still good
else{
this.display(cnt, this.format(this.math(amount)));
}
}

// deal with any expired
if(expired.length>0) this.expire(expired);

// if no active counts, stop updating
if(this.counts.length==0) window.clearTimeout(this.interval);

},
display: function(cnt,msg){
document.getElementById(cnt.id).innerHTML=msg;
}
};

window.onload=function(){
var cdown = new CDown();

cdown.add(new Date(2016,11,25,0,00,00), "countbox1");
};
</script>
<div id="countbox1"></div>

</body>
</html>
</h1>

<font face="Comic Sans MS, Comic Sans MS, cursive" size="7"><font color="#274e13">Better</font><font color="#ff0000"> be </font><font color="#274e13">good</font><font color="#ff0000">!!</font></font>
</body>
</html>
Photo of Joy Wildes

Joy Wildes

  • 80 Points 75 badge 2x thumb
I found a developer to create the clock that I wanted, but when he added the HTML and java to the HTML widget it doesn't show up in the preview view. Any idea why? It looks and works right in the widget
Photo of Darius - PRODO.us

Darius - PRODO.us, Champion

  • 26,850 Points 20k badge 2x thumb
Try Web Page widget instead of HTML.
(Edited)