Git_Mirror/Werewolf
1
0
Fork 0
mirror of https://github.com/AlecM33/Werewolf.git synced 2025-12-26 15:57:50 +01:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'master' into edit-timer

Browse Source
This commit is contained in:
AlecM33
2023-08-16 12:19:05 -04:00
parent cdacb09eff 92a48bdcd8
commit 25fb043292
7 changed files with 50 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
client/src/config/defaultRoles.js
View File

@@ -34,6 +34,12 @@ export const defaultRoles = [
team: 'good',
description: 'Each night, learn if a chosen person is a Werewolf.'
},
{
role: 'Doctor',
team: 'good',
description: `Each night, choose a player to protect from the Werewolves. This can be yourself. If the Werewolves
target this person, they still survive to the following day.`
},
{
role: 'Parity Hunter',
team: 'good',

BIN
client/src/images/roles/Doctor.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.3 KiB

BIN
client/src/images/roles/DreamWolf.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 8.7 KiB

After

Width:  |  Height:  |  Size: 8.3 KiB

16
client/src/modules/game_creation/DeckStateManager.js
View File

@@ -216,8 +216,24 @@ export class DeckStateManager {
roleEl.querySelector('.role-remove').addEventListener('keyup', minusOneHandler);
const infoHandler = (e) => {
document.querySelector('#custom-role-info-modal-image')?.remove();
if (e.type === 'click' || e.code === 'Enter') {
const alignmentEl = document.getElementById('custom-role-info-modal-alignment');
if (!sortedDeck[i].custom) {
document.getElementById('custom-role-info-modal-image-placeholder').style.display = 'flex';
const roleImg = new Image();
roleImg.id = 'custom-role-info-modal-image';
roleImg.onload = () => {
document.getElementById('custom-role-info-modal-image-placeholder').appendChild(roleImg);
};
if (sortedDeck[i].role.toLowerCase() === 'villager') {
roleImg.src = '../images/roles/Villager' + Math.ceil(Math.random() * 2) + '.png';
} else {
roleImg.src = '../images/roles/' + sortedDeck[i].role.replaceAll(' ', '') + '.png';
}
} else {
document.getElementById('custom-role-info-modal-image-placeholder').style.display = 'none';
}
const nameEl = document.getElementById('custom-role-info-modal-name');
alignmentEl.classList.remove(ALIGNMENT.GOOD);
alignmentEl.classList.remove(ALIGNMENT.EVIL);

13
client/src/modules/game_creation/RoleBox.js
View File

@@ -263,6 +263,7 @@ export class RoleBox {
}
if (info) {
const infoHandler = (e) => {
document.querySelector('#custom-role-info-modal-image')?.remove();
if (e.type === 'click' || e.code === 'Enter') {
const alignmentEl = document.getElementById('custom-role-info-modal-alignment');
const nameEl = document.getElementById('custom-role-info-modal-name');
@@ -273,9 +274,21 @@ export class RoleBox {
e.preventDefault();
let role;
if (isCustom) {
document.getElementById('custom-role-info-modal-image-placeholder').style.display = 'none';
role = this.getCustomRole(name);
} else {
document.getElementById('custom-role-info-modal-image-placeholder').style.display = 'flex';
role = this.getDefaultRole(name);
const roleImg = new Image();
roleImg.id = 'custom-role-info-modal-image';
roleImg.onload = () => {
document.getElementById('custom-role-info-modal-image-placeholder').appendChild(roleImg);
};
if (name.toLowerCase() === 'villager') {
roleImg.src = '../images/roles/Villager' + Math.ceil(Math.random() * 2) + '.png';
} else {
roleImg.src = '../images/roles/' + name.replaceAll(' ', '') + '.png';
}
}
nameEl.innerText = name;
nameEl.classList.add(role.team);

15
client/src/styles/modal.css
View File

@@ -55,6 +55,13 @@
justify-content: center;
}
#custom-role-info-modal-image {
margin: 0 auto;
width: 200px;
background-color: #4645525c;
border-radius: 5px;
}
#custom-role-info-modal {
color: #d7d7d7;
text-align: left;
@@ -62,8 +69,14 @@
align-items: flex-start;
}
#custom-role-info-modal-image-placeholder {
width: 200px;
height: 200px;
margin: 0 auto;
}
#custom-role-info-modal h3 {
margin: 0 0 0.5em 0;
margin: 0 auto 0.5em auto;
}
#custom-role-info-modal-description {

1
client/src/view_templates/CreateTemplate.js
View File

@@ -35,6 +35,7 @@ export const hiddenMenus =
</div>
<div tabindex="-1" id="custom-role-info-modal" class="modal">
<h3 id="custom-role-info-modal-name"></h3>
<div id="custom-role-info-modal-image-placeholder"></div>
<label for="custom-role-info-modal-alignment">alignment:</label>
<div id="custom-role-info-modal-alignment"></div>
<label for="custom-role-info-modal-alignment">description:</label>