error pages; js system to support back/front-end

1 files changed, 100 insertions, 0 deletions

diff --git a/html/assets/js/modals/some_modal.js b/html/assets/js/modals/some_modal.js
new file mode 100644
index 0000000..112a408
--- /dev/null
+++ b/html/assets/js/modals/some_modal.js
@@ -0,0 +1,100 @@
+// delivery options modal
+// -----------------------------------------------------------------------------
+
+// html
+var some_modal__inner_html = `
+    <div class="wrapper">
+
+        <div class="sectionTitle">
+            <div class="sectionTitle__main">
+                <h2>Πώς επιθυμείτε να πραγματοποιήσετε τις online αγορές σας;</h2>
+                <p>Επιλέξτε μια υπηρεσία για να δείτε την διαθέσιμη ποικιλία προϊόντων!</p>
+            </div>
+        </div>
+
+        <div class="radio-cards">
+            <div class="radio-cards--container outputsRow">
+
+                <label class="radio-card output output--init">
+                    <input class="state" type="radio" value="1" name="output" />
+                    
+                    <div class="output__inner">                        
+                        <p class="output__banner output--delivery"></p>
+                        <p class="output__title">Lorem Ipsum</p>
+                        <ul class="hide--under-M">
+                            <li>Vivamus nunc justo, scelerisque ut erat et, sagittis fermentum sem.</b>.</li>
+                        </ul>
+                    </div>
+                </label>
+
+                <label class="radio-card output output--init">
+                    <input class="state" type="radio" value="2" name="output" />
+                    
+                    <div class="output__inner">
+                        <p class="output__banner output--pickup"></p>
+                        <p class="output__title">Nunc eleifend</p>
+                        <ul class="hide--under-M">
+                            <li>Fusce arcu urna, pharetra nec nisi id, congue iaculis mauris.</b></li>
+                        </ul>
+                    </div>
+                </label>
+
+            </div>
+        </div>
+        <hr />
+        <p>
+        	Donec arcu magna, pretium a arcu et, tristique malesuada dolor.
+        	In fermentum ante ut dignissim laoreet.
+        	Morbi sodales ex sem, non commodo ex hendrerit eu.
+        </p>
+        <div class="btnWrap btnWrap--hCenter">
+            <button data-qa="form_back" class="button button--border">επιστροφή</button>
+            <button id="registration_submit" data-qa="form_submit" class="button widthAuto" type="submit">Επόμενο</button>
+        </div>
+    </div>`;
+
+
+
+// the modal object ------------------------------------------------------------
+////////////////////////////////////////////////////////////////////////////////
+
+var delivery_options_modal = {
+
+    classes : [ 'modal--l' ],
+
+    html : () => { return delivery_options__inner_html; },
+
+    init : function() {
+        // if cokie exist, mark slection
+        console.log('set values from cookie');
+    },
+
+    events : {
+
+        'input[name="output"]' : {
+            change : function () { 
+                v = document.querySelector('input[name="output"]:checked').value;
+                // setup cookie; keep the selected value;
+                // + set reset timeslot )in case selection is aproved
+                console.log(v);
+            }
+        },
+        
+        '.go-back' : {
+            click: function () {
+                console.log('close modal');
+            }
+        },
+
+        '#registration_submit': {
+            click: function() { window._Modals_.use('some_other_modal'); }
+        }
+
+    }
+
+}
+
+
+// attach to _Modals_
+// -----------------------------------------------------------------------------
+window._Modals_.attach('delivery-options', delivery_options_modal);