From 8e3dfa54f98b570744c088c93059cc8d226f97d0 Mon Sep 17 00:00:00 2001 From: ThePetrovich Date: Sun, 14 Dec 2025 18:06:17 +0800 Subject: [PATCH] Refactoring of various stuff big mess, I don't remember what I was trying to accomplish there --- src/lib/components/ControlPanel.svelte | 259 ++++++++---- src/lib/components/GenericPanel.svelte | 55 +++ src/lib/components/Map.svelte | 4 +- src/lib/components/PanelContainer.svelte | 3 +- src/lib/components/PointEditor.svelte | 399 ------------------ src/lib/components/ScenarioPanel.svelte | 13 +- src/lib/components/WindVisualisation.svelte | 136 ++---- .../{ => editors}/CurveEditor.svelte | 8 +- .../components/editors/GenericEditor.svelte | 366 ++++++++++++++++ src/lib/components/editors/PointEditor.svelte | 166 ++++++++ .../{ => editors}/ScenarioEditor.svelte | 4 +- .../components/{ => ui}/EditableCell.svelte | 0 .../InputClearable.svelte} | 0 src/lib/components/ui/LabelGroup.svelte | 37 ++ .../{ => ui}/SelectSearchable.svelte | 93 +++- src/lib/components/ui/SpoilerGroup.svelte | 58 +++ .../components/{ => ui}/TabComponent.svelte | 6 +- src/lib/components/{ => ui}/Toast.svelte | 0 src/lib/mathutil.ts | 54 ++- src/routes/predict/+page.svelte | 46 +- src/routes/user/templates/+page.svelte | 6 +- static/css/custom.css | 17 +- 22 files changed, 1083 insertions(+), 647 deletions(-) create mode 100644 src/lib/components/GenericPanel.svelte delete mode 100644 src/lib/components/PointEditor.svelte rename src/lib/components/{ => editors}/CurveEditor.svelte (98%) create mode 100644 src/lib/components/editors/GenericEditor.svelte create mode 100644 src/lib/components/editors/PointEditor.svelte rename src/lib/components/{ => editors}/ScenarioEditor.svelte (98%) rename src/lib/components/{ => ui}/EditableCell.svelte (100%) rename src/lib/components/{ScenarioTemplateEditor.svelte => ui/InputClearable.svelte} (100%) create mode 100644 src/lib/components/ui/LabelGroup.svelte rename src/lib/components/{ => ui}/SelectSearchable.svelte (69%) create mode 100644 src/lib/components/ui/SpoilerGroup.svelte rename src/lib/components/{ => ui}/TabComponent.svelte (83%) rename src/lib/components/{ => ui}/Toast.svelte (100%) diff --git a/src/lib/components/ControlPanel.svelte b/src/lib/components/ControlPanel.svelte index b57e49c..237b802 100644 --- a/src/lib/components/ControlPanel.svelte +++ b/src/lib/components/ControlPanel.svelte @@ -46,12 +46,16 @@ InputGroup, InputGroupText, Label, + Dropdown, + DropdownToggle, + DropdownMenu, + DropdownItem, } from "@sveltestrap/sveltestrap"; import { getSavedPoints, updatePoint } from "$lib/api/points"; - import { addToast } from "$lib/components/Toast.svelte"; - import PointEditor from "$lib/components/PointEditor.svelte"; - import SelectSearchable from "$lib/components/SelectSearchable.svelte"; + import { addToast } from "$lib/components/ui/Toast.svelte"; + import PointEditor from "$lib/components/editors/PointEditor.svelte"; + import SelectSearchable from "$lib/components/ui/SelectSearchable.svelte"; import { getForecast } from "$lib/prediction"; import { FlightParametersStore, @@ -61,7 +65,10 @@ flightParametersDefaults, } from "$lib/stores"; import { PROFILE_MAP, type FlightParameters, type SavedPoint } from "$lib/types"; - import CurveEditor from "./CurveEditor.svelte"; + import CurveEditor from "$lib/components/editors/CurveEditor.svelte"; + import SpoilerGroup from "$lib/components/ui/SpoilerGroup.svelte"; + import LabelGroup from "./ui/LabelGroup.svelte"; + import { toFixedNumber } from "$lib/mathutil"; // Props interface Props { @@ -75,6 +82,9 @@ let startTime = $state(readLocalStorage("startTime", "12:00:00")); let selectedPointId = $state($FlightParametersStore.start_point || -1); + let ascentProfile = $state("standard"); + let descentProfile = $state("standard"); + // Component References let pointEditorRef: PointEditor | null = null; let curveEditorRef: CurveEditor | null = null; @@ -159,23 +169,14 @@ }); } else { // Create new point - pointEditorRef?.openModalAndCreate( - null, - { - id: 0, - name: `New Point ${new Date().toLocaleString()}`, - lat: $FlightParametersStore.launch_latitude, - lon: $FlightParametersStore.launch_longitude, - alt: $FlightParametersStore.launch_altitude, - }, - true, - false, - (savedPoint) => { - if (savedPoint) { - handlePointSelection(savedPoint.id); - } - }, - ); + pointEditorRef?.open({ + id: 0, // Assuming 0 or a negative number indicates a new point + name: `New Point ${new Date().toLocaleString()}`, + lat: $FlightParametersStore.launch_latitude, + lon: $FlightParametersStore.launch_longitude, + alt: $FlightParametersStore.launch_altitude, + // The onSave callback is handled by the onSelectPoint prop on the component + }, false); } } @@ -198,8 +199,8 @@ // Public API export function updateLaunchPosition(lat: number, lng: number) { - $FlightParametersStore.launch_latitude = lat; - $FlightParametersStore.launch_longitude = lng; + $FlightParametersStore.launch_latitude = toFixedNumber(lat, 6); + $FlightParametersStore.launch_longitude = toFixedNumber(lng, 6); } export function loadFlightParameters(params: FlightParameters) { @@ -256,60 +257,32 @@ - + -
- handlePointSelection(e)} - options={$SavedPointsStore.map((point) => ({ - value: point.id, - label: `${point.name} ${point.id === selectedPointId && isPointDirty() ? "(изменено)" : ""}`, - }))} - placeholder="Новая точка..." - searchPlaceholder="Поиск по точкам..." /> - {#if selectedPointId !== -1} - - {/if} -
+ handlePointSelection(e)} + options={$SavedPointsStore.map((point) => ({ + value: point.id, + label: `${point.name} ${point.id === selectedPointId && isPointDirty() ? "(изменено)" : ""}`, + }))} + placeholder="Новая точка..." + clearable={true} + searchPlaceholder="Поиск по точкам..." /> + -
- - - -
- @@ -332,6 +305,35 @@ +
+ + + + + + Сохранить как новую... + Удалить выбранную точку + + Сбросить изменения + + +
+
@@ -371,19 +373,120 @@
{:else} - -

