big notes with object

src/front/pages/offers.js

@@ -8,6 +8,41 @@ const TimeInput = require('../components/TimeInput');
 const BitcoinMethodCheckboxes = require('../components/BitcoinMethodCheckboxes');
 const TrustCheckboxes = require('../components/TrustCheckboxes');
 
+class BigNotesCheckbox {
+  constructor({parentElement}) {
+    this.bigNotesContainer = null;
+    this.bigNotesCheckboxElement = null;
+    this.parentElement = parentElement;
+  }
+
+  render() {
+    const container = document.createElement('div');
+    container.id = 'large-bills-area';
+    container.className = 'checkbox-row';
+
+    const checkbox = document.createElement('input');
+    checkbox.type = 'checkbox';
+    checkbox.name = 'large-bills';
+    checkbox.id = 'large-bills-checkbox';
+
+    const label = document.createElement('label');
+    label.htmlFor = 'large-bills-checkbox';
+    label.textContent = 'Se pueden usar billetes grandes (100€, 200€, 500€)';
+
+    container.appendChild(checkbox);
+    container.appendChild(label);
+
+    this.bigNotesContainer = container;
+    this.bigNotesCheckboxElement = checkbox;
+
+    this.parentElement.append(this.bigNotesContainer);
+  }
+
+  get areBigNotesAccepted(){
+    return this.bigNotesCheckboxElement.checked;
+  }
+}
+
 function offersPage() {
   const createOfferEventBus = new EventTarget();
 
@@ -85,6 +120,11 @@ function offersPage() {
 
   trustCheckboxes.render();
 
+  const bigNotesCheckbox = new BigNotesCheckbox({
+    parentElement: document.getElementById('other-area')
+  })
+
+  bigNotesCheckbox.render();
   // -----------
   const navbuttonHome = document.getElementById('navbutton-home');
   const navbuttonOffers = document.getElementById('navbutton-offers');
@@ -107,10 +147,6 @@ function offersPage() {
   );
   const viewMyOffersRoot = document.getElementById('view-my-offers-root');
 
-  const bigNotesAcceptedCheckbox = document.getElementById(
-    'large-bills-checkbox'
-  );
-
   const offerCreatedPopup = document.getElementById(
     'offer-created-confirmation'
   );
@@ -142,7 +178,7 @@ function offersPage() {
     const show_offer_to_trusted_trusted =
       trustCheckboxes.showOfferToTrustedTrusted;
     const show_offer_to_all_members = trustCheckboxes.showOfferToAllMembers;
-    const are_big_notes_accepted = bigNotesAcceptedCheckbox.checked;
+    const are_big_notes_accepted = bigNotesCheckbox.areBigNotesAccepted;
 
     const offerDetails = {
       wants,

src/views/offers.ejs

@@ -57,15 +57,6 @@
           </div>
           <div id="other-area" class="create-offer-step">
             <h3>Extras</h3>
-            <div id="large-bills-area" class="checkbox-row">
-              <input
-                type="checkbox"
-                name="large-bills"
-                id="large-bills-checkbox"
-              /><label for="large-bills"
-                >Se pueden usar billetes grandes (100€, 200€, 500€)</label
-              >
-            </div>
           </div>
           <div id="submit-button-area"></div>
           <div id="close-offer-controls-area">