diff --git a/index.html b/index.html
index b8eea291..08285632 100644
--- a/index.html
+++ b/index.html
@@ -60,6 +60,9 @@
// props.setFullScreen(true);
}
},
+ // renderAspect: "1/1",
+ // renderBackend: "webgl",
+ // imageRendering: "smooth",
});
});
diff --git a/package.json b/package.json
index d6ef543e..a5ffe40b 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "js-dos",
- "version": "8.1.14",
+ "version": "8.1.15",
"description": "Full-featured DOS player with multiple emulator backends",
"type": "module",
"keywords": [
diff --git a/src/main.tsx b/src/main.tsx
index 53b7c98d..025a5329 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -3,7 +3,7 @@ import "./index.css";
import { Provider } from "react-redux";
import { Ui } from "./ui";
-import { dosSlice } from "./store/dos";
+import { dosSlice, RenderAspect } from "./store/dos";
import { initEmulators } from "./store/dos";
// eslint-disable-next-line
import { uiSlice } from "./store/ui";
@@ -11,7 +11,7 @@ import { i18nSlice } from "./i18n";
import { getCache } from "./host/lcache";
import { loadBundleFromConfg, loadBundleFromUrl } from "./load";
-import { DosOptions, DosProps, DosFn } from "./public/types";
+import { DosOptions, DosProps, DosFn, ImageRendering, RenderBackend } from "./public/types";
import { browserSetFullScreen } from "./host/fullscreen";
import { NonSerializableStore, Store, makeNonSerializableStore, makeStore, postJsDosEvent } from "./store";
import { authSlice } from "./store/auth";
@@ -122,6 +122,18 @@ export const Dos: DosFn = (element: HTMLDivElement,
store.dispatch(uiSlice.actions.kiosk(kiosk));
}
+ function setImageRendering(imageRendering: ImageRendering) {
+ store.dispatch(dosSlice.actions.imageRendering(imageRendering));
+ }
+
+ function setRenderBackend(backend: RenderBackend) {
+ store.dispatch(dosSlice.actions.renderBackend(backend));
+ }
+
+ function setRenderAspect(aspect: RenderAspect) {
+ store.dispatch(dosSlice.actions.renderAspect(aspect));
+ }
+
if (options.theme) {
setTheme(options.theme);
}
@@ -174,6 +186,18 @@ export const Dos: DosFn = (element: HTMLDivElement,
setKiosk(options.kiosk);
}
+ if (options.imageRendering !== undefined) {
+ setImageRendering(options.imageRendering);
+ }
+
+ if (options.renderBackend !== undefined) {
+ setRenderBackend(options.renderBackend);
+ }
+
+ if (options.renderAspect !== undefined) {
+ setRenderAspect(options.renderAspect);
+ }
+
render(
{ as any}
@@ -195,6 +219,9 @@ export const Dos: DosFn = (element: HTMLDivElement,
setFullScreen,
setAutoStart,
setKiosk,
+ setImageRendering,
+ setRenderBackend,
+ setRenderAspect,
};
};
diff --git a/src/public/types.ts b/src/public/types.ts
index c044e496..6548d770 100644
--- a/src/public/types.ts
+++ b/src/public/types.ts
@@ -1,4 +1,7 @@
export type DosEvent = "emu-ready" | "ci-ready" | "bnd-play";
+export type ImageRendering = "pixelated" | "smooth";
+export type RenderBackend = "webgl" | "canvas";
+export type RenderAspect = "AsIs" | "1/1" | "5/4" | "4/3" | "16/10" | "16/9" | "Fit";
export interface DosOptions {
url: string,
@@ -27,6 +30,9 @@ export interface DosOptions {
loginUrl: string,
autoStart: boolean,
kiosk: boolean,
+ imageRendering: ImageRendering,
+ renderBackend: RenderBackend,
+ renderAspect: RenderAspect,
}
export interface DosProps {
@@ -43,6 +49,9 @@ export interface DosProps {
setFullScreen(fullScreen: boolean): void;
setAutoStart(autoStart: boolean): void;
setKiosk(kiosk: boolean): void;
+ setImageRendering(rendering: ImageRendering): void;
+ setRenderBackend(backend: RenderBackend): void;
+ setRenderAspect(aspect: RenderAspect): void;
}
export type DosFn = (element: HTMLDivElement, options: Partial) => DosProps;