saasufy-components 1.9.0 → 1.10.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/app-router.js +5 -1
- package/collection-browser.js +2 -1
- package/collection-reducer.js +2 -1
- package/model-viewer.js +2 -1
- package/package.json +1 -2
- package/utils.js +31 -4
package/app-router.js
CHANGED
|
@@ -157,7 +157,11 @@ export class AppRouter extends SocketConsumer {
|
|
|
157
157
|
routeArgs = {};
|
|
158
158
|
}
|
|
159
159
|
|
|
160
|
-
routerViewport.innerHTML = renderTemplate(
|
|
160
|
+
routerViewport.innerHTML = renderTemplate(
|
|
161
|
+
pageTemplate.innerHTML,
|
|
162
|
+
routeArgs,
|
|
163
|
+
this.socket
|
|
164
|
+
);
|
|
161
165
|
}
|
|
162
166
|
|
|
163
167
|
render() {
|
package/collection-browser.js
CHANGED
|
@@ -171,7 +171,8 @@ class CollectionBrowser extends SocketConsumer {
|
|
|
171
171
|
for (let modelItem of this.collection.value) {
|
|
172
172
|
let itemString = renderTemplate(
|
|
173
173
|
itemTemplate.innerHTML,
|
|
174
|
-
{ [type]: modelItem }
|
|
174
|
+
{ [type]: modelItem },
|
|
175
|
+
this.socket
|
|
175
176
|
);
|
|
176
177
|
items.push(itemString);
|
|
177
178
|
}
|
package/collection-reducer.js
CHANGED
|
@@ -139,7 +139,8 @@ class CollectionReducer extends SocketConsumer {
|
|
|
139
139
|
let type = this.getAttribute('type-alias') || this.collection.type;
|
|
140
140
|
let itemString = renderTemplate(
|
|
141
141
|
itemTemplate.innerHTML,
|
|
142
|
-
{ [type]: this.collection.value }
|
|
142
|
+
{ [type]: this.collection.value },
|
|
143
|
+
this.socket
|
|
143
144
|
);
|
|
144
145
|
viewportNode.innerHTML = itemString;
|
|
145
146
|
}
|
package/model-viewer.js
CHANGED
|
@@ -59,7 +59,8 @@ class ModelViewer extends SocketConsumer {
|
|
|
59
59
|
let type = this.getAttribute('type-alias') || this.model.type;
|
|
60
60
|
let itemString = renderTemplate(
|
|
61
61
|
itemTemplate.innerHTML,
|
|
62
|
-
{ [type]: modelValue }
|
|
62
|
+
{ [type]: modelValue },
|
|
63
|
+
this.socket
|
|
63
64
|
);
|
|
64
65
|
viewportNode.innerHTML = itemString;
|
|
65
66
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "saasufy-components",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.10.0",
|
|
4
4
|
"description": "Components for Saasufy.",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"scripts": {
|
|
@@ -20,7 +20,6 @@
|
|
|
20
20
|
"ag-collection": "^3.3.0",
|
|
21
21
|
"ag-model": "^1.4.1",
|
|
22
22
|
"capitalisk-auth-client": "^1.5.1",
|
|
23
|
-
"expr-eval": "^2.0.2",
|
|
24
23
|
"socketcluster-client": "^19.1.0"
|
|
25
24
|
},
|
|
26
25
|
"bugs": {
|
package/utils.js
CHANGED
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import AGCollection from '/node_modules/ag-collection/ag-collection.js';
|
|
2
2
|
import AGModel from '/node_modules/ag-model/ag-model.js';
|
|
3
|
-
import { Parser } from '/node_modules/expr-eval/dist/index.mjs';
|
|
4
3
|
|
|
5
4
|
const DEFAULT_DEBOUNCE_DELAY = 300;
|
|
6
5
|
const DEFAULT_RELOAD_DELAY = 0;
|
|
@@ -11,7 +10,8 @@ export function toSafeHTML(text) {
|
|
|
11
10
|
.replace(/</g, '<')
|
|
12
11
|
.replace(/>/g, '>')
|
|
13
12
|
.replace(/"/g, '"')
|
|
14
|
-
.replace(/'/g, ''')
|
|
13
|
+
.replace(/'/g, ''')
|
|
14
|
+
.replace(/\n/g, '<br />');
|
|
15
15
|
} else if (text != null && typeof text.toString !== 'function') {
|
|
16
16
|
return '[invalid]';
|
|
17
17
|
}
|
|
@@ -170,21 +170,48 @@ let templateFormatters = {
|
|
|
170
170
|
},
|
|
171
171
|
joinFields: (list, field, sep) => {
|
|
172
172
|
return list.map(item => item[field]).join(sep);
|
|
173
|
+
},
|
|
174
|
+
date: (timestamp) => {
|
|
175
|
+
let date = new Date(timestamp);
|
|
176
|
+
let year = date.getFullYear();
|
|
177
|
+
let month = date.toLocaleString('default', { month: 'long' });
|
|
178
|
+
let day = date.getDate();
|
|
179
|
+
let hour = date.getHours();
|
|
180
|
+
let minutes = date.getMinutes();
|
|
181
|
+
return `${month} ${day}, ${year} at ${hour}:${minutes.toString().padStart(2, '0')}`;
|
|
173
182
|
}
|
|
174
183
|
};
|
|
175
184
|
|
|
176
185
|
let templateTagsRegExp = /{{[^}]+}}/g;
|
|
177
186
|
|
|
178
|
-
|
|
187
|
+
function execExpression(expression, options) {
|
|
188
|
+
let keys = Object.keys(options);
|
|
189
|
+
let args = [
|
|
190
|
+
...keys,
|
|
191
|
+
`return (function () {
|
|
192
|
+
return ${expression};
|
|
193
|
+
})();`
|
|
194
|
+
];
|
|
195
|
+
return (new Function(...args))(...keys.map(key => options[key]));
|
|
196
|
+
}
|
|
197
|
+
|
|
198
|
+
export function renderTemplate(templateString, data, socket) {
|
|
179
199
|
return templateString.replace(templateTagsRegExp, (match) => {
|
|
180
200
|
let expString = match.slice(2, -2);
|
|
181
201
|
let options = {
|
|
182
202
|
...templateFormatters,
|
|
203
|
+
socket: socket ? {
|
|
204
|
+
state: socket.state,
|
|
205
|
+
pendingReconnect: socket.pendingReconnect,
|
|
206
|
+
connectAttempts: socket.connectAttempts,
|
|
207
|
+
authState: socket.authState,
|
|
208
|
+
authToken: socket.authToken
|
|
209
|
+
} : undefined,
|
|
183
210
|
...data
|
|
184
211
|
};
|
|
185
212
|
try {
|
|
186
213
|
return toSafeHTML(
|
|
187
|
-
|
|
214
|
+
execExpression(
|
|
188
215
|
expString,
|
|
189
216
|
options
|
|
190
217
|
)
|