WIP, lots of things, doesnt compile

ui-refactor
Valerie 2021-06-18 21:29:45 -04:00
parent 35c3680268
commit 3c6986acfe
7 changed files with 77 additions and 112 deletions

View File

@ -7,5 +7,9 @@ const saveFile = process.argv[2] || 'data/world01.json';
ensureDirSync(parse(saveFile).dir);
// TODO move render logic into game, so that the ui doesnt exist until the game does...
// maybe, i mean, an argument could be made for not that, because the game
// isnt necessarily the entire thing, its just one instance of a save file.
// But probably the initial menu screens will be their own thing entirely.
const game = Game.create(saveFile);
render(game);

View File

@ -10,22 +10,30 @@ import { GiftPopup } from './GiftPopup.js';
import { PawnDetails } from './PawnDetails.js';
import { defaultTheme, getTheme } from './Theme.js';
import { inspect } from 'util';
import PawnsView from './view/PawnsView.js';
import InventoryView from './view/InventoryView.js';
import MultiplayerView from './view/MultiplayerView.js';
enum SubMenu {
NONE = 'NONE',
TREES = 'TREES'
};
// TODO extract View
export abstract class View implements Renderable, KeypressAcceptor {
abstract render(): void;
abstract keypress(key: {full: string}): void;
enum View {
PAWNS = 'Pawns',
INVENTORY = 'Inventory',
MULTIPLAYER = 'Multiplayer',
};
static PAWNS: View = new PawnsView();
static INVENTORY: View = new InventoryView();
static MULTIPLAYER: View = new MultiplayerView();
name: string
}
// TODO move KeypressAcceptor to ui something idk
export interface KeypressAcceptor {
keypress(key: {full: string}): void
}
export class Menu implements Renderable {
trees: number = 10;
subMenu: SubMenu = SubMenu.NONE;
view: View = View.PAWNS;
constructor() {
@ -36,95 +44,43 @@ export class Menu implements Renderable {
this.view = View[Object.keys(View)[Math.min(Math.max(Object.values(View).indexOf(this.view) - 1, 0), Object.keys(View).length - 1)]]
} else if (key.full === 'right') {
this.view = View[Object.keys(View)[Math.min(Math.max(Object.values(View).indexOf(this.view) + 1, 0), Object.keys(View).length - 1)]]
} else if (key.full === 'q') {
this.subMenu = SubMenu.TREES;
// debugging hotkeys
} else if (key.full === '1') {
Popup.show(inspect(stats));
} else if (key.full === '2') {
Popup.show('Etiam hendrerit elit sit amet metus congue dictum nec eu lacus. Sed aliquam in justo efficitur faucibus. Duis tellus diam, congue volutpat lorem et, semper consectetur erat. Nunc ac velit dignissim, tincidunt augue eget, tristique orci. Duis lacus sapien, bibendum id pharetra vel, semper et nunc. Vestibulum eu tellus imperdiet, lacinia ante ac, porta nisl. Donec at eleifend risus, ac dictum odio.');
} else if (key.full === 'escape') {
this.subMenu = SubMenu.NONE;
} else if (key.full === 'z') {
Game.current.pawns.push(new Pawn());
} else if (key.full === 'x') {
Game.current.board.clear();
}
if(this.view === View.PAWNS) {
if (key.full === 'delete') {
Game.current.removePawn(Game.current.selected);
} else if (key.full === 'up') {
Game.current.advanceSelection(-1);
} else if (key.full === 'down') {
Game.current.advanceSelection(1);
} else if (key.full === 'enter') {
new PawnDetails(Game.current.selected);
}
}
// if(this.view === View.PAWNS) {
// if (key.full === 'delete') {
// Game.current.removePawn(Game.current.selected);
// } else if (key.full === 'up') {
// Game.current.advanceSelection(-1);
// } else if (key.full === 'down') {
// Game.current.advanceSelection(1);
// } else if (key.full === 'enter') {
// new PawnDetails(Game.current.selected);
// }
// }
if(this.view === View.MULTIPLAYER) {
if (key.full === 'enter') {
new GiftPopup(mdns.players[this.multiplayerSelected]);
// mdns.players[this.multiplayerSelected].sendItem(null);
} else if (key.full === 'up') {
this.multiplayerSelected --;
} else if (key.full === 'down') {
this.multiplayerSelected ++;
}
}
// if(this.view === View.MULTIPLAYER) {
// if (key.full === 'enter') {
// new GiftPopup(mdns.players[this.multiplayerSelected]);
// // mdns.players[this.multiplayerSelected].sendItem(null);
// } else if (key.full === 'up') {
// this.multiplayerSelected --;
// } else if (key.full === 'down') {
// this.multiplayerSelected ++;
// }
// }
if(this.subMenu === SubMenu.TREES) {
if (key.full === '=') {
this.trees ++;
} else if (key.full === '-') {
this.trees --;
this.trees = Math.max(this.trees, 1);
} else if (key.full === '+') {
this.trees += 10;
} else if (key.full === '_') {
this.trees -= 10;
this.trees = Math.max(this.trees, 1);
} else if (key.full === 'enter') {
for(let i = 0; i < this.trees; i ++) {
Game.current.board.addTask(new ChopTreeTask(1));
}
this.subMenu = SubMenu.NONE;
}
} else if(this.subMenu === SubMenu.NONE) {
if (key.full === 'z') {
Game.current.pawns.push(new Pawn());
} else if (key.full === 'x') {
Game.current.board.clear();
}
}
// const pawn = new Pawn();
// Game.current.pawns.push(pawn);
Game.current.sync();
});
}
renderJobs() {
const colSpace = ((menuPanel.width - 2) / 2);
return (` ${getTheme().header('Menus')}${getTheme().normal(':')}${
' '.repeat(colSpace - 8)
}${getTheme().header('Actions')}${getTheme().normal(':')}\n ${
getTheme().hotkey('q')
}${getTheme().normal(': ')}${
(this.subMenu !== SubMenu.TREES ? getTheme().normal : getTheme().selected)('Chop Trees')
}${
' '.repeat(colSpace - 15)
}${getTheme().hotkey('z')}${getTheme().normal(': ')}${
(this.subMenu !== SubMenu.NONE ? getTheme().normal : getTheme().selected)('Create Pawn')
}\n${
' '.repeat(colSpace)
}${
getTheme().hotkey('x')
}${getTheme().normal(': ')}${
(this.subMenu !== SubMenu.NONE ? getTheme().normal : getTheme().selected)('Clear Tasks')
}`);
}
renderTopBar() {
const idlers = Game.current.pawns.filter(pawn => pawn.idle);
return ` ${Game.current.clock.render()}{|}${getTheme().normal(`Idle: ${idlers.length}`)} `;
@ -160,11 +116,7 @@ export class Menu implements Renderable {
}
}).join('');
})()}{/center}\n\n${(() => {
switch(this.view) {
case View.PAWNS: return this.renderPawns();
case View.INVENTORY: return this.renderInv();
case View.MULTIPLAYER: return this.renderMultiplayer();
}
this.view.view.render();
})()}`
}
@ -182,17 +134,6 @@ export class Menu implements Renderable {
return Game.current.inv.render();
}
renderSubMenu() {
return `${(() => {
switch(this.subMenu) {
case SubMenu.NONE:
return `{center}${getTheme().normal('* Select a menu above for options *')}{/center}`;
case SubMenu.TREES:
return this.renderTreesSubMenu();
}
})()}`;
}
renderTreesSubMenu() {
return [
`{center}Chop Trees`,
@ -209,10 +150,6 @@ export class Menu implements Renderable {
this.renderTopBar(),
hr,
this.renderView(),
hr,
this.renderJobs(),
hr,
this.renderSubMenu()
].join('\n');
menuPanel.setContent(content);
}

View File

@ -35,8 +35,8 @@ export const defaultTheme: Theme = {
selected: chalk.ansi256(250),
hotkey: chalk.ansi256(40),
tab: {
normal: chalk.ansi256(117).bgAnsi256(232),
selected: chalk.ansi256(232).bgAnsi256(117)
normal: chalk.ansi256(117),
selected: chalk.ansi256(117).inverse
},
border: {
focused: '#ffffff',

View File

@ -9,9 +9,10 @@ export const screen = blessed.screen({
});
export interface Renderable {
render: () => void
render(): void
}
// TODO move this to theme
export const boxStyle = () => {
return {
style: {

View File

@ -0,0 +1,6 @@
import { View } from "../Menu";
export default class InventoryView extends View {
keypress: (key: { full: string; }) => void;
render() { void 0 };
}

View File

@ -0,0 +1,7 @@
import { KeypressAcceptor, View } from "../Menu";
import { Renderable } from "../UI";
export default class MultiplayerView extends View {
keypress: (key: { full: string; }) => void;
render() { void 0 };
}

View File

@ -0,0 +1,10 @@
import { View } from "../Menu.js";
export default class PawnsView extends View {
constructor() {
super();
this.name = 'Pawns';
}
keypress: (key: { full: string; }) => void;
render() { void 0 };
}