{"version":3,"sources":["webpack:///./src/components/Drawer.vue?40ef","webpack:///./src/components/Drawer.vue?9c44","webpack:///src/components/Drawer.vue","webpack:///./src/components/Drawer.vue?1a5b","webpack:///./src/components/Drawer.vue"],"names":["render","_vm","this","_h","$createElement","_c","_self","ref","staticClass","style","_t","_e","staticRenderFns","props","data","auto_speed","manual_speed","threshold","startTime","startPos","translate","visible","computed","element","$refs","overlay","enabled","exist","direction","watch","active","newValue","open","close","mounted","window","addEventListener","setVisibility","methods","offsetWidth","handleStart","Date","getTime","e","targetTouches","pageX","transitionDuration","handleMove","valid","touches","transform","screen","width","overlayOpacity","percent","handleEnd","speed","Math","abs","handleZindex","opacity","zIndex","validate","display","gesture","currentPos","directions","lock","document","querySelector","classList","add","unlock","remove","distance","time","percentage","test","round","overflow","touchAction","removeProperty","component"],"mappings":"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","file":"js/drawer.3faa3c82.js","sourcesContent":["import mod from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Drawer.vue?vue&type=style&index=0&id=666f72fa&lang=scss&scoped=true&\"; export default mod; export * from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Drawer.vue?vue&type=style&index=0&id=666f72fa&lang=scss&scoped=true&\"","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return (_vm.enabled)?_c('section',[_c('aside',{ref:\"element\",staticClass:\"sidebar\",style:(_vm.style)},[_vm._t(\"default\")],2),_c('div',{ref:\"overlay\",staticClass:\"overlay\"})]):_vm._e()}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\r\n  <section v-if=\"enabled\">\r\n    <aside class=\"sidebar\" :style=\"style\" ref=\"element\">\r\n      <slot></slot>\r\n    </aside>\r\n    <div class=\"overlay\" ref=\"overlay\"></div>\r\n  </section>\r\n</template>\r\n<script>\r\nimport {mapGetters} from 'vuex'\r\nexport default {\r\n  props: ['direction', 'exist'],\r\n  data() {\r\n    return {\r\n      auto_speed: '0.3s',\r\n      manual_speed: '0.03s',\r\n      threshold: 0,\r\n      startTime: null,\r\n      startPos: null,\r\n      translate: null,\r\n      visible: true,\r\n    }\r\n  },\r\n  computed: {\r\n    element: function() {\r\n      return this.$refs.element\r\n    },\r\n    overlay: function() {\r\n      return this.$refs.overlay\r\n    },\r\n    enabled: function() {\r\n      if (this.exist == true) {\r\n        return true\r\n      }\r\n      return false\r\n    },\r\n    style: function() {\r\n      if (this.direction == 'right') {\r\n        return 'transform:translate3d(100%,0,0);right:0;'\r\n      }\r\n      return 'transform:translate3d(-100%,0,0);left:0;'\r\n    },\r\n    ...mapGetters({\r\n      active: 'drawer',\r\n    }),\r\n  },\r\n  watch: {\r\n    active(newValue) {\r\n      if (newValue) {\r\n        this.open()\r\n      } else {\r\n        this.close()\r\n      }\r\n    },\r\n  },\r\n  mounted() {\r\n    // document.addEventListener('touchstart', e => {\r\n    //   this.handleStart(e)\r\n    // })\r\n    // document.addEventListener('touchmove', e => {\r\n    //   this.handleMove(e)\r\n    // })\r\n    // document.addEventListener('touchend', e => {\r\n    //   this.handleEnd(e)\r\n    // })\r\n    // document.addEventListener('touchcancel', e => {\r\n    //   this.handleEnd(e)\r\n    // })\r\n    window.addEventListener(\r\n      'resize',\r\n      e => {\r\n        this.setVisibility(e)\r\n      },\r\n      true,\r\n    )\r\n    // this.overlay.addEventListener(\r\n    //   'transitionend',\r\n    //   e => {\r\n    //     this.handleZindex(e)\r\n    //   },\r\n    //   false,\r\n    // )\r\n    this.overlay.addEventListener(\r\n      'click',\r\n      () => {\r\n        this.$store.dispatch('hideDrawer')\r\n      },\r\n      false,\r\n    )\r\n    this.setVisibility()\r\n  },\r\n  methods: {\r\n    setVisibility() {\r\n      if (this.element.offsetWidth == 0) {\r\n        this.visible = false\r\n      } else {\r\n        this.visible = true\r\n      }\r\n    },\r\n    handleStart(e) {\r\n      this.startTime = new Date().getTime()\r\n      this.startPos = e.targetTouches[0].pageX\r\n      this.element.style.transitionDuration = this.manual_speed\r\n    },\r\n    handleMove(e) {\r\n      let gesture = this.gesture(e)\r\n      let valid = this.validate(this.direction, gesture)\r\n      if (valid) {\r\n        let percent = this.percentage(this.direction, gesture)\r\n        if (this.direction == 'left') {\r\n          this.translate = e.touches[0].pageX - this.element.offsetWidth\r\n          if (this.translate < 0) {\r\n            this.element.style.transform = 'translate3d(' + this.translate + 'px,0,0)'\r\n          } else {\r\n            this.open()\r\n          }\r\n        } else {\r\n          this.translate = -(screen.width - this.element.offsetWidth - e.touches[0].pageX)\r\n          if (this.translate > 0) {\r\n            this.element.style.transform = 'translate3d(' + this.translate + 'px,0,0)'\r\n          } else {\r\n            this.open()\r\n          }\r\n        }\r\n        this.overlayOpacity(percent / 100)\r\n      }\r\n    },\r\n    handleEnd(e) {\r\n      let speed = this.speed(e)\r\n      let gesture = this.gesture(e)\r\n      let valid = this.validate(this.direction, gesture)\r\n\r\n      if (valid) {\r\n        if (speed > 0.6) {\r\n          if (!this.active) {\r\n            this.open()\r\n          } else {\r\n            this.close()\r\n          }\r\n        } else {\r\n          if (this.element.offsetWidth / 2 > Math.abs(this.translate)) {\r\n            this.open()\r\n          } else {\r\n            this.close()\r\n          }\r\n        }\r\n      }\r\n    },\r\n    handleZindex() {\r\n      let opacity = window.getComputedStyle(this.overlay).getPropertyValue('opacity')\r\n      if (opacity <= 0) {\r\n        this.overlay.style.zIndex = -999\r\n      }\r\n    },\r\n    validate(direction, gesture) {\r\n      if (direction == 'left') {\r\n        if ((this.active && gesture == 'swiperight') || (!this.active && (gesture == 'swipeleft' || this.startPos > this.threshold))) {\r\n          return false\r\n        }\r\n      } else {\r\n        if ((this.active && gesture == 'swipeleft') || (!this.active && (gesture == 'swiperight' || this.startPos < screen.width - this.threshold))) {\r\n          return false\r\n        }\r\n      }\r\n      if ((document.querySelector('.sidebar.active') && !this.active) || !this.visible) {\r\n        return false\r\n      }\r\n      return true\r\n    },\r\n    overlayOpacity(opacity) {\r\n      this.overlay.style.opacity = opacity\r\n      if (opacity > 0) {\r\n        //this.overlay.style.zIndex = 999\r\n        this.overlay.style.display = 'block'\r\n      } else {\r\n        this.overlay.style.display = 'none'\r\n      }\r\n    },\r\n    gesture(e) {\r\n      let directions = ['swipeleft', 'swiperight']\r\n      let currentPos = e.changedTouches[0].pageX\r\n      if (this.startPos - currentPos < 0) {\r\n        return directions[1]\r\n      } else {\r\n        return directions[0]\r\n      }\r\n    },\r\n\r\n    open() {\r\n      this.translate = 0\r\n      this.element.style.transform = 'translate3d(' + this.translate + ',0,0)'\r\n      this.element.style.transitionDuration = this.auto_speed\r\n      this.overlayOpacity(1)\r\n      this.lock(document.querySelector('html'))\r\n      this.lock(document.querySelector('body'))\r\n      this.element.classList.add('active')\r\n      //this.active = true;\r\n    },\r\n    close() {\r\n      if (this.direction == 'left') {\r\n        this.translate = '-' + this.element.offsetWidth + 'px'\r\n      } else {\r\n        this.translate = this.element.offsetWidth + 'px'\r\n      }\r\n      this.element.style.transform = 'translate3d(' + this.translate + ',0,0)'\r\n      this.element.style.transitionDuration = this.auto_speed\r\n      this.overlayOpacity(0)\r\n      this.unlock(document.querySelector('html'))\r\n      this.unlock(document.querySelector('body'))\r\n      this.element.classList.remove('active')\r\n      //this.active = false;\r\n    },\r\n    speed(e) {\r\n      let time = new Date().getTime() - this.startTime\r\n      let startP = Math.abs(this.startPos)\r\n      let endP = Math.abs(e.changedTouches[0].pageX)\r\n      let distance = startP > endP ? startP - endP : endP - startP\r\n      return distance / time\r\n    },\r\n    percentage(direction, gesture) {\r\n      let percentage = 0\r\n      let test = []\r\n      if (direction == 'left') {\r\n        test = ['swipeleft', 'swiperight']\r\n      } else {\r\n        test = ['swiperight', 'swipeleft']\r\n      }\r\n      if (this.active && gesture == test[0]) {\r\n        percentage = 100 - Math.round((Math.abs(this.translate) / this.element.offsetWidth) * 100)\r\n      }\r\n      if (!this.active && gesture == test[1]) {\r\n        percentage = Math.round(100 - (Math.abs(this.translate) / this.element.offsetWidth) * 100)\r\n      }\r\n      if (percentage > 100) {\r\n        percentage = 100\r\n      }\r\n      if (percentage < 0) {\r\n        percentage = 0\r\n      }\r\n      return percentage\r\n    },\r\n    lock(element) {\r\n      element.style.overflow = 'hidden'\r\n      element.style.touchAction = 'none'\r\n    },\r\n    unlock(element) {\r\n      element.style.removeProperty('overflow')\r\n      element.style.removeProperty('touch-action')\r\n    },\r\n  },\r\n}\r\n</script>\r\n<style lang=\"scss\" scoped>\r\ndiv.overlay {\r\n  position: fixed;\r\n  z-index: 999;\r\n  display: none;\r\n  left: 0px;\r\n  top: 0px;\r\n  background: rgba(11, 10, 12, 0.35);\r\n  opacity: 0;\r\n  width: 100%;\r\n  height: 100%;\r\n  transition: opacity 0.3s ease;\r\n}\r\naside.sidebar {\r\n  z-index: 9999;\r\n  position: fixed;\r\n  will-change: transform;\r\n  height: 100%;\r\n  top: 0px;\r\n  transition: transform 0.3s ease;\r\n  background: #fff;\r\n  max-width: 750px;\r\n  width: 100%;\r\n  overflow-y: auto;\r\n  overflow-x: hidden;\r\n  word-wrap: break-word;\r\n}\r\n</style>\r\n","import mod from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Drawer.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Drawer.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./Drawer.vue?vue&type=template&id=666f72fa&scoped=true&\"\nimport script from \"./Drawer.vue?vue&type=script&lang=js&\"\nexport * from \"./Drawer.vue?vue&type=script&lang=js&\"\nimport style0 from \"./Drawer.vue?vue&type=style&index=0&id=666f72fa&lang=scss&scoped=true&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"666f72fa\",\n  null\n  \n)\n\nexport default component.exports"],"sourceRoot":""}