json
unknown
javascript
a year ago
36 kB
2
Indexable
(function () {
try {
var debug = 1;
var variation_name = "";
window.megaMenuData = {
"des": [
// Men
{
"id": "eg-men",
"featured": {
"legend": "Featured",
"content": [
{
"linkText": "New Arrivals",
"linkUrl": ""
},
{
"linkText": "Best Sellers",
"linkUrl": ""
},
{
"linkText": "Big & Tall",
"linkUrl": ""
},
{
"linkText": "Jacket Finder",
"linkUrl": ""
},
{
"linkText": "Shop by Activity",
"linkUrl": ""
},
{
"linkText": "Shop by Technology",
"linkUrl": ""
},
]
},
"content": [
{
"legend": "Jackets & Vests",
"content": [
{
"linkText": "Insulated and Down",
"linkUrl": ""
},
{
"linkText": "Rainwear",
"linkUrl": ""
},
{
"linkText": "Ski and Snowboard",
"linkUrl": ""
},
{
"linkText": "Fleece",
"linkUrl": ""
},
{
"linkText": "Softshell",
"linkUrl": ""
},
{
"linkText": "Vests",
"linkUrl": ""
},
]
},
{
"legend": "Tops",
"content": [
{
"linkText": "Shirts and Polos",
"linkUrl": ""
},
{
"linkText": "Sweatshirts and Hoodies",
"linkUrl": ""
},
{
"linkText": "T-Shirts",
"linkUrl": ""
}
]
},
{
"legend": "Bottoms",
"content": [
{
"linkText": "Ski and Snowboard",
"linkUrl": ""
},
{
"linkText": "Hiking Pants",
"linkUrl": ""
},
{
"linkText": "Rainwear",
"linkUrl": ""
},
{
"linkText": "Shorts",
"linkUrl": ""
},
{
"linkText": "Exofficio Underwear",
"linkUrl": ""
}
]
},
{
"legend": "Accessories",
"content": [
{
"linkText": "Hats, Caps and Beanies",
"linkUrl": ""
},
{
"linkText": "Gloves and Mitts",
"linkUrl": ""
},
{
"linkText": "Ski and Snowboard",
"linkUrl": ""
},
{
"linkText": "Fleece",
"linkUrl": ""
},
{
"linkText": "Softshell",
"linkUrl": ""
},
{
"linkText": "Vests",
"linkUrl": ""
},
]
},
{
"legend": "Find Your Fit",
"content": []
},
]
},
// Women
{
"id": "eg-women",
"featured": {
"legend": "Featured",
"content": [
{
"linkText": "New Arrivals",
"linkUrl": ""
},
{
"linkText": "Best Sellers",
"linkUrl": ""
},
{
"linkText": "Plus Size",
"linkUrl": ""
},
{
"linkText": "Jacket Finder",
"linkUrl": ""
},
{
"linkText": "Shop by Activity",
"linkUrl": ""
},
{
"linkText": "Shop by Technology",
"linkUrl": ""
},
]
},
"content": [
{
"legend": "Jackets & Vests",
"content": [
{
"linkText": "Insulated and Down",
"linkUrl": ""
},
{
"linkText": "Rainwear",
"linkUrl": ""
},
{
"linkText": "Ski and Snowboard",
"linkUrl": ""
},
{
"linkText": "Fleece",
"linkUrl": ""
},
{
"linkText": "Softshell",
"linkUrl": ""
},
{
"linkText": "Vests",
"linkUrl": ""
},
]
},
{
"legend": "Tops",
"content": [
{
"linkText": "Shirts and Polos",
"linkUrl": ""
},
{
"linkText": "Sweatshirts and Sweaters",
"linkUrl": ""
},
{
"linkText": "T-Shirts and Tank Tops",
"linkUrl": ""
}
]
},
{
"legend": "Bottoms",
"content": [
{
"linkText": "Ski and Snowboard",
"linkUrl": ""
},
{
"linkText": "Hiking Pants",
"linkUrl": ""
},
{
"linkText": "Rainwear",
"linkUrl": ""
},
{
"linkText": "Shorts",
"linkUrl": ""
},
{
"linkText": "Activewear",
"linkUrl": ""
},
{
"linkText": "Exofficio Underwear",
"linkUrl": ""
}
]
},
{
"legend": "Accessories",
"content": [
{
"linkText": "Hats, Caps and Beanies",
"linkUrl": ""
},
{
"linkText": "Gloves and Mitts",
"linkUrl": ""
}
]
},
{
"legend": "Find Your Fit",
"content": []
},
]
},
// Equipment
{
"id": "eg-Equipment",
"featured": {
"legend": "Featured",
"content": [
{
"linkText": "New Arrivals",
"linkUrl": ""
},
{
"linkText": "Best Sellers",
"linkUrl": ""
},
{
"linkText": "Sleeping Bag Finder",
"linkUrl": ""
},
{
"linkText": "Shop by Activity",
"linkUrl": ""
}
]
},
"content": [
{
"legend": "Tents",
"content": [
{
"linkText": "1 Person",
"linkUrl": ""
},
{
"linkText": "2 Person",
"linkUrl": ""
},
{
"linkText": "3 Person",
"linkUrl": ""
},
{
"linkText": "4 Person",
"linkUrl": ""
},
{
"linkText": "5 Person",
"linkUrl": ""
},
{
"linkText": "6+ Person",
"linkUrl": ""
},
{
"linkText": "Foot Prints",
"linkUrl": ""
},
]
},
{
"legend": "Sleeping Bags",
"content": [
{
"linkText": "Down Bags",
"linkUrl": ""
},
{
"linkText": "Synthertic",
"linkUrl": ""
},
{
"linkText": "Camping",
"linkUrl": ""
}
,
{
"linkText": "Backpacking",
"linkUrl": ""
}
,
{
"linkText": "Ultralight",
"linkUrl": ""
}
,
{
"linkText": "Mountaineering",
"linkUrl": ""
},
{
"linkText": "L3 Accessories Link",
"linkUrl": ""
}
,
{
"linkText": "650 Sleeping Bags",
"linkUrl": ""
}
]
},
{
"legend": "Water Bottle",
"content": []
},
{
"legend": "",
"content": []
},
{
"legend": "Take the Quiz",
"content": []
}
]
},
// kids
{
"id": "eg-Kids",
"featured": {
"legend": "Featured",
"content": [
{
"linkText": "New Arrivals",
"linkUrl": ""
},
{
"linkText": "Best Sellers",
"linkUrl": ""
}
]
},
"content": [
{
"legend": "Boys",
"content": [
{
"linkText": "Jackets",
"linkUrl": ""
},
{
"linkText": "Bottoms",
"linkUrl": ""
}
]
},
{
"legend": "Girls",
"content": [
{
"linkText": "Jackets",
"linkUrl": ""
},
{
"linkText": "Bottoms",
"linkUrl": ""
}
]
},
{
"legend": "Equipment",
"content": [
{
"linkText": "Sleeping Bags",
"linkUrl": ""
}
]
},
{
"legend": "",
"content": []
},
{
"legend": "Take the Quiz",
"content": []
}
]
},
// Sale
{
"id": "eg-Sale",
"featured": {
"legend": "Featured",
"content": [
{
"linkText": "New Arrivals",
"linkUrl": ""
},
{
"linkText": "Best Sellers",
"linkUrl": ""
}
]
},
"content": [
{
"legend": "Men",
"content": [
{
"linkText": "Jackets and Vests",
"linkUrl": ""
},
{
"linkText": "Tops",
"linkUrl": ""
},
{
"linkText": "Bottoms",
"linkUrl": ""
},
{
"linkText": "Accessories",
"linkUrl": ""
}
]
},
{
"legend": "Women",
"content": [
{
"linkText": "Jackets and Vests",
"linkUrl": ""
},
{
"linkText": "Tops",
"linkUrl": ""
},
{
"linkText": "Bottoms",
"linkUrl": ""
},
{
"linkText": "Accessories",
"linkUrl": ""
}
]
},
{
"legend": "Equipment",
"content": [
{
"linkText": "Tents",
"linkUrl": ""
},
{
"linkText": "Sleeping Bags",
"linkUrl": ""
}
]
},
{
"legend": "Kids",
"content": [
{
"linkText": "Boys",
"linkUrl": ""
},
{
"linkText": "Girls",
"linkUrl": ""
}
]
},
{
"legend": "Find Your Fit",
"content": []
}
]
},
// Holiday
{
"id": "eg-Holiday",
"featured": {
"legend": "Featured",
"content": [
{
"linkText": "Gifts Under $100",
"linkUrl": ""
},
{
"linkText": "Gifts Under $300",
"linkUrl": ""
},
{
"linkText": "Gifts Under $500",
"linkUrl": ""
},
{
"linkText": "Holiday Gift Guide",
"linkUrl": ""
}
]
},
"content": [
{
"legend": "",
"content": []
},
{
"legend": "",
"content": []
},
{
"legend": "",
"content": []
},
{
"legend": "",
"content": []
},
{
"legend": "",
"content": []
}
]
},
]
}
function waitForElement(selector, trigger, delayInterval, delayTimeout) {
var interval = setInterval(function () {
if (
document &&
document.querySelector(selector) &&
document.querySelectorAll(selector).length > 0
) {
clearInterval(interval);
trigger();
}
}, delayInterval);
setTimeout(function () {
clearInterval(interval);
}, delayTimeout);
}
let resizedHeight = 0;
const checkHeaderResizing = (header) => {
const resizeObserver = new ResizeObserver(entries => {
for (let entry of entries) {
if (entry.target === header) {
const newHeight = entry.contentRect.height;
resizedHeight = newHeight;
console.log('Header height:', newHeight, 'pixels');
waitForElement("html body .eg-mega-menu-mob", function () {
document.querySelector('html body .eg-mega-menu-mob').style.cssText = `--removedHeight:${resizedHeight}px !important`;
}, 50, 15000);
}
}
});
resizeObserver.observe(header);
}
const egCutIcon = `<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="6 6 20 20" xml:space="preserve"><path d="M17.414,16l4.95,4.95l-1.414,1.414L16,17.414l-4.95,4.95L9.636,20.95l4.95-4.95l-4.95-4.95 l1.414-1.414l4.95,4.95l4.95-4.95l1.414,1.414L17.414,16z" fill="#000000"></path></svg>`;
const egCarrot = `<svg role="img" class="icon svg-icon arrow-down eg-carrot" width="10" height="6" aria-hidden="true" tabindex="-1">
<title>icon</title>
<desc>icon</desc>
<use role="img" xlink:href="#arrow-down" alt="icon"></use>
</svg>`;
const genDesMegaMenus = () => {
const megaMenuData = window.megaMenuData.des;
const html = megaMenuData.reduce(function (td, crrD) {
const id = crrD.id;
const featuredContentsHtml = genDesContentsHTML(crrD.featured.content);
const featuredHTML = `
<ul class="eg-mega_sidebar">
<li class="eg-mega_sidebar-legend">Featured</li>
${featuredContentsHtml}
</ul>
`;
// megaMenu right side content html
const rightSidecontents = crrD.content.reduce(function (trd, crd) {
const rightSidecontentHTML = genDesContentsHTML(crd.content);
return trd += `
<ul class="eg-mega_content-card">
<li class="eg-mega_content-card-legend"><a>${crd.legend}</a></li>
${rightSidecontentHTML}
</ul>
`;
}, '');
return td += `
<div class="eg-mega-menu-des" id="${id}">
<!-- sidebar -->
${featuredHTML}
<!-- content -->
<div class="eg-mega_content-container">
${rightSidecontents}
</div>
</div>
`;
}, '');
return html;
}
function genDesContentsHTML(content) {
const contentHTML = content.reduce(function (tf, crrf) {
return tf += `<li class="eg-mega-sidebar-link-item"><a href="${crrf.linkUrl}">${crrf.linkText}</a></li>`;
}, '');
return contentHTML;
}
const megaMenuHTMLMob = `
<div class="eg-mega-menu-mob">
<div class="eg-mega-menu-mob-container">
<!-- header -->
<div class="eg-mega-menu-mob_header">
<!-- back cta -->
<span class="eg-mob_header-bck-cta"><svg role="img" class="icon svg-icon arrow-down eg-carrot" width="10" height="6" aria-hidden="true" tabindex="-1">
<title>icon</title>
<desc>icon</desc>
<use role="img" xlink:href="#arrow-down" alt="icon"></use>
</svg></span>
<!-- title -->
<span class="eg-mob_header-title">Main Menu</span>
<!-- cut cta -->
<span class="eg-mob_header-cut"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="6 6 20 20" xml:space="preserve"><path d="M17.414,16l4.95,4.95l-1.414,1.414L16,17.414l-4.95,4.95L9.636,20.95l4.95-4.95l-4.95-4.95 l1.414-1.414l4.95,4.95l4.95-4.95l1.414,1.414L17.414,16z" fill="#000000"></path></svg></span>
</div>
<ul class="eg-mega-mob_content">
<li class="eg-mega-mob_content-item">
<span class="eg-item-text">Men</span>
<span class="eg-item-forward">
<svg role="img" class="icon svg-icon arrow-down eg-carrot" width="10" height="6" aria-hidden="true" tabindex="-1">
<title>icon</title>
<desc>icon</desc>
<use role="img" xlink:href="#arrow-down" alt="icon"></use>
</svg>
</span>
</li>
<li class="eg-mega-mob_content-item">
<span class="eg-item-text">Women</span>
<span class="eg-item-forward">
<svg role="img" class="icon svg-icon arrow-down eg-carrot" width="10" height="6" aria-hidden="true" tabindex="-1">
<title>icon</title>
<desc>icon</desc>
<use role="img" xlink:href="#arrow-down" alt="icon"></use>
</svg>
</span>
</li><li class="eg-mega-mob_content-item">
<span class="eg-item-text">Equipment</span>
<span class="eg-item-forward">
<svg role="img" class="icon svg-icon arrow-down eg-carrot" width="10" height="6" aria-hidden="true" tabindex="-1">
<title>icon</title>
<desc>icon</desc>
<use role="img" xlink:href="#arrow-down" alt="icon"></use>
</svg>
</span>
</li><li class="eg-mega-mob_content-item">
<span class="eg-item-text">Kids</span>
<span class="eg-item-forward">
<svg role="img" class="icon svg-icon arrow-down eg-carrot" width="10" height="6" aria-hidden="true" tabindex="-1">
<title>icon</title>
<desc>icon</desc>
<use role="img" xlink:href="#arrow-down" alt="icon"></use>
</svg>
</span>
</li><li class="eg-mega-mob_content-item">
<span class="eg-item-text">Sale</span>
<span class="eg-item-forward">
<svg role="img" class="icon svg-icon arrow-down eg-carrot" width="10" height="6" aria-hidden="true" tabindex="-1">
<title>icon</title>
<desc>icon</desc>
<use role="img" xlink:href="#arrow-down" alt="icon"></use>
</svg>
</span>
</li><li class="eg-mega-mob_content-item">
<span class="eg-item-text">Holiday</span>
<span class="eg-item-forward">
<svg role="img" class="icon svg-icon arrow-down eg-carrot" width="10" height="6" aria-hidden="true" tabindex="-1">
<title>icon</title>
<desc>icon</desc>
<use role="img" xlink:href="#arrow-down" alt="icon"></use>
</svg>
</span>
</li></ul>
<ul class="eg-mega-mob_content eg-meg-mob_content-utilities">
<li class="eg-mega-mob_content-item eg-utility-tab">
<span class="eg-item-text">Support</span>
<span class="eg-item-forward">
<svg role="img" class="icon svg-icon arrow-down eg-carrot" width="10" height="6" aria-hidden="true" tabindex="-1">
<title>icon</title>
<desc>icon</desc>
<use role="img" xlink:href="#arrow-down" alt="icon"></use>
</svg>
</span>
</li>
<div class="eg-mega-mob_content-item eg-content-item-content">
<a class="eg-utility-tab-link">Frequently Asked Questions</a>
<a class="eg-utility-tab-link">Track Orders</a><a class="eg-utility-tab-link">Returns</a><a class="eg-utility-tab-link">Warranty</a><a class="eg-utility-tab-link">Contact Us</a></div><a class="eg-mega-mob_content-item">
<span class="eg-item-text">Track Order</span>
</a><a class="eg-mega-mob_content-item">
<span class="eg-item-text">Marmot Rewards</span>
</a></ul></div>
</div>
`;
function init() {
// desktop
megaMenuDesktop();
// mobile
megaMenuMob();
}
const megaMenuHTMLDes = genDesMegaMenus();
function megaMenuDesktop() {
// Target to put mega menu
waitForElement("header", function () {
const target = document.querySelector("header");
if (!document.querySelector(".eg-mega-menu-des")) {
target.insertAdjacentHTML("beforeend", megaMenuHTMLDes);
}
}, 50, 15000);
waitForElement(".header-content", function () {
const target = document.querySelector(".header-content");
if (!document.querySelector(".eg-mega-menu-des")) {
target.insertAdjacentHTML("beforeend", megaMenuHTMLDes);
}
}, 50, 15000);
waitForElement("html body header .desktop >.nav-link", function () {
const linksEls = document.querySelectorAll('html body header .desktop >.nav-link');
const megaMenus = document.querySelectorAll('.eg-mega-menu-des');
["mouseenter"].forEach(ev => {
linksEls.forEach(linkEl => {
linkEl.addEventListener(ev, function () {
const catNm = this.getAttribute("data-category-name");
if (catNm) {
document.body.setAttribute("data-show-menu", catNm);
}
});
})
});
["mouseleave"].forEach(ev => {
megaMenus.forEach(megamenu => {
megamenu.addEventListener(ev, function () {
document.body.removeAttribute("data-show-menu");
});
})
});
}, 500, 15000);
}
function megaMenuMob() {
// Target to put mega menu
const target = document.querySelector("body");
if (!document.querySelector(".eg-mega-menu-mob")) {
target.insertAdjacentHTML("beforeend", megaMenuHTMLMob);
waitForElement("header", function () {
const target = document.querySelector("header");
checkHeaderResizing(target);
}, 50, 15000);
waitForElement("#primary_header", function () {
const target = document.querySelector("#primary_header");
checkHeaderResizing(target);
}, 50, 15000);
}
}
waitForElement('body', init, 50, 15000);
} catch (e) {
if (debug) console.log(e, "error in Test" + variation_name);
}
})();