Skip to content

Commit cb17fb7

Browse files
authored
Merge pull request #6 from halcyon-tech/feature/scrolling_results
Feature/scrolling results
2 parents 10175db + cbb2666 commit cb17fb7

File tree

5 files changed

+275
-112
lines changed

5 files changed

+275
-112
lines changed

global.d.ts

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,4 +24,10 @@ interface SQLParm {
2424
IS_NULLABLE: "Y" | "N",
2525
DEFAULT?: string,
2626
LONG_COMMENT?: string
27+
}
28+
29+
interface StatementInfo {
30+
content: string,
31+
type: "statement"|"json"|"csv"|"cl"|"sql",
32+
open?: boolean
2733
}

package.json

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -131,13 +131,13 @@
131131
{
132132
"command": "vscode-db2i.generateSQL",
133133
"title": "Generate SQL",
134-
"category": "Db2 for i",
135-
"icon": "$(add)"
134+
"category": "Db2 for i"
136135
},
137136
{
138-
"command": "vscode-db2i.generateSelect",
139-
"title": "Generate SELECT",
140-
"category": "Db2 for i"
137+
"command": "vscode-db2i.getResultSet",
138+
"title": "View contents",
139+
"category": "Db2 for i",
140+
"icon": "$(output)"
141141
},
142142
{
143143
"command": "vscode-db2i.setCurrentSchema",
@@ -195,9 +195,9 @@
195195
"group": "db2@1"
196196
},
197197
{
198-
"command": "vscode-db2i.generateSelect",
198+
"command": "vscode-db2i.getResultSet",
199199
"when": "viewItem == table || viewItem == view || viewItem == alias",
200-
"group": "db2@1"
200+
"group": "inline"
201201
},
202202
{
203203
"command": "vscode-db2i.generateSQL",

src/language/results/html.js

Lines changed: 97 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -68,6 +68,103 @@ exports.getLoadingHTML = () => {
6868
`;
6969
}
7070

71+
/**
72+
*
73+
* @param {string} basicSelect
74+
* @returns {string}
75+
*/
76+
exports.generateScroller = (basicSelect) => {
77+
return /*html*/ `
78+
<!DOCTYPE html>
79+
<html lang="en">
80+
<head>
81+
${head}
82+
<script>
83+
const vscode = acquireVsCodeApi();
84+
const basicSelect = ${JSON.stringify(basicSelect)};
85+
const limit = 50;
86+
87+
let nextOffset = 0;
88+
let noMoreRows = false;
89+
let isFetching = false;
90+
91+
window.addEventListener("load", main);
92+
function main() {
93+
let Observer = new IntersectionObserver(function(entries) {
94+
// isIntersecting is true when element and viewport are overlapping
95+
// isIntersecting is false when element and viewport don't overlap
96+
if(entries[0].isIntersecting === true) {
97+
if (isFetching === false && noMoreRows === false) {
98+
fetchNextPage();
99+
}
100+
}
101+
}, { threshold: [0] });
102+
103+
Observer.observe(document.getElementById("nextButton"));
104+
105+
window.addEventListener('message', event => {
106+
const scroller = document.getElementById("scroller");
107+
const data = event.data;
108+
109+
switch (data.command) {
110+
case 'rows':
111+
112+
isFetching = false;
113+
114+
if (scroller.columnDefinitions.length === 0) {
115+
scroller.columnDefinitions = Object.keys(data.rows[0]).map(col => ({
116+
title: col,
117+
columnDataKey: col,
118+
}));
119+
}
120+
121+
if (scroller.rowsData.length > 0) {
122+
scroller.rowsData = [...scroller.rowsData, ...data.rows];
123+
} else {
124+
scroller.rowsData = data.rows;
125+
}
126+
127+
console.log('row check');
128+
if (data.rows.length < limit) {
129+
console.log("No more rows");
130+
noMoreRows = true;
131+
}
132+
133+
const nextButton = document.getElementById("nextButton");
134+
nextButton.innerText = noMoreRows ? 'End of data' : 'Fetching more...';
135+
break;
136+
137+
case 'fetch':
138+
scroller.columnDefinitions = [];
139+
scroller.rowsData = [];
140+
nextOffset = 0;
141+
fetchNextPage();
142+
break;
143+
}
144+
});
145+
}
146+
147+
function fetchNextPage() {
148+
isFetching = true;
149+
vscode.postMessage({
150+
query: basicSelect,
151+
limit,
152+
offset: nextOffset,
153+
});
154+
155+
nextOffset += limit;
156+
}
157+
</script>
158+
</head>
159+
<body>
160+
<vscode-data-grid id="scroller"></vscode-data-grid>
161+
<vscode-divider></vscode-divider>
162+
<p id="nextButton">Execute statement.</p>
163+
</body>
164+
</html>
165+
`;
166+
}
167+
71168
/**
72169
*
73170
* @param {object[]} rows

0 commit comments

Comments
 (0)