commit a365370b08a844d1ec9c2887ca5bbf7bd8ed38ba
parent dbcd5de9fcd83d83ca2f7ab8f2a84c6d85dddb72
Author: triesap <137732411+triesap@users.noreply.github.com>
Date: Sat, 7 Dec 2024 23:50:53 +0000
Edit `/farm/land/add` modify local coordinates to geolocation position type, add bind values to field inputs, add label select options for area and elevation units. Edit conf, routes.
Diffstat:
9 files changed, 164 insertions(+), 38 deletions(-)
diff --git a/src/lib/conf.ts b/src/lib/conf.ts
@@ -18,11 +18,6 @@ export const ks = {
export const root_symbol = "»--`--,---";
-export const ascii = {
- bullet: '•',
- dash: `—`
-}
-
export const err = {
nostr: {
no_relays: `error.nostr.no_relays_connected`
diff --git a/src/routes/(app)/farm/land/+page.svelte b/src/routes/(app)/farm/land/+page.svelte
@@ -1,13 +1,47 @@
<script lang="ts">
+ import { db } from "$lib/client";
+ import type { LocationGcs } from "@radroots/models";
import {
Fill,
LayoutView,
NavToolbar,
PageHeader,
TabsFloat,
+ app_notify,
ls,
route,
} from "@radroots/svelte-lib";
+ import { onMount } from "svelte";
+
+ type LoadData = {
+ location_gcss: LocationGcs[];
+ };
+ let ld: LoadData | undefined = undefined;
+
+ onMount(async () => {
+ try {
+ ld = await load_data();
+ } catch (e) {
+ } finally {
+ }
+ });
+
+ const load_data = async (): Promise<LoadData | undefined> => {
+ try {
+ const location_gcss = await db.location_gcs_get({
+ list: [`all`],
+ });
+ if (`err` in location_gcss) {
+ app_notify.set(`${$ls(`error.client.page.load`)}`);
+ return;
+ }
+ return {
+ location_gcss: location_gcss.results,
+ } satisfies LoadData;
+ } catch (e) {
+ console.log(`(error) load_data `, e);
+ }
+ };
</script>
<LayoutView>
diff --git a/src/routes/(app)/farm/land/add/+page.svelte b/src/routes/(app)/farm/land/add/+page.svelte
@@ -1,32 +1,48 @@
<script lang="ts">
import { dialog, geol } from "$lib/client";
import MapPointSelect from "$lib/components/map_point_select.svelte";
+ import type { IClientGeolocationPosition } from "@radroots/client";
import type { GeocoderReverseResult } from "@radroots/geocoder";
import {
ButtonGlyphPrimary,
- Fade,
- InputElement,
- LayoutView,
- NavToolbar,
- PageHeader,
carousel_dec,
carousel_inc,
carousel_index,
carousel_init,
+ Fade,
fmt_geol_latitude,
fmt_geol_longitude,
fmt_id,
+ Glyph,
+ GlyphTitleSelect,
+ InputElement,
+ LayoutView,
ls,
+ NavToolbar,
+ PageHeader,
+ SelectMenu,
} from "@radroots/svelte-lib";
- import { type GeolocationCoordinatesPoint, regex } from "@radroots/utils";
+ import { num_str, regex } from "@radroots/utils";
import { onMount } from "svelte";
let view_init: View = `c_1`;
type View = `c_1`;
let view: View = view_init;
- let _map_point: GeolocationCoordinatesPoint | undefined = undefined;
- let _map_geoc: GeocoderReverseResult | undefined = undefined;
+ let geol_pos: IClientGeolocationPosition | undefined = undefined;
+ let geol_c: GeocoderReverseResult | undefined = undefined;
+
+ let lgcs_label = ``;
+ let lgcs_area = ``;
+ let lgcs_area_unit = `ac`;
+ let lgcs_elevation = ``;
+ let lgcs_elevation_unit = `m`;
+ let lgcs_climate = ``;
+
+ $: lgcs_elevation =
+ typeof geol_pos?.altitude === `number`
+ ? num_str(geol_pos.altitude)
+ : lgcs_elevation;
onMount(async () => {
try {
@@ -46,10 +62,7 @@
);
return;
}
- _map_point = {
- lat: geolc.lat,
- lng: geolc.lng,
- };
+ geol_pos = geolc;
} catch (e) {
console.log(`(error) init_page `, e);
}
@@ -76,7 +89,12 @@
<NavToolbar />
<PageHeader
basis={{
- label: `${$ls(`icu.add_*`, { value: `${$ls(`common.farm_land`)}` })}`,
+ label: [
+ `${$ls(`icu.add_*`, { value: `${$ls(`common.farm_land`)}` })}`,
+ {
+ route: `/farm/land`,
+ },
+ ],
}}
>
<div slot="option" class={`flex flex-row justify-start items-center`}>
@@ -109,13 +127,13 @@
<div
class={`flex flex-col w-full px-4 gap-4 justify-start items-center`}
>
- {#if _map_point}
+ {#if geol_pos}
<div
- class={`flex flex-row h-[24rem] w-full justify-center items-center round-44 overflow-hidden`}
+ class={`flex flex-row h-[24rem] w-full justify-center items-center bg-layer-2-surface round-44 overflow-hidden`}
>
<MapPointSelect
- bind:map_point={_map_point}
- bind:map_geoc={_map_geoc}
+ bind:map_point={geol_pos}
+ bind:map_geoc={geol_c}
/>
</div>
<div
@@ -125,11 +143,24 @@
basis={{
label: `${$ls(`icu.add_*`, { value: `${$ls(`common.location`)}` })}`,
callback: async () => {
- if (_map_geoc) await handle_inc();
+ if (geol_c) await handle_inc();
},
}}
/>
</div>
+ {:else}
+ <div
+ class={`flex flex-row h-[24rem] w-full justify-center items-center bg-layer-2-surface round-44`}
+ >
+ <Glyph
+ basis={{
+ classes: `text-layer-0-glyph`,
+ dim: `md`,
+ weight: `bold`,
+ key: `compass`,
+ }}
+ />
+ </div>
{/if}
</div>
</div>
@@ -143,7 +174,7 @@
<div
class={`flex flex-col h-[24rem] w-full px-2 gap-4 justify-start items-center`}
>
- {#if _map_geoc && _map_point}
+ {#if geol_c && geol_pos}
<div
class={`flex flex-col w-full gap-1 justify-start items-start`}
>
@@ -162,7 +193,7 @@
<p
class={`font-sans font-[400] text-[1.1rem] text-layer-0-glyph`}
>
- {`${_map_geoc.name}, ${_map_geoc.admin1_id}, ${_map_geoc.country_name}`}
+ {`${geol_c.name}, ${geol_c.admin1_id}, ${geol_c.country_name}`}
</p>
</div>
</div>
@@ -181,11 +212,11 @@
class={`font-sans font-[400] text-[1.1rem] text-layer-0-glyph`}
>
{`${fmt_geol_latitude(
- _map_point.lat,
+ geol_pos.lat,
`d`,
4,
)}, ${fmt_geol_longitude(
- _map_point.lng,
+ geol_pos.lng,
`d`,
4,
)}`}
@@ -208,8 +239,9 @@
class={`flex flex-row h-12 w-full justify-start items-center border-y-line border-layer-0-surface-edge`}
>
<InputElement
+ bind:value={lgcs_label}
basis={{
- id: fmt_id(`farm_estate`),
+ id: fmt_id(`label`),
sync: true,
layer: 0,
classes: `h-10 placeholder:text-[1.1rem]`,
@@ -227,18 +259,51 @@
class={`flex flex-col w-full gap-1 justify-start items-start`}
>
<div
- class={`flex flex-row w-full justify-start items-center`}
+ class={`flex flex-row w-full gap-1 justify-start items-center`}
>
<p
class={`font-sansd text-trellisTitle text-layer-0-glyph-label uppercase`}
>
- {`${$ls(`common.area`)} (ac.)`}
+ {`${$ls(`common.area`)}`}
</p>
+ <SelectMenu
+ bind:value={lgcs_area_unit}
+ basis={{
+ layer: 0,
+ options: [
+ {
+ entries: [
+ {
+ label: `${$ls(`measurement.area.ac`)}`,
+ value: `ac`,
+ },
+ {
+ label: `${$ls(`measurement.area.ha`)}`,
+ value: `ha`,
+ },
+ {
+ label: `${$ls(`measurement.area.m2`)}`,
+ value: `m2`,
+ },
+ ],
+ },
+ ],
+ }}
+ >
+ <svelte:fragment slot="element">
+ <GlyphTitleSelect
+ basis={{
+ label: `${$ls(`measurement.area.${lgcs_area_unit}_ab`)}`,
+ }}
+ />
+ </svelte:fragment>
+ </SelectMenu>
</div>
<div
- class={`flex flex-row h-12 w-full justify-start items-center border-y-line border-layer-0-surface-edge`}
+ class={`relative flex flex-row h-12 w-full justify-between items-center border-y-line border-layer-0-surface-edge`}
>
<InputElement
+ bind:value={lgcs_area}
basis={{
id: fmt_id(`area`),
sync: true,
@@ -258,18 +323,47 @@
class={`flex flex-col w-full gap-1 justify-start items-start`}
>
<div
- class={`flex flex-row w-full justify-start items-center`}
+ class={`flex flex-row w-full gap-1 justify-start items-center`}
>
<p
class={`font-sansd text-trellisTitle text-layer-0-glyph-label uppercase`}
>
{`${$ls(`common.elevation`)}`}
</p>
+ <SelectMenu
+ bind:value={lgcs_elevation_unit}
+ basis={{
+ layer: 0,
+ options: [
+ {
+ entries: [
+ {
+ label: `${$ls(`measurement.length.m`)}`,
+ value: `m`,
+ },
+ {
+ label: `${$ls(`measurement.length.ft`)}`,
+ value: `ft`,
+ },
+ ],
+ },
+ ],
+ }}
+ >
+ <svelte:fragment slot="element">
+ <GlyphTitleSelect
+ basis={{
+ label: `${$ls(`measurement.length.${lgcs_elevation_unit}_ab`)}`,
+ }}
+ />
+ </svelte:fragment>
+ </SelectMenu>
</div>
<div
class={`flex flex-row h-12 w-full justify-start items-center border-y-line border-layer-0-surface-edge`}
>
<InputElement
+ bind:value={lgcs_elevation}
basis={{
id: fmt_id(`elevation`),
sync: true,
@@ -301,6 +395,7 @@
class={`flex flex-row h-12 w-full justify-start items-center border-y-line border-layer-0-surface-edge`}
>
<InputElement
+ bind:value={lgcs_climate}
basis={{
id: fmt_id(`climate`),
sync: true,
@@ -323,7 +418,7 @@
basis={{
label: `${$ls(`icu.add_*`, { value: `${$ls(`common.location`)}` })}`,
callback: async () => {
- if (_map_geoc) await handle_inc();
+ if (geol_c) await handle_inc();
},
}}
/>
diff --git a/src/routes/(app)/models/nostr-profile/+page.svelte b/src/routes/(app)/models/nostr-profile/+page.svelte
@@ -1,10 +1,10 @@
<script lang="ts">
import { db, keystore, nostr } from "$lib/client";
- import { ascii } from "$lib/conf";
import { type NostrProfile } from "@radroots/models";
import {
app_nostr_key,
app_notify,
+ ascii,
Glyph,
type ISelectOption,
LayoutTrellis,
diff --git a/src/routes/(app)/models/trade-product/add/+page.svelte b/src/routes/(app)/models/trade-product/add/+page.svelte
@@ -5,7 +5,6 @@
import MapPointSelectEnvelope from "$lib/components/map_point_select_envelope.svelte";
import TradeFieldDisplayEl from "$lib/components/trade_field_display_el.svelte";
import TradeFieldDisplayKv from "$lib/components/trade_field_display_kv.svelte";
- import { ascii } from "$lib/conf";
import { el_focus } from "$lib/util/client";
import { location_gcs_to_geoc } from "$lib/util/geocode";
import { kv_init_page, kv_sync } from "$lib/util/kv";
@@ -23,6 +22,7 @@
} from "@radroots/models";
import {
app_layout,
+ ascii,
carousel_dec,
carousel_inc,
carousel_index,
diff --git a/src/routes/(app)/settings/+page.svelte b/src/routes/(app)/settings/+page.svelte
@@ -1,9 +1,10 @@
<script lang="ts">
import { dialog, geol, haptics, keystore } from "$lib/client";
- import { ascii, ks } from "$lib/conf";
+ import { ks } from "$lib/conf";
import { reset_device } from "$lib/util/client";
import {
app_thc,
+ ascii,
LayoutTrellis,
LayoutView,
ls,
diff --git a/src/routes/(app)/settings/nostr/+page.svelte b/src/routes/(app)/settings/nostr/+page.svelte
@@ -1,11 +1,11 @@
<script lang="ts">
import { dialog } from "$lib/client";
- import { ascii } from "$lib/conf";
import {
LayoutTrellis,
LayoutView,
Nav,
Trellis,
+ ascii,
ls,
type ISelectOption,
} from "@radroots/svelte-lib";
diff --git a/src/routes/(app)/settings/profile/+page.svelte b/src/routes/(app)/settings/profile/+page.svelte
@@ -1,13 +1,13 @@
<script lang="ts">
import { db, dialog, fs } from "$lib/client";
import ImageUploadAddPhoto from "$lib/components/image_upload_add_photo.svelte";
- import { ascii } from "$lib/conf";
import { kv_init_page } from "$lib/util/kv";
import { model_media_upload_add_list } from "$lib/util/models-media-upload";
import { nostr_sync_metadata } from "$lib/util/nostr-sync";
import { fmt_media_upload_url, type NostrProfile } from "@radroots/models";
import {
app_nostr_key,
+ ascii,
Glyph,
ImageBlob,
ImagePath,
diff --git a/src/routes/(cfg)/cfg/init/+page.svelte b/src/routes/(cfg)/cfg/init/+page.svelte
@@ -747,6 +747,7 @@
classes: `font-sans text-[1.25rem] text-center placeholder:opacity-60`,
id: fmt_id(`nostr_profilename`),
sync: true,
+ layer: 1,
placeholder: `${$ls(`icu.enter_*`, { value: `${$ls(`common.profile_name`)}`.toLowerCase() })}`,
field: {
charset: regex.profile_name_ch,
