display warning icons as messages arrive. error: icons appearing on top-left
This commit is contained in:
parent
f2a0eb5cf1
commit
33fb8d5fb4
@ -71,9 +71,9 @@ const Minimap = () => {
|
|||||||
|
|
||||||
const elementsInGaze = useAppSelector(getElementsInGaze);
|
const elementsInGaze = useAppSelector(getElementsInGaze);
|
||||||
|
|
||||||
// useEffect(() => {
|
useEffect(() => {
|
||||||
// console.log('elementsInGaze: ', elementsInGaze);
|
console.log('elementsInGaze: ', elementsInGaze);
|
||||||
// }, [elementsInGaze]);
|
}, [elementsInGaze]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
|
@ -3,7 +3,6 @@ import { useEffect } from 'react';
|
|||||||
import { useAppDispatch, useAppSelector } from 'src/redux/hooks';
|
import { useAppDispatch, useAppSelector } from 'src/redux/hooks';
|
||||||
import {
|
import {
|
||||||
type InitialMinimapState,
|
type InitialMinimapState,
|
||||||
getSections,
|
|
||||||
getWidgets,
|
getWidgets,
|
||||||
initializeState,
|
initializeState,
|
||||||
addMessage,
|
addMessage,
|
||||||
@ -86,7 +85,7 @@ const Prototype = () => {
|
|||||||
allWidgetIds: Object.keys(widgets),
|
allWidgetIds: Object.keys(widgets),
|
||||||
allMessages: messages,
|
allMessages: messages,
|
||||||
allWidgetsInNewStressLPDIds: allWidgetsInNewStressLPDIds,
|
allWidgetsInNewStressLPDIds: allWidgetsInNewStressLPDIds,
|
||||||
stressLevel: stressLevel,
|
stressLevel: 0.1, // don't forget to change
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}, [currentStressLevel]);
|
}, [currentStressLevel]);
|
||||||
|
@ -180,7 +180,7 @@ const acaDefectMessageHigh = (message: Message) => {
|
|||||||
lpdHelper.generateListWidget(
|
lpdHelper.generateListWidget(
|
||||||
lpdHelper.generateBaseWidget(
|
lpdHelper.generateBaseWidget(
|
||||||
'list',
|
'list',
|
||||||
'vehicle',
|
'minimap',
|
||||||
500,
|
500,
|
||||||
500,
|
500,
|
||||||
300,
|
300,
|
||||||
@ -250,15 +250,24 @@ const highLPDMessageFunctions: any = {
|
|||||||
};
|
};
|
||||||
|
|
||||||
const highLPD = (message: Message) => {
|
const highLPD = (message: Message) => {
|
||||||
if (message.priority != -1)
|
console.log('highLPD');
|
||||||
|
if (message.priority !== -1)
|
||||||
//if the message is a real message, return the clusters
|
//if the message is a real message, return the clusters
|
||||||
return highLPDMessageFunctions[message.kind](message);
|
return highLPDMessageFunctions[message.kind](message);
|
||||||
|
|
||||||
//if we get this far, we can return all widgets in this LPD
|
//if we get this far, we can return all widgets in this LPD
|
||||||
const tempMessage = <RequestApprovalToAttack>{
|
const tempMessage = {
|
||||||
//make a dummy widget to put into LPD function
|
//make a dummy widget to put into LPD function
|
||||||
priority: 2,
|
priority: 2,
|
||||||
};
|
data: {
|
||||||
|
target: {
|
||||||
|
location: {
|
||||||
|
x: 0,
|
||||||
|
y: 0,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
} as RequestApprovalToAttack;
|
||||||
|
|
||||||
const messageKinds = [
|
const messageKinds = [
|
||||||
//all message kinds, so we can get all widgets
|
//all message kinds, so we can get all widgets
|
||||||
|
@ -5,19 +5,28 @@ import type {
|
|||||||
} from 'src/types/schema-types';
|
} from 'src/types/schema-types';
|
||||||
import lpdHelper from 'src/utils/lpdHelper';
|
import lpdHelper from 'src/utils/lpdHelper';
|
||||||
import { v4 as uuid } from 'uuid';
|
import { v4 as uuid } from 'uuid';
|
||||||
import type { Element } from 'src/types/element';
|
import type { Element, IconElement } from 'src/types/element';
|
||||||
import DANGER_ICON from 'src/assets/icons/danger.svg';
|
import DANGER_ICON from 'src/assets/icons/danger.svg';
|
||||||
import type { Widget } from 'src/types/widget';
|
import type { MapWarningWidget, Widget } from 'src/types/widget';
|
||||||
import type { WidgetCluster } from 'src/types/support-types';
|
import type { WidgetCluster } from 'src/types/support-types';
|
||||||
|
import ThreatAirDefenseSmReg from 'src/assets/icons/threats/airdefense-sm-reg.svg';
|
||||||
|
|
||||||
// Functions to create widgets, elements, and sections for each message type
|
// Functions to create widgets, elements, and sections for each message type
|
||||||
const requestApprovalToAttackMessageLow = (
|
const requestApprovalToAttackMessageLow = (
|
||||||
message: RequestApprovalToAttack,
|
message: RequestApprovalToAttack,
|
||||||
) => {
|
) => {
|
||||||
const elements: Element[] = [];
|
// element in list and on minimap will share this id
|
||||||
elements.push(
|
const warningElementId = uuid();
|
||||||
|
|
||||||
|
const pearceScreenElements = [
|
||||||
lpdHelper.generateRequestApprovalElement(
|
lpdHelper.generateRequestApprovalElement(
|
||||||
lpdHelper.generateBaseElement(uuid(), 'visual', 30, 30, message.priority),
|
lpdHelper.generateBaseElement(
|
||||||
|
warningElementId,
|
||||||
|
'visual',
|
||||||
|
30,
|
||||||
|
30,
|
||||||
|
message.priority,
|
||||||
|
),
|
||||||
message,
|
message,
|
||||||
lpdHelper.generateIconElement(
|
lpdHelper.generateIconElement(
|
||||||
lpdHelper.generateBaseElement(uuid(), 'visual', 80, 80),
|
lpdHelper.generateBaseElement(uuid(), 'visual', 80, 80),
|
||||||
@ -32,7 +41,39 @@ const requestApprovalToAttackMessageLow = (
|
|||||||
'Approve',
|
'Approve',
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
);
|
];
|
||||||
|
|
||||||
|
const minimapWidgetId1 = uuid();
|
||||||
|
const minimapElements: Element[] = [
|
||||||
|
{
|
||||||
|
id: warningElementId,
|
||||||
|
modality: 'visual',
|
||||||
|
type: 'icon',
|
||||||
|
h: 50,
|
||||||
|
w: 50,
|
||||||
|
widgetId: minimapWidgetId1,
|
||||||
|
src: ThreatAirDefenseSmReg,
|
||||||
|
} satisfies IconElement,
|
||||||
|
];
|
||||||
|
|
||||||
|
const minimapWidgets: Widget[] = [
|
||||||
|
{
|
||||||
|
id: minimapWidgetId1, // this should be something static?
|
||||||
|
sectionType: 'minimap',
|
||||||
|
type: 'map-warning',
|
||||||
|
x: message.data.target.location.x,
|
||||||
|
y: message.data.target.location.y,
|
||||||
|
w: 50,
|
||||||
|
h: 50,
|
||||||
|
screen: '/minimap',
|
||||||
|
canOverlap: true,
|
||||||
|
useElementLocation: false,
|
||||||
|
maxAmount: 10,
|
||||||
|
|
||||||
|
elements: minimapElements,
|
||||||
|
} satisfies MapWarningWidget,
|
||||||
|
];
|
||||||
|
|
||||||
return {
|
return {
|
||||||
sections: [],
|
sections: [],
|
||||||
possibleClusters: [
|
possibleClusters: [
|
||||||
@ -49,9 +90,10 @@ const requestApprovalToAttackMessageLow = (
|
|||||||
false,
|
false,
|
||||||
false,
|
false,
|
||||||
1,
|
1,
|
||||||
[...elements],
|
[...pearceScreenElements],
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
|
...minimapWidgets,
|
||||||
]),
|
]),
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
@ -103,11 +145,12 @@ const acaFuelLowMessageLow = (message: Message) => {
|
|||||||
const missileToOwnshipDetectedMessageLow = (
|
const missileToOwnshipDetectedMessageLow = (
|
||||||
message: MissileToOwnshipDetected,
|
message: MissileToOwnshipDetected,
|
||||||
) => {
|
) => {
|
||||||
const elements: Element[] = [];
|
const elementId = uuid();
|
||||||
elements.push(
|
|
||||||
|
const pearceScreenElements: Element[] = [
|
||||||
lpdHelper.generateMissileIncomingElement(
|
lpdHelper.generateMissileIncomingElement(
|
||||||
lpdHelper.generateBaseElement(
|
lpdHelper.generateBaseElement(
|
||||||
uuid(),
|
elementId,
|
||||||
'visual',
|
'visual',
|
||||||
50,
|
50,
|
||||||
200,
|
200,
|
||||||
@ -119,7 +162,8 @@ const missileToOwnshipDetectedMessageLow = (
|
|||||||
DANGER_ICON,
|
DANGER_ICON,
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
);
|
];
|
||||||
|
|
||||||
return {
|
return {
|
||||||
sections: [],
|
sections: [],
|
||||||
possibleClusters: [
|
possibleClusters: [
|
||||||
@ -136,7 +180,7 @@ const missileToOwnshipDetectedMessageLow = (
|
|||||||
false,
|
false,
|
||||||
true,
|
true,
|
||||||
1,
|
1,
|
||||||
[...elements],
|
[...pearceScreenElements],
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
]),
|
]),
|
||||||
@ -239,15 +283,24 @@ const lowLPDMessageFunctions: any = {
|
|||||||
};
|
};
|
||||||
|
|
||||||
const lowLPD = (message: Message) => {
|
const lowLPD = (message: Message) => {
|
||||||
if (message.priority != -1)
|
if (message.priority !== -1)
|
||||||
//if the message is a real message, return the clusters
|
//if the message is a real message, return the clusters
|
||||||
return lowLPDMessageFunctions[message.kind](message);
|
return lowLPDMessageFunctions[message.kind](message);
|
||||||
|
|
||||||
//if we get this far, we can return all widgets in this LPD
|
//if we get this far, we can return all widgets in this LPD
|
||||||
const tempMessage = <RequestApprovalToAttack>{
|
const tempMessage = {
|
||||||
//make a dummy widget to put into LPD function
|
//make a dummy widget to put into LPD function
|
||||||
priority: 2,
|
priority: 2,
|
||||||
};
|
data: {
|
||||||
|
target: {
|
||||||
|
location: {
|
||||||
|
x: 0,
|
||||||
|
y: 0,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
} as RequestApprovalToAttack;
|
||||||
|
|
||||||
const messageKinds = [
|
const messageKinds = [
|
||||||
//all message kinds, so we can get all widgets
|
//all message kinds, so we can get all widgets
|
||||||
'RequestApprovalToAttack',
|
'RequestApprovalToAttack',
|
||||||
|
@ -239,15 +239,24 @@ const mediumLPDMessageFunctions: any = {
|
|||||||
};
|
};
|
||||||
|
|
||||||
const mediumLPD = (message: Message) => {
|
const mediumLPD = (message: Message) => {
|
||||||
if (message.priority != -1)
|
if (message.priority !== -1)
|
||||||
//if the message is a real message, return the clusters
|
//if the message is a real message, return the clusters
|
||||||
return mediumLPDMessageFunctions[message.kind](message);
|
return mediumLPDMessageFunctions[message.kind](message);
|
||||||
|
|
||||||
//if we get this far, we can return all widgets in this LPD
|
//if we get this far, we can return all widgets in this LPD
|
||||||
const tempMessage = <RequestApprovalToAttack>{
|
const tempMessage = {
|
||||||
//make a dummy widget to put into LPD function
|
//make a dummy widget to put into LPD function
|
||||||
priority: 2,
|
priority: 2,
|
||||||
};
|
data: {
|
||||||
|
target: {
|
||||||
|
location: {
|
||||||
|
x: 0,
|
||||||
|
y: 0,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
} as RequestApprovalToAttack;
|
||||||
|
|
||||||
const messageKinds = [
|
const messageKinds = [
|
||||||
//all message kinds, so we can get all widgets
|
//all message kinds, so we can get all widgets
|
||||||
'RequestApprovalToAttack',
|
'RequestApprovalToAttack',
|
||||||
|
@ -90,7 +90,7 @@ const initialMinimapSections = [
|
|||||||
1920,
|
1920,
|
||||||
980,
|
980,
|
||||||
0,
|
0,
|
||||||
'vehicle',
|
'minimap',
|
||||||
[],
|
[],
|
||||||
),
|
),
|
||||||
];
|
];
|
||||||
|
@ -15,7 +15,7 @@ const ownship: Widget = {
|
|||||||
...lpdHelper.generateVehicleWidget(
|
...lpdHelper.generateVehicleWidget(
|
||||||
lpdHelper.generateBaseWidget(
|
lpdHelper.generateBaseWidget(
|
||||||
ownshipUuid,
|
ownshipUuid,
|
||||||
'vehicle',
|
'minimap',
|
||||||
400,
|
400,
|
||||||
950,
|
950,
|
||||||
50,
|
50,
|
||||||
@ -50,7 +50,7 @@ const drones: Widget[] = [
|
|||||||
...lpdHelper.generateVehicleWidget(
|
...lpdHelper.generateVehicleWidget(
|
||||||
lpdHelper.generateBaseWidget(
|
lpdHelper.generateBaseWidget(
|
||||||
droneUuid1,
|
droneUuid1,
|
||||||
'vehicle',
|
'minimap',
|
||||||
500,
|
500,
|
||||||
200,
|
200,
|
||||||
80,
|
80,
|
||||||
@ -83,7 +83,7 @@ const drones: Widget[] = [
|
|||||||
...lpdHelper.generateVehicleWidget(
|
...lpdHelper.generateVehicleWidget(
|
||||||
lpdHelper.generateBaseWidget(
|
lpdHelper.generateBaseWidget(
|
||||||
droneUuid2,
|
droneUuid2,
|
||||||
'vehicle',
|
'minimap',
|
||||||
1500,
|
1500,
|
||||||
550,
|
550,
|
||||||
80,
|
80,
|
||||||
@ -116,7 +116,7 @@ const drones: Widget[] = [
|
|||||||
...lpdHelper.generateVehicleWidget(
|
...lpdHelper.generateVehicleWidget(
|
||||||
lpdHelper.generateBaseWidget(
|
lpdHelper.generateBaseWidget(
|
||||||
droneUuid3,
|
droneUuid3,
|
||||||
'vehicle',
|
'minimap',
|
||||||
1500,
|
1500,
|
||||||
350,
|
350,
|
||||||
80,
|
80,
|
||||||
@ -149,7 +149,7 @@ const drones: Widget[] = [
|
|||||||
...lpdHelper.generateVehicleWidget(
|
...lpdHelper.generateVehicleWidget(
|
||||||
lpdHelper.generateBaseWidget(
|
lpdHelper.generateBaseWidget(
|
||||||
droneUuid4,
|
droneUuid4,
|
||||||
'vehicle',
|
'minimap',
|
||||||
200,
|
200,
|
||||||
900,
|
900,
|
||||||
80,
|
80,
|
||||||
@ -182,7 +182,7 @@ const drones: Widget[] = [
|
|||||||
...lpdHelper.generateVehicleWidget(
|
...lpdHelper.generateVehicleWidget(
|
||||||
lpdHelper.generateBaseWidget(
|
lpdHelper.generateBaseWidget(
|
||||||
droneUuid5,
|
droneUuid5,
|
||||||
'vehicle',
|
'minimap',
|
||||||
1150,
|
1150,
|
||||||
750,
|
750,
|
||||||
80,
|
80,
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
import { Widget } from "./widget";
|
import { type Widget } from 'src/types/widget';
|
||||||
|
|
||||||
export type Cell = {
|
export type Cell = {
|
||||||
widgetIDs: string[];
|
widgetIDs: string[];
|
||||||
@ -12,7 +12,7 @@ export type Screen = '/pearce-screen' | '/minimap' | '/right-screen';
|
|||||||
export type SectionType =
|
export type SectionType =
|
||||||
| 'free'
|
| 'free'
|
||||||
| 'top-bar'
|
| 'top-bar'
|
||||||
| 'vehicle'
|
| 'minimap'
|
||||||
| 'tinder'
|
| 'tinder'
|
||||||
| 'history'
|
| 'history'
|
||||||
| 'map-video';
|
| 'map-video';
|
||||||
@ -44,4 +44,4 @@ export type WidgetCluster = {
|
|||||||
widgets: Widget[];
|
widgets: Widget[];
|
||||||
sectionIds?: LinkedSectionWidget[];
|
sectionIds?: LinkedSectionWidget[];
|
||||||
actions?: string[];
|
actions?: string[];
|
||||||
}
|
};
|
||||||
|
Loading…
Reference in New Issue
Block a user