fix module script type limitations

assets/js/libs/bulma-notifications.js

@@ -0,0 +1,78 @@
+export default class BulmaNotification {
+    constructor() {
+        // Create DOM notification structure when instantiated
+        this.init();
+    }
+
+    init() {
+        this.hideTimeout = null;
+
+        // Creating the notification container div
+        this.containerNode = document.createElement("div");
+        this.containerNode.className = "notification note";
+
+        // Adding the notification title node
+        this.titleNode = document.createElement('p');
+        this.titleNode.className = "note-title";
+
+        // Adding the notification message content node
+        this.messageNode = document.createElement('p');
+        this.messageNode.className = "note-content";
+
+        // Adding a little button on the notification
+        this.closeButtonNode = document.createElement('button');
+        this.closeButtonNode.className = "delete";
+        this.closeButtonNode.addEventListener('click', () => {
+            this.close();
+        });
+
+        // Appending the container with all the elements newly created
+        this.containerNode.appendChild(this.closeButtonNode);
+        this.containerNode.appendChild(this.titleNode);
+        this.containerNode.appendChild(this.messageNode);
+
+        // Inserting the notification to the page body
+        document.body.appendChild(this.containerNode);
+    }
+
+    // Make the notification visible on the screen
+    show(title, message, context, duration) {
+        clearTimeout(this.hideTimeout);
+        this.containerNode.classList.add("note-visible");
+
+        // Setting a title to the notification
+        if (title != undefined)
+            this.titleNode.textContent = title;
+        else
+            this.titleNode.textContent = "Notification Title"
+
+        // Setting a message to the notification
+        if (message != undefined)
+            this.messageNode.textContent = message;
+
+        // Applying Bulma notification style/theme
+        if (context) {
+            this.containerNode.classList.add(`is-${context}`);
+        } else {
+            this.containerNode.classList.add('is-info');
+        }
+
+        // Default duration delay
+        if (duration == undefined)
+            duration = 1500;
+        else if (duration <= 0 && duration != -1) {
+            console.error('Bulma-notifications : the duration parameter value is not valid.' + "\n" +
+                'Make sure this value is strictly greater than 0.');
+        } else if (duration != -1) {
+            // Waiting a given amout of time  
+            this.hideTimeout = setTimeout(() => {
+                this.close();
+            }, duration);
+        }
+    }
+
+    // Hide notification
+    close() {
+        this.containerNode.classList.remove("note-visible");
+    }
+}

index.html

@@ -41,7 +41,7 @@
   </div>
   <!-- Insert this line after script imports -->
   <script>if (window.module) module = window.module;</script>
-  <script src="./renderer.js" type="module"></script>
+  <script src="./renderer.js"></script>
 
 </head>
 
@@ -196,12 +196,12 @@
       }
     }
 
-    function miam(mess, type){
+    function miam(mess, type, duration = 1000){
       bulmaToast.toast({
         message: mess, 
         type: type,
         dismissible: true,
-        duration: 1000,
+        duration: duration,
         position: "top-left",
         "single": false,
         // animate: { in: 'fadeIn', out: 'fadeOut' }
@@ -240,6 +240,8 @@
         }
       }
     });
+
+    miam( "Press 'P' to open the Menu.", 'is-info', 4000)
   </script>
 
 </body>