경고음 및 마커 색상 이슈 수정

src/components/map/naver/dron/DronMarker.js

@@ -192,12 +192,11 @@ export const DronMarker = props => {
     const getIcon = marker.getIcon();
 
     marker.setPosition(position);
-
+    const warnList = controlGpArcrftWarnList?.filter(
-    if (
+      i => i.cntrlId === gps.controlId
-      controlGpArcrftWarnList?.filter(i => i.cntrlId === gps.controlId).length >
+    );
-      0
+    if (warnList.length > 0) {
-    ) {
+      if (warnList[0].controlWarnCd) {
-      if (controlGpArcrftWarnList[0].controlWarnCd) {
         marker.setIcon({
           content: `<img ${getIcon.content.substr(
             getIcon.content.indexOf('src'),

src/components/map/naver/dron/DronToast.js

@@ -23,7 +23,8 @@ const DronToast = () => {
     state => state.controlGpLogState
   );
   const [toastId, setToastId] = useState();
-  // const [is, setIs] = useState(false);
+
+  let warningList = [];
 
   useEffect(() => {
     if (controlGpArcrftWarnList) {
@@ -47,28 +48,23 @@ const DronToast = () => {
                   // setToastId(null);
                 },
                 onClose: () => {
-                  toggle(false);
                   // setIs(true);
                   setToastId(null);
                 }
               }
             );
 
-            if (!playing) {
-              toggle(true);
-            }
             setToastId(id);
             break;
           }
         }
       }
+
       for (let i = 0; i < controlGpArcrftWarnList.length; i++) {
-        if (!controlGpArcrftWarnList[i].controlWarnCd) {
+        warningList.push(controlGpArcrftWarnList[i].controlWarnCd);
-          toggle(false);
-        } else {
-          toggle(true);
-        }
       }
+
+      warningList.find(i => i) ? toggle(true) : toggle(false);
     }
   }, [controlGpArcrftWarnList]);
 

src/utility/hooks/useAudio.js

@@ -1,20 +1,20 @@
-import { useMemo, useEffect, useState } from 'react';
+import { useEffect, useState, useRef } from 'react';
 
 const useAudio = url => {
-  const audio = useMemo(() => new Audio(url), []);
+  const audio = useRef(new Audio(url));
   const [playing, setPlaying] = useState(false);
 
   const toggle = val => setPlaying(val);
 
   useEffect(() => {
-    if (playing) audio.loop = true;
+    if (playing) audio.current.loop = true;
-    playing ? audio.play() : audio.pause();
+    playing ? audio.current.play() : audio.current.pause();
   }, [playing]);
 
   useEffect(() => {
-    audio.addEventListener('ended', () => setPlaying(false));
+    audio.current.addEventListener('ended', () => setPlaying(false));
     return () => {
-      audio.removeEventListener('ended', () => setPlaying(false));
+      audio.current.removeEventListener('ended', () => setPlaying(false));
     };
   }, []);
 

test/pav-warning.js

@@ -1,77 +1,83 @@
-const {getConnection, writeData} = require("./pav-client")
+const { getConnection, writeData } = require('./pav-client');
-const {getCoordsFormBetweenCoord, dumyData} = require("./pav-utils")
+const { getCoordsFormBetweenCoord, dumyData } = require('./pav-utils');
 
 // const host = "192.168.0.24"
 // const host = "localhost"
-const host = "211.253.38.218"
+const host = '192.168.0.34';
-const port = 8082
+const port = 8082;
 
 // 기본정보
-const prefix = 'TEST-DRON-W-'
+const prefix = 'PA';
 
 const pathSampleCoord = [
-    [37.5215, 126.6050],
+  [37.5215, 126.605],
-    [37.5215, 126.6082],
+  [37.5215, 126.61],
-    [37.5210, 126.6082],
+  //   [37.5215, 126.6082],
-    [37.5210, 126.6057],
+  [37.521, 126.6082],
-    [37.5205, 126.6057],
+  [37.521, 126.6057],
-    [37.5205, 126.6082],
+  [37.5205, 126.6057],
-    [37.5200, 126.6082],
+  [37.5205, 126.6082],
-    [37.5200, 126.6057],
+  [37.52, 126.6082],
-    [37.5195, 126.6057],
+  [37.52, 126.6057],
-    [37.5195, 126.6082],
+  [37.5195, 126.6057],
-    [37.5190, 126.6082],
+  [37.5195, 126.6082],
-    [37.5190, 126.6050]
+  [37.519, 126.6082],
-]
+  [37.519, 126.605]
+];
 
-const divDist = 10 // [m]
+const divDist = 10; // [m]
 
 // 특정거리에 따른 좌표 추출
-const getCoords = (coords) => {
+const getCoords = coords => {
-    if (!coords || coords.length < 1) return;
+  if (!coords || coords.length < 1) return;
-    const totalCoords = [];
+  const totalCoords = [];
-    for (let i = 1; i < coords.length; i++) {
+  for (let i = 1; i < coords.length; i++) {
-        const divCoords = getCoordsFormBetweenCoord(coords[i - 1], coords[i], divDist);
+    const divCoords = getCoordsFormBetweenCoord(
-        totalCoords.push(...divCoords)
+      coords[i - 1],
-    }
+      coords[i],
-    return totalCoords;
+      divDist
-}
+    );
+    totalCoords.push(...divCoords);
+  }
+  return totalCoords;
+};
 
 const getClient = () => {
-    const dronName = prefix + '001';
+  const dronName = prefix + '003';
+  //   const dronName = prefix + '0000001A';
 
-    const client = {};
+  const client = {};
-    client.dronName = dronName
+  client.dronName = dronName;
-    client.socket = getConnection(dronName, host, port);
+  client.socket = getConnection(dronName, host, port);
-    client.data = getCoords(pathSampleCoord);
+  client.data = getCoords(pathSampleCoord);
-    return client;
+  return client;
-}
+};
 
 const sendData = (client, cnt) => {
-    const data = {
+  const data = {
-        ...dumyData,
+    ...dumyData,
-        terminalId: client.dronName,
+    terminalId: client.dronName,
-        body: [
+    body: [
-            {
+      {
-                ...dumyData.body[0],
+        ...dumyData.body[0],
-                objectId: client.dronName,
+        objectId: client.dronName,
-                lat: client.data[cnt][0],
+        lat: client.data[cnt][0],
-                lon: client.data[cnt][1]
+        lon: client.data[cnt][1]
-            }
+      }
-        ]
+    ]
-    }
+  };
-    writeData(client.socket, JSON.stringify(data));
+  writeData(client.socket, JSON.stringify(data));
-    iteratorSendData(++cnt);
+  iteratorSendData(++cnt);
-}
+};
 
 const client = getClient();
 
 const iteratorSendData = (cnt = 0) => {
-    if(cnt >= client.data.length) {
+  if (cnt >= client.data.length) {
-        client.socket.destroy()
+    client.socket.destroy();
-        return;
+    return;
-    }
+  }
-    setTimeout(() => sendData(client, cnt), 1000);
+  setTimeout(() => sendData(client, cnt), 1000);
-}
+};
 
-iteratorSendData()
+iteratorSendData();