askbot-dragon 1.7.49-beta → 1.7.52-beta

package/src/assets/js/hammer.js

@@ -1,90 +1,101 @@
-//定义缩放方法，接收一个element参数：使用export暴露该方法
-export function zoomElement (el) {
-	let store = {
-		scale: 1
-	};
-	// 缩放事件的处理
-	el.addEventListener('touchstart', function (event) {
-		let touches = event.touches;
-		let events = touches[0];
-		let events2 = touches[1];
-		// event.preventDefault();
-		// 第一个触摸点的坐标
-		store.pageX = events.pageX;
-		store.pageY = events.pageY;
-
-		store.moveable = true;
-
-		if (events2) {
-			store.pageX2 = events2.pageX;
-			store.pageY2 = events2.pageY;
-		}
-		store.originScale = store.scale || 1;
-	});
-	document.addEventListener('touchmove', function (event) {
-		if (!store.moveable) {
-			return;
-		}
-
-		// event.preventDefault();
-
-		let touches = event.touches;
-		let events = touches[0];
-		let events2 = touches[1];
-		// 双指移动
-		if (events2) {
-			// 第2个指头坐标在touchmove时候获取
-			if (!store.pageX2) {
-				store.pageX2 = events2.pageX;
-			}
-			if (!store.pageY2) {
-				store.pageY2 = events2.pageY;
-			}
-
-			// 获取坐标之间的举例
-			let getDistance = function (start, stop) {
-				return Math.hypot(stop.x - start.x, stop.y - start.y);
-			};
-			// 双指缩放比例计算
-			let zoom = getDistance({
-				x: events.pageX,
-				y: events.pageY
-			}, {
-				x: events2.pageX,
-				y: events2.pageY
-			}) /
-				getDistance({
-					x: store.pageX,
-					y: store.pageY
-				}, {
-					x: store.pageX2,
-					y: store.pageY2
-				});
-			// 应用在元素上的缩放比例
-			let newScale = store.originScale * zoom;
-			// 最大缩放比例限制
-			if (newScale > 3) {
-				newScale = 3;
-			}
-			// 最小缩放比例限制
-			if(newScale < 1) {
-				newScale = 1;
-			}
-			// 记住使用的缩放值
-			store.scale = newScale;
-			// 图像应用缩放效果
-			el.style.transform = 'scale(' + newScale + ')';
-		}
-	});
-	document.addEventListener('touchend', function () {
-		store.moveable = false;
-		delete store.pageX2;
-		delete store.pageY2;
-	});
-	document.addEventListener('touchcancel', function () {
-		store.moveable = false;
-		delete store.pageX2;
-		delete store.pageY2;
-	});
-
+//定义缩放方法，接收一个element参数：使用export暴露该方法
+export function zoomElement (el) {
+	let store = {
+		scale: 1
+	};
+	if (!el){
+		return
+	}
+	let scale = 1;
+	if (el.style.transform){
+		let transForm = el.style.transform;
+		var values = transForm.split('(')[1].split(')')[0].split(',');
+		scale = values[0] ? values[0] : 1
+	}
+	// 缩放事件的处理
+	el.addEventListener('touchstart', function (event) {
+		let touches = event.touches;
+		let events = touches[0];
+		let events2 = touches[1];
+		// event.preventDefault();
+		// 第一个触摸点的坐标
+		store.pageX = events.pageX;
+		store.pageY = events.pageY;
+
+		store.moveable = true;
+
+		if (events2) {
+			store.pageX2 = events2.pageX;
+			store.pageY2 = events2.pageY;
+		}
+		store.originScale = store.scale || 1;
+	});
+	document.addEventListener('touchmove', function (event) {
+		if (!store.moveable) {
+			return;
+		}
+
+		// event.preventDefault();
+
+		let touches = event.touches;
+		let events = touches[0];
+		let events2 = touches[1];
+		// 双指移动
+		if (events2) {
+			// 第2个指头坐标在touchmove时候获取
+			if (!store.pageX2) {
+				store.pageX2 = events2.pageX;
+			}
+			if (!store.pageY2) {
+				store.pageY2 = events2.pageY;
+			}
+
+			// 获取坐标之间的举例
+			let getDistance = function (start, stop) {
+				return Math.hypot(stop.x - start.x, stop.y - start.y);
+			};
+			// 双指缩放比例计算
+			let zoom = getDistance({
+				x: events.pageX,
+				y: events.pageY
+			}, {
+				x: events2.pageX,
+				y: events2.pageY
+			}) /
+				getDistance({
+					x: store.pageX,
+					y: store.pageY
+				}, {
+					x: store.pageX2,
+					y: store.pageY2
+				});
+			// 应用在元素上的缩放比例
+			let newScale = store.originScale * zoom;
+			// 最大缩放比例限制
+			if (newScale > 3) {
+				newScale = 3;
+			}
+			// 最小缩放比例限制
+			if(newScale < scale) {
+				newScale = scale;
+			}
+			// 记住使用的缩放值
+			store.scale = newScale;
+			// 图像应用缩放效果
+			el.style.transform = 'scale(' + newScale + ')';
+			el.style.transformOrigin = 'top left'
+
+		}
+	});
+	document.addEventListener('touchend', function () {
+		store.moveable = false;
+		delete store.pageX2;
+		delete store.pageY2;
+	});
+	document.addEventListener('touchcancel', function () {
+		store.moveable = false;
+		delete store.pageX2;
+		delete store.pageY2;
+	});
+
 }

package/src/assets/js/script.js

@@ -1,37 +1,37 @@
-const displays = document.querySelectorAll('.note-display');
-const transitionDuration = 900;
-function displasss(){
-    displays.forEach(display => {
-        let note = parseFloat(display.dataset.note);
-        let [int, dec] = display.dataset.note.split('.');
-        [int, dec] = [Number(int), Number(dec)];
-        strokeTransition(display, note);
-        increaseNumber(display, int, 'int');
-        increaseNumber(display, dec, 'dec');
-    })
-}
-
-function strokeTransition(display, note) {
-       let progress = display.querySelector('.circle__progress--fill');
-       let radius = progress.r.baseVal.value;
-       let circumference = 2 * Math.PI * radius;
-       let offset = circumference * (10 - note) / 10;
-       progress.style.setProperty('--initialStroke', circumference);
-       progress.style.setProperty('--transitionDuration', `${transitionDuration}ms`);
-
-       setTimeout(() => progress.style.strokeDashoffset = offset, 100);
-     }
-function increaseNumber(display, number, className) {
-    let element = display.querySelector(`.percent__${className}`),
-        decPoint = className === 'int' ? '.' : '',
-        interval = transitionDuration / number,
-        counter = 0;
-
-    let increaseInterval = setInterval(() => {
-        if (counter === number) { window.clearInterval(increaseInterval); }
-
-        element.textContent = counter + decPoint;
-        counter++;
-    }, interval);
-}
+const displays = document.querySelectorAll('.note-display');
+const transitionDuration = 900;
+function displasss(){
+    displays.forEach(display => {
+        let note = parseFloat(display.dataset.note);
+        let [int, dec] = display.dataset.note.split('.');
+        [int, dec] = [Number(int), Number(dec)];
+        strokeTransition(display, note);
+        increaseNumber(display, int, 'int');
+        increaseNumber(display, dec, 'dec');
+    })
+}
+
+function strokeTransition(display, note) {
+       let progress = display.querySelector('.circle__progress--fill');
+       let radius = progress.r.baseVal.value;
+       let circumference = 2 * Math.PI * radius;
+       let offset = circumference * (10 - note) / 10;
+       progress.style.setProperty('--initialStroke', circumference);
+       progress.style.setProperty('--transitionDuration', `${transitionDuration}ms`);
+
+       setTimeout(() => progress.style.strokeDashoffset = offset, 100);
+     }
+function increaseNumber(display, number, className) {
+    let element = display.querySelector(`.percent__${className}`),
+        decPoint = className === 'int' ? '.' : '',
+        interval = transitionDuration / number,
+        counter = 0;
+
+    let increaseInterval = setInterval(() => {
+        if (counter === number) { window.clearInterval(increaseInterval); }
+
+        element.textContent = counter + decPoint;
+        counter++;
+    }, interval);
+}
 export {displasss}