{"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/scaffoldvuer/src/components/OpacityControls.vue?vue&type=style&index=0&id=491476f4&scoped=true&lang=scss&","dependencies":[{"path":"/home/cmiss/Jenkins/workspace/mapintegratedvuer/node_modules/@abi-software/scaffoldvuer/src/components/OpacityControls.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:CkBpbXBvcnQgIn5lbGVtZW50LXVpL3BhY2thZ2VzL3RoZW1lLWNoYWxrL3NyYy9jb250YWluZXIiOwpAaW1wb3J0ICJ+ZWxlbWVudC11aS9wYWNrYWdlcy90aGVtZS1jaGFsay9zcmMvc2xpZGVyIjsKCi5oZWFkZXIgewogIGNvbG9yOiAjNjA2MjY2OwogIGxpbmUtaGVpZ2h0OiAxOwogIHBhZGRpbmc6IDlweCAxN3B4IDAgMTVweDsKICBib3JkZXItYm90dG9tOiAxcHggc29saWQgI2ViZWVmNTsKICBmb250LXNpemU6IDE0cHg7Cn0KCi5kaXNwbGF5IHsKICB3aWR0aDogNDRweDsKfQoKLm1haW4gewogIGZvbnQtc2l6ZTogMTNweDsKICBwYWRkaW5nOiAyMHB4IDE3cHggMCAxNXB4Owp9CgouYmxvY2sgewogIGxlZnQ6IDQwcHg7CiAgcG9zaXRpb246IGFic29sdXRlOwogIHRvcDogNTdweDsKICB3aWR0aDogMjAwcHg7Cn0KCi5teS1zbGlkZXIgewogIHBvc2l0aW9uOiBhYnNvbHV0ZTsKICB3aWR0aDogMTA5cHg7CiAgdG9wOiAtMTJweDsKICBsZWZ0OiA1MHB4OwogIHBvaW50ZXItZXZlbnRzOiBhdXRvOwp9Cgoub3BhY2l0eS1jb250YWluZXIgewogIHdpZHRoOiAyMjRweDsKICBoZWlnaHQ6IDkzcHg7CiAgYm9yZGVyLXJhZGl1czogNHB4OwogIGJvcmRlcjogc29saWQgMXB4ICNkOGRjZTY7CiAgYmFja2dyb3VuZC1jb2xvcjogI2ZmZjsKfQoKOjp2LWRlZXAgLmVsLXNsaWRlcl9fYmFyIHsKICBiYWNrZ3JvdW5kLWNvbG9yOiAkYXBwLXByaW1hcnktY29sb3I7Cn0KCg=="},{"version":3,"sources":["OpacityControls.vue"],"names":[],"mappings":";AA2EA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA","file":"OpacityControls.vue","sourceRoot":"node_modules/@abi-software/scaffoldvuer/src/components","sourcesContent":["<template>\n  <el-container v-if=\"material\" class=\"opacity-container\">\n    <el-header\n      height=\"37px\"\n      class=\"header\"\n    >\n      <div>Opacity</div>\n    </el-header>\n    <el-main class=\"main\">\n      <div class=\"block\">\n        <span class=\"display\">{{ displayString }}</span>\n        <el-slider\n          v-model=\"material.opacity\"\n          class=\"my-slider\"\n          :step=\"0.01\"\n          :min=\"0\"\n          :max=\"1\"\n          :format-tooltip=\"formatTooltip\"\n          :show-tooltip=\"false\"\n        />\n      </div>\n    </el-main>\n  </el-container>\n</template>\n\n<script>\n/* eslint-disable no-alert, no-console */\nimport Vue from \"vue\";\nimport { Container, Header, Main, Slider } 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(Container);\nVue.use(Header);\nVue.use(Main);\nVue.use(Slider);\n\n/**\n * A component to control the opacity of the target object.\n */\nexport default {\n  name: \"OpacityControls\",\n  props: {\n    material: undefined,\n  },\n  data: function() {\n    return {\n      displayString: \"100%\",\n    };\n  },\n  watch: {\n    \"material.opacity\": function() {\n      if (this.material && this._zincObject) {\n        this._zincObject.setAlpha(this.material.opacity);\n      }\n    }\n  },\n  mounted: function() {\n    this._zincObject = undefined;\n  },\n  methods: {\n    formatTooltip(val) {\n      this.displayString = Math.floor(100 * val + 0.5) + \"%\";\n      return this.displayString;\n    },\n    setObject(object) {\n      this._zincObject = object;\n    }\n  },\n};\n</script>\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/container\";\n@import \"~element-ui/packages/theme-chalk/src/slider\";\n\n.header {\n  color: #606266;\n  line-height: 1;\n  padding: 9px 17px 0 15px;\n  border-bottom: 1px solid #ebeef5;\n  font-size: 14px;\n}\n\n.display {\n  width: 44px;\n}\n\n.main {\n  font-size: 13px;\n  padding: 20px 17px 0 15px;\n}\n\n.block {\n  left: 40px;\n  position: absolute;\n  top: 57px;\n  width: 200px;\n}\n\n.my-slider {\n  position: absolute;\n  width: 109px;\n  top: -12px;\n  left: 50px;\n  pointer-events: auto;\n}\n\n.opacity-container {\n  width: 224px;\n  height: 93px;\n  border-radius: 4px;\n  border: solid 1px #d8dce6;\n  background-color: #fff;\n}\n\n::v-deep .el-slider__bar {\n  background-color: $app-primary-color;\n}\n\n</style>\n"]}]}