diff options
Diffstat (limited to 'BrowserSource/index.html')
| -rw-r--r-- | BrowserSource/index.html | 114 |
1 files changed, 0 insertions, 114 deletions
diff --git a/BrowserSource/index.html b/BrowserSource/index.html deleted file mode 100644 index 573fdcc..0000000 --- a/BrowserSource/index.html +++ /dev/null @@ -1,114 +0,0 @@ -<!DOCTYPE html> -<html> - <head> - <title>TaSTT</title> - <script src="https://code.jquery.com/jquery-3.6.3.min.js"></script> - <link rel="stylesheet" - href="https://fonts.googleapis.com/css?family=Noto+Sans+Mono&display=swap"> - </head> - <style> - body { - font-family: 'Noto Sans Mono', monospace; - font-size: 96px; - font-weight: 3200; - /* xdd */ - /* https://stackoverflow.com/a/55097644 */ - text-shadow: 0.0px 10.0px 0.02px #000, 9.8px 2.1px 0.02px #000, 4.2px - -9.1px 0.02px #000, -8.0px -6.0px 0.02px #000, -7.6px 6.5px 0.02px - #000, 4.8px 8.8px 0.02px #000, 9.6px -2.8px 0.02px #000, -0.7px -10.0px - 0.02px #000, -9.9px -1.5px 0.02px #000, -3.5px 9.4px 0.02px #000, 8.4px - 5.4px 0.02px #000, 7.1px -7.0px 0.02px #000, -5.4px -8.4px 0.02px #000, - -9.4px 3.5px 0.02px #000, 1.4px 9.9px 0.02px #000, 10.0px 0.8px 0.02px - #000, 2.9px -9.6px 0.02px #000, -8.7px -4.8px 0.02px #000, -6.6px 7.5px - 0.02px #000, 5.9px 8.0px 0.02px #000, 9.1px -4.1px 0.02px #000, -2.1px - -9.8px 0.02px #000, -10.0px -0.1px 0.02px #000, -2.2px 9.8px 0.02px #000, - 9.1px 4.2px 0.02px #000, 6.1px -8.0px 0.02px #000, -6.5px -7.6px 0.02px - #000, -8.8px 4.7px 0.02px #000, 2.7px 9.6px 0.02px #000, 10.0px -0.6px - 0.02px #000, 1.5px -9.9px 0.02px #000, -9.3px -3.6px 0.02px #000, -5.5px - 8.4px 0.02px #000, 7.0px 7.2px 0.02px #000, 8.5px -5.3px 0.02px #000, - -3.4px -9.4px 0.02px #000, -9.9px 1.3px 0.02px #000, -0.8px 10.0px 0.02px - #000, 9.6px 2.9px 0.02px #000, 4.9px -8.7px 0.02px #000, -7.5px -6.7px - 0.02px #000, -8.1px 5.9px 0.02px #000, 4.0px 9.2px 0.02px #000, 9.8px - -2.0px 0.02px #000, 0.2px -10.0px 0.02px #000, -9.7px -2.3px 0.02px #000, - -4.3px 9.0px 0.02px #000, 7.9px 6.1px 0.02px #000; - } - .transcript { - color: white; - } - .preview { - color: white; - opacity: 0.65; - } - .red_circle { - height: 50px; - width: 50px; - background-color: red; - border-radius: 50%; - display: inline-block; - vertical-align: middle; - margin: 20px; - } - .grey_circle { - height: 50px; - width: 50px; - background-color: grey; - border-radius: 50%; - display: inline-block; - vertical-align: middle; - margin: 20px; - } - </style> - <body> - <div id="content"></div> - <script> - function scrollToBottom() { - window.scrollTo(0, document.body.scrollHeight); - } - - function getTranscript() { - const host = window.location.hostname; - const port = window.location.port; - $.ajax({ - url: `http://${host}:${port}/api/v0/transcript`, - method: 'GET', - dataType: 'json', - success: function (data) { - // dirty hack: create a bunch of invisible content to push the - // transcript down the bottom - var transcriptHtml = '<span class="transcript" style="opacity: 0">' - + '___ '.repeat(128) + '</span>'; - data.commits.forEach(function (commit, index) { - let age = data.ts - commit.ts; - let min_age_s = 5.0; - let max_age_s = 60.0; - let opacity = 1.0 - (age - min_age_s) / (max_age_s - min_age_s); - opacity = Math.max(0, opacity); - opacity = Math.min(1, opacity); - transcriptHtml += `<span class="transcript" style="opacity: ${opacity};">${commit.delta.trim() + ' '}</span>`; - }); - - // Append the preview with full opacity if it exists - if (data.preview && data.preview.preview) { - transcriptHtml += `<span class="preview" style="opacity: 1;">${data.preview.preview}</span>`; - } - - // Create the circle indicator - var circleHtml = data.preview.preview ? - '<span class="red_circle"></span>' : - '<span class="grey_circle"></span>'; - - $('#content').html(transcriptHtml + circleHtml); - $('#content').css("background-color", "#22222280"); - }, - error: function (jqXHR, textStatus, errorThrown) { - console.error('Error getting transcript: ', textStatus, errorThrown); - } - }); - scrollToBottom(); - } - - setInterval(getTranscript, /*interval_ms=*/100); - </script> - - </body> -</html> |
