Fix pages

scripts/html/generate_config.py → docs/generate_config.py

@@ -48,8 +48,8 @@
         dt = d.split("_dt", 1)[1].split("_dti", 1)[0]
         dti = d.split("_dti", 1)[1]
 
-        dt_dti = f"{dt}_{dti}"
-        label = f"{dt}s / {dti}s"
+        dt_dti = f"dt{dt}_dti{dti}"
+        label = f"{dt} / {dti}"
 
         timesteps[dt_dti] = {"label": label}
 
@@ -62,11 +62,11 @@
     }
 
 config = {
-    "base_plot_dir": f"../../scm_plots/{PLOT_DIRNAME}",
+    "base_plot_dir": f"../scm_plots/{PLOT_DIRNAME}",
     "cases": cases
 }
 
-config_path = os.path.join(SCRIPT_DIR,"config.json")
+config_path = os.path.join(PLOT_ROOT,"config.json")
 
 with open(config_path, "w") as f:
     json.dump(config, f, indent=2)

scripts/html/index.html → docs/index.html

@@ -13,10 +13,10 @@ <h2>SCM Viewer</h2>
   <div id="main">
   <h1>Select Plot Configuration</h1>
     <div  class="config-list">
-      <a href="viewer.html?config=tempo">Tempo v3</a>
-      <a href="viewer.html?config=thomp">Thompson</a>
-      <a href="viewer.html?config=tempo_vs_thomp">Tempo vs Thomp</a>
-      <a href="viewer.html?config=dx_eval">Dx Comparison</a>
+      <div class="config-card">
+        <h3><a class="config-title"href="viewer.html?config=plots_dtdiv2_comp">Tempo v3</a></h3>
+        <p>Comparison of TempoV3 and Thompson microphysics and their sensitivity for select (inner) timsteps.</p>
+      </div>
     </div>
   </div>
 </body>

scripts/html/style.css → docs/style.css

@@ -136,3 +136,53 @@ img {
         max-width: 100%;
     }
 }
+/* ===============================
+   Backlink
+   =============================== */
+#backLink {
+    color: white;
+    text-decoration: none; /* optional */
+}
+
+#backLink:visited {
+    color: white;
+}
+
+#backLink:hover {
+    color: #dddddd; /* optional lighter shade on hover */
+}
+
+/* Card styling */
+.config-card {
+    background: #f4f4f4;
+    border: 1px solid #d0d0d0;
+    border-radius: 6px;
+    padding: 16px;
+    margin-bottom: 20px;
+}
+
+.config-card h3 {
+    margin-top: 0;
+}
+
+.config-card p {
+    margin-bottom: 15px;
+}
+
+.config-title {
+    display: inline-block;
+    padding: 10px 18px;
+    background-color: #003366;
+    color: white;
+    text-decoration: none;
+    border-radius: 4px;
+    font-weight: bold;
+}
+
+.config-title:hover {
+    background-color: #004c99;
+}
+
+.config-title:visited {
+    color: white;
+}

docs/users_guide/index.rst

@@ -0,0 +1,9 @@
+Welcome to the SCM Workflow Users' Guide
+========================================
+
+.. toctree::
+   :maxdepth: 2
+   :numbered:
+
+   Introduction
+   Running

scripts/html/viewer.html → docs/viewer.html

@@ -34,7 +34,7 @@ <h2>Config Selection</h2>
                     <option value="">-- Select Area --</option>
                 </select>
 
-	        <label for="dtSelect">Timestep/Physics Timestep</label>
+	        <label for="dtSelect">Timestep/Inner Timestep</label>
                 <select id="dtSelect" onchange="configChanged()">
                     <option value="">-- Select Timesteps --</option>
                 </select>
@@ -85,7 +85,8 @@ <h1>SCM Case Comparison Viewer</h1>
 
     const params = new URLSearchParams(window.location.search);
     const configName = params.get("config");
-    const configPath = `../../scm_plots/${configName}/config.json`;
+    const configPath = `scm_plots/${configName}/config.json`;
+    console.log("configPath:", configPath);
 
     let CONFIG = {};
     let CURRENT_CASE = null;
@@ -259,7 +260,11 @@ <h1>SCM Case Comparison Viewer</h1>
 
             if (!area || !timestep ) return null;
 
-		return `${caseName}_SCM_${suite}_area${area}_${timestep}`;
+	        const match = timestep.match(/dt(\d+)s?_dti(\d+)s?/);
+                const dt = match[1];
+                const dti = match[2];
+
+	        return `${caseName}_SCM_${suite}_area${area}_dt${dt}s_dti${dti}s`;
         }
 
 	function populateFigures(caseKey) {