cavalion-vcl 1.1.83 → 1.1.85

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/.md CHANGED
@@ -14,12 +14,12 @@
14
14
  * [Input](src/ui/:.js) < [Checkbox](src/ui/:.js) - [Combobox](src/ui/:.js) - [DatePicker](src/ui/:.js)
15
15
  * [Button](src/ui/:.js) < [PopupButton](src/ui/:.js)
16
16
  * [Select](src/ui/:.js)
17
- * [Container](src/ui/:.js)
17
+ * **[Container](src/ui/:.js)**
18
18
  * [Group](src/ui/:.js)
19
19
  * [CheckGroup](src/ui/:.js)
20
20
  * [Bar](src/ui/:.js)
21
21
  * [Tabs](src/ui/:.js) - [Tab](src/ui/:.js)
22
- * [Panel](src/ui/:.js)
22
+ * **[Panel](src/ui/:.js)**
23
23
  * [Popup](src/ui/:.js) - [Ace](src/ui/:.js) - [Console](src/ui/:.js)
24
24
  * ( [Form](src/ui/:.js) - [FormContainer](src/ui/:.js) ) _where does onActive/Deactive go?_
25
25
  * [List](src/ui/:.js) | [ListColumn](src/ui/:.js) - [ListBody](src/ui/:.js) - [ListFooter](src/ui/:.js) - [ListHeader](src/ui/:.js) - [ListRow](src/ui/:.js)
package/CHANGELOG.md CHANGED
@@ -1,3 +1,9 @@
1
+ ### `2024/11/08` - 1.1.85
2
+
3
+ * Service build in favor of cavalion-code
4
+
5
+ ### `2024/10/..` - 1.1.84
6
+
1
7
  ### `2024/10/24` - 1.1.83
2
8
 
3
9
  - 20241024 introduces Control.prototype.getNext/PreviousSibling introduces Ace.prototype.append
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "cavalion-vcl",
3
- "version": "1.1.83",
3
+ "version": "1.1.85",
4
4
  "description": "Visual Component Library for vcl-comps",
5
5
  "main": "index.js",
6
6
  "scripts": {
package/src/Factory.js CHANGED
@@ -534,9 +534,7 @@ this._source = source;
534
534
  var sourceUri = Factory.makeTextUri(name);
535
535
 
536
536
  function instantiate(source, local) {
537
- var p = "";//local ? ".skip-fetch.local" : "";
538
- var factory = new Factory(parentRequire, name + p, sourceUri + p);
539
- // console.log("instantiate", name + p);
537
+ var factory = new Factory(parentRequire, name, sourceUri);
540
538
  factory.load(source, () => load(factory, source));
541
539
  }
542
540
 
@@ -1,7 +1,7 @@
1
1
  "use override, util/Event, util/HtmlElement, console/node/vcl/Component, vcl/Control";
2
2
 
3
3
  const override = require("override");
4
- const Event = require("util/Event");
4
+ const Event_ = require("util/Event");
5
5
  const HtmlElement = require("util/HtmlElement");
6
6
  const Control = require("vcl/Control");
7
7
 
@@ -40,7 +40,6 @@ keyup:MetaCtrl+192`,
40
40
  if (!scope.console.isVisible()) {
41
41
  scope.console.show();
42
42
  scope['align-enabled'].setState(true);
43
- this.setVar("focused", true);
44
43
  } else {
45
44
  if(Control.focused === scope.console.getScope().console) {
46
45
  scope['align-enabled'].setState(false);
@@ -54,7 +53,6 @@ keyup:MetaCtrl+192`,
54
53
  }
55
54
  } else {
56
55
  scope.console.setFocus();
57
- this.setVar("focused", true);
58
56
  }
59
57
  }
60
58
  }
@@ -74,7 +72,7 @@ keyup:MetaCtrl+192`,
74
72
  parent: "align-enabled",
75
73
  on(evt) {
76
74
  var console = this.scope().console;
77
- var delta = evt.keyCode === Event.keys.KEY_UP_ARROW ? 100 : -100;
75
+ var delta = evt.keyCode === Event_.keys.KEY_UP_ARROW ? 100 : -100;
78
76
  var height = console.getHeight() + delta;
79
77
  if(console._align !== "bottom" && console._align !== "top") {
80
78
  console.setAlign(delta === -100 ? "bottom" : "top");
@@ -103,7 +101,7 @@ keyup:MetaCtrl+192`,
103
101
  parent: "align-enabled",
