@polyguard/sdk 1.0.4 → 1.0.8
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/dist/sdk.js +39 -4
- package/package.json +1 -1
- package/src/PolyguardWebsocketClientImpl.js +49 -4
package/dist/sdk.js
CHANGED
|
@@ -11006,13 +11006,13 @@
|
|
|
11006
11006
|
<button id="polyguard-modal-cancel" style="background: #7be7c2; color: #222; font-weight: 600; border-radius: 8px; border: none; padding: 10px 32px; font-size: 16px; cursor: pointer; margin-top: 8px; width: 100%; max-width: 240px;">Cancel</button>
|
|
11007
11007
|
</div>
|
|
11008
11008
|
`;
|
|
11009
|
-
document.body.appendChild(modal);
|
|
11010
11009
|
function cleanup() {
|
|
11011
11010
|
if (modal.parentNode) modal.parentNode.removeChild(modal);
|
|
11012
11011
|
}
|
|
11013
11012
|
return new Promise(async (resolve, reject) => {
|
|
11014
11013
|
let ws = null;
|
|
11015
11014
|
let closed = false;
|
|
11015
|
+
let modalShown = false;
|
|
11016
11016
|
function showError(msg) {
|
|
11017
11017
|
const errDiv = modal.querySelector("#polyguard-error");
|
|
11018
11018
|
if (errDiv) {
|
|
@@ -11030,8 +11030,11 @@
|
|
|
11030
11030
|
cleanup();
|
|
11031
11031
|
reject(new Error("User cancelled"));
|
|
11032
11032
|
}
|
|
11033
|
-
|
|
11034
|
-
|
|
11033
|
+
function showModal() {
|
|
11034
|
+
document.body.appendChild(modal);
|
|
11035
|
+
modal.querySelector("#polyguard-modal-close").onclick = handleClose;
|
|
11036
|
+
modal.querySelector("#polyguard-modal-cancel").onclick = handleClose;
|
|
11037
|
+
}
|
|
11035
11038
|
try {
|
|
11036
11039
|
clearError();
|
|
11037
11040
|
const wsProtocol = window.location.protocol === "https:" ? "wss" : "ws";
|
|
@@ -11063,7 +11066,15 @@
|
|
|
11063
11066
|
window.location.assign(data.url);
|
|
11064
11067
|
return;
|
|
11065
11068
|
} else if (data && data.qr_url) {
|
|
11066
|
-
|
|
11069
|
+
if (!modalShown) {
|
|
11070
|
+
showModal();
|
|
11071
|
+
modalShown = true;
|
|
11072
|
+
}
|
|
11073
|
+
const pcre = data.qr_url.match(/pcre=([^&]*)/);
|
|
11074
|
+
console.log("pcre", pcre);
|
|
11075
|
+
if (pcre) {
|
|
11076
|
+
ws.send(JSON.stringify({ type: "pong", seq: pcre[1] }));
|
|
11077
|
+
}
|
|
11067
11078
|
const qrDiv = modal.querySelector("#polyguard-qr");
|
|
11068
11079
|
if (!qrDiv) return;
|
|
11069
11080
|
const isMobile = /Mobi|Android/i.test(navigator.userAgent);
|
|
@@ -11080,9 +11091,12 @@
|
|
|
11080
11091
|
instructionList.children[1].textContent = "If you do not have the Polyguard app, you will be redirected to download it.";
|
|
11081
11092
|
}
|
|
11082
11093
|
} else {
|
|
11094
|
+
const startTime = Date.now();
|
|
11095
|
+
console.log("time before qr code", startTime);
|
|
11083
11096
|
import_qrcode.default.toString(data.qr_url, { type: "svg" }, (err, svg) => {
|
|
11084
11097
|
if (!err) qrDiv.innerHTML = svg;
|
|
11085
11098
|
});
|
|
11099
|
+
console.log("time to generate qr code", Date.now() - startTime);
|
|
11086
11100
|
}
|
|
11087
11101
|
return;
|
|
11088
11102
|
} else if (data && data.jwt) {
|
|
@@ -11091,8 +11105,28 @@
|
|
|
11091
11105
|
ws.close();
|
|
11092
11106
|
return;
|
|
11093
11107
|
} else if (data && data.status) {
|
|
11108
|
+
const qrDiv = modal.querySelector("#polyguard-qr");
|
|
11109
|
+
if (!qrDiv) return;
|
|
11110
|
+
const spinner = `<svg xmlns="http://www.w3.org/2000/svg" width="200" height="200" viewBox="0 0 200 200" fill="none">
|
|
11111
|
+
<style>
|
|
11112
|
+
.spinner-circle {
|
|
11113
|
+
animation: spin 1s linear infinite;
|
|
11114
|
+
transform-origin: 100px 100px;
|
|
11115
|
+
}
|
|
11116
|
+
@keyframes spin {
|
|
11117
|
+
from { transform: rotate(0deg); }
|
|
11118
|
+
to { transform: rotate(360deg); }
|
|
11119
|
+
}
|
|
11120
|
+
</style>
|
|
11121
|
+
<circle cx="100" cy="100" r="80" stroke="#e0e0e0" stroke-width="8" fill="none" />
|
|
11122
|
+
<circle cx="100" cy="100" r="80" stroke="#7be7c2" stroke-width="8" fill="none"
|
|
11123
|
+
stroke-dasharray="251.2" stroke-dashoffset="188.4"
|
|
11124
|
+
class="spinner-circle" stroke-linecap="round" />
|
|
11125
|
+
</svg>`;
|
|
11126
|
+
qrDiv.innerHTML = spinner;
|
|
11094
11127
|
return;
|
|
11095
11128
|
} else {
|
|
11129
|
+
console.error("Unknown message type from server", data);
|
|
11096
11130
|
showError(`Unknown message type from server`);
|
|
11097
11131
|
}
|
|
11098
11132
|
} catch (e) {
|
|
@@ -11101,6 +11135,7 @@
|
|
|
11101
11135
|
}
|
|
11102
11136
|
});
|
|
11103
11137
|
ws.addEventListener("error", () => {
|
|
11138
|
+
console.error("WebSocket error");
|
|
11104
11139
|
showError("WebSocket error");
|
|
11105
11140
|
});
|
|
11106
11141
|
ws.addEventListener("close", () => {
|
package/package.json
CHANGED
|
@@ -64,15 +64,18 @@ export class PolyguardWebsocketClientImpl {
|
|
|
64
64
|
<button id="polyguard-modal-cancel" style="background: #7be7c2; color: #222; font-weight: 600; border-radius: 8px; border: none; padding: 10px 32px; font-size: 16px; cursor: pointer; margin-top: 8px; width: 100%; max-width: 240px;">Cancel</button>
|
|
65
65
|
</div>
|
|
66
66
|
`;
|
|
67
|
-
|
|
67
|
+
|
|
68
68
|
// Helper to cleanup modal
|
|
69
69
|
function cleanup() {
|
|
70
70
|
if (modal.parentNode) modal.parentNode.removeChild(modal);
|
|
71
71
|
}
|
|
72
|
+
|
|
72
73
|
// Promise for JWT
|
|
73
74
|
return new Promise(async (resolve, reject) => {
|
|
74
75
|
let ws = null;
|
|
75
76
|
let closed = false;
|
|
77
|
+
let modalShown = false;
|
|
78
|
+
|
|
76
79
|
function showError(msg) {
|
|
77
80
|
const errDiv = modal.querySelector('#polyguard-error');
|
|
78
81
|
if (errDiv) {
|
|
@@ -91,8 +94,15 @@ export class PolyguardWebsocketClientImpl {
|
|
|
91
94
|
cleanup();
|
|
92
95
|
reject(new Error('User cancelled'));
|
|
93
96
|
}
|
|
94
|
-
|
|
95
|
-
modal
|
|
97
|
+
|
|
98
|
+
// Helper to show modal (only called when QR code is received)
|
|
99
|
+
function showModal() {
|
|
100
|
+
document.body.appendChild(modal);
|
|
101
|
+
// Set up close/cancel handlers after modal is in DOM
|
|
102
|
+
modal.querySelector('#polyguard-modal-close').onclick = handleClose;
|
|
103
|
+
modal.querySelector('#polyguard-modal-cancel').onclick = handleClose;
|
|
104
|
+
}
|
|
105
|
+
|
|
96
106
|
// Start ticket/ws flow
|
|
97
107
|
try {
|
|
98
108
|
clearError();
|
|
@@ -127,7 +137,17 @@ export class PolyguardWebsocketClientImpl {
|
|
|
127
137
|
window.location.assign(data.url);
|
|
128
138
|
return;
|
|
129
139
|
} else if (data && data.qr_url) {
|
|
130
|
-
|
|
140
|
+
// Show modal only when QR code is received
|
|
141
|
+
if (!modalShown) {
|
|
142
|
+
showModal();
|
|
143
|
+
modalShown = true;
|
|
144
|
+
}
|
|
145
|
+
|
|
146
|
+
const pcre = data.qr_url.match(/pcre=([^&]*)/);
|
|
147
|
+
console.log('pcre', pcre);
|
|
148
|
+
if (pcre) {
|
|
149
|
+
ws.send(JSON.stringify({ type: 'pong', seq: pcre[1] }));
|
|
150
|
+
}
|
|
131
151
|
|
|
132
152
|
const qrDiv = modal.querySelector('#polyguard-qr');
|
|
133
153
|
if (!qrDiv) return;
|
|
@@ -150,10 +170,13 @@ export class PolyguardWebsocketClientImpl {
|
|
|
150
170
|
instructionList.children[1].textContent = 'If you do not have the Polyguard app, you will be redirected to download it.';
|
|
151
171
|
}
|
|
152
172
|
} else {
|
|
173
|
+
const startTime = Date.now();
|
|
174
|
+
console.log('time before qr code', startTime);
|
|
153
175
|
// For desktop, display the QR code
|
|
154
176
|
QRCode.toString(data.qr_url, { type: 'svg' }, (err, svg) => {
|
|
155
177
|
if (!err) qrDiv.innerHTML = svg;
|
|
156
178
|
});
|
|
179
|
+
console.log('time to generate qr code', Date.now() - startTime);
|
|
157
180
|
}
|
|
158
181
|
return;
|
|
159
182
|
} else if (data && data.jwt) {
|
|
@@ -163,8 +186,29 @@ export class PolyguardWebsocketClientImpl {
|
|
|
163
186
|
return;
|
|
164
187
|
} else if (data && data.status) {
|
|
165
188
|
// ignore
|
|
189
|
+
// generate a spinner in svg and set the qr code to it
|
|
190
|
+
const qrDiv = modal.querySelector('#polyguard-qr');
|
|
191
|
+
if (!qrDiv) return;
|
|
192
|
+
const spinner = `<svg xmlns="http://www.w3.org/2000/svg" width="200" height="200" viewBox="0 0 200 200" fill="none">
|
|
193
|
+
<style>
|
|
194
|
+
.spinner-circle {
|
|
195
|
+
animation: spin 1s linear infinite;
|
|
196
|
+
transform-origin: 100px 100px;
|
|
197
|
+
}
|
|
198
|
+
@keyframes spin {
|
|
199
|
+
from { transform: rotate(0deg); }
|
|
200
|
+
to { transform: rotate(360deg); }
|
|
201
|
+
}
|
|
202
|
+
</style>
|
|
203
|
+
<circle cx="100" cy="100" r="80" stroke="#e0e0e0" stroke-width="8" fill="none" />
|
|
204
|
+
<circle cx="100" cy="100" r="80" stroke="#7be7c2" stroke-width="8" fill="none"
|
|
205
|
+
stroke-dasharray="251.2" stroke-dashoffset="188.4"
|
|
206
|
+
class="spinner-circle" stroke-linecap="round" />
|
|
207
|
+
</svg>`;
|
|
208
|
+
qrDiv.innerHTML = spinner;
|
|
166
209
|
return;
|
|
167
210
|
} else {
|
|
211
|
+
console.error('Unknown message type from server', data);
|
|
168
212
|
showError(`Unknown message type from server`);
|
|
169
213
|
}
|
|
170
214
|
} catch (e) {
|
|
@@ -174,6 +218,7 @@ export class PolyguardWebsocketClientImpl {
|
|
|
174
218
|
}
|
|
175
219
|
});
|
|
176
220
|
ws.addEventListener('error', () => {
|
|
221
|
+
console.error('WebSocket error');
|
|
177
222
|
showError('WebSocket error');
|
|
178
223
|
});
|
|
179
224
|
ws.addEventListener('close', () => {
|