{"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=02b0c234&prod&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:DQpAaW1wb3J0ICJ+ZWxlbWVudC11aS9wYWNrYWdlcy90aGVtZS1jaGFsay9zcmMvY29udGFpbmVyIjsNCkBpbXBvcnQgIn5lbGVtZW50LXVpL3BhY2thZ2VzL3RoZW1lLWNoYWxrL3NyYy9kcmF3ZXIiOw0KQGltcG9ydCAifmVsZW1lbnQtdWkvcGFja2FnZXMvdGhlbWUtY2hhbGsvc3JjL3NsaWRlciI7DQoNCi5vcGFjaXR5LWNvbnRyb2wgew0KICB0ZXh0LWFsaWduOiBsZWZ0Ow0KICB3aWR0aDozMDBweDsNCn0NCg0KLmhlYWRlciB7DQogIGNvbG9yOiAjNjA2MjY2Ow0KICBsaW5lLWhlaWdodDogMTsNCiAgcGFkZGluZzogOXB4IDE3cHggMCAxNXB4Ow0KICBib3JkZXItYm90dG9tOiAxcHggc29saWQgI2ViZWVmNTsNCiAgZm9udC1zaXplOiAxNHB4Ow0KfQ0KDQouZGlzcGxheSB7DQogIHdpZHRoOiA0NHB4Ow0KfQ0KDQouaWNvbiB7DQogIHJpZ2h0OiAxN3B4Ow0KICBwb3NpdGlvbjogYWJzb2x1dGU7DQogIHRvcDogMTBweDsNCn0NCg0KLm1haW4gew0KICBmb250LXNpemU6IDEzcHg7DQogIHBhZGRpbmc6IDIwcHggMTdweCAwIDE1cHg7DQp9DQoNCi5ibG9jayB7DQogIGxlZnQ6IDQwcHg7DQogIHBvc2l0aW9uOiBhYnNvbHV0ZTsNCiAgdG9wOiA1N3B4Ow0KICB3aWR0aDogMjAwcHg7DQp9DQoNCi5teS1zbGlkZXIgew0KICBwb3NpdGlvbjogYWJzb2x1dGU7DQogIHdpZHRoOiAxMDlweDsNCiAgdG9wOiAtMTJweDsNCiAgbGVmdDogNTBweDsNCiAgcG9pbnRlci1ldmVudHM6IGF1dG87DQp9DQoNCi5vcGFjaXR5LWNvbnRhaW5lciB7DQogIHdpZHRoOiAyMjRweDsNCiAgaGVpZ2h0OiA5M3B4Ow0KICBib3JkZXItcmFkaXVzOiA0cHg7DQogIGJvcmRlcjogc29saWQgMXB4ICNkOGRjZTY7DQogIGJhY2tncm91bmQtY29sb3I6ICNmZmY7DQp9DQoNCjo6di1kZWVwIC5lbC1zbGlkZXJfX2JhciB7DQogIGJhY2tncm91bmQtY29sb3I6ICRhcHAtcHJpbWFyeS1jb2xvcjsNCn0NCg0KLmRyYXdlci1jb250ZW50IHsNCiAgcG9zaXRpb246IHJlbGF0aXZlOw0KICBoZWlnaHQ6IDkzcHg7DQogIHBvaW50ZXItZXZlbnRzOiBub25lOw0KfQ0KDQo6OnYtZGVlcCAubXktZHJhd2VyIHsNCiAgYmFja2dyb3VuZDogcmdiYSgwLCAwLCAwLCAwKTsNCiAgYm94LXNoYWRvdzogbm9uZTsNCn0NCg0KOjp2LWRlZXAgLm15LWRyYXdlciAuZWwtZHJhd2VyX19ib2R5IHsNCiAgaGVpZ2h0OiA5M3B4Ow0KfQ0KDQoudGFiLWJ1dHRvbiB7DQogIHdpZHRoOiAyMHB4Ow0KICBoZWlnaHQ6IDQwcHg7DQogIHotaW5kZXg6IDg7DQogIHJpZ2h0OiAwcHg7DQogIA0KICBib3gtc2hhZG93OiAwIDJweCAxMnB4IDAgcmdiYSgwLCAwLCAwLCAwLjA2KTsNCiAgYm9yZGVyOiBzb2xpZCAxcHggI2U0ZTdlZDsNCiAgYmFja2dyb3VuZC1jb2xvcjogI0ZGRkZGRjsNCiAgdGV4dC1hbGlnbjogY2VudGVyOw0KICB2ZXJ0aWNhbC1hbGlnbjogbWlkZGxlOw0KICBjdXJzb3I6IHBvaW50ZXI7DQogIHBvaW50ZXItZXZlbnRzOiBhdXRvOw0KICAvL3RyYW5zaXRpb246IGJvdHRvbSAwLjNzOw0KDQogICYuY2xvc2Ugew0KICAgIGZsb2F0OiBsZWZ0Ow0KICAgIGZsZXg6IDE7DQogICAgYm9yZGVyLXJpZ2h0OiAwOw0KICAgIG1hcmdpbi10b3A6IDI2cHg7DQogIH0NCg0KICAmLm9wZW4gew0KICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTsNCiAgICBib3R0b206MjZweDsNCiAgfQ0KDQogIGkgew0KICAgIG1hcmdpbi10b3A6IDEycHg7DQogICAgY29sb3I6ICRhcHAtcHJpbWFyeS1jb2xvcjsNCiAgICB0cmFuc2Zvcm06IHNjYWxlWSgyLjUpOw0KICB9DQp9DQoNCg=="},{"version":3,"sources":["OpacityControls.vue"],"names":[],"mappings":";AAiHA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;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;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;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"]}]}