From b98c3be3bef21a82cdb2e1100f6d5f472314e3f9 Mon Sep 17 00:00:00 2001
From: chris <chris@denkblock.mas>
Date: Mon, 7 Oct 2024 21:21:55 +0200
Subject: [PATCH] REFA,DOC: several things

---
 README.md        |  5 +++++
 join_js_files.sh | 25 ++++++++++++++++++++++---
 src/builder.js   |  5 ++++-
 3 files changed, 31 insertions(+), 4 deletions(-)

diff --git a/README.md b/README.md
index 4608ac5..ccbf2d6 100644
--- a/README.md
+++ b/README.md
@@ -32,3 +32,8 @@ Javascript is by far not my strongest field,
 typescript even less.
 So it is recommended to not expect to much,
 you have been warned.
+
+
+```sh
+sh join_js_files.sh
+```
\ No newline at end of file
diff --git a/join_js_files.sh b/join_js_files.sh
index 90388b8..ba841de 100644
--- a/join_js_files.sh
+++ b/join_js_files.sh
@@ -1,9 +1,28 @@
 TARGET="jpc-like-websites.js"
-SRC="src/js"
-ORDERED_LIST="alignment.js arrangement.js color.js commonEvents.js componentAttribute.js sizeSideDependence.js modifier.js context.js component.js baseComponents.js  builder.js"
+SRC="src"
+
+SUB_LIST="siding.js shapes.js border.js dimensions.js"
+MODIFIERS_LIST="alignment.js arrangement.js modifier.js" 
+HIGHER_LIST="commonEvents.js context.js component.js baseComponents.js  builder.js"
 
 echo "" > $TARGET
+echo "/* ## color.js ## */" >> $TARGET
+cat $SRC/color.js >> $TARGET
+
+echo "/* # SUB_LIST # */" >> $TARGET
+for i in $SUB_LIST; do
+    echo "/* ## $i ## */" >> $TARGET
+    cat $SRC/sizeSide/$i >> $TARGET
+done
+
+echo "/* # MODIFIERS_LIST # */" >> $TARGET
+for i in $MODIFIERS_LIST; do
+    echo "/* ## $i ## */" >> $TARGET
+    cat $SRC/$i >> $TARGET
+done
 
-for i in $ORDERED_LIST; do
+echo "/* # HIGHER_LIST # */" >> $TARGET
+for i in $HIGHER_LIST; do
+    echo "/* ## $i ## */" >> $TARGET
     cat $SRC/$i >> $TARGET
 done
diff --git a/src/builder.js b/src/builder.js
index 247ef9e..9302e39 100644
--- a/src/builder.js
+++ b/src/builder.js
@@ -1,3 +1,6 @@
+/**
+ * Method Collection with predefined HTMLElements
+ */
 const builder = {
      components: {
           parent: {},
@@ -13,7 +16,7 @@ const builder = {
       * @param {Map<string,string>} attr 
       * @returns {Component}
       */
-     genTag: function (tag, attr = {}) { return new Component(document.createElement(tag), attr); },
+     genTag: function (tag, attr = {}) { return new Component(document.createElement(tag), attr).addStyleClass(`el-${tag}`); },
 
      /**
       *