104
102
  on(evt) {
105
103
  var console = this.scope().console, cons = console.qs("#console");
106
- var delta = evt.keyCode === Event.keys.KEY_RIGHT_ARROW ? 100 : -100;
104
+ var delta = evt.keyCode === Event_.keys.KEY_RIGHT_ARROW ? 100 : -100;
107
105
  if(console._align === "right") delta = -delta;
108
106
  var width = console.getWidth() + delta;
109
107
  if(console._align !== "left" && console._align !== "right") {
@@ -1,23 +1,12 @@
1
- "use vcl/CssRules, vcl/ui/Input";
1
+ "use vcl/CssRules, vcl/ui/Input, vcl/ui/Tabs, vcl/ui/ListRow";
2
2
 
3
3
  var CssRules = require("vcl/CssRules");
4
4
 
5
5
  var css = {
6
6
  '#close-x': {
7
- '': "transition: opacity 1s, background-color 1s; opacity: 0.1; position:absolute;top:0;right:0;color:silver;padding:4px 8px;font-size:14pt;z-index:999999999999;border-radius:15px;background-color:rgba(255,255,255,0.5);",
8
- '&:hover': "color:rgb(56,121,217);cursor:pointer;opacity: 1;"
7
+ '': "transition: opacity 1s; opacity: 0.1; position:absolute;top:0;right:0;color:silver;padding:4px 8px;font-size:14pt;z-index:999999999999;",
8
+ '&:hover': "color:black;cursor:pointer;opacity: 1;"
9
9
  },
10
- 'font-family': "Lucida Grande, Arial, sans-serif",
11
- 'font-size': "9pt",
12
- '.{./Button}': {
13
- 'font-size': "9pt",
14
- 'font-family': "Lucida Grande, Arial, sans-serif",
15
- 'vertical-align': "top",
16
- '&.disabled': "color:gray;",
17
- '&:not(:active)': "margin-bottom:4px;",
18
- '&:active': "margin-bottom:0;margin-top:2px;border:2px solid rgb(57,121,217); padding-left:8px; padding-right:6px;"// background:-webkit-linear-gradient(top, rgb(255, 255, 255) 10%, rgb(227, 227, 227) 100%);"
19
- },
20
-
21
10
  ".with-shadow": "box-shadow:rgba(0, 0, 0, 0.4) 0px 1px 2px 0px;",
22
11
  ".with-text-shadow": "text-shadow: rgb(255 255 255) 0px 0px 12px, #00000094 0px 0px 5px;",
23
12
  ".transparent": "background-color:transparent;",
@@ -26,7 +15,7 @@ var css = {
26
15
  ".glassy": "background-color: rgba(155, 155, 155, 0.35); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);",
27
16
  ".loading": "background: rgba(155, 155, 155, 0.35) url(/shared/vcl/images/loading.gif) 50% 50% no-repeat;",
28
17
  ".rounded": "padding: 4px; border-radius: 5px;",
29
- ".animate-width-height": "transition: z-index 400ms, width 250ms ease-in, height 250ms ease-in, transform 450ms;",
18
+ ".animate-width-height": "transition: width 250ms ease-in, height 250ms ease-in;",
30
19
  ">.glassy:not(.no-margin)": "margin: 32px;",
31
20
  ">.glassy": {
32
21
  "": "pointer-events: auto;",
@@ -53,7 +42,7 @@ var css = {
53
42
  'border-radius': "5px",
54
43
  'z-index': "1999",
55
44
  // 'backdrop-filter': "blur(10px)",
56
- 'transition': "box-shadow 0.45s ease 0s, transform 0.45s ease 0s, left 0.45s ease 0s, right 0.45s ease 0s, top 0.45s ease 0s, bottom 0.45s ease 0s, width 0.45s ease 0s, height 0.45s ease 0s, border-width 0.45s ease 0s, transform-origin 0.45s ease 0s",
45
+ 'transition': "box-shadow 0.45s ease 0s, transform 0.45s ease 0s, left 0.45s ease 0s, right 0.45s ease 0s, top 0.45s ease 0s, bottom 0.45s ease 0s, width 0.45s ease 0s, height 0.45s ease 0s, border-width 0.45s ease 0s",
57
46
  },
58
47
  '&:hover': {
59
48
  'box-shadow': "0 0 10px 5px rgba(0,0,0,.2)",
@@ -76,16 +65,6 @@ var css = {
76
65
  '&.glassy-overlay > .client.no-margin': "margin:0;",
77
66
  '&.right': "right: 40px; transform-origin: top right;",
78
67
  '&.left': "left: 40px; transform-origin: top left;",
79
-
80
- '&.parent-topleft': "transform-origin: 0% 0%;",
81
- '&.parent-topcenter': "transform-origin: 50% 0%;",
82
- '&.parent-topright': "transform-origin: 100% 0%;",
83
- '&.parent-middleleft': "transform-origin: 0% 50%;",
84
- '&.parent-middlecenter': "transform-origin: 50% 50%;",
85
- '&.parent-middleright': "transform-origin: 100% 50%;",
86
- '&.parent-bottomleft': "transform-origin: 0% 100%;",
87
- '&.parent-bottomcenter': "transform-origin: 50% 100%;",
88
- '&.parent-bottomright': "transform-origin: 100% 100%;",
89
68
 
90
69
  // "&.right": {
91
70
  // '': "right: 5%; transform-origin: top right;",
@@ -95,6 +74,15 @@ var css = {
95
74
  // '': "left: 5%; transform-origin: top left;",
96
75
  // },
97
76
 
77
+ '&.parent-topleft': "transform-origin: 0% 0%;",
78
+ '&.parent-topcenter': "transform-origin: 50% 0%;",
79
+ '&.parent-topright': "transform-origin: 100% 0%;",
80
+ '&.parent-middleleft': "transform-origin: 0% 50%;",
81
+ '&.parent-middlecenter': "transform-origin: 50% 50%;",
82
+ '&.parent-middleright': "transform-origin: 100% 50%;",
83
+ '&.parent-bottomleft': "transform-origin: 0% 100%;",
84
+ '&.parent-bottomcenter': "transform-origin: 50% 100%;",
85
+ '&.parent-bottomright': "transform-origin: 100% 100%;",
98
86
  '&.shrink-to-corner:not(:hover)': {
99
87
  'width': 175 + "px",
100
88
  'height': 175 + "px"
@@ -151,24 +139,15 @@ var css = {
151
139
  }
152
140
  },
153
141
 
154
- '.glassy-overflow': "position: absolute; _pointer-events: none; background-color: rgba(205,95,65,0.1); z-index: 1998;",
155
-
156
- '.veldoffice\\/Tabs\\<Document\\> .\\#preview': "background-color: rgba(240, 240, 240, 0.75);"
142
+ '.glassy': {
143
+ '#bar': "background-color: rgba(240, 240, 240, 0.35);",
144
+ '.{Tabs}': "background-color: rgba(240, 240, 240, 0.35);",
145
+ '.{ListRow}:not(.selected).odd': "background-color: rgba(240, 240, 240, 0.7777);"
146
+ }
157
147
  };
158
148
 
159
- [(""), {
160
- onLoad() {
161
- const w = this.qs("#window");
162
- w.set("css", js.mi(w.get("css") || {}, css));
163
- return this.inherited(arguments);
164
- }
165
- }, [
149
+ [(""), [
150
+
151
+ [("#window"), { css: css }]
166
152
 
167
- // ["#window", {
168
-
169
- // css: css
170
-
171
- // }]
172
-
173
-
174
153
  ]];
@@ -1,5 +1,22 @@
1
1
  "use js, vcl/ui/Node, vcl/ui/Input, vcl/ui/Tab, vcl/ui/Button";
2
2
 
3
+ const css = {
4
+ 'font-family': "Lucida Grande, Arial, sans-serif",
5
+ 'font-size': "9pt",
6
+ '.{Console}': {
7
+ '.node > .container': "padding-top: 2px;",
8
+ '.node': "padding-bottom: 2.4px;"
9
+ },
10
+ '.{Button}': {
11
+ 'font-size': "9pt",
12
+ 'font-family': "Lucida Grande, Arial, sans-serif",
13
+ 'vertical-align': "top",
14
+ '&.disabled': "color:gray;",
15
+ '&:not(:active)': "margin-bottom:4px;",
16
+ '&:active': "margin-bottom:0;margin-top:2px;border:2px solid rgb(57,121,217); padding-left:8px; padding-right:6px;"// background:-webkit-linear-gradient(top, rgb(255, 255, 255) 10%, rgb(227, 227, 227) 100%);"
17
+ }
18
+ };
19
+
3
20
  [["./App.console.toast.glassy<>"], {
4
21
  vars: { canunload: true }
5
22
  }, [
@@ -11,144 +28,5 @@
11
28
  }
12
29
  }],
13
30
 
14
- [("#window"), {
15
- css: {
16
- '#close-x': {
17
- '': "transition: opacity 1s; opacity: 0.1; position:absolute;top:0;right:0;color:silver;padding:4px 8px;font-size:14pt;z-index:999999999999;",
18
- '&:hover': "color:black;cursor:pointer;opacity: 1;"
19
- },
20
- 'font-family': "Lucida Grande, Arial, sans-serif",
21
- 'font-size': "9pt",
22
- '.{./Button}': {
23
- 'font-size': "9pt",
24
- 'font-family': "Lucida Grande, Arial, sans-serif",
25
- 'vertical-align': "top",
26
- '&.disabled': "color:gray;",
27
- '&:not(:active)': "margin-bottom:4px;",
28
- '&:active': "margin-bottom:0;margin-top:2px;border:2px solid rgb(57,121,217); padding-left:8px; padding-right:6px; background:-webkit-linear-gradient(top, rgb(255, 255, 255) 10%, rgb(227, 227, 227) 100%);"
29
- },
30
- ".with-shadow": "box-shadow:rgba(0, 0, 0, 0.4) 0px 1px 2px 0px;",
31
- ".with-text-shadow": "text-shadow: rgb(255 255 255) 0px 0px 12px, #00000094 0px 0px 5px;",
32
- ".transparent": "background-color:transparent;",
33
- ".glassy-overlay": {
34
- "": "pointer-events: none; color:rgba(5,5,5,0.95);",
35
- ".glassy": "background-color: rgba(155, 155, 155, 0.35); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);",
36
- ".loading": "background: rgba(155, 155, 155, 0.35) url(/shared/vcl/images/loading.gif) 50% 50% no-repeat;",
37
- ".rounded": "padding: 4px; border-radius: 5px;",
38
- ".animate-width-height": "transition: width 250ms ease-in, height 250ms ease-in;",
39
- ">.glassy:not(.no-margin)": "margin: 32px;",
40
- ">.glassy": {
41
- "": "pointer-events: auto;",
42
- // "&:hover": "backdrop-filter: blur(25px); -webkit-backdrop-filter: blur(25px);"
43
- },
44
- ">.{Element}": "pointer-events: auto;",
45
- ".{Node}": {
46
- "&.invisible-layer": "opacity: 0.4;",
47
- "&.seperator": "border-top:1px solid rgba(155,155,155,0.55);margin-top:2px;padding-top:2px;",
48
- ">.text>img": "width:20px;height:20px;"
49
- }
50
- },
51
- '.container-glassy': {
52
- /* TODO CSS definitions must (eventually) be moved to App.glassy */
53
- '': {
54
- // 'height': HEIGHT + "px",
55
- // 'width': WIDTH + "px",
56
- 'top': "5%",
57
- // 'height': "100%",
58
-
59
- 'min-width': "54px",
60
- 'min-height': "54px",
61
-
62
- 'border-radius': "5px",
63
- 'z-index': "1999",
64
- // 'backdrop-filter': "blur(10px)",
65
- 'transition': "box-shadow 0.45s ease 0s, transform 0.45s ease 0s, left 0.45s ease 0s, right 0.45s ease 0s, top 0.45s ease 0s, bottom 0.45s ease 0s, width 0.45s ease 0s, height 0.45s ease 0s, border-width 0.45s ease 0s",
66
- },
67
- '&:hover': {
68
- 'box-shadow': "0 0 10px 5px rgba(0,0,0,.2)",
69
- 'cursor': "move",
70
- '.client': "border-color: rgba(56,127,217,0.025); background-color:rgba(155, 155, 155, 0.2);"
71
- },
72
- // '&.square': {
73
- // 'min-width': 175 + "px",
74
- // 'min-height': 175 + "px"
75
- // },
76
- '&.dragging': {
77
- 'transition': "box-shadow 0.15s ease 0s" || "transform 75ms ease-out 0s, left 75ms ease-out 0s, right 75ms ease-out 0s, top 75ms ease-out 0s, bottom 75ms ease-out 0s, width 75ms ease-out 0s, height 75ms ease-out 0s, border-width 0.45s ease 0s",
78
-
79
- 'box-shadow': "0 0 20px 10px rgba(0,0,0,.2)",
80
- '.client': {
81
- 'border-color': "rgba(56,127,217,0.4)" || "rgba(255,215,0,0.75)"
82
- }
83
-
84
- },
85
- '&.glassy-overlay > .client.no-margin': "margin:0;",
86
- '&.right': "right: 40px; transform-origin: top right;",
87
- '&.left': "left: 40px; transform-origin: top left;",
88
-
89
- // "&.right": {
90
- // '': "right: 5%; transform-origin: top right;",
91
- // "&:not(:hover)": "margin-left:1px; transform: translate3d(75%, 0, 0);"
92
- // },
93
- // "&.left": {
94
- // '': "left: 5%; transform-origin: top left;",
95
- // },
96
-
97
- '&.shrink-to-corner:not(:hover)': {
98
- 'width': 175 + "px",
99
- 'height': 175 + "px"
100
- },
101
- '&:not(.no-transparent-effects)': {
102
- '*': "text-shadow: none;",
103
- '.{List}': "border-radius:5px;",
104
- '.{ListHeader}': {
105
- '': "background-color:transparent;transition:background-color 1s ease 0s;",
106
- '&.scrolled': "background-color:rgba(255,255,255,0.75);",
107
- '>div': "background-image:none;border:none;font-weight:bold;"
108
- },
109
- '.{Input}': {
110
- 'input': 'background-color: rgba(255,255,255,0.2);',
111
- // 'input:focus': 'background-color: rgba(255,255,255,0.9);'
112
- },
113
-
114
- // '.{ListHeader}': {
115
- // '': "background-color:transparent;transition:background-color 0.5s ease 0s;",
116
- // ':active': "background-color: gold;", //rgb(56, 121, 217);" }
117
- // '&.scrolled': "background-color:rgba(255,255,255,0.75);"
118
- // }
119
-
120
- },
121
-
122
- 'input': {
123
- // 'flex': "1 1 0%",
124
- // 'transition': "width 0.5s ease 0s",
125
- // 'width': "150px"
126
- 'padding': "5px",//"5px 24px",
127
- 'border-radius': "5px",
128
- 'border': "none",
129
- 'background': "rgba(255, 255, 255, 0.2)"
130
- },
131
-
132
- '.client': {
133
- 'position': "relative",
134
- 'border-radius': "5px",
135
- 'border': "7px solid rgba(0,0,0,0)",
136
- // 'overflow': "hidden",
137
- 'height': "100%",
138
- 'transition': "border-color 0.45s ease 0s, background-color 0.45s ease 0s",
139
- '&:hover': {
140
- }
141
- },
142
- '.seperator.seperator.seperator': "border-top: 1px solid rgba(155, 155, 155, 0.55);",
143
-
144
- '&.phone': {
145
- '': "width: 389px; border-radius:20px; box-shadow: 0 0 20px 10px rgba(0,0,0,.2);",
146
- ">.client": {
147
- '': "border-radius: 20px;",
148
- 'iframe': "border-radius: 20px;"
149
- }
150
- }
151
- }
152
- }
153
- }]
31
+ [("#window"), { css: css }]
154
32
  ]];
@@ -4,11 +4,18 @@
4
4
  ["vcl/ui/Panel", ("left"), { align: "left", width: 325 }, [
5
5
  ["vcl/ui/Panel", ("left_content"), { align: "top", autoSize: "height" }, [
6
6
  ["vcl/ui/Element", ("description"), {
7
- content: [
8
- // "A view form consists of a panel aligned to the left ",
9
- // "and one aligned client. The client panel usually shows a menubar ",
10
- // "aligned to the top."
11
- ].join("")
7
+ // onRender() {
8
+ // this.nextTick(() => {
9
+ // const left_content = this.ud("#left_content").getNode();
10
+ // // const has = left_content.hasAttribte
11
+ // if (left_content.scrollHeight > left_content.clientHeight) {
12
+ // left_content.setAttribute("data-overflow-y", "true");
13
+ // } else {
14
+ // left_content.removeAttribute("data-overflow-y");
15
+ // }
16
+ // });
17
+ // },
18
+ content: locale("App-description.default")
12
19
  }]
13
20
  ]]
14
21
  ]],
@@ -1,21 +1,22 @@
1
- "use devtools/Resources, devtools/Parser, vcl/Component, vcl/Control, vcl/Dragger, util/Command, util/HotkeyManager, vcl/ui/Sizer, vcl/ui/FormContainer, entities/EM, entities/ExpressionBuilder, util/Rest, features/FM, devtools/cavalion-devtools, vcl/ui/Ace";
1
+ "use devtools/Resources, devtools/Parser, vcl/Component, vcl/Control, vcl/Dragger, util/HotkeyManager, vcl/ui/Sizer, vcl/ui/FormContainer, devtools/cavalion-devtools, vcl/ui/Ace, util/Clipboard, blocks/Blocks";
2
2
 
3
3
  const Component = require("vcl/Component");
4
4
  const Control = require("vcl/Control");
5
5
  const FormContainer = require("vcl/ui/FormContainer");
6
6
  const Ace = require("vcl/ui/Ace");
7
7
  const Sizer = require("vcl/ui/Sizer");
8
- const Command = require("util/Command");
9
- const Rest = require("util/Rest");
10
- const Deferred = require("js/Deferred");
11
- const JsObject = require("js/JsObject");
12
8
  const Dragger = require("vcl/Dragger");
13
9
  const Resources = require("devtools/Resources");
14
10
  const Parser = require("devtools/Parser");
11
+ const Clipboard = require("util/Clipboard");
12
+ const B = require("blocks/Blocks");
15
13
 
16
14
  const HOTKEY_ALWAYS_ENABLED = {
17
15
  isHotkeyEnabled() {
18
- return this._owner.isEnabled();
16
+ if(this._owner.isEnabled()) {
17
+ return (Control.focused || this).up("devtools/Workspace<>") === null;
18
+ }
19
+ return false;
19
20
  }
20
21
  };
21
22
  const getAce = () => {
@@ -26,27 +27,22 @@ const getAce = () => {
26
27
  .filter(ace => ace.isVisible())
27
28
  .pop();
28
29
  };
29
-
30
30
  const deselect = () => {
31
31
  window.getSelection && window.getSelection().removeAllRanges();
32
32
  document.selection && document.selection.empty();
33
33
  };
34
34
 
35
- window.H = (uri, vars) => B.i(["Hover<>", { vars: js.mi({ uri: uri }, vars)}]);
36
- window.RS = Resources;
37
-
38
- let cc = function() { // HM-20241010-1-method-auto-require-in-first-call
39
- // const args = js.copy_args(arguments);
40
- return Promise.resolve(req("clipboard-copy")).then(cc_ => {
41
- cc = cc_;
42
-
43
- return cc.apply(window, arguments);
44
- });
45
- };
35
+ const H = (uri, vars) => B.i(["Hover<>", { vars: js.mi({ uri: uri }, vars)}]);
46
36
 
37
+ const cc = (text) => Clipboard.copy(text);
47
38
  const cl = console.log;
48
39
  const facts = (comp) => Component.getFactories(comp);
49
40
 
41
+ window.B = B; window.H = H;
42
+ window.facts = facts;
43
+ window.cc = cc;
44
+ window.cl = cl;
45
+
50
46
  [["ui/Form"], {
51
47
  activeControl: "console",
52
48
  align: "bottom",
@@ -348,7 +344,6 @@ const facts = (comp) => Component.getFactories(comp);
348
344
  }
349
345
  }],
350
346
 
351
-
352
347
  [["ui/controls/Toolbar"], "toolbar", {
353
348
  css: { cursor: "ns-resize" },
354
349
  draggable: true,
@@ -384,7 +379,6 @@ const facts = (comp) => Component.getFactories(comp);
384
379
  },
385
380
  onEvaluate(expr) {
386
381
  const cl = console.log;
387
- const cc = req("clipboard-copy");
388
382
  const pr = () => this.print.apply(this, arguments);
389
383
 
390
384
  const open = (uri, opts) => this.bubble(
package/src/ui/Panel.js CHANGED
@@ -72,7 +72,8 @@ define(function (require) {
72
72
  _bottom: 0,
73
73
  _width: 0,
74
74
  _height: 0,
75
- _zoom: 1.0,
75
+ _zoom: 1.0,
76
+ _zoomOrigin: "0 0",
76
77
 
77
78
  _focusable: false,
78
79
 
@@ -368,7 +369,7 @@ define(function (require) {
368
369
  if(zoomed && parseFloat(this._zoom) !== 1) {
369
370
  style.transform = String.format("scale3d(%s, %s, 1)",
370
371
  this._zoom, this._zoom);
371
- style['transform-origin'] = "0 0";
372
+ style['transform-origin'] = this._zoomOrigin;
372
373
  } else {
373
374
  style.transform = "";
374
375
  style['transform-origin'] = "";
@@ -852,13 +853,19 @@ define(function (require) {
852
853
  }
853
854
  return this._zoom;
854
855
  },
855
- setZoom: function(f) {
856
- if(this._zoom !== f) {
856
+ setZoom: function(f, o) {
857
+ if(f instanceof Array) {
858
+ // support for zoom: [1.5, "50% 0"]
859
+ return this.setZoom(f[0], f[1]);
860
+ }
861
+
862
+ if(this._zoom !== f || this._zoomOrigin !== o) {
857
863
  if(!this.hasClass("animated")) {
858
864
  this.addClass("animated");
859
- return this.update(function() { this.setZoom(f); }.bind(this));
865
+ return this.update(function() { this.setZoom(f, o); }.bind(this));
860
866
  }
861
867
  this._zoom = f;
868
+ this._zoomOrigin = o;
862
869
  this.nodeNeeded();
863
870
  this.renderZoom();
864
871
  this.setTimeout("align", 450);
package/src/ui/Tree.js CHANGED
@@ -10,7 +10,7 @@ define(function (require) {
10
10
 
11
11
  var platform = window.navigator.platform;
12
12
  var checkbox_top = Browser.safari ? 0 : 2;
13
-
13
+
14
14
  return (Tree = Tree(require, {
15
15
  inherits: Panel,
16
16
  prototype: {
@@ -117,7 +117,6 @@ define(function (require) {
117
117
  },
118
118
  "&.expandable:not(.expanding)": {
119
119
  ">.icon::before": {
120
- transform: "translate(0, -2px)",
121
120
  'line-height': "0",
122
121
  content: "'▸'" // http://www.alanwood.net/unicode/geometric_shapes.html
123
122
  }
@@ -234,10 +233,11 @@ define(function (require) {
234
233
  },
235
234
  makeVisible: function(childNode) {
236
235
  if(childNode) {
237
- var node = this.nodeNeeded();
238
- var pos = 0; // jquery(childNode.nodeNeeded()).position();
239
- var top = this.getAbsoluteRect().height / 3;
240
- node.scrollTop -= (top - pos.top);
236
+ // var node = this.nodeNeeded();
237
+ // var pos = childNode.nodeNeeded().position();
238
+ // var top = this.getAbsoluteRect().height / 3;
239
+ // node.scrollTop -= (top - pos.top);
240
+ childNode.scrollIntoView({ behavior: "auto", block: "center", inline: "nearest" });
241
241
  } else {
242
242
  return this.inherited(arguments);
243
243
  }