(function () { /* ===================================================== MOO:D — FAQ ENGINE CARRD SAFE VERSION NO HTML BUTTONS FOR QUESTIONS ===================================================== */ var box = document.getElementById( 'moodFAQAccordion' ); var tabs = document.getElementById( 'moodFAQTabs' ); if ( !box || !tabs ) { return; } /* ===================================================== FAQ DATA ===================================================== */ var data = [ [ '01', 'one', 'What exactly is a One-of-One Brand?', 'A One-of-One Brand is a complete strategic brand identity created once and sold to one owner only. Once purchased, that identity is retired from MOO:D and will never be sold again.' ], [ '02', 'one', 'What’s included in a One-of-One Brand?', 'Each One-of-One Brand includes its own carefully designed set of brand assets. The exact deliverables are listed in the individual brand details before purchase.' ], [ '03', 'one', 'What happens after I purchase a One-of-One Brand?', 'Once the purchase is complete, the brand is removed from availability and reserved exclusively for you. You’ll then receive the files and information included with that identity.' ], [ '04', 'one', 'Can a sold One-of-One Brand ever be sold again?', 'No. Once a One-of-One Brand has an owner, it is permanently retired from MOO:D and will not be offered to another customer.' ], [ '05', 'one', 'Can I make changes after purchasing the brand?', 'Yes. You can continue developing your brand after purchase. If you want MOO:D to adapt or expand the identity, contact us about custom design work.' ], [ '06', 'digital', 'What are MOO:D Digital Goods?', 'Digital Goods are ready-to-use creative resources designed to help you create faster. They may include Canva templates, social kits, graphics, planners, mockups and other downloadable assets.' ], [ '07', 'digital', 'What’s included with a Digital Good?', 'Every product is different. The product description explains exactly what you receive, including any templates, graphics, planning tools, mockups or downloadable files.' ], [ '08', 'digital', 'How do I receive my digital files?', 'Digital Goods are delivered electronically after purchase. Any instructions needed to access or edit the files will be included with your order.' ], [ '09', 'license', 'Can I use Digital Goods for commercial projects?', 'Permitted use depends on the license attached to the product. Please review the MOO:D License & Usage terms before using an asset for client, business or commercial work.', 'license' ], [ '10', 'license', 'Can I resell, share or redistribute the files?', 'No. MOO:D files may not be resold, redistributed or shared as standalone assets unless a specific product license explicitly states otherwise.' ], [ '11', 'license', 'Can I get a refund on a Digital Good?', 'Because digital products are delivered electronically, refund eligibility depends on the product, marketplace and circumstances. Please review the applicable Terms & Conditions before purchasing.', 'terms' ], [ '12', 'custom', 'Can MOO:D create something custom for me?', 'Yes. If a ready-made option isn’t quite what you need, MOO:D also offers custom creative work tailored to your project.' ], [ '13', 'custom', 'What if my question isn’t answered here?', 'Send us a message through the Contact page and tell us what you’re looking for. We’ll point you in the right direction.', 'contact' ] ]; var active = 'one'; /* ===================================================== FIND EXISTING FOOTER CONTROL ===================================================== */ function existing( labels, source ) { var found = null; document .querySelectorAll( 'a, button' ) .forEach( function (element) { if ( found || element === source ) { return; } var text = ( element.textContent || '' ) .replace( /\s+/g, ' ' ) .trim() .toLowerCase(); if ( labels.indexOf( text ) > -1 ) { found = element; } } ); if (found) { found.click(); return true; } return false; } /* ===================================================== CLOSE ITEM ===================================================== */ function closeItem( item ) { item.classList.remove( 'is-open' ); var question = item.querySelector( '.mood-faq-question' ); var symbol = item.querySelector( '.mood-faq-symbol' ); if (question) { question.setAttribute( 'aria-expanded', 'false' ); } if (symbol) { symbol.textContent = '+'; } } /* ===================================================== OPEN ITEM ===================================================== */ function openItem( item ) { item.classList.add( 'is-open' ); var question = item.querySelector( '.mood-faq-question' ); var symbol = item.querySelector( '.mood-faq-symbol' ); if (question) { question.setAttribute( 'aria-expanded', 'true' ); } if (symbol) { symbol.textContent = '−'; } } /* ===================================================== CREATE QUESTION IMPORTANT: DIV INSTEAD OF BUTTON ===================================================== */ function createQuestion( row, isOpen ) { var question = document.createElement( 'div' ); question.className = 'mood-faq-question'; question.setAttribute( 'role', 'button' ); question.setAttribute( 'tabindex', '0' ); question.setAttribute( 'aria-expanded', isOpen ? 'true' : 'false' ); /* FORCE LAYOUT INLINE SO CARRD CANNOT COMPRESS IT */ question.style.setProperty( 'display', 'flex', 'important' ); question.style.setProperty( 'width', '100%', 'important' ); question.style.setProperty( 'max-width', 'none', 'important' ); question.style.setProperty( 'min-width', '0', 'important' ); question.style.setProperty( 'align-items', 'center', 'important' ); question.style.setProperty( 'gap', '16px', 'important' ); question.style.setProperty( 'padding', '0 20px', 'important' ); question.style.setProperty( 'cursor', 'pointer', 'important' ); /* NUMBER */ var number = document.createElement( 'span' ); number.className = 'mood-faq-number'; number.textContent = row[0]; number.style.setProperty( 'display', 'block', 'important' ); number.style.setProperty( 'flex', '0 0 34px', 'important' ); number.style.setProperty( 'width', '34px', 'important' ); number.style.setProperty( 'white-space', 'nowrap', 'important' ); /* QUESTION TEXT */ var text = document.createElement( 'span' ); text.className = 'mood-faq-question-text'; text.textContent = row[2]; text.style.setProperty( 'display', 'block', 'important' ); text.style.setProperty( 'flex', '1 1 auto', 'important' ); text.style.setProperty( 'width', 'auto', 'important' ); text.style.setProperty( 'min-width', '0', 'important' ); text.style.setProperty( 'max-width', 'none', 'important' ); text.style.setProperty( 'white-space', 'normal', 'important' ); text.style.setProperty( 'word-break', 'normal', 'important' ); text.style.setProperty( 'overflow-wrap', 'normal', 'important' ); text.style.setProperty( 'text-align', 'left', 'important' ); /* SYMBOL */ var symbol = document.createElement( 'span' ); symbol.className = 'mood-faq-symbol'; symbol.textContent = isOpen ? '−' : '+'; symbol.style.setProperty( 'display', 'block', 'important' ); symbol.style.setProperty( 'flex', '0 0 26px', 'important' ); symbol.style.setProperty( 'width', '26px', 'important' ); symbol.style.setProperty( 'white-space', 'nowrap', 'important' ); question.appendChild( number ); question.appendChild( text ); question.appendChild( symbol ); return question; } /* ===================================================== CREATE ITEM ===================================================== */ function createItem( row, index ) { var isOpen = index === 0; var item = document.createElement( 'article' ); item.className = 'mood-faq-item' + ( isOpen ? ' is-open' : '' ); item.setAttribute( 'data-number', row[0] ); var question = createQuestion( row, isOpen ); /* ANSWER */ var wrap = document.createElement( 'div' ); wrap.className = 'mood-faq-answer-wrap'; var inner = document.createElement( 'div' ); inner.className = 'mood-faq-answer-inner'; var answer = document.createElement( 'div' ); answer.className = 'mood-faq-answer'; answer.style.setProperty( 'width', 'auto', 'important' ); answer.style.setProperty( 'max-width', '650px', 'important' ); var copy = document.createElement( 'div' ); copy.textContent = row[3]; answer.appendChild( copy ); /* OPTIONAL ACTION */ if (row[4]) { var action = document.createElement( 'button' ); action.type = 'button'; action.className = 'mood-faq-inline-action'; action.dataset.action = row[4]; if ( row[4] === 'license' ) { action.textContent = 'Open License & Usage →'; } else if ( row[4] === 'terms' ) { action.textContent = 'View Terms & Conditions →'; } else { action.textContent = 'Contact Us →'; } answer.appendChild( action ); } inner.appendChild( answer ); wrap.appendChild( inner ); item.appendChild( question ); item.appendChild( wrap ); return item; } /* ===================================================== RENDER CATEGORY ===================================================== */ function render() { box.innerHTML = ''; var visible = data.filter( function (row) { return ( row[1] === active ); } ); visible.forEach( function ( row, index ) { box.appendChild( createItem( row, index ) ); } ); } /* ===================================================== TABS ===================================================== */ tabs.addEventListener( 'click', function (event) { var tab = event.target.closest( '.mood-faq-tab' ); if (!tab) { return; } tabs .querySelectorAll( '.mood-faq-tab' ) .forEach( function (item) { item.classList.remove( 'is-active' ); } ); tab.classList.add( 'is-active' ); active = tab.getAttribute( 'data-faq-category' ); render(); } ); /* ===================================================== QUESTION + ACTION CLICK ===================================================== */ box.addEventListener( 'click', function (event) { /* ACTION */ var action = event.target.closest( '.mood-faq-inline-action' ); if (action) { event.preventDefault(); var type = action.dataset.action; if ( type === 'license' ) { existing( [ 'license & usage', 'licence & usage', 'license and usage', 'licence and usage' ], action ); } else if ( type === 'terms' ) { existing( [ 'terms & conditions', 'terms and conditions' ], action ); } else { window.location.hash = 'contact'; } return; } /* QUESTION */ var question = event.target.closest( '.mood-faq-question' ); if (!question) { return; } var item = question.closest( '.mood-faq-item' ); var wasOpen = item.classList.contains( 'is-open' ); box .querySelectorAll( '.mood-faq-item' ) .forEach( function (other) { closeItem( other ); } ); if (!wasOpen) { openItem( item ); } } ); /* ===================================================== KEYBOARD ACCESSIBILITY ===================================================== */ box.addEventListener( 'keydown', function (event) { if ( event.key !== 'Enter' && event.key !== ' ' ) { return; } var question = event.target.closest( '.mood-faq-question' ); if (!question) { return; } event.preventDefault(); question.click(); } ); /* ===================================================== START ===================================================== */ render(); })();