The currently displayed code is:
This will display a countdown timer. However, it is based on a specific time based on the location of the user.
Instead, we'd like to see a hard date for Pacific Time (PST) time. The countdown will show the same amount regardless of your location in the world.
The js code is as follows.
$ (Function ()
{
var countDownClock =
{
iniClock: function (date)
{
// Calculation of days, hours, minutes and seconds until today.
date = date.split (& # 39;: & # 39;);
toDate = new date (date[0], Date[1]-1 date[2], Date[3], Date[4], Date[5]);
var currentDate = new date ();
dateDif = toDate - currentDate;
daysCount = (& # 39; 0000 & # 39;) + Math.abs (Math.floor ((dateDif) / (1000 * 60 * 60 * 24)))). Slice (-4),
hoursCount = (& # 39; 00 & # 39;) + Math.abs (Math.floor (date[3] - currentDate.getHours ()))). slice (-2),
minuteCount = (& # 39; 00 & # 39;) + Math.abs (Math.floor (Date[4]-currentDate.getMinutes ()))). slice (-2),
secondCount = (& # 39; + Math.abs (Math.floor (Date[5]-currentDate.getSeconds ()))). slice (-2),
ticksCount = Math.round (dateDif / 1000);
if (date[3] - currentDate.getHours () <0)
{
hoursCount = (& # 39; 00 & # 39; + (24 - parseInt (hoursCount))). slice (-2);
}
if (date[4] - currentDate.getMinutes () <0)
{
hoursCount = (& # 39; 00 & # 39; + (parseInt (hoursCount) - 1)). slice (-2);
minuteCount = (& # 39; 00 & # 39; + (60 - parseInt (minuteCount))). slice (-2);
if (number of hours <0)
{
hoursCount = (& # 39; 00 & # 39; + (24 + parseInt (hoursCount))). slice (-2);
}
}
if (date[5] - currentDate.getSeconds () <0)
{
minuteCount = (& # 39; 00 & # 39; + (parseInt (minuteCount - 1))). slice (-2);
secondCount = (& # 39; 00 & # 39; + (60 - parseInt (secondCount))). slice (-2);
if (minuteCount <0)
{
hoursCount = (& # 39; 00 & # 39; + (parseInt (hoursCount) - 1)). slice (-2);
minuteCount = (& # 39; 00 & # 39; + (60 + parseInt (minuteCount))). slice (-2);
}
if (number of hours <0)
{
hoursCount = (& # 39; 00 & # 39; + (24 + parseInt (hoursCount))). slice (-2);
}
}
var second = secondCount.charAt (1),
tenSecond = secondCount.charAt (0),
minute = minuteCount.charAt (1),
tenMinute = minuteCount.charAt (0),
hour = hoursCount.charAt (1),
tenHour = hoursCount.charAt (0),
day = daysCount.charAt (3),
tenDay = daysCount.charAt (2),
hunDay = daysCount.charAt (1),
thosDay = daysCount.charAt (0),
secondBefore = second - 1,
tenSecondBefore = tenSecond - 1,
minute before = minute - 1,
tenMinuteBefore = tenMinute - 1,
Hour before = hour - 1,
tenHourBefore = tenHour - 1,
dayBefore = day - 1,
tenDayBefore = tenDay - 1,
hunDayBefore = hunDay - 1,
thosDayBefore = thosDay - 1,
container = $ (& # 39;& # 39),
dayContainer = $ (& # 39;& # 39),
thosDayBlk = $ (& # 39;& # 39),
hunDayBlk = $ (& # 39;& # 39),
tenDayBlk = $ (& # 39;& # 39),
dayBlk = $ (& # 39;& # 39),
tenHourBlk = $ (& # 39;& # 39),
hourBlk = $ (& # 39;& # 39)
tenMinuteBlk = $ (& # 39;& # 39),
minuteBlk = $ (& # 39;& # 39)
tenSecondBlk = $ (& # 39;& # 39),
secondBlk = $ (& # 39;& # 39),
itemTmp = & # 39;-
& # 39 ;;
if (dateDif <0)
{
Second = ten seconds = minute = ten minutes = hour = ten hours = day = ten days = hunDay = thos = 0;
}
if (second <= 0)
secondBefore = 9;
if (tenSecond <= 0)
tenSecondBefore = 5;
if (minute <= 0)
minuteBefore = 9;
if (ten minutes <= 0)
tenMinuteBefore = 5;
if (hour <= 0)
hourBefore = 5;
if (tenhours <= 0)
tenHourBefore = 2;
if (day <= 0)
dayBefore = 9;
if (tenDay <= 0)
tenDayBefore = 9;
if (hunDay <= 0)
hunDayBefore = 9;
if (thosDay <= 0)
thosDayBefore = 9;
// create html structure
$ (& # 39; countDownClock & # 39;). attach (container);
dayContainer.prependTo (container) .append (dayBlk) .append (tenDayBlk) .append (hunDayBlk) .append (thosDayBlk);
for (var i = 0, flip = dayContainer.find (& # 39; flip & # 39;); i < flip.length; i++)
{
var curFlip = flip.eq(i);
for (var j = 9; j >= 0; J--)
{
curFlip.append (Mustache.to_html (itemTmp, {num: j}));
}
}
container.append (tenHourBlk);
for (var j = 2; j> = 0; j--)
{
tenHourBlk.append (Mustache.to_html (itemTmp, {num: j}));
}
container.append (hourBlk);
for (var j = 9; j> = 0; j--)
{
hourBlk.append (Mustache.to_html (itemTmp, {num: j}));
}
for (var j = 3; j> = 0; j--)
{
hourBlk.append (Mustache.to_html (itemTmp, {num: j}));
}
container.append (tenMinuteBlk);
for (var j = 5; j> = 0; j--)
{
tenMinuteBlk.append (Mustache.to_html (itemTmp, {num: j}));
}
container.append (minuteBlk);
for (var j = 9; j> = 0; j--)
{
minuteBlk.append (Mustache.to_html (itemTmp, {num: j}));
}
container.append (tenSecondBlk);
for (var j = 5; j> = 0; j--)
{
tenSecondBlk.append (Mustache.to_html (itemTmp, {num: j}));
}
container.append (secondBlk);
for (var j = 9; j> = 0; j--)
{
secondBlk.append (Mustache.to_html (itemTmp, {num: j}));
}
// set timer
$ (& # 39 ;, countDownClock .flip.secondPlay li: nth-child (& # 39; + (10 - secondBefore) + & # 39;) & # 39;). addClass (& # 39; pre-before & # 39;);
$ (& # 39 ;, countDownClock.flip.secondPlay li: nth-child (& # 39; + (10-second) + & # 39;) & # 39;). addClass (& # 39; pre-active & # 39;);
$ (& # 39 ;, countDownClock .flip.tensecondPlay li: nth-child (& # 39; + (6-thSecondBefore) + & # 39;) & # 39;). addClass (& # 39; pre-before-before & # 39;);
$ (& # 39 ;, countDownClock .flip.tensecondPlay li: nth-child (& # 39; + (6thSecond) + & # 39;) & # 39;). addClass (& # 39; pre-active & # 39;);
$ (& # 39; countDownClock .flip.minutePlay li: nth-child (& # 39; + (10 - minuteBefore) + & # 39;) & # 39;). addClass (& # 39; pre before & # 39;);
$ (& # 39; countDownClock .flip.minutePlay li: nth-child (& # 39; + (10 minutes) + & # 39;) & # 39;). addClass (& # 39; pre-active & # 39;);
$ (& # 39; countDownClock .flip.tenminutePlay li: nth-child (& # 39; + (6-thminuteBefore) + & # 39;) & # 39;). addClass (& # 39; pre-before-before & # 39;);
$ (& # 39; countDownClock .flip.tenminutePlay li: nth-child (& # 39; + (6th-minute) + & # 39;) & # 39;). addClass (& # 39; pre-active & # 39;);
$ (& # 39; countDownClock .flip.hourPlay li: nth-child (& # 39; + (10-hourBefore) + & # 39;) & # 39;). addClass (& # 39; pre-before & # 39;);
$ (& # 39; countDownClock.flip.hourPlay li: nth-child (& # 39; + (10-hour) + & # 39;) & # 39;). addClass (& # 39; pre-active & # 39;);
$ (& # 39 ;, countDownClock .flip.tenhourPlay li: nth-child (& # 39; + (3 - tenHourBefore) + & # 39;) & # 39;). addClass (& # 39; pre-before-before & # 39;);
$ (& # 39; countDownClock .flip.tenhourPlay li: nth-child (& # 39; + (3-tenHour) + & # 39;) & # 39;). addClass (& # 39; pre-active & # 39;);
$ (& # 39 ;, countDownClock .flip.dayPlay li: nth-child (& # 39; + (10-dayBefore) + & # 39;) & # 39;). addClass (& # 39; pre before & # 39;);
$ (& # 39; countDownClock .flip.dayPlay li: nth-child (& # 39; + (10-day) + & # 39;) & # 39;). addClass (& # 39; pre-active & # 39;);
$ (# CountDownClock.flip.tendayPlay li: nth-child (& # 39; + (10-thDayBefore) + & # 39;) & # 39;). addClass (& # 39; pre-before-before & # 39;);
$ (& # 39; countDownClock.flip.tendayPlay li: nth-child (& # 39; + (10-thDay) + & # 39;) & # 39;). addClass (& # 39; pre-active & # 39;);
$ (& # 39 ;, countDownClock .flip.hundayPlay li: nth-child (& # 39; + (10 - hunDayBefore) + & # 39;) & # 39;). addClass (& # 39; pre-before-before & # 39;);
$ (& # 39; countDownClock.flip.hundayPlay li: nth-child (& # 39; + (10-hunDay) + & # 39;) & # 39;). addClass (& # 39; pre-active & # 39;);
$ (& # 39 ;, countDownClock .flip.thosdayPlay li: nth-child (& # 39; + (10 - thosDayBefore) + & # 39;) & # 39;). addClass (& # 39; pre-before-before & # 39;);
$ (& # 39 ;, countDownClock.flip.thosdayPlay li: nth-child (& # 39; + (10-thosDay) + & # 39;) & # 39;). addClass (& # 39; pre-active & # 39;);
// hide days-blk if 0
if (thosDay == 0)
{
container.css (
Width width #, container.width () - dayBlk.width () - (parseInt (dayBlk.css (& margin #)) * 2)
);
thosDayBlk.hide ();
}
if (hunDay == 0 && thosDay == 0)
{
container.css (
Width width #, container.width () - dayBlk.width () - (parseInt (dayBlk.css (& margin #)) * 2)
);
hunDayBlk.hide ();
}
if (tenDay == 0 && thosDay == 0 && hunDay == 0)
{
container.css (
Width width #, container.width () - dayBlk.width () - (parseInt (dayBlk.css (& margin #)) * 2)
);
tenDayBlk.hide ();
}
if (day == 0 && thosDay == 0 && hunDay == 0 && tenDay == 0)
{
container.css (
Width width #, container.width () - dayBlk.width () - (parseInt (dayBlk.css (& margin #)) * 2)
);
dayBlk.hide ();
dayContainer.hide ();
}
if (dateDif> 0)
{
clockTick = setInterval (function ()
{
ticksCount--;
if (ticksCount> = 0)
countDownClock.countChange (secondBlk);
otherwise
{
if ($ (& # 39; countDownClock .secondPlay .active .inn & # 39;). html ()! = & # 39; 0 & # 39;)
countDownClock.countChange (secondBlk);
otherwise
clearInterval (clockTick);
}
}, 1000);
}
},
countChange: Function (Flip)
{
$ ("body"). removeClass ("play");
var aa = flip.find (& # 39; li.active & # 39;)
if (aa.html () == undefined)
{
aa = flip.find ("li.pre-active");
aa.removeClass (& # 39; pre-active & # 39;);
flip.find ("li.pre-before"). removeClass (& # 39; pre-before-before & # 39;);
}
if (aa.parent (). hasClass (& # 39; hourPlay & # 39;) && aa.is (": nth-child (10)"))
{
var bb = flip.prev (). find (& # 39; li.active & # 39;);
if (bb.html () == undefined)
bb = flip.prev (). find (# li.pre-active #);
$ (". countDownClock ul.hourPlay li"). removeClass ("before");
aa.addClass ("before"). removeClass ("active");
if (bb.is (": last-child")) {
aa = $ (". countDownClock ul.hourPlay li"). eq (10);
}
otherwise
{
aa = $ (". countDownClock ul.hourPlay li"). eq (0);
}
aa.addClass ("active")
.closest ("body")
.addClass ("play");
// shit something to find the previous clock block
prevFlip = flip.prev ();
if (! prevFlip.hasClass (& # 39; flip & # 39;) && prevFlip.length> 0)
prevFlip = prevFlip.prev (& # 39; & # 39;);
if (prevFlip.length> 0)
countDownClock.countChange (prevFlip);
}
else if (aa.is (": last-child"))
{
flip.find (& # 39; li & # 39;). removeClass ("before");
aa.addClass ("before"). removeClass ("active");
aa = flip.find ("li"). eq (0);
aa.addClass ("active")
.closest ("body")
.addClass ("play");
// shit something to find the previous clock block
if (flip.hasClass (& # 39; days & # 39;))
{
prevFlip = flip.next ();
}
otherwise
{
prevFlip = flip.prev ();
if (prevFlip.hasClass (& # 39; day-container & # 39;))
{
prevFlip = prevFlip.find (& # 39;. flip.dayPlay & # 39;);
}
}
if (prevFlip.length> 0)
countDownClock.countChange (prevFlip);
}
otherwise
{
flip.find (& # 39; li & # 39;). removeClass ("before");
aa.addClass ("before")
.removeClass ("active")
.next ("li")
.addClass ("active")
.closest ("body")
.addClass ("play");
}
}
}
countDownClock.iniClock ($ (# countDownClock) # attr (# data-to-date #);); // YYYY: MM: DD: hh: mm: ss
});