Implemented config options

This commit is contained in:
Mysaa Java
2026-09-08 02:28:36 +02:00
parent 3b68f3f42f
commit 920e378dd5
11 changed files with 543 additions and 139 deletions
+93 -13
View File
@@ -3,7 +3,14 @@ var player = '_'
var roomId = '_'
var wsHeaders = {}
var cards = []
var gc = {}
var currentHint = null
var currentHintCount = -1
var currentGuessCount = -1
var phase = {}
// This variable is here to check for updates to availableHintWordCount, as updating it is a bit expensive
var registeredAvailableHintWordCountInvalid = true
function getRoomId() {
const urlRegex = /\/room\/([a-f0-9-]{36})\/grid$/
const res = urlRegex.exec(window.location.href)
@@ -14,39 +21,68 @@ function getRoomId() {
/*
* Update html to match state
* This is idempotent
*/
function updatePhase(phase) {
function updatePhase() {
$('#hint-counter-num').text(currentHintCount)
$('#hint-counter-den').text(gc["max-hint"])
if(currentHint) {
$('#hint-text').text(currentHint['word']+" in "+currentHint['wordCount'])
$('#guess-counter-num').text(currentGuessCount)
if(gc['one-more-guess']) {
$('#guess-counter-den').text(currentHint['wordCount'] + "(+1)")
} else {
$('#guess-counter-den').text(currentHint['wordCount'])
}
}
if(registeredAvailableHintWordCountInvalid) {
$('#submit-hint-wordcount').empty()
for (let i = 0; i < gc['available-hint-word-count'].length; i++) {
const e = gc['available-hint-word-count'][i];
$('#submit-hint-wordcount').append($(`<option value="${e}">${e}</option>`))
}
registeredAvailableHintWordCountInvalid = false
}
$('#submit-hint-text').attr('maxlength', gc['hint-max-length'])
p = player.toLowerCase()
o = (player=='A')?'b':'a'
if(phase[p+'-guessing']) {
$('.card-button').css('visibility', 'visible')
$('.card-button.untouchable').css('visibility', 'hidden')
$('#end-guessing-button').show()
} else {
$('.card-button').css('visibility', 'hidden')
$('#end-guessing-button').hide()
}
if((phase['name'] == 'waiting_for_one_more_'+p) ||
(phase[p+'-guessing'] &&
(gc['end-guessing'] || (currentHint && currentGuessCount >= currentHint['wordCount'])))) {
$('#end-guessing-button').show()
} else {
$('#end-guessing-button').hide()
}
if(phase[p+'-guessing'] || phase[o+'-guessing']) {
$('#hint-text').show()
$('#guess-counter').show()
} else {
$('#hint-text').hide()
$('#guess-counter').hide()
}
if(phase[p+'-hinting']) {
$('#submit-hint').show()
} else {
$('#submit-hint').hide()
}
if(!phase[p+'-guessing'] & !phase[p+'-hinting']) {
if(!phase[p+'-guessing'] && !phase[p+'-hinting']) {
$('#other-playing').show()
} else {
$('#other-playing').hide()
}
}
function setHint(hint, wordCount) {
$('#hint-text').text(hint+" in "+wordCount)
}
function createCard(i) {
html = `
<li class="card ${cards[i].color}" id="card-${i}">
@@ -146,19 +182,29 @@ function addEvent(e) {
switch(e.type) {
case "hint":
addHintEvent(e.issuer, e.word, e.wordCount)
setHint(e.word, e.wordCount)
currentHint = {word: e.word, wordCount: e.wordCount}
currentHintCount += 1
currentGuessCount = 0
updatePhase()
break
case "guess":
addPointEvent(e.issuer, e['card-index'], e.color)
currentGuessCount += 1
break
case "end_guessing":
addEndGuessingEvent(e.issuer, e.manual)
currentHint = null
currentGuessCount = 0
break
case "game_end":
addEndGameEvent(e.issuer, e.win)
currentHint = null
currentGuessCount = 0
break
case "sudden_death":
addSuddenDeathEvent()
currentHint = null
currentGuessCount = 0
break
}
}
@@ -167,23 +213,29 @@ function addEvent(e) {
/*
* Listeners
*/
function initGame(data) {
cards = data['cards']
gc = data.config
cards = data.cards
$('#cards-list').empty()
for(var i = 0; i<cards.length; i++) {
createCard(i)
updateCard(i)
}
updatePhase(data['phase'])
phase = data['phase']
events = data.events
for(var i = 0; i<events.length; i++) {
e = events[i]
addEvent(e)
}
if(data['current-hint']) {
setHint(data['current-hint'].word, data['current-hint'].wordCount)
currentHint = data['current-hint']
}
currentGuessCount = data['current-guess-count']
currentHintCount = data['used-hints']
updatePhase()
}
function selectPlayer(e) {
@@ -193,6 +245,7 @@ function selectPlayer(e) {
"player": player
}
$('#player-name').text(player)
$('#player-selector').hide()
$('#game-panel').show()
$('#side-panel').show()
@@ -208,6 +261,7 @@ function selectPlayer(e) {
socket.subscribe('/topic/new-phase', onNewPhase);
socket.subscribe('/topic/new-event', onNewEvent);
socket.subscribe('/topic/update-card/' + player.toLowerCase(), onUpdateCard);
socket.subscribe('/topic/config-change', onConfigChange)
});
}
@@ -230,7 +284,7 @@ function endGuessing(e) {
}
function onNewPhase(m) {
phase = JSON.parse(m.body)
updatePhase(phase)
updatePhase()
}
function onNewEvent(m) {
e = JSON.parse(m.body)
@@ -244,6 +298,32 @@ function onUpdateCard(m) {
updateCard(i)
}
function onConfigChange(m) {
data = JSON.parse(m.body)
for(const [key, value] of data.entries()) {
console.log("New config option : ", key, "=", value)
gc[key] = value
switch(key) {
case "max-hint":
updatePhase()
case "available-hint-word-count":
registeredAvailableHintWordCountInvalid = true
updatePhase()
case "one-more-guess":
case "hint-max-length":
updatePhase()
case "end-guessing":
case "only-one-green-green":
case "sudden-death":
case "hints-in-a-row":
// All the changes are made with phases
break;
}
}
cards[i] = data
updateCard(i)
}
function initialize() {
$('#select-player-a').on('click', selectPlayer)
$('#select-player-b').on('click', selectPlayer)