README.md
· 704 B · Markdown
Raw
# Twitch clip datetime userscript
A userscript for displaying the actual date & time (relative to local time) of when a Twitch clip was created.
## Requirements:
- Something like the [Tampermonkey](https://www.tampermonkey.net/) extension installed for your browser.
## Installation:
1. Install a userscript extension (such as [Tampermonkey](https://www.tampermonkey.net/)).
2. Click on the ['Raw' button](https://gist.github.com/Decicus/ec4745e680e06cfff5b1fa0a53fcff72/raw/twitch-clips-datetime.user.js) top-right when Tampermonkey is installed, and it will prompt you to install the userscript.
## Screenshot:
Twitch clip datetime userscript
A userscript for displaying the actual date & time (relative to local time) of when a Twitch clip was created.
Requirements:
- Something like the Tampermonkey extension installed for your browser.
Installation:
- Install a userscript extension (such as Tampermonkey).
- Click on the 'Raw' button top-right when Tampermonkey is installed, and it will prompt you to install the userscript.
Screenshot:
twitch-clips-datetime.user.js
· 1.3 KiB · JavaScript
Raw
// ==UserScript==
// @name Twitch Clips - Show date & time
// @version 0.2
// @description Displays the actual date & time of when a clip was created, instead of the useless "xxx days/months/weeks ago"
// @author Decicus
// @match https://clips.twitch.tv/*
// ==/UserScript==
(async function() {
'use strict';
const slug = window.location.href.match(/https\:\/\/clips\.twitch\.tv\/([A-z0-9]+)/m)[1];
if (!slug) {
return;
}
const response = await fetch(`https://api.twitch.tv/kraken/clips/${slug}`, {
headers: {
Accept: 'application/vnd.twitchtv.v5+json',
'Client-ID': 'zs377ogpzz01ogfx26pvbddx9jodg1',
},
});
const data = await response.json();
if (!data.created_at) {
return;
}
const created = new Date(data.created_at);
const dateAndTime = created.toLocaleString();
const box = document.getElementsByClassName('clips-chat-info tw-align-items-start tw-flex tw-flex-column tw-flex-grow-1 tw-flex-shrink-1 tw-justify-content-center tw-lg-mg-y-2 tw-mg-t-1');
const element = document.createElement('div');
element.innerHTML = `<span class="tw-font-size-5 tw-strong">Clip created:</span><br /><span>${dateAndTime}</span>`;
box[0].appendChild(element);
})();
| 1 | // ==UserScript== |
| 2 | // @name Twitch Clips - Show date & time |
| 3 | // @version 0.2 |
| 4 | // @description Displays the actual date & time of when a clip was created, instead of the useless "xxx days/months/weeks ago" |
| 5 | // @author Decicus |
| 6 | // @match https://clips.twitch.tv/* |
| 7 | // ==/UserScript== |
| 8 | |
| 9 | (async function() { |
| 10 | 'use strict'; |
| 11 | |
| 12 | const slug = window.location.href.match(/https\:\/\/clips\.twitch\.tv\/([A-z0-9]+)/m)[1]; |
| 13 | |
| 14 | if (!slug) { |
| 15 | return; |
| 16 | } |
| 17 | |
| 18 | const response = await fetch(`https://api.twitch.tv/kraken/clips/${slug}`, { |
| 19 | headers: { |
| 20 | Accept: 'application/vnd.twitchtv.v5+json', |
| 21 | 'Client-ID': 'zs377ogpzz01ogfx26pvbddx9jodg1', |
| 22 | }, |
| 23 | }); |
| 24 | |
| 25 | const data = await response.json(); |
| 26 | |
| 27 | if (!data.created_at) { |
| 28 | return; |
| 29 | } |
| 30 | |
| 31 | const created = new Date(data.created_at); |
| 32 | const dateAndTime = created.toLocaleString(); |
| 33 | |
| 34 | const box = document.getElementsByClassName('clips-chat-info tw-align-items-start tw-flex tw-flex-column tw-flex-grow-1 tw-flex-shrink-1 tw-justify-content-center tw-lg-mg-y-2 tw-mg-t-1'); |
| 35 | const element = document.createElement('div'); |
| 36 | element.innerHTML = `<span class="tw-font-size-5 tw-strong">Clip created:</span><br /><span>${dateAndTime}</span>`; |
| 37 | |
| 38 | box[0].appendChild(element); |
| 39 | })(); |