import BusinessObjects from "../lib/business_objects/business_objects.js"; import Events from "../lib/events.js"; import LocalStorage from "../lib/local_storage.js"; import API from "../api.js"; import DOM from "../dom.js"; import Utils from "../lib/utils.js"; import OverlayConfirm from "../components/common/temporary/overlay_confirm.js"; import OverlayError from "../components/common/temporary/overlay_error.js"; import Validation from "../lib/validation.js"; export default class BasePage { constructor(router) { if (!router) { throw new Error("Router is required"); } else { Utils.consoleLogIfNotProductionEnvironment("initialising with router: ", router); } this.router = router; this.title = titlePageCurrent; if (this.constructor === BasePage) { throw new Error("Cannot instantiate abstract class"); } if (!this.constructor.hash) { throw new Error(`Class ${this.constructor.name} must have a static hash attribute.`); } } initialize() { throw new Error("Method 'initialize()' must be implemented."); } sharedInitialize() { this.logInitialisation(); this.hookupCommonElements(); } logInitialisation() { Utils.consoleLogIfNotProductionEnvironment('Initializing ' + this.title + ' page'); } hookupCommonElements() { // hookupVideos(); this.hookupLogos(); this.hookupNavigation(); this.hookupOverlays(); } hookupLogos() { Events.hookupEventHandler("click", "." + flagImageLogo + "," + "." + flagLogo, (event, element) => { Utils.consoleLogIfNotProductionEnvironment('clicking logo'); this.router.navigateToHash(hashPageHome); }); } /* hookupEventHandler(eventType, selector, callback) { Events.initialiseEventHandler(selector, flagInitialised, (element) => { element.addEventListener(eventType, (event) => { event.stopPropagation(); callback(event, element); }); }); } */ hookupNavigation() { Events.hookupEventHandler("click", idButtonHamburger, (event, element) => { let overlayHamburger = document.querySelector(idOverlayHamburger); if (overlayHamburger.classList.contains(flagIsCollapsed)) { overlayHamburger.classList.remove(flagIsCollapsed); overlayHamburger.classList.add(flagExpanded); } else { overlayHamburger.classList.remove(flagExpanded); overlayHamburger.classList.add(flagIsCollapsed); } }); this.hookupButtonsNavHome(); this.hookupButtonsNavContact(); // this.hookupButtonsNavAdminHome(); this.hookupButtonsNavUserAccount(); this.hookupButtonsNavUserLogout(); this.hookupButtonsNavUserLogin(); // this.hookupButtonsNavStoreHome(); // this.hookupButtonsNavStoreManufacturingPurchaseOrders(); this.hookupButtonsNavDogHome(); this.hookupButtonsNavDogCommandCategories(); this.hookupButtonsNavDogCommands(); this.hookupButtonsNavDogDogCommandLinks(); this.hookupButtonsNavDogDogs(); this.hookupButtonsNavDogLocations(); this.hookupButtonsNavDogButtonIcons(); this.hookupButtonsNavDogCommandButtonLinks(); this.hookupButtonsNavDogAssessments(); this.hookupButtonsNavDogCalendarEntries(); } hookupButtonsNavHome() { this.hookupButtonsNav('.' + flagNavHome, hashPageHome); } hookupButtonsNav(buttonSelector, hashPageNav) { Events.hookupEventHandler("click", buttonSelector, (event, button) => { this.router.navigateToHash(hashPageNav); }); } hookupButtonsNavContact() { this.hookupButtonsNav('.' + flagNavContact, hashPageContact); } /* hookupButtonsNavAdminHome() { this.hookupButtonsNav('.' + flagNavAdminHome, hashPageAdminHome); } hookupButtonsNavServices() { this.hookupButtonsNav('.' + flagNavServices, hashPageServices); } */ hookupButtonsNavUserAccount() { this.hookupButtonsNav('.' + flagNavUserAccount, hashPageUserAccount); } hookupButtonsNavUserLogout() { this.hookupButtonsNav('.' + flagNavUserLogout, hashPageUserLogout); } hookupButtonsNavUserLogin() { Events.hookupEventHandler("click", '.' + flagNavUserLogin, (event, navigator) => { event.stopPropagation(); this.leave(); API.loginUser() .then((response) => { if (response.Success) { window.location.href = response[flagCallback]; } else { DOM.alertError("Error", response.Message); } }); }); } hookupButtonsNavDogHome() { this.hookupButtonsNav('.' + flagNavDogHome, hashPageDogHome); } hookupButtonsNavDogCommandCategories() { this.hookupButtonsNav('.' + flagNavDogCommandCategories, hashPageDogCommandCategories); } hookupButtonsNavDogCommands() { this.hookupButtonsNav('.' + flagNavDogCommands, hashPageDogCommands); } hookupButtonsNavDogDogCommandLinks() { this.hookupButtonsNav('.' + flagNavDogDogCommandLinks, hashPageDogDogCommandLinks); } hookupButtonsNavDogDogs() { this.hookupButtonsNav('.' + flagNavDogDogs, hashPageDogDogs); } hookupButtonsNavDogLocations() { this.hookupButtonsNav('.' + flagNavDogLocations, hashPageDogLocations); } hookupButtonsNavDogButtonIcons() { this.hookupButtonsNav('.' + flagNavDogButtonIcons, hashPageDogButtonIcons); } hookupButtonsNavDogCommandButtonLinks() { this.hookupButtonsNav('.' + flagNavDogCommandButtonLinks, hashPageDogCommandButtonLinks); } hookupButtonsNavDogAssessments() { this.hookupButtonsNav('.' + flagNavDogAssessments, hashPageDogAssessments); } hookupButtonsNavDogCalendarEntries() { this.hookupButtonsNav('.' + flagNavDogCalendarEntries, hashPageDogCalendarEntries); } hookupOverlays() { this.hookupOverlayFromId(idOverlayConfirm); this.hookupOverlayFromId(idOverlayError); } hookupOverlayFromId(idOverlay) { Events.initialiseEventHandler(idOverlay, flagInitialised, (overlay) => { overlay.querySelector('button.' + flagCancel).addEventListener("click", (event) => { event.stopPropagation(); overlay.style.display = 'none'; }); }); } hookupButtonSave() { Events.initialiseEventHandler('.' + flagContainer + '.' + flagSave + '.' + flagCancel + ' button.' + flagSave, flagInitialised, (button) => { button.addEventListener("click", (event) => { event.stopPropagation(); button = event.target; if (button.classList.contains(flagIsCollapsed)) return; Utils.consoleLogIfNotProductionEnvironment('saving page: ', this.title); OverlayConfirm.show(); }); }); } leave() { Utils.consoleLogIfNotProductionEnvironment('Leaving ' + this.title + ' page'); if (this.constructor === BasePage) { throw new Error("Must implement leave() method."); } } setLocalStoragePage(dataPage) { LocalStorage.setLocalStorage(this.hash, dataPage); } getLocalStoragePage() { return LocalStorage.getLocalStorage(this.hash); } toggleShowButtonsSaveCancel(show, buttonContainerSelector = null) { // , buttonSave = null, buttonCancel = null if (Validation.isEmpty(buttonContainerSelector)) buttonContainerSelector = '.' + flagContainer + '.' + flagSave + '.' + flagCancel; let buttonSave = document.querySelector(buttonContainerSelector + ' ' + idButtonSave); let buttonCancel = document.querySelector(buttonContainerSelector + ' ' + idButtonCancel); Utils.consoleLogIfNotProductionEnvironment({ show, buttonContainerSelector, buttonCancel, buttonSave }); if (show) { buttonCancel.classList.remove(flagIsCollapsed); buttonSave.classList.remove(flagIsCollapsed); Utils.consoleLogIfNotProductionEnvironment('showing buttons'); } else { buttonCancel.classList.add(flagIsCollapsed); buttonSave.classList.add(flagIsCollapsed); Utils.consoleLogIfNotProductionEnvironment('hiding buttons'); } } static isDirtyFilter(filter) { let isDirty = DOM.updateAndCheckIsElementDirty(filter); if (isDirty) document.querySelectorAll(idTableMain + ' tbody tr').remove(); return isDirty; } }