v0.1.0

added tf banner ;)
v0.0.9
2025-10-31 05:37:13 +01:00 · 2022-10-30 15:09:48 +01:00 · 2022-10-30 15:09:35 +01:00 · 2022-10-29 17:12:44 +02:00 · 2022-10-29 17:12:10 +02:00 · 2022-10-29 16:53:39 +02:00
10 changed files with 78 additions and 30 deletions
--- a/.gitignore
+++ b/.gitignore
@@ -0,0 +1 @@
+config.js
--- a/config.js
+++ b/config.js
@@ -1,3 +1,3 @@
 const CONFIG = {
-	apiKey: "1e8d3bcbc24f95e64672521ccdcf6020e2d64d30",
+	apiKey: "",
 };
--- a/css/animations.css
+++ b/css/animations.css
@@ -1,13 +1,5 @@
@keyframes subAnimation {
 	0% {
-		border-image: linear-gradient(
-				to top,
-				var(--border-color-1),
-				var(--border-color-2)
-			)
-			1;
-	}
-	10% {
 		border-image: linear-gradient(
 				to top,
 				var(--border-color-flash-1),
@@ -23,7 +15,7 @@
 			)
 			1;
 	}
-	80% {
+	100% {
 		border-image: linear-gradient(
 				to top,
 				var(--border-color-flash-1),
@@ -31,14 +23,6 @@
 			)
 			1;
 	}
-	100% {
-		border-image: linear-gradient(
-				to top,
-				var(--border-color-2),
-				var(--border-color-1)
-			)
-			1;
-	}
 }

@keyframes borderAnimation {
@@ -82,18 +66,21 @@

@keyframes backgroundSubAnimation {
 	0% {
-		background: var(--border-color-1);
-	}
-	10% {
 		background: var(--border-color-flash-1);
 	}
 	50% {
 		background: var(--border-color-flash-2);
 	}
-	80% {
+	100% {
 		background: var(--border-color-flash-1);
 	}
-	100% {
-		background: var(--border-color-2);
+}
+
+@keyframes tfBannerAnimation {
+	from {
+		margin-top: -200px;
+	}
+	to {
+		margin-top: 0px;
 	}
 }
--- a/css/style.css
+++ b/css/style.css
@@ -55,3 +55,27 @@ html {
 	animation-duration: 20s;
 	animation-name: backgroundAnimation;
 }
+
+#teafire-banner {
+	height: 50px;
+	width: 180px;
+	padding: 20px;
+	margin-top: -200px;
+	z-index: 1;
+	animation-timing-function: linear;
+	float: right;
+}
+
+#teafire-banner p {
+	color: teal;
+	float: left;
+	font-size: 23pt;
+	font-weight: bolder;
+	padding-top: 8px;
+	padding-left: 5px;
+}
+#teafire-banner img {
+	color: teal;
+	height: 50px;
+	float: left;
+}
--- a/css/variables.css
+++ b/css/variables.css
@@ -1,7 +1,7 @@
 :root {
-	--border-color-1: rgb(139, 0, 0);
-	--border-color-2: rgb(255, 74, 74);
+	--border-color-1: rgb(113, 0, 0);
+	--border-color-2: rgb(235, 19, 19);

-	--border-color-flash-1: rgb(220, 32, 15);
-	--border-color-flash-2: rgb(210, 220, 15);
+	--border-color-flash-1: rgb(255, 27, 6);
+	--border-color-flash-2: rgb(208, 218, 20);
 }
--- a/frame.html
+++ b/frame.html
@@ -11,6 +11,10 @@
 	</head>
 	<body>
 		<div id="frame"></div>
+		<div id="teafire-banner">
+			<img src="img/logo128x128.png" alt="" />
+			<p>TealFire</p>
+		</div>
 		<div id="subCount">0</div>
 		<script src="config.js"></script>
 		<script src="js/socket.io.min.js"></script>
--- a/img/logo128x128.png
+++ b/img/logo128x128.png
--- a/js/app.js
+++ b/js/app.js
@@ -1,5 +1,6 @@
 const subCount = document.getElementById("subCount");
 const frame = document.getElementById("frame");
+const tfBanner = document.getElementById("teafire-banner");

 let subCountNumber = 0;

@@ -31,6 +32,36 @@ function sub(subName) {
 		subCount.style.animationDuration = "20s";
 		subCount.innerText = subCountNumber;
 		updateSubCount();
-	}, 2000);
+	}, 11000);
 }
+
+function showTealFireBanner() {
+	tfBanner.style.animationName = "tfBannerAnimation";
+	tfBanner.style.animationDuration = "3s";
+	tfBanner.style.animationDirection = "normal";
+	setTimeout(() => {
+		tfBanner.style.marginTop = "0px";
+		tfBanner.style.animationName = "";
+		tfBanner.style.animationDuration = "";
+	}, 3000);
+}
+
+function closeTealFireBanner() {
+	tfBanner.style.animationName = "tfBannerAnimation";
+	tfBanner.style.animationDuration = "3s";
+	tfBanner.style.animationDirection = "reverse";
+
+	setTimeout(() => {
+		tfBanner.style.marginTop = "-200px";
+		tfBanner.style.animationName = "";
+		tfBanner.style.animationDuration = "";
+	}, 3000);
+}
+
+setInterval(() => {
+	showTealFireBanner();
+	setTimeout(() => {
+		closeTealFireBanner();
+	}, 20000);
+}, 300000);
 updateSubCount();
--- a/meta.json
+++ b/meta.json
@@ -1,3 +1,3 @@
 {
-	"version": "v0.0.4"
+	"version": "v0.1.0"
 }
--- a/update.ps1
+++ b/update.ps1
@@ -50,4 +50,5 @@ if ($newestVersionString -ne "") {
 else {
  Write-Output "No new version found!"
 }
+Write-Output "You need to add your API-Key again to the config.js!"
 pause
Author	SHA1	Message	Date
Janis	80ea3c297e	v0.1.0	2022-10-30 15:09:48 +01:00
Janis	c5e597ef58	added tf banner ;)	2022-10-30 15:09:35 +01:00
Janis	5dd6bbf290	v0.0.9	2022-10-29 17:12:44 +02:00
Janis	a45f99ecd3	v0.0.9	2022-10-29 17:12:10 +02:00
Janis	14079a997e	v0.0.8	2022-10-29 16:53:39 +02:00
Janis	23044c320d	v0.0.8	2022-10-29 16:53:35 +02:00
Janis	ae6d3f0ebf	v0.0.7	2022-10-29 16:51:32 +02:00
Janis	832aa9beb0	v0.0.6	2022-10-29 16:48:22 +02:00
Janis	7bb209a8d6	2s to 11s	2022-10-29 16:48:09 +02:00
Janis	85501820f1	add config to gitignore to prevent pushing apikey by accident	2022-10-29 15:55:50 +02:00
Janis	b12a9742f1	gitignore	2022-10-29 15:55:03 +02:00
Janis	9de4c7fc03	added gitignore	2022-10-29 15:54:19 +02:00
Janis	d198699844	change version to v0.0.5	2022-10-29 15:51:20 +02:00
Janis	b5889e7b0a	removed api key ;)	2022-10-29 15:51:02 +02:00