Feat: Multiplayer sessions added using CRUD database.

templates/components/common/buttons/_buttons_save_cancel.html

@@ -0,0 +1,58 @@
+{% if block_id == 'button_save' %}
+<button id="{{ model.ID_BUTTON_SAVE }}" type="button" class="{{ model.FLAG_SUBMIT }} {{ model.FLAG_SAVE }} {{ model.FLAG_BUTTON }} {{ model.FLAG_BUTTON_PRIMARY }}">Save</button>
+{% elif block_id == 'button_cancel' %}
+<button id="{{ model.ID_BUTTON_CANCEL }}" type="button" class="{{ model.FLAG_CANCEL }} {{ model.FLAG_BUTTON }} {{ model.FLAG_BUTTON_PRIMARY }}">Cancel</button>
+{% elif block_id == 'button_add' %}
+<button type="button" class="{{ model.FLAG_ACTIVE }} {{ model.FLAG_ADD }} {{ model.FLAG_BUTTON }} {{ model.FLAG_BUTTON_PRIMARY }}">+</button>
+{% elif block_id == 'button_confirm' %}
+<button id="{{ model.ID_BUTTON_CONFIRM }}" type="button" class="{{ model.FLAG_SUBMIT }} {{ model.FLAG_BUTTON }} {{ model.FLAG_BUTTON_PRIMARY }}">Confirm</button>
+{% elif block_id == 'button_get_in_touch' %}
+<button class="{{ model.FLAG_NAV_CONTACT }} {{ model.FLAG_BUTTON }} {{ model.FLAG_BUTTON_PRIMARY }}" alt="Get in touch" aria-label="Get in touch">Get in touch</button>
+{% elif block_id == 'button_apply_filters' %}
+<button id="{{ model.ID_BUTTON_APPLY_FILTERS }}" type="button" class="{{ model.FLAG_SUBMIT }} {{ model.FLAG_BUTTON }} {{ model.FLAG_BUTTON_PRIMARY }}">Apply filters</button>
+{% elif block_id == 'button_clear_filters' %}
+{% elif block_id == 'buttons_table_default' %}
+<div class="{{ model.FLAG_CONTAINER }} {{ model.FLAG_SAVE }} {{ model.FLAG_CANCEL }} {{ model.FLAG_COLUMN }}">
+    <div class="{{ model.FLAG_ROW }}">
+        <div class="{{ model.FLAG_CONTAINER_INPUT }} {{ model.FLAG_COLUMN }}">
+            {% set block_id = 'button_apply_filters' %}
+            {% include 'components/common/buttons/_buttons_save_cancel.html' %}
+        </div>
+        {#
+            <div class="{{ model.FLAG_CONTAINER_INPUT }} {{ model.FLAG_COLUMN }}">
+                {% set block_id = 'button_add' %}
+                {% include 'components/common/buttons/_buttons_save_cancel.html' %}
+            </div>
+        #}
+        <div class="{{ model.FLAG_COLUMN }}">
+            <div class="{{ model.FLAG_CONTAINER_INPUT }}">
+                {% set block_id = 'button_save' %}
+                {% include 'components/common/buttons/_buttons_save_cancel.html' %}
+            </div>
+            {#
+            <div class="{{ model.FLAG_CONTAINER_INPUT }}">
+                {% set block_id = 'button_cancel' %}
+                {% include 'components/common/buttons/_buttons_save_cancel.html' %}
+            </div>
+            #}
+        </div>
+        <div class="{{ model.FLAG_COLUMN }}">
+            <div class="{{ model.FLAG_CONTAINER_INPUT }}">
+                {% set block_id = 'button_cancel' %}
+                {% include 'components/common/buttons/_buttons_save_cancel.html' %}
+            </div>
+        </div>
+    </div>
+</div>
+{% elif block_id == 'container_buttons_save_cancel' %}
+<div class="{{ model.FLAG_CONTAINER }} {{ model.FLAG_ROW }} {{ model.FLAG_SAVE }} {{ model.FLAG_CANCEL }}">
+    <div class="{{ model.FLAG_CONTAINER_INPUT }}">
+        {% set block_id = 'button_save' %}
+        {% include 'components/common/buttons/_buttons_save_cancel.html' %}
+    </div>
+    <div class="{{ model.FLAG_CONTAINER_INPUT }}">
+        {% set block_id = 'button_cancel' %}
+        {% include 'components/common/buttons/_buttons_save_cancel.html' %}
+    </div>
+</div>
+{% endif %}

templates/components/common/buttons/_icon_add.html

@@ -0,0 +1,17 @@
+
+{% if class_name is not defined %}
+    {% set class_name = '' %}
+{% endif %}
+
+{% if attribute_text is not defined %}
+    {% set attribute_text = '' %}
+{% endif %}
+
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"
+    class="{{ model.FLAG_BUTTON }} {{ model.FLAG_ICON }} {{ model.FLAG_ADD }} {{ class_name }}"
+    {{ attribute_text }}
+    {{ model.ATTR_VALUE_CURRENT }}="false" {{ model.ATTR_VALUE_PREVIOUS }}="false"
+>
+    <!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.-->
+    <path d="M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM232 344l0-64-64 0c-13.3 0-24-10.7-24-24s10.7-24 24-24l64 0 0-64c0-13.3 10.7-24 24-24s24 10.7 24 24l0 64 64 0c13.3 0 24 10.7 24 24s-10.7 24-24 24l-64 0 0 64c0 13.3-10.7 24-24 24s-24-10.7-24-24z"/>
+</svg>

templates/components/common/buttons/_icon_checkbox.html

@@ -0,0 +1,9 @@
+
+
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"
+    fill="{{ colour }}"
+    class="{{ model.FLAG_ICON }} {{ model.FLAG_CHECKBOX }} {{ class_name }}"
+>
+    <!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.-->
+    <path d="M64 32C28.7 32 0 60.7 0 96L0 416c0 35.3 28.7 64 64 64l320 0c35.3 0 64-28.7 64-64l0-320c0-35.3-28.7-64-64-64L64 32zM337 209L209 337c-9.4 9.4-24.6 9.4-33.9 0l-64-64c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l47 47L303 175c9.4-9.4 24.6-9.4 33.9 0s9.4 24.6 0 33.9z"/>
+</svg>

templates/components/common/buttons/_icon_hamburger.html

@@ -0,0 +1,23 @@
+
+{% if colour is not defined %}
+    {% set colour = model.COLOUR_PRIMARY %}
+{% endif %}
+{% if background_colour is not defined %}
+    {% set background_colour = model.COLOUR_ACCENT %}
+{% endif %}
+{% if id is not defined %}
+    {% set id = model.ID_BUTTON_HAMBURGER %}
+{% endif %}
+
+<div class="{{ model.FLAG_BUTTON }} {{ model.FLAG_ICON }} {{ model.FLAG_HAMBURGER }}"
+    id="{{ id }}"
+>
+    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"
+        fill="{{ colour }}"
+        class="{{ model.FLAG_BUTTON }} {{ model.FLAG_ICON }} {{ model.FLAG_HAMBURGER }}"
+        style="background-color: {{ background_colour }};"
+    >
+        <!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.-->
+        <path d="M0 96C0 78.3 14.3 64 32 64l384 0c17.7 0 32 14.3 32 32s-14.3 32-32 32L32 128C14.3 128 0 113.7 0 96zM0 256c0-17.7 14.3-32 32-32l384 0c17.7 0 32 14.3 32 32s-14.3 32-32 32L32 288c-17.7 0-32-14.3-32-32zM448 416c0 17.7-14.3 32-32 32L32 448c-17.7 0-32-14.3-32-32s14.3-32 32-32l384 0c17.7 0 32 14.3 32 32z"/>
+    </svg>
+</div>

templates/components/common/buttons/_icon_trash.html

@@ -0,0 +1,17 @@
+
+{% if class_name is not defined %}
+    {% set class_name = '' %}
+{% endif %}
+
+{% if attribute_text is not defined %}
+    {% set attribute_text = '' %}
+{% endif %}
+
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" 
+    class="{{ model.FLAG_BUTTON }} {{ model.FLAG_ICON }} {{ model.FLAG_DELETE }} {{ model.FLAG_ACTIVE }} {{ class_name }}"
+    {{ attribute_text }}
+    {{ model.ATTR_VALUE_CURRENT }}="true" {{ model.ATTR_VALUE_PREVIOUS }}="true"
+>
+    <!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.-->
+    <path d="M135.2 17.7L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-7.2-14.3C307.4 6.8 296.3 0 284.2 0L163.8 0c-12.1 0-23.2 6.8-28.6 17.7zM416 128L32 128 53.2 467c1.6 25.3 22.6 45 47.9 45l245.8 0c25.3 0 46.3-19.7 47.9-45L416 128z"/>
+</svg>

templates/components/common/buttons/_slider_display_order.html

@@ -0,0 +1,13 @@
+{% if display_order is defined %}
+{# Fix this
+    <div class="{{ model.FLAG_SLIDER }} {{ model.FLAG_DISPLAY_ORDER }}" {{ model.ATTR_VALUE_CURRENT }}="{{ display_order }}" {{ model.ATTR_VALUE_PREVIOUS }}="{{ display_order }}">☰</div>
+#}
+<input type="number" class="{{ model.FLAG_SLIDER }} {{ model.FLAG_DISPLAY_ORDER }}" 
+{{ model.ATTR_VALUE_CURRENT }}="{{ display_order }}" {{ model.ATTR_VALUE_PREVIOUS }}="{{ display_order }}" value="{{ display_order }}">
+{% else %}
+<input type="number" class="{{ model.FLAG_SLIDER }} {{ model.FLAG_DISPLAY_ORDER }}" 
+{{ model.ATTR_VALUE_CURRENT }} {{ model.ATTR_VALUE_PREVIOUS }}>
+{#
+    <div class="{{ model.FLAG_SLIDER }} {{ model.FLAG_DISPLAY_ORDER }}" {{ model.ATTR_VALUE_CURRENT }} {{ model.ATTR_VALUE_PREVIOUS }}>☰</div>
+#}
+{% endif %}

templates/components/common/inputs/_input_number_plus_minus.html

@@ -0,0 +1,17 @@
+<!-- Input Number with +/- buttons -->
+<!-- requires: 
+    Product product
+    Form_Product form - with product id attribute for accessing input element attribute
+    int tmp_quantity - placeholder
+-->
+<div class="{{ model.FLAG_CONTAINER }} {{ model.FLAG_ROW }}">
+    <div class="{{ model.FLAG_CONTAINER }} {{ model.FLAG_COLUMN }}" style="flex: none;">
+        <div class="btn-decrement" {{ model.ATTR_ID_PRODUCT }}="{{ product.id_product }}" {{ model.ATTR_ID_PERMUTATION }}="{{ permutation.id_permutation }}" {{ model.ATTR_FORM_TYPE }}="{{ form.form_type }}">-</div>
+    </div>
+    <div class="{{ model.FLAG_CONTAINER }}-input {{ model.FLAG_COLUMN }}" style="flex: none;">
+        {{ form.quantity(value=tmp_quantity) }} <!-- model.attr_id_product=product.id -->
+    </div>
+    <div class="{{ model.FLAG_CONTAINER }} {{ model.FLAG_COLUMN }}" style="flex: none;">
+        <div class="btn-increment" {{ model.ATTR_ID_PRODUCT }}="{{ product.id_product }}" {{ model.ATTR_ID_PERMUTATION }}="{{ permutation.id_permutation }}" {{ model.ATTR_FORM_TYPE }}="{{ form.form_type }}">+</div>
+    </div>
+</div>

templates/components/common/inputs/_option_blank.html

@@ -0,0 +1 @@
+<option value="0">Select</option>

templates/components/common/inputs/_td_active.html

@@ -0,0 +1,14 @@
+
+
+{% with _active = (active is not defined or active or active is none) %}
+    <td class="{{ model.FLAG_ACTIVE }}">
+        {% set attribute_text = model.ATTR_VALUE_CURRENT + '=' + _active | lower + ' ' + model.ATTR_VALUE_PREVIOUS + '=' + _active | lower + '' %}
+        {% if _active %}
+            {% set class_name = '' %}
+            {% include 'components/common/buttons/_icon_trash.html' %}
+        {% else %}
+            {% set class_name = model.FLAG_ACTIVE %}
+            {% include 'components/common/buttons/_icon_add.html' %}
+        {% endif %}
+    </td>
+{% endwith %}

templates/components/common/inputs/_td_notes.html

@@ -0,0 +1,17 @@
+
+
+{% with _notes = none if (is_blank_row or notes is not defined) else notes %}
+    {% set value_formatted = model.format_null_string_as_blank(notes) %}
+    {% set value_previous = value_formatted | escape %}
+
+    <td class="{{ model.FLAG_NOTES }}">
+        <!-- 
+            <input type="text" 
+            class="{{ model.FLAG_NOTES }}" 
+            {{ model.ATTR_VALUE_CURRENT }} {{ model.ATTR_VALUE_PREVIOUS }} />
+        -->
+        <textarea class="{{ model.FLAG_NOTES }}"
+            {{ model.ATTR_VALUE_CURRENT }}="{{ value_previous }}" {{ model.ATTR_VALUE_PREVIOUS }}="{{ value_previous }}"
+        >{{ value_formatted }}</textarea>
+    </td>
+{% endwith %}

templates/components/common/temporary/_overlay_confirm.html

@@ -0,0 +1,14 @@
+<div class="{{ model.FLAG_OVERLAY }} {{ model.FLAG_IS_COLLAPSED }} {{ model.FLAG_CARD }} {{ model.FLAG_COLUMN }}" id="{{ model.ID_OVERLAY_CONFIRM }}" style="visibility: hidden;" z-index="2">
+    <div class="{{ model.FLAG_CONTAINER }} {{ model.FLAG_ROW }}">
+        <h2>Are you sure?</h2>
+    </div>
+    <div class="{{ model.FLAG_CONTAINER }} {{ model.FLAG_ROW }}">
+        <textarea id="{{ model.ID_TEXTAREA_CONFIRM }}" rows="4" cols="50"></textarea>
+    </div>
+    <div class="{{ model.FLAG_CONTAINER }} {{ model.FLAG_ROW }}">
+        {% set block_id = 'button_cancel' %}
+        {% include 'components/common/buttons/_buttons_save_cancel.html' %}
+        {% set block_id = 'button_confirm' %}
+        {% include 'components/common/buttons/_buttons_save_cancel.html' %}
+    </div>
+</div>

templates/components/common/temporary/_overlay_error.html

@@ -0,0 +1,10 @@
+<div class="{{ model.FLAG_OVERLAY }} {{ model.FLAG_IS_COLLAPSED }} {{ model.FLAG_CARD }}" id="{{ model.ID_OVERLAY_ERROR }}" style="visibility: hidden;" z-index="2">
+    <div class="{{ model.FLAG_CONTAINER }} {{ model.FLAG_ROW }}">
+        <h2>Error:</h2>
+        <div id="{{ model.ID_LABEL_ERROR }}"></div>
+    </div>
+    <div class="{{ model.FLAG_CONTAINER }} {{ model.FLAG_ROW }}">
+        {% set block_id = 'button_cancel' %}
+        {% include 'components/common/buttons/_buttons_save_cancel.html' %}
+    </div>
+</div>

templates/components/common/temporary/template_overlay.html

@@ -0,0 +1,23 @@
+
+<!-- Overlay -->
+<!-- Requires
+    string overlay_id
+    string overlay_title
+-->
+
+<div id="{{ overlay_id }}" class="overlay">
+    <div class="{{ model.flag_card }}">
+        <div class="{{ model.flag_container }} {{ model.flag_row }}">
+            <div class="{{ model.flag_container }} {{ model.flag_column }}">
+                <h2>{{ overlay_title }}</h2>
+            </div>
+            <div class="{{ model.flag_container }} {{ model.flag_column }}">
+                <button class="{{ model.FLAG_BUTTON }} {{ model.FLAG_BUTTON_PRIMARY }} {{ model.flag_btn_overlay_close }}">Close</button>
+            </div>
+        </div>
+        <div class="{{ model.flag_container }} {{ model.flag_row }}">
+            {% block overlay_body %}{% endblock %}
+        </div>
+    </div>
+</div>
+