[merge] pull request #21 from akrck02/dev

Dev

Author: akrck02

app/styles/src/components/notification/Notification.css

@@ -31,7 +31,7 @@ notification #nt-bar.hidden{
 }
 
 notification #nt-bar #nt-title{
-    font-size : 1.25rem"
+    font-size : 1.25rem;
 }
 
 notification #nt-content {

container/deploy/.gitkeep

@@ -1,11 +1,10 @@
 import Router from "./views/Router.js";
-import { getParametersByIndex } from "./lib/gtd/data/urltools.js";
-import { TextBundle } from "./lang/TextBundle.js";
+import  URLs from "./lib/gtdf/data/Urls.js";
 import { Config } from "./config/Config.js";
 import { Events, IEvents } from "./core/events/Events.js";
 import Keyboard from "./core/events/Keyboard.js";
 import NotificationUI, { NotificationProperties } from "./components/notifications/Notification.js";
-
+import Initializer from "./core/Initializer.js";
 
 /**
  * Class that represents the application frontend proccess
@@ -19,19 +18,18 @@ export default class App {
     private notification : NotificationUI;
 
     /**
-     * Create an instance of the application
+     * Create an instance of the apjplication
      */
     constructor(){        
+       
         this.router = new Router();
         this.events = Events;
-
         Keyboard.setEventListeners(this.events);
 
         // Set the notification element
         this.notification = new NotificationUI();
         document.body.appendChild(this.notification.element);
         this.setNoficationSystem();
-        console.log("App loaded!");
     }
 
     /**
@@ -45,8 +43,11 @@ export default class App {
      * The first parameter must be a view name, otherwise the 
      * app will redirect the user to an 404 error page.
      */
-    load(){
-        const params = getParametersByIndex(window.location.hash.slice(1).toLowerCase(),1);
+    async load(){
+        await Initializer.subscribeInitializables();
+        await Initializer.notify();
+
+        const params = URLs.getParametersByIndex(window.location.hash.slice(1).toLowerCase(),1);
         this.router.load(params);
     }
 
@@ -65,8 +66,8 @@ export default class App {
             // If the desktop notification are active 
             if(properties.desktop){
 
-                new Notification(Config.BASE.APP_NAME ,{
-                    icon: Config.PATHS.ICONS + "logo.svg",
+                new Notification(Config.Base.app_name ,{
+                    icon: Config.Path.icons + "logo.svg",
                     body: properties.message,
                 })
             }
@@ -75,15 +76,5 @@ export default class App {
 
     }
 
-    /**
-     * Get current language text bundle
-     * @returns The text bundle int the current app language.
-     */
-     public static getBundle() : any {
-        let lang = Config.getLanguage();
-        return TextBundle.get(lang);
-    }
-
 }
 
-

container/develop/.gitkeep

@@ -1,16 +1,15 @@
 import App from "./App.js";
-import { Config } from "./config/Config.js";
+import { Config, Configuration } from "./config/Config.js";
 
 
 export let app : App; 
 
-
 /**
  * When the dynamic URL changes loads 
  * the correspoding view from the URL
  */
-window.addEventListener('hashchange',() => {
-    app.load()
+window.addEventListener('hashchange',async () => {
+    await app.load()
 });
 
 /**
@@ -20,9 +19,8 @@ window.addEventListener('hashchange',() => {
 window.onload = async () => {    
 
     if(app === undefined){
-        await Config.setDefaultVariables();
         app = new App();   
     }
 
-    app.load();
+    await app.load();
 }

frontend/src/App.ts

@@ -1,5 +1,5 @@
-import { getMaterialIcon } from "../../lib/gtd/material/materialicons.js";
-import { setClasses, setStyles, UIComponent } from "../../lib/gtdf/components/uicomponent.js";
+import MaterialIcons from "../../lib/gtdf/resources/MaterialIcons.js";
+import { UIComponent } from "../../lib/gtdf/components/UIComponent.js";
 
 export interface NotificationProperties {
     title ?: string,
@@ -53,7 +53,7 @@ export default class NotificationUI extends UIComponent {
             this.bar.element.classList.remove("hidden");
             this.bar.appendChild(title);
         } else { 
-            setClasses(this.bar.element,["hidden"])
+            this.bar.setClasses(["hidden"])
         }
 
         if(properties.message){
@@ -66,18 +66,18 @@ export default class NotificationUI extends UIComponent {
         }
 
         if(properties.icon) {
-            const icon = getMaterialIcon(properties.icon,{size: "1.25rem" , fill: "#404040"});
+            const icon = MaterialIcons.get(properties.icon,{size: "1.25rem" , fill: "#404040"});
             this.content.appendChild(icon);
         }
     }
 
     public async show(seconds : number = 1) {
 
         if(this.showing)
-        return;
+            return;
 
         setTimeout(() => {
-           setClasses(this.element,["show"])
+           this.setClasses(["show"])
         }, 1);
 
         this.showing = true;

frontend/src/Start.ts

@@ -1,5 +1,5 @@
-import { getMaterialIcon } from "../../lib/gtd/material/materialicons.js";
-import { setEvents, UIComponent } from "../../lib/gtdf/components/uicomponent.js";
+import MaterialIcons from "../../lib/gtdf/resources/MaterialIcons.js";
+import { UIComponent } from "../../lib/gtdf/components/UIComponent.js";
 
 
 export interface StringMap {
@@ -33,16 +33,19 @@ export default class Select extends UIComponent {
         });
         displayBox.appendTo(this);
 
-        setEvents(displayBox.element, {
+        displayBox.setEvents({
             click : (e : Event) => {
+                
                 e.preventDefault();
                 e.stopPropagation();
 
                 if(this.element.classList.contains("show")){
                     this.element.classList.remove("show");
-                } else {
-                    this.element.classList.add("show")
-                }
+                    return;
+                } 
+                
+                this.element.classList.add("show")
+                
             }
         })
 
@@ -55,8 +58,8 @@ export default class Select extends UIComponent {
         })
         this.display.appendTo(displayBox);
 
-        const icon = getMaterialIcon("expand",{
-            size: "1rem",
+        const icon = MaterialIcons.get("expand",{
+            size: "1.15em",
             fill: "#404040"
         })
 
@@ -81,7 +84,7 @@ export default class Select extends UIComponent {
                 },
             })
 
-            setEvents(option.element, {
+            option.setEvents({
                 click : () =>{
                     onclick(option.element.dataset.value);
                 }