monorail
/
Archipelago
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fix missing sprites on /weighted-settigs page, add author information to tooltip

This commit is contained in:
Chris Wilson 2020-12-06 10:55:58 -05:00
parent 493d5aa156
commit 5a1f936694
1 changed files with 11 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
WebHostLib/static/assets/weightedSettings.js
View File

@ -13,11 +13,8 @@ window.addEventListener('load', () => {
localStorage.setItem(`weightedSettings${i}`, JSON.stringify(updatedObj)); localStorage.setItem(`weightedSettings${i}`, JSON.stringify(updatedObj));
} }
// Parse spriteData into useful sets
spriteData = JSON.parse(results[2]);
// Build the entire UI // Build the entire UI
buildUI(JSON.parse(results[1])); buildUI(JSON.parse(results[1]), JSON.parse(results[2]));
// Populate the UI and add event listeners // Populate the UI and add event listeners
populateSettings(); populateSettings();
@ -29,6 +26,7 @@ window.addEventListener('load', () => {
document.getElementById('reset-to-default').addEventListener('click', resetToDefaults); document.getElementById('reset-to-default').addEventListener('click', resetToDefaults);
adjustHeaderWidth(); adjustHeaderWidth();
}).catch((error) => { }).catch((error) => {
console.error(error);
gameSettings.innerHTML = ` gameSettings.innerHTML = `
<h2>Something went wrong while loading your game settings page.</h2> <h2>Something went wrong while loading your game settings page.</h2>
<h2>${error}</h2> <h2>${error}</h2>
@ -170,7 +168,7 @@ const download = (filename, text) => {
document.body.removeChild(downloadLink); document.body.removeChild(downloadLink);
}; };
const buildUI = (settings) => { const buildUI = (settings, spriteData) => {
const settingsWrapper = document.getElementById('settings-wrapper'); const settingsWrapper = document.getElementById('settings-wrapper');
const settingTypes = { const settingTypes = {
gameOptions: 'Game Options', gameOptions: 'Game Options',
@ -244,7 +242,7 @@ const buildUI = (settings) => {
settingsWrapper.appendChild(spriteOptionsWrapper); settingsWrapper.appendChild(spriteOptionsWrapper);
// Append sprite picker // Append sprite picker
settingsWrapper.appendChild(buildSpritePicker()); settingsWrapper.appendChild(buildSpritePicker(spriteData));
}; };
const buildRangeSettings = (parentElement, settings) => { const buildRangeSettings = (parentElement, settings) => {
@ -404,7 +402,7 @@ const removeSpriteOption = (event) => {
tr.parentNode.removeChild(tr); tr.parentNode.removeChild(tr);
}; };
const buildSpritePicker = () => { const buildSpritePicker = (spriteData) => {
const spritePicker = document.createElement('div'); const spritePicker = document.createElement('div');
spritePicker.setAttribute('id', 'sprite-picker'); spritePicker.setAttribute('id', 'sprite-picker');
@ -415,18 +413,18 @@ const buildSpritePicker = () => {
const sprites = document.createElement('div'); const sprites = document.createElement('div');
sprites.setAttribute('id', 'sprite-picker-sprites'); sprites.setAttribute('id', 'sprite-picker-sprites');
Object.keys(spriteData).forEach((spriteName) => { spriteData.sprites.forEach((sprite) => {
const spriteImg = document.createElement('img'); const spriteImg = document.createElement('img');
spriteImg.setAttribute('src', `static/static/sprites/${spriteName}.gif`); spriteImg.setAttribute('src', `static/static/sprites/${sprite.name}.gif`);
spriteImg.setAttribute('data-sprite', spriteName); spriteImg.setAttribute('data-sprite', sprite.name);
spriteImg.setAttribute('alt', spriteName); spriteImg.setAttribute('alt', sprite.name);
// Wrap the image in a span to allow for tooltip presence // Wrap the image in a span to allow for tooltip presence
const imgWrapper = document.createElement('span'); const imgWrapper = document.createElement('span');
imgWrapper.className = 'sprite-img-wrapper'; imgWrapper.className = 'sprite-img-wrapper';
imgWrapper.setAttribute('data-tooltip', spriteName); imgWrapper.setAttribute('data-tooltip', `${sprite.name}${sprite.author ? `, by ${sprite.author}` : ''}`);
imgWrapper.appendChild(spriteImg); imgWrapper.appendChild(spriteImg);
imgWrapper.setAttribute('data-sprite', spriteName); imgWrapper.setAttribute('data-sprite', sprite.name);
sprites.appendChild(imgWrapper); sprites.appendChild(imgWrapper);
imgWrapper.addEventListener('click', addSpriteOption); imgWrapper.addEventListener('click', addSpriteOption);
}); });