From 630bff0483f390b7bbad2bf4bbf30d93f6be80b1 Mon Sep 17 00:00:00 2001
From: HF
Date: Fri, 3 Jan 2020 03:21:57 +0100
Subject: [PATCH] move all react html generation to components folder
---
src/components/Admin.js | 14 ++++++++++--
src/components/Main.js | 46 ++++++++++++++++++++++++++++++++++++++++
src/routes/admintools.js | 17 ++-------------
src/web.js | 32 ++++++----------------------
4 files changed, 66 insertions(+), 43 deletions(-)
create mode 100644 src/components/Main.js
diff --git a/src/components/Admin.js b/src/components/Admin.js
index 37af0e4..b76249b 100644
--- a/src/components/Admin.js
+++ b/src/components/Admin.js
@@ -1,10 +1,13 @@
/*
- * react html for adminpage
+ * Html for adminpage
*
* @flow
*/
import React from 'react';
+import ReactDOM from 'react-dom/server';
+
+import Html from './Html';
const Admin = () => (
);
-export default Admin;
+const data = {
+ title: 'PixelPlanet.fun AdminTools',
+ description: 'admin access on pixelplanet',
+ body: ,
+};
+const adminHtml = `${ReactDOM.renderToStaticMarkup()}`;
+
+export default adminHtml;
diff --git a/src/components/Main.js b/src/components/Main.js
new file mode 100644
index 0000000..9c873e9
--- /dev/null
+++ b/src/components/Main.js
@@ -0,0 +1,46 @@
+/*
+ * Html for mainpage
+ *
+ * @flow
+ */
+
+
+import React from 'react';
+import ReactDOM from 'react-dom/server';
+
+import Html from './Html';
+import assets from './assets.json';
+import { ASSET_SERVER } from '../core/config';
+
+const data = {
+ title: 'PixelPlanet.fun',
+ description: 'Place color pixels on an map styled canvas ' +
+ 'with other players online',
+ // styles: [
+ // { id: 'css', cssText: baseCss },
+ // ],
+ scripts: [
+ ASSET_SERVER + assets.vendor.js,
+ ASSET_SERVER + assets.client.js,
+ ],
+ useRecaptcha: true,
+};
+
+/*
+ * generates string with html of main page
+ * including setting global variables for countryCoords
+ * and assetserver
+ * @param countryCoords Cell with coordinates of client country
+ * @return html of mainpage
+ */
+function generateMainPage(countryCoords: Cell): string {
+ const [x, y] = countryCoords;
+ const code =
+ `window.coordx=${x};window.coordy=${y};window.assetserver="${ASSET_SERVER}";`;
+ const htmldata = { ...data, code };
+ const html = ReactDOM.renderToStaticMarkup(
);
+
+ return `${html}`;
+}
+
+export default generateMainPage;
diff --git a/src/routes/admintools.js b/src/routes/admintools.js
index 3f71db3..976d7df 100644
--- a/src/routes/admintools.js
+++ b/src/routes/admintools.js
@@ -11,8 +11,6 @@ import type { Request, Response } from 'express';
import bodyParser from 'body-parser';
import sharp from 'sharp';
import multer from 'multer';
-import React from 'react';
-import ReactDOM from 'react-dom/server';
import { getIPFromRequest } from '../utils/ip';
import { getIdFromObject } from '../core/utils';
@@ -26,23 +24,12 @@ import { MINUTE } from '../core/constants';
import canvases from '../canvases.json';
import { imageABGR2Canvas } from '../core/Image';
-import Html from '../components/Html';
-import Admin from '../components/Admin';
+import adminHtml from '../components/Admin';
const router = express.Router();
const limiter = expressLimiter(router, redis);
-/*
- * build html of admin page with react
- */
-const data = {
- title: 'PixelPlanet.fun AdminTools',
- description: 'admin access on pixelplanet',
- body: ,
-};
-const index = `${ReactDOM.renderToStaticMarkup(