Skip to content
GeoViewer 5

Source IdentifyClick

Source IdentifyClick

Cette page est générée automatiquement à partir du dépôt local au moment de la génération de la documentation.

Fichiers inclus

packages/common/src/lib/widgets/identify-click/identify-click.declaration.ts

packages/common/src/lib/widgets/identify-click/identify-click.declaration.ts
import { widgetFactorySvelte, type WidgetProps } from '$lib/api/managers/widget';
import { type IdentifyClickConfig, identifyClickConfigSchema } from './identify-click.config';
import type { WidgetDeclaration } from '$lib/api/managers/widget/widget-declaration';


export const declaration = {
    factory: () => import('./IdentifyClick.svelte').then((IdentifyClick) => widgetFactorySvelte(IdentifyClick)),
    schema: () => identifyClickConfigSchema,
} satisfies WidgetDeclaration;


export type IdentifyClickProps = WidgetProps<IdentifyClickConfig>;

packages/common/src/lib/widgets/identify-click/identify-click.config.ts

packages/common/src/lib/widgets/identify-click/identify-click.config.ts
import { defineWidgetConfig, inToolbarSchemaFrom } from '$lib/api/managers/configuration';
import { z } from 'zod';
import { hiddenContainerId } from '$lib/components/containers/hidden/hidden.schema';


export const identifyClickConfigSchema = defineWidgetConfig({
    title: {
        fr: 'Identifier',
        nl: 'NL - Identifier',
    },
    container: hiddenContainerId,
    inToolbar: inToolbarSchemaFrom(false),
    active: true,
    config: z
        .object({
            centerOnClickedPoint: z.boolean().default(false),
            event: z.enum(['click', 'leftClick', 'rightClick']).default('click'),
        })
        .prefault({}),
});


export type IdentifyClickConfig = z.infer<typeof identifyClickConfigSchema>;

packages/common/src/lib/widgets/identify-click/IdentifyClick.svelte

packages/common/src/lib/widgets/identify-click/IdentifyClick.svelte
<script lang="ts">
    import { getMapManager } from '$lib/api/map';
    import { getWidgetManager } from '$lib/api/managers/widget';
    import type Identify from '$lib/widgets/identify/Identify.svelte';
    import type { IdentifyClickProps } from './identify-click.declaration';
    import { GeoviewerError } from '$lib/api/managers/error';
    import type { Unsubscriber } from 'svelte/store';
    import { mapInteraction } from '$lib/api/map/interaction/map-interaction-requester.svelte';


    let { fullConfig }: IdentifyClickProps = $props();
    const { config } = fullConfig;


    const mapManager = getMapManager();
    const zoom = mapManager.tools.zoom;
    const widgetManager = getWidgetManager();


    let listentSub: Unsubscriber | null = null;


    const _requester = mapInteraction({
        id: fullConfig.widgetId,
        onStart: listenToClick,
        onStop: stopListening,
        requestInstant: 'prepend',
    });


    function listenToClick() {
        listentSub?.();
        listentSub = mapManager.tools.events.on(config.event, async (point) => {
            const identify = widgetManager.getReferencesByWidgetClass<Identify>('Identify')[0];
            if (!identify) {
                throw new GeoviewerError('No Identify widget found');
            }
            identify.activate().then((widget) => {
                widget?.updatePoint(point);
            });
            if (config.centerOnClickedPoint) {
                await zoom.zoomToPoint(point);
            }
        });
    }


    function stopListening() {
        listentSub?.();
        listentSub = null;
    }
</script>

Aller plus loin