{"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=script&lang=js&","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/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:DQovKiBlc2xpbnQtZGlzYWJsZSBuby1hbGVydCwgbm8tY29uc29sZSAqLw0KaW1wb3J0IFZ1ZSBmcm9tICJ2dWUiOw0KaW1wb3J0IHsgQ29udGFpbmVyLCBEcmF3ZXIsIEhlYWRlciwgSWNvbiwgTWFpbiwgU2xpZGVyIH0gZnJvbSAiZWxlbWVudC11aSI7DQppbXBvcnQgbGFuZyBmcm9tICJlbGVtZW50LXVpL2xpYi9sb2NhbGUvbGFuZy9lbiI7DQppbXBvcnQgbG9jYWxlIGZyb20gImVsZW1lbnQtdWkvbGliL2xvY2FsZSI7DQoNCmxvY2FsZS51c2UobGFuZyk7DQpWdWUudXNlKENvbnRhaW5lcik7DQpWdWUudXNlKERyYXdlcik7DQpWdWUudXNlKEhlYWRlcik7DQpWdWUudXNlKEljb24pOw0KVnVlLnVzZShNYWluKTsNClZ1ZS51c2UoU2xpZGVyKTsNCg0KLyoqDQogKiBBIGNvbXBvbmVudCB0byBjb250cm9sIHRoZSBvcGFjaXR5IG9mIHRoZSB0YXJnZXQgb2JqZWN0Lg0KICovDQpleHBvcnQgZGVmYXVsdCB7DQogIG5hbWU6ICJPcGFjaXR5Q29udHJvbHMiLA0KICBkYXRhOiBmdW5jdGlvbigpIHsNCiAgICByZXR1cm4gew0KICAgICAgZGlzcGxheVN0cmluZzogIjEwMCUiLA0KICAgICAgbWF0ZXJpYWw6IHVuZGVmaW5lZCwNCiAgICAgIGRyYXdlck9wZW46IHRydWUNCiAgICB9Ow0KICB9LA0KICB3YXRjaDogew0KICAgICJtYXRlcmlhbC5vcGFjaXR5IjogZnVuY3Rpb24oKSB7DQogICAgICBpZiAodGhpcy5tYXRlcmlhbCkgew0KICAgICAgICB0aGlzLl96aW5jb2JqZWN0LnNldEFscGhhKHRoaXMubWF0ZXJpYWwub3BhY2l0eSk7DQogICAgICB9DQogICAgfQ0KICB9LA0KICBtb3VudGVkOiBmdW5jdGlvbigpIHsNCiAgICB0aGlzLl96aW5jb2JqZWN0ID0gdW5kZWZpbmVkOw0KICB9LA0KICBtZXRob2RzOiB7DQogICAgZm9ybWF0VG9vbHRpcCh2YWwpIHsNCiAgICAgIHRoaXMuZGlzcGxheVN0cmluZyA9IE1hdGguZmxvb3IoMTAwICogdmFsICsgMC41KSArICIlIjsNCiAgICAgIHJldHVybiB0aGlzLmRpc3BsYXlTdHJpbmc7DQogICAgfSwNCiAgICB0b2dnbGVEcmF3ZXI6IGZ1bmN0aW9uKCkgew0KICAgICAgdGhpcy5kcmF3ZXJPcGVuID0gIXRoaXMuZHJhd2VyT3BlbjsNCiAgICB9LA0KICAgIHNldE9iamVjdChvYmplY3QpIHsNCiAgICAgIGlmIChvYmplY3QpIHRoaXMubWF0ZXJpYWwgPSBvYmplY3QubW9ycGgubWF0ZXJpYWw7DQogICAgICBlbHNlIHRoaXMubWF0ZXJpYWwgPSB1bmRlZmluZWQ7DQogICAgICB0aGlzLl96aW5jb2JqZWN0ID0gb2JqZWN0Ow0KICAgIH0NCiAgfQ0KfTsNCg=="},{"version":3,"sources":["OpacityControls.vue"],"names":[],"mappings":";AA0DA;AACA;AACA;AACA;AACA;;AAEA;AACA;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","file":"OpacityControls.vue","sourceRoot":"node_modules/@abi-software/scaffoldvuer/src/components","sourcesContent":["<template>\r\n  <div\r\n    v-if=\"material!=undefined\"\r\n    ref=\"control\"\r\n    class=\"opacity-control\"\r\n  >\r\n    <el-drawer\r\n      custom-class=\"my-drawer\"\r\n      class=\"drawer-content\"\r\n      :visible.sync=\"drawerOpen\"\r\n      :append-to-body=\"false\"\r\n      :modal-append-to-body=\"false\"\r\n      size=\"300\"\r\n      :with-header=\"false\"\r\n      :wrapper-closable=\"false\"\r\n      :modal=\"false\"\r\n    >\r\n      <div\r\n        v-if=\"drawerOpen\"\r\n        class=\"tab-button close\"\r\n        @click=\"toggleDrawer\"\r\n      >\r\n        <i class=\"el-icon-arrow-right\" />\r\n      </div>\r\n      <el-container class=\"opacity-container\">\r\n        <el-header\r\n          height=\"37px\"\r\n          class=\"header\"\r\n        >\r\n          <div>Opacity</div>\r\n        </el-header>\r\n        <el-main class=\"main\">\r\n          <div class=\"block\">\r\n            <span class=\"display\">{{ displayString }}</span>\r\n            <el-slider\r\n              v-model=\"material.opacity\"\r\n              class=\"my-slider\"\r\n              :step=\"0.01\"\r\n              :min=\"0\"\r\n              :max=\"1\"\r\n              :format-tooltip=\"formatTooltip\"\r\n              :show-tooltip=\"false\"\r\n            />\r\n          </div>\r\n        </el-main>\r\n      </el-container>\r\n    </el-drawer>\r\n    <div\r\n      v-if=\"!drawerOpen\"\r\n      class=\"tab-button open\"\r\n      @click=\"toggleDrawer\"\r\n    >\r\n      <i class=\"el-icon-arrow-left\" />\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\n/* eslint-disable no-alert, no-console */\r\nimport Vue from \"vue\";\r\nimport { Container, Drawer, Header, Icon, Main, Slider } 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(Container);\r\nVue.use(Drawer);\r\nVue.use(Header);\r\nVue.use(Icon);\r\nVue.use(Main);\r\nVue.use(Slider);\r\n\r\n/**\r\n * A component to control the opacity of the target object.\r\n */\r\nexport default {\r\n  name: \"OpacityControls\",\r\n  data: function() {\r\n    return {\r\n      displayString: \"100%\",\r\n      material: undefined,\r\n      drawerOpen: true\r\n    };\r\n  },\r\n  watch: {\r\n    \"material.opacity\": function() {\r\n      if (this.material) {\r\n        this._zincobject.setAlpha(this.material.opacity);\r\n      }\r\n    }\r\n  },\r\n  mounted: function() {\r\n    this._zincobject = undefined;\r\n  },\r\n  methods: {\r\n    formatTooltip(val) {\r\n      this.displayString = Math.floor(100 * val + 0.5) + \"%\";\r\n      return this.displayString;\r\n    },\r\n    toggleDrawer: function() {\r\n      this.drawerOpen = !this.drawerOpen;\r\n    },\r\n    setObject(object) {\r\n      if (object) this.material = object.morph.material;\r\n      else this.material = undefined;\r\n      this._zincobject = object;\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/container\";\r\n@import \"~element-ui/packages/theme-chalk/src/drawer\";\r\n@import \"~element-ui/packages/theme-chalk/src/slider\";\r\n\r\n.opacity-control {\r\n  text-align: left;\r\n  width:300px;\r\n}\r\n\r\n.header {\r\n  color: #606266;\r\n  line-height: 1;\r\n  padding: 9px 17px 0 15px;\r\n  border-bottom: 1px solid #ebeef5;\r\n  font-size: 14px;\r\n}\r\n\r\n.display {\r\n  width: 44px;\r\n}\r\n\r\n.icon {\r\n  right: 17px;\r\n  position: absolute;\r\n  top: 10px;\r\n}\r\n\r\n.main {\r\n  font-size: 13px;\r\n  padding: 20px 17px 0 15px;\r\n}\r\n\r\n.block {\r\n  left: 40px;\r\n  position: absolute;\r\n  top: 57px;\r\n  width: 200px;\r\n}\r\n\r\n.my-slider {\r\n  position: absolute;\r\n  width: 109px;\r\n  top: -12px;\r\n  left: 50px;\r\n  pointer-events: auto;\r\n}\r\n\r\n.opacity-container {\r\n  width: 224px;\r\n  height: 93px;\r\n  border-radius: 4px;\r\n  border: solid 1px #d8dce6;\r\n  background-color: #fff;\r\n}\r\n\r\n::v-deep .el-slider__bar {\r\n  background-color: $app-primary-color;\r\n}\r\n\r\n.drawer-content {\r\n  position: relative;\r\n  height: 93px;\r\n  pointer-events: none;\r\n}\r\n\r\n::v-deep .my-drawer {\r\n  background: rgba(0, 0, 0, 0);\r\n  box-shadow: none;\r\n}\r\n\r\n::v-deep .my-drawer .el-drawer__body {\r\n  height: 93px;\r\n}\r\n\r\n.tab-button {\r\n  width: 20px;\r\n  height: 40px;\r\n  z-index: 8;\r\n  right: 0px;\r\n  \r\n  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.06);\r\n  border: solid 1px #e4e7ed;\r\n  background-color: #FFFFFF;\r\n  text-align: center;\r\n  vertical-align: middle;\r\n  cursor: pointer;\r\n  pointer-events: auto;\r\n  //transition: bottom 0.3s;\r\n\r\n  &.close {\r\n    float: left;\r\n    flex: 1;\r\n    border-right: 0;\r\n    margin-top: 26px;\r\n  }\r\n\r\n  &.open {\r\n    position: absolute;\r\n    bottom:26px;\r\n  }\r\n\r\n  i {\r\n    margin-top: 12px;\r\n    color: $app-primary-color;\r\n    transform: scaleY(2.5);\r\n  }\r\n}\r\n\r\n</style>\r\n"]}]}