-
-
Save jakchagu/a36acca6be8550ac3b72661c87f08d80 to your computer and use it in GitHub Desktop.
OBS Studio: A HTML page for showing current date and time in the video + Time Zones
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!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.24.0/moment.min.js'></script> | |
| <script src='https://cdnjs.cloudflare.com/ajax/libs/moment-timezone/0.5.28/moment-timezone-with-data.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() { | |
| if (urlParams["tz"]) output.innerText = moment().tz(urlParams["tz"]).format(urlParams["format"] || ''); | |
| else output.innerText = output.innerText = moment().format(urlParams["format"] || ''); | |
| }, 1000); | |
| c(); | |
| </script> | |
| </body> | |
| </html> |
This might be dumb but I can't edit the display output on your fork like I can on the original. I need the tz output as I don't want to use my local time but I can't seem to get the following to work. bold 80px impact; color: white; display: inline-block; border-radius: 5px; padding: 2px 5px; background-color: rgba(0, 0, 0, 0.5)&format=DD MMM YYYY HH:mm:ss;
Essentially I can change either the tz or the display but not both. This is likely a syntax issue but IDK what I am doing wrong.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Forked with ability to change language