1 |
- {"version":3,"sources":["../../../src/components/VTimePicker/VTimePickerClock.ts"],"names":[],"mappings":"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","sourcesContent":["import '../../stylus/components/_time-picker-clock.styl'\n\n// Mixins\nimport Colorable from '../../mixins/colorable'\nimport Themeable from '../../mixins/themeable'\nimport mixins, { ExtractVue } from '../../util/mixins'\nimport Vue, { VNode } from 'vue'\n\ninterface Point {\n x: number\n y: number\n}\n\ninterface options extends Vue {\n $refs: {\n clock: HTMLElement\n innerClock: HTMLElement\n }\n}\n\nexport default mixins<options &\n/* eslint-disable indent */\n ExtractVue<[\n typeof Colorable,\n typeof Themeable\n ]>\n/* eslint-enable indent */\n>(\n Colorable,\n Themeable\n/* @vue/component */\n).extend({\n name: 'v-time-picker-clock',\n\n props: {\n allowedValues: Function,\n disabled: Boolean,\n double: Boolean,\n format: {\n type: Function,\n default: (val: string | number) => val\n },\n max: {\n type: Number,\n required: true\n },\n min: {\n type: Number,\n required: true\n },\n scrollable: Boolean,\n readonly: Boolean,\n rotate: {\n type: Number,\n default: 0\n },\n step: {\n type: Number,\n default: 1\n },\n value: Number\n },\n\n data () {\n return {\n inputValue: this.value,\n isDragging: false,\n valueOnMouseDown: null as number | null,\n valueOnMouseUp: null as number | null\n }\n },\n\n computed: {\n count (): number {\n return this.max - this.min + 1\n },\n degreesPerUnit (): number {\n return 360 / this.roundCount\n },\n degrees (): number {\n return this.degreesPerUnit * Math.PI / 180\n },\n displayedValue (): number {\n return this.value == null ? this.min : this.value\n },\n innerRadiusScale (): number {\n return 0.62\n },\n roundCount (): number {\n return this.double ? (this.count / 2) : this.count\n }\n },\n\n watch: {\n value (value) {\n this.inputValue = value\n }\n },\n\n methods: {\n wheel (e: WheelEvent) {\n e.preventDefault()\n\n const delta = Math.sign(-e.deltaY || 1)\n let value = this.displayedValue\n do {\n value = value + delta\n value = (value - this.min + this.count) % this.count + this.min\n } while (!this.isAllowed(value) && value !== this.displayedValue)\n\n if (value !== this.displayedValue) {\n this.update(value)\n }\n },\n isInner (value: number) {\n return this.double && (value - this.min >= this.roundCount)\n },\n handScale (value: number) {\n return this.isInner(value) ? this.innerRadiusScale : 1\n },\n isAllowed (value: number) {\n return !this.allowedValues || this.allowedValues(value)\n },\n genValues () {\n const children: VNode[] = []\n\n for (let value = this.min; value <= this.max; value = value + this.step) {\n const color = value === this.value && (this.color || 'accent')\n children.push(this.$createElement('span', this.setBackgroundColor(color, {\n staticClass: 'v-time-picker-clock__item',\n 'class': {\n 'v-time-picker-clock__item--active': value === this.displayedValue,\n 'v-time-picker-clock__item--disabled': this.disabled || !this.isAllowed(value)\n },\n style: this.getTransform(value),\n domProps: { innerHTML: `<span>${this.format(value)}</span>` }\n })))\n }\n\n return children\n },\n genHand () {\n const scale = `scaleY(${this.handScale(this.displayedValue)})`\n const angle = this.rotate + this.degreesPerUnit * (this.displayedValue - this.min)\n const color = (this.value != null) && (this.color || 'accent')\n return this.$createElement('div', this.setBackgroundColor(color, {\n staticClass: 'v-time-picker-clock__hand',\n 'class': {\n 'v-time-picker-clock__hand--inner': this.isInner(this.value)\n },\n style: {\n transform: `rotate(${angle}deg) ${scale}`\n }\n }))\n },\n getTransform (i: number) {\n const { x, y } = this.getPosition(i)\n return {\n left: `${50 + x * 50}%`,\n top: `${50 + y * 50}%`\n }\n },\n getPosition (value: number) {\n const rotateRadians = this.rotate * Math.PI / 180\n return {\n x: Math.sin((value - this.min) * this.degrees + rotateRadians) * this.handScale(value),\n y: -Math.cos((value - this.min) * this.degrees + rotateRadians) * this.handScale(value)\n }\n },\n onMouseDown (e: MouseEvent | TouchEvent) {\n e.preventDefault()\n\n this.valueOnMouseDown = null\n this.valueOnMouseUp = null\n this.isDragging = true\n this.onDragMove(e)\n },\n onMouseUp () {\n this.isDragging = false\n if (this.valueOnMouseUp !== null && this.isAllowed(this.valueOnMouseUp)) {\n this.$emit('change', this.valueOnMouseUp)\n }\n },\n onDragMove (e: MouseEvent | TouchEvent) {\n e.preventDefault()\n if (!this.isDragging && e.type !== 'click') return\n\n const { width, top, left } = this.$refs.clock.getBoundingClientRect()\n const { width: innerWidth } = this.$refs.innerClock.getBoundingClientRect()\n const { clientX, clientY } = 'touches' in e ? e.touches[0] : e\n const center = { x: width / 2, y: -width / 2 }\n const coords = { x: clientX - left, y: top - clientY }\n const handAngle = Math.round(this.angle(center, coords) - this.rotate + 360) % 360\n const insideClick = this.double && this.euclidean(center, coords) < (innerWidth + innerWidth * this.innerRadiusScale) / 4\n const value = (\n Math.round(handAngle / this.degreesPerUnit) +\n (insideClick ? this.roundCount : 0)\n ) % this.count + this.min\n\n // Necessary to fix edge case when selecting left part of the value(s) at 12 o'clock\n let newValue: number\n if (handAngle >= (360 - this.degreesPerUnit / 2)) {\n newValue = insideClick ? this.max - this.roundCount + 1 : this.min\n } else {\n newValue = value\n }\n\n if (this.isAllowed(value)) {\n if (this.valueOnMouseDown === null) {\n this.valueOnMouseDown = newValue\n }\n this.valueOnMouseUp = newValue\n this.update(newValue)\n }\n },\n update (value: number) {\n if (this.inputValue !== value) {\n this.inputValue = value\n this.$emit('input', value)\n }\n },\n euclidean (p0: Point, p1: Point) {\n const dx = p1.x - p0.x\n const dy = p1.y - p0.y\n\n return Math.sqrt(dx * dx + dy * dy)\n },\n angle (center: Point, p1: Point) {\n const value = 2 * Math.atan2(p1.y - center.y - this.euclidean(center, p1), p1.x - center.x)\n return Math.abs(value * 180 / Math.PI)\n }\n },\n\n render (h): VNode {\n const data = {\n staticClass: 'v-time-picker-clock',\n class: {\n 'v-time-picker-clock--indeterminate': this.value == null,\n ...this.themeClasses\n },\n on: (this.readonly || this.disabled) ? undefined : Object.assign({\n mousedown: this.onMouseDown,\n mouseup: this.onMouseUp,\n mouseleave: () => (this.isDragging && this.onMouseUp()),\n touchstart: this.onMouseDown,\n touchend: this.onMouseUp,\n mousemove: this.onDragMove,\n touchmove: this.onDragMove\n }, this.scrollable ? {\n wheel: this.wheel\n } : {}),\n ref: 'clock'\n }\n\n return h('div', data, [\n h('div', {\n staticClass: 'v-time-picker-clock__inner',\n ref: 'innerClock'\n }, [\n this.genHand(),\n this.genValues()\n ])\n ])\n }\n})\n"],"sourceRoot":""}
|