branchlocator datalayer added

blocks/branch-detail-description/branch-detail-description.js

@@ -1,3 +1,4 @@
+import { intertextLinkingInteraction } from "../../dl.js";
 import { setLocationObj } from "../moredetailsaddress/moredetailsaddress.js";
 
 
@@ -27,7 +28,14 @@ export default function decorate(block) {
 
  let button = block.querySelector(".button-container");
  let description = block.querySelector(".branch-description-content");
- button.addEventListener("click", () => {
+ button.addEventListener("click", (e) => {
+ try {
+ const dataAnalytics = {}
+ dataAnalytics.click_text = e.target.textContent.trim().toLowerCase()
+ intertextLinkingInteraction(dataAnalytics)
+ } catch (error) {
+ console.warn(error);
+ }
  description.querySelector('.dp-none').classList.remove('dp-none');
  button.classList = 'dp-none';
  });

blocks/branchlocator/branchlocator-biz.js

@@ -1,5 +1,6 @@
+import { locateMeInteraction, selectBranchInteraction } from "../../dl.js";
 import { loadScript } from "../../scripts/aem.js";
-import { branchURLStr, fetchAPI } from "../../scripts/scripts.js";
+import { branchURLStr, fetchAPI, selectBranchDetails } from "../../scripts/scripts.js";
 import returnLatLan from "../select-tag/getSelectedLanguage.js";
 import { initMap, searchBranchByURL } from "./branchlocator-api.js";
 import { setLocationObj } from "./branchlocator-init.js";
@@ -74,6 +75,7 @@ export async function onloadBranchLocator(block) {
  let multipleBranch = innerBranchFunc(branchhList);
  block.closest('.section').querySelector('.title-to-show').innerText = 'Find all ' + setLocationObj.geoInfo.city+ ' Branches here';
  block.closest('.section').querySelector('.branch-list-wrapper').innerHTML = multipleBranch;
+ selectBranchDetails(block);
  if (setLocationObj.geoInfo.state && !setLocationObj.geoInfo.city) {
  block.closest('.section').querySelector('.city-wrapper').classList.remove('dp-none');
  block.closest('.section').querySelector('.city-wrapper input').focus();
@@ -293,6 +295,11 @@ export function onClickCity(block){
 export function locateMeClick(block){
  let locateMeEvent = block.closest('.section').querySelector('.btn-locate');
  locateMeEvent.addEventListener('click', async function (e){
+ try {
+ locateMeInteraction();
+ } catch (error) {
+ console.warn(error)
+ }
  let {lat, lng} = await returnLatLan();
  setLocationObj.lat = lat;
  setLocationObj.lng = lng;
@@ -322,16 +329,30 @@ export function locateMeClick(block){
  renderCity(block, setLocationObj);
  renderState(block, setLocationObj); 
  let multipleBranch = innerBranchFunc(branchhList);
- block.closest('.section').querySelector('.branch-list-wrapper').innerHTML = multipleBranch; 
+ block.closest('.section').querySelector('.branch-list-wrapper').innerHTML = multipleBranch; 
+ selectBranchDetails(block); 
  }else{
  block.closest('.section').querySelector('.nearest-txt').innerText = "Kindly enable your Location and Refresh the page";
  this.classList.add('dp-none');
  }
  });
+
+ try {
+ let branchDetailBtn = block.closest('.section').querySelector('.btn-locate-details');
+ branchDetailBtn.addEventListener('click' ,function(e){
+ const dataAnalytics = {}
+ dataAnalytics.cta_position = e.target.closest(".branch-info-container")?.querySelector(".nearest-txt")?.textContent.trim();
+ dataAnalytics.branch_name = e.target.closest(".branch-info-container")?.querySelector(".branch-deatils .branch-addr")?.textContent.trim().split('-')[1].trim();
+ selectBranchInteraction(dataAnalytics);
+ })
+ } catch (error) {
+ console.warn(error)
+ }
 }
 
 function sortByState(data){
  return Object.values(data[setLocationObj.geoInfo.state]);
 }
 
 
+

blocks/imgwithlink/imgwithlink.js

@@ -6,7 +6,7 @@ export default function decorate(block) {
  if (newDiv) {
  block.innerHTML = "";
  block.appendChild(newDiv);
- if (document.querySelectorAll('.download-piramal-wrapper')) {
+ if (document.querySelectorAll('.download-piramal-wrapper').length > 0) {
  var desktopLinks = document.querySelectorAll('.download-piramal-wrapper .image-href-desktop a');
  var mobileLinks = document.querySelectorAll('.download-piramal-wrapper .image-href-mobile a');
  var anchor_class = desktopLinks.length > 0 ? desktopLinks : mobileLinks;

blocks/nearestlocation/nearestlocation.js

@@ -1,4 +1,4 @@
-import { branchURLStr } from "../../scripts/scripts.js";
+import { branchURLStr, selectBranchDetails } from "../../scripts/scripts.js";
 import { setLocationObj } from "../moredetailsaddress/moredetailsaddress.js";
 
 export function nearestLoction() {
@@ -45,4 +45,5 @@ export default function decorate(block) {
  if(DOMnearestBranch){
  block.innerHTML = DOMnearestBranch;
  }
+ selectBranchDetails(block);
 }

dl.js

@@ -279,4 +279,44 @@ export function documentDownloadInteraction(data) {
  } catch (error) {
  console.warn(error);
  }
+}
+
+export function locateMeInteraction(){
+ try {
+ window.dataLayer.push({
+ 'event': 'locate_me',
+ 'page_type':targetObject.pageName || "",
+ });
+ } catch (error) {
+ console.warn(error)
+ }
+}
+
+export function selectBranchInteraction(data){
+ try {
+ const {branch_name, cta_position} = data;
+ window.dataLayer.push({
+ 'event': 'select_branch',
+ 'branch_name': branch_name || "",
+ 'cta_position': cta_position || "",
+ 'page_type': targetObject.pageName || ""
+ });
+
+ } catch (error) {
+ console.warn(error);
+ }
+}
+
+export function intertextLinkingInteraction(data){
+ try {
+ const {click_text} =data;
+ window.dataLayer.push({
+ 'event': 'intertext_linking',
+ 'click_text': click_text || "",
+ 'page_type': targetObject.pageName || ""
+ });
+
+ } catch (error) {
+ console.warn(error);
+ }
 }

scripts/scripts.js

@@ -2,7 +2,7 @@ import { formOpen, overlay } from "../blocks/applyloanform/applyloanforms.js";
 import { statemasterGetStatesApi } from "../blocks/applyloanform/statemasterapi.js";
 import { validationJSFunc } from "../blocks/applyloanform/validation.js";
 import { toggleAllNavSections } from "../blocks/header/header.js";
-import { applyLoanInteraction } from "../dl.js";
+import { applyLoanInteraction, selectBranchInteraction } from "../dl.js";
 import { sampleRUM, loadHeader, loadFooter, decorateButtons, decorateIcons, decorateSections, decorateBlocks, decorateTemplateAndTheme, waitForLCP, loadBlocks, loadCSS, fetchPlaceholders } from "./aem.js";
 const LCP_BLOCKS = []; // add your LCP blocks to the list
 
@@ -954,4 +954,21 @@ export function branchURLStr(location = "", city = "", state = "", urlstrhand, l
  return `/branch-locator/loans-in-${locationAdd}-${cityStr}-${stateStr}-${locationcode}`;
  }
  }
+}
+
+
+export function selectBranchDetails(block) {
+ let cards = block.closest('.section').querySelectorAll('.branch-list-wrapper a')
+ cards.forEach(function (card) {
+ try {
+ card.addEventListener("click", function (e) {
+ const dataAnalytics = {}
+ dataAnalytics.cta_position = e.target.closest(".cards-branches-container ")?.querySelector(".title h2")?.textContent.trim();
+ dataAnalytics.branch_name = e.target.closest(".card-box")?.querySelector(".card-title")?.textContent.trim().replace(/\s+/g, ' ');
+ selectBranchInteraction(dataAnalytics);
+ })
+ } catch (error) {
+ console.warn(error)
+ }
+ })
 }