{"version":3,"sources":["webpack:///./src/pages/MapPage/Tools/Drawing/MapDrawing.vue","webpack:///./node_modules/vuetify/lib/components/VItemGroup/VItem.js","webpack:///./src/pages/MapPage/Tools/Drawing/MapDrawingSymbolSelectionDialog.vue","webpack:///src/pages/MapPage/Tools/Drawing/MapDrawingSymbolSelectionDialog.vue","webpack:///./src/pages/MapPage/Tools/Drawing/MapDrawingSymbolSelectionDialog.vue?7d47","webpack:///./src/pages/MapPage/Tools/Drawing/MapDrawingSymbolSelectionDialog.vue?fa3b","webpack:///./src/pages/MapPage/Tools/Drawing/MapDrawingAddOrEditDrawingLayerDialog.vue","webpack:///src/pages/MapPage/Tools/Drawing/MapDrawingAddOrEditDrawingLayerDialog.vue","webpack:///./src/pages/MapPage/Tools/Drawing/MapDrawingAddOrEditDrawingLayerDialog.vue?e62d","webpack:///./src/pages/MapPage/Tools/Drawing/MapDrawingAddOrEditDrawingLayerDialog.vue?579a","webpack:///src/pages/MapPage/Tools/Drawing/MapDrawing.vue","webpack:///./src/pages/MapPage/Tools/Drawing/MapDrawing.vue?9a97","webpack:///./src/pages/MapPage/Tools/Drawing/MapDrawing.vue?37e2","webpack:///./src/pages/MapPage/Tools/Drawing/MapDrawing.vue?d13a"],"names":["attrs","model","value","bottomSheetActive","callback","staticStyle","staticClass","_c","_vm","ref","on","graphicTitle","setGraphicTitle","loadDrawing","directives","rawName","selectLayerDialog","expression","class","breakpoint","mdAndUp","$vuetify","setTool","selectedPointStyleDialogActive","slot","domProps","selectedPolylineStyleDialogActive","selectedPolygonStyleDialogActive","tool","updateGraphics","close","name","width","staticRenderFns","render","_defineProperty","obj","key","Object","defineProperty","enumerable","configurable","writable","mixins","extend","props","required","this","$scopedSlots","default","element","active","isActive","toggle","Array","isArray","length","tag","data","_b","activeClass","dialog","selectedIndex","symbols","scopedSlots","fn","closeDialog","component","_v","useExistingLayer","$$v","_e","layerDescription"],"mappings":"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,YACA,eACA,kBACA,gBACA,gDACA,sBACA,4BACA,YACA,YACA,sBACA,mBACA,uBACA,gBACA,uBACA,sBACA,yBACA,UACA,QACA,+BACA,gCACA,8BACA,+BACA,kCACA,+BACA,6BAEA,6BACA,kCACA,sCACA,wBAIA,yDACA,qEACA,6CACA,oBACA,gBACA,+BAEA,eACA,8CAGA,sCACA,mDACA,+DACA,6BAEA,qCACA,2CACA,6DACA,4BAEA,wCACA,8CACA,mEACA,iCAGA,OACA,8BACA,IACA,uBAGA,mBACA,QACA,4BACA,yBACA,0BAGA,yCACA,gBACA,uBACA,wBACA,mBACA,oBACA,IACA,oBACA,mBACA,kDAEA,gDAEA,kDAHA,oBAKA,kDACA,qBACA,iDACA,kBAEA,gBAGA,2CACA,qCAEA,yCACA,qCAEA,2BACA,UACA,iCACA,OACA,wCAEA,iDACA,sCAEA,wBACA,+CAEA,qBACA,0BAEA,qEAEA,+BACA,yGACA,2BACA,wBACA,sBACA,4BAIA,oDACA,uCACA,mDACA,YACA,uCACA,MACA,eACA,0CACA,MACA,cACA,yCACA,QAIA,uCACA,uCACA,0CACA,0CAEA,kCACA,8BACA,qDAEA,8BACA,qDAEA,+BAEA,+BAEA,OADA,mCACA,GACA,YACA,oCACA,6DACA,GAEA,wCAEA,2DAGA,MACA,eACA,oCACA,+DACA,GAEA,uCAEA,0DAEA,MACA,QACA,oCACA,iEACA,GAEA,0CAEA,6DAEA,MAEA,mBAEA,4BACA,8BAEA,gCACA,0BAEA,oGACA,gCACA,uCACA,YACA,UACA,YAEA,0BAEA,wBACA,kCACA,yCACA,YACA,UACA,YAEA,0BAEA,uDAGA,oDAEA,oBACA,0CACA,2BACA,6BAGA,UACA,8BACA,gCAGA,oCACA,qBACA,2BACA,2BAEA,sBACA,uBACA,8BAKA,yBAEA,yBACA,gCACA,8BACA,+BACA,gBAEA,2CACA,QAEA,+CAGA,mBACA,+BACA,gBAGA,2CACA,iCACA,uBACA,yBACA,KACA,wBACA,uBACA,yBACA,MAEA,0BACA,kCACA,uBAOA,sEACA,mDACA,6BACA,EACA,qBACA,kBAEA,4DACA,QACA,kBAEA,mBACA,oBAGA,QAGA,mBACA,QAzBA,EACA,2DA4BA,wBACA,gCACA,sBACA,+BAEA,yBACA,kCACA,2BACA,qCAGA,8BAEA,0BAEA,0BACA,sBACA,qCACA,KACA,oDACA,qBAEA,4BACA,yBACA,mDACA,sBACA,iDACA,yCAEA,+DACA,wBAGA,uBAEA,yBACA,WACA,YACA,uBACA,YAGA,iDACA,SACA,YACA,oCACA,YAGA,wBACA,SACA,uBACA,sBACA,oBACA,wBACA,oCAEA,+BACA,aACA,kCACA,uBAEA,gDACA,qCAIA,mCACA,uCACA,kCAEA,gCACA,uCACA,GACA,2BAEA,gBADA,wCAGA,OAEA,4CAEA,EACA,4BACA,kBACA,kBAKA,wCAEA,0BACA,mCAEA,qBAEA,6CAEA,YAGA,wBACA,SACA,YACA,uBACA,oCAEA,kCACA,gBACA,UAGA,kBACA,0BACA,eACA,EACA,oCACA,kBACA,0BAGA,gDAEA,iBAEA,aAYA,aAIA,0CACA,oBACA,iCACA,kCACA,kCACA,oBACA,mBACA,QACA,QACA,uBAKA,mEAEA,6CACA,uBACA,iCACA,iCACA,wBAEA,uBACA,mBACA,cACA,4BACA,gBAKA,0BACA,mBACA,aACA,oCACA,kBAEA,qEAEA,2CACA,KACA,oCACA,8BACA,yCACA,QACA,qBACA,OAEA,QACA,uBAKA,6CACA,iEAEA,sCACA,2BACA,8BACA,4BAEA,uCACA,qCACA,oCAIA,sCACA,qCACA,mCAIA,yCACA,qCACA,uCAIA,0CACA,2GACA,kCACA,SACA,OAEA,uBACA,sBACA,OACA,KACA,gBACA,oBACA,kBACA,SAEA,mBAEA,2BACA,uBAIA,mBACA,kCACA,2CACA,kCAEA,WACA,0BAEA,+BAEA,CACA,uCACA,4BAGA,uBCn1BgY,ICQ5X,G,UAAY,eACd,EACA,EACAA,GACA,EACA,KACA,KACA,OAIa,e,6CCnBf,W","file":"js/chunk-cef8dfe4.8950011a.js","sourcesContent":["var render = function render(){var _vm=this,_c=_vm._self._c;return _c('div',{staticStyle:{\"position\":\"absolute\",\"top\":\"10px\",\"left\":\"0px\",\"z-index\":\"10\"}},[_c('v-dialog',{staticClass:\"elevation-2\",attrs:{\"persistent\":\"\",\"width\":\"280px\"},model:{value:(_vm.bottomSheetActive),callback:function ($$v) {_vm.bottomSheetActive=$$v},expression:\"bottomSheetActive\"}},[_c('v-card',{staticStyle:{\"border-radius\":\"5px\"}},[_c('v-card-text',{staticClass:\"ma-0 pa-1\"},[_c('v-layout',{attrs:{\"row\":\"\",\"justify-center\":\"\",\"align-center\":\"\"}},[(_vm.bottomSheetActive)?_c('v-text-field',{ref:\"graphicTitleTextField\",attrs:{\"box\":\"\",\"color\":\"grey\",\"single-line\":\"\",\"autofocus\":\"\",\"full-width\":\"\",\"hide-details\":\"\",\"label\":\"\",\"placeholder\":\"Gi elementet et navn\"},on:{\"keyup\":function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,\"enter\",13,$event.key,\"Enter\"))return null;return _vm.setGraphicTitle.apply(null, arguments)}},model:{value:(_vm.graphicTitle),callback:function ($$v) {_vm.graphicTitle=$$v},expression:\"graphicTitle\"}}):_vm._e()],1),_c('v-layout',{attrs:{\"row\":\"\",\"justify-end\":\"\",\"align-end\":\"\"}},[_c('v-btn',{attrs:{\"color\":\"blue\",\"block\":\"\",\"dark\":\"\",\"height\":\"50px\",\"depressed\":\"\"},on:{\"click\":_vm.setGraphicTitle}},[_vm._v(\"Lagre\")]),_c('v-btn',{attrs:{\"block\":\"\",\"depressed\":\"\"},on:{\"click\":function($event){_vm.bottomSheetActive = false}}},[_vm._v(\"Ikke nå\")])],1)],1),_c('v-divider')],1)],1),(_vm.selectLayerDialog)?_c('map-drawing-add-or-edit-drawing-layer-dialog',{on:{\"start-drawing\":_vm.loadDrawing}}):_vm._e(),_c('div'),_c('v-toolbar',{directives:[{name:\"show\",rawName:\"v-show\",value:(_vm.selectLayerDialog == false && _vm.graphicsLayer !== null),expression:\"selectLayerDialog == false && graphicsLayer !== null\"}],staticClass:\"drawing-toolbar elevation-2\",class:_vm.$vuetify.breakpoint.mdAndUp\n        ? 'drawing-toolbar-mdandup'\n        : 'drawing-toolbar-smanddown',attrs:{\"floating\":_vm.$vuetify.breakpoint.mdAndUp}},[_c('div',{staticStyle:{\"background\":\"transparent !important\"},attrs:{\"id\":\"sketchDiv\"},on:{\"click\":_vm.setTool}}),_c('v-tooltip',{attrs:{\"bottom\":\"\"}},[_c('v-btn',{directives:[{name:\"show\",rawName:\"v-show\",value:(_vm.tool == 'point'),expression:\"tool == 'point'\"}],staticClass:\"choose-symbol-btn\",attrs:{\"slot\":\"activator\",\"flat\":\"\"},on:{\"click\":function($event){_vm.selectedPointStyleDialogActive = true}},slot:\"activator\"},[_c('div',{staticStyle:{\"margin-top\":\"2px\"},domProps:{\"innerHTML\":_vm._s(_vm.selectedRenderedPointStyle)}})]),_c('span',[_vm._v(\"Velg symbol\")])],1),_c('v-tooltip',{attrs:{\"bottom\":\"\"}},[_c('v-btn',{directives:[{name:\"show\",rawName:\"v-show\",value:(_vm.tool === 'polyline'),expression:\"tool === 'polyline'\"}],staticClass:\"choose-symbol-btn\",attrs:{\"slot\":\"activator\",\"flat\":\"\"},on:{\"click\":function($event){_vm.selectedPolylineStyleDialogActive = true}},slot:\"activator\"},[_c('div',{staticStyle:{\"margin-top\":\"2px\"},domProps:{\"innerHTML\":_vm._s(_vm.selectedRenderedLineStyle)}})]),_c('span',[_vm._v(\"Velg symbol\")])],1),_c('v-tooltip',{attrs:{\"bottom\":\"\"}},[_c('v-btn',{directives:[{name:\"show\",rawName:\"v-show\",value:(\n          _vm.tool === 'polygon' || _vm.tool === 'circle' || _vm.tool === 'rectangle'\n        ),expression:\"\\n          tool === 'polygon' || tool === 'circle' || tool === 'rectangle'\\n        \"}],staticClass:\"choose-symbol-btn\",attrs:{\"slot\":\"activator\",\"depressed\":\"\"},on:{\"click\":function($event){_vm.selectedPolygonStyleDialogActive = true}},slot:\"activator\"},[_c('div',{staticStyle:{\"margin-top\":\"2px\"},domProps:{\"innerHTML\":_vm._s(_vm.selectedRenderedPolygonStyle)}})]),_c('span',[_vm._v(\"Velg symbol\")])],1),_c('map-drawing-symbol-selection-dialog',{directives:[{name:\"show\",rawName:\"v-show\",value:(_vm.tool === 'point'),expression:\"tool === 'point'\"}],attrs:{\"index\":_vm.selectedRenderedPointStyleIndex,\"active\":_vm.selectedPointStyleDialogActive,\"tool\":\"point\",\"symbols\":_vm.renderedPointStyles},on:{\"symbol-selected\":_vm.setSelectedStyle,\"close-dialog\":_vm.closeSymbolSelectionDialogs}}),_c('map-drawing-symbol-selection-dialog',{directives:[{name:\"show\",rawName:\"v-show\",value:(_vm.tool === 'polyline'),expression:\"tool === 'polyline'\"}],attrs:{\"index\":_vm.selectedRenderedLineStyleIndex,\"active\":_vm.selectedPolylineStyleDialogActive,\"tool\":\"polyline\",\"symbols\":_vm.renderedLineStyles},on:{\"symbol-selected\":_vm.setSelectedStyle,\"close-dialog\":_vm.closeSymbolSelectionDialogs}}),_c('map-drawing-symbol-selection-dialog',{directives:[{name:\"show\",rawName:\"v-show\",value:(_vm.updateGraphics !== 0),expression:\"updateGraphics !== 0\"}],attrs:{\"index\":_vm.selectedRenderedPolygonStyleIndex,\"active\":_vm.selectedPolygonStyleDialogActive,\"tool\":\"polygon\",\"symbols\":_vm.renderedPolygonStyles},on:{\"symbol-selected\":_vm.setSelectedStyle,\"close-dialog\":_vm.closeSymbolSelectionDialogs}}),_c('v-spacer'),_c('v-tooltip',{attrs:{\"bottom\":\"\"}},[_c('v-btn',{attrs:{\"slot\":\"activator\",\"small\":\"\",\"flat\":\"\",\"color\":\"blue\"},on:{\"click\":_vm.close},slot:\"activator\"},[_vm._v(\"Avslutt\")]),_c('span',[_vm._v(\"Avslutt tegneverktøy\")])],1),(_vm.selectedMapProfile)?_c('map-drawing-change-layer-name-dialog',{attrs:{\"active\":_vm.changeLayerNameDialogActive,\"current-name\":_vm.selectedMapProfile.appTitle,\"current-description\":_vm.selectedMapProfile.Temaforklaring,\"layer\":_vm.selectedMapProfile},on:{\"close-dialog\":_vm.deactivateChangeLayerNameDialog}}):_vm._e()],1),_c('v-slide-y-transition',[_c('v-toolbar',{directives:[{name:\"show\",rawName:\"v-show\",value:(_vm.updateGraphics !== 0),expression:\"updateGraphics !== 0\"}],class:_vm.$vuetify.breakpoint.mdAndUp\n          ? 'edit-toolbar-mdandup'\n          : 'edit-toolbar-smanddown',style:({\n        width: _vm.$vuetify.breakpoint.mdAndUp ? '483px' : '100vw'\n      }),attrs:{\"absolute\":\"\",\"width\":\"300px\",\"dense\":\"\"}},[_c('v-tooltip',{attrs:{\"bottom\":\"\"}},[_c('v-btn',{staticClass:\"ml-2\",attrs:{\"slot\":\"activator\",\"small\":\"\",\"flat\":\"\",\"color\":\"blue\"},on:{\"click\":_vm.openStyleDialogBasedOnGraphicBeingEdited},slot:\"activator\"},[_vm._v(\"Endre symbol\")]),_c('span',[_vm._v(\"Endre symbolet til elementet\")])],1),_c('v-tooltip',{directives:[{name:\"show\",rawName:\"v-show\",value:(_vm.updateGraphics !== 0),expression:\"updateGraphics !== 0\"}],attrs:{\"bottom\":\"\"}},[_c('v-btn',{staticClass:\"ml-2\",attrs:{\"slot\":\"activator\",\"small\":\"\",\"flat\":\"\",\"disabled\":_vm.updateGraphics > 1,\"color\":\"blue\"},on:{\"click\":function($event){return _vm.activateBottomSheet(_vm.lastAddedGraphic)}},slot:\"activator\"},[_vm._v(\"Endre navn\")]),_c('span',[_vm._v(\"Endre navnet til elementet\")])],1),_c('v-tooltip',{directives:[{name:\"show\",rawName:\"v-show\",value:(_vm.updateGraphics !== 0),expression:\"updateGraphics !== 0\"}],attrs:{\"bottom\":\"\"}},[_c('v-btn',{staticClass:\"ml-2\",attrs:{\"slot\":\"activator\",\"small\":\"\",\"flat\":\"\",\"color\":\"blue\"},on:{\"click\":_vm.deleteSelectedGraphics},slot:\"activator\"},[_vm._v(\"Fjern element\")]),_c('span',[_vm._v(\"Fjern elementet fra kartlaget\")])],1)],1)],1)],1)\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\n// Mixins\nimport { factory as GroupableFactory } from '../../mixins/groupable';\n// Utilities\nimport mixins from '../../util/mixins';\nimport { consoleWarn } from '../../util/console';\nexport default mixins(GroupableFactory('itemGroup', 'v-item', 'v-item-group')\n/* @vue/component */\n).extend({\n    name: 'v-item',\n    props: {\n        value: {\n            required: false\n        }\n    },\n    render: function render() {\n        if (!this.$scopedSlots.default) {\n            consoleWarn('v-item is missing a default scopedSlot', this);\n            return null;\n        }\n        var element = void 0;\n        /* istanbul ignore else */\n        if (this.$scopedSlots.default) {\n            element = this.$scopedSlots.default({\n                active: this.isActive,\n                toggle: this.toggle\n            });\n        }\n        if (Array.isArray(element) && element.length === 1) {\n            element = element[0];\n        }\n        if (!element || Array.isArray(element) || !element.tag) {\n            consoleWarn('v-item should only contain a single element', this);\n            return element;\n        }\n        element.data = this._b(element.data || {}, element.tag, {\n            class: _defineProperty({}, this.activeClass, this.isActive)\n        });\n        return element;\n    }\n});\n//# sourceMappingURL=VItem.js.map","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('div',{staticClass:\"text-xs-center\"},[_c('v-dialog',{attrs:{\"max-width\":\"310\",\"scrollable\":\"\"},model:{value:(_vm.dialog),callback:function ($$v) {_vm.dialog=$$v},expression:\"dialog\"}},[_c('v-card',{attrs:{\"color\":\"gray\",\"max-height\":\"500\"}},[_c('v-card-title',{staticClass:\"headline\",attrs:{\"primary-title\":\"\"}},[_vm._v(\"\\n        Velg symbol\\n      \")]),(_vm.dialog)?_c('v-card-text',[_c('v-container',{attrs:{\"grid-list-md\":\"\"}},[_c('v-item-group',{model:{value:(_vm.selectedIndex),callback:function ($$v) {_vm.selectedIndex=$$v},expression:\"selectedIndex\"}},[_c('v-layout',{attrs:{\"row\":\"\",\"wrap\":\"\",\"align-center\":\"\",\"justify-center\":\"\",\"justify-space-around\":\"\"}},_vm._l((_vm.symbols),function(item,i){return _c('v-item',{key:i,scopedSlots:_vm._u([{key:\"default\",fn:function({ active, toggle }){return _c('v-card',{staticClass:\"pa-3\",attrs:{\"flat\":\"\"},on:{\"click\":function($event){$event.stopPropagation();toggle;\n                    _vm.selectSymbol(i);}}},[_c('div',{staticStyle:{\"display\":\"table\"}},[_c('div',{staticStyle:{\"display\":\"table-cell\",\"vertical-align\":\"middle\"},domProps:{\"innerHTML\":_vm._s(item)}})])])}}],null,true)})}),1)],1)],1)],1):_vm._e(),_c('v-divider'),_c('v-card-actions',[_c('v-spacer'),_c('v-btn',{attrs:{\"color\":\"primary\",\"flat\":\"\"},on:{\"click\":_vm.closeDialog}},[_vm._v(\"\\n          Lukk\\n        \")])],1)],1)],1)],1)\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\r\n  <div class=\"text-xs-center\">\r\n    <v-dialog v-model=\"dialog\" max-width=\"310\" scrollable>\r\n      <v-card color=\"gray\" max-height=\"500\">\r\n        <v-card-title class=\"headline\" primary-title>\r\n          Velg symbol\r\n        </v-card-title>\r\n\r\n        <v-card-text v-if=\"dialog\">\r\n          <v-container grid-list-md>\r\n            <v-item-group v-model=\"selectedIndex\">\r\n              <v-layout\r\n                row\r\n                wrap\r\n                align-center\r\n                justify-center\r\n                justify-space-around\r\n              >\r\n                <v-item v-for=\"(item, i) in symbols\" :key=\"i\">\r\n                  <v-card\r\n                    flat\r\n                    class=\"pa-3\"\r\n                    slot-scope=\"{ active, toggle }\"\r\n                    @click.stop=\"\r\n                      toggle;\r\n                      selectSymbol(i);\r\n                    \"\r\n                  >\r\n                    <div style=\"display:table;\">\r\n                      <div\r\n                        style=\"display:table-cell;vertical-align:middle;\"\r\n                        v-html=\"item\"\r\n                      ></div>\r\n                    </div>\r\n                  </v-card>\r\n                </v-item>\r\n              </v-layout>\r\n            </v-item-group>\r\n          </v-container>\r\n        </v-card-text>\r\n\r\n        <v-divider></v-divider>\r\n\r\n        <v-card-actions>\r\n          <v-spacer></v-spacer>\r\n          <v-btn color=\"primary\" flat @click=\"closeDialog\">\r\n            Lukk\r\n          </v-btn>\r\n        </v-card-actions>\r\n      </v-card>\r\n    </v-dialog>\r\n  </div>\r\n</template>\r\n<script>\r\nexport default {\r\n  data() {\r\n    return {\r\n      dialog: false,\r\n      selectedIndex: 0,\r\n      theSvg: null\r\n    };\r\n  },\r\n  name: \"MapDrawingSymbolSelectionDialog\",\r\n  props: {\r\n    active: Boolean,\r\n    symbols: Array,\r\n    index: Number,\r\n    tool: String,\r\n    selectedSymbol: String\r\n  },\r\n  watch: {\r\n    active(val) {\r\n      this.dialog = val;\r\n    }\r\n  },\r\n  methods: {\r\n    selectSymbol: function(index) {\r\n      this.$emit(\"symbol-selected\", this.tool, index);\r\n    },\r\n    closeDialog: function() {\r\n      this.$emit(\"close-dialog\");\r\n    }\r\n  },\r\n  mounted() {\r\n    this.selectedIndex = this.index;\r\n  }\r\n};\r\n</script>\r\n<style scoped></style>\r\n","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!./MapDrawingSymbolSelectionDialog.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!./MapDrawingSymbolSelectionDialog.vue?vue&type=script&lang=js\"","import { render, staticRenderFns } from \"./MapDrawingSymbolSelectionDialog.vue?vue&type=template&id=94e2b8dc&scoped=true\"\nimport script from \"./MapDrawingSymbolSelectionDialog.vue?vue&type=script&lang=js\"\nexport * from \"./MapDrawingSymbolSelectionDialog.vue?vue&type=script&lang=js\"\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  \"94e2b8dc\",\n  null\n  \n)\n\nexport default component.exports","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('v-dialog',{attrs:{\"persistent\":\"\",\"fullscreen\":_vm.$vuetify.breakpoint.smAndDown,\"max-width\":\"500px\"},model:{value:(_vm.selectLayerDialog),callback:function ($$v) {_vm.selectLayerDialog=$$v},expression:\"selectLayerDialog\"}},[_c('v-card',[_c('v-card-title',{attrs:{\"primary-title\":\"\"}},[_c('span',{staticClass:\"headline mb-0\"},[_vm._v(\"Opprett/rediger tegnelag\")]),_c('v-spacer')],1),_c('v-card-text',[_c('v-radio-group',{attrs:{\"mandatory\":false},model:{value:(_vm.useExistingLayer),callback:function ($$v) {_vm.useExistingLayer=$$v},expression:\"useExistingLayer\"}},[_c('v-radio',{attrs:{\"label\":\"Rediger eksisterende tegnelag\",\"value\":true,\"color\":\"red\"}}),_c('v-radio',{attrs:{\"label\":\"Opprett nytt tegnelag\",\"value\":false,\"color\":\"red\"}})],1),(_vm.useExistingLayer)?_c('v-select',{attrs:{\"box\":\"\",\"no-data-text\":\"Det finnes ingen tegnelag\",\"label\":\"Velg tegnelag\",\"return-object\":true,\"items\":_vm.allAddedGraphicLayers,\"item-text\":\"appTitle\"},model:{value:(_vm.selectedMapProfile),callback:function ($$v) {_vm.selectedMapProfile=$$v},expression:\"selectedMapProfile\"}}):_vm._e(),(!_vm.useExistingLayer)?_c('v-text-field',{attrs:{\"label\":\"Gi tegnelaget et navn (obligatorisk)\",\"box\":\"\",\"full-width\":\"\",\"maxlength\":\"100\"},model:{value:(_vm.layerTitle),callback:function ($$v) {_vm.layerTitle=$$v},expression:\"layerTitle\"}}):_vm._e(),(!_vm.useExistingLayer)?_c('v-textarea',{attrs:{\"label\":\"Beskrivelse (valgfritt)\",\"maxlength\":\"500\",\"box\":\"\"},model:{value:(_vm.layerDescription),callback:function ($$v) {_vm.layerDescription=$$v},expression:\"layerDescription\"}}):_vm._e()],1),_c('v-card-actions',[_c('v-spacer'),_c('v-btn',{attrs:{\"color\":\"primary\",\"flat\":\"\"},on:{\"click\":_vm.cancelDialog}},[_vm._v(\"Avbryt\")]),_c('v-btn',{attrs:{\"color\":\"primary\",\"flat\":\"\",\"disabled\":(!_vm.useExistingLayer && !_vm.layerTitle) ||\n            (_vm.useExistingLayer && !_vm.selectedMapProfile)},on:{\"click\":_vm.loadExistingLayerOrAddNew}},[_vm._v(\"Ok\")])],1)],1)],1)\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\r\n  <v-dialog\r\n    persistent\r\n    :fullscreen=\"$vuetify.breakpoint.smAndDown\"\r\n    v-model=\"selectLayerDialog\"\r\n    max-width=\"500px\"\r\n  >\r\n    <v-card>\r\n      <v-card-title primary-title>\r\n        <span class=\"headline mb-0\">Opprett/rediger tegnelag</span>\r\n        <v-spacer></v-spacer>\r\n      </v-card-title>\r\n      <v-card-text>\r\n        <v-radio-group v-model=\"useExistingLayer\" :mandatory=\"false\">\r\n          <v-radio\r\n            label=\"Rediger eksisterende tegnelag\"\r\n            :value=\"true\"\r\n            color=\"red\"\r\n          ></v-radio>\r\n          <v-radio\r\n            label=\"Opprett nytt tegnelag\"\r\n            :value=\"false\"\r\n            color=\"red\"\r\n          ></v-radio>\r\n        </v-radio-group>\r\n        <v-select\r\n          box\r\n          no-data-text=\"Det finnes ingen tegnelag\"\r\n          label=\"Velg tegnelag\"\r\n          v-if=\"useExistingLayer\"\r\n          :return-object=\"true\"\r\n          :items=\"allAddedGraphicLayers\"\r\n          item-text=\"appTitle\"\r\n          v-model=\"selectedMapProfile\"\r\n        ></v-select>\r\n        <v-text-field\r\n          label=\"Gi tegnelaget et navn (obligatorisk)\"\r\n          v-if=\"!useExistingLayer\"\r\n          v-model=\"layerTitle\"\r\n          box\r\n          full-width\r\n          maxlength=\"100\"\r\n        ></v-text-field>\r\n        <v-textarea\r\n          label=\"Beskrivelse (valgfritt)\"\r\n          v-if=\"!useExistingLayer\"\r\n          v-model=\"layerDescription\"\r\n          maxlength=\"500\"\r\n          box\r\n        ></v-textarea>\r\n      </v-card-text>\r\n      <v-card-actions>\r\n        <v-spacer />\r\n        <v-btn color=\"primary\" flat @click=\"cancelDialog\">Avbryt</v-btn>\r\n        <v-btn\r\n          color=\"primary\"\r\n          flat\r\n          :disabled=\"\r\n            (!useExistingLayer && !layerTitle) ||\r\n              (useExistingLayer && !selectedMapProfile)\r\n          \"\r\n          @click=\"loadExistingLayerOrAddNew\"\r\n          >Ok</v-btn\r\n        >\r\n      </v-card-actions>\r\n    </v-card>\r\n  </v-dialog>\r\n</template>\r\n\r\n<script>\r\nimport { mapState, mapActions } from \"vuex\";\r\nimport MappingMixin from \"@/mixins/mappingMixin\";\r\nimport { loadModules } from \"esri-loader\";\r\nexport default {\r\n  name: \"MapDrawingAddOrEditDrawingLayerDialog\",\r\n  data: function() {\r\n    return {\r\n      selectLayerDialog: false,\r\n      newLayerTitle: \"\",\r\n      newLayerDescription: \"\",\r\n      useExistingLayer: false,\r\n      layerTitle: null,\r\n      layerDescription: null,\r\n      graphicsLayer: null\r\n    };\r\n  },\r\n  mixins: [MappingMixin],\r\n  mounted: function() {\r\n    this.openDialog();\r\n  },\r\n  computed: {\r\n    ...mapState([\"mapProfiles\"]),\r\n    selectedMapProfile: {\r\n      set(selectedMapProfile) {\r\n        this.setSelectedMapProfile(selectedMapProfile);\r\n      },\r\n      get() {\r\n        return this.$store.state.selectedMapProfile;\r\n      }\r\n    }\r\n  },\r\n  methods: {\r\n    ...mapActions([\r\n      \"addGraphicsLayer\",\r\n      \"updateMapProfileName\",\r\n      \"updateMapProfileDescription\",\r\n      \"setShowPopupsOnClick\",\r\n      \"setSelectedMapProfile\",\r\n      \"deactivateTool\"\r\n    ]),\r\n    openDialog: function() {\r\n      this.allAddedGraphicLayers = this.mapProfiles.filter(profile => {\r\n        return profile.type === \"graphicsLayer\";\r\n      });\r\n      this.selectLayerDialog = true;\r\n    },\r\n    closeDialog: function() {\r\n      this.selectLayerDialog = false;\r\n    },\r\n    cancelDialog: function() {\r\n      this.deactivateTool(\"drawing\");\r\n      this.closeDialog();\r\n    },\r\n    loadExistingLayerOrAddNew: function() {\r\n      if (this.selectedMapProfile) {\r\n        this.loadExistingGraphicsLayer();\r\n      } else {\r\n        this.addNewGraphicsLayer();\r\n      }\r\n    },\r\n    addNewGraphicsLayer: function() {\r\n      loadModules([\"esri/layers/GraphicsLayer\"]).then(([GraphicsLayer]) => {\r\n        let id = new Date().getTime().toString();\r\n        this.graphicsLayer = new GraphicsLayer({\r\n          id: id\r\n        });\r\n        this.$theMapObject.add(this.graphicsLayer);\r\n        this.addGraphicsLayer(id);\r\n        let newMapProfile = {\r\n          id: id,\r\n          showInfoMenu: false,\r\n          appTitle: this.layerTitle,\r\n          Temaforklaring: this.layerDescription\r\n        };\r\n        this.addMapProfile(newMapProfile);\r\n\r\n        this.setSelectedMapProfile(newMapProfile);\r\n        this.$emit(\"start-drawing\", this.graphicsLayer);\r\n        this.closeDialog();\r\n      });\r\n    },\r\n    loadExistingGraphicsLayer: function() {\r\n      this.graphicsLayer = this.$theMapObject.findLayerById(\r\n        this.selectedMapProfile.id\r\n      );\r\n      this.layerTitle = this.selectedMapProfile.appTitle;\r\n      this.layerDescription = this.selectedMapProfile.Temaforklaring;\r\n      this.$emit(\"start-drawing\", this.graphicsLayer);\r\n      this.closeDialog();\r\n    }\r\n  }\r\n};\r\n</script>\r\n\r\n<style></style>\r\n","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!./MapDrawingAddOrEditDrawingLayerDialog.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!./MapDrawingAddOrEditDrawingLayerDialog.vue?vue&type=script&lang=js\"","import { render, staticRenderFns } from \"./MapDrawingAddOrEditDrawingLayerDialog.vue?vue&type=template&id=91ba77fe\"\nimport script from \"./MapDrawingAddOrEditDrawingLayerDialog.vue?vue&type=script&lang=js\"\nexport * from \"./MapDrawingAddOrEditDrawingLayerDialog.vue?vue&type=script&lang=js\"\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","<template>\r\n  <div style=\"position: absolute; top: 10px; left: 0px;z-index: 10;\">\r\n    <v-dialog\r\n      persistent\r\n      class=\"elevation-2\"\r\n      width=\"280px\"\r\n      v-model=\"bottomSheetActive\"\r\n    >\r\n      <v-card style=\"border-radius: 5px;\">\r\n        <v-card-text class=\"ma-0 pa-1\">\r\n          <v-layout row justify-center align-center>\r\n            <v-text-field\r\n              box\r\n              ref=\"graphicTitleTextField\"\r\n              @keyup.enter=\"setGraphicTitle\"\r\n              color=\"grey\"\r\n              single-line\r\n              v-if=\"bottomSheetActive\"\r\n              autofocus\r\n              full-width\r\n              hide-details\r\n              label\r\n              v-model=\"graphicTitle\"\r\n              placeholder=\"Gi elementet et navn\"\r\n            ></v-text-field>\r\n          </v-layout>\r\n          <v-layout row justify-end align-end>\r\n            <v-btn\r\n              color=\"blue\"\r\n              block\r\n              dark\r\n              height=\"50px\"\r\n              depressed\r\n              @click=\"setGraphicTitle\"\r\n              >Lagre</v-btn\r\n            >\r\n            <v-btn @click=\"bottomSheetActive = false\" block depressed\r\n              >Ikke nå</v-btn\r\n            >\r\n          </v-layout>\r\n        </v-card-text>\r\n\r\n        <v-divider></v-divider>\r\n      </v-card>\r\n    </v-dialog>\r\n    <map-drawing-add-or-edit-drawing-layer-dialog\r\n      v-if=\"selectLayerDialog\"\r\n      @start-drawing=\"loadDrawing\"\r\n    />\r\n    <div></div>\r\n    <v-toolbar\r\n      :floating=\"$vuetify.breakpoint.mdAndUp\"\r\n      class=\"drawing-toolbar elevation-2\"\r\n      :class=\"\r\n        $vuetify.breakpoint.mdAndUp\r\n          ? 'drawing-toolbar-mdandup'\r\n          : 'drawing-toolbar-smanddown'\r\n      \"\r\n      v-show=\"selectLayerDialog == false && graphicsLayer !== null\"\r\n    >\r\n      <div\r\n        @click=\"setTool\"\r\n        style=\"background: transparent !important\"\r\n        id=\"sketchDiv\"\r\n      ></div>\r\n\r\n      <v-tooltip bottom>\r\n        <v-btn\r\n          slot=\"activator\"\r\n          flat\r\n          v-show=\"tool == 'point'\"\r\n          @click=\"selectedPointStyleDialogActive = true\"\r\n          class=\"choose-symbol-btn\"\r\n        >\r\n          <div\r\n            style=\"margin-top: 2px;\"\r\n            v-html=\"selectedRenderedPointStyle\"\r\n          ></div>\r\n        </v-btn>\r\n        <span>Velg symbol</span>\r\n      </v-tooltip>\r\n\r\n      <v-tooltip bottom>\r\n        <v-btn\r\n          slot=\"activator\"\r\n          flat\r\n          v-show=\"tool === 'polyline'\"\r\n          @click=\"selectedPolylineStyleDialogActive = true\"\r\n          class=\"choose-symbol-btn\"\r\n        >\r\n          <div\r\n            style=\"margin-top: 2px;\"\r\n            v-html=\"selectedRenderedLineStyle\"\r\n          ></div>\r\n        </v-btn>\r\n        <span>Velg symbol</span>\r\n      </v-tooltip>\r\n\r\n      <v-tooltip bottom>\r\n        <v-btn\r\n          slot=\"activator\"\r\n          depressed\r\n          v-show=\"\r\n            tool === 'polygon' || tool === 'circle' || tool === 'rectangle'\r\n          \"\r\n          @click=\"selectedPolygonStyleDialogActive = true\"\r\n          class=\"choose-symbol-btn\"\r\n        >\r\n          <div\r\n            style=\"margin-top: 2px;\"\r\n            v-html=\"selectedRenderedPolygonStyle\"\r\n          ></div>\r\n        </v-btn>\r\n        <span>Velg symbol</span>\r\n      </v-tooltip>\r\n\r\n      <map-drawing-symbol-selection-dialog\r\n        :index=\"selectedRenderedPointStyleIndex\"\r\n        v-show=\"tool === 'point'\"\r\n        :active=\"selectedPointStyleDialogActive\"\r\n        tool=\"point\"\r\n        :symbols=\"renderedPointStyles\"\r\n        @symbol-selected=\"setSelectedStyle\"\r\n        @close-dialog=\"closeSymbolSelectionDialogs\"\r\n      />\r\n      <map-drawing-symbol-selection-dialog\r\n        :index=\"selectedRenderedLineStyleIndex\"\r\n        :active=\"selectedPolylineStyleDialogActive\"\r\n        v-show=\"tool === 'polyline'\"\r\n        tool=\"polyline\"\r\n        :symbols=\"renderedLineStyles\"\r\n        @symbol-selected=\"setSelectedStyle\"\r\n        @close-dialog=\"closeSymbolSelectionDialogs\"\r\n      />\r\n      <map-drawing-symbol-selection-dialog\r\n        :index=\"selectedRenderedPolygonStyleIndex\"\r\n        :active=\"selectedPolygonStyleDialogActive\"\r\n        v-show=\"updateGraphics !== 0\"\r\n        tool=\"polygon\"\r\n        :symbols=\"renderedPolygonStyles\"\r\n        @symbol-selected=\"setSelectedStyle\"\r\n        @close-dialog=\"closeSymbolSelectionDialogs\"\r\n      />\r\n\r\n      <v-spacer></v-spacer>\r\n      <v-tooltip bottom>\r\n        <v-btn slot=\"activator\" small @click=\"close\" flat color=\"blue\"\r\n          >Avslutt</v-btn\r\n        >\r\n        <span>Avslutt tegneverktøy</span>\r\n      </v-tooltip>\r\n\r\n      <map-drawing-change-layer-name-dialog\r\n        v-if=\"selectedMapProfile\"\r\n        :active=\"changeLayerNameDialogActive\"\r\n        :current-name=\"selectedMapProfile.appTitle\"\r\n        :current-description=\"selectedMapProfile.Temaforklaring\"\r\n        @close-dialog=\"deactivateChangeLayerNameDialog\"\r\n        :layer=\"selectedMapProfile\"\r\n      ></map-drawing-change-layer-name-dialog>\r\n    </v-toolbar>\r\n    <v-slide-y-transition>\r\n      <v-toolbar\r\n        absolute\r\n        v-show=\"updateGraphics !== 0\"\r\n        width=\"300px\"\r\n        dense\r\n        :class=\"\r\n          $vuetify.breakpoint.mdAndUp\r\n            ? 'edit-toolbar-mdandup'\r\n            : 'edit-toolbar-smanddown'\r\n        \"\r\n        :style=\"{\r\n          width: $vuetify.breakpoint.mdAndUp ? '483px' : '100vw'\r\n        }\"\r\n      >\r\n        <v-tooltip bottom>\r\n          <v-btn\r\n            class=\"ml-2\"\r\n            slot=\"activator\"\r\n            small\r\n            flat\r\n            color=\"blue\"\r\n            @click=\"openStyleDialogBasedOnGraphicBeingEdited\"\r\n            >Endre symbol</v-btn\r\n          >\r\n\r\n          <span>Endre symbolet til elementet</span>\r\n        </v-tooltip>\r\n\r\n        <v-tooltip bottom v-show=\"updateGraphics !== 0\">\r\n          <v-btn\r\n            class=\"ml-2\"\r\n            slot=\"activator\"\r\n            small\r\n            flat\r\n            :disabled=\"updateGraphics > 1\"\r\n            color=\"blue\"\r\n            @click=\"activateBottomSheet(lastAddedGraphic)\"\r\n            >Endre navn</v-btn\r\n          >\r\n\r\n          <span>Endre navnet til elementet</span>\r\n        </v-tooltip>\r\n\r\n        <v-tooltip bottom v-show=\"updateGraphics !== 0\">\r\n          <v-btn\r\n            class=\"ml-2\"\r\n            slot=\"activator\"\r\n            small\r\n            flat\r\n            color=\"blue\"\r\n            @click=\"deleteSelectedGraphics\"\r\n            >Fjern element</v-btn\r\n          >\r\n\r\n          <span>Fjern elementet fra kartlaget</span>\r\n        </v-tooltip>\r\n      </v-toolbar>\r\n    </v-slide-y-transition>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport { loadModules } from \"esri-loader\";\r\nimport MappingMixin from \"@/mixins/mappingMixin\";\r\nimport { mapState, mapActions, mapGetters } from \"vuex\";\r\nimport MapDrawingSymbolSelectionDialog from \"@/pages/MapPage/Tools/Drawing/MapDrawingSymbolSelectionDialog\";\r\nimport MapDrawingAddOrEditDrawingLayerDialog from \"@/pages/MapPage/Tools/Drawing/MapDrawingAddOrEditDrawingLayerDialog\";\r\nimport MapDrawingChangeLayerNameDialog from \"@/pages/MapPage/Tools/Drawing/MapDrawingChangeLayerNameDialog\";\r\nexport default {\r\n  name: \"MapDrawing\",\r\n  components: {\r\n    MapDrawingSymbolSelectionDialog,\r\n    MapDrawingAddOrEditDrawingLayerDialog,\r\n    MapDrawingChangeLayerNameDialog\r\n  },\r\n  mixins: [MappingMixin],\r\n  data: function() {\r\n    return {\r\n      changeLayerNameDialogActive: false,\r\n      bottomSheetActive: false,\r\n      polygonStyles: [\r\n        \"solid\",\r\n        \"backward-diagonal\",\r\n        \"cross\",\r\n        \"vertical\",\r\n        \"forward-diagonal\",\r\n        \"horizontal\"\r\n      ],\r\n      lineStyles: [\"solid\", \"dash\", \"dash-dot\", \"dot\"],\r\n      drawingTools: [\r\n        {\r\n          name: \"point\",\r\n          icon: \"esri-icon-map-pin\",\r\n          tooltip: \"Punkt\"\r\n        },\r\n        {\r\n          name: \"polyline\",\r\n          icon: \"esri-icon-polyline\",\r\n          tooltip: \"Linje\"\r\n        },\r\n        {\r\n          name: \"polygon\",\r\n          icon: \"esri-icon-polygon\",\r\n          tooltip: \"Flate\"\r\n        },\r\n        {\r\n          name: \"transform\",\r\n          icon: \"edit\",\r\n          tooltip: \"Rediger\"\r\n        }\r\n      ],\r\n      selectedPointStyleDialogActive: false,\r\n      selectedPolylineStyleDialogActive: false,\r\n      selectedPolygonStyleDialogActive: false,\r\n      sketchViewModel: null,\r\n      graphics: [],\r\n      graphicsLayer: null,\r\n      tool: \"\",\r\n      selectLayerDialog: false,\r\n      selectedRenderedPointStyleIndex: null,\r\n      selectedRenderedLineStyleIndex: null,\r\n      selectedRenderedPolygonStyleIndex: null,\r\n      updateGraphics: 0,\r\n      selected: [],\r\n      lineSymbols: [],\r\n      polygonSymbols: [],\r\n      pointSymbols: [],\r\n      pointMarkerStyles: [\"circle\", \"diamond\", \"square\"],\r\n      pointMarkerSymbols: [],\r\n      showBottomSheetTextField: false,\r\n      iconSize: 14,\r\n      lineWidth: 2,\r\n      iconSizes: [4, 6, 12, 16],\r\n      lineWidths: [1, 2, 3],\r\n      opacities: [0.2, 0.4, 0.6, 1.0],\r\n      graphicTitle: \"\",\r\n      renderedPointStyles: [],\r\n      renderedLineStyles: [],\r\n      renderedPolygonStyles: [],\r\n      counter: 0,\r\n      colors: [\r\n        { title: \"Blå\", rgb: [32, 150, 243] },\r\n        { title: \"Grønn\", rgb: [75, 175, 80] },\r\n        { title: \"Rød\", rgb: [244, 67, 54] },\r\n        { title: \"Gul\", rgb: [255, 235, 58] },\r\n        { title: \"Oransje\", rgb: [254, 152, 2] },\r\n        { title: \"Rosa\", rgb: [233, 30, 99] },\r\n        { title: \"Svart\", rgb: [0, 0, 0] }\r\n      ],\r\n      selectedRenderedGraphic: null,\r\n      selectedRenderedGraphicStyle: null,\r\n      selectedRenderedGraphicNewSymbol: null,\r\n      lastAddedGraphic: null\r\n    };\r\n  },\r\n\r\n  computed: {\r\n    ...mapState([\"mapProfiles\", \"pointStyles\", \"is3d\", \"userSettings\"]),\r\n    ...mapGetters([\"getDrawPointSymbols\"]),\r\n    selectedMapProfile: {\r\n      set(selectedMapProfile) {\r\n        this.setSelectedMapProfile(selectedMapProfile);\r\n      },\r\n      get() {\r\n        return this.$store.state.selectedMapProfile;\r\n      }\r\n    },\r\n    selectedRenderedPointStyle() {\r\n      return this.selectedRenderedPointStyleIndex !== null\r\n        ? this.renderedPointStyles[this.selectedRenderedPointStyleIndex]\r\n        : this.renderedPointStyles[0];\r\n    },\r\n    selectedRenderedLineStyle() {\r\n      return this.selectedRenderedLineStyleIndex\r\n        ? this.renderedLineStyles[this.selectedRenderedLineStyleIndex]\r\n        : this.renderedLineStyles[0];\r\n    },\r\n    selectedRenderedPolygonStyle() {\r\n      return this.selectedRenderedPolygonStyleIndex\r\n        ? this.renderedPolygonStyles[this.selectedRenderedPolygonStyleIndex]\r\n        : this.renderedPolygonStyles[0];\r\n    }\r\n  },\r\n  watch: {\r\n    bottomSheetActive(newVal) {\r\n      if (!newVal) {\r\n        this.graphicTitle = \"\";\r\n      }\r\n    },\r\n    is3d(newVal, oldVal) {\r\n      if (newVal !== oldVal)\r\n        this.sketchViewModel.view = newVal\r\n          ? this.$theSceneViewObject\r\n          : this.$theMapViewObject;\r\n    }\r\n  },\r\n  methods: {\r\n    ...mapActions([\r\n      \"setShowPopupsOnClick\",\r\n      \"setSelectedMapProfile\",\r\n      \"addGraphicsLayer\",\r\n      \"deactivateTool\"\r\n    ]),\r\n    setTool: function(evt) {\r\n      evt.target.className;\r\n      if (evt.target && evt.target.className.includes(\"polygon\")) {\r\n        this.tool = \"polygon\";\r\n      } else if (evt.target && evt.target.className.includes(\"radio\")) {\r\n        this.tool = \"polygon\";\r\n      } else if (evt.target && evt.target.className.includes(\"checkbox\")) {\r\n        this.tool = \"polygon\";\r\n      } else if (evt.target && evt.target.className.includes(\"polyline\")) {\r\n        this.tool = \"polyline\";\r\n      } else if (evt.target && evt.target.className.includes(\"map-pin\")) {\r\n        this.tool = \"point\";\r\n      } else {\r\n        this.tool = null;\r\n      }\r\n    },\r\n    deactivateChangeLayerNameDialog() {\r\n      this.changeLayerNameDialogActive = false;\r\n    },\r\n    activateChangeLayerNameDialog() {\r\n      this.changeLayerNameDialogActive = true;\r\n    },\r\n    setGraphicTitle: function() {\r\n      this.$set(\r\n        this.lastAddedGraphic.attributes,\r\n        \"name\",\r\n        this.graphicTitle ? this.graphicTitle : \"\"\r\n      );\r\n      this.$set(this.lastAddedGraphic, \"popupTemplate\", {\r\n        title: this.graphicTitle ? \"{name}\" : \"\"\r\n      });\r\n      let text = this.graphicTitle;\r\n      this.updateTextSymbol(this.lastAddedGraphic, text);\r\n\r\n      this.graphicTitle = \"\";\r\n      this.bottomSheetActive = false;\r\n\r\n      this.$eventHub.$emit(\"graphicslayer-updated\", this.graphicsLayer.id);\r\n    },\r\n    updateTextSymbol: function(graphic, text) {\r\n      loadModules([\"esri/symbols/TextSymbol\"]).then(([TextSymbol]) => {\r\n        if (graphic.symbol.type === \"text\") {\r\n          let textSymbolJSON = graphic.symbol.toJSON();\r\n          textSymbolJSON.text = text ? text : \"Uten navn\";\r\n          graphic.symbol = TextSymbol.fromJSON(textSymbolJSON);\r\n        }\r\n      });\r\n    },\r\n    openStyleDialogBasedOnGraphicBeingEdited: function() {\r\n      if (this.selectedRenderedGraphic !== null) {\r\n        switch (this.selectedRenderedGraphic.geometry.type) {\r\n          case \"point\":\r\n            this.selectedPointStyleDialogActive = true;\r\n            break;\r\n          case \"polyline\":\r\n            this.selectedPolylineStyleDialogActive = true;\r\n            break;\r\n          case \"polygon\":\r\n            this.selectedPolygonStyleDialogActive = true;\r\n            break;\r\n        }\r\n      }\r\n    },\r\n    closeSymbolSelectionDialogs: function() {\r\n      this.selectedPointStyleDialogActive = false;\r\n      this.selectedPolylineStyleDialogActive = false;\r\n      this.selectedPolygonStyleDialogActive = false;\r\n    },\r\n    deleteSelectedGraphics: function() {\r\n      this.graphicsLayer.removeMany(\r\n        this.sketchViewModel.viewModel.updateGraphics.items\r\n      );\r\n      this.graphicsLayer.removeMany(\r\n        this.sketchViewModel.viewModel.updateGraphics.moved\r\n      );\r\n      this.sketchViewModel.cancel();\r\n    },\r\n    setSelectedStyle: function(tool, index) {\r\n      this.closeSymbolSelectionDialogs();\r\n      switch (tool) {\r\n        case \"point\":\r\n          if (this.selectedRenderedGraphic == null) {\r\n            this.sketchViewModel.viewModel.pointSymbol = this.pointSymbols[\r\n              index\r\n            ];\r\n            this.selectedRenderedPointStyleIndex = index;\r\n          } else {\r\n            this.selectedRenderedGraphicNewSymbol = this.pointSymbols[index];\r\n          }\r\n\r\n          break;\r\n        case \"polyline\":\r\n          if (this.selectedRenderedGraphic == null) {\r\n            this.sketchViewModel.viewModel.polylineSymbol = this.lineSymbols[\r\n              index\r\n            ];\r\n            this.selectedRenderedLineStyleIndex = index;\r\n          } else {\r\n            this.selectedRenderedGraphicNewSymbol = this.lineSymbols[index];\r\n          }\r\n          break;\r\n        default:\r\n          if (this.selectedRenderedGraphic == null) {\r\n            this.sketchViewModel.viewModel.polygonSymbol = this.polygonSymbols[\r\n              index\r\n            ];\r\n            this.selectedRenderedPolygonStyleIndex = index;\r\n          } else {\r\n            this.selectedRenderedGraphicNewSymbol = this.polygonSymbols[index];\r\n          }\r\n          break;\r\n      }\r\n      this.updateTool();\r\n    },\r\n    close: function() {\r\n      this.setShowPopupsOnClick(true);\r\n\r\n      this.closeAndResetBottomSheet();\r\n      this.selectLayerDialog = false;\r\n\r\n      loadModules([\"esri/widgets/Popup\"]).then(([Popup]) => {\r\n        this.$theMapViewObject.popup = new Popup();\r\n        this.$theMapViewObject.popup.dockOptions = {\r\n          breakpoint: {\r\n            width: 600,\r\n            height: 544\r\n          },\r\n          position: \"bottom-center\"\r\n        };\r\n        if (this.$theSceneViewObject) {\r\n          this.$theSceneViewObject.popup = new Popup();\r\n          this.$theSceneViewObject.popup.dockOptions = {\r\n            breakpoint: {\r\n              width: 600,\r\n              height: 544\r\n            },\r\n            position: \"bottom-center\"\r\n          };\r\n          this.enablePopupGeometryHighlight(this.$theSceneViewObject);\r\n        }\r\n\r\n        this.enablePopupGeometryHighlight(this.$theMapViewObject);\r\n\r\n        if (this.sketchViewModel) {\r\n          this.sketchViewModel.updateOnGraphicClick = false;\r\n          this.sketchViewModel.cancel();\r\n          this.sketchViewModel.destroy();\r\n        }\r\n\r\n        this.tool = \"\";\r\n        this.setSelectedMapProfile(null);\r\n        this.deactivateTool(\"drawing\");\r\n      });\r\n    },\r\n    closeAndResetBottomSheet() {\r\n      this.graphicTitle = \"\";\r\n      this.lastAddedGraphic = null;\r\n      this.bottomSheetActive = false;\r\n    },\r\n    updateTool: function() {\r\n      if (this.sketchViewModel) {\r\n        this.sketchViewModel.cancel();\r\n      } else {\r\n        return;\r\n      }\r\n\r\n      this.create(this.tool);\r\n    },\r\n    activateTool: function(tool) {\r\n      this.closeAndResetBottomSheet();\r\n      this.sketchViewModel.cancel();\r\n      if (tool !== \"reshape\" && tool !== \"transform\") {\r\n        this.create(tool);\r\n      } else {\r\n        this.sketchViewModel.defaultUpdateOptions = {\r\n          tool: tool\r\n        };\r\n        this.sketchViewModel.updateOnGraphicClick = true;\r\n      }\r\n    },\r\n    create: function(tool) {\r\n      this.sketchViewModel.create(tool, {\r\n        mode: \"click\"\r\n      });\r\n    },\r\n    activateBottomSheet: function(graphic) {\r\n      this.showBottomSheetTextField = false;\r\n      setTimeout(() => {\r\n        this.bottomSheetActive = false;\r\n      }, 500);\r\n      this.lastAddedGraphic = graphic;\r\n      setTimeout(() => {\r\n        this.bottomSheetActive = true;\r\n      }, 500);\r\n    },\r\n    getSymbolHtml: function(symbol) {\r\n      return new Promise((resolve, reject) => {\r\n        if (symbol.type == \"web-style\") {\r\n          resolve(\r\n            '<img src=\"/svg/' + symbol.name.replace(/\\s/g, \"\") + '.svg\" />'\r\n          );\r\n          return;\r\n        }\r\n\r\n        return loadModules([\"esri/symbols/support/symbolUtils\"])\r\n          .then(function([symbolUtils]) {\r\n            if (typeof symbol === \"object\") {\r\n              symbolUtils\r\n                .renderPreviewHTML(symbol)\r\n                .then(result => {\r\n                  // Linje under setter en stroke på generert svg preview av symbolet (dette gjøres ikke av ArcGIS selv)\r\n                  result.firstChild.children[1].firstChild.attributes.stroke.value =\r\n                    \"black\";\r\n                  resolve(result.outerHTML);\r\n                })\r\n                .catch(error => {\r\n                  console.error(error);\r\n                });\r\n            } else {\r\n              resolve(symbol);\r\n            }\r\n          })\r\n          .catch(error => {\r\n            reject(error);\r\n          });\r\n      });\r\n    },\r\n    loadDrawing: function(graphicsLayer) {\r\n      this.selectedMapProfile.open = true;\r\n      if (this.sketchViewModel) {\r\n        this.sketchViewModel.destroy();\r\n      }\r\n      this.setPopupEnabled(false);\r\n      this.$theMapViewObject.popup = null;\r\n      if (this.$theSceneViewObject) {\r\n        this.$theSceneViewObject.popup = null;\r\n      }\r\n\r\n      this.setShowPopupsOnClick(false);\r\n\r\n      this.selectLayerDialog = false;\r\n\r\n      loadModules([\r\n        \"esri/widgets/Sketch\",\r\n        \"esri/symbols/support/symbolUtils\"\r\n      ]).then(\r\n        function([Sketch, symbolUtils]) {\r\n          this.graphicsLayer = graphicsLayer;\r\n\r\n          this.sketchViewModel = new Sketch({\r\n            layer: this.graphicsLayer,\r\n            creationMode: this.userSettings.drawingCreationMode,\r\n            defaultCreateOptions: {\r\n              hasZ: this.userSettings.useZvaluesWhenDrawingIn3D,\r\n              mode: this.userSettings.drawingInputMode\r\n            },\r\n            view: this.is3d ? this.$theSceneViewObject : this.$theMapViewObject,\r\n            container: \"sketchDiv\"\r\n          });\r\n\r\n          this.generateSymbols();\r\n\r\n          this.graphicsLayer.watch(\r\n            \"graphics\",\r\n            function(graphics) {\r\n              this.graphics = graphics.items;\r\n            }.bind(this)\r\n          );\r\n\r\n          this.sketchViewModel.viewModel.updateGraphics.on(\r\n            \"change\",\r\n            function(graphics) {\r\n              this.updateGraphics = graphics.added.length;\r\n            }.bind(this)\r\n          );\r\n\r\n          this.sketchViewModel.on(\r\n            \"update\",\r\n            function(event) {\r\n              if (event.state === \"start\") {\r\n                let graphic = event.graphics[0];\r\n                this.lastAddedGraphic = graphic;\r\n                this.graphicTitle = graphic.attributes.name;\r\n\r\n                this.selectedRenderedGraphic = graphic;\r\n                if (graphic.htmlSymbol) {\r\n                  this.selectedRenderedGraphicStyle =\r\n                    graphic.htmlSymbol.outerHTML;\r\n                } else {\r\n                  symbolUtils.renderPreviewHTML(graphic.symbol).then(result => {\r\n                    this.selectedRenderedGraphicStyle = result;\r\n                  });\r\n                }\r\n              }\r\n              if (event.state === \"complete\" || event.aborted) {\r\n                this.selectedRenderedGraphicStyle = null;\r\n                this.selectedRenderedGraphic = null;\r\n\r\n                event.graphics.forEach(graphic => {\r\n                  if (this.selectedRenderedGraphicNewSymbol) {\r\n                    if (\r\n                      graphic.geometry.type === \"point\" &&\r\n                      this.selectedRenderedGraphicNewSymbol.type ===\r\n                        \"simple-fill\"\r\n                    ) {\r\n                      return;\r\n                    } else {\r\n                      graphic.symbol = this.selectedRenderedGraphicNewSymbol;\r\n\r\n                      symbolUtils\r\n                        .renderPreviewHTML(graphic.symbol)\r\n                        .then(result => {\r\n                          graphic.htmlSymbol = result;\r\n                        });\r\n                    }\r\n                  }\r\n\r\n                  this.updateTextSymbol(graphic, graphic.attributes.name);\r\n\r\n                  this.$set(graphic, \"popupTemplate\", {\r\n                    title: this.graphicTitle ? \"{name}\" : \"\"\r\n                  });\r\n                  this.graphicTitle = \"\";\r\n                });\r\n                this.selectedRenderedGraphicNewSymbol = null;\r\n              }\r\n            }.bind(this)\r\n          );\r\n\r\n          this.sketchViewModel.on(\r\n            \"create\",\r\n            function(event) {\r\n              if (event.state === \"complete\") {\r\n                this.activateBottomSheet(event.graphic);\r\n\r\n                this.$set(event.graphic, \"attributes\", {\r\n                  id: this.counter,\r\n                  name: \"\"\r\n                });\r\n\r\n                event.graphic.name = \"\";\r\n                event.graphic.id = this.counter;\r\n                this.counter++;\r\n                symbolUtils\r\n                  .renderPreviewHTML(event.graphic.symbol)\r\n                  .then(result => {\r\n                    event.graphic.htmlSymbol = result;\r\n                  });\r\n\r\n                this.graphics = this.graphicsLayer.graphics.items;\r\n\r\n                this.tool = null;\r\n              }\r\n            }.bind(this)\r\n          );\r\n\r\n          // setTimeout(() => {\r\n          //   document.getElementsByClassName(\r\n          //     \"esri-sketch__button esri-icon-pan\"\r\n          //   )[0].title = \"Rediger form og størrelse\";\r\n\r\n          //   document.getElementsByClassName(\r\n          //     \"esri-sketch__button esri-icon-cursor\"\r\n          //   )[0].title = \"Rediger knekkpunkter\";\r\n          // }, 2000);\r\n        }.bind(this)\r\n      );\r\n    },\r\n\r\n    generateLineSymbols: function() {\r\n      this.lineSymbols = [];\r\n      this.colors.forEach(color => {\r\n        this.lineStyles.forEach(lineStyle => {\r\n          this.lineWidths.forEach(lineWidth => {\r\n            this.lineSymbols.push({\r\n              type: \"simple-line\",\r\n              style: lineStyle,\r\n              width: lineWidth,\r\n              color: color.rgb\r\n            });\r\n          });\r\n        });\r\n      });\r\n      this.sketchViewModel.viewModel.polylineSymbol = this.lineSymbols[2];\r\n    },\r\n    generatePolygonSymbols: function() {\r\n      this.polygonSymbols = [];\r\n      this.colors.forEach(color => {\r\n        this.opacities.forEach(opacity => {\r\n          let colorWithOpacity = color.rgb.concat([opacity]);\r\n\r\n          this.polygonSymbols.push({\r\n            type: \"simple-fill\",\r\n            style: \"solid\",\r\n            outline: { color: [0, 0, 0, 0.95] },\r\n            color: colorWithOpacity\r\n          });\r\n        });\r\n      });\r\n      // Transparent polygon med sort omriss\r\n      this.polygonSymbols.push({\r\n        type: \"simple-fill\",\r\n        style: \"none\",\r\n        outline: { color: [0, 0, 0, 0.95], width: 2 },\r\n        color: [0, 0, 0, 0.0]\r\n      });\r\n      this.sketchViewModel.viewModel.polygonSymbol = this.polygonSymbols[0];\r\n    },\r\n    generatePointSymbols: function() {\r\n      let pointMarkerSymbols = [];\r\n      this.iconSizes.forEach(size => {\r\n        this.colors.forEach(color => {\r\n          this.pointMarkerStyles.forEach(markerStyle => {\r\n            pointMarkerSymbols.push({\r\n              type: \"simple-marker\",\r\n              size: size,\r\n\r\n              style: markerStyle,\r\n              color: color.rgb\r\n            });\r\n          });\r\n        });\r\n      });\r\n      this.pointSymbols = this.pointStyles.concat(pointMarkerSymbols);\r\n      this.sketchViewModel.viewModel.pointSymbol = this.pointSymbols[0];\r\n    },\r\n    generateSymbols: function() {\r\n      this.generateLineSymbols();\r\n      this.generatePolygonSymbols();\r\n      this.generatePointSymbols();\r\n\r\n      this.pointSymbols.forEach(symbol => {\r\n        this.getSymbolHtml(symbol).then(result => {\r\n          this.renderedPointStyles.push(result);\r\n        });\r\n      });\r\n\r\n      this.lineSymbols.forEach(symbol => {\r\n        this.getSymbolHtml(symbol).then(result => {\r\n          this.renderedLineStyles.push(result);\r\n        });\r\n      });\r\n\r\n      this.polygonSymbols.forEach(symbol => {\r\n        this.getSymbolHtml(symbol).then(result => {\r\n          this.renderedPolygonStyles.push(result);\r\n        });\r\n      });\r\n    },\r\n    addNewGraphicsLayer: function() {\r\n      loadModules([\"esri/layers/GraphicsLayer\"]).then(([GraphicsLayer]) => {\r\n        let id = new Date().getTime().toString();\r\n        let graphicsLayer = new GraphicsLayer({\r\n          id: id\r\n        });\r\n        this.$theMapObject.add(graphicsLayer);\r\n        this.addGraphicsLayer(id);\r\n        let newMapProfile = {\r\n          id: id,\r\n          showInfoMenu: false,\r\n          appTitle: \"Tegnelag\",\r\n          Temaforklaring: \"\",\r\n          open: true\r\n        };\r\n        this.addMapProfile(newMapProfile);\r\n\r\n        this.setSelectedMapProfile(newMapProfile);\r\n        this.loadDrawing(graphicsLayer);\r\n      });\r\n    }\r\n  },\r\n  mounted() {\r\n    if (this.selectedMapProfile == null) {\r\n      let allAddedGraphicLayers = this.mapProfiles.filter(profile => {\r\n        return profile.type === \"graphicsLayer\";\r\n      });\r\n      if (allAddedGraphicLayers.length > 0) {\r\n        this.selectLayerDialog = true;\r\n      } else {\r\n        this.addNewGraphicsLayer();\r\n      }\r\n    } else {\r\n      let graphicsLayer = this.$theMapObject.findLayerById(\r\n        this.selectedMapProfile.id\r\n      );\r\n\r\n      this.loadDrawing(graphicsLayer);\r\n    }\r\n  }\r\n};\r\n</script>\r\n\r\n<style>\r\n.v-btn-toggle .v-btn {\r\n  opacity: 1;\r\n}\r\n\r\n.draw-button {\r\n  height: 60px;\r\n}\r\n\r\n.choose-symbol-btn {\r\n  margin: 10px !important;\r\n  margin-top: 14px !important;\r\n  max-height: 37px;\r\n  min-width: 40px;\r\n}\r\n\r\n.editing-action-btn {\r\n  position: absolute;\r\n  left: 10px;\r\n  min-width: 30px;\r\n}\r\n\r\n.esri-sketch__panel.esri-sketch__info-panel {\r\n  display: none !important;\r\n}\r\n\r\n.edit-dialog.v-dialog {\r\n  position: absolute;\r\n  top: 8px;\r\n  right: 0px;\r\n  margin: 10px;\r\n}\r\n\r\n.drawing-toolbar-mdandup {\r\n  z-index: 1000;\r\n  margin-top: 10px;\r\n  margin-left: 10px;\r\n  border-radius: 5px;\r\n  margin-bottom: 0px;\r\n}\r\n\r\n.drawing-toolbar-smanddown {\r\n  z-index: 1000;\r\n  position: absolute;\r\n  overflow-x: scroll;\r\n  overflow-y: hidden;\r\n  top: -10px;\r\n  border-radius: 0px;\r\n  margin-bottom: 0px;\r\n  margin-left: 0px;\r\n  width: 100vw;\r\n}\r\n\r\n.edit-toolbar-mdandup {\r\n  z-index: 999;\r\n  margin: 0px;\r\n  left: 10px;\r\n  border-radius: 5px;\r\n  top: 60px;\r\n  width: 470px;\r\n}\r\n\r\n.edit-toolbar-smanddown {\r\n  z-index: 999;\r\n  margin: 0px;\r\n  left: 0px;\r\n  border-radius: 5px;\r\n  top: 50px;\r\n}\r\n</style>\r\n","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!./MapDrawing.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!./MapDrawing.vue?vue&type=script&lang=js\"","import { render, staticRenderFns } from \"./MapDrawing.vue?vue&type=template&id=046d7163\"\nimport script from \"./MapDrawing.vue?vue&type=script&lang=js\"\nexport * from \"./MapDrawing.vue?vue&type=script&lang=js\"\nimport style0 from \"./MapDrawing.vue?vue&type=style&index=0&id=046d7163&prod&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  null,\n  null\n  \n)\n\nexport default component.exports","export * from \"-!../../../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--6-oneOf-1-0!../../../../../node_modules/css-loader/index.js??ref--6-oneOf-1-1!../../../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../../node_modules/postcss-loader/src/index.js??ref--6-oneOf-1-2!../../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./MapDrawing.vue?vue&type=style&index=0&id=046d7163&prod&lang=css\""],"sourceRoot":""}