ui5_easy_use/dist/ez5/templates/init-app/default/controller/ex_App.js

CLI tool for SAP ui5 and SAPUI5 projects to initialize apps, generate pages, insert form and table components, manage routing, and automate i18n bindings

sap.ui.define([
  "sap/ui/core/mvc/Controller",
  "sap/ui/core/UIComponent",
  "sap/ui/core/Fragment",
  "sap/ui/core/Configuration"
], function (Controller, UIComponent, Fragment, Configuration) {
  "use strict";

  return Controller.extend("${ez5.appName}.controller.App", {
    onInit: function () {
      this.oView = this.getView();
      this.isDarkMode = true;

      this.onToggleTheme();
      this.onMenuButtonPress();
      this._initializeRouter();
      this._initializeDeveloperPopover();
    },

    _initializeRouter: function () {
      this.oRouter = this.getOwnerComponent().getRouter();
      this.oRouter.attachRouteMatched(this.onRouteMatched, this);

      if (typeof this.onBeforeRouteMatched === "function") {
        this.oRouter.attachBeforeRouteMatched(this.onBeforeRouteMatched, this);
      }
    },

    _initializeDeveloperPopover: function () {
      this.oMyAvatar = this.oView.byId("Avatar_id");
      this._oPopover = Fragment.load({
        id: this.oView.getId(),
        name: "${ez5.appName}.fragment.auth.Popover",
        controller: this
      }).then(function (oPopover) {
        this.oView.addDependent(oPopover);
        this._oPopover = oPopover;
        return oPopover;
      }.bind(this));
    },

    onMenuButtonPress: function () {
      const toolPage = this.byId("toolPage");
      if (toolPage) {
        toolPage.setSideExpanded(!toolPage.getSideExpanded());
      }
    },

    onItemSelect: function (oEvent) {
      const selectedItem = oEvent.getParameter("item");
      if (selectedItem) {
        UIComponent.getRouterFor(this).navTo(selectedItem.getKey());
      }
    },

    onToggleTheme: function () {
      const themeToggleButton = this.byId("themeToggleButton");
      const nextTheme = this.isDarkMode ? "sap_horizon_dark" : "sap_horizon";

      Configuration.setTheme(nextTheme);

      if (themeToggleButton) {
        themeToggleButton.setTooltip(this.isDarkMode ? "Switch to Light Mode" : "Switch to Dark Mode");
        themeToggleButton.setIcon(this.isDarkMode ? "sap-icon://dark-mode" : "sap-icon://light-mode");
      }

      this.isDarkMode = !this.isDarkMode;
    },

    onChangeLanguage: function () {
      this.getOwnerComponent().onChangeLanguage();
    },

    // Developer-only popover lets local testers switch the mocked user context.
    onPressAvatar: function (oEvent) {
      const eventSource = oEvent.getSource();
      const isActive = this.oMyAvatar.getActive();

      this.oMyAvatar.setActive(!isActive);

      Promise.resolve(this._oPopover).then(function (oPopover) {
        if (isActive) {
          oPopover.close();
        } else {
          oPopover.openBy(eventSource);
        }
      });
    },

    onPopoverClose: function () {
      this.oMyAvatar.setActive(false);
    },

    onListItemPress: function () {
      this.oMyAvatar.setActive(false);
      Promise.resolve(this._oPopover).then(function (oPopover) {
        oPopover.close();
      });
    },

    NewItempress: function () {
      const newItem = this.byId("NewItemId");
      const storedUserId = localStorage.getItem("UserId") || "";
      const storedUserRole = localStorage.getItem("UserRole") || "";

      if (newItem) {
        newItem.setTitle(`${storedUserId} - ${storedUserRole}`);
      }
    },

    onNewItemSubmit: function () {
      this._saveDeveloperValue("ChangingUserId", "UserId");
    },

    onNewItemSubmitRole: function () {
      this._saveDeveloperValue("ChangingUserRole", "UserRole");
    },

    _saveDeveloperValue: function (inputId, storageKey) {
      const input = this.byId(inputId);
      if (input) {
        localStorage.setItem(storageKey, input.getValue());
      }
    },

    onRouteMatched: function (oEvent) {
      const sRouteName = oEvent.getParameter("name");
      const sideNav = this.byId("sideNav");

      if (sideNav) {
        sideNav.setSelectedKey(sRouteName);
      }
    }
  });
});