summaryrefslogtreecommitdiff
path: root/html/assets/js/modals/some_modal.js
diff options
context:
space:
mode:
Diffstat (limited to 'html/assets/js/modals/some_modal.js')
-rw-r--r--html/assets/js/modals/some_modal.js100
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);