Add download functionality

UI/Component/Form.js

@@ -246,16 +246,17 @@
                         response       = new jsOMS.Message.Response.Response(o);
                     let successInject  = null;
 
-                    if (typeof o.status !== 'undefined') {
-                        self.app.notifyManager.send(
-                            new jsOMS.Message.Notification.NotificationMessage(o.status, o.title, o.message), jsOMS.Message.Notification.NotificationType.APP_NOTIFICATION
-                        );
-                    }
-
                     if ((successInject = form.getSuccess()) !== null) {
                         successInject(response);
                     } else if (typeof response.get(0) !== 'undefined' && typeof response.get(0).type !== 'undefined') {
+                        // todo: am i using this now and should all cases be handled with the successInjection?
+                        // maybe there could be global response actions where injecting them to every form would not make any sense
+                        // however not many if any use cases come to mind right now where this would be necessary
                         self.app.responseManager.run(response.get(0).type, response.get(0), request);
+                    } else if (typeof o.status !== 'undefined') {
+                        self.app.notifyManager.send(
+                            new jsOMS.Message.Notification.NotificationMessage(o.status, o.title, o.message), jsOMS.Message.Notification.NotificationType.APP_NOTIFICATION
+                        );
                     }
                 } catch (e) {
                     console.log(e);

UI/Component/Table.js

@@ -87,6 +87,8 @@
 
             this.unbind(id);
 
+            this.bindExport(this.tables[id]);
+
             // todo: sorting: increasing / decreasing only if icons are available
             // todo: filtering: equals (alphanumeric), greater, greater equals, lesser, lesser equals, contains, doesn't contain, excel like selection of elements. Amount of filtering options unlimited.
             // cell value should be data-value="" and cell name should be data-name="" and cell content should be data-content="".
@@ -117,6 +119,26 @@
             }
         };
 
+        /**
+         * Export a table
+         *
+         * @param {Element} exports Export button
+         *
+         * @return {void}
+         *
+         * @since  1.0.0
+         */
+        bindExport(exports)
+        {
+            exports.getExport().addEventListener('click', function (event)
+            {
+                console.log(exports.serialize());
+                // todo: either create download in javascript from this data or make roundtrip to server who then sends the data
+                // - think about allowing different export formats (json, csv, excel)
+                // - maybe this should never be done from the ui, maybe a endpoint uri should be specified which then calls the api get function for this data
+            });
+        };
+
         /**
          * Removes the closest row on click.
          *
@@ -127,7 +149,7 @@
          *
          * @since  1.0.0
          */
-        bindRemovable(remove, id)
+        bindRemovable(table)
         {
             remove.addEventListener('click', function (event)
             {

Views/TableView.js

@@ -35,6 +35,60 @@
             const e = document.getElementById(this.id);
         };
 
+        /**
+         * Serialize table data
+         *
+         * @return {object}
+         *
+         * @since 1.0.0
+         */
+        serialize()
+        {
+            const table = document.getElementById(this.id);
+            let data = {
+                caption: null,
+                header: [],
+                rows: []
+            };
+
+            data.caption = table.getElementsByTagName('caption')[0].innerText;
+
+            const header = table.querySelectorAll('thead tr td, thead tr th'),
+                headerLength = header.length;
+
+            for (let i = 0; i < headerLength; ++i) {
+                data.header.push(header[i].innerText);
+            }
+
+            const rows = table.querySelectorAll('tbody tr'),
+                rowsLength = rows.length;
+
+            for (let i = 0; i < rowsLength; ++i) {
+                data.rows[i] = [];
+
+                const columns = rows[i].querySelectorAll('td, th'),
+                    columnLength = columns.length;
+
+                for (let j = 0; j < columnLength; ++j) {
+                    data.rows[i].push(columns[j].innerText);
+                }
+            }
+
+            return data;
+        }
+
+        /**
+         * Get table export button
+         *
+         * @return {HTMLElement}
+         *
+         * @since 1.0.0
+         */
+        getExport()
+        {
+            return document.querySelectorAll('#' + this.id + ' .download')[0];
+        };
+
         /**
          * Get table header elements which provide sorting
          *