About-Dialog als eigenes Fenster (Eto-Form + WebView) statt Inline-Modal

User-Feedback: About sollte nicht als overlay im Panel erscheinen sondern
ein echtes OS-Fenster sein wie Kamera/Masse-Settings.

Neu:
- rhino/about.py: open_as_window() via panel_base.open_satellite_window
  (read-only, kein Bridge-Save/Cancel-Callback noetig)
- src/AboutApp.jsx: gleiche Inhalte wie der vorige Modal — Versionen,
  Autor, Website, Lizenz — in einer 440x380 Eto-Form
- src/main.jsx: mode 'about' → AboutApp
- openAbout() in rhinoBridge.js sendet OPEN_ABOUT an Oberleiste
- OberleisteBridge handler OPEN_ABOUT → about.open_as_window()

OberleisteApp:
- Logo-onClick aufgeräumt: openAbout() statt setAboutOpen(true)
- aboutOpen-State und die AboutModal-Komponente entfernt

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
2026-05-20 22:07:23 +02:00
parent 76572968ca
commit c8286b931b
6 changed files with 92 additions and 81 deletions
+55
View File
@@ -0,0 +1,55 @@
import { useEffect } from 'react'
import { notifyReady } from './lib/rhinoBridge'
export default function AboutApp() {
useEffect(() => { notifyReady() }, [])
return (
<div style={{
padding: '28px 32px',
fontFamily: 'var(--font)', color: 'var(--text-primary)',
background: 'var(--bg-panel)', minHeight: '100vh',
boxSizing: 'border-box',
}}>
<div style={{ display: 'flex', alignItems: 'baseline', gap: 8,
marginBottom: 4 }}>
<span style={{
fontFamily: "Krungthep, 'Archivo Black', sans-serif",
fontSize: 32, letterSpacing: '-0.02em', lineHeight: 1,
}}>
DOSSIER<span style={{ color: 'var(--accent)' }}>.</span>
</span>
</div>
<div style={{ fontSize: 11, color: 'var(--text-muted)',
letterSpacing: '0.06em', textTransform: 'uppercase',
marginBottom: 22 }}>
Teil von OpenStudio
</div>
<div style={{ display: 'grid', gridTemplateColumns: 'auto 1fr',
gap: '8px 16px', fontSize: 12, marginBottom: 22 }}>
<span style={{ color: 'var(--text-muted)' }}>Launcher</span>
<span style={{ fontFamily: 'DM Mono, monospace' }}>v{__LAUNCHER_VERSION__}</span>
<span style={{ color: 'var(--text-muted)' }}>Plugin</span>
<span style={{ fontFamily: 'DM Mono, monospace' }}>v{__APP_VERSION__}</span>
<span style={{ color: 'var(--text-muted)' }}>Autor</span>
<span>Karim Gabriele Varano</span>
<span style={{ color: 'var(--text-muted)' }}>Website</span>
<a href="https://gabrielevarano.ch" target="_blank" rel="noreferrer"
style={{ color: 'var(--accent)', textDecoration: 'none' }}>
gabrielevarano.ch
</a>
<span style={{ color: 'var(--text-muted)' }}>Lizenz</span>
<span>Proprietär © 2026 Karim Gabriele Varano</span>
</div>
<div style={{ fontSize: 11, color: 'var(--text-muted)',
lineHeight: 1.5,
paddingTop: 14,
borderTop: '1px solid var(--border-light)' }}>
Rhino 8 Plugin für architektonische Workflows Wände, Decken,
Öffnungen, Räume, SIA 416, Plan-Layouts. Schwester-App: Rapport.
</div>
</div>
)
}
+2 -81
View File
@@ -11,6 +11,7 @@ import {
deleteLayerCombination, openLayerCombinationsDialog,
openDossierSettings, openKameraPanel,
setMasseActive, openMasseSettings,
openAbout,
} from './lib/rhinoBridge'
const PRESETS = [
@@ -208,7 +209,6 @@ export default function OberleisteApp() {
const [draft, setDraft] = useState('')
const [customMode, setCustomMode] = useState(false) // Dropdown -> Custom-Input switch
const customInputRef = useRef(null)
const [aboutOpen, setAboutOpen] = useState(false)
useEffect(() => {
onMessage('STATE', (s) => {
@@ -298,7 +298,7 @@ export default function OberleisteApp() {
}}>
{/* Logo: DOSSIER. (Petrol-Punkt) — Klick = About-Fenster */}
<button
onClick={() => setAboutOpen(true)}
onClick={() => openAbout()}
title="Über Dossier"
style={{
display: 'flex', alignItems: 'baseline', gap: 8,
@@ -558,85 +558,6 @@ export default function OberleisteApp() {
{/* Spacer am rechten Rand */}
<div style={{ flex: 1 }} />
</div>
{aboutOpen && (
<AboutModal onClose={() => setAboutOpen(false)} />
)}
</div>
)
}
function AboutModal({ onClose }) {
return (
<div
onClick={onClose}
style={{
position: 'fixed', inset: 0, zIndex: 1000,
background: 'rgba(0, 0, 0, 0.6)',
display: 'flex', alignItems: 'center', justifyContent: 'center',
}}
>
<div
onClick={(e) => e.stopPropagation()}
style={{
minWidth: 360, maxWidth: 420,
background: 'var(--bg-panel)',
border: '1px solid var(--border)',
borderRadius: 8,
padding: '24px 28px',
boxShadow: '0 12px 48px rgba(0, 0, 0, 0.5)',
color: 'var(--text-primary)',
fontFamily: 'var(--font)',
}}
>
<div style={{ display: 'flex', alignItems: 'baseline', gap: 8,
marginBottom: 4 }}>
<span style={{
fontFamily: "Krungthep, 'Archivo Black', sans-serif",
fontSize: 28, letterSpacing: '-0.02em', lineHeight: 1,
}}>
DOSSIER<span style={{ color: 'var(--accent)' }}>.</span>
</span>
</div>
<div style={{ fontSize: 11, color: 'var(--text-muted)',
letterSpacing: '0.06em', textTransform: 'uppercase',
marginBottom: 18 }}>
Teil von OpenStudio
</div>
<div style={{ display: 'grid', gridTemplateColumns: 'auto 1fr',
gap: '6px 14px', fontSize: 11, marginBottom: 18 }}>
<span style={{ color: 'var(--text-muted)' }}>Launcher</span>
<span style={{ fontFamily: 'DM Mono, monospace' }}>v{__LAUNCHER_VERSION__}</span>
<span style={{ color: 'var(--text-muted)' }}>Plugin</span>
<span style={{ fontFamily: 'DM Mono, monospace' }}>v{__APP_VERSION__}</span>
<span style={{ color: 'var(--text-muted)' }}>Autor</span>
<span>Karim Gabriele Varano</span>
<span style={{ color: 'var(--text-muted)' }}>Website</span>
<a href="https://gabrielevarano.ch" target="_blank" rel="noreferrer"
style={{ color: 'var(--accent)', textDecoration: 'none' }}>
gabrielevarano.ch
</a>
<span style={{ color: 'var(--text-muted)' }}>Lizenz</span>
<span>Proprietär © 2026 Karim Gabriele Varano</span>
</div>
<div style={{ fontSize: 10, color: 'var(--text-muted)',
lineHeight: 1.5, marginBottom: 18,
paddingTop: 12,
borderTop: '1px solid var(--border-light)' }}>
Rhino 8 Plugin für architektonische Workflows Wände, Decken,
Öffnungen, Räume, SIA 416, Plan-Layouts. Schwester-App: Rapport.
</div>
<div style={{ display: 'flex', justifyContent: 'flex-end' }}>
<button
onClick={onClose}
className="btn-contained"
style={{ padding: '6px 18px', fontSize: 11 }}
>Schliessen</button>
</div>
</div>
</div>
)
}
+1
View File
@@ -170,6 +170,7 @@ export function setOverridesPreset(name) { send('SET_OVERRIDES_PRESET', { name:
export function saveOverridesPreset(name) { send('SAVE_OVERRIDES_PRESET', { name }) }
export function openOverridesPanel() { send('OPEN_OVERRIDES_PANEL', {}) }
export function openKameraPanel() { send('OPEN_KAMERA_PANEL', {}) }
export function openAbout() { send('OPEN_ABOUT', {}) }
// --- Masse (in Oberleiste + Satellite-Fenster MasseSettings) ---
// Topbar: aktives Mass setzen + Settings-Fenster oeffnen
+2
View File
@@ -13,6 +13,7 @@ import SwisstopoApp from './SwisstopoApp.jsx'
import OsmApp from './OsmApp.jsx'
import KameraApp from './KameraApp.jsx'
import MasseSettingsApp from './MasseSettingsApp.jsx'
import AboutApp from './AboutApp.jsx'
import GestaltungApp from './GestaltungApp.jsx'
import AusschnitteApp from './AusschnitteApp.jsx'
import MassstabApp from './MassstabApp.jsx'
@@ -44,6 +45,7 @@ const RootApp = mode === 'gestaltung' ? GestaltungApp
: mode === 'osm' ? OsmApp
: mode === 'kamera' ? KameraApp
: mode === 'masse_settings' ? MasseSettingsApp
: mode === 'about' ? AboutApp
: App
window.onerror = function (msg, src, line, col, err) {