@tak-ps/cloudtak 12.54.0 → 12.94.0

package/src/components/CloudTAK/util/Breadcrumb.vue

@@ -1,85 +0,0 @@
-<template>
-    <div class='col-12 px-2'>
-        <TablerLoading
-            v-if='loading'
-            desc='Loading Breadcrumb'
-        />
-        <template v-else>
-            <label class='subheader text-white'><IconRoute
-                :size='24'
-                stroke='1'
-            />Breadcrumb Loader</label>
-
-            <div class='border border-white rounded my-2 row g-2 px-2 py-2'>
-                <div class='col-12'>
-                    <TablerEnum
-                        v-model='query.relative'
-                        default='1 Hour'
-                        :options='[
-                            "1 Hour",
-                            "4 Hours",
-                            "8 Hours",
-                            "24 Hours"
-                        ]'
-                    />
-                </div>
-
-                <div class='col-12'>
-                    <TablerButton
-                        class='btn-primary w-100'
-                        @click.stop.prevent='loadBreadcrumb'
-                    >
-                        Submit
-                    </TablerButton>
-                </div>
-            </div>
-        </template>
-    </div>
-</template>
-
-<script setup lang='ts'>
-import { ref } from 'vue';
-import { std, stdurl } from '../../../std.ts';
-import type { FeatureCollection } from '../../../types.ts';
-import {
-    IconRoute
-} from '@tabler/icons-vue';
-import {
-    TablerEnum,
-    TablerButton,
-    TablerLoading
-} from '@tak-ps/vue-tabler';
-import { useMapStore } from '../../../stores/map.ts';
-
-const mapStore = useMapStore();
-
-const props = defineProps<{
-    uid: string
-}>();
-
-const query = ref({
-    relative: '1 Hour'
-});
-const loading = ref(false);
-
-async function loadBreadcrumb() {
-    loading.value = true;
-
-    try {
-        const url = stdurl(`/api/marti/cot/${props.uid}/all`)
-
-        url.searchParams.append('secago', String(60 * 60 * Number(query.value.relative.split(' ')[0])))
-        url.searchParams.append('track', String(true))
-        const crumb = await std(url) as FeatureCollection;
-
-        for (const feat of crumb.features) {
-            await mapStore.worker.db.add(feat)
-        }
-
-        loading.value = false;
-    } catch (err) {
-        loading.value = false;
-        throw err;
-    }
-}
-</script>

package/src/components/CloudTAK/util/ChannelInfo.vue

@@ -1,25 +0,0 @@
-<template>
-    <div class='col-12 d-flex align-items-center py-2 px-2 text-muted'>
-        <IconInfoSquareRounded
-            :size='32'
-            stroke='1'
-            class='mx-2'
-        />
-        <div>
-            <span v-text='props.label' /> are only shown if the channel in which they belong is turned on
-        </div>
-    </div>
-</template>
-
-<script setup lang='ts'>
-import {
-    IconInfoSquareRounded
-} from '@tabler/icons-vue';
-
-const props = defineProps({
-    label: {
-        type: String,
-        default: 'Data Syncs'
-    }
-});
-</script>

package/src/components/CloudTAK/util/Contact.vue

