2025-08-09 18:48:34 -04:00
<!DOCTYPE html>
< html >
< head >
< meta charset = "UTF-8" >
< title > 4DSTAR Bundle Manager< / title >
< link rel = "stylesheet" href = "styles.css" >
< / head >
< body >
< div class = "main-container" >
2025-08-10 08:01:46 -04:00
<!-- Primary Category Sidebar (Tier 1) -->
< aside class = "primary-sidebar" id = "primary-sidebar" >
< div class = "primary-sidebar-header" >
< div class = "brand-icon" >
< div class = "star-icon" > ✦< / div >
< div class = "brand-text" > 4D< / div >
< h3 class = "app-title" > STAR< / h3 >
< / div >
2025-08-09 18:48:34 -04:00
< / div >
2025-08-10 08:01:46 -04:00
< nav class = "category-nav" >
< div class = "category-item active" data-category = "libplugin" title = "libplugin" >
< div class = "category-icon" style = "background-color: #3b82f6;" > LP< / div >
< span class = "category-label" > libplugin< / span >
< / div >
< div class = "category-item" data-category = "libconstants" title = "libconstants" >
< div class = "category-icon" style = "background-color: #10b981;" > LC< / div >
< span class = "category-label" > libconstants< / span >
< / div >
< div class = "category-item" data-category = "opat" title = "OPAT Core" >
< div class = "category-icon" style = "background-color: #f59e0b;" > OC< / div >
< span class = "category-label" > OPAT Core< / span >
< / div >
< div class = "category-item" data-category = "serif" title = "SERiF Libraries" >
< div class = "category-icon" style = "background-color: #ef4444;" > SL< / div >
< span class = "category-label" > SERiF Libraries< / span >
< / div >
2025-08-09 18:48:34 -04:00
< / nav >
2025-08-10 08:01:46 -04:00
< div class = "primary-sidebar-footer" >
< div class = "version-info" > v1.0.0< / div >
2025-08-10 07:14:31 -04:00
< button id = "info-btn" class = "info-button" title = "About 4DSTAR" >
< span class = "info-icon" > ℹ ️ < / span >
2025-08-10 08:01:46 -04:00
< span class = "info-label" > Info< / span >
2025-08-10 07:14:31 -04:00
< / button >
2025-08-09 18:48:34 -04:00
< / div >
< / aside >
2025-08-10 08:01:46 -04:00
<!-- Secondary Content Sidebar (Tier 2) -->
< aside class = "secondary-sidebar" id = "secondary-sidebar" >
<!-- libplugin content (existing sidebar content) -->
< div class = "sidebar-content" data-category = "libplugin" >
< div class = "sidebar-header" >
< h3 > Bundle Manager< / h3 >
< / div >
< nav class = "sidebar-nav" >
< button id = "open-bundle-btn" class = "nav-button active" > Open Bundle< / button >
< button id = "create-bundle-btn" class = "nav-button" > Create Bundle< / button >
< / nav >
< / div >
<!-- libconstants content (empty for now) -->
< div class = "sidebar-content hidden" data-category = "libconstants" >
< div class = "sidebar-header" >
< h3 > Constants< / h3 >
< / div >
< div class = "empty-state" >
< p > Constants tools coming soon...< / p >
< / div >
< / div >
<!-- OPAT Core content (empty for now) -->
< div class = "sidebar-content hidden" data-category = "opat" >
< div class = "sidebar-header" >
< h3 > OPAT Core< / h3 >
< / div >
< div class = "empty-state" >
< p > OPAT tools coming soon...< / p >
< / div >
< / div >
<!-- SERiF Libraries content (empty for now) -->
< div class = "sidebar-content hidden" data-category = "serif" >
< div class = "sidebar-header" >
< h3 > SERiF Libraries< / h3 >
< / div >
< div class = "empty-state" >
< p > SERiF tools coming soon...< / p >
< / div >
< / div >
< / aside >
2025-08-09 18:48:34 -04:00
< main class = "content-area" >
< div id = "welcome-screen" >
< h1 > Welcome to 4DSTAR Bundle Manager< / h1 >
< p > Open or create a bundle to get started.< / p >
< / div >
< div id = "bundle-view" class = "hidden" >
< header class = "content-header" >
< h2 id = "bundle-title" > < / h2 >
< div class = "action-buttons" >
< button id = "sign-bundle-btn" > Sign< / button >
< button id = "validate-bundle-btn" > Validate< / button >
< button id = "clear-bundle-btn" > Clear< / button >
2025-08-09 20:16:07 -04:00
< button id = "save-metadata-btn" class = "hidden" > Save Changes< / button >
2025-08-09 18:48:34 -04:00
< / div >
< / header >
< div class = "tab-nav" >
< button class = "tab-link active" data-tab = "overview-tab" > Overview< / button >
< button class = "tab-link" data-tab = "plugins-tab" > Plugins< / button >
2025-08-09 20:41:01 -04:00
< button class = "tab-link" data-tab = "fill-tab" id = "fill-tab-link" > Fill< / button >
< button class = "tab-link hidden" data-tab = "validation-tab" > Validation< / button >
2025-08-09 18:48:34 -04:00
< / div >
< div id = "tab-content" >
< div id = "overview-tab" class = "tab-pane active" >
< div id = "manifest-details" > < / div >
< / div >
< div id = "plugins-tab" class = "tab-pane" >
< div id = "plugins-list" > < / div >
< / div >
< div id = "validation-tab" class = "tab-pane" >
< pre id = "validation-results" > < / pre >
< / div >
2025-08-09 20:41:01 -04:00
< div id = "fill-tab" class = "tab-pane" >
< div class = "fill-header" >
< h3 > Fill Bundle with Compiled Binaries< / h3 >
< p > Select the targets you want to build and add to the bundle:< / p >
< div class = "fill-header-actions" >
< button id = "load-fillable-targets-btn" class = "action-button primary" > Load Available Targets< / button >
< / div >
< / div >
< div id = "fill-targets-container" >
< div id = "fill-loading" class = "hidden" >
< p > Loading available targets...< / p >
< / div >
< div id = "fill-no-targets" class = "hidden" >
< p > No fillable targets available. The bundle may already be complete.< / p >
< / div >
< div id = "fill-targets-content" class = "hidden" >
< div id = "fill-plugins-tables" > < / div >
< div class = "fill-actions" >
< button id = "select-all-targets" class = "action-button secondary" > Select All< / button >
< button id = "deselect-all-targets" class = "action-button secondary" > Deselect All< / button >
< button id = "start-fill-process" class = "action-button primary" > Start Building< / button >
< / div >
< / div >
< / div >
< div id = "fill-progress-container" class = "hidden" >
< h4 > Build Progress< / h4 >
< div id = "fill-progress-content" > < / div >
< / div >
< / div >
2025-08-09 18:48:34 -04:00
< / div >
< / div >
< div id = "create-bundle-form" class = "hidden" >
<!-- The create form will be moved into a modal later -->
< / div >
< / main >
< / div >
<!-- Modal for status/error messages -->
< div id = "modal" class = "modal-container hidden" >
< div class = "modal-content" >
< span id = "modal-close-btn" class = "modal-close" > × < / span >
< h3 id = "modal-title" > < / h3 >
< div id = "modal-message" > < / div >
< / div >
< / div >
2025-08-09 20:16:07 -04:00
<!-- Spinner Overlay -->
< div id = "spinner-overlay" class = "spinner-overlay hidden" >
< div class = "spinner" > < / div >
< p > Processing...< / p >
< / div >
<!-- Save Options Modal -->
< div id = "save-options-modal" class = "modal-container hidden" >
< div class = "modal-content" >
< div class = "modal-header" >
< h3 > Save Metadata Changes< / h3 >
< button class = "modal-close" onclick = "hideSaveOptionsModal()" > × < / button >
< / div >
< div class = "modal-body" >
2025-08-10 07:00:21 -04:00
< div id = "signature-warning-section" class = "signature-warning-section hidden" >
< div class = "warning-banner" >
< span class = "warning-icon" > ⚠️< / span >
< div class = "warning-text" >
< strong > Signature Warning:< / strong > This operation will invalidate the bundle's digital signature.
You will need to re-sign the bundle using the < strong > Sign< / strong > button and a < strong > PEM private key< / strong > file.
< / div >
< / div >
< / div >
2025-08-09 20:16:07 -04:00
< p > How would you like to save your metadata changes?< / p >
< div class = "save-options" >
< button id = "overwrite-bundle-btn" class = "save-option-btn primary" >
< strong > Overwrite Current Bundle< / strong >
< small > Update the existing bundle file< / small >
< / button >
< button id = "save-as-new-btn" class = "save-option-btn secondary" >
< strong > Save As New Bundle< / strong >
< small > Create a new bundle file with changes< / small >
< / button >
< / div >
< / div >
< / div >
< / div >
2025-08-10 07:00:21 -04:00
<!-- Signature Invalidation Warning Modal -->
< div id = "signature-warning-modal" class = "modal-container hidden" >
< div class = "modal-content" >
< h2 > ⚠️ Signature Warning< / h2 >
< div class = "warning-content" >
< p > < strong > This operation will invalidate the bundle's digital signature.< / strong > < / p >
< p > After making changes, you will need to re-sign the bundle using:< / p >
< ul >
< li > The < strong > Sign< / strong > button in the action bar< / li >
< li > A valid < strong > PEM private key< / strong > file< / li >
< / ul >
< p > Do you want to continue?< / p >
< / div >
< div class = "modal-actions" >
< button id = "signature-warning-cancel" class = "action-button secondary" > Cancel< / button >
< button id = "signature-warning-continue" class = "action-button primary" > Continue< / button >
< / div >
< / div >
< / div >
2025-08-10 07:14:31 -04:00
<!-- Info Modal -->
< div id = "info-modal" class = "modal-container hidden" >
< div class = "modal-content info-modal-content" >
< div class = "modal-header" >
< h3 > About 4DSTAR< / h3 >
< button class = "modal-close" onclick = "hideInfoModal()" > × < / button >
< / div >
< div class = "info-modal-body" >
< div class = "info-tab-nav" >
< button class = "info-tab-link active" data-tab = "about-info-tab" > About< / button >
< button class = "info-tab-link" data-tab = "license-info-tab" > License< / button >
< button class = "info-tab-link" data-tab = "funding-info-tab" > Funding< / button >
< button class = "info-tab-link" data-tab = "help-info-tab" > Help< / button >
< / div >
< div class = "info-tab-content" >
< div id = "about-info-tab" class = "info-tab-pane active" >
< h4 > 4DSTAR Bundle Manager< / h4 >
< p > < strong > Author:< / strong > Emily M. Boudreaux< / p >
< p > < strong > Version:< / strong > 1.0.0< / p >
< p > < strong > Description:< / strong > A modern bundle management tool for 4DSTAR stellar evolution models, providing an intuitive interface for creating, signing, validating, and filling binary bundles.< / p >
< div class = "info-links" >
< a href = "#" id = "github-link" class = "info-link" >
< span class = "link-icon" > 🔗< / span >
View on GitHub
< / a >
< / div >
< / div >
< div id = "license-info-tab" class = "info-tab-pane" >
< h4 > License Information< / h4 >
< p > < strong > License:< / strong > GNU General Public License v3.0< / p >
< div class = "license-content" >
< p > This software is licensed under GPL v3. License text will be added here.< / p >
< textarea readonly class = "license-text" placeholder = "GPL v3 license text will be pasted here..." > < / textarea >
< / div >
< / div >
< div id = "funding-info-tab" class = "info-tab-pane" >
< h4 > Funding & Support< / h4 >
< div class = "funding-content" >
< p > Funding information placeholder - content will be added here.< / p >
< / div >
< / div >
< div id = "help-info-tab" class = "info-tab-pane" >
< h4 > Help & Documentation< / h4 >
< div class = "help-content" >
< h5 > Getting Started< / h5 >
< ul >
< li > < strong > Open Bundle:< / strong > Click "Open Bundle" to load an existing .fbundle file< / li >
< li > < strong > Create Bundle:< / strong > Click "Create Bundle" to build a new bundle from plugins< / li >
< li > < strong > Sign Bundle:< / strong > Use the Sign button to digitally sign your bundle with a PEM key< / li >
< li > < strong > Fill Bundle:< / strong > Use the Fill tab to compile and add binaries for different platforms< / li >
< / ul >
< h5 > Bundle Operations< / h5 >
< ul >
< li > < strong > Validate:< / strong > Check bundle integrity and compatibility< / li >
< li > < strong > Edit Metadata:< / strong > Click pencil icons to edit version, author, and comments< / li >
< li > < strong > Clear:< / strong > Remove all compiled binaries from the bundle< / li >
< / ul >
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
2025-08-10 07:00:21 -04:00
<!-- Fill Modal (Legacy - can be removed later) -->
2025-08-09 20:41:01 -04:00
< div id = "fill-modal" class = "modal-container hidden" >
2025-08-09 18:48:34 -04:00
< div class = "modal-content" >
< span class = "close-fill-modal-button" > × < / span >
< h2 id = "fill-modal-title" > Fill Bundle< / h2 >
< div id = "fill-modal-body" >
2025-08-10 07:00:21 -04:00
< p > Select the targets you want to build:< / p >
2025-08-09 18:48:34 -04:00
< div id = "fill-targets-list" > < / div >
2025-08-10 07:00:21 -04:00
< button id = "start-fill-button" > Start Fill< / button >
2025-08-09 18:48:34 -04:00
< / div >
< div id = "fill-progress-view" style = "display: none;" >
< div id = "fill-progress-list" > < / div >
< / div >
< / div >
< / div >
< div id = "spinner" class = "spinner hidden" > < / div >
< script src = "renderer.js" > < / script >
< / body >
< / html >
