{"version":3,"sources":["webpack:///./src/views/maps/sensors/SensorStatusMenu.vue?1793","webpack:///./src/views/maps/sensors/SensorStatusMenu.vue?c186","webpack:///src/views/maps/sensors/SensorStatusMenu.vue","webpack:///./src/views/maps/sensors/SensorStatusMenu.vue?918c","webpack:///./src/views/maps/sensors/SensorStatusMenu.vue","webpack:///./src/views/maps/sensors/SensorStatusMenu.vue?9073"],"names":["staticSensors","mobileSensors","sensors","render","_vm","this","_h","$createElement","_c","_self","staticClass","attrs","$t","slot","_m","directives","name","rawName","value","expression","_v","_s","layers","waitingforfanspeed","on","onLayerSelect","onLayerRemove","MapTime","_e","selectedSensor","feature","Aqparameters","H24Parameters","staticRenderFns","staticStyle","sourceandlayers","components","data","mounted","methods","computed","component"],"mappings":"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ACF,EAAG,MAAM,CAACE,YAAY,qE,21CCwE56D,UAKA,IAAIyB,EAAkB,GAGtB,uCACA,wCACA,mBACA,mBACA,qBACA,mBAEA,GAEAnB,KAAM,aACNoB,WAAY,CACZ,uBACA,cACA,qBAEAC,KAAA,WACA,OACA,WACA,mBACA,mBACA,QACA,mBACA,aACA,sBAEA,iBACA,iBACA,iBACA,+BACA,WACA,wBAGAC,QAAA,WAGA,gBACA,wBAEAC,QAAS,CACT,uKAKA,OAFA,WAEA,SACA,wBAGA,OAHA,oBACA,eAEA,SACA,wCAGA,kCAGA,gBAGA,yBAGA,yBAGA,gIAzBA,GA4BA,sLAkBA,OAhBA,2BACA,2CACA,6DAOA,KAGA,0CACA,wFAGA,SACA,+BACA,CACA,2CACA,cACA,aACA,kBACA,YAEA,OARA,SAYA,0CAEA,gBACA,iBACA,8CACA,mCAIA,mDACA,2CACA,4FACA,GAIA,sDAEA,iIAjDA,GAqDA,yKAGA,yCAGA,wEAEA,qCACA,uEACA,+CACA,GAGA,gDACA,uEACA,WACA,2BACA,qGAlBA,GAsBA,yKAGA,yCAGA,wEAEA,qCACA,6DACA,yDACA,GAIA,gDACA,uEACA,WACA,2BACA,qGAnBA,GAuBA,+BAEA,gBAGA,8EACA,qBACA,sEAGA,+CAEA,+BACA,oEACA,GAIA,wDAEA,iBAIA,yLAEA,2CACA,yFAEA,kCACA,gBACA,6BAEA,qGATA,GAaA,0CACA,OACA,WACA,aACA,YACA,aACA,OACA,aACA,QAGA,OADA,UACA,GAGA,gBAGA,uCACA,0BAGA,eAEA,4BACA,aACA,UACA,qCAGA,4DAGA,IAEA,EAFA,kCACA,sCACA,iDACA,sBACA,kBACA,wDAIA,8BACA,8BACA,sCAGA,sCACA,kCAKA,4KACA,0BAEA,oDACA,yIAJA,GAQA,sKAEA,+EAGA,8EACA,2DACA,+FACA,sGARA,IAYAC,SAAA,CACA,uDACA,mBACA,4BACA,mDAEA,IAEA,0BACA,iBAEA,mBACA,kBAEA,yBACA,kEAEA,yBACA,oECtXwX,I,kCCSpXC,EAAY,eACd,EACAtC,EACA8B,GACA,EACA,KACA,KACA,MAIa,aAAAQ,E,oECpBf","file":"js/SensorStatusMenu.0ff75875.js","sourcesContent":["export * from \"-!../../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--7-oneOf-1-0!../../../../node_modules/css-loader/index.js??ref--7-oneOf-1-1!../../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../node_modules/postcss-loader/src/index.js??ref--7-oneOf-1-2!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./SensorStatusMenu.vue?vue&type=style&index=1&lang=postcss&\"","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',[_c('l-container',{staticClass:\"mb-4\"},[_c('l-container-title',{attrs:{\"slot\":\"toolbar\",\"text\":this.$t('sensorstatusmenu'),\"icon\":\"network-wired\",\"color\":\"bg-pastel-purple\"},slot:\"toolbar\"})],1),_c('div',{staticClass:\"grid grid-cols-3\"},[_vm._m(0),_c('div',[_c('div',{directives:[{name:\"show\",rawName:\"v-show\",value:(_vm.loading),expression:\"loading\"}]},[_vm._m(1),_c('div',{staticClass:\"flex justify-center items-center\"},[_vm._v(_vm._s(_vm.$t(\"dataloading\")))])]),_c('Layers',{attrs:{\"layers\":_vm.layers,\"waitingforfanspeed\":_vm.waitingforfanspeed},on:{\"checklayer\":_vm.onLayerSelect,\"removelayer\":_vm.onLayerRemove}}),(_vm.MapTime)?_c('div',{staticClass:\"timedisplay bg-gray-500 text-center text-lg text-white\"},[_vm._v(_vm._s(_vm.MapTime))]):_vm._e(),_c('SensorStatus',{attrs:{\"selectedSensor\":_vm.selectedSensor,\"ssfeature\":_vm.feature,\"ssH24Parameters\":_vm.Aqparameters.H24Parameters,\"measurementStatus\":false,\"placementStatus\":true}})],1)])],1)}\nvar staticRenderFns = [function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"col-span-2\"},[_c('div',{staticClass:\"grid grid-cols-3\"},[_c('div',{staticClass:\"col-span-2\",staticStyle:{\"float\":\"left\",\"margin-top\":\"1%\"},attrs:{\"id\":\"menu\"}},[_c('input',{staticStyle:{\"margin-left\":\"3%\"},attrs:{\"id\":\"light-v10\",\"type\":\"radio\",\"name\":\"rtoggle\",\"value\":\"light\",\"checked\":\"checked\"}}),_c('label',{staticStyle:{\"margin-left\":\"0.2%\"},attrs:{\"for\":\"light-v10\"}},[_vm._v(\"Light\")]),_c('input',{staticStyle:{\"margin-left\":\"1.5%\"},attrs:{\"id\":\"satellite-v9\",\"type\":\"radio\",\"name\":\"rtoggle\",\"value\":\"satellite\"}}),_c('label',{staticStyle:{\"margin-left\":\"0.2%\"},attrs:{\"for\":\"satellite-v9\"}},[_vm._v(\"Satellite\")]),_c('input',{staticStyle:{\"margin-left\":\"1.5%\"},attrs:{\"id\":\"dark-v10\",\"type\":\"radio\",\"name\":\"rtoggle\",\"value\":\"dark\"}}),_c('label',{staticStyle:{\"margin-left\":\"0.2%\"},attrs:{\"for\":\"dark-v10\"}},[_vm._v(\"Dark\")]),_c('input',{staticStyle:{\"margin-left\":\"1.5%\"},attrs:{\"id\":\"streets-v11\",\"type\":\"radio\",\"name\":\"rtoggle\",\"value\":\"streets\"}}),_c('label',{staticStyle:{\"margin-left\":\"0.2%\"},attrs:{\"for\":\"streets-v11\"}},[_vm._v(\"Streets\")]),_c('input',{staticStyle:{\"margin-left\":\"1.5%\"},attrs:{\"id\":\"outdoors-v11\",\"type\":\"radio\",\"name\":\"rtoggle\",\"value\":\"outdoors\"}}),_c('label',{staticStyle:{\"margin-left\":\"0.2%\"},attrs:{\"for\":\"outdoors-v11\"}},[_vm._v(\"Outdoors\")]),_c('input',{staticStyle:{\"margin-left\":\"1.5%\"},attrs:{\"id\":\"navigation-night-v1\",\"type\":\"radio\",\"name\":\"rtoggle\",\"value\":\"navigation\"}}),_c('label',{staticStyle:{\"margin-left\":\"0.2%\"},attrs:{\"for\":\"navigation-night-v1\"}},[_vm._v(\"Navigation\")])]),_c('div',{staticClass:\"geocoder;col-span-3\",staticStyle:{\"margin-left\":\"15%\"},attrs:{\"id\":\"geocoder\"}})]),_c('div',{attrs:{\"id\":\"map\"}})])},function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"flex justify-center items-center\"},[_c('div',{staticClass:\"animate-spin rounded-full h-8 w-8 border-b-2 border-gray-900\"})])}]\n\nexport { render, staticRenderFns }","<template>\n  <div>\n    <l-container class=\"mb-4\">\n      <l-container-title\n        slot=\"toolbar\"\n        :text= \"this.$t('sensorstatusmenu')\"\n        icon=\"network-wired\"\n        color=\"bg-pastel-purple\"\n      />\n    </l-container>\n    <div class=\"grid grid-cols-3\">\n      <div class=\"col-span-2\">\n        <div class=\"grid grid-cols-3\">\n          <div id=\"menu\" class=\"col-span-2\" style=\" float:left;margin-top: 1%;\">\n            <input id=\"light-v10\" type=\"radio\" name=\"rtoggle\" value=\"light\" checked=\"checked\" style=\"margin-left: 3%;\">\n            <label for=\"light-v10\" style=\"margin-left: 0.2%;\">Light</label>\n            <input id=\"satellite-v9\" type=\"radio\" name=\"rtoggle\" value=\"satellite\" style=\"margin-left: 1.5%;\">\n            <label for=\"satellite-v9\" style=\"margin-left: 0.2%;\">Satellite</label>\n            <input id=\"dark-v10\" type=\"radio\" name=\"rtoggle\" value=\"dark\" style=\"margin-left: 1.5%;\">\n            <label for=\"dark-v10\" style=\"margin-left: 0.2%;\">Dark</label>\n            <input id=\"streets-v11\" type=\"radio\" name=\"rtoggle\" value=\"streets\" style=\"margin-left: 1.5%;\">\n            <label for=\"streets-v11\" style=\"margin-left: 0.2%;\">Streets</label>\n            <input id=\"outdoors-v11\" type=\"radio\" name=\"rtoggle\" value=\"outdoors\" style=\"margin-left: 1.5%;\">\n            <label for=\"outdoors-v11\" style=\"margin-left: 0.2%;\">Outdoors</label>\n            <input id=\"navigation-night-v1\" type=\"radio\" name=\"rtoggle\" value=\"navigation\" style=\"margin-left: 1.5%;\">\n            <label for=\"navigation-night-v1\" style=\"margin-left: 0.2%;\">Navigation</label>\n          </div>\n          <div id=\"geocoder\" class=\"geocoder;col-span-3\" style=\"margin-left: 15%;\"></div>\n        </div>\n        \n        <div id='map'>\n        </div>\n        \n      </div>\n      <div>\n        <div v-show=\"loading\">\n          <div class=\"flex justify-center items-center\">\n            <div class=\"animate-spin rounded-full h-8 w-8 border-b-2 border-gray-900\"></div>\n          </div>\n          <div class=\"flex justify-center items-center\">{{$t(\"dataloading\")}}</div>\n        </div>\n        <Layers :layers=\"layers\" :waitingforfanspeed=\"waitingforfanspeed\" v-on:checklayer=\"onLayerSelect\" v-on:removelayer=\"onLayerRemove\"/>\n        \n        <div v-if=\"MapTime\" class=\"timedisplay bg-gray-500 text-center text-lg text-white\">{{MapTime}}</div>\n        <SensorStatus :selectedSensor=\"selectedSensor\" :ssfeature=\"feature\" :ssH24Parameters=\"Aqparameters.H24Parameters\" :measurementStatus=\"false\" :placementStatus=\"true\"></SensorStatus>\n        \n      </div>\n    </div>\n  </div>\n</template>\n\n<script>\n\n\nimport mapboxgl from 'mapbox-gl'\nimport MapboxGeocoder from \"@mapbox/mapbox-gl-geocoder\";\nimport SensorsService from \"../../../helpers/apiservices/sensors/sensors.service\";\nimport MapboxglSettings from \"../../../helpers/settings/mapboxgl\";\nimport ObservationsService from \"../../../helpers/apiservices/observations/observations.service\";\nimport Notify from \"@/helpers/notify\";\nimport GeoJSONWrapper from \"../../../helpers/geojsonwrapper\";\nimport Aqparameters from \"../../../helpers/settings/aqparameters\"; \nimport MapboxglHelper from \"@/helpers/mapboxglhelper\";\nimport ObservationStatus from \"../../../helpers/observationstatus\";\n\nimport LLayerSelection from \"../../../views/viewer/LLayerSelection\";\nimport Layers from './Layers';\nimport SensorStatus from './SensorStatus';\nimport * as moment from \"moment\";\nimport {Legendgraphics} from '../../../components/controls/mapboxcontrols'\nimport GeoserverHelper from '../../../helpers/geoserver' \nimport Vue from 'vue'\n\nrequire('mapbox-gl/dist/mapbox-gl.css');\nvar map;\nvar staticSensors;\nvar mobileSensors;\nvar sensors;\nvar sourceandlayers = [];\nvar disabledSensors;\n\nconst selected = Vue.observable({sensor: {}}); \nconst mbfeature = Vue.observable({feature: {}}); \nconst DEFAULTLAYERSS = \"Static sensors\";\nconst DEFAULTLAYERMS = \"Mobile sensors\";\nconst DEFAULTLAYERDS = \"Disabled sensors\";\nconst DEFAULTLAYERFS = \"Fanspeed check\";\n\nexport default {\n\nname: 'SensorsMap',\ncomponents: {\n  LLayerSelection,\n  Layers,\n  SensorStatus\n},\ndata() {\n  return {\n    sensors: [],\n    disabledsensors:[],\n    fanspeedsensors: [],\n    layers: {\n      placementlayers: [],\n      maplayers:[],\n      measurementlayers:[]\n    },\n    DEFAULTLAYERSS: DEFAULTLAYERSS, \n    DEFAULTLAYERMS: DEFAULTLAYERMS,\n    DEFAULTLAYERDS: DEFAULTLAYERDS,\n    Aqparameters: Aqparameters.settings() ,\n    loading: false,\n    waitingforfanspeed: false\n  };\n},\nmounted() {\n  //Testing without using Notify\n  //Notify.loadData(null, this.loadInitialData);\n  this.loading = true;\n  this.loadInitialData();\n},\nmethods: {\n  async loadInitialData() {\n\n    //Map create\n    this.map();\n\n    //Get all sensors\n    this.sensors = await SensorsService.sensors();\n    sensors = this.sensors; //variable for mapbox gl js for all sensors\n\n    //Check sensor status based different parmaters (online, qc flags, mobile/static/disabled sensor)\n    await this.addStatus();\n\n    //Place disabled sensors in its own layer\n    await this.loadDisabledSensors();\n\n    //Turn off loading image\n    this.loading = false;\n\n    //Add layer: all mobile sensors\n    this.loadMobileSensors();\n\n    //Add layer: last 1h periodic statistics for all static sensors\n    this.loadStaticSensors();\n\n    //Add layer: fan speed\n    this.loadfanspeedstatus();\n  },\n\n  async loadfanspeedstatus(){\n\n    this.waitingforfanspeed = true;\n    this.fanspeedsensors = sensors.filter(sensor => {\n      return sensor.components.some(component => component.id === 74);// Fan speed\n    });\n\n    //Silent loading\n    //this.loading = true;\n\n    //For fan speed we need to check data for 72 hours\n    let sensorcomps = [];\n\n    //Create a list of sensors to check\n    this.fanspeedsensors.forEach(sensor => {\n      sensorcomps.push({\"SensorId\" : sensor.id, \"SensorName\": '', \"Component\": 'Fan speed', \"ProviderId\": sensor.provider.id});\n    });\n\n    //Get 72 hours observations from all sensors\n    const last72hobservations = await ObservationsService.aggregeatedobservations(\n      {\n        From: moment().utc().subtract(72,\"hours\").unix(), \n        To: moment().unix(),\n        ProviderId: 2, // NEED TO CHANGE!!\n        AggLevel: 'hourly',\n        Sensors: sensorcomps\n      }\n    );\n\n    //Set status on each sensor\n    let sensorobs;\n    this.fanspeedsensors.forEach(sensor => {\n      //Clear previous status\n      sensor.statustext = [];\n      sensor.statuscolor = [];\n      sensorobs = last72hobservations.filter(o => o.id === sensor.id);\n      sensor =  ObservationStatus.setFanSpeedStatus(sensor, sensorobs);\n    });\n\n    //Create a layer of the disabled sensors\n    var jsondatasource = GeoJSONWrapper.wrapfanspeedsensors(this.fanspeedsensors);\n    MapboxglHelper.addColoredCircleValueSourceAndLayer(\n        this.addSourceAndLayer(jsondatasource, 'fanspeedSensors', DEFAULTLAYERFS, 'none', 'coloredcircle', MapboxglSettings.sensorstatus, ''), //stores in variable and returns the object\n        map\n      );\n\n    //Add filtering options - binding for Layer component\n    this.layers.placementlayers.push({'name': DEFAULTLAYERFS, 'checked': false}); \n\n    this.waitingforfanspeed = false;\n\n  },\n\n  async loadMobileSensors(){\n\n    //Configure js global varibles for mapbox gl js\n    mobileSensors = GeoJSONWrapper.wrapsensors(this.mobileSensors);\n\n    //Add default layers\n    this.layers.placementlayers.push({'name': this.DEFAULTLAYERMS, 'checked': true});\n\n    MapboxglHelper.addCustomSymbolSourceAndLayer(\n      this.addSourceAndLayer(mobileSensors, 'sensorlayerms', this.DEFAULTLAYERMS, 'visible', \n      'customsymbol', MapboxglSettings.sensorstatus,'msmarker'), //stores in variable and returns the object\n      map\n      );\n\n    map.on('click', `${DEFAULTLAYERMS}_layer`, function(e) {\n      var ss =  sensors.find(s => {return s.id === e.features[0].properties.id});\n      selected.sensor = ss;\n      mbfeature.feature = e.features[0];\n    }); \n\n  },\n\n  async loadStaticSensors(){\n\n    //Configure js global varibles for mapbox gl js\n    staticSensors = GeoJSONWrapper.wrapsensors(this.staticSensors);\n\n    //Add default layers\n    this.layers.placementlayers.push({'name': this.DEFAULTLAYERSS, 'checked': true});\n\n    MapboxglHelper.addCustomSymbolSourceAndLayer(\n      this.addSourceAndLayer(staticSensors, 'sensorlayerss', this.DEFAULTLAYERSS, \n      'visible', 'customsymbol', MapboxglSettings.sensorstatus, 'ssmarker'), //stores in variable and returns the object\n      map\n      );\n\n    //Custom event for showing sensor status with measurements for the last 24H, right side on screen \n    map.on('click', `${DEFAULTLAYERSS}_layer`, function(e) {\n      var ss =  sensors.find(s => {return s.id === e.features[0].properties.id});\n      selected.sensor = ss;\n      mbfeature.feature = e.features[0];\n    }); \n\n  },\n \n  loadDisabledSensors: function(){\n\n    this.loading = true;\n\n    //Separate disbaled and enabled sensors\n    this.disabledsensors = this.sensors.filter(function(v, i, a){return !v.enabled});\n    disabledSensors = this.disabledsensors; //variable used for map events, copy of vue data variable\n    this.sensors = this.sensors.filter(function(v, i, a){return v.enabled});\n\n    //Create a layer of the disabled sensors\n    var jsondatasource = GeoJSONWrapper.wrapsensors(this.disabledsensors);\n    //var sourcelayer = \n    MapboxglHelper.addSymbolSourceAndLayer(\n      this.addSourceAndLayer(jsondatasource, 'disabledsensors', DEFAULTLAYERDS, 'none', 'symbol','',''), //stores in variable and returns the object\n      map\n      );\n\n    //Add filtering options - binding for Layer component\n    this.layers.measurementlayers.push({'name': DEFAULTLAYERDS, 'checked': false}); \n\n    this.loading = false;\n\n  },\n\n  async addStatus(){\n    \n    let obs = await ObservationsService.observationsasync();\n    let sensorobs = obs.filter((e, i) => obs.findIndex(a => a[\"id\"] === e[\"id\"]));\n\n    this.sensors.forEach(sensor => {\n      sensor.statustext = [];\n      sensor =  ObservationStatus.setStatus(sensor, obs, sensorobs);\n\n    });\n  },\n  //Store sources and layers that are added on the map in a variable for map to use in events\n  //This will be used for recreation of sources and layers when the style is changed\n  addSourceAndLayer: function(jsondata, sourcename, layername, visibility, type, colorcodes, icon){\n    var sourcelayer = {\n      jsondata: jsondata,\n      sourcename: sourcename,\n      layername: layername,\n      visibility: visibility,\n      type: type,\n      colorcodes: colorcodes,\n      icon: icon\n    }\n    sourceandlayers.push(sourcelayer); \n    return sourcelayer;\n  },\n\n  map: function (layers) {\n\n    //set mapbox keys and init\n    mapboxgl.accessToken = MapboxglSettings.accessToken.key; \n    map = new mapboxgl.Map(MapboxglSettings.map);\n\n    // Initialize the search\n    const geocoder = new MapboxGeocoder({\n        \n        accessToken: mapboxgl.accessToken, // Set the access token\n        mapboxgl: mapboxgl, // Set the mapbox-gl instance\n        marker: false, // Do not use the default marker style\n        placeholder: this.$t('searchplace')\n      });\n\n    document.getElementById('geocoder').appendChild(geocoder.onAdd(map));\n\n    //Changes style - event\n    const layerList = document.getElementById('menu');\n    const inputs = layerList.getElementsByTagName('input');\n    for (const input of inputs) {\n        input.onclick = (layer) => {\n          const layerId = layer.target.id;\n          map.setStyle('mapbox://styles/mapbox/' + layerId + '?fresh=true');\n        };\n    } \n\n    //Need to recreate all sources and layers when new style is added\n    map.on('style.load', function () {\n      MapboxglHelper.recreatesourceandlayer(sourceandlayers, map);\n    });\n\n    map.on('styleimagemissing', (e) => {\n        MapboxglHelper.loadmissingimages(e, map);\n    });\n\n  },\n  //Event emitted from Layer component\n  async onLayerSelect(e) { \n    MapboxglSettings.onLayerSelect(e, map);\n    //Update list of source and layers\n    var layer = sourceandlayers.find((sourceandlayer) => sourceandlayer.layername==e.name);\n    layer.visibility = e.checked ? 'visible' : 'none';\n  },\n\n  //Event emitted from Layer component\n  async onLayerRemove(e) { \n    //remove layer, source and from the layout list\n    MapboxglSettings.onLayerRemove(`${e.name}_layer`, `${e.name}_source`, map); \n\n    //Only maplayers can be removed\n    if(this.layers.maplayers.find(function(v, i, a){return v.name == e.name}) !== null){\n      sourceandlayers = sourceandlayers.filter(function(v, i, a){return v.layername !== e.name});\n      this.layers.maplayers = this.layers.maplayers.filter(function(v, i, a){return v.name !== e.name});\n    } \n  },\n\n},\ncomputed:{\n  fromObservable: () => state.fromObservable,\n  MapTime: function(){\n        if(this.currentAnimTime){\n          return moment(this.currentAnimTime).format(\"DD MM YYYY HH:mm\");  \n        }\n        return '';\n    },\n  selectedSensor(){\n     return selected.sensor;\n  },\n  feature(){\n     return mbfeature.feature;\n  },\n  staticSensors(){\n    return this.sensors.filter(sensor=> {return sensor.staticsensor});\n  },\n  mobileSensors(){\n    return this.sensors.filter(sensor=> {return !sensor.staticsensor});\n  }\n}\n\n};\n</script>\n\n<style lang=\"postcss\">\n\n/* purgecss start ignore */\n.geocoder {\n  position: absolute;\n  z-index: 1;\n  width: 50%;\n  left: 50%;\n  margin-left: -25%;\n  top: 10px;\n}\n.mapboxgl-ctrl-geocoder {\n  min-width: 100%;\n}\n\n#map {\n  width: 65%;\n  height: 70%;\n  position: absolute;\n  \n}\n.mappopups {\n  width: 800px;\n}\n.mapboxgl-popup mapboxgl-popup-anchor-bottom{\n  max-width: 500px;\n}\n.timedisplay\n{\n  height: 30px;\n  width: 175px;\n  right: 0;\n  left: 0;\n  margin-right: 60%;\n  margin-left: auto;\n  margin-top: 10px;\n  position: absolute;\n}\n\n/* purgecss end ignore */\n#loader {\n  position: absolute;\n  left: 20%;\n  top: 26%;\n  z-index: 1;\n  width: 50px;\n  height: 50px;\n  margin: -76px 0 0 -76px;\n  border: 5px solid #d7d2d2;\n  border-radius: 50%;\n  border-top: 5px solid #3498db;\n  -webkit-animation: spin 2s linear infinite;\n  animation: spin 2s linear infinite;\n}\n\n@-webkit-keyframes spin {\n  0% { -webkit-transform: rotate(0deg); }\n  100% { -webkit-transform: rotate(360deg); }\n}\n\n@keyframes spin {\n  0% { transform: rotate(0deg); }\n  100% { transform: rotate(360deg); }\n}\n\n/* Add animation to \"page content\" */\n.animate-bottom {\n  position: relative;\n  -webkit-animation-name: animatebottom;\n  -webkit-animation-duration: 1s;\n  animation-name: animatebottom;\n  animation-duration: 1s\n}\n\n@-webkit-keyframes animatebottom {\n  from { bottom:-100px; opacity:0 } \n  to { bottom:0px; opacity:1 }\n}\n\n@keyframes animatebottom { \n  from{ bottom:-100px; opacity:0 } \n  to{ bottom:0; opacity:1 }\n}\n\n</style>\n\n<style lang=\"postcss\">\n@import 'https://api.mapbox.com/mapbox-gl-js/v1.8.1/mapbox-gl.css';\n</style>","import mod from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./SensorStatusMenu.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./SensorStatusMenu.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./SensorStatusMenu.vue?vue&type=template&id=1a27af6c&\"\nimport script from \"./SensorStatusMenu.vue?vue&type=script&lang=js&\"\nexport * from \"./SensorStatusMenu.vue?vue&type=script&lang=js&\"\nimport style0 from \"./SensorStatusMenu.vue?vue&type=style&index=0&lang=postcss&\"\nimport style1 from \"./SensorStatusMenu.vue?vue&type=style&index=1&lang=postcss&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","export * from \"-!../../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--7-oneOf-1-0!../../../../node_modules/css-loader/index.js??ref--7-oneOf-1-1!../../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../node_modules/postcss-loader/src/index.js??ref--7-oneOf-1-2!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./SensorStatusMenu.vue?vue&type=style&index=0&lang=postcss&\""],"sourceRoot":""}