import {ViewHelper} from "js-helper/dist/client/ViewHelper"; import {Helper} from "js-helper/dist/shared/Helper"; export class CircleManager { constructor(listSection, tableSection) { this._members = []; this._week = 0; this._inputTemplate = listSection.querySelector("#input-template"); this._inputTemplate.remove(); this._inputTemplate.removeAttribute("id"); this._listContainer = listSection.querySelector("#list-container"); listSection.querySelector("#add-button").addEventListener("click", () => this.addMember()); this._tableTemplate = tableSection.querySelector("#table-template"); this._tableTemplate.remove(); this._tableTemplate.removeAttribute("id"); this._tableContainer = tableSection.querySelector("#table-container"); this._weekInput = tableSection.querySelector("#week-input"); tableSection.querySelector("#next-week").addEventListener("click", () => this.setWeek(this._week + 1)); tableSection.querySelector("#previous-week").addEventListener("click", () => this.setWeek(this._week - 1)); this.load(); this.setWeek(this._week); } setWeek(newWeek) { newWeek = parseInt(newWeek); if (!isNaN(newWeek)) { newWeek = Math.max(newWeek, 0); this._week = newWeek; this._weekInput.innerText = (this._week + 1); this.updateTables(); this.save(); } } save(){ console.log("saving..."); localStorage.setItem("list", JSON.stringify({"week": this._week, "members": this._members})); } load(){ const jsonSavedata = localStorage.getItem("list"); console.log("liste", jsonSavedata); if (jsonSavedata){ const data = JSON.parse(jsonSavedata); this._week = data.week; this._members = data.members; this.updateList(); this.updateTables(); } } updateList() { ViewHelper.removeAllChildren(this._listContainer); this._members.forEach((member, id) => { const memberElement = this._inputTemplate.cloneNode(true); memberElement.querySelector(".delete-button").addEventListener("click", () => this.deleteMember(id)) const inputElem = memberElement.querySelector(".name"); inputElem.value = member; inputElem.addEventListener("input", () => { this._members[id] = inputElem.value; this.updateTables(); this.save(); }); this._listContainer.appendChild(memberElement); }) } deleteMember(index) { if (index >= 0 && index < this._members.length) { this._members.splice(index, 1); this.updateList(); this.updateTables(); this.save(); } } addMember(name) { name = Helper.nonNull(name, ""); this._members.push(name); this.updateList(); this.updateTables(); this.save(); } updateTables() { if (this._members.length < 2) { return; } const tables = {}; this._members.forEach((member, index) => { const listPrayers = []; const listPrayedBy = []; const otherMembers = this._members.filter((v, i) => i !== index); let prayersIndex = index - 1; let prayedIndex = index; const weekOffset = this._week * 7; prayersIndex += weekOffset; prayedIndex -= weekOffset; if (prayedIndex < 0) { prayedIndex += otherMembers.length * Math.floor(weekOffset / otherMembers.length); } for (let i = 0; i < 7; i++) { prayersIndex = (prayersIndex + 1) % otherMembers.length prayedIndex = (prayedIndex - 1 + otherMembers.length) % otherMembers.length; listPrayers.push(otherMembers[prayersIndex]); listPrayedBy.push(otherMembers[prayedIndex]); } tables[index] = {"for": listPrayers, "by": listPrayedBy} }); ViewHelper.removeAllChildren(this._tableContainer); Object.keys(tables).forEach(memberIndex => { const tableElement = this._tableTemplate.cloneNode(true); tableElement.querySelector(".name").innerText = this._members[memberIndex]; tables[memberIndex].for.forEach((otherMember, index) => { tableElement.querySelector(".for-" + index).innerText = otherMember; }); tables[memberIndex].by.forEach((otherMember, index) => { tableElement.querySelector(".by-" + index).innerText = otherMember; }); this._tableContainer.appendChild(tableElement); }); } }