update 0.11.2

CHANGELOG.md

@@ -1,3 +1,7 @@
+## 0.11.2
+
+优化拖拽速度
+
 ## 0.11.1
 
 兼容旧的属性

packages/dooringx-dumi-doc/docs/ChangeLog/index.en.md

@@ -5,6 +5,8 @@ nav:
   title: change log
   order: 6
 ---
+## 0.11.2
+Optimize drag speed
 ## 0.11.1
 Compatible with legacy properties
 ## 0.11.0

packages/dooringx-dumi-doc/docs/ChangeLog/index.md

@@ -5,6 +5,10 @@ nav:
   title: 变更日志
   order: 6
 ---
+## 0.11.2
+
+优化拖拽速度
+
 ## 0.11.1
 
 兼容旧的属性

packages/dooringx-lib/README.md

@@ -13,6 +13,7 @@ This is the repository for DooringX.
 - 🔥 Written in TypeScript
 - 🛠️ Rich Features
 - 🔩 Universal Plugin Interface
+- 🔥 website: [官网地址](http://x.dooring.cn/dooringx-org)
 - 🏠 预览 [x.dooring](http://x.dooring.cn/editor/home)
 # 简介 | Brief Intro
 

packages/dooringx-lib/package.json

@@ -1,5 +1,5 @@
 {
-	"version": "0.11.1",
+	"version": "0.11.2",
 	"license": "MIT",
 	"main": "dist/index.js",
 	"module": "dist/dooringx-lib.esm.js",

packages/dooringx-lib/src/core/innerDrag/index.ts

@@ -12,6 +12,7 @@ import { innerDragState } from './state';
 import UserConfig from '../../config';
 import { rotateMouseMove, rotateMouseUp } from '../rotateHandler';
 import { specialCoList } from '../utils/special';
+import { marklineState } from '../markline/state';
 
 export const innerDrag = function (
 	item: IBlockType,
@@ -133,6 +134,11 @@ export const innerContainerDragUp = function (config: UserConfig) {
 	const store = config.getStore();
 	const onMouseUp = (e: React.MouseEvent) => {
 		// e.preventDefault(); 这个会导致无法取消选中
+		marklineState.cache = null;
+		marklineState.sortLeft = null;
+		marklineState.sortTop = null;
+		marklineState.sortRight = null;
+		marklineState.sortBottom = null;
 		iframeWrapperMove(config);
 		wrapperMoveMouseUp(config);
 		selectRangeMouseUp(e, config);

packages/dooringx-lib/src/core/markline/calcRender.ts

@@ -2,14 +2,15 @@
  * @Author: yehuozhili
  * @Date: 2021-03-14 04:29:09
  * @LastEditors: yehuozhili
- * @LastEditTime: 2021-07-27 15:33:35
+ * @LastEditTime: 2021-12-31 00:25:43
  * @FilePath: \dooringx\packages\dooringx-lib\src\core\markline\calcRender.ts
  */
 import { innerDragState } from '../innerDrag/state';
 import { newMarklineDisplay } from './normalMode';
 import { marklineConfig } from './marklineConfig';
 import UserConfig from '../../config';
-import { angleToRadian, getContainer } from '../utils';
+import { angleToRadian, binarySearchRemain, getContainer } from '../utils';
+import { marklineState, RealStyleType } from './state';
 export interface LinesTypes {
 	x: number[];
 	y: number[];
@@ -101,23 +102,91 @@ export function marklineCalRender(config: UserConfig, iframe: boolean): LinesTyp
 		}
 		const unfocus = marklineConfig.marklineUnfocus;
 		const len = unfocus.length;
-		for (let i = 0; i < len; i++) {
+
-			const v = unfocus[i];
+		// 只要cache里有东西，说明有缓存
-			const l = v?.left;
+		if (marklineState.cache) {
-			const t = v?.top;
+			if (!marklineState.sortLeft) {
-			const w = v?.width;
+				marklineState.sortLeft = Object.values(marklineState.cache).sort((a, b) => {
-			const h = v?.height;
+					return a.left - b.left;
-			if (
+				});
-				typeof l === 'number' &&
+			}
-				typeof t === 'number' &&
+			if (!marklineState.sortTop) {
-				typeof w === 'number' &&
+				marklineState.sortTop = Object.values(marklineState.cache).sort((a, b) => {
-				typeof h === 'number'
+					return a.top - b.top;
-			) {
+				});
-				const ro = v.rotate.value;
+			}
-				const rstyle = getComponentRotatedStyle(ro, w, h, l, t);
+			if (!marklineState.sortBottom) {
-				newMarklineDisplay(realStyle, rstyle, lines, focus);
+				marklineState.sortBottom = Object.values(marklineState.cache).sort((a, b) => {
-				if (lines.x.length !== 0 || lines.y.length !== 0) {
+					return a.bottom - b.bottom;
-					break;
+				});
+			}
+			if (!marklineState.sortRight) {
+				marklineState.sortRight = Object.values(marklineState.cache).sort((a, b) => {
+					return a.right - b.right;
+				});
+			}
+			const indexLeft = binarySearchRemain<RealStyleType>(
+				realStyle.left,
+				marklineState.sortLeft,
+				'left',
+				marklineConfig.indent
+			);
+			if (indexLeft) {
+				newMarklineDisplay(realStyle, indexLeft, lines, focus);
+			}
+			const indexTop = binarySearchRemain<RealStyleType>(
+				realStyle.top,
+				marklineState.sortTop,
+				'top',
+				marklineConfig.indent
+			);
+			if (indexTop) {
+				newMarklineDisplay(realStyle, indexTop, lines, focus);
+			}
+			const indexRight = binarySearchRemain<RealStyleType>(
+				realStyle.right,
+				marklineState.sortRight,
+				'right',
+				marklineConfig.indent
+			);
+			if (indexRight) {
+				newMarklineDisplay(realStyle, indexRight, lines, focus);
+			}
+			const indexBottom = binarySearchRemain<RealStyleType>(
+				realStyle.bottom,
+				marklineState.sortBottom,
+				'bottom',
+				marklineConfig.indent
+			);
+			if (indexBottom) {
+				newMarklineDisplay(realStyle, indexBottom, lines, focus);
+			}
+		} else {
+			for (let i = 0; i < len; i++) {
+				const v = unfocus[i];
+				const l = v?.left;
+				const t = v?.top;
+				const w = v?.width;
+				const h = v?.height;
+				if (
+					typeof l === 'number' &&
+					typeof t === 'number' &&
+					typeof w === 'number' &&
+					typeof h === 'number'
+				) {
+					const ro = v.rotate.value;
+					const rstyle = getComponentRotatedStyle(ro, w, h, l, t);
+					if (!marklineState.cache) {
+						marklineState.cache = {
+							[v.id]: rstyle,
+						};
+					} else {
+						marklineState.cache[v.id] = rstyle;
+					}
+					newMarklineDisplay(realStyle, rstyle, lines, focus);
+					// if (lines.x.length !== 0 || lines.y.length !== 0) {
+					// 	break; 这里不能break要算完所有值
+					// }
 				}
 			}
 		}

packages/dooringx-lib/src/core/markline/state.ts

@@ -0,0 +1,31 @@
+/*
+ * @Author: yehuozhili
+ * @Date: 2021-12-30 23:02:30
+ * @LastEditors: yehuozhili
+ * @LastEditTime: 2021-12-31 00:13:09
+ * @FilePath: \dooringx\packages\dooringx-lib\src\core\markline\state.ts
+ */
+export interface RealStyleType {
+	[x: string]: number;
+	left: number;
+	width: number;
+	height: number;
+	right: number;
+	top: number;
+	bottom: number;
+}
+
+interface MarklineStateType {
+	cache: null | Record<string, RealStyleType>;
+	sortLeft: null | Array<RealStyleType>;
+	sortTop: null | Array<RealStyleType>;
+	sortRight: null | Array<RealStyleType>;
+	sortBottom: null | Array<RealStyleType>;
+}
+export const marklineState: MarklineStateType = {
+	cache: null,
+	sortLeft: null,
+	sortTop: null,
+	sortRight: null,
+	sortBottom: null,
+};

packages/dooringx-lib/src/core/utils/index.ts

@@ -310,3 +310,25 @@ export function getContainer() {
 	}
 	return container;
 }
+
+export function binarySearchRemain<T extends Record<string, number>>(
+	target: number,
+	arr: Array<T>,
+	attribute: keyof T,
+	indent: number
+) {
+	let start = 0;
+	let end = arr.length - 1;
+
+	while (start <= end) {
+		var mid = parseInt(start + (end - start) / 2 + '');
+		if (target === arr[mid][attribute] || Math.abs(target - arr[mid][attribute]) < indent) {
+			return arr[mid];
+		} else if (target > arr[mid][attribute]) {
+			start = mid + 1;
+		} else {
+			end = mid - 1;
+		}
+	}
+	return null;
+}

packages/dooringx-plugin-template/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dooringx-plugin-template",
-  "version": "0.11.1",
+  "version": "0.11.2",
   "description": "> TODO: description",
   "author": "yehuozhili <673632758@qq.com>",
   "homepage": "https://github.com/H5-Dooring/dooringx#readme",

packages/dooringx-plugin-template/template/template.json

@@ -40,7 +40,7 @@
 		"@rollup/plugin-node-resolve": "^13.0.4",
 		"@rollup/plugin-url": "^6.1.0",
 		"@svgr/rollup": "^5.5.0",
-		"dooringx-lib": "^0.11.1",
+		"dooringx-lib": "^0.11.2",
 		"postcss": "^8.3.6",
 		"rollup-plugin-peer-deps-external": "^2.2.4",
 		"rollup-plugin-postcss": "^4.0.1",