From d272ab51275558facb1985b1fad1ae542ae8141f Mon Sep 17 00:00:00 2001 From: landenf Date: Mon, 18 Sep 2023 14:13:39 -0700 Subject: [PATCH 1/6] BranchInit --- .../src/resources/images/parameter-icon.png | Bin 0 -> 2388 bytes .../helperFunctions.cpython-310.pyc | Bin 0 -> 2276 bytes .../swarm_simulator/docker-compose.yaml | 97 ------------------ .../swarm_simulator/env_files/ros_env1 | 2 +- .../swarm_simulator/mavlink_router/main.conf | 12 --- 5 files changed, 1 insertion(+), 110 deletions(-) create mode 100644 React/SwarmPlanner/src/resources/images/parameter-icon.png create mode 100644 python/__pycache__/helperFunctions.cpython-310.pyc diff --git a/React/SwarmPlanner/src/resources/images/parameter-icon.png b/React/SwarmPlanner/src/resources/images/parameter-icon.png new file mode 100644 index 0000000000000000000000000000000000000000..6cb6821bd0252bd0683d228e691b9fd476ef878d GIT binary patch literal 2388 zcmb7GX;c!55{4vFE0ZwSGMB*pT0KpLl++~2tq{@NGEK}ZH$=S&3f*3);l5-pSt^xl zfhle&uS=U1w5VyhkXk%ZLtN0@dfY$n+`o6uENAA&oSAdJGv8#K@;tFqSz8$Z0PMuL z9>>b#%fCz!EccCmO}FI%M0CR76y-uzJfAMlm114b5CMSg(7y}_C@t3n02F1I+*{Z}WQ zTXuv1E$d$oP&I`OK3F^&F-xz>vhq$f#^~{KQex7`Az=yp_A$xwQ4v|N{Ccg$o`_6F zjfsZWj*3$FL?+Si;@!6 zp_OvcamMl{!=nE?oUJ2O%}XAvm3-sv1M*EEzIFXtybE}|^Qg-K-PR}{&n}3;vYXgs z%%I0na(Ah#p;j%8xI-bv^-Nr?%17#bV^5bsP}dFD{dS|5Pt&;{xpVA1iDA&LL;C?I~D&>ht)Bpu1w; zxg2!Q;nB7ArEY9OKHS1-)R!!*AJv-+VBa)GT-02F#ahno8ZRS&4|TMZXbzdOl~>${ zGEb6p^b%k8cCPM%ZvR$+R}I@c=OCQAYU|8(DJrMo?iNkjh(%ORD`fh-Fk-9p$izO{ zm6rfkPYOP4)a}ypyC$hxQa{ZOmPlf5oiuEszJ7MD|TRJLc(B!jM2PJ|G zifT!|UU&9|ar&I5QR-VYglS=$o#xKSU&@ zP{9Eda?g@u4x*XE<-MO^)+)%N}ooAIwR~NZY;RfwhUtxnr2_ zcaB{|T9BPo1uBTf3QFAG{4`#LM_MO|FA7mxSd%rh{VZI>cFOUHH5VRdz#$X7i`p8us8YiKejSae|>P=Zt&%3}Jc4^oHUn=?pOfz~r zTr8p{4FphX5gH1e7!-0|fpq&C?%$3dlCrDAH6t)}bPvK}`;tI`1KGLJ!gC$C#r;Cn zNynV6-dK+kBlJy}550%mV)Ro2+QK{l4j5_rC(4Slll^z|d5t#?ih=!vu20aYtKUfZ zi4&M0lG)F!_K!?D9~NE94t2n>yRnzy5Tt-$JxPLvoh^eVf!gkzzf`O4n>#{XR=8it zuvcG+@?5tpW(4{7+Am;jmDg_0_O)-eY?Dc@nH?p;* zz9*jtm&$kbJ9W4fSB88U&7)^L`GSnomNprh{lIs<#qYZ1wpo;F!^+1X2@nZtK2%QN zjZAGyJIL=S@<=TP3eT@?Pw=!VJk zg-`wY=sK>`{Qkk_-qg=u9xqNTRb=9_!g)mwr1^ za7PNK_oi(b#U;s!(E^<6k+N^%wD1orvyrJ^D+Xwj3J-IAM2;Uc3ZAEmblNfP;FM5< t%vtwEeD&aNXZ`Kc{)0#2%AdagQ=6B4&MIc~$loFW#>Mk^lT*mm{{d$)a@GI< literal 0 HcmV?d00001 diff --git a/python/__pycache__/helperFunctions.cpython-310.pyc b/python/__pycache__/helperFunctions.cpython-310.pyc new file mode 100644 index 0000000000000000000000000000000000000000..89038d9edf166ce5922ec9ccc409e7280441a89e GIT binary patch literal 2276 zcmbtV&u<$=6y6!{uGgDQnzkWLMJY=uNUo^erlm+Bit5$@St<#V6QB#BY&;WZ%l>d? z#z}427t%wo9Jux195}!MiT?l)C;o)Fa>@-jRR{^*jO~!N+*oVpy?O7=?9BJx_nb{m zx&}O#{`if23fiw~a{R$Cxd|^PFc5>F*ho--kkWCC1FU5($Z2T?rj}MKo~Wk>5H%{M<;lA@+hW2PVlM zsF>-I-2r<^+Y8!m3X8b==nK>|`lx4Ajg9kt+?^KoAm76fk?Z9K&Vhl99vT#s1sNY2 zJ2y;2xWc|av4uNp2)xL+3)Ve|f}2isfAsG}TyURL7KO3j%9!xeFrnOa{n4|)!iZDu zFQ>Z^%hCj3SY|9^3r7(ua5eSYDQ~yb4wU#AgX!mKwwL;?I22nMOZZXz0;8hMQvUP~ z6+ecf_}P{(w(0Q$aX;J*qd44*sh_1oZ-)z-=nZ9VFG?E-z#l)VVk~&;@bWnrnnusq zaQcYAtqD3~%o<DADbgNw7 z3t93$%u>qAt&Z5v((*QqTa>-iP8%Z1QeJ9xq`Ro@(#Vq5(rI-Hb)-3?JG#|91rjeU z##tkb`4TAO;6uod5m<4QwjW5l(P_fnx+lwo?v{n zoEbESJnSJ4IoQMw!pKDqnnI_LiSXYhW-mh6b5vAW(^OmlMHmA}Ho*tD4+YRi0{4J~ zK%1#P?g2GbDZ^ z0o|drw3G#?^Okl!i=8Vd7sExb!&ZC-1`qJ@5XKk~!^r;2vjHpReF`g8jS7B^)gw>< zA84$qVGU6sdDR#n17&)~07#>-ffk9$1o6lunIb31^mG1`d8XIcKS@VOb z%dn(~h8f1}RanU`s^O@u467eSGF_{4SpkIgjM4cPdp4ypdP z9C&pBEP-%oU05G1WvhaiHWa z-ijlk5nws6%N*1_RJ*5I-MH3)G^*C`fJx$r1bMxvR(%$y*+!P`QZ_2~wM-X%t*Vm3 z6-Q0z4KBKfpw{1pX>n58y0ucKDxFQK;glK_MWlJ3XDNF{sne}a67F)<(@Ub$qFkR< tHy6zsjhx=|*pYM+b@y@>f$8m-E~%Sy#b?iO;4H%*^sbz9&YAMA{R2!lE^+_> literal 0 HcmV?d00001 diff --git a/uav_simulator/swarm_simulator/docker-compose.yaml b/uav_simulator/swarm_simulator/docker-compose.yaml index 34b3860..a935b3a 100644 --- a/uav_simulator/swarm_simulator/docker-compose.yaml +++ b/uav_simulator/swarm_simulator/docker-compose.yaml @@ -11,108 +11,11 @@ services: /bin/bash -c "export $$(cat /root/home/env_files/env1) && /home/ardupilot/Tools/autotest/sim_vehicle.py --vehicle $${VEHICLE} -w --custom-location=$${LAT},$${LON},$${ALT},$${DIR} --no-rebuild -I1 --add-param-file=/home/ardupilot/Tools/autotest/default_params/gazebo-drone1.parm" - clustering_1: - depends_on: - - sitl_1 - - mavlink_router - network_mode: host - image: grantphllps/mavros_docker - container_name: clustering_1 - stdin_open: true - tty: true - volumes: - - ./env_files:/root/home/env_files - command: > - /bin/bash -c "source /home/catkin_ws/devel/setup.bash && - export $$(cat /root/home/env_files/ros_env1) - roslaunch mavros apm.launch fcu_url:=$${PORT} tgt_system:=$${SYS_ID} tgt_component:=$${COMP_ID}" - - sitl_2: - image: grantphllps/ardupilot - container_name: sitl_2 - network_mode: host - volumes: - - ./env_files:/root/home/env_files - command: > - /bin/bash -c "export $$(cat /root/home/env_files/env2) && - /home/ardupilot/Tools/autotest/sim_vehicle.py --vehicle $${VEHICLE} -w --custom-location=$${LAT},$${LON},$${ALT},$${DIR} --no-rebuild -I2 --add-param-file=/home/ardupilot/Tools/autotest/default_params/gazebo-drone2.parm" - - clustering_2: - depends_on: - - sitl_2 - - mavlink_router - network_mode: host - image: grantphllps/mavros_docker - container_name: clustering_2 - stdin_open: true - tty: true - volumes: - - ./env_files:/root/home/env_files - command: > - /bin/bash -c "source /home/catkin_ws/devel/setup.bash && - export $$(cat /root/home/env_files/ros_env2) - roslaunch --wait mavros apm.launch fcu_url:=$${PORT} tgt_system:=$${SYS_ID} tgt_component:=$${COMP_ID}" - - sitl_3: - image: grantphllps/ardupilot - container_name: sitl_3 - network_mode: host - volumes: - - ./env_files:/root/home/env_files - command: > - /bin/bash -c "export $$(cat /root/home/env_files/env3) && - /home/ardupilot/Tools/autotest/sim_vehicle.py --vehicle $${VEHICLE} -w --custom-location=$${LAT},$${LON},$${ALT},$${DIR} --no-rebuild -I3 --add-param-file=/home/ardupilot/Tools/autotest/default_params/gazebo-drone3.parm" - - clustering_3: - depends_on: - - sitl_3 - - mavlink_router - network_mode: host - image: grantphllps/mavros_docker - container_name: clustering_3 - stdin_open: true - tty: true - volumes: - - ./env_files:/root/home/env_files - command: > - /bin/bash -c "source /home/catkin_ws/devel/setup.bash && - export $$(cat /root/home/env_files/ros_env3) - roslaunch --wait mavros apm.launch fcu_url:=$${PORT} tgt_system:=$${SYS_ID} tgt_component:=$${COMP_ID}" - - sitl_4: - image: grantphllps/ardupilot - container_name: sitl_4 - network_mode: host - volumes: - - ./env_files:/root/home/env_files - command: > - /bin/bash -c "export $$(cat /root/home/env_files/env4) && - /home/ardupilot/Tools/autotest/sim_vehicle.py --vehicle $${VEHICLE} -w --custom-location=$${LAT},$${LON},$${ALT},$${DIR} --no-rebuild -I4 --add-param-file=/home/ardupilot/Tools/autotest/default_params/gazebo-drone4.parm" - - clustering_4: - depends_on: - - sitl_4 - - mavlink_router - network_mode: host - image: grantphllps/mavros_docker - container_name: clustering_4 - stdin_open: true - tty: true - volumes: - - ./env_files:/root/home/env_files - command: > - /bin/bash -c "source /home/catkin_ws/devel/setup.bash && - export $$(cat /root/home/env_files/ros_env4) - roslaunch --wait mavros apm.launch fcu_url:=$${PORT} tgt_system:=$${SYS_ID} tgt_component:=$${COMP_ID}" - mavlink_router: image: grantphllps/mavlink_router container_name: mavlink_router depends_on: - sitl_1 - - sitl_2 - - sitl_3 - - sitl_4 stdin_open: true tty: true network_mode: "host" diff --git a/uav_simulator/swarm_simulator/env_files/ros_env1 b/uav_simulator/swarm_simulator/env_files/ros_env1 index cdd679a..841768f 100644 --- a/uav_simulator/swarm_simulator/env_files/ros_env1 +++ b/uav_simulator/swarm_simulator/env_files/ros_env1 @@ -3,7 +3,7 @@ SYS_ID=1 COMP_ID=1 CLUSTER_ID=1 CLUSTER_POSITION=1 -CLUSTER_SIZE=4 +CLUSTER_SIZE=1 CLUSTER_RADIUS=16 AGENT_ALT=3.0 HOME_LAT=40.8467784 diff --git a/uav_simulator/swarm_simulator/mavlink_router/main.conf b/uav_simulator/swarm_simulator/mavlink_router/main.conf index 279a0dd..134a025 100644 --- a/uav_simulator/swarm_simulator/mavlink_router/main.conf +++ b/uav_simulator/swarm_simulator/mavlink_router/main.conf @@ -6,18 +6,6 @@ Port = 5759 Address = 0.0.0.0 Port = 5772 -[TcpEndpoint sitl_2] -Address = 0.0.0.0 -Port = 5782 - -[TcpEndpoint sitl_3] -Address = 0.0.0.0 -Port = 5792 - -[TcpEndpoint sitl_4] -Address = 0.0.0.0 -Port = 5802 - [UdpEndpoint omega] Mode=Normal Address = 0.0.0.0 From 3c3b4cb035c046d545f31aab43c559fee8f3201c Mon Sep 17 00:00:00 2001 From: landenf Date: Mon, 18 Sep 2023 14:45:15 -0700 Subject: [PATCH 2/6] TabIconUpdate --- .../src/components/BodyAgentView.js | 1 - React/SwarmPlanner/src/components/Header.js | 3 ++- .../src/resources/images/parameter-icon.png | Bin 2388 -> 0 bytes .../src/resources/images/parameter-icon.svg | 25 ++++++++++++++++++ 4 files changed, 27 insertions(+), 2 deletions(-) delete mode 100644 React/SwarmPlanner/src/resources/images/parameter-icon.png create mode 100644 React/SwarmPlanner/src/resources/images/parameter-icon.svg diff --git a/React/SwarmPlanner/src/components/BodyAgentView.js b/React/SwarmPlanner/src/components/BodyAgentView.js index 9065df4..550a63c 100644 --- a/React/SwarmPlanner/src/components/BodyAgentView.js +++ b/React/SwarmPlanner/src/components/BodyAgentView.js @@ -57,7 +57,6 @@ class BodyAgentView extends React.Component { - ); } } diff --git a/React/SwarmPlanner/src/components/Header.js b/React/SwarmPlanner/src/components/Header.js index a5f118e..85ac600 100644 --- a/React/SwarmPlanner/src/components/Header.js +++ b/React/SwarmPlanner/src/components/Header.js @@ -5,6 +5,7 @@ import '../styles/Header.css' import Swarm from '../resources/images/swarm.svg' import Path from '../resources/images/location-path.svg' import tool from '../resources/images/wrench.svg' +import paramIcon from '../resources/images/parameter-icon.svg' class Header extends React.Component { @@ -36,7 +37,7 @@ class Header extends React.Component { - +
diff --git a/React/SwarmPlanner/src/resources/images/parameter-icon.png b/React/SwarmPlanner/src/resources/images/parameter-icon.png deleted file mode 100644 index 6cb6821bd0252bd0683d228e691b9fd476ef878d..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 2388 zcmb7GX;c!55{4vFE0ZwSGMB*pT0KpLl++~2tq{@NGEK}ZH$=S&3f*3);l5-pSt^xl zfhle&uS=U1w5VyhkXk%ZLtN0@dfY$n+`o6uENAA&oSAdJGv8#K@;tFqSz8$Z0PMuL z9>>b#%fCz!EccCmO}FI%M0CR76y-uzJfAMlm114b5CMSg(7y}_C@t3n02F1I+*{Z}WQ zTXuv1E$d$oP&I`OK3F^&F-xz>vhq$f#^~{KQex7`Az=yp_A$xwQ4v|N{Ccg$o`_6F zjfsZWj*3$FL?+Si;@!6 zp_OvcamMl{!=nE?oUJ2O%}XAvm3-sv1M*EEzIFXtybE}|^Qg-K-PR}{&n}3;vYXgs z%%I0na(Ah#p;j%8xI-bv^-Nr?%17#bV^5bsP}dFD{dS|5Pt&;{xpVA1iDA&LL;C?I~D&>ht)Bpu1w; zxg2!Q;nB7ArEY9OKHS1-)R!!*AJv-+VBa)GT-02F#ahno8ZRS&4|TMZXbzdOl~>${ zGEb6p^b%k8cCPM%ZvR$+R}I@c=OCQAYU|8(DJrMo?iNkjh(%ORD`fh-Fk-9p$izO{ zm6rfkPYOP4)a}ypyC$hxQa{ZOmPlf5oiuEszJ7MD|TRJLc(B!jM2PJ|G zifT!|UU&9|ar&I5QR-VYglS=$o#xKSU&@ zP{9Eda?g@u4x*XE<-MO^)+)%N}ooAIwR~NZY;RfwhUtxnr2_ zcaB{|T9BPo1uBTf3QFAG{4`#LM_MO|FA7mxSd%rh{VZI>cFOUHH5VRdz#$X7i`p8us8YiKejSae|>P=Zt&%3}Jc4^oHUn=?pOfz~r zTr8p{4FphX5gH1e7!-0|fpq&C?%$3dlCrDAH6t)}bPvK}`;tI`1KGLJ!gC$C#r;Cn zNynV6-dK+kBlJy}550%mV)Ro2+QK{l4j5_rC(4Slll^z|d5t#?ih=!vu20aYtKUfZ zi4&M0lG)F!_K!?D9~NE94t2n>yRnzy5Tt-$JxPLvoh^eVf!gkzzf`O4n>#{XR=8it zuvcG+@?5tpW(4{7+Am;jmDg_0_O)-eY?Dc@nH?p;* zz9*jtm&$kbJ9W4fSB88U&7)^L`GSnomNprh{lIs<#qYZ1wpo;F!^+1X2@nZtK2%QN zjZAGyJIL=S@<=TP3eT@?Pw=!VJk zg-`wY=sK>`{Qkk_-qg=u9xqNTRb=9_!g)mwr1^ za7PNK_oi(b#U;s!(E^<6k+N^%wD1orvyrJ^D+Xwj3J-IAM2;Uc3ZAEmblNfP;FM5< t%vtwEeD&aNXZ`Kc{)0#2%AdagQ=6B4&MIc~$loFW#>Mk^lT*mm{{d$)a@GI< diff --git a/React/SwarmPlanner/src/resources/images/parameter-icon.svg b/React/SwarmPlanner/src/resources/images/parameter-icon.svg new file mode 100644 index 0000000..a520faf --- /dev/null +++ b/React/SwarmPlanner/src/resources/images/parameter-icon.svg @@ -0,0 +1,25 @@ + + + + + + + + + + From 9b9ecac1b40f973b5d6114cb80a178baa2c964ef Mon Sep 17 00:00:00 2001 From: landenf Date: Wed, 4 Oct 2023 13:28:38 -0700 Subject: [PATCH 3/6] Pin Location Update on Click --- .../src/components/MapContainer.js | 24 ++++++++++++++----- .../src/resources/images/DroppedPin.svg | 23 ++++++++++++++++++ 2 files changed, 41 insertions(+), 6 deletions(-) create mode 100644 React/SwarmPlanner/src/resources/images/DroppedPin.svg diff --git a/React/SwarmPlanner/src/components/MapContainer.js b/React/SwarmPlanner/src/components/MapContainer.js index 109d544..4f4144f 100644 --- a/React/SwarmPlanner/src/components/MapContainer.js +++ b/React/SwarmPlanner/src/components/MapContainer.js @@ -1,15 +1,22 @@ -import React from 'react' +import React, { Component } from 'react' import { GoogleMap, LoadScript, MarkerF } from '@react-google-maps/api'; -import droneIcon from '../resources/images/Simple_drone_small.svg' +import droneIcon from '../resources/images/Simple_drone_small.svg'; +import pinIcon from '../resources/images/DroppedPin.svg' class MapContainer extends React.Component { constructor(props) { super(props) this.state = { - center: { lat: 40.84667, lng: -96.471667} + center: { lat: 40.84667, lng: -96.471667}, pin : {lat: 40.847, lng: -96.471667} } } + updatePinLocation = (newLat, newLng) => { + this.setState({ + pin: { lat: newLat, lng: newLng} + }); + } + render() { const mapStyles = { height: "92vh", @@ -25,7 +32,10 @@ class MapContainer extends React.Component { ) }) - const debug = + const debugDrone = + const {lat, lng} = this.state.pin; + const markerPin = + return ( + + + +Created by potrace 1.10, written by Peter Selinger 2001-2011 + + + + + + From 852871c491de187100e63ebbb513aacf9ce30ffa Mon Sep 17 00:00:00 2001 From: landenf Date: Tue, 10 Oct 2023 13:01:11 -0700 Subject: [PATCH 4/6] WIP --- React/SwarmPlanner/src/App.js | 36 ++++++++++++++----- .../src/components/MapContainer.js | 22 ++++++++---- .../src/components/ThreeValueInput.js | 7 +++- React/SwarmPlanner/src/index.js | 2 ++ React/SwarmPlanner/src/styles/Map.css | 27 ++++++++++++++ python/swarmPlanner.py | 1 + 6 files changed, 80 insertions(+), 15 deletions(-) create mode 100644 React/SwarmPlanner/src/styles/Map.css diff --git a/React/SwarmPlanner/src/App.js b/React/SwarmPlanner/src/App.js index dd8f2cb..e7eaed2 100644 --- a/React/SwarmPlanner/src/App.js +++ b/React/SwarmPlanner/src/App.js @@ -6,14 +6,32 @@ import BodyAgentView from './components/BodyAgentView'; import BodyClusterControl from './components/BodyClusterControl'; import BodySwarmConfig from './components/BodySwarmConfig'; import BodyParameterControl from './components/BodyParameterControl'; +import { createContext } from "react"; +class LocationStore { + gloabalPinLocationX = 1; + gloabalPinLocationY = 1; + + setLocation = (X, Y) => { + this.gloabalPinLocationX = X; + this.gloabalPinLocationY = Y; + } +} + +export const LocationContext = createContext(); class App extends React.Component { + constructor(props) { + console.log("const"); + super(props) - this.state = {body: "SwarmOverview", checkedAgents: [''], ignoreComps: []} + this.state = {body: "SwarmOverview", checkedAgents: [''], ignoreComps: [], LocationStore: new LocationStore()} + } + + removeAgent= (input) => { var blackListed = this.state.ignoreComps blackListed.push(input) @@ -42,15 +60,17 @@ class App extends React.Component { } render() { - - const body = this.getBody(); + console.log("test"); + const body = this.getBody(); return ( -
-
- - {body} -
+ +
+
+ + {body} +
+ ); } } diff --git a/React/SwarmPlanner/src/components/MapContainer.js b/React/SwarmPlanner/src/components/MapContainer.js index 4f4144f..a6ed7c9 100644 --- a/React/SwarmPlanner/src/components/MapContainer.js +++ b/React/SwarmPlanner/src/components/MapContainer.js @@ -1,19 +1,24 @@ import React, { Component } from 'react' import { GoogleMap, LoadScript, MarkerF } from '@react-google-maps/api'; import droneIcon from '../resources/images/Simple_drone_small.svg'; -import pinIcon from '../resources/images/DroppedPin.svg' +import pinIcon from '../resources/images/DroppedPin.svg'; +import '../styles/Map.css'; class MapContainer extends React.Component { constructor(props) { super(props) this.state = { - center: { lat: 40.84667, lng: -96.471667}, pin : {lat: 40.847, lng: -96.471667} + center: { lat: 40.84667, lng: -96.471667}, pin : {pinLat: 40.847, pinLng: -96.471667}, pinLabel: "Start" } } + setIsHovered = (string) =>{ + this.setState({pinLabel: string}) + } + updatePinLocation = (newLat, newLng) => { this.setState({ - pin: { lat: newLat, lng: newLng} + pin: { pinLat: newLat, pinLng: newLng} }); } @@ -33,8 +38,12 @@ class MapContainer extends React.Component { }) const debugDrone = - const {lat, lng} = this.state.pin; - const markerPin = + const {pinLat, pinLng} = this.state.pin; + const locationPin = { + fetch('http://127.0.0.1:8080/goto/' + pinLat + '/' + pinLng + '/' + 10); //alt? + console.log("Sending to: ", pinLat, pinLng) + }} + /> return ( @@ -52,9 +61,10 @@ class MapContainer extends React.Component { this.updatePinLocation(ev.latLng.lat(), ev.latLng.lng()); fetch('http://127.0.0.1:8080/debug_vector/C1$4/' + ''); }} + > {agentMarkers} - {markerPin} + {locationPin} {debugDrone} diff --git a/React/SwarmPlanner/src/components/ThreeValueInput.js b/React/SwarmPlanner/src/components/ThreeValueInput.js index 0af4bf4..964cd2b 100644 --- a/React/SwarmPlanner/src/components/ThreeValueInput.js +++ b/React/SwarmPlanner/src/components/ThreeValueInput.js @@ -3,6 +3,9 @@ import '../styles/AgentStatusCard.css' import '../styles/ThreeValueInput.css' import '../styles/ButtonStyles.css' import '../styles/TextStyles.css' +import { useContext } from "react"; +import { LocationContext } from '../App' + class ThreeValueInput extends React.Component { constructor(props) { @@ -10,6 +13,8 @@ class ThreeValueInput extends React.Component { this.state = {x: 0, y: 0, z: 0} } + static locationStore = LocationContext; + handleChangeX = (event) => { this.setState({x: event.target.value}) } @@ -28,7 +33,7 @@ class ThreeValueInput extends React.Component {
{/* */} - + {/* */} diff --git a/React/SwarmPlanner/src/index.js b/React/SwarmPlanner/src/index.js index 7716fe4..47e8dd8 100644 --- a/React/SwarmPlanner/src/index.js +++ b/React/SwarmPlanner/src/index.js @@ -3,6 +3,8 @@ import ReactDOM from 'react-dom/client'; import './index.css'; import App from './App'; +console.log("const"); + const root = ReactDOM.createRoot(document.getElementById('root')); root.render( diff --git a/React/SwarmPlanner/src/styles/Map.css b/React/SwarmPlanner/src/styles/Map.css new file mode 100644 index 0000000..d66fbf1 --- /dev/null +++ b/React/SwarmPlanner/src/styles/Map.css @@ -0,0 +1,27 @@ +/* Default style for the marker wrapper */ +.marker-wrapper { + position: relative; + display: inline-block; + } + + /* Hover style for the marker wrapper */ + .marker-wrapper.hovered { + /* Add any styles for the hover effect of the wrapper */ + } + + /* Default style for the icon in MarkerF */ + .marker-wrapper .icon { + width: 32px; /* Adjust the width and height as needed */ + height: 32px; + background-image: url('../resources/images/DroppedPin.svg'); /* Set your default icon image */ + background-size: cover; /* Adjust as needed */ + transition: background-image 0.3s ease-in-out; /* Transition effect for the icon */ + } + + /* Hover style for the icon in MarkerF */ + .marker-wrapper.hovered .icon { + background-image: url('../resources/images/Simple_drone.svg'); /* Set your hover icon image */ + width: 100px; + /* Add any other styles for the hover effect of the icon */ + } + \ No newline at end of file diff --git a/python/swarmPlanner.py b/python/swarmPlanner.py index ab6cd85..073aa24 100644 --- a/python/swarmPlanner.py +++ b/python/swarmPlanner.py @@ -282,6 +282,7 @@ def do_GET(self): lat = float(splitURL[2]) lon = float(splitURL[3]) alt = float(splitURL[4]) + print("Sending swarm to:", lat, lon, alt) mavswarm.goto(x=lat,y=lon,z=alt,frame=MavSwarm.GLOBAL_RELATIVE_FRAME) case 'fetch_parameters': From 0e9f630f9b43a4cc70be1753ea319850797d174c Mon Sep 17 00:00:00 2001 From: landenf Date: Wed, 11 Oct 2023 14:57:00 -0700 Subject: [PATCH 5/6] Send Map Pin Location To Sidebar --- React/SwarmPlanner/src/App.js | 17 +-- .../SwarmPlanner/src/classes/LocationStore.js | 15 ++ .../src/components/MapContainer.js | 133 ++++++++++-------- .../src/components/ThreeValueInput.js | 63 +++++---- 4 files changed, 122 insertions(+), 106 deletions(-) create mode 100644 React/SwarmPlanner/src/classes/LocationStore.js diff --git a/React/SwarmPlanner/src/App.js b/React/SwarmPlanner/src/App.js index e7eaed2..88a02b2 100644 --- a/React/SwarmPlanner/src/App.js +++ b/React/SwarmPlanner/src/App.js @@ -7,31 +7,18 @@ import BodyClusterControl from './components/BodyClusterControl'; import BodySwarmConfig from './components/BodySwarmConfig'; import BodyParameterControl from './components/BodyParameterControl'; import { createContext } from "react"; - -class LocationStore { - gloabalPinLocationX = 1; - gloabalPinLocationY = 1; - - setLocation = (X, Y) => { - this.gloabalPinLocationX = X; - this.gloabalPinLocationY = Y; - } -} +import LocationStore from './classes/LocationStore' export const LocationContext = createContext(); class App extends React.Component { constructor(props) { - console.log("const"); - super(props) this.state = {body: "SwarmOverview", checkedAgents: [''], ignoreComps: [], LocationStore: new LocationStore()} } - - removeAgent= (input) => { var blackListed = this.state.ignoreComps blackListed.push(input) @@ -60,8 +47,6 @@ class App extends React.Component { } render() { - console.log("test"); - const body = this.getBody(); return ( diff --git a/React/SwarmPlanner/src/classes/LocationStore.js b/React/SwarmPlanner/src/classes/LocationStore.js new file mode 100644 index 0000000..f8865bc --- /dev/null +++ b/React/SwarmPlanner/src/classes/LocationStore.js @@ -0,0 +1,15 @@ +class LocationStore { + globalPinLocationX = 1; + globalPinLocationY = 1; + + setLocation = (X, Y) => { + this.globalPinLocationX = X; + this.globalPinLocationY = Y; + } +} + +export default LocationStore + +//Used for storing global locations using React Context. +//Currently used for Google Map Pin Locations + diff --git a/React/SwarmPlanner/src/components/MapContainer.js b/React/SwarmPlanner/src/components/MapContainer.js index a6ed7c9..829bb31 100644 --- a/React/SwarmPlanner/src/components/MapContainer.js +++ b/React/SwarmPlanner/src/components/MapContainer.js @@ -1,76 +1,85 @@ -import React, { Component } from 'react' +import React, { useState, useContext } from 'react'; import { GoogleMap, LoadScript, MarkerF } from '@react-google-maps/api'; import droneIcon from '../resources/images/Simple_drone_small.svg'; import pinIcon from '../resources/images/DroppedPin.svg'; import '../styles/Map.css'; +import { LocationContext } from '../App' -class MapContainer extends React.Component { - constructor(props) { - super(props) - this.state = { - center: { lat: 40.84667, lng: -96.471667}, pin : {pinLat: 40.847, pinLng: -96.471667}, pinLabel: "Start" - } - } +//Converted to Functional Component - setIsHovered = (string) =>{ - this.setState({pinLabel: string}) - } +const MapContainer = (props) => { + const locationStore = useContext(LocationContext); - updatePinLocation = (newLat, newLng) => { - this.setState({ - pin: { pinLat: newLat, pinLng: newLng} - }); - } + const [center, setCenter] = useState({ lat: 40.84667, lng: -96.471667 }); + const [pin, setPin] = useState({ pinLat: 40.847, pinLng: -96.471667 }); - render() { - const mapStyles = { - height: "92vh", - width: "100%"}; - - const defaultCenter = { - lat: 40.84667, lng: -96.471667 - } + const updatePinLocation = (newLat, newLng) => { + setPin({ pinLat: newLat, pinLng: newLng }); + locationStore.setLocation(newLat, newLng) + }; - const agentMarkers = this.props.agents.map( (currentAgent) => { - return( - - ) - }) + const mapStyles = { + height: '92vh', + width: '100%', + }; - const debugDrone = - const {pinLat, pinLng} = this.state.pin; - const locationPin = { - fetch('http://127.0.0.1:8080/goto/' + pinLat + '/' + pinLng + '/' + 10); //alt? - console.log("Sending to: ", pinLat, pinLng) - }} - /> + const defaultCenter = { + lat: 40.84667, + lng: -96.471667, + }; + const agentMarkers = props.agents.map((currentAgent) => ( + + )); - return ( - - { - fetch('http://127.0.0.1:8080/debug_vector/C1$9/' + (ev.latLng.lat() + '/') + (ev.latLng.lng() + '/') + "0" ); - console.log("latitide = ", ev.latLng.lat()); - console.log("longitude = ", ev.latLng.lng()); - this.updatePinLocation(ev.latLng.lat(), ev.latLng.lng()); - fetch('http://127.0.0.1:8080/debug_vector/C1$4/' + ''); - }} - - > - {agentMarkers} - {locationPin} - {debugDrone} - - - ) - } + const debugDrone = ( + + ); + + const { pinLat, pinLng } = pin; -} + const locationPin = ( + { + fetch(`http://127.0.0.1:8080/goto/${pinLat}/${pinLng}/10`); + console.log('Sending to: ', pinLat, pinLng); + }} + /> + ); + + return ( + + { + fetch( + `http://127.0.0.1:8080/debug_vector/C1$9/${ev.latLng.lat()}/${ev.latLng.lng()}/0` + ); + console.log('latitide = ', ev.latLng.lat()); + console.log('longitude = ', ev.latLng.lng()); + updatePinLocation(ev.latLng.lat(), ev.latLng.lng()); + fetch('http://127.0.0.1:8080/debug_vector/C1$4/'); + }} + > + {agentMarkers} + {locationPin} + {debugDrone} + + + ); +}; -export default MapContainer; \ No newline at end of file +export default MapContainer; diff --git a/React/SwarmPlanner/src/components/ThreeValueInput.js b/React/SwarmPlanner/src/components/ThreeValueInput.js index 964cd2b..30a8278 100644 --- a/React/SwarmPlanner/src/components/ThreeValueInput.js +++ b/React/SwarmPlanner/src/components/ThreeValueInput.js @@ -1,4 +1,4 @@ -import React from 'react' +import React, { useState } from 'react' import '../styles/AgentStatusCard.css' import '../styles/ThreeValueInput.css' import '../styles/ButtonStyles.css' @@ -6,45 +6,52 @@ import '../styles/TextStyles.css' import { useContext } from "react"; import { LocationContext } from '../App' +//Converted to Functional Component -class ThreeValueInput extends React.Component { - constructor(props) { - super(props); - this.state = {x: 0, y: 0, z: 0} - } +const ThreeValueInput = (props) => { + const locationStore = useContext(LocationContext); - static locationStore = LocationContext; + const [x, setX] = useState(0); + const [y, setY] = useState(0); + const [z, setZ] = useState(0); - handleChangeX = (event) => { - this.setState({x: event.target.value}) + //Updates State if user input value X + const handleChangeX = (event) => { + setX(event.target.value) + locationStore.setLocation(event.target.value, y) + } + + //Updates State if user input value Y + const handleChangeY = (event) => { + locationStore.setLocation(x, event.target.value) + setY(event.target.value) } - handleChangeY = (event) => { - this.setState({y: event.target.value}) + const handleChangeZ = (event) => { + setZ(event.target.value) } - handleChangeZ = (event) => { - this.setState({z: event.target.value}) + //Update State based off pin location + const updatePlaceHolders = () => { + setX(locationStore.globalPinLocationX); + setY(locationStore.globalPinLocationY); } - render() { - const handleClick = this.props.buttonFcn; - + + const handleClick = props.buttonFcn; return(
- - {/* */} - -{/* - */} - - - {/* */} - - + {/* */} + + {/* + */} + + + {/* */} + + +
- ); } -} export default ThreeValueInput; \ No newline at end of file From 72b972f6715dc484a3497390862e1f1bac0d4548 Mon Sep 17 00:00:00 2001 From: landenf Date: Wed, 18 Oct 2023 14:24:18 -0700 Subject: [PATCH 6/6] Code Cleanup --- .../src/components/MapContainer.js | 1 - React/SwarmPlanner/src/styles/Map.css | 27 ------------------- python/swarmPlanner.py | 1 - 3 files changed, 29 deletions(-) delete mode 100644 React/SwarmPlanner/src/styles/Map.css diff --git a/React/SwarmPlanner/src/components/MapContainer.js b/React/SwarmPlanner/src/components/MapContainer.js index 829bb31..a72c8d1 100644 --- a/React/SwarmPlanner/src/components/MapContainer.js +++ b/React/SwarmPlanner/src/components/MapContainer.js @@ -2,7 +2,6 @@ import React, { useState, useContext } from 'react'; import { GoogleMap, LoadScript, MarkerF } from '@react-google-maps/api'; import droneIcon from '../resources/images/Simple_drone_small.svg'; import pinIcon from '../resources/images/DroppedPin.svg'; -import '../styles/Map.css'; import { LocationContext } from '../App' //Converted to Functional Component diff --git a/React/SwarmPlanner/src/styles/Map.css b/React/SwarmPlanner/src/styles/Map.css deleted file mode 100644 index d66fbf1..0000000 --- a/React/SwarmPlanner/src/styles/Map.css +++ /dev/null @@ -1,27 +0,0 @@ -/* Default style for the marker wrapper */ -.marker-wrapper { - position: relative; - display: inline-block; - } - - /* Hover style for the marker wrapper */ - .marker-wrapper.hovered { - /* Add any styles for the hover effect of the wrapper */ - } - - /* Default style for the icon in MarkerF */ - .marker-wrapper .icon { - width: 32px; /* Adjust the width and height as needed */ - height: 32px; - background-image: url('../resources/images/DroppedPin.svg'); /* Set your default icon image */ - background-size: cover; /* Adjust as needed */ - transition: background-image 0.3s ease-in-out; /* Transition effect for the icon */ - } - - /* Hover style for the icon in MarkerF */ - .marker-wrapper.hovered .icon { - background-image: url('../resources/images/Simple_drone.svg'); /* Set your hover icon image */ - width: 100px; - /* Add any other styles for the hover effect of the icon */ - } - \ No newline at end of file diff --git a/python/swarmPlanner.py b/python/swarmPlanner.py index 073aa24..ab6cd85 100644 --- a/python/swarmPlanner.py +++ b/python/swarmPlanner.py @@ -282,7 +282,6 @@ def do_GET(self): lat = float(splitURL[2]) lon = float(splitURL[3]) alt = float(splitURL[4]) - print("Sending swarm to:", lat, lon, alt) mavswarm.goto(x=lat,y=lon,z=alt,frame=MavSwarm.GLOBAL_RELATIVE_FRAME) case 'fetch_parameters':