- -+
${error.message}
+ ${JSON.stringify(metadata, null, 2)}
+ `;
+ });
- elements.aside.addEventListener('mouseover', () => (timeToLive = defaultTimeToLive));
+ try {
+ applyArrayPlugins();
- new FullScreenHandler(
- elements.minimizeFullScreenButton,
- elements.maximizeFullScreenButton,
- document.body
- );
+ const defaultTimeToLive = 3500;
+ const interval = 50;
+ let timeToLive = defaultTimeToLive;
+ setInterval(() => {
+ timeToLive = Math.max(0, timeToLive - interval);
+ elements.aside.style.opacity =
+ timeToLive == 0 && FullScreenHandler.isInFullScreenMode() ? '0' : '1';
+ }, interval);
+ elements.aside.addEventListener('mouseover', () => (timeToLive = defaultTimeToLive));
- const gpu = await initializeGPU();
+ new FullScreenHandler(
+ elements.minimizeFullScreenButton,
+ elements.maximizeFullScreenButton,
+ document.body
+ );
- let game: GameLoop | null = null;
+ const gpu = await initializeGPU();
+ let game: GameLoop | null = null;
- elements.restartButton.addEventListener('click', () => game?.destroy());
+ elements.restartButton.addEventListener('click', () => game?.destroy());
- while (true) {
- try {
+ while (true) {
game = new GameLoop(elements.canvas, gpu);
await game.start();
- } catch (e) {
- elements.errorContainer.innerHTML = e.message;
}
+ } catch (e) {
+ ErrorHandler.addError(Severity.ERROR, e.message);
}
};
diff --git a/src/utils/error-handler.ts b/src/utils/error-handler.ts
new file mode 100644
index 0000000..e13a006
--- /dev/null
+++ b/src/utils/error-handler.ts
@@ -0,0 +1,45 @@
+export enum Severity {
+ INFO = 'info',
+ WARNING = 'warning',
+ ERROR = 'error',
+}
+
+export interface ErrorHandlerError {
+ severity: Severity;
+ message: string;
+}
+
+export type ErrorMetadata = { [key: string]: any };
+
+export class ErrorHandler {
+ private static readonly errors: Array = [];
+ private static metadata: ErrorMetadata = {};
+ private static onErrorListeners: Array<
+ (error: ErrorHandlerError, metadata: ErrorMetadata) => void
+ > = [];
+
+ public static addException(exception: Error) {
+ ErrorHandler.addError(Severity.ERROR, exception.message);
+ }
+
+ public static addError(severity: Severity, message: string) {
+ ErrorHandler.errors.push({ severity, message });
+ ErrorHandler.onErrorListeners.forEach((listener) =>
+ listener({ severity, message }, ErrorHandler.metadata)
+ );
+ }
+
+ public static addMetadata(key: string, value: any) {
+ const serialized = {};
+ for (const k in value) {
+ serialized[k] = value[k];
+ }
+ ErrorHandler.metadata[key] = serialized;
+ }
+
+ public static addOnErrorListener(
+ listener: (error: ErrorHandlerError, metadata: ErrorMetadata) => void
+ ) {
+ ErrorHandler.onErrorListeners.push(listener);
+ }
+}
diff --git a/src/utils/graphics/initialize-gpu.ts b/src/utils/graphics/initialize-gpu.ts
index 54a63ef..ba16e1d 100644
--- a/src/utils/graphics/initialize-gpu.ts
+++ b/src/utils/graphics/initialize-gpu.ts
@@ -1,7 +1,9 @@
+import { ErrorHandler, Severity } from '../error-handler';
+
export const initializeGPU = async (): Promise => {
const gpu = navigator.gpu;
if (!gpu) {
- throw new Error('WebGPU is not supported');
+ throw new Error('WebGPU is not supported in your browser');
}
const adapter = await gpu.requestAdapter({
@@ -12,5 +14,15 @@ export const initializeGPU = async (): Promise => {
throw new Error('Could not request adatper');
}
- return await adapter.requestDevice(); // could request more resources
+ ErrorHandler.addMetadata('adapter', await adapter.requestAdapterInfo());
+ ErrorHandler.addMetadata('features', adapter.features);
+ ErrorHandler.addMetadata('limits', adapter.limits);
+
+ const gpuDevice = await adapter.requestDevice(); // could request more resources
+
+ gpuDevice.addEventListener('uncapturederror', (event: GPUUncapturedErrorEvent) =>
+ ErrorHandler.addError(Severity.ERROR, event.error.message)
+ );
+
+ return gpuDevice;
};
diff --git a/src/utils/graphics/smart-compile.ts b/src/utils/graphics/smart-compile.ts
index 877afa0..275969b 100644
--- a/src/utils/graphics/smart-compile.ts
+++ b/src/utils/graphics/smart-compile.ts
@@ -1,3 +1,5 @@
+import { ErrorHandler, Severity } from '../error-handler';
+
export const smartCompile = (device: GPUDevice, ...code: Array) => {
const concatenated = code.join('\n\n');
@@ -5,17 +7,18 @@ export const smartCompile = (device: GPUDevice, ...code: Array) => {
code: concatenated,
});
- module
- .getCompilationInfo()
- .then((info) =>
- info.messages.forEach((message) =>
- console.warn(
- message.type,
- message.message,
- concatenated.split('\n')[message.lineNum - 1]
- )
+ module.getCompilationInfo().then((info) =>
+ info.messages.forEach((message) =>
+ ErrorHandler.addError(
+ {
+ info: Severity.INFO,
+ warning: Severity.WARNING,
+ error: Severity.ERROR,
+ }[message.type],
+ `${message.message}\n${concatenated.split('\n')[message.lineNum - 1]}`
)
- );
+ )
+ );
return module;
};