Skip to content

Instantly share code, notes, and snippets.

@vaginessa

vaginessa/countdown.html

Forked from timiles/countdown.html
Created June 26, 2018 19:43
Show Gist options
  • Save vaginessa/e949150db458ee1a08abaa4e5bcd3ad8 to your computer and use it in GitHub Desktop.
Save vaginessa/e949150db458ee1a08abaa4e5bcd3ad8 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
countdown.html
<!doctype html>
<html ng-app>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.10/angular.min.js"></script>
<script src="http://www.cornify.com/js/cornify.js"></script>
<style>
#cornifycount {
display: none;
}
#seconds {
font-family: "Comic Sans MS";
font-size: 16em;
width: 100%;
text-align: center;
z-index: 100;
color: HotPink;
/* http://mothereffingtextshadow.com/ */
text-shadow: 0 1px 0 #ccc, 0 2px 0 #c9c9c9, 0 3px 0 #bbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaa, 0 6px 1px rgba(0,0,0,.1), 0 0 5px rgba(0,0,0,.1), 0 1px 3px rgba(0,0,0,.3), 0 3px 5px rgba(0,0,0,.2), 0 5px 10px rgba(0,0,0,.25), 0 10px 10px rgba(0,0,0,.2), 0 20px 20px rgba(0,0,0,.15);
}
.corn-behind {
z-index: -1 !important;
}
</style>
</head>
<body>
<div ng-controller="CountdownController" style="z-index: 100">
<p id="seconds">{{seconds}}</p>
</div>
<script>
var birthDateTime = new Date("13 Oct 1982 17:31");
var cornsToShow = 5;
var cornCount = 0;
var targetSeconds = 2000000000; // looking forward to 2 billion seconds now
function CountdownController($scope, $timeout) {
$scope.onTimeout = function () {
$scope.now = new Date();
var seconds = Math.floor(($scope.now - birthDateTime) / 1000);
$scope.seconds = seconds.toLocaleString();
cornify_add();
if (seconds < targetSeconds && cornCount >= cornsToShow) {
$("img:not(.corn-behind)").addClass("corn-behind").parent("div").addClass("corn-behind");
$("img").first().remove();
}
cornCount++;
$timeout($scope.onTimeout, 1000);
}
$timeout($scope.onTimeout, 1000);
}
addEventListener("click", function () {
var el = document.documentElement;
var rfs = el.requestFullScreen
|| el.webkitRequestFullScreen
|| el.mozRequestFullScreen;
rfs.call(el);
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment