move loading header's icons into seperated function

and make svgs.js exportive module
create mainThread script as entry point of app

Author: 6mahdapihka9

index.html

@@ -47,10 +47,11 @@ <h1>Hometask #1 | JavaScript</h1>
         </table>
     </main>
 
-    <script src="scripts/svgs.js"></script>
-    <script src="scripts/data.js"></script>
-    <script src="scripts/HTMLBuilder.js"></script>
-    <script src="scripts/functions.js"></script>
-    <script src="scripts/form.js"></script>
+    <script  type="module" src="mainThread.js"></script>
+<!--    <script type="module" src="scripts/svgs.js"></script>-->
+<!--    <script src="scripts/data.js"></script>-->
+<!--    <script src="scripts/HTMLBuilder.js"></script>-->
+<!--    <script type="module" src="scripts/functions.js"></script>-->
+<!--    <script src="scripts/form.js"></script>-->
 </body>
 </html>

mainThread.js

@@ -0,0 +1,8 @@
+// import { archiveIcon, unarchiveIcon, editIcon, deleteIcon, ideaIcon, quoteIcon, taskIcon, thoughtIcon } from './svgs';
+import * as icons from './scripts/svgs.js';
+import { loadDataIntoTables, loadIconsIntoHeader } from './scripts/functions.js';
+
+
+loadIconsIntoHeader( icons.archiveIcon, icons.deleteIcon );
+
+loadDataIntoTables();

scripts/CRUD.js

@@ -0,0 +1,18 @@
+function loadDataIntoTables(){
+
+}
+
+function loadIconsIntoHeader(archiveIcon, deleteIcon){
+    Array.from(document.getElementsByClassName('header-icon')).forEach(col => {
+        if (col.classList.contains('archive'))
+            col.innerHTML = archiveIcon;
+        if (col.classList.contains('delete'))
+            col.innerHTML = deleteIcon;
+        // Array.from(col.getElementsByTagName('path')).forEach( path => path.classList.add('header-icon'));
+    });
+}
+
+export {
+    loadDataIntoTables,
+    loadIconsIntoHeader
+}