Keep meta and noscript tags similar across all templates

thevickypedia · Feb 1, 2024 · 9e0bf3f · 9e0bf3f
1 parent 4dce385
commit 9e0bf3f
Show file tree

Hide file tree

Showing 7 changed files with 91 additions and 4 deletions.
diff --git a/README.md b/README.md
@@ -33,7 +33,7 @@ if __name__ == '__main__':
 ```
 
 ### Env Variables
-> :bulb: &nbsp; Environment variables can _(optionally)_ be loaded from any file.<br>
+> :bulb: &nbsp; Environment variables can _(optionally)_ be loaded from any plain text file.<br>
 > Refer the [wiki page][wiki] for more information.
 
 **Mandatory**

diff --git a/pystream/templates/index.html b/pystream/templates/index.html
@@ -8,6 +8,30 @@
     <meta name="author" content="Vignesh Rao">
     <meta name="image" property="og:image" content="https://thevickypedia.com/img/apple-touch-icon.jpg">
     <meta content="width=device-width, initial-scale=1" name="viewport">
+    <noscript>
+        <style>
+            body {
+                width: 100%;
+                height: 100%;
+                overflow: hidden;
+            }
+        </style>
+        <div style="position: fixed; text-align:center;
+                height: 100%; width: 100%; background-image: url('https://vigneshrao.com/img/auth_server/bg.jpg')">
+            <h2 style="margin-top:5%">This page requires JavaScript
+                to be enabled.
+                <br><br>
+                Please refer <a href="https://www.enable-javascript.com/">enable-javascript</a> for how to.
+            </h2>
+            <p>
+                <img src="https://vigneshrao.com/img/auth_server/javascript.gif" width="230" height="200"
+                     alt="loader" class="center">
+            </p>
+            <form>
+                <button type="submit" onClick="<meta httpEquiv='refresh' content='0'>">RETRY</button>
+            </form>
+        </div>
+    </noscript>
     <script src="https://code.jquery.com/jquery-3.6.4.min.js"></script>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/3.1.9-1/crypto-js.js"></script>
     <!-- Disables 404 for favicon.ico which is a logo on top of the webpage tab -->

diff --git a/pystream/templates/land.html b/pystream/templates/land.html
@@ -18,6 +18,30 @@
     <link rel="shortcut icon" href="#">
     <!-- Font Awesome icons -->
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+    <noscript>
+        <style>
+            body {
+                width: 100%;
+                height: 100%;
+                overflow: hidden;
+            }
+        </style>
+        <div style="position: fixed; text-align:center;
+                height: 100%; width: 100%; background-image: url('https://vigneshrao.com/img/auth_server/bg.jpg')">
+            <h2 style="margin-top:5%">This page requires JavaScript
+                to be enabled.
+                <br><br>
+                Please refer <a href="https://www.enable-javascript.com/">enable-javascript</a> for how to.
+            </h2>
+            <p>
+                <img src="https://vigneshrao.com/img/auth_server/javascript.gif" width="230" height="200"
+                     alt="loader" class="center">
+            </p>
+            <form>
+                <button type="submit" onClick="<meta httpEquiv='refresh' content='0'>">RETRY</button>
+            </form>
+        </div>
+    </noscript>
     <!-- Button CSS -->
     <style>
         .iter {

diff --git a/pystream/templates/list.html b/pystream/templates/list.html
@@ -16,6 +16,30 @@
     <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
     <script type="text/javascript" src="https://rawgit.com/thevickypedia/open-source/main/nightmode/night.js" defer></script>
     <link rel="stylesheet" href="https://rawgit.com/thevickypedia/open-source/main/nightmode/night.css">
+    <noscript>
+        <style>
+            body {
+                width: 100%;
+                height: 100%;
+                overflow: hidden;
+            }
+        </style>
+        <div style="position: fixed; text-align:center;
+                height: 100%; width: 100%; background-image: url('https://vigneshrao.com/img/auth_server/bg.jpg')">
+            <h2 style="margin-top:5%">This page requires JavaScript
+                to be enabled.
+                <br><br>
+                Please refer <a href="https://www.enable-javascript.com/">enable-javascript</a> for how to.
+            </h2>
+            <p>
+                <img src="https://vigneshrao.com/img/auth_server/javascript.gif" width="230" height="200"
+                     alt="loader" class="center">
+            </p>
+            <form>
+                <button type="submit" onClick="<meta httpEquiv='refresh' content='0'>">RETRY</button>
+            </form>
+        </div>
+    </noscript>
     <!-- Button CSS -->
     <style>
         body {

diff --git a/pystream/templates/logout.html b/pystream/templates/logout.html
@@ -1,8 +1,13 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
     <title>FastAPI video streaming</title>
-    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+    <meta property="og:type" content="VideoStreaming">
+    <meta name="keywords" content="Python, streaming, fastapi, JavaScript, HTML, CSS">
+    <meta name="author" content="Vignesh Rao">
+    <meta name="image" property="og:image" content="https://thevickypedia.com/img/apple-touch-icon.jpg">
+    <meta content="width=device-width, initial-scale=1" name="viewport">
     <style>
         img {
             display: block;

diff --git a/pystream/templates/session.html b/pystream/templates/session.html
@@ -1,8 +1,13 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
     <title>FastAPI video streaming</title>
-    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+    <meta property="og:type" content="VideoStreaming">
+    <meta name="keywords" content="Python, streaming, fastapi, JavaScript, HTML, CSS">
+    <meta name="author" content="Vignesh Rao">
+    <meta name="image" property="og:image" content="https://thevickypedia.com/img/apple-touch-icon.jpg">
+    <meta content="width=device-width, initial-scale=1" name="viewport">
     <style>
         img {
             display: block;

diff --git a/pystream/templates/unauthorized.html b/pystream/templates/unauthorized.html
@@ -1,8 +1,13 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
     <title>FastAPI video streaming</title>
-    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+    <meta property="og:type" content="VideoStreaming">
+    <meta name="keywords" content="Python, streaming, fastapi, JavaScript, HTML, CSS">
+    <meta name="author" content="Vignesh Rao">
+    <meta name="image" property="og:image" content="https://thevickypedia.com/img/apple-touch-icon.jpg">
+    <meta content="width=device-width, initial-scale=1" name="viewport">
     <style>
         img {
             display: block;