-
-
Save sam0737/a0ee8ca253fc5c84b2aa2ac018f7b8ad to your computer and use it in GitHub Desktop.
<!DOCTYPE html> | |
<html> | |
<head> | |
<meta charset="UTF-8"> | |
<title>A simple clock</title> | |
</head> | |
<body translate="no" > | |
<div id="output"></div> | |
<script src='https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js'></script> | |
<script> | |
// https://stackoverflow.com/questions/901115/how-can-i-get-query-string-values-in-javascript | |
var urlParams; | |
(function () { | |
var match, | |
pl = /\+/g, // Regex for replacing addition symbol with a space | |
search = /([^&=]+)=?([^&]*)/g, | |
decode = function (s) { return decodeURIComponent(s.replace(pl, " ")); }, | |
query = window.location.search.substring(1); | |
urlParams = {}; | |
while (match = search.exec(query)) | |
urlParams[decode(match[1])] = decode(match[2]); | |
})(); | |
var output = document.getElementById("output"); | |
if (urlParams["style"]) output.setAttribute("style", urlParams["style"]); | |
if (urlParams["bodyStyle"]) document.body.setAttribute("style", urlParams["bodyStyle"]); | |
var c; | |
setInterval( | |
c = function() { | |
output.innerText = moment().format(urlParams["format"] || ''); | |
}, 1000); | |
c(); | |
</script> | |
</body> | |
</html> |
Rawgit is shutting down soon. Here is an alternative link:
https://gistcdn.githack.com/sam0737/a0ee8ca253fc5c84b2aa2ac018f7b8ad/raw/94af10ef67d6c7e48295efaa43cdd2847d2fd884/clock.html
Added time zone selection functionality in my fork. Thanks to sam0703 for the initial project!
Does this still work?
Does this still work?
Yes. The code does. Rawgit may not be useable. See @SJP176's comment above.
this how can change the font?
Hey is it just me or does this not work anymore? I can't style it at all.
EDIT: I see the clock in this format - 2021-10-04T22:24:30-04:00
EDIT2: Use the one linked by SJP176.
The style is unavailable now?
Hey is it just me or does this not work anymore? I can't style it at all.
EDIT: I see the clock in this format - 2021-10-04T22:24:30-04:00 EDIT2: Use the one linked by SJP176.
thanks for asking this question & then posting your answer, @JonJaded -- and thanks for the fix, @SJP176 (um, 20 months ago... :))
Rawgit is shutting down soon. Here is an alternative link: https://gistcdn.githack.com/sam0737/a0ee8ca253fc5c84b2aa2ac018f7b8ad/raw/94af10ef67d6c7e48295efaa43cdd2847d2fd884/clock.html
Working perfectly. Much thanks!
I ended up pasting the URL from SJP176 plut the old text formatting. Otherwise I get the YY-MM-DDTHH:MM:SS-04:00 format.
https://gistcdn.githack.com/sam0737/a0ee8ca253fc5c84b2aa2ac018f7b8ad/raw/94af10ef67d6c7e48295efaa43cdd2847d2fd884/clock.html?style=font: bold 30px monospace; color: blue; display: inline-block; border-radius: 5px; padding: 2px 5px;&format=YYYY-MM-DD HH:mm:ss
Working pretty well now. Thanks.
THANK YOU. AWESOME
Lol, before noticing these comments, I found a partial workaround: using OBS "browser" plugin "custom CSS" field to set the font size and color (e.g. body { background-color: rgba(0, 0, 0, 0.5); margin: 0px 5px; overflow: hidden; font-size: 50px; color: lightgray }
), although I was not able to change the time format that way (so it was still YYYY-MM-DD etc.).
Learning that just replacing "cdn.rawgit.com" with "gistcdn.githack.com" in the original URLs fixed them has been a relief! Thank you @SJP176 !
Wondering if something would be broken (as it looks like the URLs may refer to specific github commits?) in case @sam0737 updates the instruction page with the new URLs... [UPDATE: Probably not... the instructions are just in a comment. So, unless github prevents from editing older posts, he should be able to update the instructions without breaking anything at all!]
Rawgit URL is dead now, it's no longer accessible, so you have to use a different URL to get the clock.
Here is a working clock:
https://bl.ocks.org/nidefawl/raw/45ce917404c58f913ae9563c126b53cc/?raw=true
I want it to display fractional seconds, but, I can't get it to work. Is there any way to have an refresh rate or auto-update function?
Hi! I've been trying to do a local version of the this saved as a HTML file which you modify in an editor then load up as a local file in Browser source. I've forked this with the changes I've made, but for some reason border-radius isn't working. Any ideas?
Image
My fork