@@ -1,131 +0,0 @@
-<template>
-    <StandardItem
-        class='d-flex flex-row gap-3 mb-2 align-items-center'
-        :class='{
-            "cursor-pointer": isZoomable(contact),
-            "cursor-default": !isZoomable(contact),
-            "hover": hover,
-            "contact-card--no-notes": !contact.notes || !contact.notes.trim()
-        }'
-        :hover='hover'
-        @click='flyTo(contact)'
-    >
-        <div class='icon-wrapper ms-2 d-flex align-items-center justify-content-center rounded-circle'>
-            <IconCheck
-                v-if='selected'
-                :size='compact ? 20 : 32'
-                stroke='1'
-            />
-            <ContactPuck
-                v-else
-                :team='contact.team'
-                :size='compact ? 20 : 32'
-            />
-        </div>
-
-        <div
-            class='flex-grow-1 d-flex flex-column gap-1'
-            :class='{
-                "py-2": !compact,
-                "justify-content-center": !contact.notes || !contact.notes.trim()
-            }'
-        >
-            <div class='d-flex flex-wrap align-items-center gap-2'>
-                <span
-                    class='fw-semibold text-truncate'
-                    v-text='contact.callsign'
-                />
-            </div>
-            <div
-                v-if='contact.notes && contact.notes.trim()'
-                class='text-truncate subheader user-select-none'
-                v-text='contact.notes.trim()'
-            />
-        </div>
-
-        <div
-            v-if='props.buttonChat'
-            class='align-self-center me-2'
-        >
-            <IconMessage
-                v-if='props.buttonChat && isChatable(contact)'
-                v-tooltip='"Start Chat"'
-                :size='compact ? 20 : 32'
-                stroke='1'
-                class='cursor-pointer'
-                @click.stop='emit("chat", contact)'
-            />
-        </div>
-    </StandardItem>
-</template>
-
-<script setup>
-import {
-    IconCheck,
-    IconMessage,
-} from '@tabler/icons-vue';
-import ContactPuck from './ContactPuck.vue';
-import StandardItem from './StandardItem.vue';
-import { useMapStore } from '/src/stores/map.ts';
-const mapStore = useMapStore();
-
-const props = defineProps({
-    contact: {
-        type: Object,
-        required: true
-    },
-    selected: {
-        type: Boolean,
-        default: false
-    },
-    buttonChat: {
-        type: Boolean,
-        default: true
-    },
-    hover: {
-        type: Boolean,
-        default: true
-    },
-    compact: {
-        type: Boolean,
-        default: false
-    }
-});
-
-const emit = defineEmits([
-    'chat'
-]);
-
-async function isZoomable(contact) {
-    return mapStore.worker.db.has(contact.uid);
-}
-
-async function isChatable(contact) {
-    if (!await mapStore.worker.db.has(contact.uid)) return false;
-    const cot = await mapStore.worker.db.get(contact.uid);
-    return cot.properties.contact && cot.properties.contact.endpoint;
-}
-
-async function flyTo(contact) {
-    if (!await isZoomable(contact)) return;
-
-    const cot = await mapStore.worker.db.get(contact.uid);
-    if (!cot) return;
-
-    cot.flyTo();
-}
-</script>
-
-<style scoped>
-.icon-wrapper {
-    width: 3rem;
-    height: 3rem;
-    min-width: 3rem;
-    min-height: 3rem;
-    flex-shrink: 0;
-}
-
-.contact-card--no-notes {
-    height: 50px;
-}
-</style>

package/src/components/CloudTAK/util/ContactPuck.vue

@@ -1,40 +0,0 @@
-<template>
-    <IconCircleFilled
-        v-if='props.team'
-        :size='props.size ? props.size : 32'
-        stroke='1'
-        :class='{
-            "text-yellow": props.team === "Yellow",
-            "text-cyan": props.team === "Cyan",
-            "text-lime": props.team === "Green",
-            "text-red": props.team === "Red",
-            "text-purple": props.team === "Purple",
-            "text-orange": props.team === "Orange",
-            "text-azure": props.team === "Blue",
-            "text-dribble": props.team === "Magenta",
-            "text-white": props.team === "White",
-            "text-pinterest": props.team === "Maroon",
-            "text-blue": props.team === "Dark Blue",
-            "text-teal": props.team === "Teal",
-            "text-green": props.team === "Dark Green",
-            "text-google": props.team === "Brown",
-        }'
-    />
-    <IconUserQuestion
-        v-else
-        :size='props.size ? props.size : 32'
-        stroke='1'
-    />
-</template>
-
-<script setup lang='ts'>
-import {
-    IconUserQuestion,
-    IconCircleFilled,
-} from '@tabler/icons-vue';
-
-const props = defineProps<{
-    team?: string,
-    size?: number
-}>();
-</script>

package/src/components/CloudTAK/util/Coordinate.vue

