attempting to check system host in javascript

zdkrimson · Jul 6, 2024 · 554d64d · 554d64d
1 parent 1dbce57
commit 554d64d
Show file tree

Hide file tree

Showing 11 changed files with 179 additions and 9 deletions.
diff --git a/__pycache__/modelfetch.cpython-311.pyc b/__pycache__/modelfetch.cpython-311.pyc
diff --git a/help.css b/help.css
@@ -0,0 +1,41 @@
+body {
+	/*background-color: black*/
+	padding: 20px;
+	padding-top: 40px;
+}
+
+h1, h2, h3, h4, h5, h6, p {
+	color: white;
+	font-family: 'Inter';
+}
+
+@font-face {
+  font-family: 'Inter';
+  src: url('assets/fonts/inter/Inter-Regular.ttf');
+}
+
+.titlebar {
+  background-color: #00000070;
+  position: fixed;
+  left: 0;
+  top: 0;
+  width: 100%;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  gap: 10px;
+  height: 40px;
+  z-index: 10;
+}
+
+.close {
+  background-color: #00000000;
+  border: 0;
+  width: 40px;
+  height: 40px;
+}
+
+.close:hover {
+  background-color: #00000050;
+  scale: 1.05;
+}
diff --git a/help.html b/help.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<title>zdkrimson</title>
+		<link rel="stylesheet" href="help.css">
+		<script src='help.js'></script>
+	</head>
+	<div class=titlebar>
+			<button onclick='closeHelp()' class=close>
+				<img width=30 src=assets/icons/arrowback.svg>
+			</button>
+			<p>Documentation</p>
+		</div>
+	<body>
+		<p>Documentation will be worked on <i>eventually</i></p>
+	</body>
+</html>
diff --git a/help.js b/help.js
@@ -0,0 +1,11 @@
+function closeHelp() {
+	// Send message from iframe to parent window
+	window.parent.postMessage('hideDocs', '*');
+}
+
+document.addEventListener('DOMContentLoaded', function() {
+	if (window.self === window.top) {
+	    // Not inside an iframe
+	    document.body.style.backgroundColor = 'darkred';
+	}
+});
diff --git a/index.css b/index.css
@@ -1,9 +1,31 @@
 body {
+  background-color: #210202;
 	background-image: url("assets/bg/blur/crim1.png");
   background-size: cover;
   background-attachment: fixed;
 }
 
