{"remainingRequest":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/vue-loader/lib/index.js??vue-loader-options!/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/@abi-software/map-side-bar/src/components/BadgesGroup.vue?vue&type=style&index=0&id=6c55596a&prod&scoped=true&lang=scss&","dependencies":[{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/@abi-software/map-side-bar/src/components/BadgesGroup.vue","mtime":499162500000},{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/css-loader/dist/cjs.js","mtime":499162500000},{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/vue-loader/lib/loaders/stylePostLoader.js","mtime":499162500000},{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/postcss-loader/src/index.js","mtime":499162500000},{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/sass-loader/dist/cjs.js","mtime":499162500000},{"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:DQpAaW1wb3J0ICJ+ZWxlbWVudC11aS9wYWNrYWdlcy90aGVtZS1jaGFsay9zcmMvYnV0dG9uIjsNCg0KLnRhZy1idXR0b24sDQoudGFnLWJ1dHRvbjpob3ZlciwNCi50YWctYnV0dG9uOmZvY3VzLA0KLnRhZy1idXR0b24uYWN0aXZlDQp7DQogIGJvcmRlci1yYWRpdXM6IDRweDsNCiAgZm9udC1zaXplOiAwLjc1cmVtOw0KICBwYWRkaW5nOiAwLjJyZW0gMC4ycmVtOw0KICBtYXJnaW46IDAuNXJlbSAwIDAgMDsNCiAgbWFyZ2luLXJpZ2h0OiAwLjc1cmVtIWltcG9ydGFudDsNCn0NCg0KLnRhZy1idXR0b24sDQoudGFnLWJ1dHRvbjpob3ZlciwNCi50YWctYnV0dG9uOmZvY3VzDQp7DQogIGJhY2tncm91bmQ6ICNmOWYyZmM7DQogIGJvcmRlcjogMXB4IHNvbGlkICRhcHAtcHJpbWFyeS1jb2xvcjsNCiAgY29sb3I6ICRhcHAtcHJpbWFyeS1jb2xvcjsNCn0NCg0KLnRhZy1idXR0b24uYWN0aXZlDQp7DQogIGJhY2tncm91bmQ6ICRhcHAtcHJpbWFyeS1jb2xvcjsNCiAgYm9yZGVyOiAxcHggc29saWQgJGFwcC1wcmltYXJ5LWNvbG9yOw0KICBjb2xvcjogI2ZmZjsNCn0NCg0KLnRhZy1idXR0b24rLnRhZy1idXR0b24NCnsNCiAgbWFyZ2luLWxlZnQ6MDsNCn0NCg=="},{"version":3,"sources":["BadgesGroup.vue"],"names":[],"mappings":";AA6GA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA","file":"BadgesGroup.vue","sourceRoot":"node_modules/@abi-software/map-side-bar/src/components","sourcesContent":["<template>\r\n  <div v-if=\"categories['All'].size > 1\" class=\"container\"  ref=\"container\">\r\n    <div>\r\n      View data types:\r\n    </div>\r\n    <template v-for=\"(item, key) in categories\" >\r\n      <el-button\r\n        v-if=\"item.size > 0\"\r\n        :class=\"[{ 'active': key == active},'tag-button']\"\r\n        @click=\"categoryClicked(key)\"\r\n        size=\"small\" :key=\"key\">{{ key + \" (\" + item.size + \")\" }}\r\n      </el-button>\r\n    </template>\r\n  </div>\r\n</template>\r\n\r\n\r\n<script>\r\n/* eslint-disable no-alert, no-console */\r\nimport Vue from \"vue\";\r\nimport { Button } from \"element-ui\";\r\nimport lang from \"element-ui/lib/locale/lang/en\";\r\nimport locale from \"element-ui/lib/locale\";\r\n\r\nlocale.use(lang);\r\nVue.use(Button);\r\n\r\nexport default {\r\n  name: \"BadgesGroup\",\r\n  props: {\r\n    /**\r\n     * Object containing information for\r\n     * the required viewing.\r\n     */\r\n    additionalLinks: {\r\n      type: Array,\r\n      default: () => {\r\n        return [];\r\n      },\r\n    },\r\n    datasetBiolucida: {\r\n      type: Object,\r\n      default: () => {\r\n        return {};\r\n      },\r\n    },\r\n    entry:  {\r\n      type: Object,\r\n      default: () => {\r\n        return {};\r\n      },\r\n    },\r\n  },\r\n  data: function () {\r\n    return {\r\n      //Always start with 1 image - the dataset thumbnail itself\r\n      categories: { \"All\": {size: 1}, \"Dataset\": {size: 1} },\r\n      active: \"All\"\r\n    };\r\n  },\r\n  methods: {\r\n    addToCategories: function (array, name) {\r\n      if (array && array.length > 0) {\r\n        this.categories[name] = { size: array.length };\r\n        this.categories[\"All\"].size += array.length;\r\n      }\r\n    },\r\n    addSimulationsToCategories: function (array) {\r\n      if (array && array.length > 0) {\r\n        const size = 1;\r\n        this.categories[\"Simulations\"] = { size };\r\n        this.categories[\"All\"].size += size;\r\n      }\r\n    },\r\n    categoryClicked: function(name) {\r\n      this.active = name;\r\n      this.$emit(\"categoryChanged\", name);\r\n    }\r\n  },\r\n  watch: {\r\n    datasetBiolucida: {\r\n      deep: true,\r\n      immediate: true,\r\n      handler: function (biolucidaData) {\r\n        if (\"dataset_images\" in biolucidaData) {\r\n          this.addToCategories(biolucidaData[\"dataset_images\"], \"Images\");\r\n        }\r\n      }\r\n    },\r\n    entry: {\r\n      deep: true,\r\n      immediate: true,\r\n      handler: function () {\r\n        this.addToCategories(this.entry.scaffolds, 'Scaffolds');\r\n        this.addToCategories(this.entry.segmentation, 'Segmentations');\r\n        this.addToCategories(this.entry.plots, 'Plots');\r\n        this.addSimulationsToCategories(this.entry.simulation);\r\n        /** disable the following\r\n        this.addToCategories(this.entry.images, 'Images');\r\n        this.addToCategories(this.entry.videos, 'Videos');\r\n        **/\r\n      }\r\n    }\r\n  },\r\n};\r\n</script>\r\n\r\n<!-- Add \"scoped\" attribute to limit CSS to this component only -->\r\n<style scoped lang=\"scss\">\r\n@import \"~element-ui/packages/theme-chalk/src/button\";\r\n\r\n.tag-button,\r\n.tag-button:hover,\r\n.tag-button:focus,\r\n.tag-button.active\r\n{\r\n  border-radius: 4px;\r\n  font-size: 0.75rem;\r\n  padding: 0.2rem 0.2rem;\r\n  margin: 0.5rem 0 0 0;\r\n  margin-right: 0.75rem!important;\r\n}\r\n\r\n.tag-button,\r\n.tag-button:hover,\r\n.tag-button:focus\r\n{\r\n  background: #f9f2fc;\r\n  border: 1px solid $app-primary-color;\r\n  color: $app-primary-color;\r\n}\r\n\r\n.tag-button.active\r\n{\r\n  background: $app-primary-color;\r\n  border: 1px solid $app-primary-color;\r\n  color: #fff;\r\n}\r\n\r\n.tag-button+.tag-button\r\n{\r\n  margin-left:0;\r\n}\r\n</style>\r\n"]}]}