diff --git a/src/App.js b/src/App.js index 2ebca2e..df267b0 100644 --- a/src/App.js +++ b/src/App.js @@ -1,9 +1,9 @@ -import React, { useState, useEffect} from "react"; -import { NavigationContainer } from '@react-navigation/native'; +import React, { useState, useEffect } from "react"; +import { NavigationContainer } from "@react-navigation/native"; import navigationTheme from "./app/navigation/navigationTheme"; import "./app/config/globals.js"; -import AppLoading from 'expo-app-loading'; +import AppLoading from "expo-app-loading"; import FlashMessage from "react-native-flash-message"; import AppNavigator from "./app/navigation/AppNavigator"; import EventLocationProvider from "./app/context/EventLocationContext"; @@ -16,28 +16,37 @@ import { getLocation } from "./app/hooks/useLocation"; import { useFiltering } from "./app/hooks/useFiltering"; import NoInternetConnectionScreen from "./app/screens/NoInternetConnectionScreen"; import NetInfo, { useNetInfo } from "@react-native-community/netinfo"; +import getPluviometerStation from "./app/hooks/usePluviometricStation"; export default function App() { const [user, setUser] = useState(); + const [pluviometerStation, setPluviometerStation] = useState(); const [isReady, setIsReady] = useState(); const netInfo = useNetInfo(); useEffect(() => { - user?.username != null && authStorage.setUser(user) - }, [user]) - + if (user?.username != null) { + getPluviometerStation(user.id, setPluviometerStation); + const pluv = "aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaah" + authStorage.setUser({ ...user, pluviometer: pluviometerStation }); + } + }, [user]); const restoreUser = async () => { const storageUser = await authStorage.getUser(); if (storageUser) setUser(storageUser); - global.location = await getLocation(); + global.location = { lat: -9.97111566376452, long: -67.80984283755332 }; //await getLocation(); }; if (!isReady && netInfo.isInternetReachable) { return ( - setIsReady(true)} onError={(e) => console.log(e)} /> + setIsReady(true)} + onError={(e) => console.log(e)} + /> ); } else if (netInfo.isInternetReachable) { global.formsSockets = useFiltering(global.location); diff --git a/src/app/api/Websockets/SocketClient.js b/src/app/api/Websockets/SocketClient.js deleted file mode 100644 index 143edce..0000000 --- a/src/app/api/Websockets/SocketClient.js +++ /dev/null @@ -1,71 +0,0 @@ -import { useEffect, useState } from "react"; -import { useFiltering } from "../../hooks/useFiltering"; - -function createSocketObject(data, validos, response) { - //console.log("criando valuidos"); - var socketObject = { - name: data.name, - socket: response, - }; - validos.push(socketObject); - // console.log(validos); -} - -function isRequestedValue(item, renderOptions) { - if ( - (item.name == "pluviometer" && renderOptions.citzen.pluviometer) || - (item.name == "automaticPluviometer" && - renderOptions.oficial.automaticPluviometer) || - (item.name == "rain" && renderOptions.citzen.rain) || - (item.name == "riverFlood" && renderOptions.citzen.riverFlood) || - (item.name == "floodZones" && renderOptions.citzen.floodRisk) || - (item.name == "susceptibilityAreas" && - renderOptions.oficial.susceptibilityAreas) - ) { - return true; - } -} - -function verify_existingSockets(formType, renderOptions, validos) { - if (formType.response == null && isRequestedValue(formType, renderOptions)) { - //console.log("Criou socket: " + formType.name); - const socket = new WebSocket( - "wss://waterproofing.geog.uni-heidelberg.de/wss/hot/data?" + - formType.endpoint - ); - formType.socketUrl = socket; - createSocketObject(formType, validos, socket); - return socket; - } else { - return null; - } -} - -export default function SocketClient(dataOptionObject, focusChanged) { - const [data, setData] = useState(useFiltering().forms); - var validos = []; - const socket = verify_existingSockets(data[1], dataOptionObject, validos); - const [dados, setDado] = useState(); - - - useEffect(() => { - console.log(dados); - // data.map((e) => verify_existingSockets(e, dataOptionObject, validos)); - if (socket && dados != 'undefined') { - console.log("ESTÁ PASSANDO AQUI!!"); - data[1].socketUrl.onmessage = ({ data }) => { - // data[1].response = data - setDado(data); - // console.log("pegou espostas"); - }; - } else { - setDado(null); - } - - //console.log(dados); - }, [dataOptionObject, focusChanged]); - return dados; - // - //console.log("data socket client: "+ JSON.stringify(data)); - // return data.response; -} diff --git a/src/app/api/Websockets/webSocketClient.js b/src/app/api/Websockets/webSocketClient.js new file mode 100644 index 0000000..b14867b --- /dev/null +++ b/src/app/api/Websockets/webSocketClient.js @@ -0,0 +1,4 @@ +const webSocketClient = + "ws://wpd.brazilsouth.cloudapp.azure.com:9090/hot/formsanswers?"; + +export default webSocketClient; diff --git a/src/app/api/auth.js b/src/app/api/auth.js index 50a3ccb..5716e76 100644 --- a/src/app/api/auth.js +++ b/src/app/api/auth.js @@ -35,6 +35,7 @@ function signup({ securityanswer: secQuestionAns, termsofusage: consent, roles: role !== "" ? [role] : ["ROLE_CLIENT"], + pluviometer: false, }; Object.entries(body).forEach(([key, value]) => { diff --git a/src/app/components/MapModal.js b/src/app/components/MapModal.js index 76882b1..d8935de 100644 --- a/src/app/components/MapModal.js +++ b/src/app/components/MapModal.js @@ -5,7 +5,11 @@ import { FontAwesome5 } from "@expo/vector-icons"; import SelfClosingModal from "../components/SelfClosingModal"; import colors from "../config/colors"; import { showMessage } from "react-native-flash-message"; -import { dimensions, scaleDimsFromWidth, screen_height } from "../config/dimensions"; +import { + dimensions, + scaleDimsFromWidth, + screen_height, +} from "../config/dimensions"; import { Svg, Image as ImageSvg } from "react-native-svg"; import PluviometerGraphics from "./PluviometerGraphics"; import getFieldsAnswers from "../api/RequestFieldsAnswers/getFieldsAnswers"; @@ -36,7 +40,7 @@ function onCloseModal(setShowModal, setCurrentMarker) { function topBar(props, setShowModal, setCurrentMarker) { return ( - + {props ? props.title : "Aguarde..."} @@ -103,7 +107,11 @@ function iconInstitutionTextRow(props) { return ( - + {props.description} @@ -214,7 +222,6 @@ function moreInfo(props) { } function componentBody(props) { - const dims = scaleDimsFromWidth(95, 95, 16); // NOTE: This code is refered to our local SQLite solution. Revise this when implement rest API. const pictures = JSON.parse(props.pictures); @@ -279,19 +286,13 @@ function MapModal({ showModal, setShowModal, markers }) { const finalDate = moment().subtract(5, "days").format("YYYY-MM-DD"); timeFilter = finalDate + "/" + initialDate; - // console.log(timeFilter); - + // console.log(timeFilter); } const result = await getFieldsAnswers.fieldsAnswers(timeFilter, id); if (result.data && showModal && currentMarker == undefined) { - - setCurrentMarker( - AssembleModalObject( - JSON.stringify(result.data.responseData), - name - ) + AssembleModalObject(JSON.stringify(result.data.responseData), name) ); } }; diff --git a/src/app/hooks/useFiltering.js b/src/app/hooks/useFiltering.js index fed7a4f..b988599 100644 --- a/src/app/hooks/useFiltering.js +++ b/src/app/hooks/useFiltering.js @@ -1,12 +1,12 @@ import moment from "moment"; +import webSocketClient from "../api/Websockets/webSocketClient"; function useFiltering(location) { - const endpoint = - "ws://wpd.brazilsouth.cloudapp.azure.com:9090/hot/formsanswers?"; + const endpoint = webSocketClient; const initialDate = moment().add(1, "days").format("YYYY-MM-DDTHH:mm:ss"); const finalDate = moment().subtract(2, "days").format("YYYY-MM-DDTHH:mm:ss"); - console.log(initialDate+"/"+finalDate); + //console.log(initialDate + "/" + finalDate); const filters = [ { diff --git a/src/app/hooks/useFormsAswers.js b/src/app/hooks/useFormsAswers.js deleted file mode 100644 index fbf66e2..0000000 --- a/src/app/hooks/useFormsAswers.js +++ /dev/null @@ -1,163 +0,0 @@ -import React, { useEffect, useState } from "react"; -import * as Location from "expo-location"; -import SocketClient from "../api/Websockets/SocketClient"; -import assets from "../config/assets"; -import PinIntransitavel from "../assets/floodZonesAssets/PinIntransitavel"; -import PinTransitavel from "../assets/floodZonesAssets/PinTransitavel"; - -const custom_assets = { - pluviometer: assets.pluviometer, - officialPluviometer: assets.officialPluviometer, - floodZones: assets.floodZones, - riverLevel: ["low", "normal", "high", "flooding"].map((key) => { - return assets.riverLevel[key]; - }), - rainLevel: ["rain_0_5_pin", "rain_1_5_pin", "rain_2_5_pin", "rain_3_5_pin"].map((key) => { - return assets.rainLevel[key]; - }), -}; -const custom_assets_pin = { - pluviometer: assets.pluviometer_pin, - officialPluviometer: assets.officialPluviometer_pin, - floodZones: { - passable: PinTransitavel, - not_passable: PinIntransitavel, - }, - riverLevel: ["low_pin", "normal_pin", "high_pin", "flooding_pin"].map( - (key) => { - return assets.riverLevel[key]; - } - ), - rainLevel: [ - "rain_0_5_pin", - "rain_1_5_pin", - "rain_2_5_pin", - "rain_3_5_pin", - ].map((key) => { - return assets.rainLevel[key]; - }), -}; - -function getImage(name, situation) { - if (name == "automaticPluviometer") { - return custom_assets_pin.pluviometer; - } - - if (name == "pluviometer") { - return custom_assets_pin.pluviometer; - } - - if (name == "rain") { - if (situation == "sem chuva") { - return custom_assets_pin.rainLevel[0]; - } else if (situation == "chuva fraca") { - return custom_assets_pin.rainLevel[1]; - } else if (situation == "chuva moderada") { - return custom_assets_pin.rainLevel[2]; - } else if (situation == "chuva forte") { - return custom_assets_pin.rainLevel[3]; - } - return custom_assets_pin.rainLevel[3]; - } - - if (name == "riverFlood") { - if (situation == "baixo") { - return custom_assets_pin.riverLevel[0]; - } else if (situation == "normal") { - return custom_assets_pin.riverLevel[1]; - } else if (situation == "alto") { - return custom_assets_pin.riverLevel[2]; - } else if (situation == "inundar") { - return custom_assets_pin.riverLevel[3]; - } - return custom_assets_pin.riverLevel[0]; - } - if (name == "floodZones") { - if (situation == "transitavel") { - return custom_assets_pin.floodZones.passable; - } else { - return custom_assets_pin.floodZones.not_passable; - } - } -} - -function buildPolygonsObject(markers, response, name) { - var coordinate = []; - var formsanswersgeom = response.formsanswersgeom; - const arrayCoordinates = JSON.parse(formsanswersgeom)["coordinates"][0]; - var n = Object.keys(arrayCoordinates).length; - - // console.log(arrayCoordinates); - - for (let i = 0; i < n; i++) { - var lat = arrayCoordinates[i][1]; - var lon = arrayCoordinates[i][0]; - coordinate.push([lat, lon]); - } - // console.log(coordinate); - var polygonObject = { - ID: response.formsanswersid, - name: name, - title: "Titulo", //response.fieldsanswerssituation - address: "Endereço", //response.fieldsanswerseventaddress, - coordinate: { coordinate }, - date: "data" + " | " + "hora", //response.fieldsanswerseventdate + " | " + response.fieldsanswerseventtime, - description: "comentário", //response.fielsanswercomment, - logo: custom_assets.pluviometer, - pictures: null, - image: "", //getMarkerImage(answer.name), - }; - - markers.set(polygonObject.ID, polygonObject); -} - -function buildMarkerObject(markers, response, name) { - //console.log(JSON.parse(response).responseData); - const resposta = JSON.parse(response).responseData.array_to_json[1].formsanswersgeom; -// console.log("\n\nresposta "+ (resposta.formsanswersid)); - const formsanswersgeom = JSON.parse(resposta).coordinates; - // console.log("\n\n ====================================\n"+JSON.stringify(formsanswersgeom)); - - var markerObject = { - ID: 3168,//response.formsanswersid, - name: name, - title: "Titulo", //response.fieldsanswerssituation - address: "Endereço", //response.fieldsanswerseventaddress, - coordinate: { - latitude: formsanswersgeom[1], - longitude:formsanswersgeom[0], - }, - date: "data" + " | " + "hora", //response.fieldsanswerseventdate + " | " + response.fieldsanswerseventtime, - description: "comentário", //response.fielsanswercomment, - logo: custom_assets.pluviometer, - pictures: null, - image: getImage(name, "situação"), //getMarkerImage(answer.name), - }; - - markers.set(markerObject.ID, markerObject); - -} - -function verifyResponse(markers, data) { - // console.log(data.response); - if (data) { - // const response = JSON.parse(data).responseData.array_to_json; - response.forEach((r) => r.formcode == "FLOODZONES_OFFICIAL" ? buildPolygonsObject(markers.markers, r, markers.name) : - buildMarkerObject(markers.markers, data, markers.name)); - } -} - -const getFormsAnswers = (dataOptionObject, focusChanged) => { - var markers = { markers: new Map() }; - const answers = SocketClient(dataOptionObject, focusChanged); - - //answers.forEach((r) => - if (answers) { - // console.log("\n\nAnswers: " + answers); - verifyResponse(markers, answers); //buildMarkerObject(markers.markers, r)); - // return answers; - } - return markers; -}; - -export { getFormsAnswers }; diff --git a/src/app/hooks/usePluviometricStation.js b/src/app/hooks/usePluviometricStation.js new file mode 100644 index 0000000..86eed34 --- /dev/null +++ b/src/app/hooks/usePluviometricStation.js @@ -0,0 +1,81 @@ +import { useState } from "react"; +import getFieldsAnswers from "../api/RequestFieldsAnswers/getFieldsAnswers"; +import webSocketClient from "../api/Websockets/webSocketClient"; + +async function getPluvStation_data(id) { + const result = await getFieldsAnswers.fieldsAnswers(null, id); + if (result.data) { + return result; + } + return null; +} + +function assemblePluvStationObject(pluvData){ + var date = null; + var time = null; + var address = null; + var institutionType = null; + var institutionName = null; + + pluvData.array_to_json.forEach(function (field) { + if(field.fieldname == "eventaddress"){ + address = field.fieldsanswersvalue; + } + else if (field.fieldname == "eventdate") { + date = field.fieldsanswersvalue; + } + else if (field.fieldname == "eventtime") { + time = field.fieldsanswersvalue; + } + else if(field.fieldname== "institutename"){ + institutionName = field.fieldsanswersvalue; + } + else if(field.fieldname== "institutetype"){ + institutionType = field.institutionType; + } + }); + + return{ + regiterDate: date + " | " + time, + address: address, + institutionType: institutionType, + institutionName:institutionName, + coordinates:{lat: pluvData.formsanswerslatitude, long:pluvData.formsanswerslongitude} + } + +} + +async function getPluviometerStation(userId, setPluviometerStation) { + const endpoint = + webSocketClient + `type=PLUVIOMETER_REGISTRATION&user=${userId}`; + const socketObject = new WebSocket(endpoint); + + socketObject.onmessage = async ({ data }) => { + const dataObject = JSON.parse(data); + if (dataObject?.success) { + pluvStation_id = + dataObject.responseData.array_to_json[0].formsanswersid; + pluvStation_data = await getPluvStation_data( + pluvStation_id + ); + const pluvObject = assemblePluvStationObject(pluvStation_data.data.responseData.array_to_json[0]) + setPluviometerStation(pluvObject); + + } else { + setPluviometerStation(false); + } + }; + + socketObject.onerror = (e) => { + console.log(e.message); + setPluviometerStation(null); + }; + + socketObject.close(); + + socketObject.onclose = () => { + console.log("FECHOU"); + }; +} + +export default getPluviometerStation; diff --git a/src/app/screens/MapFeedScreen.js b/src/app/screens/MapFeedScreen.js index ff358c2..8dbfccc 100644 --- a/src/app/screens/MapFeedScreen.js +++ b/src/app/screens/MapFeedScreen.js @@ -17,11 +17,11 @@ export default function MapFeedScreen(props) { susceptibilityAreas: false, }, citzen: { - floodRisk: true, + floodRisk: false, pluviometer: true, - rain: true, - floodZones: true, - riverFlood: true, + rain: false, + floodZones: false, + riverFlood: false, }, }); diff --git a/src/app/screens/PluviometerRegisterScreen.js b/src/app/screens/PluviometerRegisterScreen.js index d0e4663..72d55d5 100644 --- a/src/app/screens/PluviometerRegisterScreen.js +++ b/src/app/screens/PluviometerRegisterScreen.js @@ -115,6 +115,7 @@ function PluviometerRegisterScreen(props) { const [location, setLocationAddr] = useState("Defina o endereço no mapa"); const [coordinates, setCoordinates] = useState(null); const { user, _ } = useContext(AuthContext); + console.log(user); const [showAwaitModal, setShowAwaitModal] = useState(false); const [showMessageModal, setShowMessageModal] = useState(false);