Custom profile editor is not yet implemented.

- + + {:else if ascentProfile === "standard"} + + + + + + + + + {/if} + +
+ + + +
+ {#if descentProfile === "custom"} + + {}} + options={$SavedPointsStore.map((point) => ({ + value: point.id, + label: `test`, + }))} + clearable={true} + placeholder="Выбрать профиль..." + searchPlaceholder="Поиск по профилям..." /> + + + {:else if descentProfile === "standard"} + + + + + + + + + + {/if} + + {/if} -
- +
+ + + + + + Сохранить + Сохранить как новый... + + Сбросить настройки + +
{/if} - handlePointSelection(point.id)} /> - + + { + if (point) { + handlePointSelection(point.id); + } else { + handlePointSelection(-1); // Clear selection + } + }} /> diff --git a/src/lib/components/GenericPanel.svelte b/src/lib/components/GenericPanel.svelte new file mode 100644 index 0000000..a63e0c1 --- /dev/null +++ b/src/lib/components/GenericPanel.svelte @@ -0,0 +1,55 @@ + + + + + + + + {#if !isCollapsed} + + + + {/if} + diff --git a/src/lib/components/Map.svelte b/src/lib/components/Map.svelte index d47069d..ae1bd1a 100644 --- a/src/lib/components/Map.svelte +++ b/src/lib/components/Map.svelte @@ -143,14 +143,14 @@
-
+ {#if map && windData} diff --git a/src/lib/components/PanelContainer.svelte b/src/lib/components/PanelContainer.svelte index 929cf92..f8988dd 100644 --- a/src/lib/components/PanelContainer.svelte +++ b/src/lib/components/PanelContainer.svelte @@ -1,11 +1,12 @@ -
+
diff --git a/src/lib/components/PointEditor.svelte b/src/lib/components/PointEditor.svelte deleted file mode 100644 index 0d2c79e..0000000 --- a/src/lib/components/PointEditor.svelte +++ /dev/null @@ -1,399 +0,0 @@ - - - -
-
- {isEditing ? "Редактирование точки" : showTable ? "Сохраненные точки" : "Добавить новую точку"} -
- -
-
- {#if showTable} -
- search.set()} /> - -
-
- - - - - - - - - - - - {#each table.rows as row} - - - - - - - - {/each} - -
Название точкиШиротаДолготаВысотаДействия
{row.name}{row.lat} °{row.lon} °{row.alt} м - - - - - -
-
- - - table.setPage("previous")} /> - - {#each table.pagesWithEllipsis as page} - - table.setPage(page)}>{page} - - {/each} - - table.setPage("next")} /> - - - {/if} - - {#if showTable && (isEditing || newPoint.lat || newPoint.lon)}
{/if} - - -
- {#if showTable} -
{isEditing ? "Редактирование точки" : "Добавить новую точку"}
- {/if} - (isAlertVisible = false)} - fade={false} - class="mb-2"> - - {alertText} - -
{ - e.preventDefault(); - handleSavePoint(); - }}> -
- - -
-
- - - - Градусы - - - - - Градусы - - - - - Метры над ур. моря - -
-
- - {#if isEditing} - - {/if} - - {#if isEditing} - - {:else} - - {/if} -
-
-
-
- - - { - isConfirmationVisible = false; - handleDeletePoint(selectedPoint); - }} - oncancel={() => { - isConfirmationVisible = false; - }}> -

Вы уверены, что хотите удалить эту точку?

- diff --git a/src/lib/components/ScenarioPanel.svelte b/src/lib/components/ScenarioPanel.svelte index e24bc04..d1c9b18 100644 --- a/src/lib/components/ScenarioPanel.svelte +++ b/src/lib/components/ScenarioPanel.svelte @@ -16,10 +16,10 @@ import type { SavedScenario } from "$lib/types"; import { getSavedScenarios, updateScenario, saveScenario } from "$lib/api/scenarios"; import { FlightParametersStore, writeLocalStorage, ScenarioStore, SavedScenarioStore } from "$lib/stores"; - import SelectSearchable from "$lib/components/SelectSearchable.svelte"; + import SelectSearchable from "$lib/components/ui/SelectSearchable.svelte"; import { onMount } from "svelte"; - import { addToast } from "./Toast.svelte"; - import ScenarioEditor from "./ScenarioEditor.svelte"; + import { addToast } from "./ui/Toast.svelte"; + import ScenarioEditor from "$lib/components/editors/ScenarioEditor.svelte"; let isCollapsed = $state(false); let scenarioUnsaved = $derived(checkScenarioUnsaved()); @@ -187,12 +187,13 @@ bind:selected={selectedScenarioId} placeholder="Новый сценарий..." searchPlaceholder="Поиск сценариев..." - on:change={() => { + clearable={true} + onChange={() => { if (!scenarioUnsaved) { handleApplySelectedScenario(false); } }} /> - + -->
+ {/if} + {#if isOpen}
e.stopPropagation()} - autofocus />
@@ -161,13 +204,33 @@ } .dropdown-menu { - /* position is now set dynamically */ z-index: 1000; - width: max-content; /* Allow dropdown to grow with its content */ + width: max-content; } .options-list { max-height: 40vh; overflow-y: auto; } + + .clear-btn { + position: absolute; + top: 50%; + right: 2rem; + transform: translateY(-50%); + background: none; + border: none; + color: #2a2a2a; + font-size: 1rem; + cursor: pointer; + z-index: 2; + padding: 0; + line-height: 1; + display: flex; + align-items: center; + justify-content: center; + } + .clear-btn:focus { + outline: none; + } diff --git a/src/lib/components/ui/SpoilerGroup.svelte b/src/lib/components/ui/SpoilerGroup.svelte new file mode 100644 index 0000000..20c4b42 --- /dev/null +++ b/src/lib/components/ui/SpoilerGroup.svelte @@ -0,0 +1,58 @@ + + +
+ + + {#if expanded} +
+ {@render children?.()} +
+ {:else} +
+ {/if} +
+ + diff --git a/src/lib/components/TabComponent.svelte b/src/lib/components/ui/TabComponent.svelte similarity index 83% rename from src/lib/components/TabComponent.svelte rename to src/lib/components/ui/TabComponent.svelte index 0f71824..234762f 100644 --- a/src/lib/components/TabComponent.svelte +++ b/src/lib/components/ui/TabComponent.svelte @@ -7,14 +7,12 @@ label: string; }; - /** An array of tab objects to display. */ export let tabs: Tab[] = []; - - /** The id of the currently active tab. Use `bind:activeTab` for two-way binding. */ export let activeTab: string; + export let justify: 'start' | 'center' | 'end' = 'start'; -
+
{#each tabs as tab (tab.id)}