Advertisement
EntropyStarRover

Venue info_skeleton

Nov 19th, 2019
259
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. let username = "guest";
  2. let password = "pass";
  3. let venueInfo = document.getElementById("venue-info");
  4. let venueDate = document.getElementById("venueDate");
  5.  
  6. let getVenuesBtn = document.getElementById("getVenues");
  7.  
  8. let hiddenDivs = [];
  9.  
  10. function createHeader(username, password) {
  11.     let auth = `Basic ${btoa(`${username}:${password}`)}`;
  12.     let headers = {
  13.         'Content-type': 'application/json',
  14.         "Authorization": auth
  15.     };
  16.     return headers;
  17. }
  18.  
  19.  
  20. let headers = createHeader(username, password);
  21. getVenuesBtn.addEventListener("click", load)
  22.  
  23. async function load() {
  24.     let vd = venueDate.value;
  25.  
  26.     try {
  27.         venueInfo.innerHTML="";
  28.         let response = await fetch(`https://baas.kinvey.com/rpc/kid_BJ_Ke8hZg/custom/calendar?query=${vd}`, {
  29.             method: "POST",
  30.             headers: headers
  31.         });
  32.  
  33.         let events = await response.json();
  34.         events.forEach(id => {
  35.             getInfoAboutVenue(id);
  36.         });
  37.  
  38.     } catch {
  39.         alert("No events in the calendar!");
  40.     }
  41. }
  42.  
  43. async function getInfoAboutVenue(id) {
  44.     try {
  45.         let response = await fetch(`https://baas.kinvey.com/appdata/kid_BJ_Ke8hZg/venues/${id}`, {
  46.             method: "GET",
  47.             headers: headers
  48.         });
  49.  
  50.         let eventInfo = await response.json();
  51.         display(eventInfo);
  52.  
  53.     } catch {
  54.         alert("couldn't fetch info about the events")
  55.     }
  56. }
  57.  
  58. function display(eventInfo) {
  59.     console.log(`i got this fucker ${eventInfo}`)
  60.  
  61.     let tmplt = document.createElement("div");
  62.     tmplt.setAttribute("id", `${eventInfo._id}`)
  63.     tmplt.innerHTML = `
  64.  
  65.   <span class="venue-name"><input class="info" id="btn${eventInfo._id}"  type="button" value="More info">${eventInfo.name}</span>
  66.   <div class="venue-details" style="display: none;">
  67.       <table>
  68.           <tr>
  69.               <th>Ticket Price</th>
  70.               <th>Quantity</th>
  71.               <th></th>
  72.           </tr>
  73.           <tr>
  74.               <td class="venue-price">${eventInfo.price} lv</td>
  75.               <td><select class="quantity">
  76.                       <option value="1">1</option>
  77.                       <option value="2">2</option>
  78.                       <option value="3">3</option>
  79.                       <option value="4">4</option>
  80.                       <option value="5">5</option>
  81.                   </select></td>
  82.               <td><input class="purchase" type="button" value="Purchase"></td>
  83.           </tr>
  84.       </table>
  85.       <span class="head">Venue description:</span>
  86.       <p class="description">${eventInfo.description}</p>
  87.       <p class="description">Starting time: ${eventInfo.startingHour}</p>
  88.   </div>`;
  89.     venueInfo.appendChild(tmplt);
  90.  
  91.     let detailsBtn = document.getElementById(`btn${eventInfo._id}`);
  92.     let hiddenDiv = document.getElementById(tmplt.id).getElementsByClassName("venue-details")[0];
  93.     hiddenDiv.setAttribute("id", `hidden ${tmplt.id}`)
  94.     hiddenDivs.push(hiddenDiv);
  95.     detailsBtn.addEventListener("click", function () {
  96.         showDetails(tmplt.id, eventInfo.price, eventInfo.name)
  97.     })
  98. }
  99.  
  100. function showDetails(id, price, name) {
  101.     hiddenDivs.forEach(hd => {
  102.         if (hd.id.split(" ")[1] == id) {
  103.             hd.style.display = "block";
  104.         } else {
  105.             hd.style.display = "none";
  106.         }
  107.     })
  108.  
  109.     let purchaseButton = document.getElementById(id).getElementsByClassName("purchase")[0];
  110.     purchaseButton.addEventListener("click", function () {
  111.         purchase(id, price, name)
  112.     })
  113. }
  114.  
  115. function purchase(id, price, name) {
  116.     let quantitySelect = document.getElementById(id).getElementsByClassName("quantity")[0];
  117.     let q = quantitySelect.value;
  118.     let totalPrice = Number(price) * Number(q);
  119.  
  120.     //confirmation window
  121.     let confirmDiv = document.createElement("div");
  122.     confirmDiv.innerHTML = `
  123. <span class="head">Confirm purchase</span>
  124. <div class="purchase-info">
  125.     <span>${name}</span>
  126.     <span>${q} x ${price}</span>
  127.     <span>Total: ${totalPrice} lv</span>
  128.     <input type="button" value="Confirm">
  129. </div>`
  130.     confirmDiv.setAttribute("id", `confirm${id}`);
  131.     venueInfo.innerHTML = "";
  132.     venueInfo.appendChild(confirmDiv);
  133.     let confirmButton = document.getElementById(confirmDiv.id).getElementsByTagName("input")[0];
  134.     confirmButton.addEventListener("click", function () {
  135.         confirmPurchase(id, q)
  136.     })
  137. }
  138.  
  139. async function confirmPurchase(id, q) {
  140.     try {
  141.         console.log(`confirm purchase ${id},${q}`);
  142.         let response = await fetch(`https://baas.kinvey.com/rpc/kid_BJ_Ke8hZg/custom/purchase?venue=${id}&qty=${q} `, {
  143.             method: "POST",
  144.             headers: headers
  145.         });
  146.  
  147.         let ticket = await response.json();
  148.         let ticketHtml = ticket.html;
  149.         let ticketDiv = document.createElement("div");
  150.         ticketDiv.innerHTML = ticketHtml;
  151.         let paragraph = document.createElement("p");
  152.         paragraph.textContent = "You may print this page as your ticket";
  153.         venueInfo.innerHTML = "";
  154.         venueInfo.append(paragraph, ticketDiv);
  155.  
  156.     } catch {
  157.         alert("Purchase failed")
  158.     }
  159. }
Advertisement
RAW Paste Data Copied
Advertisement