Browse Source

Fixed web client whitespace rendering issues

pull/14/head
Armen138 9 months ago
parent
commit
a78b047ff2
4 changed files with 35 additions and 10 deletions
  1. +12
    -0
      game/webloader.js
  2. +12
    -6
      game/webrenderer.js
  3. +6
    -4
      index.html
  4. +5
    -0
      web.js

+ 12
- 0
game/webloader.js View File

@@ -9,6 +9,18 @@ class WebLoader {
// console.log(yaml);
}

save() {
localStorage.files = JSON.stringify(this.files);
}

load() {
if (localStorage.files) {
this.files = JSON.parse(localStorage.files);
} else {
throw (new Error('Failed to load game'));
}
}

get(filename) {
const promise = new Promise((resolve, reject) => {
if (this.files[filename]) {


+ 12
- 6
game/webrenderer.js View File

@@ -44,7 +44,7 @@ class WebRenderer {
const input = this.input.value.split(' ');
const command = input.shift();
const args = input.join(' ');
this.text(`>> ${this.input.value}`);
this.text(`${this.title}${this.input.value}`);
this.input.value = '';
if (!this.commands[command]) {
if (this.commands.help) {
@@ -56,18 +56,20 @@ class WebRenderer {
}
});

const prompt = document.createElement('div');
prompt.innerHTML = this.title;
this.container.appendChild(prompt);
// const prompt = document.createElement('div');
// prompt.innerHTML = this.title;
// this.container.appendChild(prompt);
noop();
}

prompt(promptString) {
this.title = promptString;
this.title = `[${promptString}]$ `;
document.querySelector('#delimiter').innerHTML = this.title;
}

clear() {
this.messages = [];
this.container.innerHTML = '';
}

register(commands, autocomplete) {
@@ -77,7 +79,11 @@ class WebRenderer {

style(text, style) {
if (!text) return '';
const span = document.createElement('span');
let elementType = 'span';
if (style && style['text-align']) {
elementType = 'div';
}
const span = document.createElement(elementType);
let styleAttribute = '';
for (const item in style) {
if (Object.prototype.hasOwnProperty.call(style, item)) {


+ 6
- 4
index.html View File

@@ -7,19 +7,21 @@
html {
color: grey;
background-color: black;
font-family: "Lucida Console", Monaco, monospace
font-family: "Lucida Console", Monaco, monospace;
white-space: pre;
overflow-x: hidden;
}
input {
width: 100%;
border: none;
color: gray;
background: black;
font-size: 20px;
font-size: 18px;
height: 19px;
}
</style>
</head>
<body>
<div id='game'></div>
<input type='text' id='prompt'>
<div id='game'></div><span id="delimiter"></span><input type='text' id='prompt'>
</body>
</html>

+ 5
- 0
web.js View File

@@ -8,6 +8,11 @@ import WebLoader from './game/webloader.js';
const loader = new WebLoader();
const game = new Game(new WebRenderer(), loader);

// it's all input baby
window.addEventListener('click', () => {
document.querySelector('#prompt').focus();
});

function main(menu, death) {
menu.on('play', game.play.bind(game));
death.on('play', game.play.bind(game));


Loading…
Cancel
Save