Skip to content

Commit

Permalink
Added skip button functionality
Browse files Browse the repository at this point in the history
  • Loading branch information
FourthStrongest committed Feb 28, 2024
1 parent 7890dd3 commit 31fa853
Show file tree
Hide file tree
Showing 4 changed files with 70 additions and 4 deletions.
12 changes: 11 additions & 1 deletion index.html
Original file line number Diff line number Diff line change
Expand Up @@ -62,6 +62,8 @@

<div class="left sort text"><p></p></div>
<div class="right sort text"><p></p></div>
<div class="left sort skip button">Skip</div>
<div class="right sort skip button">Skip</div>
</div>

<div class="options"></div>
Expand All @@ -71,9 +73,17 @@


<div class="info">
<button onclick="toggleButton()">NEWS (Last Updated: September 3rd 2023)</button>
<button onclick="toggleButton()">NEWS (Last Updated: February 28th 2024)</button>
<div class="news-container">
<div class="news" id="news">
<span class="last-updated">
February 28th 2024:
</span>

<ul>
<li>Added skip button.</li>
</ul>

<span class="last-updated">
September 3rd 2023:
</span>
Expand Down
4 changes: 4 additions & 0 deletions src/css/styles.css
Original file line number Diff line number Diff line change
Expand Up @@ -147,6 +147,10 @@ body {
border: 1px solid #000000;
}

.sorter > .skip {
display: none;
}

.options {
margin: 1em auto;
display: grid;
Expand Down
6 changes: 3 additions & 3 deletions src/js/data/2023-05-01.js
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@ dataSet[dataSetVersion].options = [
{ name: "Xenoblade Chronicles 2", key: "XC2" },
{ name: "The Golden Country", key: "TGC" },
{ name: "Xenoblade Chronicles 3", key: "XC3" },
{ name: "Future Redeemed", key: "FR"}
{ name: "Future Redeemed", key: "FR" }
]
},
{
Expand Down Expand Up @@ -2506,7 +2506,7 @@ dataSet[dataSetVersion].characterData = [
wiki: "https://xenoblade.fandom.com/wiki/Shulk#Future_Redeemed",
opts: {
role: ["protag", "hero"],
series: ["XC3", "FR"],
series: ["FR"],
duplicate: true,
}
},
Expand All @@ -2516,7 +2516,7 @@ dataSet[dataSetVersion].characterData = [
wiki: "https://xenoblade.fandom.com/wiki/Rex#Xenoblade_Chronicles_3:_Future_Redeemed",
opts: {
role: ["protag", "hero"],
series: ["XC3", "FR"],
series: ["FR"],
duplicate: true,
}
},
Expand Down
52 changes: 52 additions & 0 deletions src/js/main.js
Original file line number Diff line number Diff line change
Expand Up @@ -63,6 +63,9 @@ function init() {

document.querySelector('.left.sort.image').addEventListener('click', () => pick('left'));
document.querySelector('.right.sort.image').addEventListener('click', () => pick('right'));

document.querySelector('.left.sort.skip.button').addEventListener('click', () => skip('left'));
document.querySelector('.right.sort.skip.button').addEventListener('click', () => skip('right'));

document.querySelector('.sorting.tie.button').addEventListener('click', () => pick('tie'));
document.querySelector('.sorting.undo.button').addEventListener('click', undo);
Expand Down Expand Up @@ -279,6 +282,8 @@ function start() {
document.querySelector('.loading.button').style.display = 'none';
document.querySelectorAll('.sorting.button').forEach(el => el.style.display = 'block');
document.querySelectorAll('.sort.text').forEach(el => el.style.display = 'block');
document.querySelector('.left.sort.skip.button').style.display = 'block';
document.querySelector('.right.sort.skip.button').style.display = 'block';
display();
});
}
Expand All @@ -291,6 +296,8 @@ function display() {
const leftChar = characterDataToSort[leftCharIndex];
const rightChar = characterDataToSort[rightCharIndex];

if (skipCheck(leftChar, rightChar)) return;

const charNameDisp = (name, wiki) => {
const charName = reduceTextWidth(name, 'Arial 12.8px', 220);
const charTooltip = name !== charName ? name : '';
Expand Down Expand Up @@ -319,6 +326,51 @@ function display() {
} else { saveProgress('Autosave'); }
}

/**
* Check if a character can be skipped.
*
* @param {*} leftChar
* @param {*} rightChar
*/
function skipCheck(leftChar, rightChar) {
if (leftChar.skip && rightChar.skip) {
pick('tie');
return true;
} else if (leftChar.skip) {
pick ('right');
return true;
} else if (rightChar.skip) {
pick('left');
return true;
}
return false;
}

/**
* Skip character functionality.
*
* @param { 'left'|'right' } type
*/
function skip(type) {
const leftCharIndex = sortedIndexList[leftIndex][leftInnerIndex];
const rightCharIndex = sortedIndexList[rightIndex][rightInnerIndex];
const leftChar = characterDataToSort[leftCharIndex];
const rightChar = characterDataToSort[rightCharIndex];

switch(type) {
case 'left': {
leftChar.skip = true;
pick('right');
break;
}
case 'right': {
rightChar.skip = true;
pick('left');
break;
}
}
}

/**
* Sort between two character choices or tie.
*
Expand Down

0 comments on commit 31fa853

Please sign in to comment.