Advertisement
NikolayBezay

Adoric Snippets

Mar 26th, 2024
206
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 63.04 KB | None | 0 0
  1. https://adoric.atlassian.net/browse/ADORIC-5232
  2.  
  3. sessionStorage:
  4. adoric_referrer_url
  5.  
  6. UTM test parameters:
  7.  
  8. ?adoricnikotest&utm_source=utm_source-testValue&utm_medium=utm_medium-testValue&utm_campaign=utm_campaign-testValue&utm_term=utm_term-testValue&utm_content=utm_content-testValue
  9.  
  10. //показать все лайтбоксы на странице:
  11. <script>
  12. adoric.lightboxes.filter(function(lb) { return lb.isShowing})
  13. </script>
  14.  
  15. <a href="javascript:void(0)"></a>
  16. javascript:void(0)
  17. <style>
  18. .featured.module:nth-of-type(3n+3) {
  19. padding-right:0;
  20. background:red;
  21. }
  22. </style>
  23.  
  24. {
  25. "versionId":"649c3c17b6c3cf0cc3556613",
  26. "identifier":"__ADORIC__2",
  27. "campaignId":"649c3c17b6c3cf0cc3556614",
  28. "campaignTitle":"קמפיין צריכים עזרה אזור אישי",
  29. "versionTitle":"Variation #1",
  30. "currentStep":0,
  31. "domainId":"64648a8870a1a321990fef00",
  32. "device":"mobile"
  33. }
  34.  
  35.  
  36. node.outerHTML => convert HTML element to string
  37.  
  38. pattern="[0-9]{9,10}" => phone validation pattern
  39. pattern="[0-9]{10,11}"
  40. pattern="[0][0-9]{9}"
  41. pattern="^[0-9]*$" => only digits
  42.  
  43. as for zoom on iPhones. Add please this embed code to mobile lightboxes
  44. <style>INPUT.element-input-text {font-size: 16px !important}</style>
  45.  
  46. ======================================================================================================================================
  47. Youtube Embed - Autoplay, Loop, Responsive with No Controls!
  48. https://forum.webflow.com/t/youtube-embed-autoplay-loop-responsive-with-no-controls/25041
  49. https://www.youtube.com/embed/1F6aj05cIq8?autoplay=1&amp;loop=1&amp;playlist=1F6aj05cIq8
  50.  
  51.  
  52. https://www.youtube.com/embed/DsaC9Wd81Gw?autoplay=1&amp;mute=1&amp;loop=1&amp;playlist=DsaC9Wd81Gw
  53. ======================================================================================================================================
  54. pattern="([A-Za-z\u05D0-\u05F3 ]{1,150})" => name Hebrew and English symbols validation pattern
  55.  
  56. pattern="\d{1,2}/\d{1,2}/\d{4}" placeholder="dd/mm/yyyy"
  57.  
  58.  
  59.  
  60. <script>
  61. (function() {
  62. function updateZindex() {
  63. var currentCanvas = document.querySelector('.' + self.identifier + '.__ADORIC__ [tabindex]');
  64. currentCanvas.style.zIndex = '10';
  65. currentCanvas.parentNode.style.zIndex = '10';
  66. }
  67. updateZindex();
  68. setTimeout(function() {
  69. updateZindex();
  70. }, 1000);
  71. window.addEventListener('resize', function() {
  72. updateZindex();
  73. });
  74. window.addEventListener('scroll', function() {
  75. updateZindex();
  76. });
  77. })();
  78. </script>
  79.  
  80.  
  81. adoric.lightboxes.forEach(function(item) {
  82. if (item.isShowing && item.options.campaignId === self.campaignId) {
  83. item.close(4);
  84. }
  85. });
  86.  
  87.  
  88. ===============================Wait element by selector ===========================
  89. <script>
  90. var productsTimer = 10;
  91.  
  92. function waitPageProducts() {
  93.  
  94. productsTimer--;
  95. var pageProducts = document.querySelectorAll('.product-details-container');
  96.  
  97. if (pageProducts.length < 1 && productsTimer > 0) {
  98. setTimeout(waitPageProducts, 500);
  99. } else {
  100. checkProductList();
  101. }
  102. }
  103. waitPageProducts();
  104. </script>
  105.  
  106. <script >
  107. document.addEventListener('DOMNodeInserted', OnNodeInserted, false);
  108. function OnNodeInserted(event) {
  109. if (event.target.classList.contains('details-list-container')) {
  110. adoric && adoric.trigger('showAdoricCouponCampaign');
  111. }
  112. }
  113. </script>
  114.  
  115. ===================================================================================
  116.  
  117. <script>
  118. (function() {
  119. var NEW_CTA_LINK = 'https://iqosclubcanarias.com/client/';
  120. var ELEMENTS_TO_UPDATE = [
  121. '#main section a[href="https://www.myiqos.es/friends"]',
  122. '#main #Enjoy-privileges a[href="https://www.myiqos.es/friends"]',
  123. '#main #Enjoy-privileges a[href="https://www.myiqos.es/exclusive"]',
  124. '#main #Enjoy-privileges a[href="https://www.myiqos.es/life"]',
  125. '#main #Enjoy-privileges a[href="https://www.myiqos.es/for-you"]',
  126. ];
  127. function updatePageLinksForCanary() {
  128. ELEMENTS_TO_UPDATE.forEach(function(selector) {
  129. document.querySelector(selector).setAttribute('href', NEW_CTA_LINK);
  130. });
  131. }
  132.  
  133. if (document.readyState === 'loading') {
  134. document.addEventListener('DOMContentLoaded', updatePageLinksForCanary);
  135. } else {
  136. updatePageLinksForCanary();
  137. }
  138. })();
  139. </script>
  140.  
  141. ==============================get lb id ========================================
  142. console.log(item.options.campaignTitle);
  143.  
  144.  
  145. function getLbIdentifier(campaignId) {
  146. var lbIdentifier = null;
  147. window.adoric && adoric.lightboxes.forEach(function(item) {
  148. if (item.options.campaignId === campaignId) {
  149. lbIdentifier = item.identifier;
  150. }
  151. });
  152. return lbIdentifier;
  153. }
  154.  
  155. var res = getLbIdentifier('5da83882f4a10c00109e49d4');
  156. console.log(res);
  157.  
  158. =========================set IMPORTANT CSS Style===============================
  159. .setProperty('display', 'flex', 'important');
  160. ===============================================================================
  161.  
  162.  
  163. =========================== INPUT VALIDATION ===========================
  164. var phone = document.querySelector('#ADORIC_dynamicParamsForm2 INPUT[name="fld_40487"]');
  165. var submit = document.querySelector('#ADORIC_dynamicParamsForm2 INPUT[name="submit"]');
  166. document.querySelector('#ADORIC_dynamicParamsForm2 INPUT[name="fld_40487"]').addEventListener("input", function() {
  167. if (isValidPhoneNumber(this.value)) {
  168. this.style.border = "none";
  169. submit.disabled = false;
  170. } else {
  171. this.style.border = "1px solid red";
  172. submit.disabled = true;
  173. }
  174. });
  175.  
  176. =========================== touch event trigger ==============================================
  177.  
  178. var e = new Event('touchstart');
  179. target.dispatchEvent(e);
  180.  
  181.  
  182. =========================== Open URL in new tab ==============================================
  183. function openInNewTab(url) {
  184. var win = window.open(url, '_blank');
  185. win.focus();
  186. }
  187.  
  188.  
  189. =========================== Custom validation messages ==============================================
  190. <input type="text" id="username" required placeholder="Enter Name"
  191. oninvalid="this.setCustomValidity('Enter User Name Here')"
  192. oninput="this.setCustomValidity('')" />
  193.  
  194. oninvalid="if(this.value.indexOf('@') != -1) {this.setCustomValidity('Standart error message about @')} else {this.setCustomValidity('Enter User Email Here')}""
  195.  
  196. ======================================= Add UTM to FORM ===========================================
  197. function getUrlParameter(name) {
  198. name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
  199. var regex = new RegExp("[\\?&]" + name + "=([^&#]*)");
  200. var results = regex.exec(location.search);
  201. return results === null ? '' : decodeURIComponent(results[1].replace(/\+/g, " "));
  202. }
  203.  
  204. function addHiddenInput(name, val) {
  205. var inp = document.createElement('INPUT');
  206. inp.type = 'hidden';
  207. inp.name = name;
  208. inp.value = val;
  209. $form.appendChild(inp);
  210. }
  211. if (getUrlParameter('utm_source')) {
  212. addHiddenInput('utm_source', getUrlParameter('utm_source'));
  213. }
  214. if (getUrlParameter('utm_medium')) {
  215. addHiddenInput('utm_medium', getUrlParameter('utm_medium'));
  216. }
  217. if (getUrlParameter('utm_campaign')) {
  218. addHiddenInput('utm_campaign', getUrlParameter('utm_campaign'));
  219. }
  220. if (getUrlParameter('utm_term')) {
  221. addHiddenInput('utm_term', getUrlParameter('utm_term'));
  222. }
  223. if (getUrlParameter('utm_content')) {
  224. addHiddenInput('utm_content', getUrlParameter('utm_content'));
  225. }
  226. ===========================JSON to URI ================================================================
  227. function jsonToURI(json) {
  228. var s = [];
  229. Object.keys(json).forEach(function(key) {
  230. s.push(encodeURIComponent(key) + '=' + encodeURIComponent(json[key]))
  231. });
  232. return s.join('&');
  233. }
  234. ======================================= send data to Adoric list ===========================================
  235. <script>
  236. (function() {
  237. function getCampaignData(campaignId) {
  238. var campaignData = null;
  239. window.adoric && adoric.lightboxes.forEach(function(item) {
  240. if (item.options.campaignId === campaignId) {
  241. campaignData = item;
  242. }
  243. });
  244. return campaignData;
  245. }
  246. var allCampaignData = getCampaignData('5d89fcd6c7ffd20019734884');
  247. var form = document.getElementById('adoricCustomAPOSLeadInpage');
  248. form.addEventListener('submit', function() {
  249. adoric.Util.ajax("https://api.adoric-om.com/list/subscribe", "POST", {
  250. subscribe: {
  251. "name": form.querySelector('INPUT[name="fld_60897"]').value,
  252. "phone": form.querySelector('INPUT[name="fld_60898"]').value,
  253. "list": form.querySelector('INPUT[name="list"]').value
  254. },
  255. referrer: document.referrer,
  256. country: sessionStorage.getItem('country_code_cache'),
  257. campaignData: {
  258. options: {
  259. id: allCampaignData.id,
  260. userId: allCampaignData.options.userId,
  261. domainId: allCampaignData.statistic.domainId,
  262. accountId: allCampaignData.options.userId,
  263. campaignTitle: allCampaignData.options.campaignTitle,
  264. title: allCampaignData.options.title,
  265. type: allCampaignData.options.type
  266. }
  267. }
  268. }, function test(response, XMLHttpRequest) {
  269. console.log('calback response - ', response, XMLHttpRequest);
  270. });
  271. });
  272. })();
  273.  
  274. adoric.on("form:before:submit", function(params) {
  275. if (params.target.classList.contains("ADORIC_Double_Integration_Form")) {
  276. var formData = adoric.Util.serializeListForm(document.querySelector(".__ADORIC__ FORM.inner-element"));
  277. formData.subscribe.list = "5e3bd85f136615001756c58a";
  278. formData.campaignData = {
  279. options: {
  280. id: params.lightboxId,
  281. userId: params.lightbox.options.userId,
  282. domainId: "5e01ea6ff9f749001089d4a9",
  283. accountId: params.lightbox.options.userId,
  284. campaignTitle: params.lightbox.options.campaignTitle,
  285. title: params.lightbox.options.title,
  286. type: params.lightbox.options.type
  287. }
  288. };
  289. adoric.Util.ajax("https://adoric.com/list/subscribe", "POST", formData);
  290. }
  291. });
  292.  
  293.  
  294. </script>
  295.  
  296. ===========================ADD UTM to form=============================
  297. <script>
  298. (function() {
  299. function getLbIdentifier() {
  300. var lbData = null;
  301. window.adoric && adoric.lightboxes.forEach(function(item) {
  302. var form = document.querySelector('.' + self.identifier + '.__ADORIC__ [tabindex] form');
  303. if (item.isShowing === true && form) {
  304. lbData = item;
  305. }
  306. });
  307. return lbData;
  308. }
  309.  
  310. function getUrlParameter(name) {
  311. name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
  312. var regex = new RegExp("[\\?&]" + name + "=([^&#]*)");
  313. var results = regex.exec(location.search);
  314. return results === null ? '' : decodeURIComponent(results[1].replace(/\+/g, " "));
  315. }
  316.  
  317. function addHiddenInput(name, val) {
  318. var inp = document.createElement('INPUT');
  319. inp.type = 'hidden';
  320. inp.name = name;
  321. inp.value = val;
  322. if (currentForm) {
  323. currentForm.appendChild(inp);
  324. }
  325.  
  326. }
  327.  
  328. var allCampaignData = getLbIdentifier();
  329. var currentForm = document.querySelector('.' + allCampaignData.identifier + '.__ADORIC__ [tabindex] form');
  330.  
  331. if (getUrlParameter('utm_source')) {
  332. addHiddenInput('utm_source', getUrlParameter('utm_source'));
  333. }
  334. if (getUrlParameter('utm_medium')) {
  335. addHiddenInput('utm_medium', getUrlParameter('utm_medium'));
  336. }
  337. if (getUrlParameter('utm_campaign')) {
  338. addHiddenInput('utm_campaign', getUrlParameter('utm_campaign'));
  339. }
  340. if (getUrlParameter('utm_term')) {
  341. addHiddenInput('utm_term', getUrlParameter('utm_term'));
  342. }
  343. if (getUrlParameter('utm_content')) {
  344. addHiddenInput('utm_content', getUrlParameter('utm_content'));
  345. }
  346. })();
  347. </script>
  348. =============================================================================
  349. ================================ add URL in hidden field ====================
  350. <script>
  351. (function() {
  352. var URL_FIELD_NAME = 'URL';
  353. function getLbIdentifier() {
  354. var lbData = null;
  355. window.adoric && adoric.lightboxes.forEach(function(item) {
  356. var form = document.querySelector('.' + item.identifier + '.__ADORIC__ [tabindex] form');
  357. if (item.isShowing === true && form) {
  358. lbData = item;
  359. }
  360. });
  361. return lbData;
  362. }
  363.  
  364. function addHiddenInput(name, val) {
  365. var inp = document.createElement('INPUT');
  366. inp.type = 'hidden';
  367. inp.name = name;
  368. inp.value = val;
  369. if (currentForm) {
  370. currentForm.appendChild(inp);
  371. }
  372.  
  373. }
  374.  
  375. var allCampaignData = getLbIdentifier();
  376. var currentForm = document.querySelector('.' + allCampaignData.identifier + '.__ADORIC__ [tabindex] form');
  377. var currentURL = window.location.href;
  378. addHiddenInput(URL_FIELD_NAME, currentURL);
  379. })();
  380. </script>
  381.  
  382. ================================ add suctom video like inpage =============================================
  383. <script>
  384. (function() {
  385. var videoWrapper = document.querySelector('.tabs-content-exp-container > .tabs-content-exp');
  386. if (videoWrapper) {
  387. videoWrapper.style.position = 'relative';
  388. }
  389. var adoricVideoWrapper = document.getElementById('adoricVideoWrapper');/*adoricVideoWrapper - id embed code div element*/
  390. var videoTeg = '<video autoplay="autoplay" loop="loop" muted="" width="100%" height="100%" style="top: 0%; left: -3%; position: absolute; width: 109%; height: 100%;"><source src="https://i01.appmifile.com/webfile/globalimg/products/pc/redmik20/index_design.mp4" type="video/mp4"></video>';
  391. adoricVideoWrapper.innerHTML = videoTeg;
  392. })();
  393. </script>
  394. =================================form after submit response============================================
  395. adoric.on('form:after:submit', function(res) {
  396. console.log('response - ', res.response);
  397. });
  398. ========================= check device type ====================================================
  399. var SB_TYPE_MOBILE = 'mobile';
  400. var SB_TYPE_TABLET = 'tablet';
  401. var SB_TYPE_DESKTOP = 'desktop';
  402. var SCREEN_WIDTH = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
  403. var DEVICE_TYPE = (SCREEN_WIDTH > 800) && SB_TYPE_DESKTOP || (SCREEN_WIDTH < 600) && SB_TYPE_MOBILE || SB_TYPE_TABLET;
  404. console.log(DEVICE_TYPE);
  405.  
  406.  
  407. =============================================================================
  408.  
  409. ===============================upload the image to adoric list========================================
  410. <!-- example campaign: -->
  411. <!--https://adoric.com/campaign/5e26c12d5592880010779523/edit-->
  412.  
  413. <script src="//static.filestackapi.com/filestack-js/3.x.x/filestack.min.js"></script>
  414. <style>
  415. #adoric_smartbox_e396dc8514f5a .element-fieldset {
  416. width: 140px !important;
  417. height: 25px !important;
  418. }
  419.  
  420. #adoric_smartbox_e396dc8514f5a .element-input-checkbox-label {
  421. color: rgb(0, 0, 0) !important;
  422. font-weight: 600 !important;
  423. font-size: 10px !important;
  424. line-height: 1.4 !important;
  425. font-family: Assistant, sans-serif !important;
  426. white-space: unset !important;
  427. overflow-wrap: break-word !important;
  428. lay: block !important;
  429. opacity: 1 !important;
  430. width: 230px !important;
  431. vertical-align: top !important;
  432. letter-spacing: 0em !important;
  433. margin-right: 0em !important;
  434. text-shadow: none !important;
  435. }
  436.  
  437. #adoric_smartbox_e396dc8514f5a .element-fieldset[data-name="Checkbox"] {
  438. width: 250px !important;
  439. }
  440. </style>
  441. <script>
  442. (function() {
  443. var adoricCustomLoadImagesButton = document.getElementById('adoricCustomLoadImages');
  444. var imageLoadedIcon = '<svg id="Capa_1" enable-background="new 0 0 482.239 482.239" height="100%" viewBox="0 0 482.239 482.239" width="100%" xmlns="http://www.w3.org/2000/svg" class="inner-element" aria-label="undefined" role="img" preserveAspectRatio="none" style="width: 100%; height: 100%; opacity: 1; box-shadow: none; border-radius: 0px;" data-event-name="Conversion" data-shadow-distance="0" data-init-color="#b20000" data-width="NaN" data-height="NaN" data-left="NaN" data-top="NaN"><path d="m465.016 0h-447.793c-9.52 0-17.223 7.703-17.223 17.223v447.793c0 9.52 7.703 17.223 17.223 17.223h447.793c9.52 0 17.223-7.703 17.223-17.223v-447.793c0-9.52-7.703-17.223-17.223-17.223zm-17.223 447.793h-413.347v-413.347h413.348v413.347z" data-init-color="#000000" style="fill: rgb(178, 0, 0);"></path><path d="m373.856 184.405-24.354-24.354-142.828 142.828-73.937-73.937-24.354 24.354 98.291 98.291z" data-init-color="#000000" style="fill: rgb(178, 0, 0);"></path></svg>';
  445. adoricCustomLoadImagesButton.addEventListener('touchend', function() {
  446. adoricCustomLoadImagesButton.style.border = '2px dashed';
  447. if (filestack) {
  448. const client = filestack.init('AitrLF34lQmScrkzumAPAz');
  449. const options = {
  450. onUploadDone: function(responce) {
  451. var files = responce.filesUploaded;
  452. if (files && files.length > 0) {
  453. adoricCustomLoadImagesButton.style.border = 'none';
  454. document.getElementById('adoricUploadDynamicIcon').innerHTML = imageLoadedIcon;
  455. files.forEach(function(item) {
  456. if (item.url != '') {
  457. var form = document.querySelector('#adoricSendingImageForm');
  458. form.querySelector('INPUT[name="images"]').value = item.url;
  459. var isFileAdded = document.querySelector('INPUT[name="isFileAdded"]');
  460. form.removeChild(isFileAdded);
  461. }
  462. });
  463. }
  464. }
  465. };
  466. client.picker(options).open();
  467. }
  468. });
  469. })();
  470. </script>
  471. ===========================================Responcive native slider!!===============================
  472. <script>
  473. function updateCarouselWidth() {
  474. var screenWidth = window.innerWidth;
  475. var itemWidth = 300;
  476. var carouselElement = document.querySelector('.' + self.identifier + ' .element-slider');
  477. if (carouselElement) {
  478. var maximumVisibleElements = parseInt(((screenWidth / 100) * 90) / itemWidth);
  479. if (maximumVisibleElements > 5) {
  480. maximumVisibleElements = 5
  481. }
  482. carouselElement.style.width = itemWidth * maximumVisibleElements + 'px';
  483. document.querySelector('.' + self.identifier + ' .slider-container').setAttribute('data-visible-items', maximumVisibleElements);
  484. }
  485. adoric.lightboxes.filter(function(lb) {
  486. return document.querySelector('.' + lb.identifier + ' .element-slider')
  487. })[0].startSliders();
  488. }
  489. updateCarouselWidth();
  490. window.addEventListener('resize', updateCarouselWidth);
  491. </script>
  492. ===================================================================================================
  493. ===============================Remove all text without wrapper from element!!===============================
  494. <div id="foo">
  495. first
  496. <div id="bar1">
  497. jumps over a lazy dog!
  498. </div>
  499. second
  500. <div id="bar2">
  501. another jumps over a lazy dog!
  502. </div>
  503. third
  504. </div>
  505. <script>
  506. function removeAllTextWithoutWrapper(element) {
  507. if (element == null || element == undefined) return null;
  508. var nextSibling;
  509. while (element) {
  510. nextSibling = element.nextSibling;
  511. if (element.nodeType == 3) {
  512. element.parentNode.removeChild(element);
  513. }
  514. element = nextSibling;
  515. }
  516.  
  517. }
  518. removeAllTextWithoutWrapper(document.getElementById("foo").firstChild);
  519. </script>
  520. ======================Random indexes =====================================================================
  521. var indexes = [];
  522. while(indexes.length < 10) {
  523.  
  524. var newNUmber = Math.floor(Math.random() * 10);
  525. if(indexes.indexOf(newNUmber) == -1) {
  526. indexes.push(newNUmber);
  527. } else {
  528. console.log('ysy');
  529. }
  530.  
  531. console.log(newNUmber);
  532. }
  533. console.log(indexes)
  534.  
  535. ====================COPY TEXT TO BUFFER====================
  536. <script>
  537. (function() {
  538. var copyButton = document.getElementById('adoricCopyCoupon');
  539. if (copyButton) {
  540. copyButton.addEventListener('touchend', function() {
  541. var input = document.createElement("input");
  542. document.body.appendChild(input);
  543. input.setAttribute("value", "BABELKI15");
  544. input.select();
  545. document.execCommand("copy");
  546. document.body.removeChild(input);
  547. });
  548. }
  549. })();
  550. </script>
  551.  
  552. =======================EMBED WEBHOOK to Adoric=======================
  553. <script>
  554. (function() {
  555. function getLbIdentifier() {
  556. var lbData = null;
  557. adoric.lightboxes.forEach(function(item) {
  558. if (item.options.campaignId === self.campaignId) {
  559. lbData = item;
  560. }
  561. });
  562. return lbData;
  563. }
  564. var form = document.querySelector('.' + self.identifier + ' [tabindex] form');
  565. var allCampaignData = getLbIdentifier();
  566. form.addEventListener('submit', function() {
  567. var allFormInputs = form.querySelectorAll('INPUT');
  568. var formData = {};
  569. for (var i = 0; i < allFormInputs.length; i++) {
  570. if (allFormInputs[i].getAttribute('name') !== 'submit') {
  571. fieldName = allFormInputs[i].getAttribute('name');
  572. fieldValue = allFormInputs[i].value;
  573. formData[fieldName] = fieldValue;
  574. console.log(fieldName, '=', fieldValue);
  575. }
  576. }
  577. formData.groupID = '182216';
  578. formData.adoricApiKey = '1637152141706';
  579. formData.userId = '5e4ea052e98c750012b2c583';
  580. formData.adoricSessionParams = '{}';
  581. formData.header = '{}';
  582.  
  583. var data = {
  584. subscribe: formData,
  585. referrer: document.referrer,
  586. country: sessionStorage.getItem('country_code_cache'),
  587. action: 'http://www.pulseem.com/Pulseem/PulseemServices.asmx/PostNewClient',
  588. enctype: '#',
  589. method: 'GET',
  590. campaignData: {
  591. options: {
  592. id: allCampaignData.id,
  593. userId: allCampaignData.options.userId,
  594. domainId: "5faba3ce59900100102a034a",
  595. accountId: allCampaignData.options.userId,
  596. campaignTitle: allCampaignData.options.campaignTitle,
  597. title: allCampaignData.options.title,
  598. type: allCampaignData.options.type
  599. }
  600. }
  601. };
  602. var xhr = new XMLHttpRequest();
  603. xhr.addEventListener('readystatechange', function() {
  604. if (this.readyState === 4) {
  605. console.log('response - ', this.responseText);
  606. }
  607. });
  608. xhr.open('POST', 'https://app.adoric-om.com/v1/forms/webhook');
  609. xhr.setRequestHeader('cache-control', 'no-cache');
  610. xhr.send(JSON.stringify(data));
  611. });
  612. })();
  613. </script>
  614.  
  615. ======================checkbox 0 and 1 ===============================
  616. <input type="hidden" name="accept" value="1" draggable="false">
  617.  
  618. <script>
  619. (function() {ч
  620. var currentLBSelector = '.' + getLbIdentifier('5cffa536c004f30274c83567') + '.__ADORIC__ [tabindex]';
  621. var form = document.querySelector(currentLBSelector + ' form');
  622. var checkBox = form.querySelector('INPUT[type="checkbox"]');
  623. checkBox.addEventListener('change', function() {
  624. if (this.checked) {
  625. form.querySelector('INPUT[name="mailPermisionCheflavan1"]').value = 1;
  626. } else {
  627. form.querySelector('INPUT[name="mailPermisionCheflavan1"]').value = 0;
  628. }
  629. });
  630. })();
  631. </script>
  632. ======================================================================
  633.  
  634. ======================send information to GA===============================
  635. <script>
  636. window.ga && window.ga('t0.send', 'event', {
  637. eventCategory: 'Adoric - פופאפ עמוד דגם חדש',
  638. eventAction: 'click',
  639. eventLabel: 'Button redirection link'
  640. });
  641.  
  642. window.ga && window.ga('t0.send', 'event', {
  643. eventCategory: 'Adoric - פופאפ עמוד דגם חדש',
  644. eventAction: 'click',
  645. eventLabel: 'Form submited - ' + self.versionTitle
  646. });
  647.  
  648. </script>
  649.  
  650.  
  651. ======================star rating element===============================
  652. <div class="rating">
  653. <span class="icon" data-rate="1"></span>
  654. <span class="icon" data-rate="2"></span>
  655. <span class="icon" data-rate="3"></span>
  656. <span class="icon" data-rate="4"></span>
  657. <span class="icon" data-rate="5"></span>
  658. </div>
  659. <style>
  660. .icon {
  661. width: 20px;
  662. height: 20px;
  663. background-image: url(https://static.adoric.com/1591654474652_yn65zk2agjb/star1.png);
  664. display: block;
  665. background-size: contain;
  666. }
  667.  
  668. .icon.filled {
  669. background-image: url(https://static.adoric.com/1591654474534_u28rf661h07/star2.jpg) !important;
  670.  
  671. }
  672.  
  673. .rating {
  674. display: flex;
  675. }
  676. </style>
  677. <script>
  678. (function() {
  679. function fillNewRate(rate) {
  680. if (rate < 0 || rate > 5) return;
  681. var rateIcons = document.querySelectorAll('.rating .icon');
  682. for(var i = 0; i < 5; i ++) {
  683. if (i < rate) {
  684. rateIcons[i].classList.add('filled');
  685. } else {
  686. rateIcons[i].classList.remove('filled');
  687. }
  688. }
  689. }
  690.  
  691. var rating = document.querySelector('.rating');
  692. rating.addEventListener('click', function(event) {
  693. var currentRate = event.target.dataset.rate;
  694. if (currentRate) {
  695. fillNewRate(currentRate);
  696. }
  697. console.log(event.target.dataset.rate);
  698.  
  699. })
  700. })();
  701. </script>
  702.  
  703. ======================================================================
  704.  
  705. =====================Adoric leads ====================================
  706. <script>
  707. (function() {
  708. function getLbIdentifier() {
  709. var lbData = null;
  710. window.adoric && adoric.lightboxes.forEach(function(item) {
  711. if (item.options.campaignId === self.campaignId) {
  712. lbData = item;
  713. }
  714. });
  715. return lbData;
  716. }
  717. try {
  718. var allCampaignData = getLbIdentifier();
  719. var form = document.querySelector('.' + self.identifier + ' form.inner-element');
  720. form.addEventListener('submit', function() {
  721. var allFormInputs = form.querySelectorAll('INPUT');
  722. var formData = {};
  723. for (var i = 0; i < allFormInputs.length; i++) {
  724. if (allFormInputs[i].getAttribute('name') !== 'sumbit') {
  725. fieldName = allFormInputs[i].getAttribute('name');
  726. fieldValue = allFormInputs[i].value;
  727. formData[fieldName] = fieldValue;
  728. }
  729. }
  730. var data = {
  731. subscribe: formData,
  732. referrer: document.referrer,
  733. country: sessionStorage.getItem('country_code_cache'),
  734. campaignData: {
  735. options: {
  736. id: allCampaignData.id,
  737. userId: allCampaignData.options.userId,
  738. domainId: self.domainId,
  739. campaignId: allCampaignData.options.campaignId,
  740. accountId: allCampaignData.options.userId,
  741. campaignTitle: allCampaignData.options.campaignTitle,
  742. title: allCampaignData.options.title,
  743. type: allCampaignData.options.type
  744. }
  745. }
  746. };
  747. var xhr = new XMLHttpRequest();
  748. xhr.addEventListener('readystatechange', function() {
  749. if (this.readyState === 4) {
  750. console.log('response - ', this.responseText);
  751. }
  752. });
  753. xhr.open('POST', 'https://app.adoric-om.com/v1/forms/leads/subscribe', true);
  754. xhr.send(JSON.stringify(data));
  755. });
  756. } catch (error) {
  757. console.log(error);
  758. }
  759. })();
  760. </script>
  761. ======================================================================
  762.  
  763. ======================carousel with dots ==================================
  764. <div class="adoric_element element-group ADORIC_customPagingDots editing" data-items="8" style="left: 896px; top: 231px; position: absolute; width: 61px; height: 8px; opacity: 1; z-index: 65; " data-width="164" data-height="10" data-left="888" data-top="229"><div class="element-shape editing adoric-inner-group active" data-radius="0.00" style="left: 0px; top: 0.411585px; width: 8.23171px; position: absolute; height: 8.23171px; line-height: 0; opacity: 1; z-index: 11;" data-width="206" data-height="206" data-left="1176" data-top="477"><!--?xml version="1.0" encoding="utf-8"?--> <!-- Generator: Adobe Illustrator 15.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="100%" height="100%" viewBox="0 0 500 500" enable-background="new 0 0 500 500" xml:space="preserve" class="inner-element" aria-label="Shapes circle " role="img" preserveAspectRatio="none" style="width: 100%; height: 100%; opacity: 1; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; " data-event-name="Conversion" data-shadow-distance="0" data-init-color="rgb(0, 0, 0)" data-hover-color="#000000" onmouseover="var t=this.querySelectorAll(&quot;path, rect, circle, ellipse, line, polyline, polygon, stop&quot;),e=this.getAttribute(&quot;data-hover-color&quot;);Array.prototype.forEach.call(t,function(t){t.style.fill=e})" onmouseout="var t=this.querySelectorAll(&quot;path, rect, circle, ellipse, line, polyline, polygon, stop&quot;),e=this.getAttribute(&quot;data-init-color&quot;);Array.prototype.forEach.call(t,function(t){t.style.fill=e})"> <path d="M250-1c138.066,0,250,111.929,250,250c0,138.066-111.934,250-250,250C111.929,499,0,387.066,0,249 C0,110.929,111.929-1,250-1z" data-init-color="#ea7878" style="fill: rgb(0, 0, 0);"></path> </svg> </div><div class="element-shape editing adoric-inner-group" data-radius="0.00" style="left: 17.2866px; top: 0.411585px; width: 8.23171px; position: absolute; height: 8.23171px; line-height: 0; opacity: 1; z-index: 10;" data-width="206" data-height="206" data-left="1176" data-top="477"><!--?xml version="1.0" encoding="utf-8"?--> <!-- Generator: Adobe Illustrator 15.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="100%" height="100%" viewBox="0 0 500 500" enable-background="new 0 0 500 500" xml:space="preserve" class="inner-element" aria-label="Shapes circle " role="img" preserveAspectRatio="none" style="width: 100%; height: 100%; opacity: 1; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; " data-event-name="Conversion" data-shadow-distance="0" data-init-color="#000000"> <path d="M250-1c138.066,0,250,111.929,250,250c0,138.066-111.934,250-250,250C111.929,499,0,387.066,0,249 C0,110.929,111.929-1,250-1z" data-init-color="#ea7878" style="fill: rgb(0, 0, 0);"></path> </svg> </div><div class="element-shape editing adoric-inner-group" data-radius="0.00" style="left: 34.5732px; top: 0.411585px; width: 8.23171px; position: absolute; height: 8.23171px; line-height: 0; opacity: 1; z-index: 9;" data-width="206" data-height="206" data-left="1176" data-top="477"><!--?xml version="1.0" encoding="utf-8"?--> <!-- Generator: Adobe Illustrator 15.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="100%" height="100%" viewBox="0 0 500 500" enable-background="new 0 0 500 500" xml:space="preserve" class="inner-element" aria-label="Shapes circle " role="img" preserveAspectRatio="none" style="width: 100%; height: 100%; opacity: 1; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; " data-event-name="Conversion" data-shadow-distance="0" data-init-color="#000000"> <path d="M250-1c138.066,0,250,111.929,250,250c0,138.066-111.934,250-250,250C111.929,499,0,387.066,0,249 C0,110.929,111.929-1,250-1z" data-init-color="#ea7878" style="fill: rgb(0, 0, 0);"></path> </svg> </div><div class="element-shape editing adoric-inner-group" data-radius="0.00" style="left: 52.6829px; top: 0.411585px; width: 8.23171px; position: absolute; height: 8.23171px; line-height: 0; opacity: 1; z-index: 8;" data-width="10" data-height="10" data-left="955" data-top="347"><!--?xml version="1.0" encoding="utf-8"?--> <!-- Generator: Adobe Illustrator 15.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="100%" height="100%" viewBox="0 0 500 500" enable-background="new 0 0 500 500" xml:space="preserve" class="inner-element" aria-label="Shapes circle " role="img" preserveAspectRatio="none" style="width: 100%; height: 100%; opacity: 1; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; " data-event-name="Conversion" data-shadow-distance="0" data-init-color="#000000"> <path d="M250-1c138.066,0,250,111.929,250,250c0,138.066-111.934,250-250,250C111.929,499,0,387.066,0,249 C0,110.929,111.929-1,250-1z" data-init-color="#ea7878" style="fill: rgb(0, 0, 0);"></path> </svg> </div></div>
  765.  
  766.  
  767. <style>
  768. .ADORIC_customPagingDots .element-shape {
  769. cursor: pointer;
  770. }
  771.  
  772. .ADORIC_customPagingDots .active SVG PATH {
  773. fill: #CACACA !important;
  774. }
  775.  
  776. .adoric_sliderWithDotsContainer .slider-arrow-left,
  777. .adoric_sliderWithDotsContainer .slider-arrow-right {
  778. display: none;
  779. }
  780. </style>
  781. <script>
  782. (function() {
  783. var dotsContainer = document.querySelector('.ADORIC_customPagingDots');
  784. dotsContainer.addEventListener('touchend', function(e) {
  785. var target = e.target || e.currentTarget;
  786. if (target.classList.contains('element-shape') || target.parentNode.classList.contains('element-shape') || target.parentNode.parentNode.classList.contains('element-shape')) {
  787. if (!(target.classList.contains('element-shape'))) {
  788. if (target.parentNode.classList.contains('element-shape')) {
  789. target = target.parentNode;
  790. } else if (target.parentNode.parentNode.classList.contains('element-shape')) {
  791. target = target.parentNode.parentNode;
  792. }
  793. }
  794. var activeDot = dotsContainer.querySelector('.element-shape.active');
  795. var nodes = Array.prototype.slice.call(dotsContainer.children);
  796. var targetIndex = nodes.indexOf(target);
  797. var activeIndex = 0;
  798. if (activeDot) {
  799. var activeIndex = nodes.indexOf(activeDot);
  800. }
  801. console.log('activeIndex', activeIndex, 'targetIndex', targetIndex);
  802. if (activeIndex > targetIndex) {
  803. for (var i = 0; i < (activeIndex - targetIndex); i++) {
  804. setTimeout(function() {
  805. document.querySelector('.adoric_sliderWithDotsContainer .slider-arrow-left').click();
  806. }, 600 * i);
  807. }
  808. }
  809. if (activeIndex < targetIndex) {
  810. for (var i = 0; i < (targetIndex - activeIndex); i++) {
  811. setTimeout(function() {
  812. document.querySelector('.adoric_sliderWithDotsContainer .slider-arrow-right').click();
  813. }, 600 * i);
  814. }
  815. }
  816. activeDot.classList.remove('active');
  817. target.classList.add('active');
  818. }
  819. });
  820. })();
  821. </script>
  822.  
  823.  
  824. ==============================dynamic carousel from google sheet ===========================
  825. <script>
  826. (function() {
  827. var DOC_KEY = '1uLbXW7Lzmv3vjom3qJZDxecX-XUSt6Z6O41-Z9vdEEM';
  828. var API_KEY = 'AIzaSyDB7Mk0_X06DqZHWlllSOont--5XAZ4tao';
  829. var SHEET_PAGE = 'data';
  830. var SHEET_SCOPE = '!A2:AT7505';
  831.  
  832. function fillDynamicContent(dataArray) {
  833. console.log(dataArray);
  834.  
  835. var carousel = document.querySelector('.adoricCustomProductsCarousel');
  836. var thumbTemplate = carousel.querySelector('.slider-item.tmp-cloned').cloneNode(true);
  837. carousel.innerHTML = '';
  838. carousel.appendChild(thumbTemplate);
  839. dataArray.forEach(function(pr) {
  840. var duplicateThumb = thumbTemplate.cloneNode(true);
  841. duplicateThumb.querySelector('IMG.inner-element').src = pr[0];
  842. duplicateThumb.querySelector('SPAN.adoricCustomTitle.inner-element FONT').innerText = pr[1];
  843. duplicateThumb.querySelector('.element-button.adoric-slider-item-inner A').href = pr[3];
  844. duplicateThumb.querySelector('SPAN.adoricCustomPrice.inner-element').innerHTML = pr[2];
  845. carousel.appendChild(duplicateThumb);
  846. });
  847. }
  848.  
  849. var URL = "https://sheets.googleapis.com/v4/spreadsheets/" + DOC_KEY + "/values/" + SHEET_PAGE + SHEET_SCOPE + "?key=" + API_KEY;
  850. console.log(URL);
  851. var data = null;
  852. var xhr = new XMLHttpRequest();
  853. xhr.addEventListener("readystatechange", function() {
  854. if (this.readyState === 4) {
  855. var result = JSON.parse(this.responseText);
  856. var dataArray = result.values;
  857. console.log(dataArray);
  858. if(dataArray.length > 4) {
  859. fillDynamicContent(dataArray);
  860. }
  861.  
  862. }
  863. });
  864. xhr.open("GET", URL);
  865. xhr.setRequestHeader("cache-control", "no-cache");
  866. xhr.send(data);
  867. })();
  868. </script>
  869.  
  870. https://docs.google.com/spreadsheets/d/1D0AzyzWhREOJ_vbUkLHe09YNSjG4b0IZnhe6T6S79tw/edit?usp=sharing
  871. =======================================remarkety integration with phone ==============================================
  872.  
  873. <script>
  874. (function() {
  875. function getLbIdentifier(campaignId) {
  876. var lbIdentifier = null;
  877. window.adoric && adoric.lightboxes.forEach(function(item) {
  878. if (item.options.campaignId === campaignId) {
  879. lbIdentifier = item.identifier;
  880. }
  881. });
  882. return lbIdentifier;
  883. }
  884. var allCampaignData = getLbIdentifier(self.campaignId);
  885. var form = document.querySelector('.' + self.identifier + ' FORM.inner-element');
  886. var firstNameField = form.querySelector('INPUT[name="firstName"]');
  887. var lastNameField = form.querySelector('INPUT[name="lastName"]');
  888. var emailField = form.querySelector('INPUT[name="email"]');
  889. var phoneField = form.querySelector('INPUT[name="sms_phone_number"]');
  890. var birthdayField = form.querySelector('INPUT[name="birthday"]');
  891. var marketingAllowedINput = form.querySelector('INPUT[name="marketingAllowed"]');
  892. try {
  893. form.addEventListener('submit', function() {
  894. var data = {
  895. subscribe: {
  896. firstName: firstNameField.value,
  897. lastName: lastNameField.value,
  898. email: emailField.value,
  899. tags: 'Adoric',
  900. marketingAllowed: marketingAllowedINput.value,
  901. properties: {
  902. phone: phoneField.value,
  903. birth_date: birthdayField.value
  904. },
  905. userId: '5e4ea052e98c750012b2c583',
  906. adoricApiKey: "1635110566828"
  907. },
  908. referrer: '',
  909. country: '',
  910. action: 'https://app.remarkety.com/api/v1/stores/Emqzjg4w/contacts',
  911. enctype: '#',
  912. method: 'POST',
  913. campaignData: {
  914. options: {
  915. id: allCampaignData.id,
  916. userId: allCampaignData.options.userId,
  917. domainId: allCampaignData.statistic.domainId,
  918. accountId: allCampaignData.options.userId,
  919. campaignTitle: allCampaignData.options.campaignTitle,
  920. title: allCampaignData.options.title,
  921. type: allCampaignData.options.type
  922. }
  923. }
  924. };
  925. var xhr = new XMLHttpRequest();
  926. xhr.addEventListener('readystatechange', function() {
  927. var response = JSON.parse(this.responseText);
  928. if (this.readyState === 4) {
  929. var response = JSON.parse(this.responseText);
  930. console.log('response - ', response);
  931. }
  932. });
  933. xhr.open('POST', 'https://app.adoric-om.com/v1/forms/webhook');
  934. xhr.setRequestHeader('cache-control', 'no-cache');
  935. xhr.send(JSON.stringify(data));
  936. });
  937. } catch(error) {
  938. console.log('Error - ', error);
  939. }
  940. })();
  941. </script>
  942. ==============================================================================================
  943.  
  944. =================================================== responcive carousel===================================================
  945.  
  946. <style>
  947. #adoric_smartbox_75fe6e6416fd9 .adoric_element.element-slider {
  948. width: 100% !important;
  949. left: 0px !important;
  950. }
  951. </style>
  952. <script>
  953. (function() {
  954. function updateCarouselWidth() {
  955. var screenWidth = window.innerWidth;
  956. var itemWidth = 290;
  957. var marginWidth = 50;
  958. var carouselElement = document.querySelector('#adoric_smartbox_75fe6e6416fd9 .element-slider');
  959. var carouselSlider = carouselElement.querySelector('.slider-container');
  960. if (carouselElement) {
  961. var maximumVisibleElements = parseInt(window.innerWidth / itemWidth);
  962. console.log('maximumVisibleElements', maximumVisibleElements);
  963. carouselElement.style.width = itemWidth * maximumVisibleElements + 'px';
  964. carouselSlider.setAttribute('data-visible-items', maximumVisibleElements);
  965. }
  966. }
  967. updateCarouselWidth();
  968. window.addEventListener('resize', updateCarouselWidth);
  969. })();
  970. </script>
  971.  
  972. ======================================================================================================
  973.  
  974. =================================================== text element variable ===================================================
  975.  
  976. <script>
  977. (function() {
  978. var currentLb = document.querySelector('.' + self.identifier + '.__ADORIC__ [tabindex]');
  979. var allTextElements = currentLb.querySelectorAll('span');
  980. var dynamicVariable = '[[cityName]]';
  981. var dynamicTextValue = '';
  982. for (var i = 0; i < allTextElements.length; i++) {
  983. var dynamicText = allTextElements[i].textContent;
  984. dynamicText = dynamicText.replaceAll(dynamicVariable, dynamicTextValue);
  985. allTextElements[i].textContent = dynamicText;
  986. }
  987. })();
  988. </script>
  989.  
  990. =================================================== hide native element ===================================================
  991. <script>
  992. (function() {
  993. var nativeElementWrapper = document.querySelector('.wrapp-recommended .container');
  994. if (nativeElementWrapper) {
  995. var rowElement = nativeElementWrapper.querySelector('.row');
  996. nativeElementWrapper.style.position = 'relative';
  997. var adoricElementToCover = document.createElement('div');
  998. adoricElementToCover.style.width = '100%';
  999. adoricElementToCover.style.height = '100%';
  1000. adoricElementToCover.style.position = 'absolute';
  1001. adoricElementToCover.style.left = '0px';
  1002. adoricElementToCover.style.right = '0px';
  1003. adoricElementToCover.style.background = '#fff';
  1004. adoricElementToCover.style.zIndex = '9';
  1005. nativeElementWrapper.insertBefore(adoricElementToCover, rowElement);
  1006. }
  1007. })();
  1008. </script>
  1009. =================================================== double form integration ===================================================
  1010. <script>
  1011. (function() {
  1012. var form = document.querySelector('.' + self.identifier + ' FORM.inner-element');
  1013. form.addEventListener('submit', function() {
  1014. try {
  1015. var xhr = new XMLHttpRequest();
  1016. let json = JSON.stringify({
  1017. 'First name': form.querySelector('INPUT[name="firstName"]').value,
  1018. 'Last name': form.querySelector('INPUT[name="lastName"]').value,
  1019. 'phone': form.querySelector('INPUT[name="phone"]').value,
  1020. 'email': form.querySelector('INPUT[name="Email"]').value,
  1021. 'checkbox': form.querySelector('INPUT[type="checkbox"]').value
  1022. });
  1023. /* the old action link => xhr.open("POST", 'https://hooks.zapier.com/hooks/catch/3542992/ocft0nm/');*/
  1024. xhr.open("POST", 'https://hooks.zapier.com/hooks/catch/3542992/o0vgniq/');
  1025. xhr.send(json);
  1026. xhr.onload = function() {
  1027. console.log('Zapier Result: ', xhr.response);
  1028. };
  1029. } catch(error) {
  1030. console.log(error);
  1031. }
  1032. });
  1033. })();
  1034. </script>
  1035.  
  1036.  
  1037. =================================================== dynamic content for adoric slider ===================================================
  1038. <script>
  1039. (function() {
  1040. function updateSlideContent(campaignSlide, sourceSlide) {
  1041. var productLink = sourceSlide.querySelector('.deal section > a');
  1042. if (productLink) {
  1043. campaignSlide.querySelector('.product-link a').href = productLink.href;
  1044. }
  1045. }
  1046.  
  1047. var sliderItems = document.querySelectorAll('.' + self.identifier + '.__ADORIC__ [tabindex] .slider-item');
  1048. var sliderWrapper = document.querySelector('.' + self.identifier + '.__ADORIC__ [tabindex] .slider-content');
  1049. try {
  1050. var URL = 'https://www.zap.co.il/deals/category/bestseller';
  1051. var parser = new DOMParser();
  1052. var doc = '';
  1053. var data = null;
  1054. var xhr = new XMLHttpRequest();
  1055. xhr.withCredentials = true;
  1056. xhr.addEventListener('readystatechange', function () {
  1057. if (this.readyState === 4) {
  1058. doc = parser.parseFromString(this.responseText, 'text/html');
  1059. var pageProducts = doc.querySelectorAll('.deal');
  1060. for(var i = 1; i < sliderItems.length; i++) {
  1061. var pageItemIndex = i-1;
  1062. if (i <= pageProducts.length) {
  1063. updateSlideContent(sliderItems[i], pageProducts[pageItemIndex]);
  1064. } else {
  1065. sliderWrapper.removeChild(sliderItems[i]);
  1066. }
  1067.  
  1068. if (i == sliderItems.length - 1 && pageProducts.length >= i) {
  1069. updateSlideContent(sliderItems[0], pageProducts[i]);
  1070. }
  1071. }
  1072.  
  1073. }
  1074. });
  1075. xhr.open('GET', URL);
  1076. xhr.setRequestHeader('cache-control', 'no-cache');
  1077. xhr.send(data);
  1078. } catch(error) {
  1079. console.log(error);
  1080. }
  1081. })();
  1082. </script>
  1083.  
  1084. =================================================== Accessibility ===================================================
  1085. <script>
  1086. (function() {
  1087. var currentLBSelector = '.' + self.identifier + '.__ADORIC__ [tabindex]';
  1088. var closeLbButton = document.querySelector(currentLBSelector + ' .closeLightboxButton BUTTON');
  1089. var submitButton = document.querySelector(currentLBSelector + ' a[role="link"]');
  1090. var firstField = document.querySelector(currentLBSelector + ' form INPUT');
  1091. closeLbButton.focus();
  1092. setTimeout(function() {
  1093. closeLbButton.focus();
  1094. }, 1500);
  1095. closeLbButton.addEventListener('keydown', function(e) {
  1096. var key = e.which || e.keyCode;
  1097. var code = e.code;
  1098. console.log('key - ', key);
  1099. console.log('code - ', code);
  1100. if (key === 9 || code.toLowerCase() === 'tab') {
  1101. e.preventDefault();
  1102. e.stopPropagation();
  1103. firstField.focus();
  1104. }
  1105. });
  1106. submitButton.addEventListener('keydown', function(e) {
  1107. var key = e.which || e.keyCode;
  1108. var code = e.code;
  1109. if (key === 9 || code.toLowerCase() === 'tab') {
  1110. e.preventDefault();
  1111. e.stopPropagation();
  1112. closeLbButton.focus();
  1113. }
  1114. });
  1115. })();
  1116. </script>
  1117.  
  1118. ============================================== event from iframe ==============================================
  1119. <script>
  1120. window.postMessage('showAdocirFreeShippingBar!');
  1121. window.addEventListener('message', (event) => {
  1122. console.log('event.origin - ', event.origin);
  1123. if (event.origin.indexOf('showAdocirFreeShippingBar') != -1 ) {
  1124. console.log('showAdocirFreeShippingBar must show!')
  1125. }
  1126. }, false)
  1127.  
  1128. </script>
  1129.  
  1130. ============================================== update adoric count down ==============================================
  1131. <script>
  1132. function restartTimer(endDate) {
  1133. var timerStart = new CustomEvent("timerStart");
  1134. var timerEnd = new CustomEvent("timerEnd");
  1135.  
  1136. function timer_ADORIC_timer__kqaxxx47() {
  1137. this.initDomElement();
  1138. this.running = false;
  1139. this.timeZoneOffset = new Date().getTimezoneOffset() / 60;
  1140. this.startDate = Date.now();
  1141. this.endDate = endDate + (this.timeZoneOffset * 60 * 60 * 1000);
  1142. this.duration = (this.endDate - this.startDate) / 1000;
  1143. this.timerTimeoutInstance = null;
  1144. this.format = ['HH', 'MM', 'SS'];
  1145. this.callbackData = {};
  1146. this.resetView();
  1147. };
  1148. timer_ADORIC_timer__kqaxxx47.prototype.initDomElement = function() {
  1149. this.timerContainer = document.querySelectorAll('#ADORIC_timer__kqaxxx47').item(document.querySelectorAll('#ADORIC_timer__kqaxxx47').length - 1);
  1150. this.daysOutput = this.timerContainer.querySelector('.element-timer-digit[data-digit="DD"]');
  1151. this.hoursOutput = this.timerContainer.querySelector('.element-timer-digit[data-digit="HH"]');
  1152. this.minutesOutput = this.timerContainer.querySelector('.element-timer-digit[data-digit="MM"]');
  1153. this.secondsOutput = this.timerContainer.querySelector('.element-timer-digit[data-digit="SS"]');
  1154. };
  1155. timer_ADORIC_timer__kqaxxx47.prototype.resetView = function() {
  1156. this.daysOutput.textContent = '00';
  1157. this.hoursOutput.textContent = '00';
  1158. this.minutesOutput.textContent = '00';
  1159. this.secondsOutput.textContent = '00';
  1160. };
  1161. timer_ADORIC_timer__kqaxxx47.prototype.start = function() {
  1162. this.initDomElement();
  1163. if (this.running) {
  1164. return false;
  1165. }
  1166. this.running = true;
  1167. var that = this;
  1168. this.timerContainer.dispatchEvent(timerStart);
  1169. (function timer() {
  1170. var diff = Math.floor(that.duration - (((Date.now() - that.startDate) / 1000)));
  1171. var days = 0,
  1172. hours = 0,
  1173. minutes = 0,
  1174. seconds = 0;
  1175. if (diff > 0) {
  1176. seconds = (!!~that.format.indexOf('MM') ? (diff % 60) : diff);
  1177. minutes = (!!~that.format.indexOf('HH') ? Math.floor((diff / 60) % 60) : Math.floor(diff / 60));
  1178. hours = (!!~that.format.indexOf('DD') ? Math.floor(((diff / 60) / 60) % 24) : Math.floor((diff / 60) / 60));
  1179. days = Math.floor(((diff / 60) / 60) / 24);
  1180. } else {
  1181. that.timerContainer.dispatchEvent(timerEnd);
  1182. that.kill();
  1183. }
  1184. that.daysOutput.textContent = days;
  1185. that.hoursOutput.textContent = (hours.toString().length > 1 ? hours : '0' + hours.toString());
  1186. that.minutesOutput.textContent = (minutes.toString().length > 1 ? minutes : '0' + minutes.toString());
  1187. that.secondsOutput.textContent = (seconds.toString().length > 1 ? seconds : '0' + seconds.toString());
  1188. that.running && (that.timerTimeoutInstance = setTimeout(timer, 1000));
  1189. })();
  1190. };
  1191. timer_ADORIC_timer__kqaxxx47.prototype.stop = function() {
  1192. this.running = false;
  1193. clearTimeout(this.timerTimeoutInstance);
  1194. };
  1195. timer_ADORIC_timer__kqaxxx47.prototype.kill = function() {
  1196. this.stop();
  1197. this.start = null;
  1198. clearTimeout(this.timerTimeoutInstance);
  1199. this.timerTimeoutInstance = null;
  1200. delete window.timerInstance_ADORIC_timer__kqaxxx47;
  1201. };
  1202. delete window.timerInstance_ADORIC_timer__kqaxxx47;
  1203. window.timerInstance_ADORIC_timer__kqaxxx47 = new timer_ADORIC_timer__kqaxxx47();
  1204. if (window.timerInstance_ADORIC_timer__kqaxxx47.duration > 0) {
  1205. window.timerInstance_ADORIC_timer__kqaxxx47.start();
  1206. }
  1207. }
  1208. var endDate = new Date(Date.parse('2021-06-25T13:00:00.000+01:00'));
  1209. endDate = endDate.getTime();
  1210. restartTimer(endDate);
  1211. </script>
  1212.  
  1213. ==========================================================================================================================================
  1214. =============================================submit unique email from the form:=============================================
  1215.  
  1216. function isEmailSubmitted(newEmail) {
  1217. var allSubmittedEmails = window.localStorage.getItem('adoricSentEmails');
  1218. if (!allSubmittedEmails) {
  1219. allSubmittedEmails = [];
  1220. allSubmittedEmails.push(newEmail);
  1221. window.localStorage.setItem('adoricSentEmails', allSubmittedEmails.toString());
  1222. return false;
  1223. } else {
  1224. allSubmittedEmails = allSubmittedEmails.split(',');
  1225. }
  1226. for (let i = 0; i < allSubmittedEmails.length; i++) {
  1227. if (allSubmittedEmails[i].indexOf(newEmail) != -1) {
  1228. return true;
  1229. }
  1230. }
  1231. allSubmittedEmails.push(newEmail);
  1232. window.localStorage.setItem('adoricSentEmails', allSubmittedEmails.toString());
  1233. return false;
  1234. }
  1235.  
  1236.  
  1237. =======================================================================================================================================
  1238. <script>
  1239. //How to separate Drag and Swipe from Click and Touch events
  1240.  
  1241. let isSwiping = false;
  1242.  
  1243. document.getElementById('demo').addEventListener('mousedown', () => {
  1244. this.isSwiping = false;
  1245. });
  1246.  
  1247. document.getElementById('demo').addEventListener('mousemove', () => {
  1248. this.isSwiping = true;
  1249. });
  1250.  
  1251. document.getElementById('demo').addEventListener('mouseup', e => {
  1252. if (this.isSwiping && e.button === 0) {
  1253. console.log('dragging');
  1254. } else {
  1255. console.log('not dragging');
  1256. }
  1257.  
  1258. this.isSwiping = false;
  1259. });
  1260.  
  1261. document.getElementById('demo').addEventListener('touchstart', () => {
  1262. this.isSwiping = false;
  1263. });
  1264.  
  1265. document.getElementById('demo').addEventListener('touchmove', () => {
  1266. this.isSwiping = true;
  1267. });
  1268.  
  1269. document.getElementById('demo').addEventListener('touchend', e => {
  1270. e.preventDefault();
  1271.  
  1272. if (this.isSwiping) {
  1273. console.log('swiping');
  1274. } else {
  1275. console.log('not swiping');
  1276. }
  1277.  
  1278. this.isSwiping = false;
  1279. });
  1280.  
  1281. </script>
  1282.  
  1283. ===================================================TTL to show again ====================================================================================
  1284. <script>
  1285. (function() {
  1286. var campaignIdentifier = 'entrance_email_capture';
  1287. var campaignIdentifierCounter = 'entrance_email_capture_counter';
  1288.  
  1289. function writeCookie(key, value, expires) {
  1290. var now = new Date();
  1291. var cookieString = '';
  1292. if (expires) {
  1293. var time = now.getTime();
  1294. time += expires;
  1295. now.setTime(time);
  1296. cookieString = key + '=' + value + '; expires=' + now.toUTCString() + '; path=/';
  1297. } else {
  1298. cookieString = key + '=' + value + '; expires=Fri, 31 Dec 9999 23:59:59 GMT"; path=/';
  1299. }
  1300. window.document.cookie = cookieString;
  1301. return value;
  1302. };
  1303.  
  1304. function getCookie(cname) {
  1305. var name = cname + "=";
  1306. var decodedCookie = decodeURIComponent(document.cookie);
  1307. var ca = decodedCookie.split(';');
  1308. for (var i = 0; i < ca.length; i++) {
  1309. var c = ca[i];
  1310. while (c.charAt(0) == ' ') {
  1311. c = c.substring(1);
  1312. }
  1313. if (c.indexOf(name) == 0) {
  1314. return c.substring(name.length, c.length);
  1315. }
  1316. }
  1317. return "";
  1318. }
  1319. writeCookie(campaignIdentifier, '12hTTL', true);
  1320. var isCounterExist = getCookie(campaignIdentifierCounter);
  1321. if (isCounterExist) {
  1322. isCounterExist = parseInt(isCounterExist);
  1323. isCounterExist++;
  1324. writeCookie(campaignIdentifierCounter, isCounterExist);
  1325. } else {
  1326. writeCookie(campaignIdentifierCounter, 1);
  1327. }
  1328. })();
  1329. </script>
  1330.  
  1331.  
  1332.  
  1333. /*=================== GET IP ===================*/
  1334. <script>
  1335. try {
  1336.  
  1337. fetch('https://ifconfig.co/json', {
  1338. method: 'GET'
  1339. })
  1340. .then(res => res.json())
  1341. .then(json => {
  1342. console.log('!======== currentIPdata - ', json.ip);
  1343. if (!json.ip) {
  1344. var result = JSON.parse(json);
  1345. console.log('currentIPdata - ', result.ip);
  1346. }
  1347. console.log('All IP information - ', json);
  1348. });
  1349. } catch (error) {
  1350. console.log('error - ', error.message);
  1351. res.status(500).send(error.message);
  1352. }
  1353.  
  1354.  
  1355. {
  1356. "name": "sample-http",
  1357. "version": "0.0.1",
  1358. "dependencies": {
  1359. "node-fetch": "2.6.1"
  1360. },
  1361. "main": "index.js"
  1362. }
  1363. </script>
  1364. /*=================== GET IP ===================*/
  1365.  
  1366. Soda custom event sending:
  1367. function pushCustomGAEvent(eventType, eventElementType, elementId) {
  1368. if (window.preDataLayer) {
  1369. preDataLayer.push({
  1370. event: 'newEvent',
  1371. newEventData: {
  1372. type: eventType,
  1373. elementType: eventElementType,
  1374. elementId: elementId
  1375. }
  1376. });
  1377. }
  1378. }
  1379. pushCustomGAEvent('Adoric', 'submission', 'Email capture disengagement');
  1380.  
  1381.  
  1382.  
  1383.  
  1384. =================== Check list ===================
  1385. I don't see my campaign on the site, what I have to do?
  1386.  
  1387. 0. just call Niko, they will help!)))
  1388. 1. Be sure that you testing the campaign in a new incognito window.
  1389. 2. Check the placement option URL and URL that you using in the test browser window(https://cln.sh/iKw5aK)
  1390. a) for direct link case, the best way to be sure it's same URLs,
  1391. copy the URL from the browser and in campaigns settings and
  1392. paste it in some text editor with two lines like that: https://cln.sh/pb1GJk
  1393. b) for the option 'contain' keyword in the URL
  1394.  
  1395.  
  1396. window.addEventListener('beforeunload', function(e) {e.preventDefault(); e.returnValue = '';});
  1397.  
  1398.  
  1399. async function getMyLocation1() {
  1400. try {
  1401. var promise = new Promise(function(resolve, reject) {
  1402. fetch('https://ipinfo.io/json', {
  1403. method: 'GET'
  1404. }).then(res => res.json()).then(response => {
  1405. resolve(response.country);
  1406. }).catch(error => {
  1407. reject('error');
  1408. });
  1409. });
  1410. return await promise;
  1411. } catch (error) {
  1412. return error.message;
  1413. }
  1414. }
  1415. var result1 = await getMyLocation1();
  1416. async function getMyLocation2() {
  1417. try {
  1418. var promise = new Promise(function(resolve, reject) {
  1419. fetch('https://api.ipregistry.co/?key=tryout', {
  1420. method: 'GET'
  1421. }).then(res => res.json()).then(response => {
  1422. if (response.location && response.location.country && response.location.country.code) {
  1423. resolve(response.location.country.code);
  1424. }
  1425. }).catch(error => {
  1426. reject('error');
  1427. });
  1428. });
  1429. return await promise;
  1430. } catch (error) {
  1431. return error.message;
  1432. }
  1433. }
  1434.  
  1435. function getFormattedDate(date) {
  1436. var year = date.getFullYear();
  1437. var month = (1 + date.getMonth()).toString();
  1438. month = month.length > 1 ? month : '0' + month;
  1439. var day = date.getDate().toString();
  1440. day = day.length > 1 ? day : '0' + day;
  1441. return day + '-' + month + '-' + year;
  1442. }
  1443.  
  1444.  
  1445. try {
  1446. console.log('check IP start');
  1447. const response = await fetch('https://ifconfig.co/json');
  1448. const data = await response.json();
  1449. console.log('check IP response - ', data);
  1450. } catch (error) {
  1451. console.log('check IP failed');
  1452. }
  1453.  
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement