Files
mtg_commander_life_tracker/static/js/pages/tcg/mtg_decks.js

111 lines
3.9 KiB
JavaScript

import API from "../../api.js";
import Events from "../../lib/events.js";
import TableBasePage from "../base_table.js";
import Utils from "../../lib/utils.js";
export default class PageMtgDecks extends TableBasePage {
static hash = hashPageMtgDecks;
static attrIdRowObject = attrDeckId;
callSaveTableContent = API.saveDeck;
constructor(router) {
super(router);
}
initialize() {
this.sharedInitialize();
}
hookupFilters() {
/*
this.sharedHookupFilters();
this.hookupFilterActive();
*/
}
loadRowTable(rowJson) {
if (rowJson == null) return;
if (_verbose) { Utils.consoleLogIfNotProductionEnvironment("applying data row: ", rowJson); }
}
getJsonRow(row) {
return;
}
initialiseRowNew(tbody, row) {
}
postInitialiseRowNewCallback(tbody) {
let newRows = tbody.querySelectorAll('tr.' + flagRowNew);
let newestRow = newRows[0];
let clickableElementsSelector = [
'td.' + attrCommanderBracketId + ' div.' + attrCommanderBracketId
].join('');
newestRow.querySelectorAll(clickableElementsSelector).forEach((clickableElement) => {
clickableElement.click();
});
}
hookupTableMain() {
super.hookupTableMain();
this.hookupTableMainRows();
this.hookupFieldsNameTable();
this.hookupTableMainIsCommanderCheckboxes();
this.hookupTableMainCommanderBracketPreviews();
this.hookupFieldsActive();
}
hookupTableMainRows() {
return;
let rowSelector = 'table.' + flagTableMain + ' tbody tr';
Events.hookupEventHandler("click", rowSelector, (event, row) => {
let isRowExpanded = row.classList.contains(flagActive);
let showSection;
if (isRowExpanded) {
showSection = false;
PageMtgDecks.toggleShowDeckStatisticsSection(showSection);
}
else {
showSection = true;
let deckId = row.getAttribute(attrDeckId);
let statisticsSectionTableBody = document.querySelector('table.' + flagStatistics + ' tbody');
statisticsSectionTableBody.innerHTML = '';
let deck = decks.filter(d => d[attrDeckId] == deckId)[0];
if (deck[flagStatistics].length > 0) {
let newStatisticRowsHtml = '';
deck[flagStatistics]
.sort((a, b) => a[flagDisplayOrder] - b[flagDisplayOrder])
.forEach((statistic) => {
newStatisticRowsHtml += `
<tr ${attrStatisticId}="${statistic[attrStatisticId]}">
<td class="${flagName}">${statistic[flagName]}</td>
<td class="${flagValue}">${statistic[flagValue]}</td>
</tr>
`;
});
statisticsSectionTableBody.innerHTML = newStatisticRowsHtml;
}
PageMtgDecks.toggleShowDeckStatisticsSection(showSection);
}
});
}
static toggleShowDeckStatisticsSection(showSection) {
let statisticsSectionTableBody = document.querySelector('table.' + flagStatistics + ' tbody');
if (showSection) {
statisticsSectionTableBody.classList.remove(flagIsCollapsed);
}
else {
statisticsSectionTableBody.classList.add(flagIsCollapsed);
}
}
hookupTableMainIsCommanderCheckboxes() {
this.hookupChangeHandlerTableCells(idTableMain + ' td.' + flagIsCommander + ' .' + flagIsCommander);
}
hookupTableMainCommanderBracketPreviews() {
this.hookupTableCellDdlPreviews(
attrCommanderBracketId
, Utils.getListFromDict(commanderBrackets)
);
}
leave() {
super.leave();
}
}