staticdash 0.2.0__py3-none-any.whl → 0.2.2__py3-none-any.whl

staticdash/assets/css/style.css

@@ -128,7 +128,7 @@ tr:nth-child(even) {
   background-color: #f2f2f2;
 }
 
-tr:hover {
+tbody tr:hover {
   background-color: #e8f0fe;
 }
 
@@ -151,4 +151,27 @@ tr:hover {
 
 .download-button:hover {
   background-color: #547a9f;
+}
+
+table.sortable th {
+  cursor: pointer;
+  position: relative;
+  padding-right: 1.5em;
+  user-select: none;
+}
+
+table.sortable th::after {
+  content: "";
+  position: absolute;
+  right: 0.5em;
+  font-size: 0.9em;
+  pointer-events: none;
+}
+
+table.sortable th.sorted-asc::after {
+  content: "\25B2";
+}
+
+table.sortable th.sorted-desc::after {
+  content: "\25BC";
 }

staticdash/assets/js/script.js

@@ -40,4 +40,55 @@ document.addEventListener("DOMContentLoaded", () => {
   if (sections.length > 0) {
     showPage(sections[0].id);
   }
+
+  // Table sorting for tables with class "sortable"
+  document.querySelectorAll("table.sortable").forEach(function (table) {
+    const headers = table.querySelectorAll("thead th");
+    let originalRows = null;
+
+    headers.forEach(function (th, colIdx) {
+      th.addEventListener("click", function () {
+        if (!originalRows) {
+          const tbody = table.querySelector("tbody");
+          originalRows = Array.from(tbody.querySelectorAll("tr"));
+        }
+
+        // Cycle: none -> asc -> desc -> none
+        let state = th.dataset.sorted;
+        let nextState = state === "asc" ? "desc" : state === "desc" ? "none" : "asc";
+
+        headers.forEach(h => {
+          h.classList.remove("sorted-asc", "sorted-desc");
+          h.dataset.sorted = "none";
+        });
+
+        th.dataset.sorted = nextState;
+        if (nextState === "asc") th.classList.add("sorted-asc");
+        if (nextState === "desc") th.classList.add("sorted-desc");
+
+        const tbody = table.querySelector("tbody");
+        if (nextState === "none") {
+          originalRows.forEach(row => tbody.appendChild(row));
+          return;
+        }
+
+        const rows = Array.from(tbody.querySelectorAll("tr"));
+        rows.sort(function (a, b) {
+          const aText = a.children[colIdx].textContent.trim();
+          const bText = b.children[colIdx].textContent.trim();
+          // Numeric sort if both are numbers
+          const aNum = parseFloat(aText);
+          const bNum = parseFloat(bText);
+          if (!isNaN(aNum) && !isNaN(bNum)) {
+            return nextState === "asc" ? aNum - bNum : bNum - aNum;
+          }
+          // String sort (works for ISO dates)
+          return nextState === "asc"
+            ? aText.localeCompare(bText)
+            : bText.localeCompare(aText);
+        });
+        rows.forEach(row => tbody.appendChild(row));
+      });
+    });
+  });
 });

staticdash/dashboard.py

@@ -4,7 +4,7 @@ import uuid
 import pandas as pd
 import plotly.graph_objects as go
 from dominate import document
-from dominate.tags import div, h1, h2, p, a, script, link, table, thead, tr, th, tbody, td, span
+from dominate.tags import div, h1, h2, h3, h4, p, a, script, link, table, thead, tr, th, tbody, td, span
 from dominate.util import raw as raw_util
 
 class Page:
@@ -12,6 +12,12 @@ class Page:
         self.slug = slug
         self.title = title
         self.elements = []
+        self.add_header(title, level=1)  # Add page title as level 1 header
+
+    def add_header(self, text, level=1):
+        if level not in (1, 2, 3, 4):
+            raise ValueError("Header level must be 1, 2, 3, or 4")
+        self.elements.append(("header", (text, level)))
 
     def add_text(self, text):
         self.elements.append(("text", text))
@@ -20,10 +26,13 @@ class Page:
         html = raw_util(plot.to_html(full_html=False, include_plotlyjs='cdn', config={'responsive': True}))
         self.elements.append(("plot", html))
 
-    def add_table(self, df, table_id=None):
+    def add_table(self, df, table_id=None, sortable=True):
         if table_id is None:
             table_id = f"table-{len(self.elements)}"
-        html = df.to_html(classes="table-hover table-striped", index=False, border=0, table_id=table_id)
+        classes = "table-hover table-striped"
+        if sortable:
+            classes += " sortable"
+        html = df.to_html(classes=classes, index=False, border=0, table_id=table_id, escape=False)
         self.elements.append(("table", (html, table_id)))
 
     def add_download(self, file_path, label=None):
@@ -43,9 +52,18 @@ class Page:
 
     def render(self, index):
         section = div(id=f"page-{index}", cls="page-section")
-        section += h1(self.title)
         for kind, content in self.elements:
-            if kind == "text":
+            if kind == "header":
+                text, level = content
+                if level == 1:
+                    section += h1(text)
+                elif level == 2:
+                    section += h2(text)
+                elif level == 3:
+                    section += h3(text)
+                elif level == 4:
+                    section += h4(text)
+            elif kind == "text":
                 section += p(content)
             elif kind == "plot":
                 section += div(content, cls="plot-container")
@@ -81,9 +99,19 @@ class Dashboard:
 
             with doc:
                 with div(cls="page-section", id=f"page-{page.slug}"):
-                    h1(page.title)
+                    # Remove h1(page.title) here, since it's already a header element
                     for kind, content in page.elements:
-                        if kind == "text":
+                        if kind == "header":
+                            text, level = content
+                            if level == 1:
+                                h1(text)
+                            elif level == 2:
+                                h2(text)
+                            elif level == 3:
+                                h3(text)
+                            elif level == 4:
+                                h4(text)
+                        elif kind == "text":
                             p(content)
                         elif kind == "plot":
                             div(content, cls="plot-container")
@@ -110,9 +138,19 @@ class Dashboard:
             with div(id="content"):
                 for page in self.pages:
                     with div(id=f"page-{page.slug}", cls="page-section", style="display:none;"):
-                        h2(page.title)
+                        # Remove h2(page.title) here, since it's already a header element
                         for kind, content in page.elements:
-                            if kind == "text":
+                            if kind == "header":
+                                text, level = content
+                                if level == 1:
+                                    h1(text)
+                                elif level == 2:
+                                    h2(text)
+                                elif level == 3:
+                                    h3(text)
+                                elif level == 4:
+                                    h4(text)
+                            elif kind == "text":
                                 p(content)
                             elif kind == "plot":
                                 div(content, cls="plot-container")

staticdash-0.2.2.dist-info/METADATA

@@ -0,0 +1,57 @@
+Metadata-Version: 2.4
+Name: staticdash
+Version: 0.2.2
+Summary: A lightweight static HTML dashboard generator with Plotly and pandas support.
+Author-email: Brian Day <brian.day1@gmail.com>
+License: CC0-1.0
+Project-URL: Homepage, https://github.com/briday1/staticdash
+Project-URL: Repository, https://github.com/briday1/staticdash
+Requires-Python: >=3.8
+Description-Content-Type: text/markdown
+Requires-Dist: plotly
+Requires-Dist: pandas
+Requires-Dist: dominate
+
+# staticdash
+
+staticdash is a lightweight Python module for creating static, multi-page HTML dashboards. It supports:
+
+- Plotly plots (interactive, responsive)
+- Pandas DataFrames as sortable tables
+- Text and headers (Markdown-like)
+- File download buttons
+- Multi-page navigation with sidebar
+- Custom CSS and JavaScript
+- Easy extension for new content types
+
+## Installation
+
+```bash
+git clone https://github.com/briday1/staticdash.git
+cd staticdash
+pip install .
+```
+
+## Features
+
+- **Add Plotly figures:** `page.add(fig)`
+- **Add tables:** `page.add(df)` (sortable by default)
+- **Add text or headers:** `page.add("Some text")`, `page.add_header("Title", level=2)`
+- **Add download buttons:** `page.add_download("path/to/file", "Label")`
+- **Multi-page:** Create multiple `Page` objects and add them to your `Dashboard`
+- **Custom styling:** Edit `assets/css/style.css` for your own look
+
+## Options
+
+- **Sidebar navigation:** Fixed, with active highlighting
+- **Responsive layout:** Works on desktop and mobile
+- **Export:** Outputs a static HTML dashboard (no server needed)
+- **Per-page HTML:** Also generates individual HTML files for each page
+
+## Live Demo
+
+[View the latest demo dashboard](https://briday1.github.io/staticdash/)
+
+---
+
+For a full example, see [`demo.py`](./demo.py) in this repository.

staticdash-0.2.2.dist-info/RECORD

@@ -0,0 +1,8 @@
+staticdash/__init__.py,sha256=KqViaDkiQnhBI8-j3hr14umLDmPgddvdB_G1nJeC5Xs,38
+staticdash/dashboard.py,sha256=trPzco0AZw4IAwZzgY__RsOjwg4UrD7etB-4Da1kHE0,7515
+staticdash/assets/css/style.css,sha256=kL6FAGxIwYrfNoo4oCzC-ygHmyOZDEjhjixpY0YGpss,2649
+staticdash/assets/js/script.js,sha256=SMOyh7_E_BlvLYMEwYlvCnV7-GnMR-x8PtEiFbIIAsw,3089
+staticdash-0.2.2.dist-info/METADATA,sha256=VDgodqPfaNsvqb-H8gqWWpixRKZie42xF3xG7jlz7rA,1776
+staticdash-0.2.2.dist-info/WHEEL,sha256=_zCd3N1l69ArxyTb8rzEoP9TpbYXkqRFSNOD5OuxnTs,91
+staticdash-0.2.2.dist-info/top_level.txt,sha256=3MzZU6SptkUkjcHV1cvPji0H4aRzPphLHnpStgGEcxM,11
+staticdash-0.2.2.dist-info/RECORD,,

staticdash-0.2.0.dist-info/METADATA

@@ -1,89 +0,0 @@
-Metadata-Version: 2.4
-Name: staticdash
-Version: 0.2.0
-Summary: A lightweight static HTML dashboard generator with Plotly and pandas support.
-Author-email: Brian Day <brian.day1@gmail.com>
-License: CC0-1.0
-Project-URL: Homepage, https://github.com/briday1/staticdash
-Project-URL: Repository, https://github.com/briday1/staticdash
-Requires-Python: >=3.8
-Description-Content-Type: text/markdown
-Requires-Dist: plotly
-Requires-Dist: pandas
-Requires-Dist: dominate
-
-# staticdash 
-
-staticdash is a lightweight Python module for creating static, multi-page HTML dashboards. It supports Plotly plots, tables, and text content, with a fixed sidebar for navigation.
-
-## Installation
-
-Clone the repository and install it in editable mode:
-
-```bash
-git clone https://github.com/briday1/staticdash.git 
-cd staticdash
-pip install .
-```
-
-## Usage
-
-Create a Python script like this:
-
-```python
-from staticdash.dashboard import Dashboard, Page
-import plotly.express as px
-import pandas as pd
-import numpy as np
-
-# Create sample data
-df = pd.DataFrame({
-    "Category": ["A", "B", "C", "D"],
-    "Value": [10, 20, 30, 40]
-})
-
-df2 = pd.DataFrame({
-    "Time": pd.date_range("2024-01-01", periods=10, freq="D"),
-    "Signal": np.random.randn(10).cumsum()
-})
-
-fig1 = px.bar(df, x="Category", y="Value", title="Bar Chart Example")
-fig2 = px.line(df2, x="Time", y="Signal", title="Signal over Time")
-
-# Build dashboard
-dashboard = Dashboard(title="StaticDash Demo")
-
-# Page 1: Overview
-page1 = Page("overview", "Overview")
-page1.add("Welcome to the StaticDash demo. Below is a bar chart and a table.")
-page1.add(fig1)
-page1.add(df)
-
-# Page 2: Timeseries
-page2 = Page("timeseries", "Timeseries")
-page2.add("Here is a random time series with cumulative noise.")
-page2.add(fig2)
-page2.add(df2)
-
-# Page 3: Summary
-page3 = Page("summary", "Summary")
-page3.add("Summary and notes can be added here.")
-page3.add("StaticDash is a lightweight static dashboard generator.")
-
-# Page 4: Download
-page4 = Page("download", "Download")
-page4.add("Here is a button to download a file.")
-page4.add_download('./test_file.txt', "Download File")
-page4.add_download('./test_file2.txt', "Download Another File")
-
-# Register pages
-dashboard.add_page(page1)
-dashboard.add_page(page2)
-dashboard.add_page(page3)
-dashboard.add_page(page4)
-
-# Export
-dashboard.publish(output_dir="output")
-```
-
-After running the script, open output/index.html in your browser.

staticdash-0.2.0.dist-info/RECORD

@@ -1,8 +0,0 @@
-staticdash/__init__.py,sha256=KqViaDkiQnhBI8-j3hr14umLDmPgddvdB_G1nJeC5Xs,38
-staticdash/dashboard.py,sha256=yp3L0tM4jlgdYY7HcN-gLmNrCb3fbr6J5-iy4undbCg,5768
-staticdash/assets/css/style.css,sha256=yxD9ElyofR6cPQjas9MkQ8iTTw_3RBjREtCbDDIWJHw,2284
-staticdash/assets/js/script.js,sha256=rAGEB9sgv8LGdpA1JLQwYAZVRimpEfFSELKb0fFeATI,1222
-staticdash-0.2.0.dist-info/METADATA,sha256=jPAVQqxxvK1XxtD8RebE_hLUsAxo7D_ht2WQl32YnQs,2409
-staticdash-0.2.0.dist-info/WHEEL,sha256=_zCd3N1l69ArxyTb8rzEoP9TpbYXkqRFSNOD5OuxnTs,91
-staticdash-0.2.0.dist-info/top_level.txt,sha256=3MzZU6SptkUkjcHV1cvPji0H4aRzPphLHnpStgGEcxM,11
-staticdash-0.2.0.dist-info/RECORD,,