mirror of
https://github.com/openfrontio/OpenFrontIO.git
synced 2026-06-25 17:54:37 +00:00
switched to pastel theme, improved it
This commit is contained in:
@@ -5,8 +5,7 @@ import {PseudoRandom} from "../core/PseudoRandom";
|
||||
import {GameID, Lobby, ServerMessage, ServerMessageSchema} from "../core/Schemas";
|
||||
import {loadTerrainMap, TerrainMap} from "../core/TerrainMapLoader";
|
||||
import {ClientGame, createClientGame} from "./ClientGame";
|
||||
import {v4 as uuidv4} from 'uuid';
|
||||
import backgroundImage from '../../resources/images/VintageMap2.png';
|
||||
import backgroundImage from '../../resources/images/PastelMap.png';
|
||||
import favicon from '../../resources/images/Favicon.png';
|
||||
|
||||
import './styles.css';
|
||||
|
||||
@@ -6,7 +6,7 @@ import {NameRenderer} from "./NameRenderer";
|
||||
import {bfs, manhattanDist} from "../../core/Util";
|
||||
import {PseudoRandom} from "../../core/PseudoRandom";
|
||||
import {TerrainRenderer} from "./TerrainRenderer";
|
||||
import {MaxPriorityQueue, PriorityQueue} from "@datastructures-js/priority-queue";
|
||||
import {PriorityQueue} from "@datastructures-js/priority-queue";
|
||||
|
||||
export class GameRenderer {
|
||||
private territoryCanvas: HTMLCanvasElement
|
||||
@@ -20,16 +20,13 @@ export class GameRenderer {
|
||||
|
||||
private context: CanvasRenderingContext2D
|
||||
|
||||
|
||||
private nameRenderer: NameRenderer;
|
||||
private theme: Theme
|
||||
|
||||
private random = new PseudoRandom(123)
|
||||
|
||||
|
||||
private tileToRenderQueue: PriorityQueue<{tileEvent: TileEvent, lastUpdate: number}> = new PriorityQueue((a, b) => {return a.lastUpdate - b.lastUpdate})
|
||||
|
||||
|
||||
constructor(private gs: Game, private terrainRenderer: TerrainRenderer) {
|
||||
this.theme = gs.config().theme()
|
||||
this.nameRenderer = new NameRenderer(gs, this.theme)
|
||||
@@ -70,13 +67,10 @@ export class GameRenderer {
|
||||
}
|
||||
|
||||
renderGame() {
|
||||
// Clear the canvas
|
||||
this.context.setTransform(1, 0, 0, 1, 0, 0);
|
||||
this.context.clearRect(0, 0, this.gs.width(), this.gs.height());
|
||||
|
||||
// Set background
|
||||
this.context.fillStyle = this.theme.backgroundColor().toHex();
|
||||
this.context.fillRect(0, 0, this.gs.width(), this.gs.height());
|
||||
this.context.fillRect(0, 0, this.canvas.width, this.canvas.height);
|
||||
|
||||
// Save the current context state
|
||||
this.context.save();
|
||||
|
||||
@@ -10,6 +10,7 @@
|
||||
<body>
|
||||
<div class="content">
|
||||
<h1>OpenFront.io</h1>
|
||||
<h2>(v0.01)</h2>
|
||||
<div id="username-container">
|
||||
<input type="text" id="username" placeholder="Enter your username">
|
||||
</div>
|
||||
@@ -20,7 +21,7 @@
|
||||
<div id="player-count" class="player-count"></div>
|
||||
</button>
|
||||
</div>
|
||||
<div id="dev-log">
|
||||
<!-- <div id="dev-log">
|
||||
<h4>DEVLOG: 8/18/2024 - 8/26/2024</h4>
|
||||
<ul id="dev-log">
|
||||
<li>Create dev server at <a href="https://www.openfront.dev">openfront.dev</a></li>
|
||||
@@ -42,7 +43,7 @@
|
||||
<li>Can respawn at start of game</li>
|
||||
<li>Added spawn timer</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
|
||||
<style>
|
||||
|
||||
+11
-1
@@ -34,6 +34,14 @@ h1 {
|
||||
text-align: center;
|
||||
color: #2e2e2e;
|
||||
font-size: 8em;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-family: Arial, serif;
|
||||
text-align: center;
|
||||
color: #2e2e2e;
|
||||
font-size: 4em;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
@@ -44,10 +52,12 @@ h1 {
|
||||
#username {
|
||||
width: 100%;
|
||||
padding: 15px;
|
||||
font-size: 24px;
|
||||
font-size: 30px;
|
||||
text-align: center;
|
||||
border: 2px solid #007bff;
|
||||
border-radius: 5px;
|
||||
background-color: rgba(255, 255, 255, 0.8);
|
||||
margin: 30px auto;
|
||||
}
|
||||
|
||||
#lobbies-container {
|
||||
|
||||
Reference in New Issue
Block a user