From 6c8f2d780acd6c41d42de6b5fc8d84e765334b64 Mon Sep 17 00:00:00 2001 From: Matthias Schiffer Date: Tue, 17 Mar 2020 18:43:22 +0100 Subject: Prepare for editor implementation - Add React and Material UI - Add React Developer Tools - Add ESlint plugin and config --- src/main/index.ts | 17 ++++++++++++++++- src/renderer/editor/editor.tsx | 10 ++++++++++ src/renderer/index.html | 1 + src/renderer/index.ts | 27 --------------------------- src/renderer/index.tsx | 8 ++++++++ 5 files changed, 35 insertions(+), 28 deletions(-) create mode 100644 src/renderer/editor/editor.tsx delete mode 100644 src/renderer/index.ts create mode 100644 src/renderer/index.tsx (limited to 'src') diff --git a/src/main/index.ts b/src/main/index.ts index be494a4..68ae000 100644 --- a/src/main/index.ts +++ b/src/main/index.ts @@ -1,10 +1,17 @@ import { app, BrowserWindow } from 'electron'; + declare const MAIN_WINDOW_WEBPACK_ENTRY: string; const isDevelopment = process.env.NODE_ENV !== 'production'; app.allowRendererProcessReuse = true; +async function installReactDevTools(): Promise { + const { default: installExtension, REACT_DEVELOPER_TOOLS } = await import('electron-devtools-installer'); + const name = await installExtension(REACT_DEVELOPER_TOOLS); + console.log(`Added Extension: ${name}`); +} + function createWindow(): void { const window = new BrowserWindow({ webPreferences: { nodeIntegration: true } }); @@ -36,5 +43,13 @@ app.on('activate', () => { } }); +async function initialize(): Promise { + if (isDevelopment) { + await installReactDevTools(); + } + + createWindow(); +} + // create main BrowserWindow when electron is ready -app.on('ready', createWindow); +app.on('ready', initialize); diff --git a/src/renderer/editor/editor.tsx b/src/renderer/editor/editor.tsx new file mode 100644 index 0000000..fd8360a --- /dev/null +++ b/src/renderer/editor/editor.tsx @@ -0,0 +1,10 @@ +import * as React from 'react'; +import Button from '@material-ui/core/Button'; + +export function Editor(): JSX.Element { + return ( + + ); +} diff --git a/src/renderer/index.html b/src/renderer/index.html index 5bd9d1f..e775d3e 100644 --- a/src/renderer/index.html +++ b/src/renderer/index.html @@ -3,6 +3,7 @@ + RPGedit diff --git a/src/renderer/index.ts b/src/renderer/index.ts deleted file mode 100644 index 490dbef..0000000 --- a/src/renderer/index.ts +++ /dev/null @@ -1,27 +0,0 @@ -import './runtime/index.css'; - -import { GameContext } from './runtime/controller/gamecontext'; - -import { Renderer } from './runtime/view/renderer/renderer'; - -window.onload = async (): Promise => { - const app = document.getElementById('app'); - if (!app) return; - - const canvas = document.createElement('canvas'); - const renderer = new Renderer(canvas); - - const resize = (): void => { - canvas.width = window.innerWidth; - canvas.height = window.innerHeight; - renderer.resize(); - }; - window.addEventListener('resize', resize); - resize(); - - app.append(canvas); - - GameContext.load(renderer); -}; - -module.hot?.accept(); diff --git a/src/renderer/index.tsx b/src/renderer/index.tsx new file mode 100644 index 0000000..2920265 --- /dev/null +++ b/src/renderer/index.tsx @@ -0,0 +1,8 @@ +import * as React from 'react'; +import * as ReactDOM from 'react-dom'; + +import { Editor } from './editor/editor'; + +ReactDOM.render(, document.querySelector('#app')); + +module.hot?.accept(); -- cgit v1.2.3