clickgo 3.15.17 → 3.15.19
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -1
- package/dist/app/demo/form/method/form/form.js +5 -0
- package/dist/app/demo/form/method/form/form.xml +5 -1
- package/dist/clickgo.js +1 -1
- package/dist/clickgo.ts +1 -1
- package/dist/control/arteditor.cgc +0 -0
- package/dist/control/box.cgc +0 -0
- package/dist/control/common.cgc +0 -0
- package/dist/control/desc.cgc +0 -0
- package/dist/control/drawer.cgc +0 -0
- package/dist/control/echarts.cgc +0 -0
- package/dist/control/form.cgc +0 -0
- package/dist/control/iconview.cgc +0 -0
- package/dist/control/jodit.cgc +0 -0
- package/dist/control/map.cgc +0 -0
- package/dist/control/monaco.cgc +0 -0
- package/dist/control/nav.cgc +0 -0
- package/dist/control/page.cgc +0 -0
- package/dist/control/property.cgc +0 -0
- package/dist/control/table.cgc +0 -0
- package/dist/control/task.cgc +0 -0
- package/dist/control/tuieditor.cgc +0 -0
- package/dist/control/tuiviewer.cgc +0 -0
- package/dist/control/xterm.cgc +0 -0
- package/dist/global.css +1 -1
- package/dist/lib/dom.js +3 -3
- package/dist/lib/dom.ts +3 -3
- package/dist/lib/form.js +69 -9
- package/dist/lib/form.ts +88 -10
- package/dist/lib/task.js +3 -0
- package/dist/lib/task.ts +3 -0
- package/dist/theme/byterun.cgt +0 -0
- package/dist/theme/familiar.cgt +0 -0
- package/dist/theme/light.cgt +0 -0
- package/package.json +1 -1
- package/types/index.d.ts +5 -0
package/README.md
CHANGED
|
@@ -25,7 +25,7 @@ Load the module loader first, and then load it using the module loader.
|
|
|
25
25
|
**index.html**
|
|
26
26
|
|
|
27
27
|
```html
|
|
28
|
-
<script src="https://cdn.jsdelivr.net/npm/@litert/loader@3.5.7/dist/loader.min.js?path=index&npm={'clickgo':'3.15.
|
|
28
|
+
<script src="https://cdn.jsdelivr.net/npm/@litert/loader@3.5.7/dist/loader.min.js?path=index&npm={'clickgo':'3.15.19'}"></script>
|
|
29
29
|
```
|
|
30
30
|
|
|
31
31
|
**index.js**
|
|
@@ -39,6 +39,7 @@ class default_1 extends clickgo.form.AbstractForm {
|
|
|
39
39
|
this.fid = '0';
|
|
40
40
|
this.tid = '0';
|
|
41
41
|
this.type = ['primary'];
|
|
42
|
+
this.atype = ['default'];
|
|
42
43
|
this.progress = ['noraml'];
|
|
43
44
|
this.dr = '';
|
|
44
45
|
this.hash = 'hash' + clickgo.tool.rand(0, 100).toString();
|
|
@@ -161,6 +162,10 @@ class default_1 extends clickgo.form.AbstractForm {
|
|
|
161
162
|
}
|
|
162
163
|
});
|
|
163
164
|
}
|
|
165
|
+
alert() {
|
|
166
|
+
const aid = clickgo.form.alert(this.atype[0], this.atype[0]);
|
|
167
|
+
console.log('aid', aid);
|
|
168
|
+
}
|
|
164
169
|
showPop(e) {
|
|
165
170
|
if (!e.currentTarget) {
|
|
166
171
|
return;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
<form width="350" height="
|
|
1
|
+
<form width="350" height="500" title="Library form">
|
|
2
2
|
<flow direction="v" style="flex: 1; padding: 10px;">
|
|
3
3
|
<layout gutter="10" direction="v" style="flex: 1;">
|
|
4
4
|
<label>This form id: {{formId}}</label>
|
|
@@ -42,6 +42,10 @@
|
|
|
42
42
|
<select v-model="progress" :data="['normal', 'progress + icon', 'only title', 'only content']" style="flex: 1; width: 0;"></select>
|
|
43
43
|
<button @click="notify">notify({ ... })</button>
|
|
44
44
|
</layout>
|
|
45
|
+
<layout gutter="10">
|
|
46
|
+
<select v-model="atype" :data="['default', 'primary', 'info', 'warning', 'danger']" style="flex: 1;"></select>
|
|
47
|
+
<button @click="alert">alert({ ... })</button>
|
|
48
|
+
</layout>
|
|
45
49
|
<button @click="showPop">showPop(e.currentTarget, this.refs.pop)</button>
|
|
46
50
|
<teleport to="system">
|
|
47
51
|
<layout ref="pop" gutter="10" direction="v" align-v="center" align-h="center" style="border: solid 1px #000; background: #FFF; width: 200px; height: 100px;">
|
package/dist/clickgo.js
CHANGED
package/dist/clickgo.ts
CHANGED
|
Binary file
|
package/dist/control/box.cgc
CHANGED
|
Binary file
|
package/dist/control/common.cgc
CHANGED
|
Binary file
|
package/dist/control/desc.cgc
CHANGED
|
Binary file
|
package/dist/control/drawer.cgc
CHANGED
|
Binary file
|
package/dist/control/echarts.cgc
CHANGED
|
Binary file
|
package/dist/control/form.cgc
CHANGED
|
Binary file
|
|
Binary file
|
package/dist/control/jodit.cgc
CHANGED
|
Binary file
|
package/dist/control/map.cgc
CHANGED
|
Binary file
|
package/dist/control/monaco.cgc
CHANGED
|
Binary file
|
package/dist/control/nav.cgc
CHANGED
|
Binary file
|
package/dist/control/page.cgc
CHANGED
|
Binary file
|
|
Binary file
|
package/dist/control/table.cgc
CHANGED
|
Binary file
|
package/dist/control/task.cgc
CHANGED
|
Binary file
|
|
Binary file
|
|
Binary file
|
package/dist/control/xterm.cgc
CHANGED
|
Binary file
|
package/dist/global.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
#cg-wrap{position:fixed;left:0;top:0;--g-padding-s:4px;--g-padding:7px;--g-padding-h:4px var(--g-padding);--g-padding-l:14px;--g-padding-l-h:8px var(--g-padding-l);--g-padding-xl:22px;--g-padding-xl-h:12px var(--g-padding-xl);--g-bpadding:18px;--g-margin:2px;--g-radius:0;--g-radius-l:4px;--g-radius-xl:8px;--g-size:12px;--g-size-m:16px;--g-size-l:20px;--g-size-xl:28px;--g-control:14px;--g-family:"Lucida Sans Unicode","Helvetica Neue","Helvetica","PingFang SC","Hiragino Sans GB","Noto Sans CJK SC","Noto Sans CJK","Source Han Sans","WenQuanYi Micro Hei","Microsoft YaHei","sans-serif";--g-line:1;--g-cubic:cubic-bezier(0.39, 0.575, 0.565, 1);--g-transition:none;--g-lineheight:1.2;--g-boxsize:calc(var(--g-padding) * 2 + var(--g-size));--cg:hsl(20, 100%, 65%);--success:hsl(150, 100%, 40%);--success-hover:hsl(150, 100%, 45%);--success-active:hsl(150, 100%, 30%);--success-focus:hsl(150, 100%, 35%);--success-disabled:hsl(150, 0%, 40%);--success-bg:hsl(150, 100%, 98%);--info:hsl(210, 100%, 50%);--info-hover:hsl(210, 100%, 60%);--info-active:hsl(210, 100%, 40%);--info-focus:hsl(210, 100%, 45%);--info-disabled:hsl(210, 0%, 50%);--info-bg:hsl(210, 100%, 98%);--warning:hsl(20, 100%, 70%);--warning-hover:hsl(20, 100%, 80%);--warning-active:hsl(20, 100%, 60%);--warning-focus:hsl(20, 100%, 65%);--warning-disabled:hsl(20, 0%, 70%);--warning-bg:hsl(20, 100%, 98%);--danger:hsl(350, 100%, 50%);--danger-hover:hsl(350, 100%, 70%);--danger-active:hsl(350, 100%, 40%);--danger-focus:hsl(350, 100%, 45%);--danger-disabled:hsl(350, 0%, 50%);--danger-bg:hsl(350, 100%, 98%);--system-color:hsl(0, 0%, 95%);--system-background:hsla(0, 0%, 0%, .35);--system-control-background:hsla(0, 0%, 100%, .03);--system-background-hover:hsla(0, 0%, 100%, .06);--system-background-active:hsla(0, 0%, 100%, .1);--system-border-color:hsla(0, 0%, 100%, .03);--system-border-color-hover:hsla(0, 0%, 100%, .06);--system-placeholder-color: hsla(0, 0%, 100%, .2);--face:hsl(0, 0%, 95%);--face-child:hsl(0, 0%, 90%);--face-hover:hsl(0, 0%, 88%);--face-selected:hsl(0, 0%, 85%);--g-pop-background:#FFF;--g-pop-backdrop:none;--g-pop-border:solid .5px var(--g-border-color);--g-shadow:none;--g-outline-shadow:none;--g-color:hsl(0, 0%, 35%);--g-color-hover:hsl(0, 0%, 45%);--g-color-active:hsl(0, 0%, 25%);--g-color-focus:hsl(0, 0%, 30%);--g-color-disabled:hsl(0, 0%, 60%);--g-background:hsl(0, 0%, 95%);--g-background-hover:hsl(0, 0%, 100%);--g-background-active:hsl(0, 0%, 85%);--g-background-opacity:hsl(0, 0%, 50%, .2);--g-background-focus:hsl(0, 0%, 97.5%);--g-background-disabled:hsl(0, 0%, 75%);--g-border-color:hsl(0, 0%, 40%);--g-border-color-hover:hsl(0, 0%, 50%);--g-border-color-active:hsl(0, 0%, 30%);--g-border-color-focus:hsl(0, 0%, 35%);--g-border-color-disabled:hsl(0, 0%, 60%);--g-focusbox-border-color:var(--g-plain-border-color);--g-plain-color:var(--g-color);--g-plain-color-hover:var(--g-color-hover);--g-plain-color-active:var(--g-color-active);--g-plain-color-focus:var(--g-color-focus);--g-plain-color-disabled:var(--g-color-disabled);--g-plain-background:hsl(0, 0%, 100%);--g-plain-background-hover:hsl(0, 0%, 98%);--g-plain-background-active:hsl(0, 0%, 95%);--g-plain-background-focus:var(--g-plain-background);--g-plain-background-disabled:hsl(0, 0%, 95%);--g-plain-background-selected:hsl(0, 0%, 95%);--g-plain-border-color:hsl(0, 0%, 70%);--g-plain-border-color-hover:hsl(0, 0%, 80%);--g-plain-border-color-active:hsl(0, 0%, 60%);--g-plain-border-color-focus:hsl(0, 0%, 65%);--g-plain-border-color-disabled:hsl(0, 0%, 60%);--g-plain-border-color-plain:hsl(0, 0%, 85%);--g-block-background:hsl(0, 0%, 85%);--g-block-background-hover:hsl(0, 0%, 75%);--g-block-dark-background:hsl(0, 0%, 15%);--g-block-dark-background-hover:hsl(0, 0%, 25%)}[data-cg-disabled]{cursor:not-allowed}#cg-form-list{z-index:20020000}#cg-pop-list{z-index:20020001}#cg-simpletask{z-index:20020002}#cg-rectangle{z-index:20020003;box-sizing:border-box;position:absolute;border-radius:3px;box-shadow:0 0 10px rgba(0,0,0,.25);background:rgba(255,255,255,.05);pointer-events:none;opacity:0}#cg-circular{z-index:20020003;box-sizing:border-box;position:absolute;border:solid 3px var(--cg);border-radius:50%;filter:drop-shadow(0 0 3px var(--cg));pointer-events:none;opacity:0}#cg-gesture{z-index:20020003;box-sizing:border-box;position:absolute;border-radius:50%;pointer-events:none;opacity:0;background:var(--system-background);box-shadow:0px 15px 30px rgba(0,0,0,.07);transform:scale(0);width:20px;height:20px}#cg-gesture.done{background:rgba(255,255,255,.3);border:solid 3px rgba(0,0,0,.3)}#cg-gesture.ani{transition:all .3s var(--g-cubic);transition-property:left,top,transform}#cg-drag{z-index:20020003;box-sizing:border-box;position:absolute;border-radius:3px;pointer-events:none;background:rgba(255,255,255,.1);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);box-shadow:0 3px 5px rgba(0,0,0,.1);opacity:0;display:flex;justify-content:center;align-items:center;border:solid 1px #fff;transition:all .3s var(--g-cubic);transition-property:transform,border;transform:initial}#cg-launcher{z-index:20020004;box-sizing:border-box;position:fixed;background:var(--system-background);-webkit-backdrop-filter:blur(30px) saturate(1.5);backdrop-filter:blur(30px) saturate(1.5);width:100%;height:100%;left:0;top:0;color:var(--system-color);display:none;flex-direction:column;transition:all .3s var(--g-cubic);transform:scale(1.2);opacity:0}#cg-launcher:not(.cg-show){pointer-events:none}#cg-launcher.cg-show{transform:scale(1);opacity:1}.cg-launcher-search{text-align:center;padding:50px}.cg-launcher-sinput{-webkit-appearance:none;appearance:none;padding:15px;border:solid 1px rgba(0,0,0,0);background:var(--system-control-background);width:60%;border-radius:5px;color:var(--system-color);transition:all .3s var(--g-cubic)}.cg-launcher-sinput::placeholder{color:var(--system-placeholder-color)}.cg-launcher-sinput::selection{background-color:var(--system-background-hover)}.cg-launcher-sinput:focus{outline:none;border-color:var(--system-border-color-hover)}.cg-launcher-foldername{-webkit-appearance:none;appearance:none;height:50px;font-size:28px !important;border:none;background:rgba(0,0,0,0);width:50%;color:var(--system-color);text-align:center}.cg-launcher-foldername::selection{background-color:var(--system-background-hover)}.cg-launcher-foldername:focus{outline:none}.cg-launcher-item{width:190px;display:inline-flex;vertical-align:middle;margin-bottom:50px}.cg-launcher-inner{flex:1;width:0}.cg-launcher-icon{background-position:center;background-size:80px;height:80px;background-repeat:no-repeat}.cg-launcher-icon:active{filter:brightness(0.6)}.cg-launcher-name{font-size:var(--g-size);font-weight:bold;text-shadow:0 0 3px rgba(0,0,0,.6);text-align:center;margin-top:20px}.cg-launcher-icon,.cg-launcher-name{transition:all .3s var(--g-cubic);transition-property:opacity}.cg-launcher-space{width:50px}.cg-launcher-folder{display:flex;justify-content:center;height:80px}.cg-launcher-folder>div{height:80px;width:80px;background:rgba(255,255,255,.3);border-radius:20px;padding:10px 4px 4px 10px;transition:all .3s var(--g-cubic);transition-property:left,top,width,height,opacity;overflow-y:auto}.cg-launcher-folder>div::-webkit-scrollbar{display:none}.cg-launcher-folder>div .cg-launcher-item,.cg-launcher-folder>div .cg-launcher-space{transition:all .3s var(--g-cubic)}.cg-launcher-folder>div.cg-show{padding:50px 0 0 50px}.cg-launcher-folder>div:not(.cg-show):active{filter:brightness(0.6)}.cg-launcher-folder>div:not(.cg-show) .cg-launcher-item{width:22px;margin-bottom:6px}.cg-launcher-folder>div:not(.cg-show) .cg-launcher-icon{background-size:16px;height:16px;pointer-events:none}.cg-launcher-folder>div:not(.cg-show) .cg-launcher-name{display:none}.cg-launcher-folder>div:not(.cg-show) .cg-launcher-space{width:6px}.cg-launcher-list{flex:1;height:0;overflow-y:auto;padding:0 0 0 50px}.cg-launcher-list::-webkit-scrollbar{display:none}.cg-launcher-list.cg-folder-open>.cg-launcher-item>.cg-launcher-inner>.cg-launcher-icon,.cg-launcher-list.cg-folder-open>.cg-launcher-item>.cg-launcher-inner>.cg-launcher-name{opacity:0}.cg-launcher-list.cg-folder-open>.cg-launcher-item>.cg-launcher-inner>.cg-launcher-folder>div:not(.cg-show){opacity:0}[data-cg-pop]{position:absolute;box-shadow:0px 15px 30px rgba(0,0,0,.07);transition:.3s var(--g-cubic);transition-property:transform,opacity;transform:translateY(-10px);opacity:0;overflow:hidden}[data-cg-pop]:not([data-cg-open]){pointer-events:none}[data-cg-pop][data-cg-pop-none]{display:none !important}[data-cg-pop][data-cg-open]{transform:translateY(0px);opacity:1}#cg-notify{z-index:20020005}.cg-notify-wrap{background:var(--system-background);position:fixed;padding:15px;border-radius:5px;right:0;top:0;width:280px;font-size:14px;display:flex;transition:.3s var(--g-cubic);transition-property:transform,opacity;overflow:hidden;color:var(--system-color);box-shadow:0px 15px 30px rgba(0,0,0,.07);-webkit-backdrop-filter:blur(30px) saturate(1.5);backdrop-filter:blur(30px) saturate(1.5);pointer-events:none}.cg-notify-wrap.cg-notify-only{align-items:center}.cg-notify-wrap.cg-notify-full .cg-notify-title{padding-bottom:10px}.cg-notify-icon{margin-right:10px;width:16px;height:16px;border-radius:50%}.cg-notify-icon.cg-primary{background:var(--success)}.cg-notify-icon.cg-info{background:var(--info)}.cg-notify-icon.cg-warning{background:var(--warning)}.cg-notify-icon.cg-danger{background:var(--danger)}.cg-notify-icon.cg-progress{background:var(--cg)}.cg-notify-title{font-size:var(--g-size-m);font-weight:bold}.cg-notify-content{line-height:1.5;word-break:break-word}.cg-notify-progress{position:absolute;bottom:0;left:0;border-radius:1px;background:var(--cg);transition:width 1s ease-out;width:0%;height:2px}#cg-simpletask{left:0;bottom:-46px;width:100%;height:46px;top:initial;background:var(--system-background);-webkit-backdrop-filter:blur(30px) saturate(1.5);backdrop-filter:blur(30px) saturate(1.5);padding:5px 0 5px 5px;display:flex;color:var(--system-color);transition:bottom .3s var(--g-cubic);overflow-x:auto;position:fixed}#cg-simpletask::-webkit-scrollbar{display:none}.cg-simpletask-item{background:rgba(0,0,0,.05);border-radius:3px;padding:10px;display:flex;align-items:center;margin-right:5px}.cg-simpletask-item:hover{background:rgba(0,0,0,.1)}.cg-simpletask-item:active{background:rgba(0,0,0,.2)}.cg-simpletask-icon{margin-right:5px;background-size:cover;width:16px;height:16px}#cg-confirm{z-index:20020006;position:fixed;left:0;top:0;width:100%;height:100%;background:var(--system-background);-webkit-backdrop-filter:blur(150px) saturate(1.5);backdrop-filter:blur(150px) saturate(1.5);justify-content:center;align-items:center}#cg-confirm .cg-confirm-box{background:var(--system-background);width:60%;box-shadow:0px 15px 30px rgba(0,0,0,.07);font-size:14px;border-radius:3px;overflow:hidden;color:var(--system-color)}#cg-confirm .cg-confirm-box #cg-confirm-content{padding:25px;line-height:1.5}#cg-confirm .cg-confirm-box .cg-confirm-controls{border-top:solid .5px var(--system-border-color);display:flex}#cg-confirm .cg-confirm-box .cg-confirm-controls>div{padding:20px;flex:1;text-align:center}#cg-confirm .cg-confirm-box .cg-confirm-controls>div:last-child{border-left:solid .5px var(--system-border-color)}#cg-confirm .cg-confirm-box .cg-confirm-controls>div:hover{background:var(--system-background-hover)}#cg-confirm .cg-confirm-box .cg-confirm-controls>div:active{background:var(--system-background-active)}
|
|
1
|
+
#cg-wrap{position:fixed;left:0;top:0;--g-padding-s:4px;--g-padding:7px;--g-padding-h:4px var(--g-padding);--g-padding-l:14px;--g-padding-l-h:8px var(--g-padding-l);--g-padding-xl:22px;--g-padding-xl-h:12px var(--g-padding-xl);--g-bpadding:18px;--g-margin:2px;--g-radius:0;--g-radius-l:4px;--g-radius-xl:8px;--g-size:12px;--g-size-m:16px;--g-size-l:20px;--g-size-xl:28px;--g-control:14px;--g-family:"Lucida Sans Unicode","Helvetica Neue","Helvetica","PingFang SC","Hiragino Sans GB","Noto Sans CJK SC","Noto Sans CJK","Source Han Sans","WenQuanYi Micro Hei","Microsoft YaHei","sans-serif";--g-line:1.2;--g-cubic:cubic-bezier(0.39, 0.575, 0.565, 1);--g-transition:none;--g-boxsize:calc(var(--g-padding) * 2 + var(--g-size));--cg:hsl(20, 100%, 65%);--success:hsl(150, 100%, 40%);--success-hover:hsl(150, 100%, 45%);--success-active:hsl(150, 100%, 30%);--success-focus:hsl(150, 100%, 35%);--success-disabled:hsl(150, 0%, 40%);--success-bg:hsl(150, 100%, 98%);--info:hsl(210, 100%, 50%);--info-hover:hsl(210, 100%, 60%);--info-active:hsl(210, 100%, 40%);--info-focus:hsl(210, 100%, 45%);--info-disabled:hsl(210, 0%, 50%);--info-bg:hsl(210, 100%, 98%);--warning:hsl(20, 100%, 70%);--warning-hover:hsl(20, 100%, 80%);--warning-active:hsl(20, 100%, 60%);--warning-focus:hsl(20, 100%, 65%);--warning-disabled:hsl(20, 0%, 70%);--warning-bg:hsl(20, 100%, 98%);--danger:hsl(350, 100%, 50%);--danger-hover:hsl(350, 100%, 70%);--danger-active:hsl(350, 100%, 40%);--danger-focus:hsl(350, 100%, 45%);--danger-disabled:hsl(350, 0%, 50%);--danger-bg:hsl(350, 100%, 98%);--system-color:hsl(0, 0%, 95%);--system-background:hsla(0, 0%, 0%, .35);--system-control-background:hsla(0, 0%, 100%, .03);--system-background-hover:hsla(0, 0%, 100%, .06);--system-background-active:hsla(0, 0%, 100%, .1);--system-border-color:hsla(0, 0%, 100%, .03);--system-border-color-hover:hsla(0, 0%, 100%, .06);--system-placeholder-color: hsla(0, 0%, 100%, .2);--face:hsl(0, 0%, 95%);--face-child:hsl(0, 0%, 90%);--face-hover:hsl(0, 0%, 88%);--face-selected:hsl(0, 0%, 85%);--g-pop-background:#FFF;--g-pop-backdrop:none;--g-pop-border:solid .5px var(--g-border-color);--g-shadow:none;--g-outline-shadow:none;--g-color:hsl(0, 0%, 35%);--g-color-hover:hsl(0, 0%, 45%);--g-color-active:hsl(0, 0%, 25%);--g-color-focus:hsl(0, 0%, 30%);--g-color-disabled:hsl(0, 0%, 60%);--g-background:hsl(0, 0%, 95%);--g-background-hover:hsl(0, 0%, 100%);--g-background-active:hsl(0, 0%, 85%);--g-background-opacity:hsl(0, 0%, 50%, .2);--g-background-focus:hsl(0, 0%, 97.5%);--g-background-disabled:hsl(0, 0%, 75%);--g-border-color:hsl(0, 0%, 40%);--g-border-color-hover:hsl(0, 0%, 50%);--g-border-color-active:hsl(0, 0%, 30%);--g-border-color-focus:hsl(0, 0%, 35%);--g-border-color-disabled:hsl(0, 0%, 60%);--g-focusbox-border-color:var(--g-plain-border-color);--g-plain-color:var(--g-color);--g-plain-color-hover:var(--g-color-hover);--g-plain-color-active:var(--g-color-active);--g-plain-color-focus:var(--g-color-focus);--g-plain-color-disabled:var(--g-color-disabled);--g-plain-background:hsl(0, 0%, 100%);--g-plain-background-hover:hsl(0, 0%, 98%);--g-plain-background-active:hsl(0, 0%, 95%);--g-plain-background-focus:var(--g-plain-background);--g-plain-background-disabled:hsl(0, 0%, 95%);--g-plain-background-selected:hsl(0, 0%, 95%);--g-plain-border-color:hsl(0, 0%, 70%);--g-plain-border-color-hover:hsl(0, 0%, 80%);--g-plain-border-color-active:hsl(0, 0%, 60%);--g-plain-border-color-focus:hsl(0, 0%, 65%);--g-plain-border-color-disabled:hsl(0, 0%, 60%);--g-plain-border-color-plain:hsl(0, 0%, 85%);--g-block-background:hsl(0, 0%, 85%);--g-block-background-hover:hsl(0, 0%, 75%);--g-block-dark-background:hsl(0, 0%, 15%);--g-block-dark-background-hover:hsl(0, 0%, 25%)}[data-cg-disabled]{cursor:not-allowed}#cg-form-list{z-index:20020000}#cg-pop-list{z-index:20020001}#cg-simpletask{z-index:20020002}#cg-rectangle{z-index:20020003;box-sizing:border-box;position:absolute;border-radius:3px;box-shadow:0 0 10px rgba(0,0,0,.25);background:rgba(255,255,255,.05);pointer-events:none;opacity:0}#cg-circular{z-index:20020003;box-sizing:border-box;position:absolute;border:solid 3px var(--cg);border-radius:50%;filter:drop-shadow(0 0 3px var(--cg));pointer-events:none;opacity:0}#cg-gesture{z-index:20020003;box-sizing:border-box;position:absolute;border-radius:50%;pointer-events:none;opacity:0;background:var(--system-background);box-shadow:0px 15px 30px rgba(0,0,0,.07);transform:scale(0);width:20px;height:20px}#cg-gesture.done{background:rgba(255,255,255,.3);border:solid 3px rgba(0,0,0,.3)}#cg-gesture.ani{transition:all .3s var(--g-cubic);transition-property:left,top,transform}#cg-drag{z-index:20020003;box-sizing:border-box;position:absolute;border-radius:3px;pointer-events:none;background:rgba(255,255,255,.1);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);box-shadow:0 3px 5px rgba(0,0,0,.1);opacity:0;display:flex;justify-content:center;align-items:center;border:solid 1px #fff;transition:all .3s var(--g-cubic);transition-property:transform,border;transform:initial}#cg-launcher{z-index:20020004;box-sizing:border-box;position:fixed;background:var(--system-background);-webkit-backdrop-filter:blur(30px) saturate(1.5);backdrop-filter:blur(30px) saturate(1.5);width:100%;height:100%;left:0;top:0;color:var(--system-color);display:none;flex-direction:column;transition:all .3s var(--g-cubic);transform:scale(1.2);opacity:0}#cg-launcher:not(.cg-show){pointer-events:none}#cg-launcher.cg-show{transform:scale(1);opacity:1}.cg-launcher-search{text-align:center;padding:50px}.cg-launcher-sinput{-webkit-appearance:none;appearance:none;padding:15px;border:solid 1px rgba(0,0,0,0);background:var(--system-control-background);width:60%;border-radius:5px;color:var(--system-color);transition:all .3s var(--g-cubic)}.cg-launcher-sinput::placeholder{color:var(--system-placeholder-color)}.cg-launcher-sinput::selection{background-color:var(--system-background-hover)}.cg-launcher-sinput:focus{outline:none;border-color:var(--system-border-color-hover)}.cg-launcher-foldername{-webkit-appearance:none;appearance:none;height:50px;font-size:28px !important;border:none;background:rgba(0,0,0,0);width:50%;color:var(--system-color);text-align:center}.cg-launcher-foldername::selection{background-color:var(--system-background-hover)}.cg-launcher-foldername:focus{outline:none}.cg-launcher-item{width:190px;display:inline-flex;vertical-align:middle;margin-bottom:50px}.cg-launcher-inner{flex:1;width:0}.cg-launcher-icon{background-position:center;background-size:80px;height:80px;background-repeat:no-repeat}.cg-launcher-icon:active{filter:brightness(0.6)}.cg-launcher-name{font-size:var(--g-size);font-weight:bold;text-shadow:0 0 3px rgba(0,0,0,.6);text-align:center;margin-top:20px}.cg-launcher-icon,.cg-launcher-name{transition:all .3s var(--g-cubic);transition-property:opacity}.cg-launcher-space{width:50px}.cg-launcher-folder{display:flex;justify-content:center;height:80px}.cg-launcher-folder>div{height:80px;width:80px;background:rgba(255,255,255,.3);border-radius:20px;padding:10px 4px 4px 10px;transition:all .3s var(--g-cubic);transition-property:left,top,width,height,opacity;overflow-y:auto}.cg-launcher-folder>div::-webkit-scrollbar{display:none}.cg-launcher-folder>div .cg-launcher-item,.cg-launcher-folder>div .cg-launcher-space{transition:all .3s var(--g-cubic)}.cg-launcher-folder>div.cg-show{padding:50px 0 0 50px}.cg-launcher-folder>div:not(.cg-show):active{filter:brightness(0.6)}.cg-launcher-folder>div:not(.cg-show) .cg-launcher-item{width:22px;margin-bottom:6px}.cg-launcher-folder>div:not(.cg-show) .cg-launcher-icon{background-size:16px;height:16px;pointer-events:none}.cg-launcher-folder>div:not(.cg-show) .cg-launcher-name{display:none}.cg-launcher-folder>div:not(.cg-show) .cg-launcher-space{width:6px}.cg-launcher-list{flex:1;height:0;overflow-y:auto;padding:0 0 0 50px}.cg-launcher-list::-webkit-scrollbar{display:none}.cg-launcher-list.cg-folder-open>.cg-launcher-item>.cg-launcher-inner>.cg-launcher-icon,.cg-launcher-list.cg-folder-open>.cg-launcher-item>.cg-launcher-inner>.cg-launcher-name{opacity:0}.cg-launcher-list.cg-folder-open>.cg-launcher-item>.cg-launcher-inner>.cg-launcher-folder>div:not(.cg-show){opacity:0}[data-cg-pop]{position:absolute;box-shadow:0px 15px 30px rgba(0,0,0,.07);transition:.3s var(--g-cubic);transition-property:transform,opacity;transform:translateY(-10px);opacity:0;overflow:hidden}[data-cg-pop]:not([data-cg-open]){pointer-events:none}[data-cg-pop][data-cg-pop-none]{display:none !important}[data-cg-pop][data-cg-open]{transform:translateY(0px);opacity:1}#cg-notify{z-index:20020005}.cg-notify-wrap{background:var(--system-background);position:fixed;padding:15px;border-radius:5px;right:0;bottom:0;width:280px;font-size:14px;display:flex;transition:.3s var(--g-cubic);transition-property:transform,opacity;overflow:hidden;color:var(--system-color);box-shadow:0px 15px 30px rgba(0,0,0,.07);-webkit-backdrop-filter:blur(30px) saturate(1.5);backdrop-filter:blur(30px) saturate(1.5)}.cg-notify-wrap.cg-notify-only{align-items:center}.cg-notify-wrap.cg-notify-full .cg-notify-title{padding-bottom:10px}.cg-notify-icon{margin-right:10px;width:14px;height:14px;border-radius:50%}.cg-notify-icon.cg-primary{background:var(--success)}.cg-notify-icon.cg-info{background:var(--info)}.cg-notify-icon.cg-warning{background:var(--warning)}.cg-notify-icon.cg-danger{background:var(--danger)}.cg-notify-icon.cg-progress{background:var(--cg)}.cg-notify-title{font-size:16px;font-weight:bold}.cg-notify-content{line-height:1.5;word-break:break-word}.cg-notify-progress{position:absolute;bottom:0;left:0;border-radius:1px;background:var(--cg);transition:width 1s ease-out;width:0%;height:2px}#cg-alert{z-index:20020006}.cg-alert-wrap{position:fixed;left:0;bottom:100px;width:100%;font-size:14px;display:flex;align-items:center;justify-content:center;transition:.3s var(--g-cubic);transition-property:transform,opacity;color:var(--system-color);pointer-events:none}.cg-alert-wrap.cg-default .cg-alert-icon{display:none}.cg-alert-wrap.cg-primary{color:var(--success)}.cg-alert-wrap.cg-primary .cg-alert-content{border-color:var(--success);background:var(--success-bg)}.cg-alert-wrap.cg-primary .cg-alert-icon{background:var(--success)}.cg-alert-wrap.cg-info{color:var(--info)}.cg-alert-wrap.cg-info .cg-alert-content{border-color:var(--info);background:var(--info-bg)}.cg-alert-wrap.cg-info .cg-alert-icon{background:var(--info)}.cg-alert-wrap.cg-warning{color:var(--warning)}.cg-alert-wrap.cg-warning .cg-alert-content{border-color:var(--warning);background:var(--warning-bg)}.cg-alert-wrap.cg-warning .cg-alert-icon{background:var(--warning)}.cg-alert-wrap.cg-danger{color:var(--danger)}.cg-alert-wrap.cg-danger .cg-alert-content{border-color:var(--danger);background:var(--danger-bg)}.cg-alert-wrap.cg-danger .cg-alert-icon{background:var(--danger)}.cg-alert-content{padding:15px;background:var(--system-background);display:flex;align-items:center;box-shadow:0px 15px 30px rgba(0,0,0,.07);-webkit-backdrop-filter:blur(30px) saturate(1.5);backdrop-filter:blur(30px) saturate(1.5);border:solid .5px rgba(0,0,0,0);border-radius:5px}.cg-alert-icon{margin-right:10px;width:14px;height:14px;border-radius:50%}#cg-simpletask{left:0;bottom:-46px;width:100%;height:46px;top:initial;background:var(--system-background);-webkit-backdrop-filter:blur(30px) saturate(1.5);backdrop-filter:blur(30px) saturate(1.5);padding:5px 0 5px 5px;display:flex;color:var(--system-color);transition:bottom .3s var(--g-cubic);overflow-x:auto;position:fixed}#cg-simpletask::-webkit-scrollbar{display:none}.cg-simpletask-item{background:rgba(0,0,0,.05);border-radius:3px;padding:10px;display:flex;align-items:center;margin-right:5px}.cg-simpletask-item:hover{background:rgba(0,0,0,.1)}.cg-simpletask-item:active{background:rgba(0,0,0,.2)}.cg-simpletask-icon{margin-right:5px;background-size:cover;width:16px;height:16px}#cg-confirm{z-index:20020007;position:fixed;left:0;top:0;width:100%;height:100%;background:var(--system-background);-webkit-backdrop-filter:blur(150px) saturate(1.5);backdrop-filter:blur(150px) saturate(1.5);justify-content:center;align-items:center}#cg-confirm .cg-confirm-box{background:var(--system-background);width:60%;box-shadow:0px 15px 30px rgba(0,0,0,.07);font-size:14px;border-radius:3px;overflow:hidden;color:var(--system-color)}#cg-confirm .cg-confirm-box #cg-confirm-content{padding:25px;line-height:1.5}#cg-confirm .cg-confirm-box .cg-confirm-controls{border-top:solid .5px var(--system-border-color);display:flex}#cg-confirm .cg-confirm-box .cg-confirm-controls>div{padding:20px;flex:1;text-align:center}#cg-confirm .cg-confirm-box .cg-confirm-controls>div:last-child{border-left:solid .5px var(--system-border-color)}#cg-confirm .cg-confirm-box .cg-confirm-controls>div:hover{background:var(--system-background-hover)}#cg-confirm .cg-confirm-box .cg-confirm-controls>div:active{background:var(--system-background-active)}
|
package/dist/lib/dom.js
CHANGED
|
@@ -86,7 +86,7 @@ const clickgo = __importStar(require("../clickgo"));
|
|
|
86
86
|
const form = __importStar(require("./form"));
|
|
87
87
|
const core = __importStar(require("./core"));
|
|
88
88
|
const tool = __importStar(require("./tool"));
|
|
89
|
-
const topClass = ['#cg-form-list', '#cg-pop-list', '#cg-notify', '#cg-simpletask', '#cg-launcher', '#cg-confirm'];
|
|
89
|
+
const topClass = ['#cg-form-list', '#cg-pop-list', '#cg-notify', '#cg-alert', '#cg-simpletask', '#cg-launcher', '#cg-confirm'];
|
|
90
90
|
function classUnfold(after, out = []) {
|
|
91
91
|
const arr = [];
|
|
92
92
|
for (const name of topClass) {
|
|
@@ -103,11 +103,11 @@ document.getElementsByTagName('body')[0].appendChild(styleList);
|
|
|
103
103
|
styleList.insertAdjacentHTML('beforeend', '<style id=\'cg-global-cursor\'></style>');
|
|
104
104
|
styleList.insertAdjacentHTML('beforeend', `<style id='cg-global'>
|
|
105
105
|
${classUnfold()} {-webkit-user-select: none; user-select: none; cursor: default; box-sizing: border-box;}
|
|
106
|
-
${topClass.slice(0,
|
|
106
|
+
${topClass.slice(0, 4).join(', ')} {left: 0; top: 0; width: 0; height: 0; position: absolute;}
|
|
107
107
|
${classUnfold('img')} {vertical-align: bottom;}
|
|
108
108
|
${classUnfold('::selection', ['#cg-launcher'])} {background-color: rgba(0, 0, 0, .1);}
|
|
109
109
|
${classUnfold('*')}, ${classUnfold('*::after')}, ${classUnfold('*::before')} {box-sizing: border-box; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); flex-shrink: 0;}
|
|
110
|
-
${classUnfold(' > div')} {font-family: var(--g-family); font-size: var(--g-size); line-height:
|
|
110
|
+
${classUnfold(' > div')} {font-family: var(--g-family); font-size: var(--g-size); line-height: 1; -webkit-font-smoothing: antialiased;}
|
|
111
111
|
</style>`);
|
|
112
112
|
function inPage(el) {
|
|
113
113
|
return document.body.contains(el);
|
package/dist/lib/dom.ts
CHANGED
|
@@ -20,7 +20,7 @@ import * as core from './core';
|
|
|
20
20
|
import * as tool from './tool';
|
|
21
21
|
|
|
22
22
|
/** --- style list 的 div --- */
|
|
23
|
-
const topClass: string[] = ['#cg-form-list', '#cg-pop-list', '#cg-notify', '#cg-simpletask', '#cg-launcher', '#cg-confirm'];
|
|
23
|
+
const topClass: string[] = ['#cg-form-list', '#cg-pop-list', '#cg-notify', '#cg-alert', '#cg-simpletask', '#cg-launcher', '#cg-confirm'];
|
|
24
24
|
function classUnfold(after?: string, out: string[] = []): string {
|
|
25
25
|
const arr: string[] = [];
|
|
26
26
|
for (const name of topClass) {
|
|
@@ -38,11 +38,11 @@ document.getElementsByTagName('body')[0].appendChild(styleList);
|
|
|
38
38
|
styleList.insertAdjacentHTML('beforeend', '<style id=\'cg-global-cursor\'></style>');
|
|
39
39
|
styleList.insertAdjacentHTML('beforeend', `<style id='cg-global'>
|
|
40
40
|
${classUnfold()} {-webkit-user-select: none; user-select: none; cursor: default; box-sizing: border-box;}
|
|
41
|
-
${topClass.slice(0,
|
|
41
|
+
${topClass.slice(0, 4).join(', ')} {left: 0; top: 0; width: 0; height: 0; position: absolute;}
|
|
42
42
|
${classUnfold('img')} {vertical-align: bottom;}
|
|
43
43
|
${classUnfold('::selection', ['#cg-launcher'])} {background-color: rgba(0, 0, 0, .1);}
|
|
44
44
|
${classUnfold('*')}, ${classUnfold('*::after')}, ${classUnfold('*::before')} {box-sizing: border-box; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); flex-shrink: 0;}
|
|
45
|
-
${classUnfold(' > div')} {font-family: var(--g-family); font-size: var(--g-size); line-height:
|
|
45
|
+
${classUnfold(' > div')} {font-family: var(--g-family); font-size: var(--g-size); line-height: 1; -webkit-font-smoothing: antialiased;}
|
|
46
46
|
</style>`);
|
|
47
47
|
|
|
48
48
|
/**
|
package/dist/lib/form.js
CHANGED
|
@@ -61,6 +61,7 @@ exports.hideRectangle = hideRectangle;
|
|
|
61
61
|
exports.showDrag = showDrag;
|
|
62
62
|
exports.moveDrag = moveDrag;
|
|
63
63
|
exports.hideDrag = hideDrag;
|
|
64
|
+
exports.alert = alert;
|
|
64
65
|
exports.notify = notify;
|
|
65
66
|
exports.notifyProgress = notifyProgress;
|
|
66
67
|
exports.hideNotify = hideNotify;
|
|
@@ -640,6 +641,7 @@ exports.elements = {
|
|
|
640
641
|
'gesture': document.createElement('div'),
|
|
641
642
|
'drag': document.createElement('div'),
|
|
642
643
|
'notify': document.createElement('div'),
|
|
644
|
+
'alert': document.createElement('div'),
|
|
643
645
|
'simpletask': document.createElement('div'),
|
|
644
646
|
'launcher': document.createElement('div'),
|
|
645
647
|
'confirm': document.createElement('div'),
|
|
@@ -691,6 +693,8 @@ exports.elements = {
|
|
|
691
693
|
this.wrap.appendChild(this.drag);
|
|
692
694
|
this.notify.id = 'cg-notify';
|
|
693
695
|
this.wrap.appendChild(this.notify);
|
|
696
|
+
this.alert.id = 'cg-alert';
|
|
697
|
+
this.wrap.appendChild(this.alert);
|
|
694
698
|
this.simpletask.id = 'cg-simpletask';
|
|
695
699
|
this.wrap.appendChild(this.simpletask);
|
|
696
700
|
const simpletaskApp = clickgo.vue.createApp({
|
|
@@ -1495,7 +1499,53 @@ function hideDrag() {
|
|
|
1495
1499
|
exports.elements.drag.style.opacity = '0';
|
|
1496
1500
|
}, 300);
|
|
1497
1501
|
}
|
|
1498
|
-
let
|
|
1502
|
+
let alertBottom = 0;
|
|
1503
|
+
let alertId = 0;
|
|
1504
|
+
function alert(content, type) {
|
|
1505
|
+
const nid = ++alertId;
|
|
1506
|
+
const timeout = 3000;
|
|
1507
|
+
const el = document.createElement('div');
|
|
1508
|
+
const y = alertBottom;
|
|
1509
|
+
el.classList.add('cg-alert-wrap');
|
|
1510
|
+
el.classList.add('cg-' + (type !== null && type !== void 0 ? type : 'default'));
|
|
1511
|
+
el.setAttribute('data-alertid', nid.toString());
|
|
1512
|
+
el.style.transform = `translateY(${y + 10}px)`;
|
|
1513
|
+
el.style.opacity = '0';
|
|
1514
|
+
el.innerHTML = `<div class="cg-alert-content">` +
|
|
1515
|
+
`<div class="cg-alert-icon"></div>` +
|
|
1516
|
+
`<div>${tool.escapeHTML(content)}</div>` +
|
|
1517
|
+
'</div>';
|
|
1518
|
+
exports.elements.alert.appendChild(el);
|
|
1519
|
+
alertBottom -= el.offsetHeight + 10;
|
|
1520
|
+
requestAnimationFrame(function () {
|
|
1521
|
+
el.style.transform = `translateY(${y}px)`;
|
|
1522
|
+
el.style.opacity = '1';
|
|
1523
|
+
const timer = window.setTimeout(function () {
|
|
1524
|
+
clearTimeout(timer);
|
|
1525
|
+
const alertHeight = el.offsetHeight;
|
|
1526
|
+
el.style.opacity = '0';
|
|
1527
|
+
setTimeout(function () {
|
|
1528
|
+
alertBottom += alertHeight + 10;
|
|
1529
|
+
const alertElementList = document.getElementsByClassName('cg-alert-wrap');
|
|
1530
|
+
let needSub = false;
|
|
1531
|
+
for (const alertElement of alertElementList) {
|
|
1532
|
+
if (alertElement === el) {
|
|
1533
|
+
needSub = true;
|
|
1534
|
+
continue;
|
|
1535
|
+
}
|
|
1536
|
+
if (needSub) {
|
|
1537
|
+
alertElement.style.transform = alertElement.style.transform.replace(/translateY\(([-0-9]+)px\)/, function (t, t1) {
|
|
1538
|
+
return `translateY(${parseInt(t1) + alertHeight + 10}px)`;
|
|
1539
|
+
});
|
|
1540
|
+
}
|
|
1541
|
+
}
|
|
1542
|
+
el.remove();
|
|
1543
|
+
}, 100);
|
|
1544
|
+
}, timeout);
|
|
1545
|
+
});
|
|
1546
|
+
return nid;
|
|
1547
|
+
}
|
|
1548
|
+
let notifyBottom = -10;
|
|
1499
1549
|
let notifyId = 0;
|
|
1500
1550
|
function notify(opt) {
|
|
1501
1551
|
var _a;
|
|
@@ -1513,11 +1563,20 @@ function notify(opt) {
|
|
|
1513
1563
|
opt.type = 'progress';
|
|
1514
1564
|
}
|
|
1515
1565
|
const el = document.createElement('div');
|
|
1516
|
-
|
|
1566
|
+
let y = notifyBottom;
|
|
1567
|
+
let x = -10;
|
|
1568
|
+
if (task.systemTaskInfo.taskId > 0) {
|
|
1569
|
+
if (core.config['task.position'] === 'bottom') {
|
|
1570
|
+
y -= task.systemTaskInfo.length;
|
|
1571
|
+
}
|
|
1572
|
+
else if (core.config['task.position'] === 'right') {
|
|
1573
|
+
x -= task.systemTaskInfo.length;
|
|
1574
|
+
}
|
|
1575
|
+
}
|
|
1517
1576
|
el.classList.add('cg-notify-wrap');
|
|
1518
1577
|
el.setAttribute('data-notifyid', nid.toString());
|
|
1519
1578
|
el.style.transform = `translateY(${y}px) translateX(280px)`;
|
|
1520
|
-
el.style.opacity = '
|
|
1579
|
+
el.style.opacity = '0';
|
|
1521
1580
|
el.classList.add((opt.title && opt.content) ? 'cg-notify-full' : 'cg-notify-only');
|
|
1522
1581
|
el.innerHTML = `<div class="cg-notify-icon cg-${tool.escapeHTML((_a = opt.type) !== null && _a !== void 0 ? _a : 'primary')}"></div>` +
|
|
1523
1582
|
'<div style="flex: 1;">' +
|
|
@@ -1527,12 +1586,13 @@ function notify(opt) {
|
|
|
1527
1586
|
'</div>';
|
|
1528
1587
|
if (opt.icon) {
|
|
1529
1588
|
el.childNodes.item(0).style.background = 'url(' + opt.icon + ')';
|
|
1530
|
-
el.childNodes.item(0).style.backgroundSize = '
|
|
1589
|
+
el.childNodes.item(0).style.backgroundSize = '14px';
|
|
1531
1590
|
}
|
|
1532
1591
|
exports.elements.notify.appendChild(el);
|
|
1533
|
-
|
|
1592
|
+
notifyBottom -= el.offsetHeight + 10;
|
|
1534
1593
|
requestAnimationFrame(function () {
|
|
1535
|
-
el.style.transform = `translateY(${y}px) translateX(
|
|
1594
|
+
el.style.transform = `translateY(${y}px) translateX(${x}px)`;
|
|
1595
|
+
el.style.opacity = '1';
|
|
1536
1596
|
const timer = window.setTimeout(function () {
|
|
1537
1597
|
hideNotify(nid);
|
|
1538
1598
|
}, timeout);
|
|
@@ -1572,7 +1632,7 @@ function hideNotify(notifyId) {
|
|
|
1572
1632
|
const notifyHeight = el.offsetHeight;
|
|
1573
1633
|
el.style.opacity = '0';
|
|
1574
1634
|
setTimeout(function () {
|
|
1575
|
-
|
|
1635
|
+
notifyBottom += notifyHeight + 10;
|
|
1576
1636
|
const notifyElementList = document.getElementsByClassName('cg-notify-wrap');
|
|
1577
1637
|
let needSub = false;
|
|
1578
1638
|
for (const notifyElement of notifyElementList) {
|
|
@@ -1581,8 +1641,8 @@ function hideNotify(notifyId) {
|
|
|
1581
1641
|
continue;
|
|
1582
1642
|
}
|
|
1583
1643
|
if (needSub) {
|
|
1584
|
-
notifyElement.style.transform = notifyElement.style.transform.replace(/translateY\(([0-9]+)px\)/, function (t, t1) {
|
|
1585
|
-
return `translateY(${parseInt(t1)
|
|
1644
|
+
notifyElement.style.transform = notifyElement.style.transform.replace(/translateY\(([-0-9]+)px\)/, function (t, t1) {
|
|
1645
|
+
return `translateY(${parseInt(t1) + notifyHeight + 10}px)`;
|
|
1586
1646
|
});
|
|
1587
1647
|
}
|
|
1588
1648
|
}
|
package/dist/lib/form.ts
CHANGED
|
@@ -889,6 +889,7 @@ export const elements: {
|
|
|
889
889
|
'gesture': HTMLDivElement;
|
|
890
890
|
'drag': HTMLDivElement;
|
|
891
891
|
'notify': HTMLElement;
|
|
892
|
+
'alert': HTMLElement;
|
|
892
893
|
'simpletask': HTMLDivElement;
|
|
893
894
|
'launcher': HTMLDivElement;
|
|
894
895
|
'confirm': HTMLDivElement;
|
|
@@ -902,6 +903,7 @@ export const elements: {
|
|
|
902
903
|
'gesture': document.createElement('div'),
|
|
903
904
|
'drag': document.createElement('div'),
|
|
904
905
|
'notify': document.createElement('div'),
|
|
906
|
+
'alert': document.createElement('div'),
|
|
905
907
|
'simpletask': document.createElement('div'),
|
|
906
908
|
'launcher': document.createElement('div'),
|
|
907
909
|
'confirm': document.createElement('div'),
|
|
@@ -972,6 +974,8 @@ export const elements: {
|
|
|
972
974
|
// --- 添加 cg-system 的 dom ---
|
|
973
975
|
this.notify.id = 'cg-notify';
|
|
974
976
|
this.wrap.appendChild(this.notify);
|
|
977
|
+
this.alert.id = 'cg-alert';
|
|
978
|
+
this.wrap.appendChild(this.alert);
|
|
975
979
|
|
|
976
980
|
// --- 添加 cg-simpletask 的 dom ---
|
|
977
981
|
this.simpletask.id = 'cg-simpletask';
|
|
@@ -1961,7 +1965,71 @@ export function hideDrag(): void {
|
|
|
1961
1965
|
}, 300);
|
|
1962
1966
|
}
|
|
1963
1967
|
|
|
1964
|
-
|
|
1968
|
+
// --- Alert ---
|
|
1969
|
+
|
|
1970
|
+
let alertBottom: number = 0;
|
|
1971
|
+
let alertId: number = 0;
|
|
1972
|
+
|
|
1973
|
+
/**
|
|
1974
|
+
* --- 从下方弹出 alert ---
|
|
1975
|
+
* @param content 内容
|
|
1976
|
+
* @param type 样式,可留空
|
|
1977
|
+
*/
|
|
1978
|
+
export function alert(content: string, type?: 'default' | 'primary' | 'info' | 'warning' | 'danger' | 'progress'): number {
|
|
1979
|
+
// --- 申请 aid ---
|
|
1980
|
+
const nid = ++alertId;
|
|
1981
|
+
// --- 设置 timeout ---
|
|
1982
|
+
const timeout = 3000;
|
|
1983
|
+
// --- 创建 notify element ---
|
|
1984
|
+
const el = document.createElement('div');
|
|
1985
|
+
const y = alertBottom;
|
|
1986
|
+
el.classList.add('cg-alert-wrap');
|
|
1987
|
+
el.classList.add('cg-' + (type ?? 'default'));
|
|
1988
|
+
el.setAttribute('data-alertid', nid.toString());
|
|
1989
|
+
el.style.transform = `translateY(${y + 10}px)`;
|
|
1990
|
+
el.style.opacity = '0';
|
|
1991
|
+
el.innerHTML = `<div class="cg-alert-content">` +
|
|
1992
|
+
`<div class="cg-alert-icon"></div>` +
|
|
1993
|
+
`<div>${tool.escapeHTML(content)}</div>` +
|
|
1994
|
+
'</div>';
|
|
1995
|
+
elements.alert.appendChild(el);
|
|
1996
|
+
alertBottom -= el.offsetHeight + 10;
|
|
1997
|
+
requestAnimationFrame(function() {
|
|
1998
|
+
el.style.transform = `translateY(${y}px)`;
|
|
1999
|
+
el.style.opacity = '1';
|
|
2000
|
+
const timer = window.setTimeout(function() {
|
|
2001
|
+
// --- 隐藏 alert ---
|
|
2002
|
+
clearTimeout(timer);
|
|
2003
|
+
const alertHeight = el.offsetHeight;
|
|
2004
|
+
el.style.opacity = '0';
|
|
2005
|
+
setTimeout(function() {
|
|
2006
|
+
alertBottom += alertHeight + 10;
|
|
2007
|
+
const alertElementList = document.getElementsByClassName('cg-alert-wrap') as HTMLCollectionOf<HTMLDivElement>;
|
|
2008
|
+
let needSub = false;
|
|
2009
|
+
for (const alertElement of alertElementList) {
|
|
2010
|
+
if (alertElement === el) {
|
|
2011
|
+
// --- el 之后的 alert 都要往下移动 ---
|
|
2012
|
+
needSub = true;
|
|
2013
|
+
continue;
|
|
2014
|
+
}
|
|
2015
|
+
if (needSub) {
|
|
2016
|
+
alertElement.style.transform = alertElement.style.transform.replace(/translateY\(([-0-9]+)px\)/,
|
|
2017
|
+
function(t: string, t1: string): string {
|
|
2018
|
+
return `translateY(${parseInt(t1) + alertHeight + 10}px)`;
|
|
2019
|
+
}
|
|
2020
|
+
);
|
|
2021
|
+
}
|
|
2022
|
+
}
|
|
2023
|
+
el.remove();
|
|
2024
|
+
}, 100);
|
|
2025
|
+
}, timeout);
|
|
2026
|
+
});
|
|
2027
|
+
return nid;
|
|
2028
|
+
}
|
|
2029
|
+
|
|
2030
|
+
// --- Notify ---
|
|
2031
|
+
|
|
2032
|
+
let notifyBottom: number = -10;
|
|
1965
2033
|
let notifyId: number = 0;
|
|
1966
2034
|
/**
|
|
1967
2035
|
* --- 弹出右上角信息框 ---
|
|
@@ -1986,11 +2054,20 @@ export function notify(opt: types.INotifyOptions): number {
|
|
|
1986
2054
|
}
|
|
1987
2055
|
// --- 创建 notify element ---
|
|
1988
2056
|
const el = document.createElement('div');
|
|
1989
|
-
|
|
2057
|
+
let y = notifyBottom;
|
|
2058
|
+
let x = -10;
|
|
2059
|
+
if (task.systemTaskInfo.taskId > 0) {
|
|
2060
|
+
if (core.config['task.position'] === 'bottom') {
|
|
2061
|
+
y -= task.systemTaskInfo.length;
|
|
2062
|
+
}
|
|
2063
|
+
else if (core.config['task.position'] === 'right') {
|
|
2064
|
+
x -= task.systemTaskInfo.length;
|
|
2065
|
+
}
|
|
2066
|
+
}
|
|
1990
2067
|
el.classList.add('cg-notify-wrap');
|
|
1991
2068
|
el.setAttribute('data-notifyid', nid.toString());
|
|
1992
2069
|
el.style.transform = `translateY(${y}px) translateX(280px)`;
|
|
1993
|
-
el.style.opacity = '
|
|
2070
|
+
el.style.opacity = '0';
|
|
1994
2071
|
el.classList.add((opt.title && opt.content) ? 'cg-notify-full' : 'cg-notify-only');
|
|
1995
2072
|
el.innerHTML = `<div class="cg-notify-icon cg-${tool.escapeHTML(opt.type ?? 'primary')}"></div>` +
|
|
1996
2073
|
'<div style="flex: 1;">' +
|
|
@@ -2000,12 +2077,13 @@ export function notify(opt: types.INotifyOptions): number {
|
|
|
2000
2077
|
'</div>';
|
|
2001
2078
|
if (opt.icon) {
|
|
2002
2079
|
(el.childNodes.item(0) as HTMLElement).style.background = 'url(' + opt.icon + ')';
|
|
2003
|
-
(el.childNodes.item(0) as HTMLElement).style.backgroundSize = '
|
|
2080
|
+
(el.childNodes.item(0) as HTMLElement).style.backgroundSize = '14px';
|
|
2004
2081
|
}
|
|
2005
2082
|
elements.notify.appendChild(el);
|
|
2006
|
-
|
|
2083
|
+
notifyBottom -= el.offsetHeight + 10;
|
|
2007
2084
|
requestAnimationFrame(function() {
|
|
2008
|
-
el.style.transform = `translateY(${y}px) translateX(
|
|
2085
|
+
el.style.transform = `translateY(${y}px) translateX(${x}px)`;
|
|
2086
|
+
el.style.opacity = '1';
|
|
2009
2087
|
const timer = window.setTimeout(function() {
|
|
2010
2088
|
hideNotify(nid);
|
|
2011
2089
|
}, timeout);
|
|
@@ -2056,19 +2134,19 @@ export function hideNotify(notifyId: number): void {
|
|
|
2056
2134
|
const notifyHeight = el.offsetHeight;
|
|
2057
2135
|
el.style.opacity = '0';
|
|
2058
2136
|
setTimeout(function() {
|
|
2059
|
-
|
|
2137
|
+
notifyBottom += notifyHeight + 10;
|
|
2060
2138
|
const notifyElementList = document.getElementsByClassName('cg-notify-wrap') as HTMLCollectionOf<HTMLDivElement>;
|
|
2061
2139
|
let needSub = false;
|
|
2062
2140
|
for (const notifyElement of notifyElementList) {
|
|
2063
2141
|
if (notifyElement === el) {
|
|
2064
|
-
// --- el 之后的 notify
|
|
2142
|
+
// --- el 之后的 notify 都要往下移动 ---
|
|
2065
2143
|
needSub = true;
|
|
2066
2144
|
continue;
|
|
2067
2145
|
}
|
|
2068
2146
|
if (needSub) {
|
|
2069
|
-
notifyElement.style.transform = notifyElement.style.transform.replace(/translateY\(([0-9]+)px\)/,
|
|
2147
|
+
notifyElement.style.transform = notifyElement.style.transform.replace(/translateY\(([-0-9]+)px\)/,
|
|
2070
2148
|
function(t: string, t1: string): string {
|
|
2071
|
-
return `translateY(${parseInt(t1)
|
|
2149
|
+
return `translateY(${parseInt(t1) + notifyHeight + 10}px)`;
|
|
2072
2150
|
}
|
|
2073
2151
|
);
|
|
2074
2152
|
}
|
package/dist/lib/task.js
CHANGED
package/dist/lib/task.ts
CHANGED
|
@@ -765,6 +765,9 @@ export async function run(url: string | types.IApp, opt: types.ITaskRunOptions =
|
|
|
765
765
|
hideDrag: function(): void {
|
|
766
766
|
form.hideDrag();
|
|
767
767
|
},
|
|
768
|
+
alert: function(content: string, type?: 'default' | 'primary' | 'info' | 'warning' | 'danger' | 'progress'): number {
|
|
769
|
+
return form.alert(content, type);
|
|
770
|
+
},
|
|
768
771
|
notify: function(opt: types.INotifyOptions): number {
|
|
769
772
|
return form.notify(opt);
|
|
770
773
|
},
|
package/dist/theme/byterun.cgt
CHANGED
|
Binary file
|
package/dist/theme/familiar.cgt
CHANGED
|
Binary file
|
package/dist/theme/light.cgt
CHANGED
|
Binary file
|
package/package.json
CHANGED
package/types/index.d.ts
CHANGED
|
@@ -647,6 +647,11 @@ export interface IMoveDragOptions {
|
|
|
647
647
|
'icon'?: boolean;
|
|
648
648
|
}
|
|
649
649
|
|
|
650
|
+
export interface IAlertOptions {
|
|
651
|
+
'content'?: string;
|
|
652
|
+
'type'?: 'primary' | 'info' | 'warning' | 'danger' | 'progress';
|
|
653
|
+
}
|
|
654
|
+
|
|
650
655
|
export interface INotifyOptions {
|
|
651
656
|
'title'?: string;
|
|
652
657
|
'content'?: string;
|