{"remainingRequest":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/vue-loader/lib/index.js??vue-loader-options!/home/cmiss/Jenkins/workspace/mapintegratedvuer/src/components/SplitpanesBar.vue?vue&type=script&lang=js&","dependencies":[{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/src/components/SplitpanesBar.vue","mtime":1684565818321},{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/cache-loader/dist/cjs.js","mtime":499162500000},{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/thread-loader/dist/cjs.js","mtime":499162500000},{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/babel-loader/lib/index.js","mtime":456789000000},{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/cache-loader/dist/cjs.js","mtime":499162500000},{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/vue-loader/lib/index.js","mtime":499162500000}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:Ci8qIGVzbGludC1kaXNhYmxlIG5vLWFsZXJ0LCBuby1jb25zb2xlICovCmltcG9ydCBWdWUgZnJvbSAidnVlIjsKaW1wb3J0IEV2ZW50QnVzIGZyb20gJy4vRXZlbnRCdXMnOwppbXBvcnQgc3RvcmUgZnJvbSAiLi4vc3RvcmUiOwppbXBvcnQgU2VhcmNoQ29udHJvbHMgZnJvbSAnLi9TZWFyY2hDb250cm9scyc7CmltcG9ydCB7IElucHV0LCBPcHRpb24sIFBvcG92ZXIsIFJvdywgU2VsZWN0IH0gZnJvbSAiZWxlbWVudC11aSI7CmltcG9ydCBsYW5nIGZyb20gImVsZW1lbnQtdWkvbGliL2xvY2FsZS9sYW5nL2VuIjsKaW1wb3J0IGxvY2FsZSBmcm9tICJlbGVtZW50LXVpL2xpYi9sb2NhbGUiOwoKbG9jYWxlLnVzZShsYW5nKTsKVnVlLnVzZShJbnB1dCk7ClZ1ZS51c2UoT3B0aW9uKTsKVnVlLnVzZShTZWxlY3QpOwpWdWUudXNlKFBvcG92ZXIpOwpWdWUudXNlKFJvdyk7CgpleHBvcnQgZGVmYXVsdCB7CiAgbmFtZTogIlNwbGl0cGFuZXNCYXIiLAogIGNvbXBvbmVudHM6IHsKICAgIFNlYXJjaENvbnRyb2xzLAogIH0sCiAgcHJvcHM6IHsKICAgIGVudHJpZXM6IHsKICAgICAgdHlwZTogQXJyYXksCiAgICAgIGRlZmF1bHQ6IGZ1bmN0aW9uKCkgewogICAgICAgIHJldHVybiBbXTsKICAgICAgfQogICAgfSwKICAgIHNwbGl0dGVyMTogewogICAgICB0eXBlOiBOdW1iZXIsCiAgICAgIGRlZmF1bHQ6IDUwCiAgICB9LAogICAgc3BsaXR0ZXIyOiB7CiAgICAgIHR5cGU6IE51bWJlciwKICAgICAgZGVmYXVsdDogNTAKICAgIH0sCiAgICBzcGxpdHRlcjM6IHsKICAgICAgdHlwZTogTnVtYmVyLAogICAgICBkZWZhdWx0OiA1MAogICAgfSwKICAgIGZhaWxlZFNlYXJjaDogewogICAgICB0eXBlOiBPYmplY3QsCiAgICAgIGRlZmF1bHQ6IGZ1bmN0aW9uKCkgewogICAgICAgIHJldHVybiB7CiAgICAgICAgICBmaXJzdDogdW5kZWZpbmVkLAogICAgICAgICAgc2Vjb25kOiB1bmRlZmluZWQsCiAgICAgICAgICB0aGlyZDogdW5kZWZpbmVkLAogICAgICAgICAgZm91cnRoOiB1bmRlZmluZWQsCiAgICAgICAgfTsKICAgICAgfQogICAgfQogIH0sCiAgZGF0YTogZnVuY3Rpb24oKSB7CiAgICByZXR1cm4gewogICAgICBpc0ZsYXRtYXA6IHsKICAgICAgICBmaXJzdDogdHJ1ZSwKICAgICAgICBzZWNvbmQ6IGZhbHNlLAogICAgICAgIHRoaXJkOiBmYWxzZSwKICAgICAgICBmb3VydGg6IGZhbHNlCiAgICAgIH0sCiAgICB9CiAgfSwKICBjb21wdXRlZDogewogICAgLy8gVGhpcyBjb21wdXRlZCBwcm9wZXJ0eSBwb3B1bGF0ZXMgZmlsdGVyIGRhdGEncyBlbnRyeSBvYmplY3Qgd2l0aCAkZGF0YSBmcm9tIHRoaXMgc2lkZWJhcgogICAgc2xvdEluZm86IGZ1bmN0aW9uKCkgewogICAgICByZXR1cm4gc3RvcmUuc3RhdGUuc3BsaXRGbG93LnNsb3RJbmZvOwogICAgfSwKICAgIGhlbHBEZWxheSgpIHsKICAgICAgcmV0dXJuIHN0b3JlLnN0YXRlLnNldHRpbmdzLmhlbHBEZWxheTsKICAgIH0sCiAgICBhY3RpdmVWaWV3OiBmdW5jdGlvbigpIHsKICAgICAgcmV0dXJuIHN0b3JlLnN0YXRlLnNwbGl0Rmxvdy5hY3RpdmVWaWV3OwogICAgfQogIH0sCiAgbWV0aG9kczogewogICAgY2xvc2VBbmRSZW1vdmU6IGZ1bmN0aW9uKHNsb3QpIHsKICAgICAgbGV0IGlkID0gc2xvdC5pZDsKICAgICAgc3RvcmUuY29tbWl0KCJzcGxpdEZsb3cvY2xvc2VTbG90IiwgCiAgICAgICAgeyBzbG90TmFtZTogc2xvdC5uYW1lICwgaWQ6IGlkLCBlbnRyaWVzOiB0aGlzLmVudHJpZXN9KTsKICAgICAgRXZlbnRCdXMuJGVtaXQoIlJlbW92ZUVudHJ5UmVxdWVzdCIsIGlkKTsKICAgIH0sCiAgICBnZXRFbnRyeVRpdGxlOiBmdW5jdGlvbihlbnRyeSkgewogICAgICBpZiAoZW50cnkpIHsKICAgICAgICBsZXQgdGl0bGUgPSBlbnRyeS5sYWJlbCA/IGVudHJ5LmxhYmVsICsgIiAiOiAnJzsKICAgICAgICBsZXQgdHlwZSA9IGVudHJ5LnR5cGU7CiAgICAgICAgaWYgKHR5cGUgPT0gIlNjYWZmb2xkIikKICAgICAgICAgIHR5cGUgPSAiM0QgU2NhZmZvbGQiOwogICAgICAgIHRpdGxlICs9IHR5cGU7CiAgICAgICAgaWYgKGVudHJ5LmRhdGFzZXRJZCkKICAgICAgICAgIHRpdGxlICs9ICIgKCIgKyBlbnRyeS5kYXRhc2V0SWQgKyAiKSI7CiAgICAgICAgZWxzZSBpZiAoZW50cnkuZGlzY292ZXJJZCkKICAgICAgICAgIHRpdGxlICs9ICIgKCIgKyBlbnRyeS5kaXNjb3ZlcklkICsgIikiOwogICAgICAgIHJldHVybiB0aXRsZTsKICAgICAgfQogICAgICByZXR1cm4gIlZpZXdlciI7CiAgICB9LAogICAgZ2V0U2xvdFRpdGxlOiBmdW5jdGlvbihzbG90KSB7CiAgICAgIGxldCBlbnRyeSA9IHRoaXMuZW50cmllcy5maW5kKGVudHJ5ID0+IGVudHJ5LmlkID09PSBzbG90LmlkKTsKICAgICAgcmV0dXJuIHRoaXMuZ2V0RW50cnlUaXRsZShlbnRyeSk7CiAgICB9LAogICAgZ2V0VG9vbGJhckNsYXNzOiBmdW5jdGlvbihzbG90KSB7CiAgICAgIGlmIChzbG90Lm5hbWUgPT0gImZpcnN0IikgewogICAgICAgIHN3aXRjaCAodGhpcy5hY3RpdmVWaWV3KSB7CiAgICAgICAgICBjYXNlICJzaW5nbGVwYW5lbCI6CiAgICAgICAgICBjYXNlICIyaG9ycGFuZWwiOgogICAgICAgICAgICByZXR1cm4gInNpbmdsZXBhbmVsLTEiOwogICAgICAgICAgY2FzZSAiMnZlcnRwYW5lbCI6CiAgICAgICAgICBjYXNlICIzcGFuZWwiOgogICAgICAgICAgY2FzZSAiNHBhbmVsIjoKICAgICAgICAgICAgcmV0dXJuICJ0d292ZXJ0cGFuZWwtMSI7CiAgICAgICAgfQogICAgICB9IGVsc2UgaWYgKHNsb3QubmFtZSA9PSAic2Vjb25kIikgewogICAgICAgIHN3aXRjaCAodGhpcy5hY3RpdmVWaWV3KSB7CiAgICAgICAgICBjYXNlICIyaG9ycGFuZWwiOgogICAgICAgICAgICByZXR1cm4gInR3b2hvcnBhbmVsLTIiOwogICAgICAgICAgY2FzZSAiMnZlcnRwYW5lbCI6CiAgICAgICAgICBjYXNlICIzcGFuZWwiOgogICAgICAgICAgY2FzZSAiNHBhbmVsIjoKICAgICAgICAgICAgcmV0dXJuICJ0d292ZXJ0cGFuZWwtMiI7CiAgICAgICAgfQogICAgICB9IGVsc2UgaWYgKHNsb3QubmFtZSA9PSAidGhpcmQiKSB7CiAgICAgICAgc3dpdGNoICh0aGlzLmFjdGl2ZVZpZXcpIHsKICAgICAgICAgIGNhc2UgIjNwYW5lbCI6CiAgICAgICAgICBjYXNlICI0cGFuZWwiOgogICAgICAgICAgICByZXR1cm4gInRocmVlcGFuZWwtMyI7CiAgICAgICAgfQogICAgICB9IGVsc2UgaWYgKHNsb3QubmFtZSA9PSAiZm91cnRoIikgewogICAgICAgIHN3aXRjaCAodGhpcy5hY3RpdmVWaWV3KSB7CiAgICAgICAgICBjYXNlICI0cGFuZWwiOgogICAgICAgICAgICByZXR1cm4gImZvdXJwYW5lbC00IjsKICAgICAgICB9CiAgICAgIH0KICAgICAgcmV0dXJuICJpbmFjdGl2ZSI7CiAgICB9LAogICAgZ2V0VG9vbGJhclN0eWxlOiBmdW5jdGlvbihzbG90KSB7CiAgICAgIC8qIAogICAgICAgIFNldCB0aGUgdG9vbGJhciBzdHlsZSBiYXNlZCBvbiB0aGUgcG9zaXRpb24gb2YgdGhlIHNwbHR0ZXJzIAogICAgICAgIFRoZSBzcGxpdHRlciBpcyAxcHggaW4gaGVpZ2h0L3dpZHRoLiAKICAgICAgICBUaGUgd2lkdGggYW5kIHBvc2l0aW9uIG9mIHRoZSB0b29sYmFyIHNob3VsZAogICAgICAgIHRha2UgdGhhdCBpbnRvIGFjY291bnQuCiAgICAgICovCiAgICAgIGxldCBzdHlsZSA9IHt9OwogICAgICBpZiAoc2xvdCkgewogICAgICAgIGlmIChzbG90Lm5hbWUgPT0gImZpcnN0IikgewogICAgICAgICAgc3dpdGNoICh0aGlzLmFjdGl2ZVZpZXcpIHsKICAgICAgICAgICAgY2FzZSAiMnZlcnRwYW5lbCI6CiAgICAgICAgICAgIGNhc2UgIjNwYW5lbCI6CiAgICAgICAgICAgIGNhc2UgIjRwYW5lbCI6CiAgICAgICAgICAgICAgc3R5bGVbIndpZHRoIl0gPSAiY2FsYygiICsgdGhpcy5zcGxpdHRlcjEudG9TdHJpbmcoKSArICIlIC0gMXB4KSI7CiAgICAgICAgICAgICAgYnJlYWs7CiAgICAgICAgICB9CiAgICAgICAgfSBlbHNlIGlmIChzbG90Lm5hbWUgPT0gInNlY29uZCIpIHsKICAgICAgICAgIHN3aXRjaCAodGhpcy5hY3RpdmVWaWV3KSB7CiAgICAgICAgICAgIGNhc2UgIjJob3JwYW5lbCI6CiAgICAgICAgICAgICAgc3R5bGVbInRvcCJdID0gImNhbGMoIiArIHRoaXMuc3BsaXR0ZXIxLnRvU3RyaW5nKCkgKyAiJSArIDJweCkiOwogICAgICAgICAgICAgIGJyZWFrOwogICAgICAgICAgICBjYXNlICIydmVydHBhbmVsIjoKICAgICAgICAgICAgY2FzZSAiM3BhbmVsIjoKICAgICAgICAgICAgY2FzZSAiNHBhbmVsIjoKICAgICAgICAgICAgICBzdHlsZVsid2lkdGgiXSA9CiAgICAgICAgICAgICAgICAiY2FsYygiICsgKDEwMCAtIHRoaXMuc3BsaXR0ZXIxKS50b1N0cmluZygpICsgIiUgLSAxcHgpIjsKICAgICAgICAgICAgICBzdHlsZVsibGVmdCJdID0gImNhbGMoIiArIHRoaXMuc3BsaXR0ZXIxLnRvU3RyaW5nKCkgKyAiJSArIDJweCkiOwogICAgICAgICAgICAgIGJyZWFrOwogICAgICAgICAgfQogICAgICAgIH0gZWxzZSBpZiAoc2xvdC5uYW1lID09ICJ0aGlyZCIpIHsKICAgICAgICAgIHN3aXRjaCAodGhpcy5hY3RpdmVWaWV3KSB7CiAgICAgICAgICAgIGNhc2UgIjNwYW5lbCI6CiAgICAgICAgICAgIGNhc2UgIjRwYW5lbCI6CiAgICAgICAgICAgICAgc3R5bGVbIndpZHRoIl0gPQogICAgICAgICAgICAgICAgImNhbGMoIiArICgxMDAgLSB0aGlzLnNwbGl0dGVyMSkudG9TdHJpbmcoKSArICIlIC0gMXB4KSI7CiAgICAgICAgICAgICAgc3R5bGVbImxlZnQiXSA9ICJjYWxjKCIgKyB0aGlzLnNwbGl0dGVyMS50b1N0cmluZygpICsgIiUgKyAycHgpIjsKICAgICAgICAgICAgICBzdHlsZVsidG9wIl0gPSAiY2FsYyggIiArIHRoaXMuc3BsaXR0ZXIzLnRvU3RyaW5nKCkgKyAiJSArIDJweCkiOwogICAgICAgICAgICAgIGJyZWFrOwogICAgICAgICAgfQogICAgICAgIH0gZWxzZSBpZiAoc2xvdC5uYW1lID09ICJmb3VydGgiKSB7CiAgICAgICAgICBzd2l0Y2ggKHRoaXMuYWN0aXZlVmlldykgewogICAgICAgICAgICBjYXNlICI0cGFuZWwiOgogICAgICAgICAgICAgIHN0eWxlWyJ3aWR0aCJdID0gImNhbGMoIiArIHRoaXMuc3BsaXR0ZXIxLnRvU3RyaW5nKCkgKyAiJSAtIDFweCkiOwogICAgICAgICAgICAgIHN0eWxlWyJ0b3AiXSA9ICJjYWxjKCIgKyB0aGlzLnNwbGl0dGVyMi50b1N0cmluZygpICsgIiUgKyAycHgpIjsKICAgICAgICAgICAgICBicmVhazsKICAgICAgICAgIH0KICAgICAgICB9CiAgICAgIH0KICAgICAgcmV0dXJuIHN0eWxlOwogICAgfSwKICAgIHVwZGF0ZUlzRmxhdG1hcFNsb3Q6IGZ1bmN0aW9uKHNsb3QpIHsKICAgICAgbGV0IGVudHJ5ID0gdGhpcy5lbnRyaWVzLmZpbmQoZW50cnkgPT4gZW50cnkuaWQgPT09IHNsb3QuaWQpOwogICAgICBpZiAoZW50cnkpIHsKICAgICAgICBpZiAoZW50cnkudHlwZSA9PSAiRmxhdG1hcCIgfHwgZW50cnkudHlwZSA9PSAiTXVsdGlGbGF0bWFwIikgewogICAgICAgICAgdGhpcy5pc0ZsYXRtYXBbc2xvdC5uYW1lXSA9IHRydWU7CiAgICAgICAgfSBlbHNlIHsKICAgICAgICAgIHRoaXMuaXNGbGF0bWFwW3Nsb3QubmFtZV0gPSBmYWxzZTsKICAgICAgICB9CiAgICAgIH0KICAgIH0sCiAgICB1cGRhdGVJc0ZsYXRtYXA6IGZ1bmN0aW9uKCkgewogICAgICB0aGlzLnNsb3RJbmZvLmZvckVhY2goIHNsb3QgPT4gdGhpcy51cGRhdGVJc0ZsYXRtYXBTbG90KHNsb3QpKTsKICAgIH0sCiAgICB2aWV3ZXJDaGFuZ2VkOiBmdW5jdGlvbihzbG90LCB2YWx1ZSkgewogICAgICBpZiAoc2xvdC5pZCAmJiBzbG90LmlkICE9IHZhbHVlKSB7CiAgICAgICAgc3RvcmUuY29tbWl0KCJzcGxpdEZsb3cvYXNzaWduT3JTd2FwSWRUb1Nsb3QiLCB7CiAgICAgICAgICBzbG90OiBzbG90LAogICAgICAgICAgaWQ6IHZhbHVlCiAgICAgICAgfSk7CiAgICAgICAgVnVlLm5leHRUaWNrKCgpID0+IHsKICAgICAgICAgIHNldFRpbWVvdXQoKCkgPT4gewogICAgICAgICAgICB0aGlzLiRlbWl0KCJjaG9vc2VyLWNoYW5nZWQiKTsKICAgICAgICAgIH0sIDEyMDApOwogICAgICAgIH0pOwogICAgICB9CiAgICB9CiAgfSwKICB3YXRjaDogewogICAgc2xvdEluZm86IHsKICAgICAgaGFuZGxlcjogZnVuY3Rpb24oKSB7CiAgICAgICAgdGhpcy51cGRhdGVJc0ZsYXRtYXAoKTsKICAgICAgfSwKICAgICAgZGVlcDogdHJ1ZQogICAgfSwKICB9IAp9Owo="},{"version":3,"sources":["SplitpanesBar.vue"],"names":[],"mappings":";AAkDA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"SplitpanesBar.vue","sourceRoot":"src/components","sourcesContent":["<template>\n  <div>\n    <div\n      v-for=\"slot in slotInfo\"\n      :key=\"slot.name\"\n      :style=\"getToolbarStyle(slot)\"\n      :class=\"[getToolbarClass(slot), 'toolbar']\"\n    >\n      <div class=\"toolbar-flex-container\">\n        <el-select\n          v-if=\"entries.length > 1\"\n          :popper-append-to-body=\"false\"\n          :value=\"slot.id\"\n          placeholder=\"Select\"\n          class=\"select-box\"\n          popper-class=\"viewer_dropdown\"\n          @change=\"viewerChanged(slot , $event)\"\n        >\n          <el-option\n            v-for=\"entry in entries\"\n            :key=\"entry.id\"\n            :label=\"getEntryTitle(entry)\"\n            :value=\"entry.id\"\n          />\n        </el-select>\n        <div v-else class=\"text title\">\n          {{ getEntryTitle(entries[0]) }}\n        </div>\n        <template v-if=\"isFlatmap[slot.name]\">\n          <search-controls \n            @search=\"$emit('local-search', {term: $event, slot: slot});\"\n            @fetch-suggestions=\"$emit('fetch-suggestions', {data: $event, slot: slot});\"\n            :failedSearch=\"failedSearch[slot.name]\"\n          />\n        </template>\n      </div>\n      <el-row class=\"icon-group\">\n        <el-popover class=\"tooltip\" content=\"Close and remove\" placement=\"bottom-end\" :open-delay=\"helpDelay\"\n          :appendToBody=false trigger=\"hover\" popper-class=\"header-popper\" >\n          <map-svg-icon icon=\"close\" slot=\"reference\" class=\"header-icon\"\n            v-if=\"(activeView !== 'singlepanel') && (isFlatmap[slot.name] == false)\"\n            @click.native=\"closeAndRemove(slot)\"/>\n        </el-popover>\n      </el-row>\n    </div>    \n  </div>\n</template>\n\n\n<script>\n/* eslint-disable no-alert, no-console */\nimport Vue from \"vue\";\nimport EventBus from './EventBus';\nimport store from \"../store\";\nimport SearchControls from './SearchControls';\nimport { Input, Option, Popover, Row, Select } from \"element-ui\";\nimport lang from \"element-ui/lib/locale/lang/en\";\nimport locale from \"element-ui/lib/locale\";\n\nlocale.use(lang);\nVue.use(Input);\nVue.use(Option);\nVue.use(Select);\nVue.use(Popover);\nVue.use(Row);\n\nexport default {\n  name: \"SplitpanesBar\",\n  components: {\n    SearchControls,\n  },\n  props: {\n    entries: {\n      type: Array,\n      default: function() {\n        return [];\n      }\n    },\n    splitter1: {\n      type: Number,\n      default: 50\n    },\n    splitter2: {\n      type: Number,\n      default: 50\n    },\n    splitter3: {\n      type: Number,\n      default: 50\n    },\n    failedSearch: {\n      type: Object,\n      default: function() {\n        return {\n          first: undefined,\n          second: undefined,\n          third: undefined,\n          fourth: undefined,\n        };\n      }\n    }\n  },\n  data: function() {\n    return {\n      isFlatmap: {\n        first: true,\n        second: false,\n        third: false,\n        fourth: false\n      },\n    }\n  },\n  computed: {\n    // This computed property populates filter data's entry object with $data from this sidebar\n    slotInfo: function() {\n      return store.state.splitFlow.slotInfo;\n    },\n    helpDelay() {\n      return store.state.settings.helpDelay;\n    },\n    activeView: function() {\n      return store.state.splitFlow.activeView;\n    }\n  },\n  methods: {\n    closeAndRemove: function(slot) {\n      let id = slot.id;\n      store.commit(\"splitFlow/closeSlot\", \n        { slotName: slot.name , id: id, entries: this.entries});\n      EventBus.$emit(\"RemoveEntryRequest\", id);\n    },\n    getEntryTitle: function(entry) {\n      if (entry) {\n        let title = entry.label ? entry.label + \" \": '';\n        let type = entry.type;\n        if (type == \"Scaffold\")\n          type = \"3D Scaffold\";\n        title += type;\n        if (entry.datasetId)\n          title += \" (\" + entry.datasetId + \")\";\n        else if (entry.discoverId)\n          title += \" (\" + entry.discoverId + \")\";\n        return title;\n      }\n      return \"Viewer\";\n    },\n    getSlotTitle: function(slot) {\n      let entry = this.entries.find(entry => entry.id === slot.id);\n      return this.getEntryTitle(entry);\n    },\n    getToolbarClass: function(slot) {\n      if (slot.name == \"first\") {\n        switch (this.activeView) {\n          case \"singlepanel\":\n          case \"2horpanel\":\n            return \"singlepanel-1\";\n          case \"2vertpanel\":\n          case \"3panel\":\n          case \"4panel\":\n            return \"twovertpanel-1\";\n        }\n      } else if (slot.name == \"second\") {\n        switch (this.activeView) {\n          case \"2horpanel\":\n            return \"twohorpanel-2\";\n          case \"2vertpanel\":\n          case \"3panel\":\n          case \"4panel\":\n            return \"twovertpanel-2\";\n        }\n      } else if (slot.name == \"third\") {\n        switch (this.activeView) {\n          case \"3panel\":\n          case \"4panel\":\n            return \"threepanel-3\";\n        }\n      } else if (slot.name == \"fourth\") {\n        switch (this.activeView) {\n          case \"4panel\":\n            return \"fourpanel-4\";\n        }\n      }\n      return \"inactive\";\n    },\n    getToolbarStyle: function(slot) {\n      /* \n        Set the toolbar style based on the position of the spltters \n        The splitter is 1px in height/width. \n        The width and position of the toolbar should\n        take that into account.\n      */\n      let style = {};\n      if (slot) {\n        if (slot.name == \"first\") {\n          switch (this.activeView) {\n            case \"2vertpanel\":\n            case \"3panel\":\n            case \"4panel\":\n              style[\"width\"] = \"calc(\" + this.splitter1.toString() + \"% - 1px)\";\n              break;\n          }\n        } else if (slot.name == \"second\") {\n          switch (this.activeView) {\n            case \"2horpanel\":\n              style[\"top\"] = \"calc(\" + this.splitter1.toString() + \"% + 2px)\";\n              break;\n            case \"2vertpanel\":\n            case \"3panel\":\n            case \"4panel\":\n              style[\"width\"] =\n                \"calc(\" + (100 - this.splitter1).toString() + \"% - 1px)\";\n              style[\"left\"] = \"calc(\" + this.splitter1.toString() + \"% + 2px)\";\n              break;\n          }\n        } else if (slot.name == \"third\") {\n          switch (this.activeView) {\n            case \"3panel\":\n            case \"4panel\":\n              style[\"width\"] =\n                \"calc(\" + (100 - this.splitter1).toString() + \"% - 1px)\";\n              style[\"left\"] = \"calc(\" + this.splitter1.toString() + \"% + 2px)\";\n              style[\"top\"] = \"calc( \" + this.splitter3.toString() + \"% + 2px)\";\n              break;\n          }\n        } else if (slot.name == \"fourth\") {\n          switch (this.activeView) {\n            case \"4panel\":\n              style[\"width\"] = \"calc(\" + this.splitter1.toString() + \"% - 1px)\";\n              style[\"top\"] = \"calc(\" + this.splitter2.toString() + \"% + 2px)\";\n              break;\n          }\n        }\n      }\n      return style;\n    },\n    updateIsFlatmapSlot: function(slot) {\n      let entry = this.entries.find(entry => entry.id === slot.id);\n      if (entry) {\n        if (entry.type == \"Flatmap\" || entry.type == \"MultiFlatmap\") {\n          this.isFlatmap[slot.name] = true;\n        } else {\n          this.isFlatmap[slot.name] = false;\n        }\n      }\n    },\n    updateIsFlatmap: function() {\n      this.slotInfo.forEach( slot => this.updateIsFlatmapSlot(slot));\n    },\n    viewerChanged: function(slot, value) {\n      if (slot.id && slot.id != value) {\n        store.commit(\"splitFlow/assignOrSwapIdToSlot\", {\n          slot: slot,\n          id: value\n        });\n        Vue.nextTick(() => {\n          setTimeout(() => {\n            this.$emit(\"chooser-changed\");\n          }, 1200);\n        });\n      }\n    }\n  },\n  watch: {\n    slotInfo: {\n      handler: function() {\n        this.updateIsFlatmap();\n      },\n      deep: true\n    },\n  } \n};\n</script>\n\n\n<!-- Add \"scoped\" attribute to limit CSS to this component only -->\n<style scoped lang=\"scss\">\n@import \"~element-ui/packages/theme-chalk/src/input\";\n@import \"~element-ui/packages/theme-chalk/src/option\";\n@import \"~element-ui/packages/theme-chalk/src/select\";\n@import \"../assets/header-icon.scss\";\n\n.toolbar {\n  background-color: #f5f7fa !important;\n  position: absolute;\n  transition: all 1s ease;\n  height: 32px;\n  border-bottom: 1px solid rgb(220, 223, 230);\n  z-index: 5;\n\n  &.singlepanel-1 {\n    left: 0px;\n    top: 0px;\n    width: 100%;\n  }\n\n  &.twohorpanel-2 {\n    width: 100%;\n    left: 0px;\n    top: 50%;\n    border-top: 1px solid rgb(220, 223, 230);\n  }\n\n  &.twovertpanel-1 {\n    left: 0px;\n    top: 0px;\n    width: calc(50% - 1px);\n  }\n\n  &.twovertpanel-2 {\n    width: calc(50% - 1px);\n    left: calc(50% + 2px);\n    top: 0px;\n    border-left: 1px solid rgb(220, 223, 230);\n  }\n\n  &.threepanel-3 {\n    width: calc(50% - 1px);\n    left: calc(50% + 2px);\n    top: calc(50% + 2px);\n    border-top: 1px solid rgb(220, 223, 230);\n    border-left: 1px solid rgb(220, 223, 230);\n  }\n\n  &.fourpanel-4 {\n    width: calc(50% - 1px);\n    left: 0px;\n    top: calc(50% + 2px);\n    border-top: 1px solid rgb(220, 223, 230);\n  }\n\n  &.inactive {\n    display: none;\n    left: 0px;\n    top: 0px;\n  }\n}\n\n.toolbar-title {\n  width: 107px;\n  height: 20px;\n  color: $app-primary-color;\n  font-size: 14px;\n  font-weight: normal;\n  line-height: 20px;\n  margin-left: 11px;\n  margin-top: 4px;\n}\n\n.toolbar-flex-container {\n  display:flex;\n  flex-direction: row;\n  .select-box {\n    width: 200px;\n    border-radius: 4px;\n    border: 1px solid rgb(144, 147, 153);\n    background-color: $background;\n    font-weight: 500;\n    color: rgb(48, 49, 51);\n    margin-left: 8px;\n    margin-top: 3px;\n    margin-bottom: 2px;\n    ::v-deep .el-input__inner {\n      width:177px;\n      color: $app-primary-color;\n      height: 24px;\n      padding-left: 4px;\n      padding-right: 8px;\n      background-color: $background;\n      border-style: none;\n    }\n    \n    ::v-deep .el-input__icon {\n      line-height: 24px;\n      color: $lightGrey;\n    }\n  }\n  i .select-box ::v-deep .el-input__icon {\n    color: rgb(48, 49, 51);\n    height: 24px;\n    padding-left: 8px;\n    padding-right: 8px;\n  }\n  .text {\n    margin-left: 8px;\n    margin-top: 7px;\n    font-weight: 500;\n    -moz-user-select: none;\n    -webkit-user-select: none;\n    -ms-user-select: none;\n    user-select: none;\n    line-height:18px;\n  }\n  .title {\n    width: 140px;\n    color: $app-primary-color;\n  }\n}\n\n.viewer_dropdown {\n  z-index: 5;\n  .el-select-dropdown__item {\n    white-space: nowrap;\n    text-align: left;\n    &.selected {\n      color: $app-primary-color;\n      font-weight: normal;\n    }\n  }\n}\n\n.icon-group {\n  font-size: 12px;\n}\n</style>\n"]}]}