Added CSS.

Longridge-High-School · Mar 5, 2024 · aca4acd · aca4acd
1 parent 5622906
commit aca4acd
Show file tree

Hide file tree

Showing 6 changed files with 123 additions and 34 deletions.
diff --git a/app/img/icon.png b/app/img/icon.png
diff --git a/app/img/spin.gif b/app/img/spin.gif
diff --git a/app/index.html b/app/index.html
@@ -1,12 +1,22 @@
 <!DOCTYPE html>
 <html>
+    <head>
+        <title>Remote Slicing Utility</title>
+		<link rel = "stylesheet"  type = "text/css" href = "/style.css">
+		<link rel = "icon" href = "/img/icon.png">
+		<meta charset = "utf-8">
+    </head>
     <body>
-        <p>Click on the "Choose File" button to upload an STL file:</p>
-        <form action = "/upload.php" method = "post" enctype = "multipart/form-data">
-            <input type = "file" accept = ".stl" name = "uploadFile">
+        <main>
+            <h1>Remote Slicing Utility</h1>
             <br>
-            <br>
-            <input type = "submit" value = "Upload and Slice">
-        </form>
+            <p>Click on the "Choose File" button to upload an STL file:</p>
+            <form action = "/upload.php" method = "post" enctype = "multipart/form-data">
+                <input type = "file" accept = ".stl" name = "uploadFile">
+                <br>
+                <br>
+                <input type = "submit" value = "Upload and Slice">
+            </form>
+        </main>
     </body>
 </html>
diff --git a/app/slice.php b/app/slice.php
@@ -1,37 +1,58 @@
 <!DOCTYPE html>
 <html>
+    <head>
+        <title>Finished!</title>
+		<link rel = "stylesheet"  type = "text/css" href = "/style.css">
+		<link rel = "icon" href = "/img/icon.png">
+		<meta charset = "utf-8">
+    </head>
     <body>
-        <?php
+        <main>
+            <h3>Output:</h3>
+            <br>
+            <div class = "OutputContainer">
+                <i>
+                    <?php
 
-            if ($_SERVER ['REQUEST_METHOD'] === 'POST')
-            {        
-                exec ("/opt/prusa/prusa-slicer -g " . htmlspecialchars ($_POST ["path"]) . " --load /opt/prusa/resources/profiles/Anycubic.ini", $output, $code); 
-
-                if ($code == 0)
-                {
-                    echo "Slicing successful!<br>";
-                    echo "<a href = '/files/" . htmlspecialchars ($_POST ["gcode"]) . "'>Download</a><br>";
-                    echo "<a href = 'index.html'>Home</a><br>";
-                }
-                else
-                {
-                    echo "Slicing failed.<br>";
+                        if ($_SERVER ['REQUEST_METHOD'] === 'POST')
+                        {        
+                            exec ("/opt/prusa/prusa-slicer -g " . htmlspecialchars ($_POST ["path"]) . " --load /opt/prusa/resources/profiles/Anycubic.ini", $output, $code); 
+
+                            if ($code == 0)
+                            {
+                                echo "Slicing successful!<br>";
+                            }
+                            else
+                            {
+                                echo "Slicing failed.<br>";
 
-                    if (count ($output) > 0)
-                    {
-                        foreach ($output as $line)
+                                if (count ($output) > 0)
+                                {
+                                    foreach ($output as $line)
+                                    {
+                                        echo $line . "<br>";
+                                    }
+                                }
+                            }
+                        }
+                        else
                         {
-                            echo $line . "<br>";
+                            // Redirect if someone GETs this page.
+                            header ("/index.html");
                         }
-                    }
-                }
-            }
-            else
-            {
-                // Redirect if someone GETs this page.
-                header ("/index.html");
-            }
 
-        ?>
+                    ?>
+                </i>
+            </div>
+            <br><br>
+            <?php
+                if ($code == 0)
+                {
+                    echo "<a href = '/files/" . htmlspecialchars ($_POST ["gcode"]) . "' download><button class = 'Download'>Download</button></a><br>";
+                    echo "<br>";
+                    echo "<a href = 'index.html'><button>Home</button></a><br>";
+                }
+            ?>
+        </main>
     </body>
 </html>
diff --git a/app/style.css b/app/style.css
@@ -0,0 +1,48 @@
+body
+{
+	margin: 0px;
+	padding: 0px;
+	font-family: "Verdana";
+}
+
+main
+{
+	padding: 10px;
+}
+
+button, input
+{
+	font-size: 18px;
+}
+
+.OutputContainer
+{
+	background-color: #ebeaea;
+	padding-top: 1em;
+	padding-bottom: 1em;
+	padding-left: 1em;
+}
+
+.ProcessContainer
+{
+	padding-top: 1em;
+	padding-bottom: 1em;
+	width: 100vw;
+	height: 20vh;
+	background-color: #ebeaea;
+	text-align: center;
+	margin: 0;
+	position: absolute;
+	top: 35vh;
+	transform: translateY (-35vh);
+}
+
+.Spin
+{
+	height: 15vh;
+}
+
+.Download
+{
+	background-color: #b8ff70;
+}
diff --git a/app/upload.php b/app/upload.php
@@ -1,6 +1,16 @@
 <!DOCTYPE html>
 <html>
+    <head>
+        <title>Processing your File...</title>
+		<link rel = "stylesheet"  type = "text/css" href = "/style.css">
+		<link rel = "icon" href = "/img/icon.png">
+		<meta charset = "utf-8">
+    </head>
     <body>
+        <div class = "ProcessContainer">
+            <img src = "/img/spin.gif" alt = "Processing..." class = "Spin"></img>
+            <p><b>Slicing your model...</p></b>
+        </div>
         <?php
 
             if ($_SERVER ['REQUEST_METHOD'] === 'POST')
@@ -14,7 +24,7 @@
                     echo "<input type = 'hidden' name = 'path' value = '" . $path . "'/>";
                     echo "<input type = 'hidden' name = 'gcode' value = '" . $gcode . "'/>";
                     echo "</form>";
-                    echo "<script type = 'text/javascript'>//document.data.submit ();</script>";
+                    echo "<script type = 'text/javascript'>document.data.submit ();</script>";
                 }
                 else
                 {