1 |
|
2 |
|
3 |
|
4 |
|
5 |
|
6 |
|
7 |
|
8 |
|
9 |
|
10 |
|
11 |
|
12 |
|
13 | import * as go from '../release/go-module.js';
|
14 |
|
15 |
|
16 |
|
17 |
|
18 |
|
19 |
|
20 |
|
21 |
|
22 |
|
23 |
|
24 |
|
25 |
|
26 |
|
27 |
|
28 |
|
29 |
|
30 |
|
31 |
|
32 |
|
33 |
|
34 | go.GraphObject.defineBuilder('AutoRepeatButton', function(args) {
|
35 | const repeat = go.GraphObject.takeBuilderArgument(args, 50, function(x) { return typeof x === "number"; });
|
36 | const delay = go.GraphObject.takeBuilderArgument(args, 500, function(x) { return typeof x === "number"; });
|
37 | const $ = go.GraphObject.make;
|
38 |
|
39 | function delayClicking(e: go.InputEvent, obj: any) {
|
40 | endClicking(e, obj);
|
41 | if (obj.click) {
|
42 | obj._timer =
|
43 | setTimeout(function() { repeatClicking(e, obj); },
|
44 | delay);
|
45 | }
|
46 | }
|
47 | function repeatClicking(e: go.InputEvent, obj: any) {
|
48 | if (obj._timer) clearTimeout(obj._timer);
|
49 | if (obj.click) {
|
50 | obj._timer =
|
51 | setTimeout(function() {
|
52 | if (obj.click) {
|
53 | (obj.click)(e, obj);
|
54 | repeatClicking(e, obj);
|
55 | }
|
56 | },
|
57 | repeat);
|
58 | }
|
59 | }
|
60 | function endClicking(e: go.InputEvent, obj: any) {
|
61 | if (obj._timer) {
|
62 | clearTimeout(obj._timer);
|
63 | obj._timer = undefined;
|
64 | }
|
65 | }
|
66 |
|
67 | return $('Button',
|
68 | { actionDown: delayClicking, actionUp: endClicking });
|
69 | });
|
70 |
|
71 |
|
72 |
|
73 |
|
74 |
|
75 |
|
76 |
|
77 |
|
78 |
|
79 | go.GraphObject.defineBuilder('ScrollingTable', function(args) {
|
80 | const $ = go.GraphObject.make;
|
81 | const tablename = go.GraphObject.takeBuilderArgument(args, 'TABLE');
|
82 |
|
83 |
|
84 | function incrTableIndex(obj: go.GraphObject, i: number) {
|
85 | const diagram = obj.diagram;
|
86 | if (!obj.panel || !obj.panel.panel || !obj.panel.panel.panel) return;
|
87 | const table = obj.panel.panel.panel.findObject(tablename) as go.Panel;
|
88 | if (i === +Infinity || i === -Infinity) {
|
89 | const tabh = table.actualBounds.height;
|
90 | const rowh = table.elt(table.topIndex).actualBounds.height;
|
91 | if (i === +Infinity) {
|
92 | i = Math.max(1, Math.ceil(tabh / rowh) - 1);
|
93 | } else {
|
94 | i = -Math.max(1, Math.ceil(tabh / rowh) - 1);
|
95 | }
|
96 | }
|
97 | let idx = table.topIndex + i;
|
98 | if (idx < 0) idx = 0;
|
99 | else if (idx >= table.rowCount - 1) idx = table.rowCount - 1;
|
100 | if (table.topIndex !== idx) {
|
101 | if (diagram !== null) diagram.startTransaction('scroll');
|
102 | table.topIndex = idx;
|
103 | const node = table.part;
|
104 | if (node instanceof go.Node) node.invalidateConnectedLinks();
|
105 | updateScrollBar(table);
|
106 | if (diagram !== null) diagram.commitTransaction('scroll');
|
107 | }
|
108 | }
|
109 |
|
110 | function updateScrollBar(table: go.Panel) {
|
111 | if (table.panel === null) return;
|
112 | const bar = table.panel.elt(1) as go.Node;
|
113 | if (!bar) return;
|
114 | const idx = table.topIndex;
|
115 |
|
116 | const up = bar.findObject('UP');
|
117 | if (up) up.opacity = (idx > 0) ? 1.0 : 0.3;
|
118 |
|
119 | const down = bar.findObject('DOWN');
|
120 | if (down) down.opacity = (idx < table.rowCount - 1) ? 1.0 : 0.3;
|
121 |
|
122 | const tabh = bar.actualBounds.height;
|
123 | let rowh = table.elt(idx).actualBounds.height;
|
124 | if (rowh === 0 && idx < table.rowCount - 2) rowh = table.elt(idx + 1).actualBounds.height;
|
125 | const numVisibleRows = Math.max(1, Math.ceil(tabh / rowh) - 1);
|
126 | const needed = idx > 0 || idx + numVisibleRows <= table.rowCount;
|
127 | bar.opacity = needed ? 1.0 : 0.5;
|
128 | }
|
129 |
|
130 | return $(go.Panel, 'Table',
|
131 | {
|
132 | _updateScrollBar: updateScrollBar
|
133 | },
|
134 |
|
135 | $(go.Panel, 'Table',
|
136 | {
|
137 | name: tablename,
|
138 | column: 0,
|
139 | stretch: go.GraphObject.Fill,
|
140 | background: 'whitesmoke',
|
141 | rowSizing: go.RowColumnDefinition.None,
|
142 | defaultAlignment: go.Spot.Top
|
143 | }),
|
144 |
|
145 |
|
146 | $(go.RowColumnDefinition,
|
147 | { column: 1, sizing: go.RowColumnDefinition.None }),
|
148 | $(go.Panel, 'Table',
|
149 | { column: 1, stretch: go.GraphObject.Vertical, background: '#DDDDDD' },
|
150 |
|
151 | $('AutoRepeatButton',
|
152 | {
|
153 | name: 'UP',
|
154 | row: 0,
|
155 | alignment: go.Spot.Top,
|
156 | 'ButtonBorder.figure': 'Rectangle',
|
157 | 'ButtonBorder.fill': 'lightgray',
|
158 | click: function(e: go.InputEvent, obj: go.GraphObject) { incrTableIndex(obj, -1); }
|
159 | },
|
160 | $(go.Shape, 'TriangleUp',
|
161 | { stroke: null, desiredSize: new go.Size(6, 6) })),
|
162 |
|
163 |
|
164 | $('AutoRepeatButton',
|
165 | {
|
166 | name: 'DOWN',
|
167 | row: 2,
|
168 | alignment: go.Spot.Bottom,
|
169 | 'ButtonBorder.figure': 'Rectangle',
|
170 | 'ButtonBorder.fill': 'lightgray',
|
171 | click: function(e: go.InputEvent, obj: go.GraphObject) { incrTableIndex(obj, +1); }
|
172 | },
|
173 | $(go.Shape, 'TriangleDown',
|
174 | { stroke: null, desiredSize: new go.Size(6, 6) }))
|
175 | )
|
176 | );
|
177 | });
|