touchSupported: any = ('ontouchstart' in window);
mousedownEvent: any = this.touchSupported ? 'touchstart' : 'mousedown';
mousemoveEvent: any = this.touchSupported ? 'touchmove' : 'mousemove';
mouseupEvent: any = this.touchSupported ? 'touchend' :'mouseup';

mousedown(e: any, space: any) {
 const offset = this.plate.nativeElement.getBoundingClientRect(),
 isTouch = /^touch/.test(e.type),
 x0 = offset.left + this.dialRadius,
 y0 = offset.top + this.dialRadius,
 dx = (isTouch ? e.touches[0] : e).clientX - x0,
 dy = (isTouch ? e.touches[0] : e).clientY - y0,
 z = Math.sqrt(dx * dx + dy * dy);
 let moved = false;

if (space && (z < this.outerRadius - this.tickRadius || z > this.outerRadius + this.tickRadius)) {
 return;
 }
 e.preventDefault();
 e.stopPropagation();


 if (this.showHours) {
 this.setHand(dx, dy, true);
 } else {
 this.setHand(dx, dy, false);
 }

const mousemoveEventMethod = (event: any) => {
 event.preventDefault();
 event.stopPropagation();
 let touch = /^touch/.test(e.type);

const x = touch ? (event.touches[0].clientX -x0) : (event.clientX - x0),
 y = touch ? (event.touches[0].clientY -y0) : (event.clientY - y0);
 if (!moved && x === dx && y === dy) {
 return;
 }
 moved = true;

this.setHand(x, y, false);
 };

const mouseupEventMethod = (event: any) => {
 this.plate.nativeElement.removeEventListener(this.mousemoveEvent, mousemoveEventMethod);
 e.preventDefault();
 const x = event.clientX - x0,
 y = event.clientX - y0;
 if ((space || moved) && x === dx && y === dy) {
 this.setHand(x, y, false);
 }
 this.showMinutesClock();
 this.plate.nativeElement.removeEventListener(this.mouseupEvent, mouseupEventMethod);
 };
 this.plate.nativeElement.addEventListener(this.mousemoveEvent, mousemoveEventMethod, {passive: false});
 this.plate.nativeElement.addEventListener(this.mouseupEvent, mouseupEventMethod, {passive: false});
 }