@leafer-in/scroll 1.7.0 → 1.9.0
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/dist/scroll.cjs +47 -41
- package/dist/scroll.esm.js +46 -40
- package/dist/scroll.esm.min.js +1 -1
- package/dist/scroll.esm.min.js.map +1 -1
- package/dist/scroll.js +48 -46
- package/dist/scroll.min.cjs +1 -1
- package/dist/scroll.min.cjs.map +1 -1
- package/dist/scroll.min.js +1 -1
- package/dist/scroll.min.js.map +1 -1
- package/package.json +4 -4
- package/src/ScrollBar.ts +2 -2
package/dist/scroll.cjs
CHANGED
|
@@ -1,13 +1,15 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
2
|
|
|
3
|
-
var core = require(
|
|
3
|
+
var core = require("@leafer-ui/core");
|
|
4
4
|
|
|
5
5
|
class ScrollBar extends core.Group {
|
|
6
|
-
get isOutside() {
|
|
6
|
+
get isOutside() {
|
|
7
|
+
return true;
|
|
8
|
+
}
|
|
7
9
|
constructor(target, userConfig) {
|
|
8
10
|
super();
|
|
9
11
|
this.config = {
|
|
10
|
-
theme:
|
|
12
|
+
theme: "light",
|
|
11
13
|
padding: 0,
|
|
12
14
|
minSize: 10
|
|
13
15
|
};
|
|
@@ -16,41 +18,52 @@ class ScrollBar extends core.Group {
|
|
|
16
18
|
target = target.tree;
|
|
17
19
|
}
|
|
18
20
|
this.target = target;
|
|
19
|
-
if (userConfig)
|
|
20
|
-
core.DataHelper.assign(this.config, userConfig);
|
|
21
|
+
if (userConfig) core.DataHelper.assign(this.config, userConfig);
|
|
21
22
|
this.changeTheme(this.config.theme);
|
|
22
23
|
this.waitLeafer(this.__listenEvents, this);
|
|
23
24
|
}
|
|
24
25
|
changeTheme(theme) {
|
|
25
26
|
let style;
|
|
26
|
-
if (
|
|
27
|
-
style = {
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
27
|
+
if (core.isString(theme)) {
|
|
28
|
+
style = {
|
|
29
|
+
fill: "black",
|
|
30
|
+
stroke: "rgba(255,255,255,0.8)"
|
|
31
|
+
};
|
|
32
|
+
if (theme === "dark") {
|
|
33
|
+
style.fill = "white";
|
|
34
|
+
style.stroke = "rgba(0,0,0,0.2)";
|
|
31
35
|
}
|
|
32
|
-
}
|
|
33
|
-
else {
|
|
36
|
+
} else {
|
|
34
37
|
style = theme;
|
|
35
38
|
}
|
|
36
|
-
if (!this.scrollXBar)
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
39
|
+
if (!this.scrollXBar) this.addMany(this.scrollXBar = new core.Box, this.scrollYBar = new core.Box);
|
|
40
|
+
style = Object.assign({
|
|
41
|
+
strokeAlign: "center",
|
|
42
|
+
opacity: .5,
|
|
43
|
+
width: 6,
|
|
44
|
+
cornerRadius: 3,
|
|
45
|
+
hoverStyle: {
|
|
46
|
+
opacity: .6
|
|
47
|
+
},
|
|
48
|
+
pressStyle: {
|
|
49
|
+
opacity: .7
|
|
50
|
+
}
|
|
51
|
+
}, style);
|
|
52
|
+
if (!style.height) style.height = style.width;
|
|
53
|
+
this.scrollXBar.set(Object.assign(Object.assign({}, style), {
|
|
54
|
+
visible: false
|
|
55
|
+
}));
|
|
56
|
+
this.scrollYBar.set(Object.assign(Object.assign({}, style), {
|
|
57
|
+
visible: false
|
|
58
|
+
}));
|
|
59
|
+
if (this.leafer) this.update();
|
|
45
60
|
}
|
|
46
61
|
update(check) {
|
|
47
|
-
if (this.dragScrolling)
|
|
48
|
-
|
|
49
|
-
const {
|
|
50
|
-
const {
|
|
51
|
-
|
|
52
|
-
if (check && this.scrollBounds && this.scrollBounds.isSame(worldRenderBounds))
|
|
53
|
-
return;
|
|
62
|
+
if (this.dragScrolling) return;
|
|
63
|
+
const {minSize: minSize, padding: padding} = this.config;
|
|
64
|
+
const {zoomLayer: zoomLayer, canvas: canvas} = this.target.leafer;
|
|
65
|
+
const {worldRenderBounds: worldRenderBounds} = zoomLayer;
|
|
66
|
+
if (check && this.scrollBounds && this.scrollBounds.isSame(worldRenderBounds)) return;
|
|
54
67
|
this.scrollBounds = new core.Bounds(worldRenderBounds);
|
|
55
68
|
const bounds = canvas.bounds.clone().shrink(padding);
|
|
56
69
|
const totalBounds = bounds.clone().add(worldRenderBounds);
|
|
@@ -60,8 +73,8 @@ class ScrollBar extends core.Group {
|
|
|
60
73
|
const scrollRatioY = (bounds.y - totalBounds.y) / totalBounds.height;
|
|
61
74
|
const showScrollXBar = ratioX < 1;
|
|
62
75
|
const showScrollYBar = ratioY < 1;
|
|
63
|
-
const { scrollXBar, scrollYBar } = this;
|
|
64
|
-
const { x, y, width, height } = bounds.shrink([2, showScrollYBar ? scrollYBar.width + 6 : 2, showScrollXBar ? scrollXBar.height + 6 : 2, 2]);
|
|
76
|
+
const {scrollXBar: scrollXBar, scrollYBar: scrollYBar} = this;
|
|
77
|
+
const {x: x, y: y, width: width, height: height} = bounds.shrink([ 2, showScrollYBar ? scrollYBar.width + 6 : 2, showScrollXBar ? scrollXBar.height + 6 : 2, 2 ]);
|
|
65
78
|
scrollXBar.set({
|
|
66
79
|
x: x + width * scrollRatioX,
|
|
67
80
|
y: y + height + 2,
|
|
@@ -89,15 +102,8 @@ class ScrollBar extends core.Group {
|
|
|
89
102
|
this.app.config.move.dragOut = this.__dragOut;
|
|
90
103
|
}
|
|
91
104
|
__listenEvents() {
|
|
92
|
-
const { scrollXBar, scrollYBar } = this;
|
|
93
|
-
this.__eventIds = [
|
|
94
|
-
scrollXBar.on_(core.DragEvent.DRAG, this.onDrag, this),
|
|
95
|
-
scrollYBar.on_(core.DragEvent.DRAG, this.onDrag, this),
|
|
96
|
-
scrollXBar.on_(core.DragEvent.END, this.onDragEnd, this),
|
|
97
|
-
scrollYBar.on_(core.DragEvent.END, this.onDragEnd, this),
|
|
98
|
-
this.target.on_(core.RenderEvent.BEFORE, () => this.update(true)),
|
|
99
|
-
this.target.leafer.on_(core.ResizeEvent.RESIZE, () => this.update())
|
|
100
|
-
];
|
|
105
|
+
const {scrollXBar: scrollXBar, scrollYBar: scrollYBar} = this;
|
|
106
|
+
this.__eventIds = [ scrollXBar.on_(core.DragEvent.DRAG, this.onDrag, this), scrollYBar.on_(core.DragEvent.DRAG, this.onDrag, this), scrollXBar.on_(core.DragEvent.END, this.onDragEnd, this), scrollYBar.on_(core.DragEvent.END, this.onDragEnd, this), this.target.on_(core.RenderEvent.BEFORE, () => this.update(true)), this.target.leafer.on_(core.ResizeEvent.RESIZE, () => this.update()) ];
|
|
101
107
|
}
|
|
102
108
|
__removeListenEvents() {
|
|
103
109
|
this.off_(this.__eventIds);
|
|
@@ -111,6 +117,6 @@ class ScrollBar extends core.Group {
|
|
|
111
117
|
}
|
|
112
118
|
}
|
|
113
119
|
|
|
114
|
-
core.Plugin.add(
|
|
120
|
+
core.Plugin.add("scroll");
|
|
115
121
|
|
|
116
122
|
exports.ScrollBar = ScrollBar;
|
package/dist/scroll.esm.js
CHANGED
|
@@ -1,11 +1,13 @@
|
|
|
1
|
-
import { Group, DataHelper, Box, Bounds, DragEvent, RenderEvent, ResizeEvent, Plugin } from
|
|
1
|
+
import { Group, DataHelper, isString, Box, Bounds, DragEvent, RenderEvent, ResizeEvent, Plugin } from "@leafer-ui/core";
|
|
2
2
|
|
|
3
3
|
class ScrollBar extends Group {
|
|
4
|
-
get isOutside() {
|
|
4
|
+
get isOutside() {
|
|
5
|
+
return true;
|
|
6
|
+
}
|
|
5
7
|
constructor(target, userConfig) {
|
|
6
8
|
super();
|
|
7
9
|
this.config = {
|
|
8
|
-
theme:
|
|
10
|
+
theme: "light",
|
|
9
11
|
padding: 0,
|
|
10
12
|
minSize: 10
|
|
11
13
|
};
|
|
@@ -14,41 +16,52 @@ class ScrollBar extends Group {
|
|
|
14
16
|
target = target.tree;
|
|
15
17
|
}
|
|
16
18
|
this.target = target;
|
|
17
|
-
if (userConfig)
|
|
18
|
-
DataHelper.assign(this.config, userConfig);
|
|
19
|
+
if (userConfig) DataHelper.assign(this.config, userConfig);
|
|
19
20
|
this.changeTheme(this.config.theme);
|
|
20
21
|
this.waitLeafer(this.__listenEvents, this);
|
|
21
22
|
}
|
|
22
23
|
changeTheme(theme) {
|
|
23
24
|
let style;
|
|
24
|
-
if (
|
|
25
|
-
style = {
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
25
|
+
if (isString(theme)) {
|
|
26
|
+
style = {
|
|
27
|
+
fill: "black",
|
|
28
|
+
stroke: "rgba(255,255,255,0.8)"
|
|
29
|
+
};
|
|
30
|
+
if (theme === "dark") {
|
|
31
|
+
style.fill = "white";
|
|
32
|
+
style.stroke = "rgba(0,0,0,0.2)";
|
|
29
33
|
}
|
|
30
|
-
}
|
|
31
|
-
else {
|
|
34
|
+
} else {
|
|
32
35
|
style = theme;
|
|
33
36
|
}
|
|
34
|
-
if (!this.scrollXBar)
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
37
|
+
if (!this.scrollXBar) this.addMany(this.scrollXBar = new Box, this.scrollYBar = new Box);
|
|
38
|
+
style = Object.assign({
|
|
39
|
+
strokeAlign: "center",
|
|
40
|
+
opacity: .5,
|
|
41
|
+
width: 6,
|
|
42
|
+
cornerRadius: 3,
|
|
43
|
+
hoverStyle: {
|
|
44
|
+
opacity: .6
|
|
45
|
+
},
|
|
46
|
+
pressStyle: {
|
|
47
|
+
opacity: .7
|
|
48
|
+
}
|
|
49
|
+
}, style);
|
|
50
|
+
if (!style.height) style.height = style.width;
|
|
51
|
+
this.scrollXBar.set(Object.assign(Object.assign({}, style), {
|
|
52
|
+
visible: false
|
|
53
|
+
}));
|
|
54
|
+
this.scrollYBar.set(Object.assign(Object.assign({}, style), {
|
|
55
|
+
visible: false
|
|
56
|
+
}));
|
|
57
|
+
if (this.leafer) this.update();
|
|
43
58
|
}
|
|
44
59
|
update(check) {
|
|
45
|
-
if (this.dragScrolling)
|
|
46
|
-
|
|
47
|
-
const {
|
|
48
|
-
const {
|
|
49
|
-
|
|
50
|
-
if (check && this.scrollBounds && this.scrollBounds.isSame(worldRenderBounds))
|
|
51
|
-
return;
|
|
60
|
+
if (this.dragScrolling) return;
|
|
61
|
+
const {minSize: minSize, padding: padding} = this.config;
|
|
62
|
+
const {zoomLayer: zoomLayer, canvas: canvas} = this.target.leafer;
|
|
63
|
+
const {worldRenderBounds: worldRenderBounds} = zoomLayer;
|
|
64
|
+
if (check && this.scrollBounds && this.scrollBounds.isSame(worldRenderBounds)) return;
|
|
52
65
|
this.scrollBounds = new Bounds(worldRenderBounds);
|
|
53
66
|
const bounds = canvas.bounds.clone().shrink(padding);
|
|
54
67
|
const totalBounds = bounds.clone().add(worldRenderBounds);
|
|
@@ -58,8 +71,8 @@ class ScrollBar extends Group {
|
|
|
58
71
|
const scrollRatioY = (bounds.y - totalBounds.y) / totalBounds.height;
|
|
59
72
|
const showScrollXBar = ratioX < 1;
|
|
60
73
|
const showScrollYBar = ratioY < 1;
|
|
61
|
-
const { scrollXBar, scrollYBar } = this;
|
|
62
|
-
const { x, y, width, height } = bounds.shrink([2, showScrollYBar ? scrollYBar.width + 6 : 2, showScrollXBar ? scrollXBar.height + 6 : 2, 2]);
|
|
74
|
+
const {scrollXBar: scrollXBar, scrollYBar: scrollYBar} = this;
|
|
75
|
+
const {x: x, y: y, width: width, height: height} = bounds.shrink([ 2, showScrollYBar ? scrollYBar.width + 6 : 2, showScrollXBar ? scrollXBar.height + 6 : 2, 2 ]);
|
|
63
76
|
scrollXBar.set({
|
|
64
77
|
x: x + width * scrollRatioX,
|
|
65
78
|
y: y + height + 2,
|
|
@@ -87,15 +100,8 @@ class ScrollBar extends Group {
|
|
|
87
100
|
this.app.config.move.dragOut = this.__dragOut;
|
|
88
101
|
}
|
|
89
102
|
__listenEvents() {
|
|
90
|
-
const { scrollXBar, scrollYBar } = this;
|
|
91
|
-
this.__eventIds = [
|
|
92
|
-
scrollXBar.on_(DragEvent.DRAG, this.onDrag, this),
|
|
93
|
-
scrollYBar.on_(DragEvent.DRAG, this.onDrag, this),
|
|
94
|
-
scrollXBar.on_(DragEvent.END, this.onDragEnd, this),
|
|
95
|
-
scrollYBar.on_(DragEvent.END, this.onDragEnd, this),
|
|
96
|
-
this.target.on_(RenderEvent.BEFORE, () => this.update(true)),
|
|
97
|
-
this.target.leafer.on_(ResizeEvent.RESIZE, () => this.update())
|
|
98
|
-
];
|
|
103
|
+
const {scrollXBar: scrollXBar, scrollYBar: scrollYBar} = this;
|
|
104
|
+
this.__eventIds = [ scrollXBar.on_(DragEvent.DRAG, this.onDrag, this), scrollYBar.on_(DragEvent.DRAG, this.onDrag, this), scrollXBar.on_(DragEvent.END, this.onDragEnd, this), scrollYBar.on_(DragEvent.END, this.onDragEnd, this), this.target.on_(RenderEvent.BEFORE, () => this.update(true)), this.target.leafer.on_(ResizeEvent.RESIZE, () => this.update()) ];
|
|
99
105
|
}
|
|
100
106
|
__removeListenEvents() {
|
|
101
107
|
this.off_(this.__eventIds);
|
|
@@ -109,6 +115,6 @@ class ScrollBar extends Group {
|
|
|
109
115
|
}
|
|
110
116
|
}
|
|
111
117
|
|
|
112
|
-
Plugin.add(
|
|
118
|
+
Plugin.add("scroll");
|
|
113
119
|
|
|
114
120
|
export { ScrollBar };
|
package/dist/scroll.esm.min.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{Group as t,DataHelper as i,
|
|
1
|
+
import{Group as t,DataHelper as i,isString as s,Box as e,Bounds as r,DragEvent as h,RenderEvent as o,ResizeEvent as a,Plugin as n}from"@leafer-ui/core";class l extends t{get isOutside(){return!0}constructor(t,s){super(),this.config={theme:"light",padding:0,minSize:10},t.isApp&&(t.sky.add(this),t=t.tree),this.target=t,s&&i.assign(this.config,s),this.changeTheme(this.config.theme),this.waitLeafer(this.__listenEvents,this)}changeTheme(t){let i;s(t)?(i={fill:"black",stroke:"rgba(255,255,255,0.8)"},"dark"===t&&(i.fill="white",i.stroke="rgba(0,0,0,0.2)")):i=t,this.scrollXBar||this.addMany(this.scrollXBar=new e,this.scrollYBar=new e),i=Object.assign({strokeAlign:"center",opacity:.5,width:6,cornerRadius:3,hoverStyle:{opacity:.6},pressStyle:{opacity:.7}},i),i.height||(i.height=i.width),this.scrollXBar.set(Object.assign(Object.assign({},i),{visible:!1})),this.scrollYBar.set(Object.assign(Object.assign({},i),{visible:!1})),this.leafer&&this.update()}update(t){if(this.dragScrolling)return;const{minSize:i,padding:s}=this.config,{zoomLayer:e,canvas:h}=this.target.leafer,{worldRenderBounds:o}=e;if(t&&this.scrollBounds&&this.scrollBounds.isSame(o))return;this.scrollBounds=new r(o);const a=h.bounds.clone().shrink(s),n=a.clone().add(o),l=this.ratioX=a.width/n.width,g=this.ratioY=a.height/n.height,d=(a.x-n.x)/n.width,c=(a.y-n.y)/n.height,u=l<1,_=g<1,{scrollXBar:p,scrollYBar:v}=this,{x:f,y:m,width:y,height:B}=a.shrink([2,_?v.width+6:2,u?p.height+6:2,2]);p.set({x:f+y*d,y:m+B+2,width:Math.max(y*l,i),visible:u}),v.set({x:f+y+2,y:m+B*c,height:Math.max(B*g,i),visible:_})}onDrag(t){this.dragScrolling=!0,this.__dragOut=this.app.config.move.dragOut,this.app.config.move.dragOut=!1;const i=t.current===this.scrollXBar,s=this.target.leafer.getValidMove(i?-t.moveX/this.ratioX:0,i?0:-t.moveY/this.ratioY);this.target.moveWorld(s.x,s.y),t.current.moveWorld(s.x&&-s.x*this.ratioX,s.y&&-s.y*this.ratioY)}onDragEnd(){this.dragScrolling=!1,this.app.config.move.dragOut=this.__dragOut}__listenEvents(){const{scrollXBar:t,scrollYBar:i}=this;this.__eventIds=[t.on_(h.DRAG,this.onDrag,this),i.on_(h.DRAG,this.onDrag,this),t.on_(h.END,this.onDragEnd,this),i.on_(h.END,this.onDragEnd,this),this.target.on_(o.BEFORE,()=>this.update(!0)),this.target.leafer.on_(a.RESIZE,()=>this.update())]}__removeListenEvents(){this.off_(this.__eventIds)}destroy(){this.destroyed||(this.__removeListenEvents(),this.target=this.config=null,super.destroy())}}n.add("scroll");export{l as ScrollBar};
|
|
2
2
|
//# sourceMappingURL=scroll.esm.min.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"scroll.esm.min.js","sources":["../../../../../../src/in/packages/scroll/src/ScrollBar.ts","../../../../../../src/in/packages/scroll/src/index.ts"],"sourcesContent":["import { IApp, IBounds, IBox, IBoxInputData, IEventListenerId, IGroup } from '@leafer-ui/interface'\nimport { Group, RenderEvent, ResizeEvent, Box, Bounds, DataHelper, DragEvent } from '@leafer-ui/core'\n\nimport { IScrollBar, IScrollBarConfig, IScrollBarTheme } from '@leafer-in/interface'\n\n\nexport class ScrollBar extends Group implements IScrollBar {\n\n public target: IGroup\n public config: IScrollBarConfig = {\n theme: 'light',\n padding: 0,\n minSize: 10\n }\n\n public scrollXBar: IBox\n public scrollYBar: IBox\n\n public ratioX: number\n public ratioY: number\n public dragScrolling: boolean\n public scrollBounds: IBounds\n\n public get isOutside() { return true }\n\n protected __dragOut: boolean | number\n protected __eventIds: IEventListenerId[]\n\n constructor(target: IGroup, userConfig?: IScrollBarConfig) {\n super()\n if (target.isApp) {\n (target as IApp).sky.add(this)\n target = (target as IApp).tree\n }\n this.target = target\n if (userConfig) DataHelper.assign(this.config, userConfig)\n this.changeTheme(this.config.theme)\n this.waitLeafer(this.__listenEvents, this)\n }\n\n public changeTheme(theme: IScrollBarTheme): void {\n let style: IBoxInputData\n\n if (
|
|
1
|
+
{"version":3,"file":"scroll.esm.min.js","sources":["../../../../../../src/in/packages/scroll/src/ScrollBar.ts","../../../../../../src/in/packages/scroll/src/index.ts"],"sourcesContent":["import { IApp, IBounds, IBox, IBoxInputData, IEventListenerId, IGroup } from '@leafer-ui/interface'\nimport { Group, RenderEvent, ResizeEvent, Box, Bounds, DataHelper, DragEvent, isString } from '@leafer-ui/core'\n\nimport { IScrollBar, IScrollBarConfig, IScrollBarTheme } from '@leafer-in/interface'\n\n\nexport class ScrollBar extends Group implements IScrollBar {\n\n public target: IGroup\n public config: IScrollBarConfig = {\n theme: 'light',\n padding: 0,\n minSize: 10\n }\n\n public scrollXBar: IBox\n public scrollYBar: IBox\n\n public ratioX: number\n public ratioY: number\n public dragScrolling: boolean\n public scrollBounds: IBounds\n\n public get isOutside() { return true }\n\n protected __dragOut: boolean | number\n protected __eventIds: IEventListenerId[]\n\n constructor(target: IGroup, userConfig?: IScrollBarConfig) {\n super()\n if (target.isApp) {\n (target as IApp).sky.add(this)\n target = (target as IApp).tree\n }\n this.target = target\n if (userConfig) DataHelper.assign(this.config, userConfig)\n this.changeTheme(this.config.theme)\n this.waitLeafer(this.__listenEvents, this)\n }\n\n public changeTheme(theme: IScrollBarTheme): void {\n let style: IBoxInputData\n\n if (isString(theme)) {\n style = { fill: 'black', stroke: 'rgba(255,255,255,0.8)' }\n if (theme === 'dark') {\n style.fill = 'white'\n style.stroke = 'rgba(0,0,0,0.2)'\n }\n } else {\n style = theme\n }\n\n if (!this.scrollXBar) this.addMany(this.scrollXBar = new Box(), this.scrollYBar = new Box())\n\n style = Object.assign({ strokeAlign: 'center', opacity: 0.5, width: 6, cornerRadius: 3, hoverStyle: { opacity: 0.6 }, pressStyle: { opacity: 0.7 } } as IBoxInputData, style)\n if (!style.height) style.height = style.width\n this.scrollXBar.set({ ...style, visible: false })\n this.scrollYBar.set({ ...style, visible: false })\n if (this.leafer) this.update()\n }\n\n\n public update(check?: boolean): void {\n if (this.dragScrolling) return\n\n const { minSize, padding } = this.config\n const { zoomLayer, canvas } = this.target.leafer\n const { worldRenderBounds } = zoomLayer\n\n if (check && this.scrollBounds && this.scrollBounds.isSame(worldRenderBounds)) return\n this.scrollBounds = new Bounds(worldRenderBounds)\n\n const bounds = canvas.bounds.clone().shrink(padding)\n const totalBounds = bounds.clone().add(worldRenderBounds)\n\n const ratioX = this.ratioX = bounds.width / totalBounds.width\n const ratioY = this.ratioY = bounds.height / totalBounds.height\n const scrollRatioX = (bounds.x - totalBounds.x) / totalBounds.width\n const scrollRatioY = (bounds.y - totalBounds.y) / totalBounds.height\n const showScrollXBar = ratioX < 1\n const showScrollYBar = ratioY < 1\n\n const { scrollXBar, scrollYBar } = this\n const { x, y, width, height } = bounds.shrink([2, showScrollYBar ? scrollYBar.width + 6 : 2, showScrollXBar ? scrollXBar.height + 6 : 2, 2])\n\n scrollXBar.set({\n x: x + width * scrollRatioX,\n y: y + height + 2,\n width: Math.max(width * ratioX, minSize),\n visible: showScrollXBar\n })\n\n scrollYBar.set({\n x: x + width + 2,\n y: y + height * scrollRatioY,\n height: Math.max(height * ratioY, minSize),\n visible: showScrollYBar\n })\n }\n\n protected onDrag(e: DragEvent): void {\n this.dragScrolling = true\n this.__dragOut = this.app.config.move.dragOut\n this.app.config.move.dragOut = false\n\n const scrollX = e.current === this.scrollXBar\n const move = this.target.leafer.getValidMove(scrollX ? -e.moveX / this.ratioX : 0, scrollX ? 0 : -e.moveY / this.ratioY)\n this.target.moveWorld(move.x, move.y)\n e.current.moveWorld(move.x && -move.x * this.ratioX, move.y && -move.y * this.ratioY)\n }\n\n protected onDragEnd(): void {\n this.dragScrolling = false\n this.app.config.move.dragOut = this.__dragOut\n }\n\n protected __listenEvents(): void {\n const { scrollXBar, scrollYBar } = this\n this.__eventIds = [\n scrollXBar.on_(DragEvent.DRAG, this.onDrag, this),\n scrollYBar.on_(DragEvent.DRAG, this.onDrag, this),\n scrollXBar.on_(DragEvent.END, this.onDragEnd, this),\n scrollYBar.on_(DragEvent.END, this.onDragEnd, this),\n this.target.on_(RenderEvent.BEFORE, () => this.update(true)),\n this.target.leafer.on_(ResizeEvent.RESIZE, () => this.update())\n ]\n }\n\n protected __removeListenEvents(): void {\n this.off_(this.__eventIds)\n }\n\n public destroy(): void {\n if (!this.destroyed) {\n this.__removeListenEvents()\n this.target = this.config = null\n super.destroy()\n }\n }\n\n}","export { ScrollBar } from './ScrollBar'\n\nimport { Plugin } from '@leafer-ui/core'\n\nPlugin.add('scroll')"],"names":["ScrollBar","Group","isOutside","constructor","target","userConfig","super","this","config","theme","padding","minSize","isApp","sky","add","tree","DataHelper","assign","changeTheme","waitLeafer","__listenEvents","style","isString","fill","stroke","scrollXBar","addMany","Box","scrollYBar","Object","strokeAlign","opacity","width","cornerRadius","hoverStyle","pressStyle","height","set","visible","leafer","update","check","dragScrolling","zoomLayer","canvas","worldRenderBounds","scrollBounds","isSame","Bounds","bounds","clone","shrink","totalBounds","ratioX","ratioY","scrollRatioX","x","scrollRatioY","y","showScrollXBar","showScrollYBar","Math","max","onDrag","e","__dragOut","app","move","dragOut","scrollX","current","getValidMove","moveX","moveY","moveWorld","onDragEnd","__eventIds","on_","DragEvent","DRAG","END","RenderEvent","BEFORE","ResizeEvent","RESIZE","__removeListenEvents","off_","destroy","destroyed","Plugin"],"mappings":"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"}
|
package/dist/scroll.js
CHANGED
|
@@ -1,13 +1,15 @@
|
|
|
1
1
|
this.LeaferIN = this.LeaferIN || {};
|
|
2
|
-
this.LeaferIN.scroll = (function (exports, core) {
|
|
3
|
-
'use strict';
|
|
4
2
|
|
|
3
|
+
this.LeaferIN.scroll = function(exports, core) {
|
|
4
|
+
"use strict";
|
|
5
5
|
class ScrollBar extends core.Group {
|
|
6
|
-
get isOutside() {
|
|
6
|
+
get isOutside() {
|
|
7
|
+
return true;
|
|
8
|
+
}
|
|
7
9
|
constructor(target, userConfig) {
|
|
8
10
|
super();
|
|
9
11
|
this.config = {
|
|
10
|
-
theme:
|
|
12
|
+
theme: "light",
|
|
11
13
|
padding: 0,
|
|
12
14
|
minSize: 10
|
|
13
15
|
};
|
|
@@ -16,41 +18,52 @@ this.LeaferIN.scroll = (function (exports, core) {
|
|
|
16
18
|
target = target.tree;
|
|
17
19
|
}
|
|
18
20
|
this.target = target;
|
|
19
|
-
if (userConfig)
|
|
20
|
-
core.DataHelper.assign(this.config, userConfig);
|
|
21
|
+
if (userConfig) core.DataHelper.assign(this.config, userConfig);
|
|
21
22
|
this.changeTheme(this.config.theme);
|
|
22
23
|
this.waitLeafer(this.__listenEvents, this);
|
|
23
24
|
}
|
|
24
25
|
changeTheme(theme) {
|
|
25
26
|
let style;
|
|
26
|
-
if (
|
|
27
|
-
style = {
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
27
|
+
if (core.isString(theme)) {
|
|
28
|
+
style = {
|
|
29
|
+
fill: "black",
|
|
30
|
+
stroke: "rgba(255,255,255,0.8)"
|
|
31
|
+
};
|
|
32
|
+
if (theme === "dark") {
|
|
33
|
+
style.fill = "white";
|
|
34
|
+
style.stroke = "rgba(0,0,0,0.2)";
|
|
31
35
|
}
|
|
32
|
-
}
|
|
33
|
-
else {
|
|
36
|
+
} else {
|
|
34
37
|
style = theme;
|
|
35
38
|
}
|
|
36
|
-
if (!this.scrollXBar)
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
39
|
+
if (!this.scrollXBar) this.addMany(this.scrollXBar = new core.Box, this.scrollYBar = new core.Box);
|
|
40
|
+
style = Object.assign({
|
|
41
|
+
strokeAlign: "center",
|
|
42
|
+
opacity: .5,
|
|
43
|
+
width: 6,
|
|
44
|
+
cornerRadius: 3,
|
|
45
|
+
hoverStyle: {
|
|
46
|
+
opacity: .6
|
|
47
|
+
},
|
|
48
|
+
pressStyle: {
|
|
49
|
+
opacity: .7
|
|
50
|
+
}
|
|
51
|
+
}, style);
|
|
52
|
+
if (!style.height) style.height = style.width;
|
|
53
|
+
this.scrollXBar.set(Object.assign(Object.assign({}, style), {
|
|
54
|
+
visible: false
|
|
55
|
+
}));
|
|
56
|
+
this.scrollYBar.set(Object.assign(Object.assign({}, style), {
|
|
57
|
+
visible: false
|
|
58
|
+
}));
|
|
59
|
+
if (this.leafer) this.update();
|
|
45
60
|
}
|
|
46
61
|
update(check) {
|
|
47
|
-
if (this.dragScrolling)
|
|
48
|
-
|
|
49
|
-
const {
|
|
50
|
-
const {
|
|
51
|
-
|
|
52
|
-
if (check && this.scrollBounds && this.scrollBounds.isSame(worldRenderBounds))
|
|
53
|
-
return;
|
|
62
|
+
if (this.dragScrolling) return;
|
|
63
|
+
const {minSize: minSize, padding: padding} = this.config;
|
|
64
|
+
const {zoomLayer: zoomLayer, canvas: canvas} = this.target.leafer;
|
|
65
|
+
const {worldRenderBounds: worldRenderBounds} = zoomLayer;
|
|
66
|
+
if (check && this.scrollBounds && this.scrollBounds.isSame(worldRenderBounds)) return;
|
|
54
67
|
this.scrollBounds = new core.Bounds(worldRenderBounds);
|
|
55
68
|
const bounds = canvas.bounds.clone().shrink(padding);
|
|
56
69
|
const totalBounds = bounds.clone().add(worldRenderBounds);
|
|
@@ -60,8 +73,8 @@ this.LeaferIN.scroll = (function (exports, core) {
|
|
|
60
73
|
const scrollRatioY = (bounds.y - totalBounds.y) / totalBounds.height;
|
|
61
74
|
const showScrollXBar = ratioX < 1;
|
|
62
75
|
const showScrollYBar = ratioY < 1;
|
|
63
|
-
const { scrollXBar, scrollYBar } = this;
|
|
64
|
-
const { x, y, width, height } = bounds.shrink([2, showScrollYBar ? scrollYBar.width + 6 : 2, showScrollXBar ? scrollXBar.height + 6 : 2, 2]);
|
|
76
|
+
const {scrollXBar: scrollXBar, scrollYBar: scrollYBar} = this;
|
|
77
|
+
const {x: x, y: y, width: width, height: height} = bounds.shrink([ 2, showScrollYBar ? scrollYBar.width + 6 : 2, showScrollXBar ? scrollXBar.height + 6 : 2, 2 ]);
|
|
65
78
|
scrollXBar.set({
|
|
66
79
|
x: x + width * scrollRatioX,
|
|
67
80
|
y: y + height + 2,
|
|
@@ -89,15 +102,8 @@ this.LeaferIN.scroll = (function (exports, core) {
|
|
|
89
102
|
this.app.config.move.dragOut = this.__dragOut;
|
|
90
103
|
}
|
|
91
104
|
__listenEvents() {
|
|
92
|
-
const { scrollXBar, scrollYBar } = this;
|
|
93
|
-
this.__eventIds = [
|
|
94
|
-
scrollXBar.on_(core.DragEvent.DRAG, this.onDrag, this),
|
|
95
|
-
scrollYBar.on_(core.DragEvent.DRAG, this.onDrag, this),
|
|
96
|
-
scrollXBar.on_(core.DragEvent.END, this.onDragEnd, this),
|
|
97
|
-
scrollYBar.on_(core.DragEvent.END, this.onDragEnd, this),
|
|
98
|
-
this.target.on_(core.RenderEvent.BEFORE, () => this.update(true)),
|
|
99
|
-
this.target.leafer.on_(core.ResizeEvent.RESIZE, () => this.update())
|
|
100
|
-
];
|
|
105
|
+
const {scrollXBar: scrollXBar, scrollYBar: scrollYBar} = this;
|
|
106
|
+
this.__eventIds = [ scrollXBar.on_(core.DragEvent.DRAG, this.onDrag, this), scrollYBar.on_(core.DragEvent.DRAG, this.onDrag, this), scrollXBar.on_(core.DragEvent.END, this.onDragEnd, this), scrollYBar.on_(core.DragEvent.END, this.onDragEnd, this), this.target.on_(core.RenderEvent.BEFORE, () => this.update(true)), this.target.leafer.on_(core.ResizeEvent.RESIZE, () => this.update()) ];
|
|
101
107
|
}
|
|
102
108
|
__removeListenEvents() {
|
|
103
109
|
this.off_(this.__eventIds);
|
|
@@ -110,11 +116,7 @@ this.LeaferIN.scroll = (function (exports, core) {
|
|
|
110
116
|
}
|
|
111
117
|
}
|
|
112
118
|
}
|
|
113
|
-
|
|
114
|
-
core.Plugin.add('scroll');
|
|
115
|
-
|
|
119
|
+
core.Plugin.add("scroll");
|
|
116
120
|
exports.ScrollBar = ScrollBar;
|
|
117
|
-
|
|
118
121
|
return exports;
|
|
119
|
-
|
|
120
|
-
})({}, LeaferUI);
|
|
122
|
+
}({}, LeaferUI);
|
package/dist/scroll.min.cjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var t=require("@leafer-ui/core");class i extends t.Group{get isOutside(){return!0}constructor(i,s){super(),this.config={theme:"light",padding:0,minSize:10},i.isApp&&(i.sky.add(this),i=i.tree),this.target=i,s&&t.DataHelper.assign(this.config,s),this.changeTheme(this.config.theme),this.waitLeafer(this.__listenEvents,this)}changeTheme(i){let s;
|
|
1
|
+
"use strict";var t=require("@leafer-ui/core");class i extends t.Group{get isOutside(){return!0}constructor(i,s){super(),this.config={theme:"light",padding:0,minSize:10},i.isApp&&(i.sky.add(this),i=i.tree),this.target=i,s&&t.DataHelper.assign(this.config,s),this.changeTheme(this.config.theme),this.waitLeafer(this.__listenEvents,this)}changeTheme(i){let s;t.isString(i)?(s={fill:"black",stroke:"rgba(255,255,255,0.8)"},"dark"===i&&(s.fill="white",s.stroke="rgba(0,0,0,0.2)")):s=i,this.scrollXBar||this.addMany(this.scrollXBar=new t.Box,this.scrollYBar=new t.Box),s=Object.assign({strokeAlign:"center",opacity:.5,width:6,cornerRadius:3,hoverStyle:{opacity:.6},pressStyle:{opacity:.7}},s),s.height||(s.height=s.width),this.scrollXBar.set(Object.assign(Object.assign({},s),{visible:!1})),this.scrollYBar.set(Object.assign(Object.assign({},s),{visible:!1})),this.leafer&&this.update()}update(i){if(this.dragScrolling)return;const{minSize:s,padding:e}=this.config,{zoomLayer:r,canvas:h}=this.target.leafer,{worldRenderBounds:a}=r;if(i&&this.scrollBounds&&this.scrollBounds.isSame(a))return;this.scrollBounds=new t.Bounds(a);const o=h.bounds.clone().shrink(e),n=o.clone().add(a),l=this.ratioX=o.width/n.width,g=this.ratioY=o.height/n.height,d=(o.x-n.x)/n.width,c=(o.y-n.y)/n.height,u=l<1,v=g<1,{scrollXBar:p,scrollYBar:_}=this,{x:f,y:m,width:y,height:B}=o.shrink([2,v?_.width+6:2,u?p.height+6:2,2]);p.set({x:f+y*d,y:m+B+2,width:Math.max(y*l,s),visible:u}),_.set({x:f+y+2,y:m+B*c,height:Math.max(B*g,s),visible:v})}onDrag(t){this.dragScrolling=!0,this.__dragOut=this.app.config.move.dragOut,this.app.config.move.dragOut=!1;const i=t.current===this.scrollXBar,s=this.target.leafer.getValidMove(i?-t.moveX/this.ratioX:0,i?0:-t.moveY/this.ratioY);this.target.moveWorld(s.x,s.y),t.current.moveWorld(s.x&&-s.x*this.ratioX,s.y&&-s.y*this.ratioY)}onDragEnd(){this.dragScrolling=!1,this.app.config.move.dragOut=this.__dragOut}__listenEvents(){const{scrollXBar:i,scrollYBar:s}=this;this.__eventIds=[i.on_(t.DragEvent.DRAG,this.onDrag,this),s.on_(t.DragEvent.DRAG,this.onDrag,this),i.on_(t.DragEvent.END,this.onDragEnd,this),s.on_(t.DragEvent.END,this.onDragEnd,this),this.target.on_(t.RenderEvent.BEFORE,()=>this.update(!0)),this.target.leafer.on_(t.ResizeEvent.RESIZE,()=>this.update())]}__removeListenEvents(){this.off_(this.__eventIds)}destroy(){this.destroyed||(this.__removeListenEvents(),this.target=this.config=null,super.destroy())}}t.Plugin.add("scroll"),exports.ScrollBar=i;
|
|
2
2
|
//# sourceMappingURL=scroll.min.cjs.map
|
package/dist/scroll.min.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"scroll.min.cjs","sources":["../../../../../../src/in/packages/scroll/src/ScrollBar.ts","../../../../../../src/in/packages/scroll/src/index.ts"],"sourcesContent":["import { IApp, IBounds, IBox, IBoxInputData, IEventListenerId, IGroup } from '@leafer-ui/interface'\nimport { Group, RenderEvent, ResizeEvent, Box, Bounds, DataHelper, DragEvent } from '@leafer-ui/core'\n\nimport { IScrollBar, IScrollBarConfig, IScrollBarTheme } from '@leafer-in/interface'\n\n\nexport class ScrollBar extends Group implements IScrollBar {\n\n public target: IGroup\n public config: IScrollBarConfig = {\n theme: 'light',\n padding: 0,\n minSize: 10\n }\n\n public scrollXBar: IBox\n public scrollYBar: IBox\n\n public ratioX: number\n public ratioY: number\n public dragScrolling: boolean\n public scrollBounds: IBounds\n\n public get isOutside() { return true }\n\n protected __dragOut: boolean | number\n protected __eventIds: IEventListenerId[]\n\n constructor(target: IGroup, userConfig?: IScrollBarConfig) {\n super()\n if (target.isApp) {\n (target as IApp).sky.add(this)\n target = (target as IApp).tree\n }\n this.target = target\n if (userConfig) DataHelper.assign(this.config, userConfig)\n this.changeTheme(this.config.theme)\n this.waitLeafer(this.__listenEvents, this)\n }\n\n public changeTheme(theme: IScrollBarTheme): void {\n let style: IBoxInputData\n\n if (
|
|
1
|
+
{"version":3,"file":"scroll.min.cjs","sources":["../../../../../../src/in/packages/scroll/src/ScrollBar.ts","../../../../../../src/in/packages/scroll/src/index.ts"],"sourcesContent":["import { IApp, IBounds, IBox, IBoxInputData, IEventListenerId, IGroup } from '@leafer-ui/interface'\nimport { Group, RenderEvent, ResizeEvent, Box, Bounds, DataHelper, DragEvent, isString } from '@leafer-ui/core'\n\nimport { IScrollBar, IScrollBarConfig, IScrollBarTheme } from '@leafer-in/interface'\n\n\nexport class ScrollBar extends Group implements IScrollBar {\n\n public target: IGroup\n public config: IScrollBarConfig = {\n theme: 'light',\n padding: 0,\n minSize: 10\n }\n\n public scrollXBar: IBox\n public scrollYBar: IBox\n\n public ratioX: number\n public ratioY: number\n public dragScrolling: boolean\n public scrollBounds: IBounds\n\n public get isOutside() { return true }\n\n protected __dragOut: boolean | number\n protected __eventIds: IEventListenerId[]\n\n constructor(target: IGroup, userConfig?: IScrollBarConfig) {\n super()\n if (target.isApp) {\n (target as IApp).sky.add(this)\n target = (target as IApp).tree\n }\n this.target = target\n if (userConfig) DataHelper.assign(this.config, userConfig)\n this.changeTheme(this.config.theme)\n this.waitLeafer(this.__listenEvents, this)\n }\n\n public changeTheme(theme: IScrollBarTheme): void {\n let style: IBoxInputData\n\n if (isString(theme)) {\n style = { fill: 'black', stroke: 'rgba(255,255,255,0.8)' }\n if (theme === 'dark') {\n style.fill = 'white'\n style.stroke = 'rgba(0,0,0,0.2)'\n }\n } else {\n style = theme\n }\n\n if (!this.scrollXBar) this.addMany(this.scrollXBar = new Box(), this.scrollYBar = new Box())\n\n style = Object.assign({ strokeAlign: 'center', opacity: 0.5, width: 6, cornerRadius: 3, hoverStyle: { opacity: 0.6 }, pressStyle: { opacity: 0.7 } } as IBoxInputData, style)\n if (!style.height) style.height = style.width\n this.scrollXBar.set({ ...style, visible: false })\n this.scrollYBar.set({ ...style, visible: false })\n if (this.leafer) this.update()\n }\n\n\n public update(check?: boolean): void {\n if (this.dragScrolling) return\n\n const { minSize, padding } = this.config\n const { zoomLayer, canvas } = this.target.leafer\n const { worldRenderBounds } = zoomLayer\n\n if (check && this.scrollBounds && this.scrollBounds.isSame(worldRenderBounds)) return\n this.scrollBounds = new Bounds(worldRenderBounds)\n\n const bounds = canvas.bounds.clone().shrink(padding)\n const totalBounds = bounds.clone().add(worldRenderBounds)\n\n const ratioX = this.ratioX = bounds.width / totalBounds.width\n const ratioY = this.ratioY = bounds.height / totalBounds.height\n const scrollRatioX = (bounds.x - totalBounds.x) / totalBounds.width\n const scrollRatioY = (bounds.y - totalBounds.y) / totalBounds.height\n const showScrollXBar = ratioX < 1\n const showScrollYBar = ratioY < 1\n\n const { scrollXBar, scrollYBar } = this\n const { x, y, width, height } = bounds.shrink([2, showScrollYBar ? scrollYBar.width + 6 : 2, showScrollXBar ? scrollXBar.height + 6 : 2, 2])\n\n scrollXBar.set({\n x: x + width * scrollRatioX,\n y: y + height + 2,\n width: Math.max(width * ratioX, minSize),\n visible: showScrollXBar\n })\n\n scrollYBar.set({\n x: x + width + 2,\n y: y + height * scrollRatioY,\n height: Math.max(height * ratioY, minSize),\n visible: showScrollYBar\n })\n }\n\n protected onDrag(e: DragEvent): void {\n this.dragScrolling = true\n this.__dragOut = this.app.config.move.dragOut\n this.app.config.move.dragOut = false\n\n const scrollX = e.current === this.scrollXBar\n const move = this.target.leafer.getValidMove(scrollX ? -e.moveX / this.ratioX : 0, scrollX ? 0 : -e.moveY / this.ratioY)\n this.target.moveWorld(move.x, move.y)\n e.current.moveWorld(move.x && -move.x * this.ratioX, move.y && -move.y * this.ratioY)\n }\n\n protected onDragEnd(): void {\n this.dragScrolling = false\n this.app.config.move.dragOut = this.__dragOut\n }\n\n protected __listenEvents(): void {\n const { scrollXBar, scrollYBar } = this\n this.__eventIds = [\n scrollXBar.on_(DragEvent.DRAG, this.onDrag, this),\n scrollYBar.on_(DragEvent.DRAG, this.onDrag, this),\n scrollXBar.on_(DragEvent.END, this.onDragEnd, this),\n scrollYBar.on_(DragEvent.END, this.onDragEnd, this),\n this.target.on_(RenderEvent.BEFORE, () => this.update(true)),\n this.target.leafer.on_(ResizeEvent.RESIZE, () => this.update())\n ]\n }\n\n protected __removeListenEvents(): void {\n this.off_(this.__eventIds)\n }\n\n public destroy(): void {\n if (!this.destroyed) {\n this.__removeListenEvents()\n this.target = this.config = null\n super.destroy()\n }\n }\n\n}","export { ScrollBar } from './ScrollBar'\n\nimport { Plugin } from '@leafer-ui/core'\n\nPlugin.add('scroll')"],"names":["ScrollBar","Group","isOutside","constructor","target","userConfig","super","this","config","theme","padding","minSize","isApp","sky","add","tree","DataHelper","assign","changeTheme","waitLeafer","__listenEvents","style","isString","fill","stroke","scrollXBar","addMany","Box","scrollYBar","Object","strokeAlign","opacity","width","cornerRadius","hoverStyle","pressStyle","height","set","visible","leafer","update","check","dragScrolling","zoomLayer","canvas","worldRenderBounds","scrollBounds","isSame","Bounds","bounds","clone","shrink","totalBounds","ratioX","ratioY","scrollRatioX","x","scrollRatioY","y","showScrollXBar","showScrollYBar","Math","max","onDrag","e","__dragOut","app","move","dragOut","scrollX","current","getValidMove","moveX","moveY","moveWorld","onDragEnd","__eventIds","on_","DragEvent","DRAG","END","RenderEvent","BEFORE","ResizeEvent","RESIZE","__removeListenEvents","off_","destroy","destroyed","Plugin"],"mappings":"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"}
|
package/dist/scroll.min.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
this.LeaferIN=this.LeaferIN||{},this.LeaferIN.scroll=function(t,
|
|
1
|
+
this.LeaferIN=this.LeaferIN||{},this.LeaferIN.scroll=function(t,i){"use strict";class s extends i.Group{get isOutside(){return!0}constructor(t,s){super(),this.config={theme:"light",padding:0,minSize:10},t.isApp&&(t.sky.add(this),t=t.tree),this.target=t,s&&i.DataHelper.assign(this.config,s),this.changeTheme(this.config.theme),this.waitLeafer(this.__listenEvents,this)}changeTheme(t){let s;i.isString(t)?(s={fill:"black",stroke:"rgba(255,255,255,0.8)"},"dark"===t&&(s.fill="white",s.stroke="rgba(0,0,0,0.2)")):s=t,this.scrollXBar||this.addMany(this.scrollXBar=new i.Box,this.scrollYBar=new i.Box),s=Object.assign({strokeAlign:"center",opacity:.5,width:6,cornerRadius:3,hoverStyle:{opacity:.6},pressStyle:{opacity:.7}},s),s.height||(s.height=s.width),this.scrollXBar.set(Object.assign(Object.assign({},s),{visible:!1})),this.scrollYBar.set(Object.assign(Object.assign({},s),{visible:!1})),this.leafer&&this.update()}update(t){if(this.dragScrolling)return;const{minSize:s,padding:e}=this.config,{zoomLayer:r,canvas:h}=this.target.leafer,{worldRenderBounds:a}=r;if(t&&this.scrollBounds&&this.scrollBounds.isSame(a))return;this.scrollBounds=new i.Bounds(a);const n=h.bounds.clone().shrink(e),o=n.clone().add(a),l=this.ratioX=n.width/o.width,g=this.ratioY=n.height/o.height,d=(n.x-o.x)/o.width,c=(n.y-o.y)/o.height,u=l<1,v=g<1,{scrollXBar:f,scrollYBar:_}=this,{x:p,y:m,width:y,height:B}=n.shrink([2,v?_.width+6:2,u?f.height+6:2,2]);f.set({x:p+y*d,y:m+B+2,width:Math.max(y*l,s),visible:u}),_.set({x:p+y+2,y:m+B*c,height:Math.max(B*g,s),visible:v})}onDrag(t){this.dragScrolling=!0,this.__dragOut=this.app.config.move.dragOut,this.app.config.move.dragOut=!1;const i=t.current===this.scrollXBar,s=this.target.leafer.getValidMove(i?-t.moveX/this.ratioX:0,i?0:-t.moveY/this.ratioY);this.target.moveWorld(s.x,s.y),t.current.moveWorld(s.x&&-s.x*this.ratioX,s.y&&-s.y*this.ratioY)}onDragEnd(){this.dragScrolling=!1,this.app.config.move.dragOut=this.__dragOut}__listenEvents(){const{scrollXBar:t,scrollYBar:s}=this;this.__eventIds=[t.on_(i.DragEvent.DRAG,this.onDrag,this),s.on_(i.DragEvent.DRAG,this.onDrag,this),t.on_(i.DragEvent.END,this.onDragEnd,this),s.on_(i.DragEvent.END,this.onDragEnd,this),this.target.on_(i.RenderEvent.BEFORE,()=>this.update(!0)),this.target.leafer.on_(i.ResizeEvent.RESIZE,()=>this.update())]}__removeListenEvents(){this.off_(this.__eventIds)}destroy(){this.destroyed||(this.__removeListenEvents(),this.target=this.config=null,super.destroy())}}return i.Plugin.add("scroll"),t.ScrollBar=s,t}({},LeaferUI);
|
|
2
2
|
//# sourceMappingURL=scroll.min.js.map
|
package/dist/scroll.min.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"scroll.min.js","sources":["../../../../../../src/in/packages/scroll/src/ScrollBar.ts","../../../../../../src/in/packages/scroll/src/index.ts"],"sourcesContent":["import { IApp, IBounds, IBox, IBoxInputData, IEventListenerId, IGroup } from '@leafer-ui/interface'\nimport { Group, RenderEvent, ResizeEvent, Box, Bounds, DataHelper, DragEvent } from '@leafer-ui/core'\n\nimport { IScrollBar, IScrollBarConfig, IScrollBarTheme } from '@leafer-in/interface'\n\n\nexport class ScrollBar extends Group implements IScrollBar {\n\n public target: IGroup\n public config: IScrollBarConfig = {\n theme: 'light',\n padding: 0,\n minSize: 10\n }\n\n public scrollXBar: IBox\n public scrollYBar: IBox\n\n public ratioX: number\n public ratioY: number\n public dragScrolling: boolean\n public scrollBounds: IBounds\n\n public get isOutside() { return true }\n\n protected __dragOut: boolean | number\n protected __eventIds: IEventListenerId[]\n\n constructor(target: IGroup, userConfig?: IScrollBarConfig) {\n super()\n if (target.isApp) {\n (target as IApp).sky.add(this)\n target = (target as IApp).tree\n }\n this.target = target\n if (userConfig) DataHelper.assign(this.config, userConfig)\n this.changeTheme(this.config.theme)\n this.waitLeafer(this.__listenEvents, this)\n }\n\n public changeTheme(theme: IScrollBarTheme): void {\n let style: IBoxInputData\n\n if (
|
|
1
|
+
{"version":3,"file":"scroll.min.js","sources":["../../../../../../src/in/packages/scroll/src/ScrollBar.ts","../../../../../../src/in/packages/scroll/src/index.ts"],"sourcesContent":["import { IApp, IBounds, IBox, IBoxInputData, IEventListenerId, IGroup } from '@leafer-ui/interface'\nimport { Group, RenderEvent, ResizeEvent, Box, Bounds, DataHelper, DragEvent, isString } from '@leafer-ui/core'\n\nimport { IScrollBar, IScrollBarConfig, IScrollBarTheme } from '@leafer-in/interface'\n\n\nexport class ScrollBar extends Group implements IScrollBar {\n\n public target: IGroup\n public config: IScrollBarConfig = {\n theme: 'light',\n padding: 0,\n minSize: 10\n }\n\n public scrollXBar: IBox\n public scrollYBar: IBox\n\n public ratioX: number\n public ratioY: number\n public dragScrolling: boolean\n public scrollBounds: IBounds\n\n public get isOutside() { return true }\n\n protected __dragOut: boolean | number\n protected __eventIds: IEventListenerId[]\n\n constructor(target: IGroup, userConfig?: IScrollBarConfig) {\n super()\n if (target.isApp) {\n (target as IApp).sky.add(this)\n target = (target as IApp).tree\n }\n this.target = target\n if (userConfig) DataHelper.assign(this.config, userConfig)\n this.changeTheme(this.config.theme)\n this.waitLeafer(this.__listenEvents, this)\n }\n\n public changeTheme(theme: IScrollBarTheme): void {\n let style: IBoxInputData\n\n if (isString(theme)) {\n style = { fill: 'black', stroke: 'rgba(255,255,255,0.8)' }\n if (theme === 'dark') {\n style.fill = 'white'\n style.stroke = 'rgba(0,0,0,0.2)'\n }\n } else {\n style = theme\n }\n\n if (!this.scrollXBar) this.addMany(this.scrollXBar = new Box(), this.scrollYBar = new Box())\n\n style = Object.assign({ strokeAlign: 'center', opacity: 0.5, width: 6, cornerRadius: 3, hoverStyle: { opacity: 0.6 }, pressStyle: { opacity: 0.7 } } as IBoxInputData, style)\n if (!style.height) style.height = style.width\n this.scrollXBar.set({ ...style, visible: false })\n this.scrollYBar.set({ ...style, visible: false })\n if (this.leafer) this.update()\n }\n\n\n public update(check?: boolean): void {\n if (this.dragScrolling) return\n\n const { minSize, padding } = this.config\n const { zoomLayer, canvas } = this.target.leafer\n const { worldRenderBounds } = zoomLayer\n\n if (check && this.scrollBounds && this.scrollBounds.isSame(worldRenderBounds)) return\n this.scrollBounds = new Bounds(worldRenderBounds)\n\n const bounds = canvas.bounds.clone().shrink(padding)\n const totalBounds = bounds.clone().add(worldRenderBounds)\n\n const ratioX = this.ratioX = bounds.width / totalBounds.width\n const ratioY = this.ratioY = bounds.height / totalBounds.height\n const scrollRatioX = (bounds.x - totalBounds.x) / totalBounds.width\n const scrollRatioY = (bounds.y - totalBounds.y) / totalBounds.height\n const showScrollXBar = ratioX < 1\n const showScrollYBar = ratioY < 1\n\n const { scrollXBar, scrollYBar } = this\n const { x, y, width, height } = bounds.shrink([2, showScrollYBar ? scrollYBar.width + 6 : 2, showScrollXBar ? scrollXBar.height + 6 : 2, 2])\n\n scrollXBar.set({\n x: x + width * scrollRatioX,\n y: y + height + 2,\n width: Math.max(width * ratioX, minSize),\n visible: showScrollXBar\n })\n\n scrollYBar.set({\n x: x + width + 2,\n y: y + height * scrollRatioY,\n height: Math.max(height * ratioY, minSize),\n visible: showScrollYBar\n })\n }\n\n protected onDrag(e: DragEvent): void {\n this.dragScrolling = true\n this.__dragOut = this.app.config.move.dragOut\n this.app.config.move.dragOut = false\n\n const scrollX = e.current === this.scrollXBar\n const move = this.target.leafer.getValidMove(scrollX ? -e.moveX / this.ratioX : 0, scrollX ? 0 : -e.moveY / this.ratioY)\n this.target.moveWorld(move.x, move.y)\n e.current.moveWorld(move.x && -move.x * this.ratioX, move.y && -move.y * this.ratioY)\n }\n\n protected onDragEnd(): void {\n this.dragScrolling = false\n this.app.config.move.dragOut = this.__dragOut\n }\n\n protected __listenEvents(): void {\n const { scrollXBar, scrollYBar } = this\n this.__eventIds = [\n scrollXBar.on_(DragEvent.DRAG, this.onDrag, this),\n scrollYBar.on_(DragEvent.DRAG, this.onDrag, this),\n scrollXBar.on_(DragEvent.END, this.onDragEnd, this),\n scrollYBar.on_(DragEvent.END, this.onDragEnd, this),\n this.target.on_(RenderEvent.BEFORE, () => this.update(true)),\n this.target.leafer.on_(ResizeEvent.RESIZE, () => this.update())\n ]\n }\n\n protected __removeListenEvents(): void {\n this.off_(this.__eventIds)\n }\n\n public destroy(): void {\n if (!this.destroyed) {\n this.__removeListenEvents()\n this.target = this.config = null\n super.destroy()\n }\n }\n\n}","export { ScrollBar } from './ScrollBar'\n\nimport { Plugin } from '@leafer-ui/core'\n\nPlugin.add('scroll')"],"names":["ScrollBar","Group","isOutside","constructor","target","userConfig","super","this","config","theme","padding","minSize","isApp","sky","add","tree","DataHelper","assign","changeTheme","waitLeafer","__listenEvents","style","isString","fill","stroke","scrollXBar","addMany","Box","scrollYBar","Object","strokeAlign","opacity","width","cornerRadius","hoverStyle","pressStyle","height","set","visible","leafer","update","check","dragScrolling","zoomLayer","canvas","worldRenderBounds","scrollBounds","isSame","Bounds","bounds","clone","shrink","totalBounds","ratioX","ratioY","scrollRatioX","x","scrollRatioY","y","showScrollXBar","showScrollYBar","Math","max","onDrag","e","__dragOut","app","move","dragOut","scrollX","current","getValidMove","moveX","moveY","moveWorld","onDragEnd","__eventIds","on_","DragEvent","DRAG","END","RenderEvent","BEFORE","ResizeEvent","RESIZE","__removeListenEvents","off_","destroy","destroyed","Plugin"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@leafer-in/scroll",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.9.0",
|
|
4
4
|
"description": "@leafer-in/scroll",
|
|
5
5
|
"author": "Chao (Leafer) Wan",
|
|
6
6
|
"license": "MIT",
|
|
@@ -34,8 +34,8 @@
|
|
|
34
34
|
"leaferjs"
|
|
35
35
|
],
|
|
36
36
|
"peerDependencies": {
|
|
37
|
-
"@leafer-ui/core": "^1.
|
|
38
|
-
"@leafer-ui/interface": "^1.
|
|
39
|
-
"@leafer-in/interface": "^1.
|
|
37
|
+
"@leafer-ui/core": "^1.9.0",
|
|
38
|
+
"@leafer-ui/interface": "^1.9.0",
|
|
39
|
+
"@leafer-in/interface": "^1.9.0"
|
|
40
40
|
}
|
|
41
41
|
}
|
package/src/ScrollBar.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { IApp, IBounds, IBox, IBoxInputData, IEventListenerId, IGroup } from '@leafer-ui/interface'
|
|
2
|
-
import { Group, RenderEvent, ResizeEvent, Box, Bounds, DataHelper, DragEvent } from '@leafer-ui/core'
|
|
2
|
+
import { Group, RenderEvent, ResizeEvent, Box, Bounds, DataHelper, DragEvent, isString } from '@leafer-ui/core'
|
|
3
3
|
|
|
4
4
|
import { IScrollBar, IScrollBarConfig, IScrollBarTheme } from '@leafer-in/interface'
|
|
5
5
|
|
|
@@ -41,7 +41,7 @@ export class ScrollBar extends Group implements IScrollBar {
|
|
|
41
41
|
public changeTheme(theme: IScrollBarTheme): void {
|
|
42
42
|
let style: IBoxInputData
|
|
43
43
|
|
|
44
|
-
if (
|
|
44
|
+
if (isString(theme)) {
|
|
45
45
|
style = { fill: 'black', stroke: 'rgba(255,255,255,0.8)' }
|
|
46
46
|
if (theme === 'dark') {
|
|
47
47
|
style.fill = 'white'
|