Merge pull request #22 from drgrice1/default-template

drdrew42 · web-flow · commit 31d0969c5adc · 2025-06-19T12:08:09.000-07:00
Set a default template (output format) and remove the alert for not having selected one.
diff --git a/public/css/navbar.css b/public/css/navbar.css
@@ -12,12 +12,13 @@ body * {
   left: 0;
   width: 100%;
   height: 50px;
-  /* overflow: hidden; */
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
   background-color: #012C4E;
 }
 
 .topnav a {
-  float: left;
   display: block;
   color: white;
   text-align: center;
@@ -37,8 +38,7 @@ body * {
 }
 
 .dropdown {
-  float: left;
-  /* overflow: hidden; */
+	height: 100%;
 }
 
 .dropdown .dropbtn {
@@ -62,7 +62,6 @@ body * {
 }
 
 .dropdown-content a {
-  float: none;
   color: white;
   background-color: #012C4E;
   padding: 12px 16px;
@@ -80,23 +79,25 @@ body * {
   display: block;
 }
 
+.search-container {
+	height: 100%;
+}
+
 .topnav .search-container {
-  float: right;
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+  column-gap: 10px;
+  padding: 10px;
 }
 
 .topnav input[type=text] {
   padding: 6px;
-  margin-top: 7px;
-  margin-right: 16px;
-  font-size: 17px;
   border: none;
 }
 
 .topnav .search-container button {
-  float: right;
   padding: 6px 10px;
-  margin-top: 7px;
-  margin-right: 16px;
   background: #C0CAD3;
   font-size: 17px;
   border: none;
@@ -108,11 +109,7 @@ body * {
 }
 
 @media screen and (max-width: 600px) {
-  .topnav .search-container {
-    float: none;
-  }
   .topnav a, .topnav input[type=text], .topnav .search-container button {
-    float: none;
     display: block;
     text-align: left;
     width: 100%;
diff --git a/public/js/navbar.js b/public/js/navbar.js
@@ -141,14 +141,7 @@ renderbutton.addEventListener("click", (event) => {
 	const renderurl = "render-api";
 
 	const selectedformat = document.querySelector(".dropdown-item.selected");
-	let outputFormat;
-	if (selectedformat === null) {
-		console.log(typeof selectedformat);
-		alert("No output format selected. Defaulting to 'classic' format.");
-		outputFormat = "classic";
-	} else {
-		outputFormat = selectedformat.id;
-	}
+	const outputFormat = selectedformat?.id ?? 'default';
 	let formData = new FormData();
 	formData.set("showComments", 1);
 	formData.set(
@@ -231,13 +224,7 @@ function insertListener() {
 		const selectedformat = document.querySelector(
 			".dropdown-item.selected"
 		);
-		let outputFormat;
-		if (selectedformat === null) {
-			alert("No output format selected. Defaulting to 'classic' format.");
-			outputFormat = "classic";
-		} else {
-			outputFormat = selectedformat.id;
-		}
+		const outputFormat = selectedformat?.id ?? 'default';
 		formData.set("isInstructor", 1);
 		formData.set("includeTags", 1);
 		formData.set("showComments", 1);
diff --git a/templates/layouts/navbar.html.ep b/templates/layouts/navbar.html.ep
@@ -11,12 +11,10 @@
   <body>
     <div class="topnav" id="myTopnav">
       <div class="dropdown" id="template-select-dropdown">
-        <button class="dropbtn" id="template-select">Template
-          <i class="fa fa-caret-down"></i>
-        </button>
+        <button class="dropbtn" id="template-select">Default <i class="fa fa-caret-down"></i></button>
         <div class="dropdown-content">
           <a href="#" class="dropdown-item" id="static">Static <i class="fa fa-check" aria-hidden="true"></i></a>
-          <a href="#" class="dropdown-item" id="default">Default <i class="fa fa-check" aria-hidden="true"></i></a>
+          <a href="#" class="dropdown-item selected" id="default">Default <i class="fa fa-check" aria-hidden="true"></i></a>
           <a href="#" class="dropdown-item" id="debug">Debug <i class="fa fa-check" aria-hidden="true"></i></a>
         </div>
       </div>
@@ -25,8 +23,8 @@
           <span id="hiddenSourceFilePath"></span>
           <input type="text" placeholder="file path..." name="sourceFilePath" id="sourceFilePath">
           <input type="text" placeholder="random seed..." name="problemSeed" id="problemSeed" style="width:130px;">
-          <button type="button" id="save-problem">Save</button>
           <button type="button" id="load-problem">Load</button>
+          <button type="button" id="save-problem">Save</button>
         <!--/form-->
       </div>
     </div>
