From eda8dd98549dc135c823d516a87539abcf18d1b4 Mon Sep 17 00:00:00 2001 From: chenshenhai Date: Wed, 16 Jun 2021 20:25:37 +0800 Subject: [PATCH] feat: @idraw/core update static method is --- packages/core/__tests__/lib/core-is.test.ts | 94 +++++++++++++++++++++ packages/core/src/index.ts | 4 +- packages/core/src/lib/check.ts | 9 +- packages/core/src/lib/is.ts | 55 ++++++++++++ packages/types/src/lib/element.ts | 14 +-- packages/util/src/lib/color.ts | 2 +- 6 files changed, 163 insertions(+), 15 deletions(-) diff --git a/packages/core/__tests__/lib/core-is.test.ts b/packages/core/__tests__/lib/core-is.test.ts index 66f8492..b5c5fc0 100644 --- a/packages/core/__tests__/lib/core-is.test.ts +++ b/packages/core/__tests__/lib/core-is.test.ts @@ -44,4 +44,98 @@ describe("@idraw/core static is", () => { expect(Core.is.angle(-370)).toStrictEqual(false); }); + test('Core.is.borderWidth', () => { + expect(Core.is.borderWidth(0)).toStrictEqual(true); + expect(Core.is.borderWidth(100)).toStrictEqual(true); + expect(Core.is.borderWidth(-100)).toStrictEqual(false); + expect(Core.is.borderWidth(-370)).toStrictEqual(false); + }); + + test('Core.is.borderRadius', () => { + expect(Core.is.borderRadius(0)).toStrictEqual(true); + expect(Core.is.borderRadius(100)).toStrictEqual(true); + expect(Core.is.borderRadius(-100)).toStrictEqual(false); + expect(Core.is.borderRadius(-370)).toStrictEqual(false); + }); + + test('Core.is.color', () => { + expect(Core.is.color('#a23')).toStrictEqual(true); + expect(Core.is.color('#a2312f')).toStrictEqual(true); + expect(Core.is.color('#a2312')).toStrictEqual(false); + expect(Core.is.color('#a2')).toStrictEqual(false); + }); + + test('Core.is.imageSrc', () => { + expect(Core.is.imageSrc('https://xxxxx')).toStrictEqual(true); + expect(Core.is.imageSrc('http://xxxxx')).toStrictEqual(true); + expect(Core.is.imageSrc('./xxxxx/xxx')).toStrictEqual(true); + expect(Core.is.imageSrc('/xxxxx/xxx')).toStrictEqual(true); + expect(Core.is.imageSrc('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAOg')).toStrictEqual(true); + expect(Core.is.imageSrc('dafafsfsaffafa')).toStrictEqual(false); + }); + + test('Core.is.imageURL', () => { + expect(Core.is.imageURL('https://xxxxx')).toStrictEqual(true); + expect(Core.is.imageURL('http://xxxxx')).toStrictEqual(true); + expect(Core.is.imageURL('./xxxxx/xxx')).toStrictEqual(true); + expect(Core.is.imageURL('/xxxxx/xxx')).toStrictEqual(true); + expect(Core.is.imageURL('dafafsfsaffafa')).toStrictEqual(false); + }); + + test('Core.is.imageBase64', () => { + expect(Core.is.imageBase64('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAOg')).toStrictEqual(true); + expect(Core.is.imageBase64('http://xxxxx')).toStrictEqual(false); + expect(Core.is.imageBase64('./xxxxx/xxx')).toStrictEqual(false); + expect(Core.is.imageBase64('/xxxxx/xxx')).toStrictEqual(false); + expect(Core.is.imageBase64('dafafsfsaffafa')).toStrictEqual(false); + }); + + test('Core.is.svg', () => { + expect(Core.is.svg(` + + + + `)).toStrictEqual(true); + expect(Core.is.svg(` + + + + `)).toStrictEqual(true); + expect(Core.is.svg('./xxxxx/xxx')).toStrictEqual(false); + expect(Core.is.svg('/xxxxx/xxx')).toStrictEqual(false); + expect(Core.is.svg('dafafsfsaffafa')).toStrictEqual(false); + }); + + test('Core.is.text', () => { + expect(Core.is.text('abcdefg123456')).toStrictEqual(true); + expect(Core.is.text('')).toStrictEqual(true); + expect(Core.is.text(123)).toStrictEqual(false); + }); + + test('Core.is.fontSize', () => { + expect(Core.is.fontSize(12)).toStrictEqual(true); + expect(Core.is.fontSize(0)).toStrictEqual(false); + expect(Core.is.fontSize(-10)).toStrictEqual(false); + }); + + test('Core.is.lineHeight', () => { + expect(Core.is.lineHeight(12)).toStrictEqual(true); + expect(Core.is.lineHeight(0)).toStrictEqual(false); + expect(Core.is.lineHeight(-10)).toStrictEqual(false); + }); + + test('Core.is.textAlign', () => { + expect(Core.is.textAlign('center')).toStrictEqual(true); + expect(Core.is.textAlign('left')).toStrictEqual(true); + expect(Core.is.textAlign('right')).toStrictEqual(true); + expect(Core.is.textAlign('helloworld')).toStrictEqual(false); + }); + + + test('Core.is.fontFamily', () => { + expect(Core.is.fontFamily('yahei')).toStrictEqual(true); + expect(Core.is.fontFamily('helloworld')).toStrictEqual(true); + expect(Core.is.fontFamily('')).toStrictEqual(false); + }); + }) \ No newline at end of file diff --git a/packages/core/src/index.ts b/packages/core/src/index.ts index 2b6c356..b6a010b 100644 --- a/packages/core/src/index.ts +++ b/packages/core/src/index.ts @@ -60,8 +60,8 @@ class Core { private [_prevPoint]: TypePoint | null = null; private [_selectedDotDirection]: TypeHelperWrapperDotDirection | null = null; - static is = is; - static check = check; + static is: any = is; + static check: any = check; constructor(mount: HTMLDivElement, opts: TypeCoreOptions, config?: TypeConfig) { this[_data] = { elements: [] }; diff --git a/packages/core/src/lib/check.ts b/packages/core/src/lib/check.ts index acdd5e4..d536a0f 100644 --- a/packages/core/src/lib/check.ts +++ b/packages/core/src/lib/check.ts @@ -1,9 +1,7 @@ -import { TypeElementAttrs} from '@idraw/types'; -import util from '@idraw/util'; +import { TypeElementAttrs } from '@idraw/types'; import is from './is'; -const { isColorStr } = util.color; function attrs( attrs: TypeElementAttrs @@ -22,10 +20,10 @@ function rectDesc( desc: any ): boolean { const { borderColor, borderRadius, borderWidth, color } = desc; - if (typeof borderColor === 'string' && !isColorStr(color)) { + if (typeof borderColor === 'string' && !is.color(color)) { return false; } - if (typeof borderColor === 'string' && !isColorStr(borderColor)) { + if (typeof borderColor === 'string' && !is.color(borderColor)) { return false; } if (typeof borderRadius === 'number' && !is.number(borderRadius)) { @@ -41,5 +39,6 @@ const check = { attrs, rectDesc, } + export default check; \ No newline at end of file diff --git a/packages/core/src/lib/is.ts b/packages/core/src/lib/is.ts index 7ed2702..5b96c46 100644 --- a/packages/core/src/lib/is.ts +++ b/packages/core/src/lib/is.ts @@ -1,3 +1,6 @@ +import util from "@idraw/util"; + +const { isColorStr } = util.color; function number(value: any) { return (typeof value === 'number' && (value > 0 || value <= 0)) @@ -23,8 +26,60 @@ function angle(value: any) { return (typeof value === 'number' && value >= -360 && value <= 360) } +function borderWidth(value: any) { + return w(value); +} + +function borderRadius(value: any) { + return number(value) && value >= 0; +} + +function color(value: any) { + return isColorStr(value); +} + +function imageURL(value: any) { + return (typeof value === 'string' && /^(http:\/\/|https:\/\/|\.\/|\/)/.test(`${value}`)) +} + +function imageBase64(value: any) { + return (typeof value === 'string' && /^(data:image\/)/.test(`${value}`)) +} + +function imageSrc(value: any) { + return (imageBase64(value) || imageURL(value)) +} + +function svg(value: any) { + return (typeof value === 'string' && /^()/i.test(`${value}`.trim()) && /<\/[\s]{0,}svg>$/i.test(`${value}`.trim())); +} + +function text(value: any) { + return typeof value === 'string'; +} + +function fontSize(value: any) { + return number(value) && value > 0; +} + +function lineHeight(value: any) { + return number(value) && value > 0; +} + +function textAlign(value: any) { + return ['center', 'left', 'right'].includes(value); +} + +function fontFamily(value: any) { + return typeof value === 'string' && value.length > 0; +} + + const is = { x, y, w, h, angle, number, + borderWidth, borderRadius, color, + imageSrc, imageURL, imageBase64, svg, + text, fontSize, lineHeight, textAlign, fontFamily, } export default is; \ No newline at end of file diff --git a/packages/types/src/lib/element.ts b/packages/types/src/lib/element.ts index a9016ec..e0fd436 100644 --- a/packages/types/src/lib/element.ts +++ b/packages/types/src/lib/element.ts @@ -24,7 +24,7 @@ type TypeElemBoxDesc = { type TypeElemDesc = { text: TypeElemDescText, rect: TypeElemDescRect, - circle: TypeElemDescCircle, + // circle: TypeElemDescCircle, image: TypeElemDescImage, svg: TypeElemDescSVG, // paint: TypeElemDescPaint, @@ -44,11 +44,11 @@ type TypeElemDescText = { textAlign?: 'center' | 'left' | 'right'; } & TypeElemBoxDesc -type TypeElemDescCircle = { - r: number; - x: number; - y: number; -} +// type TypeElemDescCircle = { +// r: number; +// x: number; +// y: number; +// } type TypeElemDescImage = { src: string; @@ -64,7 +64,7 @@ export { TypeElementAttrs, TypeElemDescText, TypeElemDescRect, - TypeElemDescCircle, + // TypeElemDescCircle, TypeElemDescImage, TypeElemDescSVG, TypeElemDesc, diff --git a/packages/util/src/lib/color.ts b/packages/util/src/lib/color.ts index dd1f290..baa61b1 100644 --- a/packages/util/src/lib/color.ts +++ b/packages/util/src/lib/color.ts @@ -7,5 +7,5 @@ export function toColorHexStr(color: number): string { } export function isColorStr(color?: string): boolean { - return typeof color === 'string' && /^\#[0-9a-z]{3,8}$/i.test(color); + return typeof color === 'string' && /^\#([0-9a-f]{3}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(color); } \ No newline at end of file