diff --git a/gorge.css b/gorge.css index 3a12da3..700eb25 100644 --- a/gorge.css +++ b/gorge.css @@ -496,3 +496,34 @@ div::-webkit-scrollbar-corner { border-color: #333; background-color: #111; } + +.news-text { + pointer-events: none; + text-align: center; + position: fixed; + top: 50vw; + left: 50vw; + transform-origin: 0% 0%; + animation: news-text-frames 10s cubic-bezier(0.68, -0.55, 0.265, 1.55); + animation-fill-mode: both; + font-size: 24px; +} + +@keyframes news-text-frames { + 0% { + transform: translate(0px, 0px); + opacity: 0; + } + 20% { + transform: translate(0px, -200px); + opacity: 1; + } + 80% { + transform: translate(0px, -200px); + opacity: 1; + } + 100% { + transform: translate(0px, 0px); + opacity: 0; + } +} diff --git a/gorge.html b/gorge.html index 2b0a7bc..0d2569c 100644 --- a/gorge.html +++ b/gorge.html @@ -45,7 +45,7 @@
-
Buildings
+
Prey
diff --git a/gorge.js b/gorge.js index 631687e..7163ea7 100644 --- a/gorge.js +++ b/gorge.js @@ -646,6 +646,36 @@ function clickPopup(text, type, location) { }, 2000); } +function doNews() { + let news = [ + "This is news", + "This is also news", + "SPORTS!" + ]; + + const choice = Math.floor(Math.random() * news.length); + + showNews(news[choice]); + + setTimeout(() => { + doNews(); + }, 30000); +} + +function showNews(text) { + const div = document.createElement("div"); + div.textContent = text; + + div.classList.add("news-text"); + + const body = document.querySelector("body"); + + body.appendChild(div); + + setTimeout(() => { + body.removeChild(div); + }, 10000); +} function fillTooltip(type, field, content) { let item = document.querySelector("#" + type + "-tooltip-" + field); if (typeof(content) === "string") { @@ -745,6 +775,8 @@ window.onload = function() { lastTime = performance.now(); + doNews(); + setTimeout(updateDisplay, 1000/updateRate); setTimeout(autosave, 60000);