Skip to content

Commit 8a73321

Browse files
texodustexodus
authored
Merge pull request #2886 from finos/css-cleanup
Fix examples and cleanup CSS
2 parents c4666a3 + 37307ca commit 8a73321

24 files changed

Lines changed: 281 additions & 255 deletions

File tree

‎examples/blocks/src/dataset/index.html‎

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -229,11 +229,8 @@
229229
}
230230

231231
// Main
232-
233-
window.addEventListener("DOMContentLoaded", async function () {
234-
run.addEventListener("click", make_run_click_callback({}));
235-
run.dispatchEvent(new Event("click"));
236-
});
232+
run.addEventListener("click", make_run_click_callback({}));
233+
run.dispatchEvent(new Event("click"));
237234

238235
</script>
239236
</body>

‎examples/blocks/src/market/market.js‎

Lines changed: 21 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -261,29 +261,27 @@ async function init_layouts() {
261261

262262
const INIT_TASK = [init_tables(), init_layouts()];
263263

264-
window.addEventListener("DOMContentLoaded", async function () {
265-
const [{ market_table, gui_table }, layouts] = await Promise.all(INIT_TASK);
266-
const market = new Market(market_table, skew_model);
267-
const settings = !/(iPad|iPhone|iPod)/g.test(navigator.userAgent);
268-
const select = document.querySelector("select");
269-
const button = document.querySelector("button");
270-
const viewer = document.querySelector("perspective-viewer");
271-
viewer.load(gui_table);
272-
viewer.restore({ theme: "Pro Dark", settings, ...layouts[0] });
273-
await market.poll(progress);
274-
for (const layout of layouts) {
275-
const option = document.createElement("option");
276-
option.value = layout.title;
277-
option.textContent = layout.title;
278-
select.appendChild(option);
279-
}
264+
const [{ market_table, gui_table }, layouts] = await Promise.all(INIT_TASK);
265+
const market = new Market(market_table, skew_model);
266+
const settings = !/(iPad|iPhone|iPod)/g.test(navigator.userAgent);
267+
const select = document.querySelector("select");
268+
const button = document.querySelector("button");
269+
const viewer = document.querySelector("perspective-viewer");
270+
viewer.load(gui_table);
271+
viewer.restore({ theme: "Pro Dark", settings, ...layouts[0] });
272+
await market.poll(progress);
273+
for (const layout of layouts) {
274+
const option = document.createElement("option");
275+
option.value = layout.title;
276+
option.textContent = layout.title;
277+
select.appendChild(option);
278+
}
280279

281-
button.addEventListener("click", () => {
282-
reset_tables(market, market_table, gui_table);
283-
});
280+
button.addEventListener("click", () => {
281+
reset_tables(market, market_table, gui_table);
282+
});
284283

285-
select.addEventListener("change", async (event) => {
286-
const layout = layouts.find((x) => x.title === event.target.value);
287-
await viewer.restore(layout);
288-
});
284+
select.addEventListener("change", async (event) => {
285+
const layout = layouts.find((x) => x.title === event.target.value);
286+
await viewer.restore(layout);
289287
});

‎examples/python-tornado-streaming/index.html‎

Lines changed: 20 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -25,14 +25,13 @@
2525

2626
<script type="module">
2727
import perspective from "/node_modules/@finos/perspective/dist/cdn/perspective.js";
28-
window.addEventListener("DOMContentLoaded", async function () {
29-
const viewer = document.getElementById("viewer");
28+
const viewer = document.getElementById("viewer");
3029

31-
// Create a client that expects a Perspective server to accept
32-
// Websocket connections at the specified URL.
33-
const websocket = await perspective.websocket("ws://localhost:8080/websocket");
30+
// Create a client that expects a Perspective server to accept
31+
// Websocket connections at the specified URL.
32+
const websocket = await perspective.websocket("ws://localhost:8080/websocket");
3433

35-
/* This shows Perspective running in "server mode": the `table`
34+
/* This shows Perspective running in "server mode": the `table`
3635
variable is a proxy for the `Table` we created on the server.
3736
3837
All operations that are possible through the Javascript API are
@@ -41,22 +40,22 @@
4140
operations to the Python `Table`, execute the commands,
4241
and return the result back to Javascript.
4342
*/
44-
const table = await websocket.open_table("data_source_one");
45-
46-
// Load this in the `<perspective-viewer>`.
47-
viewer.load(table);
48-
viewer.restore({
49-
plugin: "X/Y Scatter",
50-
aggregates: {
51-
high: "avg",
52-
low: "avg",
53-
},
54-
columns: ["high", "low"],
55-
group_by: ["client"],
56-
split_by: ["name"],
57-
});
58-
viewer.toggleConfig();
43+
const table = await websocket.open_table("data_source_one");
44+
45+
// Load this in the `<perspective-viewer>`.
46+
viewer.load(table);
47+
viewer.restore({
48+
plugin: "X/Y Scatter",
49+
aggregates: {
50+
high: "avg",
51+
low: "avg",
52+
},
53+
columns: ["high", "low"],
54+
group_by: ["client"],
55+
split_by: ["name"],
5956
});
57+
58+
viewer.toggleConfig();
6059
</script>
6160
</body>
6261
</html>

‎examples/python-tornado/client_server_editing.html‎

Lines changed: 47 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -42,62 +42,60 @@
4242
* For a simple example of distributed mode without editing, see
4343
* `index.html`.
4444
*/
45-
window.addEventListener("DOMContentLoaded", async function () {
46-
const viewer = document.getElementById("viewer");
45+
const viewer = document.getElementById("viewer");
4746

48-
// Connect to the websocket and create a new webworker
49-
const websocket = perspective.websocket("ws://localhost:8080/websocket");
50-
const worker = perspective.worker();
47+
// Connect to the websocket and create a new webworker
48+
const websocket = perspective.websocket("ws://localhost:8080/websocket");
49+
const worker = perspective.worker();
5150

52-
// Get handles to the `Table` on the server, and create a
53-
// `view()` on the server.
54-
const server_table = await websocket.open_table("data_source_one");
55-
const server_view = await server_table.view();
51+
// Get handles to the `Table` on the server, and create a
52+
// `view()` on the server.
53+
const server_table = await websocket.open_table("data_source_one");
54+
const server_view = await server_table.view();
5655

57-
// Serialize the current state of the view to an arrow, and create
58-
// a Table on the client that has the same index as the Table
59-
// on the server using `get_index()`.
60-
//
61-
// Client/server editing does not work on an unindexed Table.
62-
const arrow = await server_view.to_arrow();
63-
const client_table = await worker.table(arrow, { index: "Row ID" });
64-
const client_view = await client_table.view(); // client -> server
56+
// Serialize the current state of the view to an arrow, and create
57+
// a Table on the client that has the same index as the Table
58+
// on the server using `get_index()`.
59+
//
60+
// Client/server editing does not work on an unindexed Table.
61+
const arrow = await server_view.to_arrow();
62+
const client_table = await worker.table(arrow, { index: "Row ID" });
63+
const client_view = await client_table.view(); // client -> server
6564

66-
await viewer.load(Promise.resolve(client_table));
65+
await viewer.load(Promise.resolve(client_table));
6766

68-
// Create ports on both the client and the server - this allows
69-
// the client and server to track which updates are coming from
70-
// the server, and which edits are coming from the client
71-
// in the browser.
72-
const client_edit_port = await viewer.getEditPort();
73-
const server_edit_port = await server_table.make_port();
67+
// Create ports on both the client and the server - this allows
68+
// the client and server to track which updates are coming from
69+
// the server, and which edits are coming from the client
70+
// in the browser.
71+
const client_edit_port = await viewer.getEditPort();
72+
const server_edit_port = await server_table.make_port();
7473

75-
// When the client updates, if the update comes through the edit
76-
// port then forward it to the server.
77-
client_view.on_update(
78-
(updated) => {
79-
if (updated.port_id === client_edit_port) {
80-
// `update` must be on the `server_edit_port`
81-
server_table.update(updated.delta, {
82-
port_id: server_edit_port,
83-
});
84-
}
85-
},
86-
{ mode: "row" }
87-
);
74+
// When the client updates, if the update comes through the edit
75+
// port then forward it to the server.
76+
client_view.on_update(
77+
(updated) => {
78+
if (updated.port_id === client_edit_port) {
79+
// `update` must be on the `server_edit_port`
80+
server_table.update(updated.delta, {
81+
port_id: server_edit_port,
82+
});
83+
}
84+
},
85+
{ mode: "row" }
86+
);
8887

89-
// If the server updates, and the edit is not coming from the
90-
// server edit port, then synchronize state with the client.
91-
server_view.on_update(
92-
(updated) => {
93-
if (updated.port_id !== server_edit_port) {
94-
// any port, we don't care
95-
client_table.update(updated.delta);
96-
}
97-
},
98-
{ mode: "row" }
99-
);
100-
});
88+
// If the server updates, and the edit is not coming from the
89+
// server edit port, then synchronize state with the client.
90+
server_view.on_update(
91+
(updated) => {
92+
if (updated.port_id !== server_edit_port) {
93+
// any port, we don't care
94+
client_table.update(updated.delta);
95+
}
96+
},
97+
{ mode: "row" }
98+
);
10199
</script>
102100
</body>
103101
</html>

‎examples/python-tornado/index.html‎

Lines changed: 13 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -26,23 +26,19 @@
2626
<script type="module">
2727
import perspective from "/node_modules/@finos/perspective/dist/cdn/perspective.js";
2828

29-
window.addEventListener("DOMContentLoaded", async function () {
30-
/**
31-
* `perspective.websocket` connects to a remote Perspective server
32-
* that accepts WebSocket connections at the specified URL.
33-
*
34-
* Use `perspective.websocket` to set up Perspective in server or
35-
* distributed modes.
36-
*/
37-
const websocket = await perspective.websocket("ws://localhost:8080/websocket");
38-
39-
const server_table = await websocket.open_table("data_source_one");
40-
41-
// const table = worker.table(server_table);
42-
43-
// Load the local table in the `<perspective-viewer>`.
44-
document.getElementById("viewer").load(server_table);
45-
});
29+
/**
30+
* `perspective.websocket` connects to a remote Perspective server
31+
* that accepts WebSocket connections at the specified URL.
32+
*
33+
* Use `perspective.websocket` to set up Perspective in server or
34+
* distributed modes.
35+
*/
36+
const websocket = await perspective.websocket("ws://localhost:8080/websocket");
37+
const server_table = await websocket.open_table("data_source_one");
38+
// const table = worker.table(server_table);
39+
40+
// Load the local table in the `<perspective-viewer>`.
41+
document.getElementById("viewer").load(server_table);
4642
</script>
4743
</body>
4844
</html>

‎examples/python-tornado/server_mode.html‎

Lines changed: 8 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -27,16 +27,15 @@
2727
<script type="module">
2828
import perspective from "http://localhost:8080/node_modules/@finos/perspective-viewer@2.7.1/dist/cdn/perspective-viewer.js";
2929
const REQ = fetch("/node_modules/superstore-arrow/superstore.lz4.arrow");
30-
window.addEventListener("DOMContentLoaded", async function () {
31-
// Create a client that expects a Perspective server to accept
32-
// Websocket connections at the specified URL.
33-
const websocket = await perspective.websocket("ws://localhost:8082/websocket");
34-
const resp = await REQ;
35-
const arrow = await resp.arrayBuffer();
36-
const table = websocket.table(arrow);
3730

38-
document.getElementById("viewer").load(table);
39-
});
31+
// Create a client that expects a Perspective server to accept
32+
// Websocket connections at the specified URL.
33+
const websocket = await perspective.websocket("ws://localhost:8082/websocket");
34+
const resp = await REQ;
35+
const arrow = await resp.arrayBuffer();
36+
const table = websocket.table(arrow);
37+
38+
document.getElementById("viewer").load(table);
4039
</script>
4140
</body>
4241
</html>

‎examples/webpack-example/src/index.js‎

Lines changed: 6 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -24,11 +24,9 @@ import superstore from "superstore-arrow/superstore.lz4.arrow";
2424

2525
const worker = perspective.worker();
2626

27-
window.addEventListener("DOMContentLoaded", async () => {
28-
const viewer = document.createElement("perspective-viewer");
29-
document.body.append(viewer);
30-
31-
const table = worker.table(superstore);
32-
viewer.load(table);
33-
window.viewer = viewer;
34-
});
27+
const viewer = document.createElement("perspective-viewer");
28+
document.body.append(viewer);
29+
30+
const table = worker.table(superstore);
31+
viewer.load(table);
32+
window.viewer = viewer;

‎packages/perspective-viewer-datagrid/src/less/toolbar.less‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -130,7 +130,7 @@
130130
content: "";
131131
-webkit-mask-size: cover;
132132
mask-size: cover;
133-
background-color: var(--icon--color, #ccc);
133+
background-color: var(--icon--color);
134134
}
135135

136136
.button.editable:before,

rust/perspective-viewer/src/svg/bookmark-icon.svg renamed to packages/perspective-workspace/src/svg/bookmark-icon.svg

File renamed without changes.

‎packages/perspective-workspace/src/svg/drag-handle.svg‎

Lines changed: 10 additions & 0 deletions
Loading

0 commit comments

Comments
 (0)