From 5dcd706712a7128c06e47669075828dfd62d1b24 Mon Sep 17 00:00:00 2001 From: luojiahao Date: Fri, 7 Oct 2022 11:17:24 +0800 Subject: [PATCH] add build widgets script and format code --- CHANGELOG.md | 2 +- package.json | 4 +- src/components/clock/clock.ts | 14 +++- src/components/digicipher/README.md | 17 ++--- src/components/dock/dock.ts | 8 +- src/components/overflowmenu/overflowmenu.ts | 13 +++- src/components/overlay/active-overlay.ts | 8 +- src/components/overlay/overlay-stack.ts | 9 ++- src/components/overlay/overlay-types.ts | 6 +- src/components/overlay/overlaystyle.ts | 18 ++--- src/components/ul/ul.css.ts | 6 +- src/test/panels/battery/battery.ts | 7 +- src/test/panels/overflowmenu/overflowmenu.ts | 35 +++++++-- tasks/build-widgets.js | 77 ++++++++++++++++++++ tasks/esbuild-packages.js | 4 +- tsconfig-all.json | 7 +- widgets.config.ts | 13 ---- 17 files changed, 180 insertions(+), 68 deletions(-) create mode 100644 tasks/build-widgets.js delete mode 100644 widgets.config.ts diff --git a/CHANGELOG.md b/CHANGELOG.md index 6fe5432..48d2fed 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -25,4 +25,4 @@ - add homescreen function for storing apps' order - fix bugs of container - add gauss blur component -- change container's gesture function \ No newline at end of file +- change container's gesture function diff --git a/package.json b/package.json index 214a72b..8cac1c8 100644 --- a/package.json +++ b/package.json @@ -13,8 +13,8 @@ "dev": "vite", "build": "yarn run esbuild:ts && yarn run build:ts", "build:ts": "yarn tsc --build tsconfig-all.json", - "build:vite": "vite build", - "build:widgets": "bin/build-widget", + "build:vite": "vite build && yarn build:widgets", + "build:widgets": "node ./tasks/build-widgets.js", "esbuild:ts": "node ./tasks/esbuild-packages.js", "format": "npm run format:prettier", "format:prettier": "prettier \"**/*.{cjs,html,js,json,md,ts}\" --write" diff --git a/src/components/clock/clock.ts b/src/components/clock/clock.ts index 2b2ec97..daf29f6 100644 --- a/src/components/clock/clock.ts +++ b/src/components/clock/clock.ts @@ -125,15 +125,21 @@ export class StarClock extends LitElement { this.style.setProperty('--rotateSecond', this.rotateSecond + 'deg') this.style.setProperty('--rotateMinute', this.rotateMinute + 'deg') this.style.setProperty('--rotateHour', this.rotateHour + 'deg') - this.style.setProperty('--rotateSecondAfter',this.rotateSecond + 360 + 'deg') - this.style.setProperty('--rotateMinuteAfter',this.rotateMinute + 360 + 'deg') + this.style.setProperty( + '--rotateSecondAfter', + this.rotateSecond + 360 + 'deg' + ) + this.style.setProperty( + '--rotateMinuteAfter', + this.rotateMinute + 360 + 'deg' + ) this.style.setProperty('--rotateHourAfter', this.rotateHour + 360 + 'deg') - this.resizeFun() + this.resizeFun() window.addEventListener('resize', () => { this.resizeFun() }) } - protected resizeFun(){ + protected resizeFun() { let min = Math.min( this.starClock?.clientHeight || 100, this.starClock?.clientWidth || 100 diff --git a/src/components/digicipher/README.md b/src/components/digicipher/README.md index ce382d4..c98032f 100644 --- a/src/components/digicipher/README.md +++ b/src/components/digicipher/README.md @@ -5,25 +5,24 @@ - 由 0-9 数字组成的数字密码 - 默认密码为 `123456` - 点击数字反馈，输入成功上滑，输入错误抖动反馈 -- 两分钟内记忆用户输入次数，如 : 用户输入3次错误密码后，两分钟内用户输入2次将锁定，两分钟后还原5次机会 +- 两分钟内记忆用户输入次数，如 : 用户输入 3 次错误密码后，两分钟内用户输入 2 次将锁定，两分钟后还原 5 次机会 ## 使用 + 1. 默认情况 + ``` ``` + 1. `saveMode` 属性代表存储模式，更改密码、确认密码后存储新密码 + ``` ``` ## 发送事件 -解锁成功：`star-digicipher-unlocksuccess` **value:** `this.passwd`
-解锁5次失败，跳转已锁定：`star-digicipher-locked` **value:** `false`
-完成存储：`star-digicipher-savesuccess` **value:** `this.passwd` - - - - - +解锁成功：`star-digicipher-unlocksuccess` **value:** `this.passwd`
+解锁 5 次失败，跳转已锁定：`star-digicipher-locked` **value:** `false`
+完成存储：`star-digicipher-savesuccess` **value:** `this.passwd` diff --git a/src/components/dock/dock.ts b/src/components/dock/dock.ts index 9220c77..7ccc04e 100644 --- a/src/components/dock/dock.ts +++ b/src/components/dock/dock.ts @@ -287,8 +287,8 @@ export default class StarDock extends StarBaseElement { break case 'holdmove': - // case 'touchmove': - // case 'mousemove': + // case 'touchmove': + // case 'mousemove': let pageX: number, pageY: number, clientX, clientY // if (event instanceof MouseEvent) { // pageX = event.pageX @@ -366,8 +366,8 @@ export default class StarDock extends StarBaseElement { break case 'holdend': - // case 'touchend': - // case 'mouseup': + // case 'touchend': + // case 'mouseup': if (this._dnd.active) { event.preventDefault() } diff --git a/src/components/overflowmenu/overflowmenu.ts b/src/components/overflowmenu/overflowmenu.ts index 465ece9..66c6045 100644 --- a/src/components/overflowmenu/overflowmenu.ts +++ b/src/components/overflowmenu/overflowmenu.ts @@ -2,7 +2,7 @@ import {LitElement, html, HTMLTemplateResult, CSSResultArray} from 'lit' import {customElement, property, queryAssignedElements} from 'lit/decorators.js' import '../button/button.js' import {OverlayStack} from '../overlay/overlay-stack' -import { TriggerInteractions } from '../overlay/overlay-types.js' +import {TriggerInteractions} from '../overlay/overlay-types.js' import {sharedStyles} from './overflowmenustyle.js' @customElement('star-overflowmenu') @@ -34,9 +34,16 @@ export class StarOverflowMenu extends LitElement { const overlaycontent = this.querySelector('#menu') as HTMLElement // overlaycontent为空则退出 if (!overlaycontent) return - const triggerInteraction = this.getAttribute('triggertype') as TriggerInteractions + const triggerInteraction = this.getAttribute( + 'triggertype' + ) as TriggerInteractions // 开启overlay - this.overlayStack.openOverlay(originalNode, targetNode, overlaycontent, triggerInteraction) + this.overlayStack.openOverlay( + originalNode, + targetNode, + overlaycontent, + triggerInteraction + ) } else { this.overlayStack.closeOverlay() } diff --git a/src/components/overlay/active-overlay.ts b/src/components/overlay/active-overlay.ts index 7ae3359..44bf204 100644 --- a/src/components/overlay/active-overlay.ts +++ b/src/components/overlay/active-overlay.ts @@ -108,22 +108,22 @@ export class ActiveOverlay extends LitElement { targettop - (contentheight - targetnode.offsetHeight) - topboundingclient - this.setAttribute("placement","rightbottom") + this.setAttribute('placement', 'rightbottom') } else if (rightline) { // 右侧边界 left = targetleft - this.restoreContent.offsetWidth top = targettop - topboundingclient - this.setAttribute("placement","right") + this.setAttribute('placement', 'right') } else if (bottomline) { // 下侧边界 left = targetleft + targetnode.offsetWidth top = targetbottom - contentheight - topboundingclient - this.setAttribute("placement","bottom") + this.setAttribute('placement', 'bottom') } else { // 正常情况 left = targetleft + targetnode.offsetWidth top = targettop - topboundingclient - this.setAttribute("placement","normal") + this.setAttribute('placement', 'normal') } this.style.left = left + 'px' this.style.top = top + 'px' diff --git a/src/components/overlay/overlay-stack.ts b/src/components/overlay/overlay-stack.ts index 9fe3a2c..776caad 100644 --- a/src/components/overlay/overlay-stack.ts +++ b/src/components/overlay/overlay-stack.ts @@ -1,5 +1,5 @@ import {ActiveOverlay} from './active-overlay' -import { TriggerInteractions } from './overlay-types' +import {TriggerInteractions} from './overlay-types' export class OverlayStack { public overlays: ActiveOverlay[] = [] @@ -12,7 +12,12 @@ export class OverlayStack { triggerInteraction: TriggerInteractions ) { // 创建activeoverlay对象 - const activeOverlay = ActiveOverlay.create(root, targetnode, content, triggerInteraction) + const activeOverlay = ActiveOverlay.create( + root, + targetnode, + content, + triggerInteraction + ) // 开启状态 this.isOpen = true // 创建注释节点模板——用于替换要展示在overlay中的元素 diff --git a/src/components/overlay/overlay-types.ts b/src/components/overlay/overlay-types.ts index afab8a9..b547b0f 100644 --- a/src/components/overlay/overlay-types.ts +++ b/src/components/overlay/overlay-types.ts @@ -1,10 +1,7 @@ // 定义overlay所需各种参数类型、预留接口 // 弹窗的交互类型：溢出菜单、底部菜单、信息菜单 -export type TriggerInteractions = - | 'overflowmenu' - | 'bottommenu' - | 'infomenu' +export type TriggerInteractions = 'overflowmenu' | 'bottommenu' | 'infomenu' // 主题：lm：light-model； dm：dark-model export type thememode = 'lm' | 'dm' @@ -19,5 +16,4 @@ export interface OverlayOpenDetail { // skidding?: number // 滑动 // virtualTrigger?: VirtualTrigger // 虚拟触发 // trigger: HTMLElement // 触发 - } diff --git a/src/components/overlay/overlaystyle.ts b/src/components/overlay/overlaystyle.ts index 63a595c..b29c9d0 100644 --- a/src/components/overlay/overlaystyle.ts +++ b/src/components/overlay/overlaystyle.ts @@ -6,42 +6,42 @@ export const sharedStyles: CSSResult = css` :host([placement='normal'])::before { position: absolute; - content: ""; + content: ''; top: 34px; left: -16px; border-top: 16px solid transparent; border-bottom: 16px solid transparent; - border-right: 16px solid #F5F5F5; + border-right: 16px solid #f5f5f5; } :host([placement='right'])::before { position: absolute; - content: ""; + content: ''; top: 34px; right: -16px; z-index: 2; border-top: 16px solid transparent; border-bottom: 16px solid transparent; - border-left: 16px solid #F5F5F5; + border-left: 16px solid #f5f5f5; } - + :host([placement='bottom'])::before { position: absolute; - content: ""; + content: ''; bottom: 34px; left: -16px; border-top: 16px solid transparent; border-bottom: 16px solid transparent; - border-right: 16px solid #F5F5F5; + border-right: 16px solid #f5f5f5; } :host([placement='rightbottom'])::before { position: absolute; - content: ""; + content: ''; bottom: 34px; right: -16px; border-top: 16px solid transparent; border-bottom: 16px solid transparent; - border-left: 16px solid #F5F5F5; + border-left: 16px solid #f5f5f5; } ` diff --git a/src/components/ul/ul.css.ts b/src/components/ul/ul.css.ts index 9460182..f59daf0 100644 --- a/src/components/ul/ul.css.ts +++ b/src/components/ul/ul.css.ts @@ -17,11 +17,11 @@ export default css` position: relative; } - :host(#overflowmenu) ul{ + :host(#overflowmenu) ul { padding: 12px 0; } - :host(#bottommenu){ + :host(#bottommenu) { width: 520px; height: 400px; display: block; @@ -29,7 +29,7 @@ export default css` border-radius: 20px; } - :host(#bottommenu) ul{ + :host(#bottommenu) ul { padding: 20px 0; } diff --git a/src/test/panels/battery/battery.ts b/src/test/panels/battery/battery.ts index 0edd4db..7f307de 100644 --- a/src/test/panels/battery/battery.ts +++ b/src/test/panels/battery/battery.ts @@ -13,7 +13,12 @@ export class PanelBattery extends LitElement { - + diff --git a/src/test/panels/overflowmenu/overflowmenu.ts b/src/test/panels/overflowmenu/overflowmenu.ts index f90086a..71507df 100644 --- a/src/test/panels/overflowmenu/overflowmenu.ts +++ b/src/test/panels/overflowmenu/overflowmenu.ts @@ -15,7 +15,12 @@ export class PanelOverflowMenu extends LitElement { return html`