+@keyframes fadeout {
+  from {
+    opacity: 1;
+  }
+  to {
+    opacity: 0;
+  }
+}
+
+.windowfade {
+  position: fixed;
+  top: 0;
+  left: 0;
+  background-color: #210202;
+  width: 100%;
+  height: 100%;
+  z-index: 100;
+  animation: fadeout 1s ease-in-out forwards;
+  pointer-events: none
+}
+
 @font-face {
   font-family: 'Inter';
   src: url('assets/fonts/inter/Inter-Regular.ttf');
@@ -190,6 +212,24 @@ button:active {
   pointer-events: none;
 }
 
+.help {
+  position: fixed;
+  width: 450px;
+  height: 80%;
+  padding: 0px;
+  margin: auto;
+  inset: 0px;
+  display: flex;
+  flex-direction: column;
+  backdrop-filter: blur(20px) brightness(40%);
+  border-radius: 20px;
+  box-shadow: 0px 0px 20px #00000055;
+  z-index: 7; /* i like the number 7 */
+  opacity: 0;
+  scale: 0.8;
+  pointer-events: none;
+}
+
 @keyframes popup {
   from {
     scale: 0.8;
@@ -224,7 +264,7 @@ button:active {
 	animation: popout 0.5s ease-in forwards;
 }
 
-.settingsiframe {
+.windowiframe {
 	width: 100%;
 	height: 100%;
 	border: 0;

diff --git a/index.html b/index.html
@@ -6,12 +6,16 @@
 		<script src=index.js></script>
 	</head>
 	<body>
+		<div class=windowfade></div>
 		<div id=settings class=settings>
-			<iframe allow-scripts=true allow-same-origin=true allow-transparency=true class=settingsiframe src='settings.html' title='zdkrimson Settings'></iframe>
+			<iframe allow-scripts=true allow-same-origin=true allow-transparency=true class=windowiframe src='settings.html' title='zdkrimson Settings'></iframe>
+		</div>
+		<div id=help class=help>
+			<iframe allow-scripts=true allow-same-origin=true allow-transparency=true class=windowiframe src='help.html' title='zdkrimson Help'></iframe>
 		</div>
 		<div class=main>
 			<div class=homescrn>
-				<button class=helpbtn>
+				<button onclick='help("show")' class=helpbtn>
 					<img width=30px src='assets/icons/questionmark.svg'>
 				</button>
 				<button onclick='settings("show")' class=settingsbtn>

diff --git a/index.js b/index.js
@@ -1,3 +1,9 @@
+window.addEventListener('pywebviewready', function() {
+	console.log(window.pywebview.api.get_host())
+	var iframe = document.getElementById('windowiframe');
+	iframe.contentWindow.postMessage(window.pywebview.api.get_host(), '*');
+});
+
 function settings(status) {
 	var settingsmenu = document.getElementById("settings");
 
@@ -12,6 +18,20 @@ function settings(status) {
 	}
 }
 
+function help(status) {
+	var helpmenu = document.getElementById("help");
+
+	if (status == "show") {
+		helpmenu.classList.add("popup");
+		helpmenu.classList.remove("popout");
+	}
+
+	if (status == "hide") {
+		helpmenu.classList.remove("popup");
+		helpmenu.classList.add("popout");
+	}
+}
+
 // Listen for messages from iframe
 window.addEventListener('message', function(event) {
     // Verify origin of the iframe (optional, for security)
@@ -22,4 +42,9 @@ window.addEventListener('message', function(event) {
         // Call settings function in the parent window
         settings('hide');
     }
+
+    if (event.data === 'hideDocs') {
+        // Call help function in the parent window
+        help('hide');
+    }
 });
diff --git a/main.py b/main.py
@@ -0,0 +1,12 @@
+import webview
+import modelfetch
+
+syshost=modelfetch.system.Model
+
+class Api:
+	def get_host(self):
+	    return syshost
+
+api = Api()
+webview.create_window('zdkrimson', background_color="#210202", url="index.html", js_api=api)
+webview.start(private_mode=False, debug=True)
diff --git a/modelfetch.py b/modelfetch.py
@@ -0,0 +1,6 @@
+import wmi
+
+c = wmi.WMI()
+system = c.Win32_ComputerSystem()[0]
+print(system.Model)
+hostinfo = system.Model
diff --git a/settings.html b/settings.html
@@ -56,8 +56,9 @@ <h2>Your Device</h2>
 					<p>CPU: </p>
 					<p>GPU: </p>
 					<p>Memory: </p>
-					<p>Host: </p>
-					<p>Resolution: </p>
+					<p id=syshost>Host: </p>
+					<p id=sysplat>Platform: </p>
+					<p id=sysres>Resolution: </p>
 				</div>
 				<h2>Minecraft Information</h2>
 				<div class=section>

diff --git a/settings.js b/settings.js
@@ -1,12 +1,25 @@
+console.log("Platform: " + navigator.platform)
+
+// Adds information on load
+document.addEventListener('DOMContentLoaded', function() {
+	var restext = document.getElementById('sysres');
+	var platformtext = document.getElementById('sysplat');
+
+	restext.textContent = "Resolution: " + window.screen.width + "x" + window.screen.height;
+	platformtext.textContent = "Platform: " + navigator.platform;
+});
+
+window.addEventListener('message', function(event) {
+	var syshost = document.getElementById('syshost');
+
+	syshost.textContent = "Host: " + event.data;
+});
+
 function closeSettings() {
 	// Send message from iframe to parent window
 	window.parent.postMessage('hideSettings', '*');
 }
 
-// Check if the webpage is not loaded inside an iframe
-
-
-
 //This code snippet sets the background to dark red if ran outside an iframe, this makes writing the settings page easier without it being embedded?
 // Im writing the settings page in it's own tab, not in the iframe cuz i need to refresh the page then open up the settings menu every new change
 // Wait for DOM content to be fully loaded