Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
LK1037

countdown formula changed to 'by date'

Recommended Posts

The code below currently runs a countdown based on ## of days in milliseconds.

Instead, now I need this to calculate from a specified date ( Nov 24, 2019 at 10 a.m.) or a date span (Nov 24-31, 2019 at 10 a.m.) PST. 

 

I'm guessing this is the call, but not sure how to integrate it into the existing formula...

new Date('Nov 24, 2019 10:00:00').getTime()

 

Here's our current countdown:

 

// COUNTDOWN BY MILLISECONDS ---------------------------------

var count = { time: 1000 * 60 * 60 * 24};

function setTime() {
  var timeLeft = count.time;
  var days = Math.floor(timeLeft / (1000 * 60 * 60 * 24));
  timeLeft -= days * 1000;
  var hours = Math.floor((timeLeft % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
  timeLeft -= hours * 60 * 60;
  var minutes = Math.floor((timeLeft % (1000 * 60 * 60)) / (1000 * 60));
  timeLeft -= minutes * 60;

 

Thanks to anyone who can lend some insight.

LK

 

Share this post


Link to post
Share on other sites

Hey LK,

 

This isn't really a GSAP question... but new Date('Nov 24, 2019 10:00:00').getTime() returns milliseconds. 1000 * 60 * 60 * 24 is also a representative of milliseconds. Try putting the new milliseconds there instead :) 

Share this post


Link to post
Share on other sites

Thanks for your grace and being willing to wade in anyway — we're still trying to figure out what/where/when/why stuff is supposed to go.

 

So, to your answer, you mean like this?

 

var count = { new Date('Nov 24, 2019 10:00:00').getTime()};

function setTime() {
  var timeLeft = count.time;
  var days = Math.floor(timeLeft / (1000 * 60 * 60 * 24));
  timeLeft -= days * 1000;
  var hours = Math.floor((timeLeft % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
  timeLeft -= hours * 60 * 60;
  var minutes = Math.floor((timeLeft % (1000 * 60 * 60)) / (1000 * 60));
  timeLeft -= minutes * 60;

Share this post


Link to post
Share on other sites

Well, what you have for count isn't a valid JS object. But besides that, yes :) 

 

var count = {time: new Date('Nov 24, 2019 10:00:00').getTime() };

function setTime() {
  var timeLeft = count.time;
  var days = Math.floor(timeLeft / (1000 * 60 * 60 * 24));
  timeLeft -= days * 1000;
  var hours = Math.floor((timeLeft % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
  timeLeft -= hours * 60 * 60;
  var minutes = Math.floor((timeLeft % (1000 * 60 * 60)) / (1000 * 60));
  timeLeft -= minutes * 60;
 
  // Do whatever
  console.log(days, hours, minutes);
}

 

Share this post


Link to post
Share on other sites

Hmm, that blew up the countdown (days, min, hours).

I made a project in codepen so you can see what happend.

I just commented out the original countdown code that displays correctly.

 

https://codepen.io/sgbluq/project/editor/XRpRLq#

 

Ideally, this would countdown to a specified endDate (Nov 24, 2019 10:00:00 PST).

How do we make it only countdown within a specific startDate to endDate?

Share this post


Link to post
Share on other sites

Sorry, I didn't actually look at your function very closely. If you want it to be the time from now until that date, just subtract the current time from the timeLeft: 

 

var timeLeft = count.time - Date.now();

I'm a bit distracted working on GSAP 3 things :) 

Share this post


Link to post
Share on other sites

LOL. No worries — we can't tell the difference yet, it's all just code to us--but we're progressing.

 

Hmm, that really broke it. It seems to start the count correctly, then trails off into chaos. https://codepen.io/sgbluq/project/editor/XRpRLq#

 

I understand you need to focus on other things... can you defer me to the forum I should have posted this on?

Share this post


Link to post
Share on other sites
13 minutes ago, LK1037 said:

Hmm, that really broke it. It seems to start the count correctly, then trails off into chaos.

I'm pretty sure the function is correct. So there must be something else wrong with your project. 

 

FYI your CodePen project isn't working because you didn't load TweenMax. You can view errors by using your browser's console (F12).

 

13 minutes ago, LK1037 said:

can you defer me to the forum I should have posted this on?

StackOverflow is good for general programming questions. But your question is fine for these forums, just not directly related to GSAP :) 

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

  • Recently Browsing   0 members

    No registered users viewing this page.

×