NikolayBezay

Untitled

Jun 7th, 2021
185
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.02 KB | None | 0 0
  1. ==============================dynamic carousel from google sheet ===========================
  2. <script>
  3. (function() {
  4. var DOC_KEY = '1D0AzyzWhREOJ_vbUkLHe09YNSjG4b0IZnhe6T6S79tw';
  5. var API_KEY = 'AIzaSyDB7Mk0_X06DqZHWlllSOont--5XAZ4tao';
  6. var SHEET_PAGE = 'Sheet1';
  7. var SHEET_SCOPE = '!A2:D40';
  8.  
  9. function fillDynamicContent(dataArray) {
  10. console.log(dataArray);
  11.  
  12. var carousel = document.querySelector('.adoricCustomProductsCarousel');
  13. var thumbTemplate = carousel.querySelector('.slider-item.tmp-cloned').cloneNode(true);
  14. carousel.innerHTML = '';
  15. carousel.appendChild(thumbTemplate);
  16. dataArray.forEach(function(pr) {
  17. var duplicateThumb = thumbTemplate.cloneNode(true);
  18. duplicateThumb.querySelector('IMG.inner-element').src = pr[0];
  19. duplicateThumb.querySelector('SPAN.adoricCustomTitle.inner-element FONT').innerText = pr[1];
  20. duplicateThumb.querySelector('.element-button.adoric-slider-item-inner A').href = pr[3];
  21. duplicateThumb.querySelector('SPAN.adoricCustomPrice.inner-element').innerHTML = pr[2];
  22. carousel.appendChild(duplicateThumb);
  23. });
  24. }
  25.  
  26. var URL = "https://sheets.googleapis.com/v4/spreadsheets/" + DOC_KEY + "/values/" + SHEET_PAGE + SHEET_SCOPE + "?key=" + API_KEY;
  27. var data = null;
  28. var xhr = new XMLHttpRequest();
  29. xhr.addEventListener("readystatechange", function() {
  30. if (this.readyState === 4) {
  31. var result = JSON.parse(this.responseText);
  32. var dataArray = result.values;
  33. console.log(dataArray);
  34. if(dataArray.length > 4) {
  35. fillDynamicContent(dataArray);
  36. }
  37.  
  38. }
  39. });
  40. xhr.open("GET", URL);
  41. xhr.setRequestHeader("cache-control", "no-cache");
  42. xhr.send(data);
  43. })();
  44. </script>
Advertisement
Add Comment
Please, Sign In to add comment