Added basic index.html as project URL root

ChaoticNeutralCzech · Jan 29, 2024 · 2fa7610 · 2fa7610
1 parent 40e0263
commit 2fa7610
Show file tree

Hide file tree

Showing 14 changed files with 385 additions and 26 deletions.
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,2 @@
+gitignore 
+#Contains potential trademark/copyright problems
diff --git a/Baloo2-Bold.ttf b/Baloo2-Bold.ttf
diff --git a/Baloo2BoldMinified.otf b/Baloo2BoldMinified.otf
diff --git a/Baloo2BoldMinified.ttf b/Baloo2BoldMinified.ttf
diff --git a/Baloo2BoldMinified.woff b/Baloo2BoldMinified.woff
diff --git a/duha1080.png b/duha1080.png
diff --git a/embed.css b/embed.css
@@ -5,24 +5,22 @@
 	src:url(Monoskop.ttf);
 }
 
-p {
-	font-family: Monoskop, monospace;
-	font-size: 48pt;
+@font-face{font-family:Baloo;
+	src:url(Baloo2BoldMinified.woff);
 }
-
 #tv {
-	margin: auto; 
-	max-height: 100vh; 
-	max-width: 100%;  
-	align-self: center;
+	max-height: 56.25vw; 
+	height: 100%;  
+  font-family: Monoskop, monospace;
+	font-size: 48pt;
 }
-
+/*
 #duha {
 	width: 1920px;
 	height: 1080px;
 	image-rendering: pixelated;
 }
-
+*/
 body {
 	margin: 0px; 
 	padding: 0px; 
@@ -33,4 +31,133 @@ body {
 	display: flex;
 	justify-content: center;
 	align-items: center;
+	position: relative;
+  font-family: sans-serif;
+  font-size: 20pt;
+}
+
+#spinner {
+	max-width: 9%;
+	max-height: 16vh;
+	position: absolute;
+	margin: auto; 
+	align-self: center;
+	visibility: hidden;
+	transition: opacity 1s; 
+}
+
+#controls {
+	position: absolute;
+	bottom: 0; 
+	align-self: bottom;
+  max-height: 20vh;
+  height: 50px;
+  width: 100vw;
+  /*background-image: linear-gradient(#0000 0%, #0000 90%, #0007 93%, #000a 96%, #000c	100%);*/
+  background-image: linear-gradient(#0000 0%, /*#0000 90%, #0007 93%, #000a 96%,*/ #000c	100%);
+  opacity: 0;
+  display: none;
+  transition: opacity 0.5s;
+  display: flex;
+  align-items: center;
+/*  justify-content: flex-end;*/
+  flex-flow: row nowrap;
+}
+
+p {
+/*  position: absolute;*/
+  align-self: center;
+  color: #fff;
+}
+
+.ficon {
+	align-self: center;
+  /*position: absolute;*/
+  right: 0;
+  top: 0;
+  bottom: 0;
+  margin: auto 0;
+  padding: 5px 10px;
+	transition: transform 0.5s;
+}
+
+.ficon:hover {
+	transform: scale(1.2);
+}
+
+#exit {
+  display: none;
+}
+
+.drop {
+  display: inline-block;
+  position: relative;
+}
+
+.dropButton {
+  background-color: #0000;
+  color: #fff;
+  border: none;
+  padding: 5px 20px;
+}
+#chmenu, #chButton {
+  font-family: Baloo, sans-serif;
+  font-size: 20pt;
+  width: 120px;
+  text-align: left;
+}
+#qmenu {
+  /*position: relative;*/
+  align-self: center flex-end;
+  align-items: center;
+  justify-self: flex-end;
+  margin-left: auto;
+}
+
+#qButton {
+  position: relative;
+  padding: auto 10px;
+}
+
+#qmenu a, #qButton {
+  font-family: sans-serif;
+  text-align: center;
+  font-size: 12pt;
+  width: 80px;
+}
+
+.dropButton :hover {
+  background-color: #0003;
+}
+
+.drop:hover .dropWindow {
+  display: block;
+}
+
+.dropWindow {
+	display: none;
+	position: absolute;
+  bottom: 100%;
+	background-color: #0000;
+	z-index: 1;
+}
+
+#qmenu div a {
+  width: 40px;
+}
+#chmenu div a {
+  width: 120px;
+}
+
+.dropWindow a {
+  background-color: #333d;
+  color: #fff;
+  text-align: left;
+  padding: 5px 20px;
+  display: block;
+  text-decoration: none;
+}
+
+.dropWindow a:hover {
+	background-color: #888;
 }
diff --git a/embed.html b/embed.html
@@ -2,14 +2,41 @@
 <html>
 <head>
   <meta charset="UTF-8" /> 
+  <meta property="og:title" content="TV Barrandov - ŽIVĚ" />
   <meta property="og:image" content="duha.png" />
   <title>TV Barrandov - ŽIVĚ</title>
   <link rel="icon" href="favicon.png"/>
   <link rel="stylesheet" href="embed.css"/>
 </head>
 <body>
-  <img src="duha.png" id="duha" onload = "startTV()">
+  <img src="duha.png" id="duha"></img>
   <canvas id="tv" width="480" height="270"></canvas>
+  <img src="spinner.svg" id="spinner"></img>
+  <div id="controls">
+      <div id="chmenu" class="drop">
+        <div class="dropWindow">
+          <a href="#ch2">kino</a>
+          <a href="#ch3">krimi</a>
+        </div>
+        <button id="chButton" class="dropButton">tv</button>
+
+      </div>
+      <p>Právě běží: <i>Žádné informace</i></p>
+
+      <div id="qmenu" class="drop">
+        <div class="dropWindow">
+          <a href="#">HD</a>
+          <a href="#">SD</a>
+          <a href="#">LQ</a>
+          <a href="#">Auto</a>
+        </div>
+        <button id="qButton" class="dropButton">Auto</button>
+
+      </div>
+      <!--<p>TV Barrandov/Barrandov Krimi/Barrandov Kino - Právě běží: <u>Žádné informace</u></p>--->
+      <img src="exit.svg" id="exit" class="ficon">
+      <img src="full.svg" id="full" class="ficon">
+  </div>
   <script src="embed.js"></script>
   </body>
 </html>
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,2 @@
		gitignore
		#Contains potential trademark/copyright problems