enlarged font for panel titles
This commit is contained in:
1 parent
cf010c2cea
commit
43ee0d9150
3 files changed
+12
-5
No files matched your search
@@ -122,6 +122,7 @@ export const PLAYER_STARTING_TOOLS = [
|
|||||||
export const PANEL_WIDTH = 400;
|
export const PANEL_WIDTH = 400;
|
||||||
export const PANEL_HEIGHT = 300;
|
export const PANEL_HEIGHT = 300;
|
||||||
export const PANEL_FONT_SIZE = 10;
|
export const PANEL_FONT_SIZE = 10;
|
||||||
|
export const PANEL_TITLE_FONT_SIZE = 16;
|
||||||
export const PANEL_BG_COLOR = '#666';
|
export const PANEL_BG_COLOR = '#666';
|
||||||
export const PANEL_BORDER_COLOR = '#333';
|
export const PANEL_BORDER_COLOR = '#333';
|
||||||
|
|
||||||
|
|||||||
+3
-3
@@ -817,10 +817,10 @@ function drawMarketPanel() {
|
|||||||
drawPanelTitle(framebuffer, 'MARKET');
|
drawPanelTitle(framebuffer, 'MARKET');
|
||||||
|
|
||||||
const humanPlayer = players.find(p => !p.ai);
|
const humanPlayer = players.find(p => !p.ai);
|
||||||
drawPanelText(framebuffer, `Score: ${score}`, 160, 90, 'yellow');
|
drawPanelText(framebuffer, `Score: ${score}`, 160, 100, 'yellow');
|
||||||
|
|
||||||
const marketItems = Object.keys(MARKET_ITEMS);
|
const marketItems = Object.keys(MARKET_ITEMS);
|
||||||
const y = 110;
|
const y = 120;
|
||||||
const maxVisible = 8;
|
const maxVisible = 8;
|
||||||
|
|
||||||
for (let i=0; i<Math.min(maxVisible, marketItems.length); i++) {
|
for (let i=0; i<Math.min(maxVisible, marketItems.length); i++) {
|
||||||
@@ -878,7 +878,7 @@ function drawGameOverPanel() {
|
|||||||
drawPanelBg(framebuffer);
|
drawPanelBg(framebuffer);
|
||||||
drawPanelTitle(framebuffer, 'GAME OVER');
|
drawPanelTitle(framebuffer, 'GAME OVER');
|
||||||
|
|
||||||
const y = 90;
|
const y = 100;
|
||||||
const sortedPlayers = [...players].sort((a, b) => b.wins - a.wins || b.kills - a.kills);
|
const sortedPlayers = [...players].sort((a, b) => b.wins - a.wins || b.kills - a.kills);
|
||||||
|
|
||||||
for (let i=0; i<sortedPlayers.length; i++) {
|
for (let i=0; i<sortedPlayers.length; i++) {
|
||||||
|
|||||||
+8
-2
@@ -1,4 +1,4 @@
|
|||||||
import {PANEL_WIDTH, PANEL_HEIGHT, PANEL_FONT_SIZE, PANEL_BG_COLOR, PANEL_BORDER_COLOR, W, H, FONT_WIDTH} from './constants.js?v=5';
|
import {PANEL_WIDTH, PANEL_HEIGHT, PANEL_FONT_SIZE, PANEL_TITLE_FONT_SIZE, PANEL_BG_COLOR, PANEL_BORDER_COLOR, W, H, FONT_WIDTH} from './constants.js?v=5';
|
||||||
import {drawRect, drawLine} from './gfx.js?v=5';
|
import {drawRect, drawLine} from './gfx.js?v=5';
|
||||||
|
|
||||||
const PANEL_X = (W - PANEL_WIDTH) / 2;
|
const PANEL_X = (W - PANEL_WIDTH) / 2;
|
||||||
@@ -20,7 +20,13 @@ export function drawPanelBg(ctx) {
|
|||||||
export function drawPanelTitle(ctx, text) {
|
export function drawPanelTitle(ctx, text) {
|
||||||
const x = PANEL_X + PANEL_WIDTH / 2;
|
const x = PANEL_X + PANEL_WIDTH / 2;
|
||||||
const y = PANEL_Y + 20;
|
const y = PANEL_Y + 20;
|
||||||
drawPanelText(ctx, text, x, y, 'white', 'center');
|
ctx.font = `${PANEL_TITLE_FONT_SIZE}px text`;
|
||||||
|
ctx.textBaseline = 'top';
|
||||||
|
ctx.textAlign = 'center';
|
||||||
|
ctx.fillStyle = 'black';
|
||||||
|
ctx.fillText(text, x + 1, y + 1);
|
||||||
|
ctx.fillStyle = 'white';
|
||||||
|
ctx.fillText(text, x, y);
|
||||||
}
|
}
|
||||||
|
|
||||||
export function drawPanelText(ctx, text, x, y, color = 'white', align = 'left') {
|
export function drawPanelText(ctx, text, x, y, color = 'white', align = 'left') {
|
||||||
|
|||||||
Reference in new issue
Block a user