diff --git a/docroot/statistics/coverage.php b/docroot/statistics/coverage.php index 003af193..dc32e709 100644 --- a/docroot/statistics/coverage.php +++ b/docroot/statistics/coverage.php @@ -6,67 +6,8 @@ - Helioviewer.org - Data Coverage Statistics - + Helioviewer.org - Data Coverage + @@ -76,76 +17,24 @@
The Helioviewer Project - Data Coverage
-
Loading dashboard...
-
-
+
Loading dashboard...
+
+
+ diff --git a/docroot/statistics/index.php b/docroot/statistics/index.php index cbe30746..ca684f7f 100644 --- a/docroot/statistics/index.php +++ b/docroot/statistics/index.php @@ -13,7 +13,7 @@ Helioviewer.org - Usage Statistics - + + + + + diff --git a/docroot/statistics/superset.css b/docroot/statistics/superset.css new file mode 100644 index 00000000..43923e0f --- /dev/null +++ b/docroot/statistics/superset.css @@ -0,0 +1,115 @@ +html, body { + height: 100%; + margin: 0; + padding: 0; + background-color: #1a1a1a; + color: #e0e0e0; +} +#main { + display: flex; + flex-direction: column; + height: 100vh; + background-color: #1a1a1a; +} +#header { + flex-shrink: 0; + background-color: #2a2a2a; + padding: 5px 10px; + display: flex; + align-items: center; + gap: 10px; +} +#header img { + height: 30px; + width: auto; +} +#headerText { + color: #e0e0e0; + font-size: 14px; + margin: 0; +} +#tab-bar { + flex-shrink: 0; + display: flex; + background-color: #2a2a2a; + border-bottom: 2px solid #444; +} +.tab { + padding: 8px 20px; + background: none; + border: none; + color: #aaa; + font-size: 14px; + cursor: pointer; +} +.tab:hover { + color: #e0e0e0; + background-color: #333; +} +.tab.active { + color: #fff; + border-bottom: 2px solid #4da6ff; + margin-bottom: -2px; +} +.tab-panel { + display: none; + flex: 1; + min-height: 0; +} +.tab-panel.active { + display: flex; + flex-direction: column; + flex: 1; + min-height: 0; +} +.dashboard-box { + flex: 1; + min-height: 0; + width: 100%; + display: flex; + flex-direction: column; +} +.dashboard { + flex: 1; + display: flex; + flex-direction: column; + width: 100vw; + min-height: 0; + margin: 0; + padding: 0; +} +.dashboard iframe { + width: 100%; + height: 100%; + border: none; + display: block; +} +.error { + display: none; + padding: 10px; + margin: 10px; + background-color: #5c1c1c; + color: #ff8a80; + border-radius: 4px; +} +.loader { + padding: 10px; + margin: 10px; + text-align: center; + font-size: 14px; + color: #e0e0e0; + animation-name: wiggle; + animation-duration: 1s; + animation-direction: alternate-reverse; + animation-iteration-count: infinite; + animation-timing-function: ease-in-out; +} +@keyframes wiggle { + from { + transform: translateX(-10px); + } + to { + transform: translateX(10px); + } +} + diff --git a/docroot/statistics/superset.js b/docroot/statistics/superset.js new file mode 100644 index 00000000..f296e229 --- /dev/null +++ b/docroot/statistics/superset.js @@ -0,0 +1,55 @@ +async function fetchGuestToken(guest_token_url, dashboard_id) { + try { + const response = await fetch(guest_token_url, { + method: 'POST', + headers: { + 'Content-Type': 'application/json', + }, + body: JSON.stringify({ + dashboard_id: dashboard_id + }) + }); + + if (!response.ok) { + throw new Error(`HTTP error! status: ${response.status}`); + } + + const data = await response.json(); + + if (!data.success || !data.token) { + throw new Error('Failed to retrieve guest token from response'); + } + + return data.token; + } catch (error) { + console.error('Error fetching guest token:', error); + throw error; + } +} + +async function embedDashboard(id, dashboard_container, loading_element, error_div, superset_url, getGuestToken) { + try { + const guestToken = await getGuestToken(); + + // Hide loading message + loading_element.style.display = 'none'; + + // Embed the dashboard + supersetEmbeddedSdk.embedDashboard({ + id: id, + supersetDomain: superset_url, + mountPoint: dashboard_container, + fetchGuestToken: () => guestToken, + dashboardUiConfig: { + hideTitle: true, + hideChartControls: false, + hideTab: false, + }, + }); + } catch (error) { + console.error('Error embedding dashboard:', error); + loading_element.style.display = 'none'; + error_div.style.display = 'block'; + error_div.textContent = 'Failed to load dashboard: ' + error.message; + } +} diff --git a/settings/Config.Example.ini b/settings/Config.Example.ini index 6d943c98..58e74f3c 100644 --- a/settings/Config.Example.ini +++ b/settings/Config.Example.ini @@ -197,3 +197,6 @@ coordinator_url = 'http://coordinator' superset_url = 'http://localhost:8088' superset_sidecar_url = 'http://localhost:8087' superset_coverage_dashboard_id = 'your-dashboard-id-here' +superset_statistics_dashboard_id = 'your-dashboard-id-here' +superset_movies_dashboard_id = 'your-dashboard-id-here' +superset_movies_jpx_dashboard_id = 'your-dashboard-id-here'