diff --git a/assets/api.js b/assets/api.js deleted file mode 100644 index 5c7631f..0000000 --- a/assets/api.js +++ /dev/null @@ -1,104 +0,0 @@ -document.addEventListener('contextmenu', function(event) { - event.preventDefault(); -}); -async function fetchTemperature() { - const response = await fetch('https://language.apis.zhr1.infra.elia.network/v2/infra/temperature'); - return response.text(); -} -async function fetchAndDisplay() { - const responseDiv = document.querySelector('.response'); - const statsDiv = document.querySelector('.stats'); - let buffer = ""; - let charCount = 0; - let startTime = performance.now(); - let initialText = responseDiv.textContent; - const eraseDelay = 100; - const printDelay = 50; - const statsEraseDelay = 15; - const statsPrintDelay = 30; - let lastTemperature = "..."; - let lastTemperatureUpdateTime = 0; - const response = await fetch('https://language.apis.zhr1.infra.elia.network/v2/text/generate'); - const reader = response.body.getReader(); - const decoder = new TextDecoder('utf-8'); - while (initialText.length > 0) { - initialText = initialText.slice(0, -1); - responseDiv.textContent = initialText; - await new Promise(resolve => setTimeout(resolve, eraseDelay)); - } - async function updateStatsAndTemperature() { - statsDiv.style.display = 'block'; - let currentTime = (performance.now() - startTime) / 1000; - let charsPerSecond = charCount / currentTime; - if (currentTime - lastTemperatureUpdateTime >= 3) { - try { - lastTemperature = await fetchTemperature(); - lastTemperatureUpdateTime = currentTime; - } catch (error) { - lastTemperature = "..."; - } - } - statsDiv.textContent = `${charsPerSecond.toFixed(1)} chars/s, ${charCount} chars, ${currentTime.toFixed(1)}s, Temp: ${lastTemperature}°C`; - } - async function appendTextSmoothly(textPart) { - buffer += textPart; - while (buffer.length > 0) { - let pos = buffer.indexOf('**'); - if (pos === 0) { - let endPos = buffer.indexOf('**', 2); - if (endPos !== -1) { - responseDiv.innerHTML += '' + buffer.substring(2, endPos) + ''; - buffer = buffer.slice(endPos + 2); - } else { - break; - } - } else { - let nextPos = pos !== -1 ? pos : buffer.length; - for (let i = 0; i < nextPos; i++) { - responseDiv.innerHTML += buffer[i]; - await new Promise(resolve => setTimeout(resolve, printDelay)); - charCount++; - await updateStatsAndTemperature(); - } - buffer = buffer.slice(nextPos); - } - } - } - while (true) { - const { value, done } = await reader.read(); - if (done) { - if (buffer) { - responseDiv.innerHTML += buffer; - } - break; - } - const text = decoder.decode(value, { stream: true }); - await appendTextSmoothly(text); - } - let statsText = statsDiv.textContent; - while (statsText.length > 0) { - statsText = statsText.slice(0, -1); - statsDiv.textContent = statsText; - await new Promise(resolve => setTimeout(resolve, statsEraseDelay)); - } - await new Promise(resolve => setTimeout(resolve, 200)); - const message = '// credit to hartnett media \\\\'; - let messageIndex = 0; - while (messageIndex < message.length) { - statsDiv.textContent += message[messageIndex]; - messageIndex++; - await new Promise(resolve => setTimeout(resolve, statsPrintDelay)); - } -} -document.addEventListener('DOMContentLoaded', fetchAndDisplay); -console.log(`　　　　　 ___ -　　　　 ／イ フ -　　　　| _ _| -　 　 / ミ__xノ -　 /　　 　 | -　　 /　 ヽ　　ﾉ - │　 | | |　　 　 -／￣|　　| | |　　 -| (￣ヽ_ヽ_)_)　 -＼二つ`); -console.log("hello"); \ No newline at end of file diff --git a/assets/style.css b/assets/style.css index e7cdf30..331e001 100644 --- a/assets/style.css +++ b/assets/style.css @@ -1,140 +1,122 @@ @font-face { - font-family: 'workbench'; - src: url('../assets/font.woff2') format('woff2'); + font-family: "workbench"; + src: url("../assets/font.woff2") format("woff2"); } -body, html { - margin: 0; - padding: 0; - width: 100%; - height: 100%; - font-family: 'workbench', sans-serif; - overflow: hidden; - user-select: none; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; +body, +html { + margin: 0; + padding: 0; + width: 100%; + height: 100%; + font-family: "workbench", sans-serif; + overflow: hidden; + user-select: none; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; } #background-video { - position: fixed; - top: 50%; - left: 50%; - min-width: 100%; - min-height: 101%; - width: auto; - height: auto; - transform: translate(-50%, -50%); - z-index: -1; - object-fit: cover; - object-position: center; + position: fixed; + top: 50%; + left: 50%; + min-width: 100%; + min-height: 101%; + width: auto; + height: auto; + transform: translate(-50%, -50%); + z-index: 0; + object-fit: cover; + object-position: center; } .navbar { - background: none; - padding: 1rem; - display: flex; - justify-content: space-between; - align-items: center; - pointer-events: none; + background: none; + padding: 1rem; + display: flex; + justify-content: space-between; + align-items: center; + pointer-events: none; + position: relative; /* Added this line */ + z-index: 1; /* Added this line */ } .logo { - font-size: 1.5rem; - color: #db7bdb; - text-shadow: 0 0 10px #db7bdb; + font-size: 1.5rem; + color: #db7bdb; + text-shadow: 0 0 10px #db7bdb; } .nav-links { - list-style: none; - margin: 0; - padding: 0; - display: flex; - align-items: center; + list-style: none; + margin: 0; + padding: 0; + display: flex; + align-items: center; } .nav-links li { - margin-right: 20px; + margin-right: 20px; } .nav-links a { - font-size: 1.2rem; - color: #db7bdb; - text-decoration: none; - transition: color 0.2s ease; - text-shadow: 0 0 3px #db7bdb; - pointer-events: initial; - letter-spacing: 1px; + font-size: 1.2rem; + color: #db7bdb; + text-decoration: none; + transition: color 0.2s ease; + text-shadow: 0 0 3px #db7bdb; + pointer-events: initial; + letter-spacing: 1px; } .nav-links a:hover { - color: #d6afd6; + color: #d6afd6; } -.response { - text-align: center; - font-size: 2rem; - color: #783F8E; - text-shadow: 0 0 10px #783F8E; - position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - width: 100%; - pointer-events: none; -} - -.response b { - text-shadow: - 2px 2px 30px #9847b8, - -2px -2px 30px #9847b8; - color: #7f5191; -} - -.stats { - position: absolute; - bottom: 0.5%; - left: 50%; - transform: translateX(-50%); - font-size: 1rem; - color: rgba(128, 128, 128, 0.5); - pointer-events: none; - white-space: nowrap; - display: none; - animation: fadeIn 1.5s; - bottom: 1%; +.credits { + position: absolute; + bottom: 0.5%; + left: 50%; + transform: translateX(-50%); + font-size: 1rem; + color: rgba(128, 128, 128, 0.5); + pointer-events: none; + white-space: nowrap; + display: none; + animation: fadeIn 1.5s; } @keyframes fadeIn { - from { opacity: 0; } - to { opacity: 1; } + from { + opacity: 0; + } + to { + opacity: 1; + } } @media (max-width: 600px) { - .navbar { - flex-direction: column; - justify-content: center; - align-items: center; - } + .navbar { + flex-direction: column; + justify-content: center; + align-items: center; + } - .nav-links { - margin-top: 1rem; - display: flex; - justify-content: center; - padding: 0; - width: 100%; - } + .nav-links { + margin-top: 1rem; + display: flex; + justify-content: center; + padding: 0; + width: 100%; + } - .logo { - display: none; - } + .logo { + display: none; + } - .nav-links li { - margin: 0 10px; - text-align: center; - } - - .response { - font-size: 1.5rem !important; - } -} \ No newline at end of file + .nav-links li { + margin: 0 10px; + text-align: center; + } +} diff --git a/index.html b/index.html index 78c46cf..7512683 100644 --- a/index.html +++ b/index.html @@ -1,59 +1,85 @@ - + - - - - - - - - - - - - - - - - - - - - - - - - - - - - elia's website - - - - -
- -
-
- 0 chars/s - 0 chars - 0.0s - Temp: ... -
- - - \ No newline at end of file + + +