{"version":3,"sources":["webpack:///./node_modules/core-js/internals/engine-ff-version.js","webpack:///./node_modules/core-js/modules/es.array.sort.js","webpack:///./node_modules/core-js/internals/engine-webkit-version.js","webpack:///./node_modules/@babel/runtime/helpers/esm/objectSpread2.js","webpack:///./src/client/ClusterSpotsModal.vue?ae5b","webpack:///./src/client/ClusterSpotsModal.vue","webpack:///src/client/ClusterSpotsModal.vue","webpack:///./src/client/ClusterSpotsModal.vue?ab21","webpack:///./src/client/ClusterSpotsModal.vue?e2ad","webpack:///./src/client/BathymetryMap.vue?516c","webpack:///./node_modules/@babel/runtime/helpers/esm/defineProperty.js","webpack:///./node_modules/core-js/modules/es.object.keys.js","webpack:///./node_modules/core-js/internals/engine-is-ie-or-edge.js","webpack:///./node_modules/core-js/modules/es.object.get-own-property-descriptors.js","webpack:///./node_modules/core-js/modules/es.object.get-own-property-descriptor.js","webpack:///./src/client/BathymetryMap.vue","webpack:///src/client/BathymetryMap.vue","webpack:///./src/client/BathymetryMap.vue?9f55","webpack:///./src/client/BathymetryMap.vue?ec5a"],"names":["userAgent","firefox","match","module","exports","$","uncurryThis","aCallable","toObject","lengthOfArrayLike","deletePropertyOrThrow","toString","fails","internalSort","arrayMethodIsStrict","FF","IE_OR_EDGE","V8","WEBKIT","test","un$Sort","sort","push","FAILS_ON_UNDEFINED","undefined","FAILS_ON_NULL","STRICT_METHOD","STABLE_SORT","code","chr","value","index","result","String","fromCharCode","k","v","a","b","length","charAt","FORCED","getSortCompare","comparefn","x","y","target","proto","forced","array","this","itemsLength","items","arrayLength","webkit","ownKeys","object","enumerableOnly","keys","Object","getOwnPropertySymbols","symbols","filter","sym","getOwnPropertyDescriptor","enumerable","apply","_objectSpread2","i","arguments","source","forEach","key","defineProperty","getOwnPropertyDescriptors","defineProperties","render","_vm","_c","_self","staticClass","attrs","_v","_s","$t","spotsData","_l","spot","id","on","$event","openDetils","properties","spot_id","title","formatDateMM","spot_date","spotted_username","staticRenderFns","toast","position","Vue","name","props","components","mixins","data","isDisabled","validations","methods","console","date","computed","created","beforeMount","mounted","beforeDestroy","component","_defineProperty","obj","configurable","writable","nativeKeys","FAILS_ON_PRIMITIVES","stat","it","UA","DESCRIPTORS","toIndexedObject","getOwnPropertyDescriptorModule","createProperty","sham","descriptor","O","f","nativeGetOwnPropertyDescriptor","openSiderBar","mapLoaded","openFilters","_e","_m","ref","totalSpots","openAdminSpotDetail","applyFilter","getClientAdminSpots","openSpotDetail","staticStyle","version_id","accessToken","map","spotData","features","mapFeatures","spotForm","requireLatLong","spot_type_id","location_id","detail","latitude","longitude","questions","client_url","client_id","adminMapStyle","default_map","default_map_zoom","default_latitude","default_longitude","appImage","spotDetailImages","spotDetail","showBackButton","markerColor","routeTracks","ClusterSpotsModal","FiltersModal","TotalCategoryCount","SpotDetailsModal","API","type","description","spotted_by","iconUrl","geometry","coordinates","initMap","lngLat","mapboxgl","container","style","center","zoom","maxZoom","attributionControl","draggable","setLngLat","addTo","url","cluster","clusterMaxZoom","clusterRadius","paint","layout","trackCoordinates","markerElement","coord","setPopup","offset","setHTML","categoryColors","feature","layers","clusterId","clusterSource","logo","event","params","date_from","date_to","categories","locations","surveys","spotTypes","selectedQuestions","countRangeFilter","countRangeValues","openClusterSpotDetail","aFeatures","formatDate","getAppSettings"],"mappings":"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EAS,oBAJA,WAIA,WACA,GACAkB,yDAEAgB,2BACAzE,GACA,YACA,sBACA,2BAEAA,4BACA,sEACA,OACA,OACA0E,eACAxF,YACAJ,QACAM,sCAEAD,kBACAwF,0CACAC,iDACArF,4DACAD,oCACAuF,wDACAV,uGAEAW,UACAJ,aACAK,uCAGA,0BAiBA,uDAGA,iBAIAC,QA5DA,SA4DAC,GAAA,WACA,kBACAC,iCACA,sBACAC,yBACAC,2CACAC,SACAC,2BACAC,WACAC,wBAIA,6BACA,oBACA,4BACA,mBACA,4BACAC,eACAC,UAAAT,GAAAU,MAAA,UAEA,qCACA,oBAEA,6CACAZ,wBACAA,yHAEA,sCACA,2BACAA,mFAMA,iBAGA,iBAGA,+BAGA,SACA,yBACA,KACA,YACA,YACA,uCAGA,wBAIA,8BAEAL,cACAkB,6CAKA,gBACA,iBACA,YACA,oBACA,uBACA,UACA,OAYA,cACA,cACA,2BACA,oBACA,IACA,UACA,IACA,aAIA,aAIA,+BACAlB,eACA1E,aACA6F,WACAC,kBACAC,mBAIA,gBACAjH,cACA4F,cACA9G,qBACAR,6BACA4I,OACA,gBACA,OACA,sBACA,UACA,IACA,UACA,IACA,WAEA,iBACA,OACA,sBACA,GACA,IACA,GACA,IACA,OAMA,gBACAlH,mBACA4F,cACA9G,qBACAR,6BACA6I,QACA,yCACA,4DACA,eACA,yBAEAD,OACA,0BAKA,OACAvC,yDA8DA,GA5DAgB,qBACAzE,GACA,YAEA,2DAGA,+BACA0E,eACA1E,MACA0E,yBACA5B,WACA4B,eACAI,UACAJ,kBACAK,eAEA7F,mBAMA,gBACAJ,WACA4F,YACA9G,qBACAqI,QACA,mBACA,qBAEAD,OACA,oBACA,eACA,0BAKAE,yBACA,oCACAC,kCACAA,qBACAA,sBACAA,2BACAA,iCAGA,kBACAT,UAAAU,GACAC,SAAA,eAAAC,YACAC,QADA,mBACAlL,IADA,qBACA+K,KADA,kBACAA,KADA,UAEAT,MAAA,aAGA,YACAvF,mDAIA,oCAEA,gBACA,YACA,cACA,aAEA,wBACA,gBAGA,SAGA,mCACAoG,wCAIA,gBACA1H,uBACA4F,cACA9G,qBACAR,mCACA6I,QACA,cACA,0BACA,+JACA,OAEA,cACA,iBACA,uBACA,sBACA,OACA,OACA,OACA,QACA,WAIAD,OACA,cACA,MACA,cAEA,mBACA,mBACA,MACA,mBAEA,uBAKA,uCACA,wCACAS,GADA,IAEAvH,4CACAuH,cADA,IAEA,sBACA,kCAKA,wCACA/B,yBACA5B,kBAKA,gBACA,YACA,cACA,aAEA,2BAIA,gBACAhE,uBACA4F,cACA9G,qBACAR,mCAUA6I,QACA,cACA,QACA,kBACA,yDACA,uDACA,sBACA,yBACA,OAEA,iBAEA,uBACA,sBACA,OACA,OACA,OACA,QACA,aAOA,yCACA,2CACAS,sBAEA,6BACA,kBACA,QACA,uDACAC,GACA,cACA,GACA,cACAtB,iCACAC,gBAIA,CACA,2CACA,iCAEAsB,wCACA,cACA,gCACA,4EAEA,4CAiCA,kDACA,iDAEA,GADA,+BACA,6BACA,iCACA,iCACA,oCACA,0CACA,mCACA,qCACA,sCACA7B,iCAGA,iDAGA,6CACA,4CAEA,6CACA,qCAGA,kBAKA,oDACA,GACA8B,YAGAxE,oBA3eA,SA2eAvD,EAAAgI,GACA,kDAEA9E,YA9eA,WA+eA,yDAGAM,YAlfA,SAkfAyE,GAAA,WACA,GACA5H,iBACA6H,qBACAC,iBACA1D,sBACA2D,wBACAC,sBACAC,kBACAC,sBACAC,sCACA7D,wDACA8D,oCACAC,qCAEApH,6BACAqE,iCACA,YACA,mBACA,8BACA,oBACA,iBACA,2BACA,sDACA,4CACA,2CACA,mDACA,sBACAzE,4BACAI,sBACA,sEACA,OACA,OACAsE,eACAxF,YACAJ,QACAM,sCAEAD,kBACAwF,0CACAC,sEACArF,sFACAD,oCACAuF,wDACAV,uGAEAW,UACAJ,aACAK,uCAGA,0BAGA,SAEA,mCAEAyB,wCAGA,uCACA,wCACAC,GADA,IAEAvH,4CACAuH,cADA,IAEA,sBACA,kCAKA,wCACA/B,yBACA5B,aAaA1C,0CACA,iBACA,4BACA,4CACA,+CAGA,YACAA,eACA,4CACA,+CAIAqH,sBAvlBA,SAulBAC,GACA,+CAEAC,WA1lBA,SA0lBAtH,GACA,kDAGAuH,eA9lBA,WA8lBA,WACA,GACAnE,yDAEAgB,sBACAzE,GACA,YACA,0BACAI,8CACA,4CAGA,2CACA,6DACA,qEAGA,mBCjuBuV,I,wBCQnVO,EAAY,eACd,EACAzC,EACAsB,GACA,EACA,KACA,WACA,MAIa,aAAAmB,E","file":"js/chunk-3c24bd6f.979fc67a.js","sourcesContent":["var userAgent = require('../internals/engine-user-agent');\n\nvar firefox = userAgent.match(/firefox\\/(\\d+)/i);\n\nmodule.exports = !!firefox && +firefox[1];\n","'use strict';\nvar $ = require('../internals/export');\nvar uncurryThis = require('../internals/function-uncurry-this');\nvar aCallable = require('../internals/a-callable');\nvar toObject = require('../internals/to-object');\nvar lengthOfArrayLike = require('../internals/length-of-array-like');\nvar deletePropertyOrThrow = require('../internals/delete-property-or-throw');\nvar toString = require('../internals/to-string');\nvar fails = require('../internals/fails');\nvar internalSort = require('../internals/array-sort');\nvar arrayMethodIsStrict = require('../internals/array-method-is-strict');\nvar FF = require('../internals/engine-ff-version');\nvar IE_OR_EDGE = require('../internals/engine-is-ie-or-edge');\nvar V8 = require('../internals/engine-v8-version');\nvar WEBKIT = require('../internals/engine-webkit-version');\n\nvar test = [];\nvar un$Sort = uncurryThis(test.sort);\nvar push = uncurryThis(test.push);\n\n// IE8-\nvar FAILS_ON_UNDEFINED = fails(function () {\n  test.sort(undefined);\n});\n// V8 bug\nvar FAILS_ON_NULL = fails(function () {\n  test.sort(null);\n});\n// Old WebKit\nvar STRICT_METHOD = arrayMethodIsStrict('sort');\n\nvar STABLE_SORT = !fails(function () {\n  // feature detection can be too slow, so check engines versions\n  if (V8) return V8 < 70;\n  if (FF && FF > 3) return;\n  if (IE_OR_EDGE) return true;\n  if (WEBKIT) return WEBKIT < 603;\n\n  var result = '';\n  var code, chr, value, index;\n\n  // generate an array with more 512 elements (Chakra and old V8 fails only in this case)\n  for (code = 65; code < 76; code++) {\n    chr = String.fromCharCode(code);\n\n    switch (code) {\n      case 66: case 69: case 70: case 72: value = 3; break;\n      case 68: case 71: value = 4; break;\n      default: value = 2;\n    }\n\n    for (index = 0; index < 47; index++) {\n      test.push({ k: chr + index, v: value });\n    }\n  }\n\n  test.sort(function (a, b) { return b.v - a.v; });\n\n  for (index = 0; index < test.length; index++) {\n    chr = test[index].k.charAt(0);\n    if (result.charAt(result.length - 1) !== chr) result += chr;\n  }\n\n  return result !== 'DGBEFHACIJK';\n});\n\nvar FORCED = FAILS_ON_UNDEFINED || !FAILS_ON_NULL || !STRICT_METHOD || !STABLE_SORT;\n\nvar getSortCompare = function (comparefn) {\n  return function (x, y) {\n    if (y === undefined) return -1;\n    if (x === undefined) return 1;\n    if (comparefn !== undefined) return +comparefn(x, y) || 0;\n    return toString(x) > toString(y) ? 1 : -1;\n  };\n};\n\n// `Array.prototype.sort` method\n// https://tc39.es/ecma262/#sec-array.prototype.sort\n$({ target: 'Array', proto: true, forced: FORCED }, {\n  sort: function sort(comparefn) {\n    if (comparefn !== undefined) aCallable(comparefn);\n\n    var array = toObject(this);\n\n    if (STABLE_SORT) return comparefn === undefined ? un$Sort(array) : un$Sort(array, comparefn);\n\n    var items = [];\n    var arrayLength = lengthOfArrayLike(array);\n    var itemsLength, index;\n\n    for (index = 0; index < arrayLength; index++) {\n      if (index in array) push(items, array[index]);\n    }\n\n    internalSort(items, getSortCompare(comparefn));\n\n    itemsLength = items.length;\n    index = 0;\n\n    while (index < itemsLength) array[index] = items[index++];\n    while (index < arrayLength) deletePropertyOrThrow(array, index++);\n\n    return array;\n  }\n});\n","var userAgent = require('../internals/engine-user-agent');\n\nvar webkit = userAgent.match(/AppleWebKit\\/(\\d+)\\./);\n\nmodule.exports = !!webkit && +webkit[1];\n","import defineProperty from \"./defineProperty.js\";\n\nfunction ownKeys(object, enumerableOnly) {\n  var keys = Object.keys(object);\n\n  if (Object.getOwnPropertySymbols) {\n    var symbols = Object.getOwnPropertySymbols(object);\n    enumerableOnly && (symbols = symbols.filter(function (sym) {\n      return Object.getOwnPropertyDescriptor(object, sym).enumerable;\n    })), keys.push.apply(keys, symbols);\n  }\n\n  return keys;\n}\n\nexport default function _objectSpread2(target) {\n  for (var i = 1; i < arguments.length; i++) {\n    var source = null != arguments[i] ? arguments[i] : {};\n    i % 2 ? ownKeys(Object(source), !0).forEach(function (key) {\n      defineProperty(target, key, source[key]);\n    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) {\n      Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));\n    });\n  }\n\n  return target;\n}","export * from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--9-oneOf-1-0!../../node_modules/css-loader/dist/cjs.js??ref--9-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--9-oneOf-1-2!../../node_modules/sass-loader/dist/cjs.js??ref--9-oneOf-1-3!../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./ClusterSpotsModal.vue?vue&type=style&index=0&id=808e0828&prod&scoped=true&lang=scss&\"","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('section',[_c('vue-snotify'),_c('div',{staticClass:\"row p-3 d-block\"},[_c('b-container',{attrs:{\"fluid\":\"\"}},[_c('div',[_c('h5',[_vm._v(_vm._s(_vm.$t('Following are spots in this cluster'))+\": \")])]),_c('div',[_c('h5',[_vm._v(_vm._s(_vm.$t('total-spots'))+\": \"+_vm._s(_vm.spotsData.length))])]),_vm._l((_vm.spotsData),function(spot){return _c('div',{key:spot.id,staticClass:\"full-width mt-3\"},[_c('b-card',[_c('b-card-text',[_c('div',{staticClass:\"row w-100\"},[_c('div',{staticClass:\"col-md-6 col-sm-6 col-xs-6\"},[_vm._v(\" \"+_vm._s(_vm.$t('spot-id'))+\" \")]),_c('div',{staticClass:\"col-md-6 col-sm-6 col-xs-6\"},[_c('a',{attrs:{\"href\":\"javascript:void(0)\"},on:{\"click\":function($event){return _vm.openDetils(spot.properties.id)}}},[_vm._v(\" \"+_vm._s(spot.properties.spot_id)+\" \")])])]),_c('div',{staticClass:\"row w-100\"},[_c('div',{staticClass:\"col-md-6 col-sm-6 col-xs-6\"},[_vm._v(\" \"+_vm._s(_vm.$t('spot'))+\" \")]),_c('div',{staticClass:\"col-md-6 col-sm-6 col-xs-6\"},[_vm._v(\" \"+_vm._s(spot.properties.title)+\" \")])]),_c('div',{staticClass:\"row w-100\"},[_c('div',{staticClass:\"col-md-6 col-sm-6 col-xs-6\"},[_vm._v(\" \"+_vm._s(_vm.$t('spot-date'))+\" \")]),_c('div',{staticClass:\"col-md-6 col-sm-6 col-xs-6\"},[_vm._v(\" \"+_vm._s(_vm.formatDateMM(spot.properties.spot_date))+\" \")])]),_c('div',{staticClass:\"row w-100\"},[_c('div',{staticClass:\"col-md-6 col-sm-6 col-xs-6\"},[_vm._v(\" \"+_vm._s(_vm.$t('spotted-by'))+\" \")]),_c('div',{staticClass:\"col-md-6 col-sm-6 col-xs-6\"},[_vm._v(\" \"+_vm._s(spot.properties.spotted_username)+\" \")])])])],1)],1)})],2)],1)],1)\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\r\n    <section>\r\n        <vue-snotify></vue-snotify>\r\n        <div class=\"row p-3 d-block\">\r\n            <b-container fluid>\r\n                <div>\r\n                    <h5>{{ $t('Following are spots in this cluster') }}: </h5>\r\n                </div>\r\n                <div>\r\n                    <h5>{{ $t('total-spots') }}: {{ spotsData.length }}</h5>\r\n                </div>\r\n                <div class=\"full-width mt-3\" v-for=\"spot in spotsData\" :key=\"spot.id\" >\r\n                    <!-- <b-card :img-src=\"spot.properties.iconUrl\" img-height=\"150\" img-width=\"200\" img-alt=\"Card image\" img-left class=\"mb-3\"> -->\r\n                        <b-card>\r\n                            <b-card-text>\r\n                                <div class=\"row w-100\">\r\n                                <div class=\"col-md-6 col-sm-6 col-xs-6\">\r\n                                    {{ $t('spot-id') }}\r\n                                    </div>\r\n                                    <div class=\"col-md-6 col-sm-6 col-xs-6\" >\r\n                                        <a href=\"javascript:void(0)\" @click=\"openDetils(spot.properties.id)\"> {{ spot.properties.spot_id }} </a>\r\n                                       \r\n                                    </div>\r\n                                </div>\r\n                                <div class=\"row w-100\">\r\n                                    <div class=\"col-md-6 col-sm-6 col-xs-6\">\r\n                                        {{ $t('spot') }}\r\n                                    </div>\r\n                                    <div class=\"col-md-6 col-sm-6 col-xs-6\">\r\n                                        {{ spot.properties.title }}\r\n                                    </div>\r\n                                </div>\r\n                                <div class=\"row w-100\">\r\n                                    <div class=\"col-md-6 col-sm-6 col-xs-6\">\r\n                                        {{ $t('spot-date') }}\r\n                                    </div>\r\n                                    <div class=\"col-md-6 col-sm-6 col-xs-6\">\r\n                                        {{ formatDateMM(spot.properties.spot_date) }}\r\n                                    </div>\r\n                                </div>\r\n                                <div class=\"row w-100\">\r\n                                    <div class=\"col-md-6 col-sm-6 col-xs-6\">\r\n                                        {{ $t('spotted-by') }}\r\n                                    </div>\r\n                                    <div class=\"col-md-6 col-sm-6 col-xs-6\">\r\n                                        {{ spot.properties.spotted_username }}\r\n                                    </div>\r\n                                </div>\r\n                                <!-- <div class=\"row w-100\">\r\n                                    <div class=\"col-md-6 col-sm-6 col-xs-6\">\r\n                                        Spotter Username:\r\n                                    </div>\r\n                                    <div class=\"col-md-6 col-sm-6 col-xs-6\"> \r\n                                        {{ spot.properties.spotted_username }}\r\n                                    </div>\r\n                                </div> -->\r\n                            </b-card-text>\r\n                    </b-card>\r\n                </div>\r\n            </b-container>\r\n        </div>\r\n    </section>\r\n</template>\r\n\r\n<script>\r\n    import Vue from \"vue\";\r\n    import\r\n    API from \"@/api\";\r\n    import Snotify, {\r\n        SnotifyPosition\r\n    } from \"vue-snotify\";\r\n    import {\r\n        validationMixin\r\n    } from \"vuelidate\";\r\n    import {\r\n        required,\r\n        minLength,\r\n        email,\r\n        requiredIf,\r\n        sameAs\r\n    } from \"vuelidate/lib/validators\";\r\n    import moment from 'moment';\r\n    \r\n    const options = {\r\n        toast: {\r\n            position: SnotifyPosition.rightTop\r\n        }\r\n    };\r\n    Vue.use(Snotify, options);\r\n    \r\n    export default {\r\n        name: \"openClusterSpotDetail\",\r\n        props: [\"spotsData\"],\r\n        components: {},\r\n        mixins: [validationMixin],\r\n        data() {\r\n            return {\r\n                isDisabled: false,\r\n                //  form: {\r\n                //   subscriptions:{\r\n                //     name: '',\r\n                //     description: '',\r\n                //   },\r\n                //   principals: [],\r\n                //   name: \"\",\r\n                //   stream_desc: \"\",\r\n                // },\r\n            };\r\n        },\r\n        validations: {\r\n            // form: {\r\n            //   subscriptions: {\r\n            //     name: {\r\n            //       required\r\n            //     },\r\n            //     description: {\r\n            //       required\r\n            //     }\r\n            //   },\r\n            // }\r\n        },\r\n        methods: {\r\n            openDetils(id) {\r\n                console.log('open,' , id);\r\n                this.$emit('openParentSpot', id, true);\r\n\r\n            },\r\n            formatDateMM(date) {\r\n                // return moment(new Date(date)).format('MM-DD-YYYY')\r\n                return moment(date, \"MM-DD-YYYY HH:mm:ss A\").format(\"MM-DD-YYYY\")\r\n            },\r\n        },\r\n        computed: {},\r\n        async created() {},\r\n        async beforeMount() {},\r\n        async mounted() {\r\n            console.log('spotsData in modal', this.spotsData);\r\n        },\r\n        beforeDestroy() {}\r\n    };\r\n</script>\r\n\r\n<style scoped lang=\"scss\">\r\n    .full-width {\r\n        width: 100% !important;\r\n    }\r\n    .full-width .row div:nth-child(2) {\r\n        text-align: right;\r\n    }\r\n    .full-width .row div {\r\n        padding: 0;\r\n    }\r\n    .full-width .row {\r\n        margin: 0;\r\n        flex-wrap: inherit;\r\n    }\r\n</style>","import mod from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./ClusterSpotsModal.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./ClusterSpotsModal.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./ClusterSpotsModal.vue?vue&type=template&id=808e0828&scoped=true&\"\nimport script from \"./ClusterSpotsModal.vue?vue&type=script&lang=js&\"\nexport * from \"./ClusterSpotsModal.vue?vue&type=script&lang=js&\"\nimport style0 from \"./ClusterSpotsModal.vue?vue&type=style&index=0&id=808e0828&prod&scoped=true&lang=scss&\"\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  \"808e0828\",\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/dist/cjs.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--1-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./BathymetryMap.vue?vue&type=style&index=0&id=527a94b3&prod&scoped=true&lang=css&\"","export default function _defineProperty(obj, key, value) {\n  if (key in obj) {\n    Object.defineProperty(obj, key, {\n      value: value,\n      enumerable: true,\n      configurable: true,\n      writable: true\n    });\n  } else {\n    obj[key] = value;\n  }\n\n  return obj;\n}","var $ = require('../internals/export');\nvar toObject = require('../internals/to-object');\nvar nativeKeys = require('../internals/object-keys');\nvar fails = require('../internals/fails');\n\nvar FAILS_ON_PRIMITIVES = fails(function () { nativeKeys(1); });\n\n// `Object.keys` method\n// https://tc39.es/ecma262/#sec-object.keys\n$({ target: 'Object', stat: true, forced: FAILS_ON_PRIMITIVES }, {\n  keys: function keys(it) {\n    return nativeKeys(toObject(it));\n  }\n});\n","var UA = require('../internals/engine-user-agent');\n\nmodule.exports = /MSIE|Trident/.test(UA);\n","var $ = require('../internals/export');\nvar DESCRIPTORS = require('../internals/descriptors');\nvar ownKeys = require('../internals/own-keys');\nvar toIndexedObject = require('../internals/to-indexed-object');\nvar getOwnPropertyDescriptorModule = require('../internals/object-get-own-property-descriptor');\nvar createProperty = require('../internals/create-property');\n\n// `Object.getOwnPropertyDescriptors` method\n// https://tc39.es/ecma262/#sec-object.getownpropertydescriptors\n$({ target: 'Object', stat: true, sham: !DESCRIPTORS }, {\n  getOwnPropertyDescriptors: function getOwnPropertyDescriptors(object) {\n    var O = toIndexedObject(object);\n    var getOwnPropertyDescriptor = getOwnPropertyDescriptorModule.f;\n    var keys = ownKeys(O);\n    var result = {};\n    var index = 0;\n    var key, descriptor;\n    while (keys.length > index) {\n      descriptor = getOwnPropertyDescriptor(O, key = keys[index++]);\n      if (descriptor !== undefined) createProperty(result, key, descriptor);\n    }\n    return result;\n  }\n});\n","var $ = require('../internals/export');\nvar fails = require('../internals/fails');\nvar toIndexedObject = require('../internals/to-indexed-object');\nvar nativeGetOwnPropertyDescriptor = require('../internals/object-get-own-property-descriptor').f;\nvar DESCRIPTORS = require('../internals/descriptors');\n\nvar FAILS_ON_PRIMITIVES = fails(function () { nativeGetOwnPropertyDescriptor(1); });\nvar FORCED = !DESCRIPTORS || FAILS_ON_PRIMITIVES;\n\n// `Object.getOwnPropertyDescriptor` method\n// https://tc39.es/ecma262/#sec-object.getownpropertydescriptor\n$({ target: 'Object', stat: true, forced: FORCED, sham: !DESCRIPTORS }, {\n  getOwnPropertyDescriptor: function getOwnPropertyDescriptor(it, key) {\n    return nativeGetOwnPropertyDescriptor(toIndexedObject(it), key);\n  }\n});\n","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('div',{staticClass:\"google-map new-updated-design google-map-design\"},[_c('vue-snotify'),_c('div',{staticClass:\"row\"},[_c('div',{staticClass:\"col-md-12 col-lg-12\"},[_c('div',{staticClass:\"card\"},[_c('div',{staticClass:\"card-header\"},[_c('h4',{staticClass:\"card-title\"},[_vm._v(_vm._s(_vm.$t('bathymetry-map')))])]),_c('div',{staticClass:\"card-body new-card-body rl-body\"},[_c('div',{staticClass:\"al-btn new-al-btn\"},[_c('b-button',{staticClass:\"ml-5 variant-orange\",attrs:{\"size\":\"sm\"},on:{\"click\":_vm.openSiderBar}},[_vm._v(_vm._s(_vm.$t('total-category-counts')))]),(_vm.mapLoaded)?_c('b-button',{staticClass:\"ml-2 variant-orange\",attrs:{\"size\":\"sm\"},on:{\"click\":_vm.openFilters}},[_vm._v(_vm._s(_vm.$t('filters-btn')))]):_vm._e()],1),_c('div',{staticClass:\"google-map new-updated-design\"},[_vm._m(0),_c('div',{staticClass:\"sidebar-counter\"},[_c('TotalCategoryCount',{ref:\"sidebar\",attrs:{\"totalSpots\":_vm.totalSpots,\"user_type\":\"admin\"}})],1)])])])])]),_c('b-modal',{attrs:{\"id\":\"modal-clusters\",\"title\":_vm.$t('cluster-spots'),\"scrollable\":\"\",\"size\":\"md\",\"hide-footer\":true}},[_c('ClusterSpotsModal',{attrs:{\"spotsData\":_vm.spotsData},on:{\"openParentSpot\":_vm.openAdminSpotDetail}})],1),_c('FiltersModal',{ref:\"filterComponent\",attrs:{\"user_type\":\"admin\"},on:{\"applyFilter\":_vm.applyFilter,\"resetMap\":_vm.getClientAdminSpots}}),_c('SpotDetailsModal',{ref:\"spotDetails\",on:{\"openSpotDetail\":_vm.openSpotDetail}})],1)\n}\nvar staticRenderFns = [function (){var _vm=this,_c=_vm._self._c;return _c('div',{staticClass:\"map-container\",attrs:{\"id\":\"mapContainer\"}},[_c('div',{staticStyle:{\"display\":\"none\"},attrs:{\"id\":\"coordinates\"}})])\n}]\n\nexport { render, staticRenderFns }","<template>\r\n    <div class=\"google-map new-updated-design google-map-design\">\r\n        <vue-snotify></vue-snotify>\r\n        <div class=\"row\">\r\n    \r\n            <div class=\"col-md-12 col-lg-12\">\r\n                <div class=\"card\">\r\n                    <div class=\"card-header\">\r\n                        <h4 class=\"card-title\">{{ $t('bathymetry-map') }}</h4>\r\n                    </div>\r\n                    \r\n                    <div class=\"card-body new-card-body rl-body\">\r\n                        <div class=\"al-btn new-al-btn\"> \r\n                            <b-button class=\"ml-5 variant-orange\" size=\"sm\" @click=\"openSiderBar\">{{ $t('total-category-counts') }}</b-button>\r\n                            <b-button v-if=\"mapLoaded\" class=\"ml-2 variant-orange\" size=\"sm\" @click=\"openFilters\">{{ $t('filters-btn') }}</b-button>\r\n                        </div>\r\n                        <div class=\"google-map new-updated-design\">\r\n                            \r\n                            <div class=\"map-container\" id=\"mapContainer\">\r\n                            <!--    <button v-if=\"mapLoaded\" class=\"filter-group\" variant=\"info\" size=\"sm\" @click=\"openFilters\">{{ $t('filters-btn') }}</button> -->\r\n                                <div style=\"display: none;\" id=\"coordinates\">\r\n                                </div>    \r\n                            </div>\r\n                            <div class=\"sidebar-counter\">\r\n                                <TotalCategoryCount  ref=\"sidebar\" :totalSpots=\"totalSpots\" user_type=\"admin\"/>\r\n                            </div>\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </div>\r\n        <b-modal id=\"modal-clusters\" :title=\"$t('cluster-spots')\" scrollable size=\"md\" :hide-footer=\"true\">\r\n            <ClusterSpotsModal :spotsData=\"spotsData\" @openParentSpot=\"openAdminSpotDetail\"></ClusterSpotsModal>\r\n        </b-modal>\r\n        <FiltersModal @applyFilter=\"applyFilter\" @resetMap=\"getClientAdminSpots\" ref=\"filterComponent\" user_type=\"admin\"></FiltersModal>\r\n        <SpotDetailsModal @openSpotDetail=\"openSpotDetail\" ref=\"spotDetails\"></SpotDetailsModal>\r\n    </div>\r\n</template>\r\n\r\n<script>\r\n    import Vue from \"vue\";\r\n    import mapboxgl from \"mapbox-gl\";\r\n    import Snotify, {\r\n        SnotifyPosition\r\n    } from 'vue-snotify'\r\n    import API from '@/api';\r\n    import moment from 'moment'\r\n    import FiltersModal from \"../citizen/FiltersModal.vue\";\r\n    import TotalCategoryCount from '../client/TotalCategoryCounts';\r\n    import ClusterSpotsModal from './ClusterSpotsModal.vue';\r\n    import SpotDetailsModal from '../citizen/SpotDetailsModal.vue';\r\n    const options = {\r\n        toast: {\r\n            position: SnotifyPosition.rightTop,\r\n        }\r\n    }\r\n    Vue.use(Snotify, options)\r\n    export default {\r\n        props: ['countableQuestions', 'total_spots'],\r\n        data() {\r\n            return {\r\n                version_id:null,\r\n                accessToken: 'pk.eyJ1Ijoid2F0Y2hzcG90dGVyIiwiYSI6ImNsMmY0OTgxdzA3MW0zYm1jMmY5MGY5OG4ifQ.vEle7r52YhgPJ8D-MVlZ2A',\r\n                map: [],\r\n                spotData: [],\r\n                features: [],\r\n                mapFeatures: [],\r\n                spotForm: {\r\n                    requireLatLong: 1,\r\n                    spot_type_id: '',\r\n                    location_id: '',\r\n                    detail: '',\r\n                    spot_date: '',\r\n                    latitude: '',\r\n                    longitude: '',\r\n                    questions: [],\r\n                    client_url: window.location.href.split('#')[0],\r\n                    client_id: JSON.parse(localStorage.getItem(\"client_id\")),\r\n                },\r\n                adminMapStyle: '',\r\n                default_map: '',\r\n                default_map_zoom: '',\r\n                default_latitude: '',\r\n                default_longitude: '',\r\n                appImage: null,\r\n                spotDetailImages: [],\r\n                spotDetail: [],\r\n                spotsData: [],\r\n                showBackButton:false,\r\n                mapLoaded: false,\r\n                totalSpots: 0,\r\n                markerColor: '',\r\n                routeTracks: [],\r\n            };\r\n        },\r\n        components: {\r\n            ClusterSpotsModal,\r\n            FiltersModal,\r\n            TotalCategoryCount,\r\n            SpotDetailsModal\r\n        },\r\n        created() {\r\n            this.$EventBus.$on(\"reinitializeMap\", (data) => {\r\n                this.map.remove();\r\n                this.getClientAdminSpots();\r\n            });\r\n            this.$EventBus.$on(\"showAdminClusterSpots\", (data) => {\r\n                this.$root.$emit(\"bv::show::modal\", \"modal-clusters\");\r\n            });\r\n        },\r\n        mounted() {\r\n            this.getAppSettings();\r\n            this.getClientAdminSpots();\r\n        },\r\n        methods: {\r\n            openSiderBar() {\r\n                this.$root.$emit(\"bv::toggle::collapse\", \"sidebar-no-header\");\r\n            },\r\n            getClientAdminSpots() {\r\n                const data = {\r\n                    client_id: JSON.parse(localStorage.getItem('client_id')),\r\n                }\r\n                API.getClientAdminSpots(\r\n                    data,\r\n                    data => {\r\n                        const spot_dImage = data.default_image;\r\n                        this.totalSpots = data.total_spots;\r\n\r\n                        data.data.forEach(data => {\r\n                            let exists = this.mapFeatures.find(p => p.properties.id == data.id)\r\n                            if (!exists) {\r\n                                const d1 = {\r\n                                    type: \"Feature\",\r\n                                    properties: {\r\n                                        id: data.id,\r\n                                        title: (data.spot_type) ? data.spot_type.name : '',\r\n                                        // spot_id: data.spot_type_id,\r\n                                        spot_id: data.spot_id,\r\n                                        description: (data.location) ? data.location.name : '',\r\n                                        spotted_by: (data.spotter_user) ? data.spotter_user.name : '',\r\n                                        spotted_username: (data.spotter_user) ? data.spotter_user.user_name : '',\r\n                                        spot_date: this.formatDate(data.spot_date),\r\n                                        iconUrl: (data.primary_image) ? this.$server_url + data.primary_image : spot_dImage,\r\n                                        markerColor: (data.single_question && data.single_question.category) ? data.single_question.category.hash_color : 'Red'\r\n                                    },\r\n                                    geometry: {\r\n                                        type: \"Point\",\r\n                                        coordinates: [data.longitude, data.latitude]\r\n                                    }\r\n                                }\r\n                                this.mapFeatures.push(d1);\r\n                            }\r\n                        })\r\n\r\n                        // alert('working')\r\n\r\n                        // if (navigator.geolocation) {\r\n                        //     var self = this;\r\n                        //     navigator.geolocation.getCurrentPosition(e => {\r\n                        //         this.initMap([e.coords.longitude, e.coords.latitude])\r\n                        //     }, function (error) {\r\n                        //         if (error.code == error.PERMISSION_DENIED) {\r\n                        //             // pop up dialog asking for location\r\n                        //             self.initMap([self.default_longitude, self.default_latitude]);\r\n                        //         }\r\n                        //     })\r\n                        // } else {\r\n                            this.initMap([this.default_longitude, this.default_latitude]);\r\n                        // }\r\n                    },\r\n                    err => {\r\n                    }\r\n                )\r\n            },\r\n            initMap(lngLat) {\r\n                this.mapLoaded = false;\r\n                mapboxgl.accessToken = this.accessToken;\r\n                this.map = new mapboxgl.Map({\r\n                    container: 'mapContainer',\r\n                    style: 'mapbox://styles/mapbox/streets-v11',\r\n                    center: lngLat,\r\n                    zoom: this.default_map_zoom,\r\n                    maxZoom: 14,\r\n                    attributionControl: false\r\n                    // projection: 'globe'\r\n                });\r\n\r\n                this.spotForm.longitude = lngLat[0];\r\n                this.longitude = lngLat[0];\r\n                this.spotForm.latitude = lngLat[1];\r\n                this.latitude = lngLat[1];\r\n                this.marker = new mapboxgl.Marker({\r\n                    draggable: true\r\n                }).setLngLat(lngLat).addTo(this.map);\r\n    \r\n                this.map.on('style.load', () => {\r\n                    this.map.setFog({});\r\n                });\r\n                var coordinates = document.getElementById('coordinates');\r\n                coordinates.style.display = 'block';\r\n                coordinates.innerHTML = `Lat: ${parseFloat(this.latitude).toFixed(6)}, Lng: ${parseFloat(this.longitude).toFixed(6)}`; \r\n                var ref = this;\r\n                this.marker.on('dragend', (e) => {\r\n                    var lngLat = e.target.getLngLat();\r\n                    coordinates.innerHTML = `Lat: ${lngLat.lat.toFixed(6)}, Lng: ${lngLat.lng.toFixed(6)}`;\r\n                    // this.$refs.marker.mapObject.getLatLng();\r\n                    // ref.getLatLong(lngLat)\r\n\r\n                })\r\n\r\n                var loadFeatures = this.mapFeatures;\r\n                const geojson = {\r\n                    'type': 'FeatureCollection',\r\n                    'features': this.mapFeatures\r\n                };\r\n\r\n                this.map.on('load', () => {\r\n                    \r\n                    //adding feature data to show on map\r\n                    this.data2 = {\r\n                        \"type\": \"FeatureCollection\",\r\n                        \"crs\": {\r\n                            \"type\": \"name\",\r\n                            \"properties\": {\r\n                                \"name\": \"urn:ogc:def:crs:OGC:1.3:CRS84\"\r\n                            }\r\n                        },\r\n                        \"features\": this.mapFeatures\r\n                    }\r\n\r\n                    //source to add depth layers\r\n                    this.map.addSource('bathymetry', {\r\n                        // 'type': 'geojson',\r\n                        type: 'vector',\r\n                        url: 'mapbox://mapbox.mapbox-bathymetry-v2'\r\n                        // 'data': this.data2\r\n                    });\r\n\r\n                    //layer to add water depths\r\n                    this.map.addLayer({\r\n                        'id': 'water-depth',\r\n                        'type': 'fill',\r\n                        'source': 'bathymetry',\r\n                        'source-layer': 'depth',\r\n                        'layout': {},\r\n                        'paint': {\r\n                            // Transition from heatmap to circle layer by zoom level\r\n                            // 'fill-opacity': [\r\n                            //     'interpolate', ['linear'],\r\n                            //     ['zoom'],\r\n                            //     7,\r\n                            //     0,\r\n                            //     8,\r\n                            //     1\r\n                            // ],\r\n                            // cubic bezier is a four point curve for smooth and precise styling\r\n                            // adjust the points to change the rate and intensity of interpolation\r\n                            'fill-color': [\r\n                                'interpolate',\r\n                                ['cubic-bezier', 0, 0.5, 1, 0.5],\r\n                                ['get', 'min_depth'],\r\n                                200,\r\n                                '#78bced',\r\n                                9000,\r\n                                '#15659f'\r\n                            ]\r\n                        }\r\n                    },\r\n                    'hillshade'\r\n                    );\r\n\r\n                    //layer to show data on map with clusters and points\r\n                    this.map.addSource('earthquakes', {\r\n                        type: 'geojson',\r\n                        data: this.data2,\r\n                        cluster: true,\r\n                        clusterMaxZoom: 14,\r\n                        clusterRadius: 50\r\n                    });\r\n                    \r\n                    //layer to create clusters\r\n                    this.map.addLayer({\r\n                        id: 'clusters',\r\n                        type: 'circle',\r\n                        source: 'earthquakes',\r\n                        filter: ['has', 'point_count'],\r\n                        paint: {\r\n                            'circle-color': [\r\n                                'step',\r\n                                ['get', 'point_count'],\r\n                                '#FF7F50',\r\n                                100,\r\n                                '#003366',\r\n                                750,\r\n                                '#ff414e'\r\n                            ],\r\n                            'circle-radius': [\r\n                                'step',\r\n                                ['get', 'point_count'],\r\n                                20,\r\n                                100,\r\n                                30,\r\n                                750,\r\n                                40\r\n                            ]\r\n                        }\r\n                    });\r\n\r\n                    //layer to count cluster points\r\n                    this.map.addLayer({\r\n                        id: 'cluster-count',\r\n                        type: 'symbol',\r\n                        source: 'earthquakes',\r\n                        filter: ['has', 'point_count'],\r\n                        layout: {\r\n                            'text-field': '{point_count_abbreviated}',\r\n                            'text-font': ['DIN Offc Pro Medium', 'Arial Unicode MS Bold'],\r\n                            'text-size': 12,\r\n                            \"text-allow-overlap\" : true\r\n                        },\r\n                        paint: {\r\n                            \"text-color\": \"#ffffff\"\r\n                        }\r\n                    });\r\n\r\n                    // Fetch and add the route track data\r\n                    const data = {\r\n                        client_id: JSON.parse(localStorage.getItem('client_id')),\r\n                    }\r\n                    API.getTracksData(\r\n                        data,\r\n                        (data) => {\r\n                            // Prepare the track data for the map\r\n                            const trackCoordinates = data.map(track => [track.longitude, track.latitude]);\r\n\r\n                            // Add a new source for the route tracks\r\n                            this.map.addSource('routeTracks', {\r\n                                type: 'geojson',\r\n                                data: {\r\n                                    type: 'FeatureCollection',\r\n                                    features: [{\r\n                                        type: 'Feature',\r\n                                        geometry: {\r\n                                            type: 'LineString',\r\n                                            coordinates: trackCoordinates\r\n                                        },\r\n                                        properties: {}\r\n                                    }]\r\n                                }\r\n                            });\r\n\r\n                            // Add a layer to display the route tracks with a curved, dotted style\r\n                            this.map.addLayer({\r\n                                id: 'route',\r\n                                type: 'line',\r\n                                source: 'routeTracks',\r\n                                layout: {\r\n                                    'line-cap': 'round',  // Rounded end for smoother curves\r\n                                    'line-join': 'round'  // Rounded join for smoother corners\r\n                                },\r\n                                paint: {\r\n                                    'line-color': '#888',  // Line color\r\n                                    'line-width': 4,       // Line width\r\n                                    'line-dasharray': [4, 4]  // Dash pattern: 4px dash, 4px space\r\n                                }\r\n                            });\r\n\r\n                            // Add markers at each point along the route\r\n                            trackCoordinates.forEach((coord, index) => {\r\n                                const markerElement = document.createElement('div');\r\n                                markerElement.style.backgroundColor = '#FF0000'; // Red color for the marker\r\n                                markerElement.style.width = '20px';\r\n                                markerElement.style.height = '20px';\r\n                                markerElement.style.borderRadius = '50%'; // Make it circular\r\n                                markerElement.style.border = '2px solid white'; // Add a white border for better visibility\r\n                                \r\n                                // Add marker to the map\r\n                                new mapboxgl.Marker(markerElement)\r\n                                    .setLngLat(coord)\r\n                                    .setPopup(new mapboxgl.Popup({ offset: 25 }) // Add a popup\r\n                                        .setHTML(`<p>Point ${index + 1}:<br>Lat: ${coord[1]}, Lng: ${coord[0]}</p>`)) // Popup content\r\n                                    .addTo(this.map);\r\n                            });\r\n                        },\r\n                        (error) => {\r\n                            console.error('Error fetching route tracks:', error);\r\n                        }\r\n                    );\r\n\r\n                    if(this.version_id === 2 || this.version_id === 3){\r\n                        //layer to add image\r\n                        this.map.loadImage(\r\n                            this.appImage,\r\n                            (error, image) => {\r\n                            if (error) throw error;\r\n                            // Add the image to the map style.\r\n                            this.map.addImage('cat', image,{\r\n                                \"sdf\": \"true\"\r\n                            });\r\n                        });\r\n                        let categoryColors = [];\r\n\r\n                        // Populate categoryColors array with actual colors\r\n                        this.mapFeatures.forEach((feature) => {\r\n                            categoryColors.push(feature.properties.markerColor || '');\r\n                        });\r\n\r\n\r\n                        this.map.addLayer({\r\n                            id: 'unclustered-point',\r\n                            type: 'symbol',\r\n                            source: 'earthquakes', // reference the data source\r\n                            filter: ['!', ['has', 'point_count']],\r\n                            layout: {\r\n                                \"icon-image\": [\r\n                                    \"match\", [\"get\", \"spot_id\"],\r\n                                    [\"CD\", \"HP\", \"BD\", \"KW\", \"RD\", \"UD\", \"WB\", \"WS\", \"SD\"], \"dolphin\", [\"MW\", \"UB\", \"HU\", \"PW\", \"SP\", \"NB\", \"FW\", \"CB\", \"SW\"], \"whale\", [\"BS\"], \"baskingshark\", [\"UC\", \"UN\", \"OR\", \"SU\"], \"\",\r\n                                    \"cat\"\r\n                                ],\r\n                                \"icon-size\": 1,\r\n                                \"icon-padding\": 2,\r\n                                \"icon-anchor\": \"bottom\",\r\n                                \"icon-allow-overlap\": {\r\n                                    \"base\": 1,\r\n                                    \"stops\": [\r\n                                        [0, true],\r\n                                        [12, true],\r\n                                        [22, true]\r\n                                    ]\r\n                                },\r\n                            },\r\n                            paint: {\r\n                                \"icon-color\": [\r\n                                    \"get\",\r\n                                    \"icon-color\"\r\n                                ],\r\n                                \"icon-halo-blur\": 0,\r\n                                \"icon-halo-color\": [\r\n                                    \"get\",\r\n                                    \"icon-halo-color\"\r\n                                ],\r\n                                \"icon-halo-width\": 4\r\n                            }\r\n                        });\r\n\r\n                        // Set the GeoJSON source data with individual colors for each feature\r\n                        const featuresWithColors = this.mapFeatures.map((feature, index) => {\r\n                            return {\r\n                                ...feature,\r\n                                properties: {\r\n                                    ...feature.properties,\r\n                                    'icon-color': categoryColors[index] || '',\r\n                                    'icon-halo-color': categoryColors[index] || ''\r\n                                }\r\n                            };\r\n                        });\r\n\r\n                        this.map.getSource('earthquakes').setData({\r\n                            type: 'FeatureCollection',\r\n                            features: featuresWithColors\r\n                        });\r\n                    }\r\n                    else{\r\n                        //layer to add image\r\n                        this.map.loadImage(\r\n                            this.appImage,\r\n                            (error, image) => {\r\n                            if (error) throw error;\r\n                            // Add the image to the map style.\r\n                            this.map.addImage('cat', image);\r\n                        });\r\n\r\n                        //layer to add points on map\r\n                        this.map.addLayer({\r\n                            id: 'unclustered-point',\r\n                            type: 'symbol',\r\n                            source: 'earthquakes', // reference the data source\r\n                            filter: ['!', ['has', 'point_count']],\r\n                            // layout: {\r\n                            //     'icon-image': 'cat', // reference the image\r\n                            //     'icon-size': 0.25\r\n                            // }\r\n                            // paint: {\r\n                            //     \"text-color\": \"#d21010\",\r\n                            //     \"icon-halo-color\": \"#d21010\",\r\n                            //     \"icon-halo-width\": 2\r\n                            // },\r\n                            layout: {\r\n                                \"icon-image\": [\r\n                                    \"match\",\r\n                                    [\"get\", \"spot_id\"],\r\n                                    [\"CD\", \"HP\", \"BD\", \"KW\", \"RD\", \"UD\", \"WB\", \"WS\", \"SD\"], \"dolphin\",\r\n                                    [\"MW\", \"UB\", \"HU\", \"PW\", \"SP\", \"NB\", \"FW\", \"CB\", \"SW\"], \"whale\",\r\n                                    [\"BS\"], \"baskingshark\",\r\n                                    [\"UC\", \"UN\", \"OR\", \"SU\"], \"\",\r\n                                    \"cat\"\r\n                                ],\r\n                                \"icon-padding\": 2,\r\n                                // 'icon-size': 0.05,\r\n                                \"icon-anchor\": \"bottom\",\r\n                                \"icon-allow-overlap\": {\r\n                                    \"base\": 1,\r\n                                    \"stops\": [\r\n                                        [0, true],\r\n                                        [12, true],\r\n                                        [22, true]\r\n                                    ]\r\n                                },\r\n                            }\r\n                        });\r\n                    }\r\n\r\n                    this.map.on('click', 'clusters', (e) => {\r\n                        const features = this.map.queryRenderedFeatures(e.point, {\r\n                            layers: ['clusters']\r\n                        });\r\n                        var clusterId = features[0].properties.cluster_id;\r\n                        var zoom = this.map.getZoom();\r\n                        if(zoom < 14) {\r\n                            this.map.getSource('earthquakes').getClusterExpansionZoom(\r\n                                clusterId,\r\n                                (err, zoom) => {\r\n                                    if (err) return;\r\n                                    this.map.easeTo({\r\n                                        center: features[0].geometry.coordinates,\r\n                                        zoom: zoom\r\n                                    });\r\n                                }\r\n                            );\r\n                        } else {\r\n                            var point_count = e.features[0].properties.point_count;\r\n                            var clusterSource = this.map.getSource(\"earthquakes\");\r\n\r\n                            clusterSource.getClusterLeaves(clusterId, point_count, 0, (err, aFeatures) => {\r\n                                this.spotsData = aFeatures;\r\n                                this.spotsData.sort(function(a,b) {\r\n                                    return new Date(b.properties.spot_date) - new Date(a.properties.spot_date);\r\n                                });\r\n                                this.openClusterSpotDetail(this.spotsData);\r\n                            });\r\n                        }\r\n                    });\r\n\r\n                    // if(this.version_id === 2 || this.version_id === 3){\r\n                    //     this.mapFeatures.forEach((feature) => {\r\n                    //         this.map.on('click', `unclustered-point-${feature.properties.id}`, (e) => {\r\n                    //             const coordinates = e.features[0].geometry.coordinates.slice();\r\n                    //             const spot_type = e.features[0].properties.title;\r\n                    //             const id = e.features[0].properties.id;\r\n                    //             const spot_id = e.features[0].properties.spot_id;\r\n                    //             const iconUrl = e.features[0].properties.iconUrl;\r\n                    //             const spotted_by = e.features[0].properties.spotted_by;\r\n                    //             const spotted_username = e.features[0].properties.spotted_username;\r\n                    //             const spot_date = e.features[0].properties.spot_date;\r\n                    //             const description = e.features[0].properties.description;\r\n                    //             while (Math.abs(e.lngLat.lng - coordinates[0]) > 180) {\r\n                    //                 coordinates[0] += e.lngLat.lng > coordinates[0] ? 360 : -360;\r\n                    //             }\r\n                    //             // this.openSpotDetail(id,false);\r\n                    //             this.$refs.spotDetails.openAdminSpotDetail(id, false);\r\n                    //         });\r\n                    //     });\r\n\r\n                    //     this.map.on('mouseenter', 'clusters', () => {\r\n                    //         this.map.getCanvas().style.cursor = 'pointer';\r\n                    //     });\r\n                    //     this.map.on('mouseleave', 'clusters', () => {\r\n                    //         this.map.getCanvas().style.cursor = '';\r\n                    //     });\r\n                    // }\r\n                    // else{\r\n                        this.map.on('click', 'unclustered-point', (e) => {\r\n                            const coordinates = e.features[0].geometry.coordinates.slice();\r\n                            const spot_type = e.features[0].properties.title;\r\n                            const id = e.features[0].properties.id;\r\n                            const spot_id = e.features[0].properties.spot_id;\r\n                            const iconUrl = e.features[0].properties.iconUrl;\r\n                            const spotted_by = e.features[0].properties.spotted_by;\r\n                            const spotted_username = e.features[0].properties.spotted_username;\r\n                            const spot_date = e.features[0].properties.spot_date;\r\n                            const description = e.features[0].properties.description;\r\n                            while (Math.abs(e.lngLat.lng - coordinates[0]) > 180) {\r\n                                coordinates[0] += e.lngLat.lng > coordinates[0] ? 360 : -360;\r\n                            }\r\n                            // this.openSpotDetail(id,false);\r\n                            this.$refs.spotDetails.openAdminSpotDetail(id, false);\r\n                        });\r\n\r\n                        this.map.on('mouseenter', 'clusters', () => {\r\n                            this.map.getCanvas().style.cursor = 'pointer';\r\n                        });\r\n                        this.map.on('mouseleave', 'clusters', () => {\r\n                            this.map.getCanvas().style.cursor = '';\r\n                        });\r\n                    // }\r\n                    this.mapLoaded = true;\r\n                    // this.map.on('click', 'bathymetry-point', (e) => {\r\n                    //     alert(e)\r\n                    // })    \r\n                });\r\n                const logo = document.querySelector('.mapboxgl-ctrl-logo');\r\n                if (logo) {\r\n                    logo.remove();\r\n                }\r\n            },\r\n            openAdminSpotDetail(id,event) {\r\n                this.$refs.spotDetails.openAdminSpotDetail(id,true)\r\n            },\r\n            openFilters() {\r\n                this.$root.$emit(\"bv::show::modal\", \"modal-map-filters\");\r\n                // this.$refs.filterComponent.getFiltersData();\r\n            },\r\n            applyFilter(params) {\r\n                let data = {\r\n                    spot_id: params.spotId,\r\n                    date_from: params.dateFrom,\r\n                    date_to: params.dateTo,\r\n                    questions: params.questions,\r\n                    categories: params.categories,\r\n                    locations: params.locations,\r\n                    surveys: params.surveys,\r\n                    spotTypes: params.spotTypes,\r\n                    selectedQuestions: params.selectedQuestions,\r\n                    client_id: JSON.parse(localStorage.getItem('client_id')),\r\n                    countRangeFilter: params.countRangeFilter,\r\n                    countRangeValues: params.countRangeValues,\r\n                }\r\n                console.log('filter data', data);\r\n                API.getSpotsByAdminFilters(data,\r\n                    data => {\r\n                        if (data.status === 200) {\r\n                            this.$snotify.success(data.message);\r\n                            this.data2.features = [];\r\n                            this.mapFeatures = [];\r\n                            this.totalSpots = data.total_spots;\r\n                            this.$refs.sidebar.assignQuestions(data.countableQuestions);\r\n                            this.$refs.filterComponent.StopFilterLoading();\r\n                            this.$refs.filterComponent.StopResetLoading();\r\n                            this.$refs.filterComponent.changeSliderValue(data.range);\r\n                            const spot_dImage = data.default_image;\r\n                            data.data.forEach(data => {\r\n                                console.log('spot', data);\r\n                                let exists = this.mapFeatures.find(p => p.properties.id == data.id)\r\n                                if (!exists) {\r\n                                    const d1 = {\r\n                                        type: \"Feature\",\r\n                                        properties: {\r\n                                            id: data.id,\r\n                                            title: (data.spot_type) ? data.spot_type.name : '',\r\n                                            // spot_id: data.spot_type_id,\r\n                                            spot_id: data.spot_id,\r\n                                            description: (data.location) ? data.location.name : '',\r\n                                            spotted_by: (data.spotter_user && data.spotter_user.name) ? data.spotter_user.name : '',\r\n                                            spotted_username: (data.spotter_user && data.spotter_user.user_name) ? data.spotter_user.user_name : '',\r\n                                            spot_date: this.formatDate(data.spot_date),\r\n                                            iconUrl: (data.primary_image) ? this.$server_url + data.primary_image : spot_dImage,\r\n                                            markerColor: (data.single_question && data.single_question.category) ? data.single_question.category.hash_color : 'Red'\r\n                                        },\r\n                                        geometry: {\r\n                                            type: \"Point\",\r\n                                            coordinates: [data.longitude, data.latitude]\r\n                                        }\r\n                                    }\r\n                                    this.mapFeatures.push(d1);\r\n                                }\r\n                            })\r\n                            let categoryColors = [];\r\n\r\n                            this.mapFeatures.forEach((feature) => {\r\n                                // Collect all category colors\r\n                                categoryColors.push(feature.properties.markerColor || '');\r\n                            });\r\n                            // Set the GeoJSON source data with individual colors for each feature\r\n                            const featuresWithColors = this.mapFeatures.map((feature, index) => {\r\n                                return {\r\n                                    ...feature,\r\n                                    properties: {\r\n                                        ...feature.properties,\r\n                                        'icon-color': categoryColors[index] || '',\r\n                                        'icon-halo-color': categoryColors[index] || ''\r\n                                    }\r\n                                };\r\n                            });\r\n\r\n                            this.map.getSource('earthquakes').setData({\r\n                                type: 'FeatureCollection',\r\n                                features: featuresWithColors\r\n                            });\r\n                            // this.data2 = {\r\n                            //     \"type\": \"FeatureCollection\",\r\n                            //     \"crs\": {\r\n                            //         \"type\": \"name\",\r\n                            //         \"properties\": {\r\n                            //             \"name\": \"urn:ogc:def:crs:OGC:1.3:CRS84\"\r\n                            //         }\r\n                            //     },\r\n                            //     \"features\": this.mapFeatures\r\n                            // }\r\n                            // this.map.getSource(\"earthquakes\").setData(this.data2);\r\n                            console.log('applyFilterresponse', data)\r\n                        } else if (data.status === 500) {\r\n                            this.$snotify.error(data.message);\r\n                            this.$refs.filterComponent.StopFilterLoading();\r\n                            this.$refs.filterComponent.StopResetLoading();\r\n                        }\r\n                    },\r\n                    err => {\r\n                        console.log(err);\r\n                        this.$refs.filterComponent.StopFilterLoading();\r\n                        this.$refs.filterComponent.StopResetLoading();\r\n                    }\r\n                );\r\n            },\r\n            openClusterSpotDetail(aFeatures) {\r\n                this.$EventBus.$emit('showAdminClusterSpots');\r\n            },\r\n            formatDate(date) {\r\n                return moment(String(date)).format('MM-DD-YYYY HH:mm')\r\n            },\r\n    \r\n            getAppSettings() {\r\n                const data = {\r\n                    client_id: JSON.parse(localStorage.getItem('client_id')),\r\n                }\r\n                API.getAppSettings(\r\n                    data,\r\n                    data => {\r\n                        this.version_id = data.version_id;\r\n                        console.log('this.version_id :', this.version_id);\r\n                        this.appImage = this.$server_url + data.data.stock_image;\r\n                        // this.adminMapStyle = data.data.default_map;\r\n                        // this.default_map = data.data.default_map;\r\n                        this.default_map_zoom = data.data.default_map_zoom;\r\n                        this.default_latitude = (data.data.latitude) ? data.data.latitude : 39.452717;\r\n                        this.default_longitude = (data.data.longitude) ? data.data.longitude : -123.813866;\r\n    \r\n                    },\r\n                    err => {}\r\n                )\r\n            },\r\n        }\r\n    };\r\n</script>\r\n\r\n<style scoped>\r\n    #coordinates {\r\n        position: absolute !important;\r\n        bottom: 10px !important;\r\n    }\r\n    .basemap {\r\n        width: 100%;\r\n        height: 100%;\r\n    }\r\n    \r\n    .mapboxgl-canvas {\r\n        width: 1200px;\r\n        height: 689.15px;\r\n        position: static !important;\r\n    }\r\n    \r\n    .mapboxgl-canvas-container {\r\n        position: static !important;\r\n        width: 1200px !important;\r\n    }\r\n    \r\n    #menu {\r\n        position: absolute;\r\n        background: #efefef;\r\n        padding: 10px;\r\n        font-family: 'Open Sans', sans-serif;\r\n        z-index: 1;\r\n    }\r\n    .google-map-design {\r\n        min-height: calc(100vh - 184px);\r\n        height: 100%;\r\n    }\r\n    .google-map-design #mapContainer {\r\n        height: calc(100vh - 285px);\r\n    }\r\n    .rl-body {\r\n        position: relative;\r\n    }\r\n    .al-btn {\r\n        position: absolute;\r\n        left: -10px;\r\n        z-index: 5;\r\n        top: 30px;\r\n    }\r\n    .al-btn button {\r\n        color:#fff !important;\r\n    }\r\n    .al-btn button:hover {\r\n        color:#fff !important;\r\n    }\r\n    .variant-orange {\r\n        color: #fff !important;\r\n        background-color: #fa6400;\r\n        border-color: #fa6400;\r\n    }\r\n    .new-table-responsive  tr td span {\r\n        white-space: pre-wrap;\r\n        line-height: 1.2;\r\n    }\r\n    @media (max-width: 375px) {\r\n        .row .card .new-card-body {\r\n            padding: 1.25rem 1.437rem !important;\r\n        }\r\n        .new-al-btn {\r\n            left: 0px;\r\n        }\r\n        .new-al-btn button:nth-child(1) {\r\n            margin-left: 28px !important;\r\n            margin-right: 0px !important;\r\n        }\r\n        .new-al-btn button:nth-child(2) {\r\n            margin-left: 5px !important;\r\n        }\r\n    }\r\n</style>\r\n","import mod from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./BathymetryMap.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./BathymetryMap.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./BathymetryMap.vue?vue&type=template&id=527a94b3&scoped=true&\"\nimport script from \"./BathymetryMap.vue?vue&type=script&lang=js&\"\nexport * from \"./BathymetryMap.vue?vue&type=script&lang=js&\"\nimport style0 from \"./BathymetryMap.vue?vue&type=style&index=0&id=527a94b3&prod&scoped=true&lang=css&\"\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  \"527a94b3\",\n  null\n  \n)\n\nexport default component.exports"],"sourceRoot":""}