@@ -1,313 +0,0 @@
-<template>
-    <div class='col-12'>
-        <IconLabel
-            :size='18'
-            stroke='1'
-            color='#6b7990'
-            class='ms-2 me-1'
-        />
-        <label
-            class='subheader user-select-none'
-            v-text='label'
-        />
-        <div class='mx-2'>
-            <CopyField
-                :model-value='inMode'
-                :edit='edit && config.mode === "dd"'
-                :hover='hover && config.mode === "dd"'
-                :validate='validateInput'
-                :size='24'
-                @update:model-value='coordinateEntry($event)'
-            />
-            <template v-if='modes.length'>
-                <div
-                    role='menu'
-                    class='mx-2'
-                >
-                    <span
-                        v-if='modes.includes("dd")'
-                        v-tooltip='"Decimal Degrees"'
-                        role='menuitem'
-                        tabindex='0'
-                        class='my-1 px-2 user-select-none'
-                        :class='{
-                            "bg-accent rounded-bottom text-blue": config.mode === "dd",
-                            "cursor-pointer": config.mode !== "dd",
-                        }'
-                        @click='config.mode = "dd"'
-                    >DD</span>
-                    <span
-                        v-if='modes.includes("dms")'
-                        v-tooltip='"Decimal Minutes Seconds"'
-                        class='my-1 px-2 user-select-none'
-                        role='menuitem'
-                        tabindex='0'
-                        :class='{
-                            "bg-accent rounded-bottom text-blue": config.mode === "dms",
-                            "cursor-pointer": config.mode !== "dms",
-                        }'
-                        @click='config.mode = "dms"'
-                    >DMS</span>
-                    <span
-                        v-if='modes.includes("mgrs")'
-                        v-tooltip='"Military Grid Reference System"'
-                        class='my-1 px-2 user-select-none'
-                        role='menuitem'
-                        tabindex='0'
-                        :class='{
-                            "bg-accent rounded-bottom text-blue": config.mode === "mgrs",
-                            "cursor-pointer": config.mode !== "mgrs",
-                        }'
-                        @click='config.mode = "mgrs"'
-                    >MGRS</span>
-                    <span
-                        v-if='modes.includes("utm")'
-                        v-tooltip='"Universal Transverse Mercator"'
-                        class='my-1 px-2 user-select-none'
-                        role='menuitem'
-                        tabindex='0'
-                        :class='{
-                            "bg-accent rounded-bottom text-blue": config.mode === "utm",
-                            "cursor-pointer": config.mode !== "utm",
-                        }'
-                        @click='config.mode = "utm"'
-                    >UTM</span>
-                </div>
-            </template>
-        </div>
-    </div>
-</template>
-
-<script setup lang='ts'>
-import CopyField from './CopyField.vue';
-import { validateLatLng } from '../../../base/validators.ts';
-import {
-    IconLabel
-} from '@tabler/icons-vue';
-import { ref, computed } from 'vue';
-
-const props = defineProps({
-    label: {
-        type: String,
-        default: 'Coordinates'
-    },
-    hover: {
-        type: Boolean,
-        default: false
-    },
-    edit: {
-        type: Boolean,
-        default: false
-    },
-    truncate: {
-        type: Number,
-        description: 'Truncate DD coordinates to a given precision',
-        default: undefined
-    },
-    modes: {
-        type: Array,
-        default: function() {
-            return ['dd', 'dms', 'mgrs', 'utm']
-        }
-    },
-    modelValue: {
-        type: Array,
-        required: true,
-        description: 'A coordinate pair in GeoJSON format (lng,lat)'
-    }
-});
-
-const emit = defineEmits([
-    'update:modelValue',
-]);
-
-const config = ref({
-    mode: 'dd'
-})
-
-const validateInput = computed(() => {
-    return (text: string): boolean | string => {
-        if (config.value.mode === 'dd') {
-            return validateLatLng(text);
-        } else {
-            return false;
-        }
-    }
-});
-
-const inMode = computed(() => {
-    if (config.value.mode === 'dd') {
-        if (props.truncate) {
-            return [
-                Math.trunc(props.modelValue[1] as number * Math.pow(10, props.truncate)) / Math.pow(10, props.truncate),
-                Math.trunc(props.modelValue[0] as number * Math.pow(10, props.truncate)) / Math.pow(10, props.truncate)
-            ].join(', ');
-        } else {
-            return `${props.modelValue[1]}, ${props.modelValue[0]}`;
-        }
-    } else if (config.value.mode === 'dms') {
-        return `${asDMS(props.modelValue[1] as number)}, ${asDMS(props.modelValue[0] as number)}`;
-    } else if (config.value.mode === 'mgrs') {
-        return asMGRS();
-    } else if (config.value.mode === 'utm') {
-        return asUTM(
-            props.modelValue[1] as number,
-            props.modelValue[0] as number
-        );
-    }
-
-    return 'UNKNOWN'
-});
-
-function coordinateEntry(text: string) {
-    emit('update:modelValue',
-        text
-            .split(',')
-            .map((c) => Number(c.trim()))
-            .reverse()
-    );
-}
-
-function asDMS(dd: number): string {
-    const abs = Math.abs(dd);
-    const deg = Math.floor(abs);
-    const min = Math.floor((abs - deg) * 60);
-    const sec = (abs - deg - min / 60) * 3600;
-    return (dd < 0 ? '-' : '') + deg + '° ' + min + '\' ' + Math.floor(sec * 100) / 100 + '"';
-}
-
-function asUTM(latitude: number, longitude: number) {
-    const K0 = 0.9996;
-    const E = 0.00669438;
-    const E_P2 = E / (1 - E);
-    const E2 = Math.pow(E, 2);
-    const E3 = Math.pow(E, 3);
-    const R = 6378137;
-
-    const M1 = 1 - E / 4 - 3 * E2 / 64 - 5 * E3 / 256;
-    const M2 = 3 * E / 8 + 3 * E2 / 32 + 45 * E3 / 1024;
-    const M3 = 15 * E2 / 256 + 45 * E3 / 1024;
-    var M4 = 35 * E3 / 3072;
-
-    const latRad = toRadians(latitude);
-    const latSin = Math.sin(latRad);
-    const latCos = Math.cos(latRad);
-
-    const latTan = Math.tan(latRad);
-    const latTan2 = Math.pow(latTan, 2);
-    const latTan4 = Math.pow(latTan, 4);
-
-    const zoneNum = latLonToZoneNumber(latitude, longitude);
-
-    const zoneLetter = latitudeToZoneLetter(latitude);
-
-    const lonRad = toRadians(longitude);
-    const centralLon = zoneNumberToCentralLongitude(zoneNum);
-    const centralLonRad = toRadians(centralLon);
-
-    const n = R / Math.sqrt(1 - E * latSin * latSin);
-    const c = E_P2 * latCos * latCos;
-
-    const a = latCos * (lonRad - centralLonRad);
-    const a2 = Math.pow(a, 2);
-    const a3 = Math.pow(a, 3);
-    const a4 = Math.pow(a, 4);
-    const a5 = Math.pow(a, 5);
-    const a6 = Math.pow(a, 6);
-
-    const m = R * (M1 * latRad -
-        M2 * Math.sin(2 * latRad) +
-        M3 * Math.sin(4 * latRad) -
-        M4 * Math.sin(6 * latRad));
-    const easting = K0 * n * (a +
-        a3 / 6 * (1 - latTan2 + c) +
-        a5 / 120 * (5 - 18 * latTan2 + latTan4 + 72 * c - 58 * E_P2)) + 500000;
-    let northing = K0 * (m + n * latTan * (a2 / 2 +
-        a4 / 24 * (5 - latTan2 + 9 * c + 4 * c * c) +
-        a6 / 720 * (61 - 58 * latTan2 + latTan4 + 600 * c - 330 * E_P2)));
-    if (latitude < 0) northing += 1e7;
-
-    return `${zoneNum}${zoneLetter} ${Math.floor(easting)} ${Math.floor(northing)}`;
-}
-
-function zoneNumberToCentralLongitude(zoneNum: number) {
-    return (zoneNum - 1) * 6 - 180 + 3;
-}
-
-function toRadians(deg: number) {
-    return deg * Math.PI / 180;
-}
-
-function latitudeToZoneLetter(latitude: number) {
-    const ZONE_LETTERS = 'CDEFGHJKLMNPQRSTUVWXX';
-    if (-80 <= latitude && latitude <= 84) {
-        return ZONE_LETTERS[Math.floor((latitude + 80) / 8)];
-    } else {
-        return null;
-    }
-}
-
-function latLonToZoneNumber(latitude: number, longitude: number) {
-    if (56 <= latitude && latitude < 64 && 3 <= longitude && longitude < 12) return 32;
-
-    if (72 <= latitude && latitude <= 84 && longitude >= 0) {
-        if (longitude <  9) return 31;
-        if (longitude < 21) return 33;
-        if (longitude < 33) return 35;
-        if (longitude < 42) return 37;
-    }
-
-    return Math.floor((longitude + 180) / 6) + 1;
-}
-
-function asMGRS() {
-    const Lat = props.modelValue[1] as number;
-    const Long = props.modelValue[0] as number;
-    if (Lat < -80) return 'Too far South';
-    if (Lat > 84) return 'Too far North' ;
-    const c = 1 + Math.floor ((Long+180)/6);
-    const e = c*6 - 183 ;
-    const k = Lat*Math.PI/180;
-    const l = Long*Math.PI/180;
-    const m = e*Math.PI/180;
-    const n = Math.cos (k);
-    const o = 0.006739496819936062*Math.pow (n,2);
-    const p = 40680631590769/(6356752.314*Math.sqrt(1 + o));
-    const q = Math.tan (k);
-    const r = q*q;
-    const t = l - m;
-    const u = 1.0 - r + o;
-    const v = 5.0 - r + 9*o + 4.0*(o*o);
-    const w = 5.0 - 18.0*r + (r*r) + 14.0*o - 58.0*r*o;
-    const x = 61.0 - 58.0*r + (r*r) + 270.0*o - 330.0*r*o;
-    const y = 61.0 - 479.0*r + 179.0*(r*r) - (r*r*r);
-    const z = 1385.0 - 3111.0*r + 543.0*(r*r) - (r*r*r);
-    let aa = p*n*t + (p/6.0*Math.pow (n,3)*u*Math.pow (t,3)) + (p/120.0*Math.pow (n,5)*w*Math.pow (t,5)) + (p/5040.0*Math.pow (n,7)*y*Math.pow (t,7));
-    let ab = 6367449.14570093*(k - (0.00251882794504*Math.sin (2*k)) + (0.00000264354112*Math.sin (4*k)) - (0.00000000345262*Math.sin (6*k)) + (0.000000000004892*Math.sin (8*k))) + (q/2.0*p*Math.pow (n,2)*Math.pow (t,2)) + (q/24.0*p*Math.pow (n,4)*v*Math.pow (t,4)) + (q/720.0*p*Math.pow (n,6)*x*Math.pow (t,6)) + (q/40320.0*p*Math.pow (n,8)*z*Math.pow (t,8));
-    aa = aa*0.9996 + 500000.0;
-    ab = ab*0.9996; if (ab < 0.0) ab += 10000000.0;
-    const ad = 'CDEFGHJKLMNPQRSTUVWXX'.charAt (Math.floor (Lat/8 + 10));
-    const ae = Math.floor (aa/100000);
-    const af = ['ABCDEFGH','JKLMNPQR','STUVWXYZ'][(c-1)%3].charAt (ae-1);
-    const ag = Math.floor (ab/100000)%20;
-    const ah = ['ABCDEFGHJKLMNPQRSTUV','FGHJKLMNPQRSTUVABCDE'][(c-1)%2].charAt (ag);
-
-    function pad (val: number): string {
-        if (val < 10) {
-            return '0000' + val
-        } else if (val < 100) {
-            return '000' + val
-        } else if (val < 1000) {
-            return '00' + val
-        } else if (val < 10000) {
-            return '0' + val
-        }
-
-        return String(val);
-    }
-
-    aa = Math.floor(aa % 100000);
-    ab = Math.floor(ab % 100000);
-    return c + ad + ' ' + af + ah + ' ' + pad(aa) + ' ' + pad(ab);
-}
-</script>