diff --git a/404.html b/404.html deleted file mode 100644 index 69e637c..0000000 --- a/404.html +++ /dev/null @@ -1,181 +0,0 @@ - - - - - - Page Not Found | Shop Archives - - - - - - - - - - -
-
-
-
-

Discord is a registered trademark of Discord Inc. Shop Archives is not affiliated with, endorsed or sponsored by Discord Inc.

-
- - -
- - - - - -
- -
-
- Fun -
-
- -
- - - - - -
-
-
- Quick Blog -
-
- -
- - - - - -
- -
-
-
-
-
- -
-
-
-
-
-
- -
-
-
-
-
-

Page Not Found

-
-
-
-

Page Not Found

-

404

-

The page you’re looking for doesn’t exist.

-
-
- - - - - - - - - diff --git a/assets/1.js b/assets/1.js deleted file mode 100644 index 6303d32..0000000 --- a/assets/1.js +++ /dev/null @@ -1,246 +0,0 @@ -if (localStorage.full_client_rework === "false") { - const mainsTab = document.querySelector("[data-mains-template]"); - const mainsTabsHolder = document.querySelector("[data-mains-tabs]"); - - fetch('https://raw.githubusercontent.com/Yappering/api/main/v1/main-tabs') - .then(response => response.json()) - .then(data => { - data.forEach(user => { - const card = mainsTab.content.cloneNode(true).children[0]; - const mainstitle = card.querySelector("[data-mains-title]"); - const mainsButton = card; // Corrected the selection of the button element - - mainstitle.textContent = user.title; - - mainsButton.classList.add(user.class); - - if (user.titleText) { - mainsButton.title = user.titleText; - } - - // Set the button's click event to redirect to the URL stored in the API - mainsButton.onclick = function() { - window.location.href = user.url; - }; - - // Check if 'isNew' is true, and show the "NEW" icon if it is - if (user.isNew === "true") { - card.querySelector(".dm-new-icon").style.display = 'block'; - } - - mainsTabsHolder.append(card); - - document.getElementById("loading-api-dm-mains").classList.add('hidden'); - }); - }) - .catch(error => { - console.error('Error fetching the API:', error); - document.getElementById("loading-api-dm-mains").classList.add('hidden'); - document.getElementById("mains-fetch-error").classList.remove('hidden'); - }); - - function reFetchMainTabs() { - document.getElementById("loading-api-dm-mains").classList.remove('hidden'); - document.getElementById("mains-fetch-error").classList.add('hidden'); - const mainsTab = document.querySelector("[data-mains-template]"); - const mainsTabsHolder = document.querySelector("[data-mains-tabs]"); - - fetch('https://raw.githubusercontent.com/Yappering/api/main/v1/main-tabs') - .then(response => response.json()) - .then(data => { - data.forEach(user => { - const card = mainsTab.content.cloneNode(true).children[0]; - const mainstitle = card.querySelector("[data-mains-title]"); - const mainsButton = card; // Corrected the selection of the button element - - mainstitle.textContent = user.title; - - mainsButton.classList.add(user.class); - - if (user.titleText) { - mainsButton.title = user.titleText; - } - - // Set the button's click event to redirect to the URL stored in the API - mainsButton.onclick = function() { - window.location.href = user.url; - }; - - // Check if 'isNew' is true, and show the "NEW" icon if it is - if (user.isNew === "true") { - card.querySelector(".dm-new-icon").style.display = 'block'; - } - - mainsTabsHolder.append(card); - - document.getElementById("loading-api-dm-mains").classList.add('hidden'); - }); - }) - .catch(error => { - console.error('Error fetching the API:', error); - document.getElementById("loading-api-dm-mains").classList.add('hidden'); - document.getElementById("mains-fetch-error").classList.remove('hidden'); - }); - } - - - const funTab = document.querySelector("[data-fun-template]"); - const funTabsHolder = document.querySelector("[data-fun-output]"); - - fetch('https://raw.githubusercontent.com/Yappering/api/main/v1/fun') - .then(response => response.json()) - .then(data => { - data.forEach(user => { - const card = funTab.content.cloneNode(true).children[0]; - const funtitle = card.querySelector("[data-fun-title]"); - const funButton = card; // Corrected the selection of the button element - - funtitle.textContent = user.title; - - funButton.classList.add(user.class); - - if (user.titleText) { - funButton.title = user.titleText; - } - - // Set the button's click event to redirect to the URL stored in the API - funButton.onclick = function() { - window.location.href = user.url; - }; - - // Check if 'isNew' is true, and show the "NEW" icon if it is - if (user.isNew === "true") { - card.querySelector(".dm-new-icon").style.display = 'block'; - } - - funTabsHolder.append(card); - - document.getElementById("loading-api-dm-fun").classList.add('hidden'); - }); - }) - .catch(error => { - console.error('Error fetching the API:', error); - document.getElementById("loading-api-dm-fun").classList.add('hidden'); - - }); - - - - - - - const NewsTab = document.querySelector("[data-news-template]"); - const NewsTabsHolder = document.querySelector("[data-news-tabs]"); - - fetch('https://raw.githubusercontent.com/Yappering/api/main/v1/news') - .then(response => response.json()) - .then(data => { - data.forEach(user => { - const card = NewsTab.content.cloneNode(true).children[0]; - const newstitle = card.querySelector("[data-news-title]"); - const newsButton = card; // Corrected the selection of the button element - - newstitle.textContent = user.title; - - if (user.titleText) { - newsButton.title = user.titleText; - } - - // Set the button's click event to redirect to the URL stored in the API - newsButton.onclick = function() { - window.location.href = user.url; - }; - - // Check if 'isNew' is true, and show the "NEW" icon if it is - if (user.isNew === "true") { - card.querySelector(".dm-new-icon").style.display = 'block'; - } - - NewsTabsHolder.append(card); - - document.getElementById("loading-api-dm-news").classList.add('hidden'); - }); - }) - .catch(error => { - console.error('Error fetching the API:', error); - document.getElementById("loading-api-dm-news").classList.add('hidden'); - document.getElementById("news-fetch-error").classList.remove('hidden'); - }); - - function reFetchNewsTabs() { - document.getElementById("loading-api-dm-news").classList.remove('hidden'); - document.getElementById("news-fetch-error").classList.add('hidden'); - const NewsTab = document.querySelector("[data-news-template]"); - const NewsTabsHolder = document.querySelector("[data-news-tabs]"); - - fetch('https://raw.githubusercontent.com/Yappering/api/main/v1/news') - .then(response => response.json()) - .then(data => { - data.forEach(user => { - const card = NewsTab.content.cloneNode(true).children[0]; - const newstitle = card.querySelector("[data-news-title]"); - const newsButton = card; // Corrected the selection of the button element - - newstitle.textContent = user.title; - - if (user.titleText) { - newsButton.title = user.titleText; - } - - // Set the button's click event to redirect to the URL stored in the API - newsButton.onclick = function() { - window.location.href = user.url; - }; - - // Check if 'isNew' is true, and show the "NEW" icon if it is - if (user.isNew === "true") { - card.querySelector(".dm-new-icon").style.display = 'block'; - } - - NewsTabsHolder.append(card); - - document.getElementById("loading-api-dm-news").classList.add('hidden'); - }); - }) - .catch(error => { - console.error('Error fetching the API:', error); - document.getElementById("loading-api-dm-news").classList.add('hidden'); - document.getElementById("news-fetch-error").classList.remove('hidden'); - }); - } - - - const servers = document.querySelector("[data-servers-template]"); - const serversList = document.querySelector("[data-servers]"); - - fetch('https://raw.githubusercontent.com/Yappering/api/main/v1/servers') - .then(response => response.json()) - .then(data => { - data.forEach(user => { - const card = servers.content.cloneNode(true).children[0]; - const serversButton = card; // Corrected the selection of the button element - - serversButton.classList.add(user.class); - - if (user.titleText) { - serversButton.title = user.titleText; - } - - const userImage = card.querySelector("[data-server-icon]"); - userImage.src = user.image; - userImage.alt = user.title; - - // Set the button's click event to redirect to the URL stored in the API - serversButton.onclick = function() { - window.location.href = user.url; - }; - - serversList.append(card); - }); - }) - .catch(error => { - console.error('Error fetching the API:', error); - }); -} else { - location.href='/'; -} \ No newline at end of file diff --git a/assets/10.js b/assets/10.js deleted file mode 100644 index f6f0650..0000000 --- a/assets/10.js +++ /dev/null @@ -1,656 +0,0 @@ -// tbh i forgot what this experiment was -EXPERIMENT_ID_1 = 1 - -// 2024-11_item_data_downloads -EXPERIMENT_ID_2 = -1 - -// 2024-11_top_selling_item_tag -EXPERIMENT_ID_3 = -1 - -// 2024-11_epic_profiles_plus_category_changes -EXPERIMENT_ID_4 = 1 - -// 2024-11_full_client_rework -EXPERIMENT_ID_5 = 1 - - -EXPERIMENT_ID_6 = 1 - -const experimentsList = [ - { - title: "Render Orbs Shop As Home", - id: "2025-05_orbs_shop_home", - name: "experiment_2025_05_orbs_shop_home", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Enabled" - ], - rollout: "Treatment -1: Disabled", - needs_api_token: "true" - }, - { - title: "XP Redeem Gift Codes", - id: "2025-05_redeem_gift_codes", - name: "experiment_2025_05_redeem_gift_codes", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Enabled" - ], - rollout: "Treatment -1: Disabled", - needs_api_token: "true" - }, - { - title: "XP System", - id: "2025-05_xp_system", - name: "experiment_2025_05_xp_system", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Enabled" - ], - rollout: "Treatment -1: Disabled", - needs_api_token: "true" - }, - { - title: "Reviews V2 User Profile", - id: "2025-05_reviews_v2_user_profile", - name: "experiment_2025_05_reviews_v2_user_profile", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Enabled" - ], - rollout: "Treatment -1: Disabled", - needs_api_token: "true" - }, - { - title: "Account Creator", - id: "2025-05_account_creator", - name: "experiment_2025_05_account_creator", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Enabled" - ], - rollout: "Treatment 1: Enabled", - needs_api_token: "true" - }, - { - title: "m", - id: "2025-05_m", - name: "experiment_2025_05_m", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Enabled" - ], - rollout: "Treatment -1: Disabled", - needs_api_token: "true" - }, - { - title: "Item Search", - id: "2025-04_item_search", - name: "experiment_2025_04_item_search", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Enabled" - ], - rollout: "Treatment -1: Disabled" - }, - { - title: "Purchasable Items", - id: "2025-04_purchasable_items", - name: "experiment_2025_04_purchasable_items", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Enabled" - ], - rollout: "Treatment 1: Enabled", - needs_api_token: "true" - }, - { - title: "See You Next Year", - id: "2025-04_see_you_next_year", - name: "experiment_2025_04_see_you_next_year", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Enabled" - ], - rollout: "Treatment -1: Disabled", - needs_api_token: "true" - }, - { - title: "Reviews V2 Warning System", - id: "2025-04_reviews_v2_warning_system", - name: "experiment_2025_04_reviews_v2_warning_system", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Enabled" - ], - rollout: "Treatment -1: Disabled", - needs_api_token: "true" - }, - { - title: "Extended Styles", - id: "2025-04_extended_styles", - name: "experiment_2025_04_extended_styles", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Enabled", - "Treatment 2: Card Styles" - ], - rollout: "Treatment 1: Enabled" - }, - { - title: "Reviews V2 Hide Beta Tag", - id: "2025-04_reviews_v2_hide_beta_tag", - name: "experiment_2025_04_reviews_v2_hide_beta_tag", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Enabled" - ], - rollout: "Treatment 1: Enabled" - }, - { - title: "Reviews V2 Custom Emojis Render", - id: "2025-04_reviews_v2_custom_emojis_render", - name: "experiment_2025_04_reviews_v2_custom_emojis_render", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Enabled" - ], - rollout: "Treatment -1: Disabled" - }, - { - title: "Reviews V2 Report", - id: "2025-04_reviews_v2_report", - name: "experiment_2025_04_reviews_v2_report", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Enabled" - ], - rollout: "Treatment 1: Enabled", - needs_api_token: "true" - }, - { - title: "Reviews V2", - id: "2025-04_reviews_v2", - name: "experiment_2025_04_reviews_v2", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Enabled" - ], - rollout: "Treatment 1: Enabled", - needs_api_token: "true" - }, - { - title: "Accessibility V2", - id: "2025-04_accessibility_v2", - name: "experiment_2025_04_accessibility_v2", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Enabled" - ], - rollout: "Treatment -1: Disabled" - }, - { - title: "Profile Tab V2", - id: "2025-04_profile_tab_v2", - name: "experiment_2025_04_profile_tab_v2", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Enabled" - ], - rollout: "Treatment 1: Enabled" - }, - { - title: "Theme Picker V2 Color", - id: "2025-04_theme_picker_v2_color", - name: "experiment_2025_04_theme_picker_v2_color", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Enabled" - ], - rollout: "Treatment -1: Disabled" - }, - { - title: "Theme Picker V2 Custom", - id: "2025-04_theme_picker_v2_custom", - name: "experiment_2025_04_theme_picker_v2_custom", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Enabled" - ], - rollout: "Treatment -1: Disabled" - }, - { - title: "Theme Picker V2 Community", - id: "2025-04_theme_picker_v2_community", - name: "experiment_2025_04_theme_picker_v2_community", - treatments: [ - "Treatment -1: Disabled", - "Treatment 2: As banners" - ], - rollout: "Treatment -1: Disabled", - needs_api_token: "true" - }, - { - title: "Use api.yapper.shop for api", - id: "2025-04_use_api_dot_yapper_dot_shop", - name: "experiment_2025_04_use_api_dot_yapper_dot_shop", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Enabled" - ], - rollout: "Treatment 1: Enabled", - needs_api_token: "true", - not_needed: "true" - }, - { - title: "Collectibles Marketing Page", - id: "2025-04_collectibles_marketing_page", - name: "experiment_2025_04_collectibles_marketing_page", - treatments: [ - "Treatment -1: Disabled", - "Treatment 2: Enable v2" - ], - rollout: "Treatment 2: Enable v2", - needs_api_token: "true" - }, - { - title: "Discord Sign In Dismissible", - id: "2025-04_discord_sign_in_dismissible", - name: "experiment_2025_04_discord_sign_in_dismissible", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: V1" - ], - rollout: "Treatment 1: V1" - }, - { - title: "Discord Sign In", - id: "2025-04_discord_sign_in", - name: "experiment_2025_04_discord_sign_in", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Dynamic", - "Treatment 2: Force Logged Out", - "Treatment 3: Force Logged In", - "Treatment 4: Dynamic v2", - "Treatment 6: Force Logged In v2" - ], - rollout: "Treatment 4: Dynamic v2", - needs_api_token: "true", - not_needed: "true" - }, - { - title: "Show items with no skus in misc tab", - id: "2025-03_items_with_no_sku", - name: "experiment_2025_03_items_with_no_sku", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Enabled" - ], - rollout: "Treatment -1: Disabled", - needs_api_token: "true", - not_needed: "true" - }, - { - title: "View Raw Modal", - id: "2025-03_view_raw_modal", - name: "experiment_2025_03_view_raw_modal", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Enabled" - ], - rollout: "Treatment 1: Enabled", - not_needed: "true" - }, - { - title: "Copy SKU Card", - id: "2025-03_copy_sku_card", - name: "experiment_2025_03_copy_sku_card", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Enabled", - "Treatment 2: w/ share button", - "Treatment 3: only share button" - ], - rollout: "Treatment 1: Enabled" - }, - { - title: "Quick Info Tab", - id: "2025-03_quick_info", - name: "experiment_2025_03_quick_info", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Enabled" - ], - rollout: "Treatment -1: Disabled", - needs_api_token: "true", - not_needed: "true" - }, - { - title: "Extra Options Dismissible Content", - id: "2025-03_extra_options_dismissible_content", - name: "experiment_2025_03_extra_options_dismissible_content", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: V1" - ], - rollout: "Treatment -1: Disabled", - not_needed: "true" - }, - { - title: "Early Nameplate Warning", - id: "2025-03_early_nameplate_warning", - name: "experiment_2025_03_early_nameplate_warning", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Nameplate Test Warning", - "Treatment 2: Nameplate & Nameplate Test Warning" - ], - rollout: "Treatment -1: Disabled" - }, - { - //21 - title: "Item Reviews", - id: "2025-03_item_reviews", - name: "experiment_2025_03_item_reviews", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Enabled", - "Treatment 2: Simulate not logged in", - "Treatment 3: Simulate logged in" - ], - rollout: "Treatment -1: Disabled", - needs_api_token: "true", - not_needed: "true" - }, - { - title: "Heartbeat", - id: "2025-03_heartbeat", - name: "experiment_2025_03_heartbeat", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Fetch once on startup", - "Treatment 2: Fetch every 60 seconds" - ], - rollout: "Treatment -1: Disabled", - needs_api_token: "true", - not_needed: "true" - }, - { - title: "Fetch From Vercel Endpoits", - id: "2025-02_fetch_from_vercel_endpoits", - name: "experiment_2025_02_fetch_from_vercel_endpoits", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Enabled" - ], - rollout: "Treatment 1: Enabled", - not_needed: "true" - }, - { - title: "Extra Options", - id: "2025-02_extra_options", - name: "experiment_2025_02_extra_options", - treatments: [ - "Treatment -1: Disabled", - "Treatment 4: Enabled", - "Treatment 6: Settings like discord" - ], - rollout: "Treatment 6: Settings like discord", - not_needed: "true" - }, - { - title: "Profiles Plus Home", - id: "2025-02_profiles_plus_home", - name: "experiment_2025_02_profiles_plus_home", - treatments: [ - "Treatment -1: Disabled", - "Treatment 2: Enabled", - "Treatment 3: Hide All Profiles Plus Tabs" - ], - rollout: "Treatment 3: Hide All Profiles Plus Tabs", - needs_api_token: "true" - }, - { - title: "Shop Category Modals", - id: "2025-02_shop_category_modals", - name: "experiment_2025_02_shop_category_modals", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Enable category modals", - "Treatment 2: Enable category modals w/ data downloads" - ], - rollout: "Treatment 1: Enable category modals", - not_needed: "true" - }, - { - title: "Shop Card Modals", - id: "2025-02_shop_card_modals", - name: "experiment_2025_02_shop_card_modals", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Enable modals", - "Treatment 2: Enable modals w/ data downloads", - "Treatment 3: Enable modals w/ p+", - "Treatment 4: Enable modals w/ p+ on p+ page", - "Treatment 5: Enable modals w/ data downloads and p+", - "Treatment 6: Enable modals w/ data downloads and p+ on p+ page" - ], - rollout: "Treatment 4: Enable modals w/ p+ on p+ page", - not_needed: "true" - }, - { - title: "Mobile Render", - id: "2025-02_mobile_render", - name: "experiment_2025_02_mobile_render", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Use new mobile check", - "Treatment 2: Use old mobile check" - ], - rollout: "Treatment 1: Use new mobile check" - }, - { - title: "Orbs Shop", - id: "2025-02_orbs_shop", - name: "experiment_2025_02_orbs_shop", - treatments: [ - "Treatment -1: Disabled", - "Treatment 2: Orb Shop done like default", - "Treatment 3: Default + New tag" - ], - rollout: "Treatment 2: Orb Shop done like default", - needs_api_token: "true", - not_needed: "true" - }, - { - title: "Orb Testing", - id: "2025-01_orb_testing", - name: "experiment_2025_01_orb_testing", - treatments: [ - "Treatment -1: Disabled", - "Treatment 4: Orb Converter" - ], - rollout: "Treatment -1: Disabled", - needs_api_token: "true" - }, - { - title: "Show Leaks On Home Page", - id: "2025-01_show_leaks_on_home_page", - name: "experiment_2025_01_show_leaks_on_home_page", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Enabled" - ], - rollout: "Treatment -1: Disabled", - not_needed: "true" - }, - { - title: "Theme Picker", - id: "2024-12_theme_picker", - name: "experiment_2024_12_theme_picker", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Enabled", - "Treatment 2: Enabled with custom css" - ], - rollout: "Treatment 1: Enabled", - not_needed: "true" - }, - { - title: "Profiles Plus Marketing Variants", - id: "2024-12_profiles_plus_marketing_variants", - name: "experiment_2024_12_profiles_plus_marketing_variants", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Paper Beach V2", - "Treatment 2: Roblox Doors" - ], - rollout: "Treatment -1: Disabled", - not_needed: "true" - }, - { - title: "Collectibles Variants", - id: "2024-11_collectibles_variants", - name: "experiment_2024_11_collectibles_variants", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Enabled" - ], - rollout: "Treatment 1: Enabled", - not_needed: "true" - }, - { - title: "2024 Recap", - id: "2024-11_recap", - name: "experiment_2024_11_recap", - treatments: [ - "Treatment -1: Disabled", - "Treatment 1: Enabled", - "Treatment 2: Nameplate Marketing" - ], - rollout: "Treatment -1: Disabled" - } -]; - -const dismissibleContentList = [ - { - title: "XP notice", - id: "dismissible_content_XPnotice", - name: "dismissible_XPnotice", - treatments: [ - "Treatment -1: Unseen", - "Treatment 1: Seen" - ] - }, - { - title: "Claim 100 XP for free", - id: "dismissible_content_new100FreeXP", - name: "dismissible_new100FreeXP", - treatments: [ - "Treatment -1: Unseen", - "Treatment 1: Seen" - ] - }, - { - title: "Discord Sign In", - id: "dismissible_content_newLogInWithDiscord", - name: "dismissible_newLogInWithDiscord", - treatments: [ - "Treatment -1: Unseen", - "Treatment 1: Seen" - ] - }, - { - title: "Open In Shop Notice", - id: "dismissible_content_open_in_shop_notice", - name: "dismissible_open_in_shop_notice", - treatments: [ - "Treatment -1: Unseen", - "Treatment 1: Seen" - ] - }, - { - title: "Orbs Shop New Tag", - id: "dismissible_content_orbs_shop_new_tag", - name: "dismissible_orbs_shop_new_tag", - treatments: [ - "Treatment -1: Unseen", - "Treatment 1: Seen" - ] - }, - { - title: "New Profile Settings", - id: "dismissible_content_newProfileSettings", - name: "dismissible_newProfileSettings", - treatments: [ - "Treatment -1: Unseen", - "Treatment 1: Seen" - ], - not_needed: "true" - }, - { - title: "Roblox Doors Marketing", - id: "dismissible_content_roblox_doors_marketing", - name: "dismissible_roblox_doors_marketing", - treatments: [ - "Treatment -1: Unseen", - "Treatment 1: Seen" - ], - not_needed: "true" - }, - { - title: "Paper Beach V2 Marketing", - id: "dismissible_content_paper_beach_v2_marketing", - name: "dismissible_paper_beach_v2_marketing", - treatments: [ - "Treatment -1: Unseen", - "Treatment 1: Seen" - ], - not_needed: "true" - }, - { - title: "Recap 2024", - id: "dismissible_content_recap_2024", - name: "dismissible_recap_2024", - treatments: [ - "Treatment -1: Unseen", - "Treatment 1: Seen" - ] - } -]; - -const testFetchAPIList = [ - { - title: "Test Fetch Collectibles Shop API", - id: "testfetch_collectibles-shop", - name: "testfetch_testfetchnew", - treatments: [ - "none", - "home", - "shop", - "orbs", - "leaks", - "nameplates", - "consumables", - "miscellaneous", - "marketing", - "pplus-home", - "pplus" - ], - rollout: "none", - needs_api_token: "true" - }, - { - title: "Test Fetch Profile Effects API", - id: "testfetch_profile-effects", - name: "testfetch_testfetcheffects", - treatments: [ - "none", - "discord", - "pplus" - ], - rollout: "none", - needs_api_token: "true" - } -]; \ No newline at end of file diff --git a/assets/11.js b/assets/11.js deleted file mode 100644 index ba50b3b..0000000 --- a/assets/11.js +++ /dev/null @@ -1,204 +0,0 @@ - -let apiUrl = 'https://raw.githubusercontent.com/Yappering/api/main/v1/leaks'; - -fetch(apiUrl) - .then(response => response.json()) - .then(data => { - data.forEach(user => { - const template = document.querySelector("[data-shop-category-template]"); - const output = document.querySelector("[data-shop-output]"); - - const category = template.content.cloneNode(true).children[0]; - - const bannerImage = category.querySelector("[data-shop-category-banner-image]"); - bannerImage.src = user.banner; - bannerImage.alt = user.name; - - const logoImage = category.querySelector("[data-shop-category-logo-image]"); - logoImage.src = user.logo; - logoImage.alt = user.name; - - const summary = category.querySelector("[data-shop-category-desc]"); - summary.textContent = user.summary; - - if (user.summary_black === "true") { - category.querySelector(".shop-category-text-holder").style.color = 'black'; - } - - // Handling the logo sway effect - if (user.logo_sway === "true") { - category.querySelector("[data-shop-category-logo-image]").classList.add('shop-logo-sway'); - } - - // Handle expiry timer - const expiryTimer = category.querySelector(".shop-expiry-timer"); - const timerElement = category.querySelector("#shop-expiry-timer"); - const unpublishedAt = new Date(user.unpublished_at); - - if (user.unpublished_at && !isNaN(unpublishedAt.getTime())) { - expiryTimer.style.display = 'block'; - - function updateTimer() { - const now = new Date(); - const timeDiff = unpublishedAt - now; - - if (timeDiff <= 0) { - timerElement.textContent = "UNOBTAINABLE"; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / (1000 * 60)); - const seconds = Math.floor((timeDiff % (1000 * 60)) / 1000); - - timerElement.textContent = `${days} DAYS LEFT IN SHOP`; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); // Initial call to display the timer immediately - } else { - expiryTimer.style.display = 'none'; - } - - const cardHolder = category.querySelector(".shop-category-card-holder"); - - // Function to create a card - function createCard(item, sku, price, priceNitro, emojiCopy, isBundle = false, isNew = false) { - const card = document.createElement('div'); - card.classList.add('shop-category-card'); - - // Determine card class based on item type - if (item.item_type === 'deco') { - card.classList.add('deco-card'); - } else if (item.item_type === 'effect') { - card.classList.add('effect-card'); - } else if (isBundle) { - card.classList.add('bundle-card'); - } - - // Card content based on item type - if (isBundle && item.bundled_products) { - const bundleDescription = `Bundle Includes: ${item.bundled_products.filter(product => product.item_type === 'deco').map(deco => deco.name).join(', ')} Decoration & ${item.bundled_products.filter(product => product.item_type === 'effect').map(effect => effect.name).join(', ')} Profile Effect`; - - card.innerHTML = ` -
- ${item.bundled_products.map(bundledItem => ` -
- ${bundledItem.name} -
- `).join('')} -
-
- SKU ID: ${sku} -

${item.name}

-

${bundleDescription}

-
- ${price} - ${priceNitro} -
-
-
- -
-
NEW
- `; - - } else { - card.innerHTML = ` - ${item.name} -
- SKU ID: ${sku} -

${item.name}

-

${item.summary}

-
- ${price} - ${priceNitro} -
-
-
- -
-
NEW
- `; - } - - // Add hover effect for the entire card to animate images - card.addEventListener('mouseenter', function () { - const imgs = card.querySelectorAll('img'); - imgs.forEach(img => { - if (img.hasAttribute('data-animated')) { - img.dataset.originalSrc = img.src; // Save original src - img.src = img.getAttribute('data-animated'); // Switch to animated src - } - }); - }); - - card.addEventListener('mouseleave', function () { - const imgs = card.querySelectorAll('img'); - imgs.forEach(img => { - if (img.hasAttribute('data-animated') && img.dataset.originalSrc) { - img.src = img.dataset.originalSrc; // Restore original src - } - }); - }); - - return card; - } - - // Sort and display the products: Bundle, Decoration, Effect - const bundleProducts = []; - const decorationProducts = []; - const effectProducts = []; - - user.products.forEach(product => { - const isNew = product.isNew === "true"; - const sku = product.sku_id || ""; // Get credits from the product - const price = product.price || ""; - const priceNitro = product.price_nitro || ""; - const emojiCopy = product.emojiCopy || ""; // Get emojiCopy from the product - - // Check if the product is a bundle - if (product.bundled_products) { - // Add bundle card with bundled items - bundleProducts.push({ product, sku, price, priceNitro, emojiCopy, isNew }); - } else { - // Handle individual items - product.items.forEach(item => { - if (item.item_type === 'deco') { - decorationProducts.push({ item, sku, price, priceNitro, emojiCopy, isNew }); - } else if (item.item_type === 'effect') { - effectProducts.push({ item, sku, price, priceNitro, emojiCopy, isNew }); - } - }); - } - }); - - // Append Bundle, Decoration, and Effect cards in that order - bundleProducts.forEach(({ product, sku, price, priceNitro, emojiCopy, isNew }) => cardHolder.appendChild(createCard(product, sku, price, priceNitro, emojiCopy, true, isNew))); - decorationProducts.forEach(({ item, sku, price, priceNitro, emojiCopy, isNew }) => cardHolder.appendChild(createCard(item, sku, price, priceNitro, emojiCopy, false, isNew))); - effectProducts.forEach(({ item, sku, price, priceNitro, emojiCopy, isNew }) => cardHolder.appendChild(createCard(item, sku, price, priceNitro, emojiCopy, false, isNew))); - - document.getElementById("shop-category-loading").classList.add('hidden'); - output.append(category); - }); - }) - .catch(error => { - console.error('Error fetching the API:', error); - document.getElementById("failed-to-load-shop").classList.remove('hidden'); - document.getElementById("shop-category-loading").classList.add('hidden'); - }); - -// Function to copy emoji to clipboard -function copyEmoji(emoji) { - navigator.clipboard.writeText(emoji).then(() => { - console.log('emoji yes'); - }).catch(err => { - console.error("Failed to copy emoji: ", err); - }); -} - -// Function to redirect to Google -function redirectToGoogle() { - window.location.href = 'https://discord.gg/Mcwh7hGcWb'; -} \ No newline at end of file diff --git a/assets/12.js b/assets/12.js deleted file mode 100644 index 9bf0466..0000000 --- a/assets/12.js +++ /dev/null @@ -1,375 +0,0 @@ - -if (localStorage.full_client_rework != "true") { - - let apiUrl = 'https://raw.githubusercontent.com/Yappering/api/main/v1/home-page-preview'; - - fetch(apiUrl) - .then(response => response.json()) - .then(data => { - data.forEach(user => { - const template = document.querySelector("[data-shop-category-template]"); - const output = document.querySelector("[data-shop-output]"); - - const category = template.content.cloneNode(true).children[0]; - - const bannerImage = category.querySelector("[data-shop-category-banner-image]"); - bannerImage.src = user.hero_banner; - bannerImage.alt = user.name; - - const logoImage = category.querySelector("[data-shop-category-logo-image]"); - logoImage.src = user.logo; - logoImage.alt = user.name; - - const summary = category.querySelector("[data-shop-category-desc]"); - summary.textContent = user.summary; - - if (user.summary_black === "true") { - category.querySelector(".shop-category-text-holder").style.color = 'black'; - } - - // Handling the logo sway effect - if (user.logo_sway === "true") { - category.querySelector("[data-shop-category-logo-image]").classList.add('shop-logo-sway'); - } - - const previewCategoryButton = category.querySelector("[data-preview-new-categoey-button]"); - - const newCategoryName = user.name; - - previewCategoryButton.innerHTML = ` - - `; - - // Handle expiry timer - const expiryTimer = category.querySelector(".shop-expiry-timer"); - const timerElement = category.querySelector("#shop-expiry-timer"); - const unpublishedAt = new Date(user.unpublished_at); - - if (user.unpublished_at && !isNaN(unpublishedAt.getTime())) { - expiryTimer.style.display = 'block'; - - function updateTimer() { - const now = new Date(); - const timeDiff = unpublishedAt - now; - - if (timeDiff <= 0) { - timerElement.textContent = "UNOBTAINABLE"; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - timerElement.textContent = `${days} DAYS LEFT IN SHOP`; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); // Initial call to display the timer immediately - } else { - expiryTimer.style.display = 'none'; - } - - const cardHolder = category.querySelector(".shop-category-card-holder"); - - // Function to create a card - function createCard(item, sku, price, priceNitro, isBundle = false, isNew = false) { - const card = document.createElement('div'); - card.classList.add('shop-category-card'); - - // Determine card class based on item type - if (item.item_type === 'deco') { - card.classList.add('deco-card'); - } else if (item.item_type === 'effect') { - card.classList.add('effect-card'); - } else if (isBundle) { - card.classList.add('bundle-card'); - } - - // Card content based on item type - if (isBundle && item.bundled_products) { - const bundleDescription = `Bundle Includes: ${item.bundled_products.filter(product => product.item_type === 'deco').map(deco => deco.name).join(', ')} Decoration & ${item.bundled_products.filter(product => product.item_type === 'effect').map(effect => effect.name).join(', ')} Profile Effect`; - - card.innerHTML = ` -
- ${item.bundled_products.map(bundledItem => ` -
- ${bundledItem.name} -
- `).join('')} -
-
- SKU ID: ${sku} -

${item.name}

-

${bundleDescription}

-
- ${price} - ${priceNitro} with Nitro -
-
-
- -
-
NEW
- `; - - } else { - card.innerHTML = ` - ${item.name} -
- SKU ID: ${sku} -

${item.name}

-

${item.summary}

-
- ${price} - ${priceNitro} with Nitro -
-
-
- -
-
NEW
- `; - } - - // Add hover effect for the entire card to animate images - card.addEventListener('mouseenter', function () { - const imgs = card.querySelectorAll('img'); - imgs.forEach(img => { - if (img.hasAttribute('data-animated')) { - img.dataset.originalSrc = img.src; // Save original src - img.src = img.getAttribute('data-animated'); // Switch to animated src - } - }); - }); - - card.addEventListener('mouseleave', function () { - const imgs = card.querySelectorAll('img'); - imgs.forEach(img => { - if (img.hasAttribute('data-animated') && img.dataset.originalSrc) { - img.src = img.dataset.originalSrc; // Restore original src - } - }); - }); - - return card; - } - - // Display the products in the order they appear in the API - user.products.forEach(product => { - const isNew = product.isNew === "true"; - const sku = product.sku_id || ""; // Get SKU from the product - const price = product.price || ""; - const priceNitro = product.price_nitro || ""; - - // Check if the product is a bundle - if (product.bundled_products) { - cardHolder.appendChild(createCard(product, sku, price, priceNitro, true, isNew)); - } else { - // Handle individual items - product.items.forEach(item => { - cardHolder.appendChild(createCard(item, sku, price, priceNitro, false, isNew)); - }); - } - }); - - output.append(category); - }); - }) - .catch(error => { - console.error('Error fetching the API:', error); - }); - - - let apiUrlplus = 'https://raw.githubusercontent.com/Yappering/api/main/v1/home-page-p-plus'; - - fetch(apiUrlplus) - .then(response => response.json()) - .then(data => { - data.forEach(user => { - const template = document.querySelector("[data-shop-category-template-plus]"); - const output = document.querySelector("[data-shop-output-plus]"); - - const category = template.content.cloneNode(true).children[0]; - - const oneImage = category.querySelector("[data-shop-preview-image-plus]"); - oneImage.src = user.src; - oneImage.alt = user.name; - - output.append(category); - }); - - }) - .catch(error => { - console.error('Error fetching the API:', error); - }); - - - - let apiUrlp = 'https://raw.githubusercontent.com/Yappering/api/main/v1/popular-picks'; - - fetch(apiUrlp) - .then(response => response.json()) - .then(data => { - data.forEach(user => { - const template = document.querySelector("[data-shop-category-template-p]"); - const output = document.querySelector("[data-shop-output-p]"); - - const category = template.content.cloneNode(true).children[0]; - - const bannerImage = category.querySelector("[data-shop-category-banner-image-p]"); - bannerImage.src = user.banner; - bannerImage.alt = user.name; - - const logoImage = category.querySelector("[data-shop-category-logo-image-p]"); - logoImage.src = user.logo; - logoImage.alt = user.name; - - const summary = category.querySelector("[data-shop-category-desc-p]"); - summary.textContent = user.summary; - - if (user.summary_black === "true") { - category.querySelector(".shop-category-text-holder").style.color = 'black'; - } - - // Handling the logo sway effect - if (user.logo_sway === "true") { - category.querySelector("[data-shop-category-logo-image-p]").classList.add('shop-logo-sway'); - } - - // Handle expiry timer - const expiryTimer = category.querySelector(".shop-expiry-timer"); - const timerElement = category.querySelector("#shop-expiry-timer"); - const unpublishedAt = new Date(user.unpublished_at); - - if (user.unpublished_at && !isNaN(unpublishedAt.getTime())) { - expiryTimer.style.display = 'block'; - - function updateTimer() { - const now = new Date(); - const timeDiff = unpublishedAt - now; - - if (timeDiff <= 0) { - timerElement.textContent = "UNOBTAINABLE"; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - timerElement.textContent = `${days} DAYS LEFT IN SHOP`; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); // Initial call to display the timer immediately - } else { - expiryTimer.style.display = 'none'; - } - - const cardHolder = category.querySelector(".shop-category-card-holder"); - - // Function to create a card - function createCard(item, sku, price, priceNitro, isBundle = false, isNew = false) { - const card = document.createElement('div'); - card.classList.add('shop-category-card'); - - // Determine card class based on item type - if (item.item_type === 'deco') { - card.classList.add('deco-card'); - } else if (item.item_type === 'effect') { - card.classList.add('effect-card'); - } else if (isBundle) { - card.classList.add('bundle-card'); - } - - // Card content based on item type - if (isBundle && item.bundled_products) { - const bundleDescription = `Bundle Includes: ${item.bundled_products.filter(product => product.item_type === 'deco').map(deco => deco.name).join(', ')} Decoration & ${item.bundled_products.filter(product => product.item_type === 'effect').map(effect => effect.name).join(', ')} Profile Effect`; - - card.innerHTML = ` -
- ${item.bundled_products.map(bundledItem => ` -
- ${bundledItem.name} -
- `).join('')} -
-
- SKU ID: ${sku} -

${item.name}

-

${bundleDescription}

-
- ${price} - ${priceNitro} with Nitro -
-
-
- -
-
NEW
- `; - - } else { - card.innerHTML = ` - ${item.name} -
- SKU ID: ${sku} -

${item.name}

-

${item.summary}

-
- ${price} - ${priceNitro} with Nitro -
-
-
- -
-
NEW
- `; - } - - // Add hover effect for the entire card to animate images - card.addEventListener('mouseenter', function () { - const imgs = card.querySelectorAll('img'); - imgs.forEach(img => { - if (img.hasAttribute('data-animated')) { - img.dataset.originalSrc = img.src; // Save original src - img.src = img.getAttribute('data-animated'); // Switch to animated src - } - }); - }); - - card.addEventListener('mouseleave', function () { - const imgs = card.querySelectorAll('img'); - imgs.forEach(img => { - if (img.hasAttribute('data-animated') && img.dataset.originalSrc) { - img.src = img.dataset.originalSrc; // Restore original src - } - }); - }); - - return card; - } - - // Display the products in the order they appear in the API - user.products.forEach(product => { - const isNew = product.isNew === "true"; - const sku = product.sku_id || ""; // Get SKU from the product - const price = product.price || ""; - const priceNitro = product.price_nitro || ""; - - // Check if the product is a bundle - if (product.bundled_products) { - cardHolder.appendChild(createCard(product, sku, price, priceNitro, true, isNew)); - } else { - // Handle individual items - product.items.forEach(item => { - cardHolder.appendChild(createCard(item, sku, price, priceNitro, false, isNew)); - }); - } - }); - - output.append(category); - }); - }) - .catch(error => { - console.error('Error fetching the API:', error); - }); - - -} diff --git a/assets/13.svg b/assets/13.svg deleted file mode 100644 index b5093a0..0000000 --- a/assets/13.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/assets/14.js b/assets/14.js deleted file mode 100644 index 937aed7..0000000 --- a/assets/14.js +++ /dev/null @@ -1,401 +0,0 @@ - -const customDecorationInput = document.getElementById('customDecorationInput'); -const customDecorationUrlInput = document.getElementById('customDecorationUrlInput'); -const loadCustomDecorationUrlButton = document.getElementById('loadCustomDecorationUrl'); -const customDecorationPreview = document.getElementById('customDecorationPreview'); -const decoDataUrlOutput = document.getElementById('deco-dataUrlOutput'); - -// Function to handle file upload -customDecorationInput.addEventListener('change', function(event) { - const file = event.target.files[0]; - if (file) { - const reader = new FileReader(); - - reader.onload = function(e) { - const dataUrl = e.target.result; - - // Display custom decoration preview - customDecorationPreview.src = dataUrl; - customDecorationPreview.style.display = 'block'; - - // Display Data URL - decoDataUrlOutput.textContent = dataUrl; - }; - - reader.readAsDataURL(file); - } -}); - -// Function to handle custom decoration URL input -loadCustomDecorationUrlButton.addEventListener('click', function() { - const customDecorationUrl = customDecorationUrlInput.value; - - if (customDecorationUrl) { - const img = new Image(); - img.crossOrigin = 'Anonymous'; // This is needed to avoid CORS issues - - img.onload = function() { - const canvas = document.createElement('canvas'); - canvas.width = img.width; - canvas.height = img.height; - const ctx = canvas.getContext('2d'); - - ctx.drawImage(img, 0, 0); - - // Convert custom decoration to Data URL - const dataUrl = canvas.toDataURL('image/png'); - - // Display custom decoration preview - customDecorationPreview.src = dataUrl; - customDecorationPreview.style.display = 'block'; - - // Display Data URL - decoDataUrlOutput.textContent = dataUrl; - }; - - img.src = customDecorationUrl; - } -}); - - - - - - -const inputs = { - name: document.getElementById('deco-name-intput-box'), - description: document.getElementById('deco-desc-intput-box'), - id: document.getElementById('deco-skuid-input-box'), - animatedLink: document.getElementById('deco-animated-link-input-box'), - staticLink: document.getElementById('deco-static-link-input-box'), - price: document.getElementById('deco-price-input-box'), - price2: document.getElementById('deco-price2-input-box') -}; - -// Define output elements -const outputs = { - name: document.getElementById('deco-name-output-text'), - description: document.getElementById('deco-desc-output-text'), - id: document.getElementById('deco-skuid-output-text'), - animatedLink: document.getElementById('deco-animated-link-output-text'), - staticLink: document.getElementById('deco-static-link-output-text'), - price: document.getElementById('deco-price-output-text'), - price2: document.getElementById('deco-price2-output-text') -}; - -const decoImagePreview = document.getElementById('customDecorationPreview'); -const decoPreviewCard = document.getElementById('deco-preview-card'); -let DecoStaticLink = ''; -let DecoAnimatedLink = ''; - -// Add event listeners to update text live -for (const key in inputs) { - inputs[key].addEventListener('input', function() { - outputs[key].textContent = `${inputs[key].value}`; - - if (key === 'staticLink') { - DecoStaticLink = inputs.staticLink.value; - decoImagePreview.src = DecoStaticLink; - } else if (key === 'animatedLink') { - DecoAnimatedLink = inputs.animatedLink.value; - } - }); -} - -decoPreviewCard.addEventListener('mouseenter', function() { - if (DecoAnimatedLink) { - decoImagePreview.src = DecoAnimatedLink; - } -}); - -// Reset image source to static link on mouse leave -decoPreviewCard.addEventListener('mouseleave', function() { - if (DecoStaticLink) { - decoImagePreview.src = DecoStaticLink; - } -}); - -// Load JSON from textarea into inputs -document.getElementById('deco-load-json-button').addEventListener('click', function() { - try { - const jsonData = JSON.parse(document.getElementById('deco-json-input').value); - - // Populate the input fields with the JSON data - inputs.name.value = jsonData.name || ""; - inputs.description.value = jsonData.summary || ""; - inputs.id.value = jsonData.sku_id || ""; - inputs.price.value = jsonData.price || ""; - inputs.price2.value = jsonData.price_nitro || ""; - inputs.staticLink.value = jsonData.items[0].static || ""; - inputs.animatedLink.value = jsonData.items[0].animated || ""; - - // Trigger input events to update the live preview - for (const key in inputs) { - inputs[key].dispatchEvent(new Event('input')); - } - } catch (e) { - alert("Invalid JSON! Please check the format."); - } -}); - -// Copy button functionality -document.getElementById('custom-deco-copy-button').addEventListener('click', function() { - // Create JSON string for API use - const jsonData = { - name: inputs.name.value, - summary: inputs.description.value, - sku_id: inputs.id.value, - price: inputs.price.value, - price_nitro: inputs.price2.value, - unpublished_at: null, - isNew: "false", - emojiCopy: null, - items: [ - { - item_type: "deco", - name: inputs.name.value, - static: inputs.staticLink.value, - animated: inputs.animatedLink.value, - summary: inputs.description.value - } - ] - }; - - // Stringify JSON data with indentation for better formatting - const jsonString = JSON.stringify(jsonData, null, 4); - - // Create a temporary textarea to hold the text - const tempTextarea = document.createElement('textarea'); - tempTextarea.value = jsonString; - document.body.appendChild(tempTextarea); - tempTextarea.select(); - document.execCommand('copy'); - document.body.removeChild(tempTextarea); -}); - - - - - -const customEffectInput = document.getElementById('customEffectInput'); -const customEffectUrlInput = document.getElementById('customEffectUrlInput'); -const loadCustomEffectUrlButton = document.getElementById('loadCustomEffectUrl'); -const customEffectPreview = document.getElementById('customEffectPreview'); -const effectDataUrlOutput = document.getElementById('effect-dataUrlOutput'); - -// Function to handle file upload -customEffectInput.addEventListener('change', function(event) { - const file = event.target.files[0]; - if (file) { - const reader = new FileReader(); - - reader.onload = function(e) { - const dataUrl = e.target.result; - - // Display custom Effect preview - customEffectPreview.src = dataUrl; - customEffectPreview.style.display = 'block'; - - // Display Data URL - effectDataUrlOutput.textContent = dataUrl; - }; - - reader.readAsDataURL(file); - } -}); - -// Function to handle custom Effect URL input -loadCustomEffectUrlButton.addEventListener('click', function() { - const customEffectUrl = customEffectUrlInput.value; - - if (customEffectUrl) { - const img = new Image(); - img.crossOrigin = 'Anonymous'; // This is needed to avoid CORS issues - - img.onload = function() { - const canvas = document.createElement('canvas'); - canvas.width = img.width; - canvas.height = img.height; - const ctx = canvas.getContext('2d'); - - ctx.drawImage(img, 0, 0); - - // Convert custom Effect to Data URL - const dataUrl = canvas.toDataURL('image/png'); - - // Display custom Effect preview - customEffectPreview.src = dataUrl; - customEffectPreview.style.display = 'block'; - - // Display Data URL - effectDataUrlOutput.textContent = dataUrl; - }; - - img.src = customEffectUrl; - } -}); - - - - - - -const effectinputs = { - name: document.getElementById('effect-name-intput-box'), - description: document.getElementById('effect-desc-intput-box'), - id: document.getElementById('effect-skuid-input-box'), - animatedLink: document.getElementById('effect-animated-link-input-box'), - staticLink: document.getElementById('effect-static-link-input-box'), - price: document.getElementById('effect-price-input-box'), - price2: document.getElementById('effect-price2-input-box') -}; - -// Define output elements -const effectoutputs = { - name: document.getElementById('effect-name-output-text'), - description: document.getElementById('effect-desc-output-text'), - id: document.getElementById('effect-skuid-output-text'), - animatedLink: document.getElementById('effect-animated-link-output-text'), - staticLink: document.getElementById('effect-static-link-output-text'), - price: document.getElementById('effect-price-output-text'), - price2: document.getElementById('effect-price2-output-text') -}; - -const effectImagePreview = document.getElementById('customEffectPreview'); -const effectPreviewCard = document.getElementById('effect-preview-card'); -let effectStaticLink = ''; -let effectAnimatedLink = ''; - -// Add event listeners to update text live -for (const key in effectinputs) { - effectinputs[key].addEventListener('input', function() { - effectoutputs[key].textContent = `${effectinputs[key].value}`; - - if (key === 'staticLink') { - effectStaticLink = effectinputs.staticLink.value; - effectImagePreview.src = effectStaticLink; - } else if (key === 'animatedLink') { - effectAnimatedLink = effectinputs.animatedLink.value; - } - }); -} - -effectPreviewCard.addEventListener('mouseenter', function() { - if (effectAnimatedLink) { - effectImagePreview.src = effectAnimatedLink; - } -}); - -// Reset image source to static link on mouse leave -effectPreviewCard.addEventListener('mouseleave', function() { - if (effectStaticLink) { - effectImagePreview.src = effectStaticLink; - } -}); - -// Load JSON from textarea into inputs -document.getElementById('effect-load-json-button').addEventListener('click', function() { - try { - const jsonData = JSON.parse(document.getElementById('effect-json-input').value); - - // Populate the input fields with the JSON data - effectinputs.name.value = jsonData.name || ""; - effectinputs.description.value = jsonData.summary || ""; - effectinputs.id.value = jsonData.sku_id || ""; - effectinputs.price.value = jsonData.price || ""; - effectinputs.price2.value = jsonData.price_nitro || ""; - effectinputs.staticLink.value = jsonData.items[0].static || ""; - effectinputs.animatedLink.value = jsonData.items[0].animated || ""; - - // Trigger input events to update the live preview - for (const key in effectinputs) { - effectinputs[key].dispatchEvent(new Event('input')); - } - } catch (e) { - alert("Invalid JSON! Please check the format."); - } -}); - -// Copy button functionality -document.getElementById('custom-effect-copy-button').addEventListener('click', function() { - // Create JSON string for API use - const jsonData = { - name: effectinputs.name.value, - summary: effectinputs.description.value, - sku_id: effectinputs.id.value, - price: effectinputs.price.value, - price_nitro: effectinputs.price2.value, - unpublished_at: null, - isNew: "false", - emojiCopy: null, - items: [ - { - item_type: "effect", - name: effectinputs.name.value, - static: effectinputs.staticLink.value, - animated: effectinputs.animatedLink.value, - summary: effectinputs.description.value - } - ] - }; - - // Stringify JSON data with indentation for better formatting - const jsonString = JSON.stringify(jsonData, null, 4); - - // Create a temporary textarea to hold the text - const tempTextarea = document.createElement('textarea'); - tempTextarea.value = jsonString; - document.body.appendChild(tempTextarea); - tempTextarea.select(); - document.execCommand('copy'); - document.body.removeChild(tempTextarea); -}); - - - - - - - - - -document.getElementById('convert-button').addEventListener('click', function() { - try { - // Parse the input JSON - const inputJson = JSON.parse(document.getElementById('api-input').value); - - // Extract values from the input JSON - const name = inputJson.name; - const summary = inputJson.summary; - const sku_id = inputJson.sku_id; - const asset = inputJson.items[0]?.asset || ""; - const staticLink = `https://cdn.discordapp.com/avatar-decoration-presets/${asset}.png?size=4096&passthrough=false`; - const animatedLink = `https://cdn.discordapp.com/avatar-decoration-presets/${asset}.png?size=4096&passthrough=true`; - - // Create the converted JSON object - const convertedJson = { - name: name, - summary: summary, - sku_id: sku_id, - price: null, - price_nitro: null, - unpublished_at: null, - isNew: "true", - emojiCopy: null, - items: [ - { - item_type: "deco", - name: name, - static: staticLink, - animated: animatedLink, - summary: summary - } - ] - }; - - // Display the converted JSON - document.getElementById('converted-api').value = JSON.stringify(convertedJson, null, 4); - } catch (e) { - alert("Invalid JSON! Please check the format."); - } -}); \ No newline at end of file diff --git a/assets/15.css b/assets/15.css deleted file mode 100644 index b685448..0000000 --- a/assets/15.css +++ /dev/null @@ -1,8 +0,0 @@ -.pplus-tab { - background-image: - url(https://cdn.yapper.shop/assets/38.png), - linear-gradient(90deg, rgba(43, 45, 49, 0.00) 28.13%, rgba(255, 107, 0, 0.55) 67.3%, #FFFD00 100%); - background-repeat: no-repeat; - background-size: cover; - background-position: right; -} \ No newline at end of file diff --git a/assets/16.js b/assets/16.js deleted file mode 100644 index 0922795..0000000 --- a/assets/16.js +++ /dev/null @@ -1,59 +0,0 @@ -let apiUrl = 'https://raw.githubusercontent.com/Yappering/api/refs/heads/main/v1/consumables'; - -// Function to clear the shop data -function clearShopData() { - const output = document.querySelector("[data-shop-output]"); - output.innerHTML = ''; // Clears the content of the shop category - document.getElementById("shop-category-loading").classList.remove('hidden'); -} - -// Function to fetch and display shop data -function fetchData() { - - // Clear the previous data - clearShopData(); - - // Fetch new data - fetch(apiUrl) - .then(response => response.json()) - .then(data => { - data.forEach(user => { - const template = document.querySelector("[data-potion-card-template]"); - const output = document.querySelector("[data-shop-output]"); - - const category = template.content.cloneNode(true).children[0]; - - const banner = category.querySelector("[data-potion-card-holder]"); - banner.id = user.sku_id; - - const logoImage = category.querySelector("[data-potion-card-preview-image]"); - logoImage.src = user.preview; - logoImage.alt = user.name; - - const summary = category.querySelector("[data-potion-card-desc]"); - summary.textContent = user.summary; - - const title = category.querySelector("[data-potion-card-title]"); - title.textContent = user.name; - - const price = category.querySelector("[data-potion-card-price]"); - price.textContent = user.price; - - const sku = category.querySelector("[data-potion-card-sku]"); - sku.textContent = 'SKU ID: ' + user.sku_id; - - // Append the category to the output section - document.getElementById("shop-category-loading").classList.add('hidden'); - output.append(category); - }); - - }) - .catch(error => { - console.error('Error fetching the API:', error); - document.getElementById("failed-to-load-shop").classList.remove('hidden'); - document.getElementById("shop-category-loading").classList.add('hidden'); - }); -} - -// Initial data fetch when the page loads -window.onload = fetchData; \ No newline at end of file diff --git a/assets/17.js b/assets/17.js deleted file mode 100644 index c364312..0000000 --- a/assets/17.js +++ /dev/null @@ -1,66 +0,0 @@ -const formatPrice = (amount) => { - const amountStr = amount.toString(); - return amountStr.slice(0, -2) + '.' + amountStr.slice(-2); -}; - -let apiUrl = 'https://canary.discord.com/api/v9/store/published-listings/skus?application_id=1096190356233670716'; - -// Function to clear the shop data -function clearShopData() { - const output = document.querySelector("[data-shop-output]"); - output.innerHTML = ''; // Clears the content of the shop category - document.getElementById("shop-category-loading").classList.remove('hidden'); -} - -// Function to fetch and display shop data -function fetchData() { - - // Clear the previous data - clearShopData(); - - // Fetch new data - fetch(apiUrl) - .then(response => response.json()) - .then(data => { - // Sort data by id in descending order (smallest id at the bottom) - const sortedData = data.sort((b, a) => a.sku.id - b.sku.id); - - sortedData.forEach(user => { - const template = document.querySelector("[data-potion-card-template]"); - const output = document.querySelector("[data-shop-output]"); - - const category = template.content.cloneNode(true).children[0]; - - const banner = category.querySelector("[data-potion-card-holder]"); - banner.id = user.sku_id; - - const summary = category.querySelector("[data-potion-card-desc]"); - summary.textContent = user.summary; - - const title = category.querySelector("[data-potion-card-title]"); - title.textContent = user.sku.name; - - const price = category.querySelector("[data-potion-card-price]"); - // Display "US$" only if a valid price amount is present - price.textContent = user?.sku?.price?.amount - ? 'US$' + formatPrice(user.sku.price.amount) - : 'UNAVAILABLE'; - - const sku = category.querySelector("[data-potion-card-sku]"); - sku.textContent = 'SKU ID: ' + user.sku.id; - - // Append the category to the output section - document.getElementById("shop-category-loading").classList.add('hidden'); - output.append(category); - }); - - }) - .catch(error => { - console.error('Error fetching the API:', error); - document.getElementById("failed-to-load-shop").classList.remove('hidden'); - document.getElementById("shop-category-loading").classList.add('hidden'); - }); -} - -// Initial data fetch when the page loads -window.onload = fetchData; diff --git a/assets/18.js b/assets/18.js deleted file mode 100644 index f539014..0000000 --- a/assets/18.js +++ /dev/null @@ -1,76 +0,0 @@ -let apiUrl = 'https://raw.githubusercontent.com/Yappering/api/main/v1/collectible-assets'; - -// Function to clear the shop data -function clearShopData() { - const output = document.querySelector("[data-shop-output]"); - output.innerHTML = ''; // Clears the content of the shop category - document.getElementById("shop-category-loading").classList.remove('hidden'); -} - -// Function to fetch and display shop data -function fetchData() { - - // Clear the previous data - clearShopData(); - - // Fetch new data - fetch(apiUrl) - .then(response => response.json()) - .then(data => { - // Sort data by id in descending order (smallest id at the bottom) - - data.forEach(user => { - const template = document.querySelector("[data-shop-category-template]"); - const output = document.querySelector("[data-shop-output]"); - - const category = template.content.cloneNode(true).children[0]; - - const bannerImage = category.querySelector("[data-shop-category-banner-image]"); - bannerImage.src = user.banner; - - const logoImage = category.querySelector("[data-shop-category-logo-image]"); - logoImage.src = user.logo; - - const hero_logo = category.querySelector("[data-shop-category-hero_logo-image]"); - hero_logo.src = user.hero_logo; - - const logoImage1 = category.querySelector("[data-shop-category-logo-image-1]"); - logoImage1.src = user.logo; - - const mobile_bg = category.querySelector("[data-shop-category-mobile_bg-image]"); - mobile_bg.src = user.mobile_bg; - - const pdp_bg = category.querySelector("[data-shop-category-pdp_bg-image]"); - pdp_bg.src = user.pdp_bg; - - const success_modal_bg = category.querySelector("[data-shop-category-success_modal_bg-image]"); - success_modal_bg.src = user.success_modal_bg; - - const mobile_banner = category.querySelector("[data-shop-category-mobile_banner-image]"); - mobile_banner.src = user.mobile_banner; - - const featured_block = category.querySelector("[data-shop-category-featured_block-image]"); - featured_block.src = user.featured_block; - - const hero_banner = category.querySelector("[data-shop-category-hero_banner-image]"); - hero_banner.src = user.hero_banner; - - output.append(category); - }); - document.querySelectorAll('.shop-category-assets-holder').forEach(element => { - element.addEventListener('click', function() { - this.classList.toggle('expanded'); - }); - }); - document.getElementById("shop-category-loading").classList.add('hidden'); - - }) - .catch(error => { - console.error('Error fetching the API:', error); - document.getElementById("failed-to-load-shop").classList.remove('hidden'); - document.getElementById("shop-category-loading").classList.add('hidden'); - }); -} - -// Initial data fetch when the page loads -window.onload = fetchData; diff --git a/assets/19.js b/assets/19.js deleted file mode 100644 index c57ef4c..0000000 --- a/assets/19.js +++ /dev/null @@ -1,22405 +0,0 @@ - - -app_version1 = "427" -app_version2 = "Dev" -tcbx926n29 = app_version2 + " " + app_version1; - -let modalIsAlreadyOpen = false; -let discordProfileEffectsCache = null; -let pplusProfileEffectsCache = null; -let communityThemesCache = null; -let atMeUsercache = null; -let claimablesShopcache = null; -let myXPBalancecache = null; -let myClaimablesClaimedCache = null; -let claimablesPromotionsCache = null; - -defaultAvatar1 = `data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQAAAAEACAMAAABrrFhUAAAAY1BMVEVYZfJib/OMlfahqPeWn/eBi/XLz/vq6/7////19f5tePTq7P22vPnV2Pyrsvirsvl3gvT09f7Axfp3gfRtePNsePPg4v22vPq2u/qCi/WhqPjf4/zf4v2Xn/essvjLzvuXnvdbidFTAAAETElEQVR4AezBgQAAAACAoP2pF6kCAAAAAAAAAAAAAAAAAAAAAIDZudMtV1UlDuCFRKlWIEJ6uOwbzXn/lzzzYc/GWiT6zya/79WrLeYSc5Vq9IFWa3Sr6JehWt0ZZn5RtFJvmHnodPsrPLx1/B9PKx1ziLOPnIRRO84EXaAP/CWnR3pArTWcybpA5G8NsX20pw+cSbpAngEeOQenY+Cf8KIZ4FuDfSV4Ko/7hS7wNjYH7W3MvNeHtn2jvxn+OXcgaP0x8KJo43vgnwqu85EXDfGVULWON9G1BOmDN/M/AnTgDSWC0xve0KAITeSsykFw4qzOQWB4YwNBOfLmPAHpeXsvr5XOgJkjGA3vIlU6A2bvOHvAnXwiCMrwTl5UpUtg5us7BAB2gcg78nXugaC6QORd+bo7AEAXiLwzX+8SANEFNHPdXcAwV90FDgxA037+zwAc7aZlCKnSNTDrADZBdU6DBwbha5wCAabBkWGkSqfAzFa6C8xeADYB9Y2ByEBsbSMAYAy0zHWPActQLPQuKBh3DiwiDRlwzwFOv9JfTpORh5x5rVfQc8CQiLLJiEMaA1oW6XgVq+grVh4yY56JA68x07fm8hCIhXCUPn823zgkG/HK4Rf6kYv8YBt5BQ03BQyv9CMq8M/JQ7IItw+e6cd8QQjKTqCX3OMTtOdCCNZOoCnqkrYgZEFD2/FF/08qDAE4Dji+TtHPKHknVmBboVB2i9HI9zIGahZUhaVqVxCyQEEVQ7rSBMj3QiPUUTCWJkC+8zrQVjzmELBYG2H5jDYUFqAiQDlMtAwKQgjr+nwoq9O2BSEQJQFVWKeNBSEQ6+BYeG3BFIUAHIfasmsLh7IQgLcjDZd0AWXEIZRDMDYCuuj73g95yJGxEuBLPmr6VBSyzMO9Fpzko3kqeA1r8W4GHOWNKQ/JIl4COL4SZf2lPAQhAY4lYrv860rlIVmHlYAsuBhjFwpCwO4LOkb0TMAzAc8EPBPwTMAGngl4JuCZgMig4jMB27AMykJUhCr4ekwzKI10T9hpwzcz6DNSUbRdORzThW/CJSKagd4LjKurof1suFCYVR54MDckpsBXDLk3pliQgxBTHneBrwiaNtOfeUUKCnMQYlKC32x2r7SlmSUpoOQdi5xtoqx1DNP8WW9kKSCVvAu8QnC2USR4/I2bP5vDmhS80pdOjXULw8dc7HSiL6ljYLTmz/ooKvJTdkqTt9G5s/mHczH6qXlV9I32Ehi0+QVfQbn7HryHhvY033V1Tuu3CRncOIj3rL3EV9pf7+53ced0bY+MIZm7ndEt9uNnkxN8OSWhAvjjZ8ktnIoKaMDHF0yH8S416C4Rpv7bU094pWJ9QFv4BJOBvnkFzjWKMvhu4G78IibMIz2EFM3KFUAwCEI+ID9MDia6kd/+enpFj+YE+af+aA8OZAAAAAAG+Vvf46sAAAAAAAAAAAAAAAAAAAAAAFYCeHSjWah9hFcAAAAASUVORK5CYII=`; -defaultAvatar2 = `data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQAAAAEACAMAAABrrFhUAAAAhFBMVEV1fop9hpGgpq+ytr2prraXnqfT19vu7/H////29/iGjpju7/DCxszc3+K6vsS6v8WOlqD39/fLztPLz9OPlqDl5+nDx8ygpq6xtr6xtr3m5+iOlp/Dxsvc3+Hd3+GorraGjpnT19rT1tv29/eOlqHU19p+hpGprrWxt72or7bLz9Kfpq+ibmTzAAAEY0lEQVR4AezBAQEAAAQAIPB/swkMqAIAAAAAAAAAAAAAAAAAAAAAgBNZPfFWy86dLimOw3AAV5qYEXFicMKxHIFs03e///PtvaouagjRGMKfNr/vmhorsiMbpwcm+UZjN4PhD2YedR5TZpnZDgfmOww+L/h/jjoaS0iRG7pdk0HBQlECmeevisGEbpDJf7DQlUDJh2xlbm30noWmBGQFuOUcTMeej3CqFeCQzTOCl8i8bymBbPKQDlxeCecGqTH/Dc/ycUVK0LKx51ZVXs08H+WLoSu5la0yQmUK7sXQEKQ592ZOgFLukSE4meUe2YTQlCyinARTFnFOAss9swRlzL1zBCTj/o2ySFdAURCMBV+FiXQFFLP4esADvxGExPKVjJJIX4HCxbcJACyBkq/IxdkDQZVAyVfl4i4AgBIo+cpcvK8AiBJYMsddApY56hJIGcCSrmfFAAq6GsMQTKTvQDEEaILiXAZTBuEAlsAYl8E1wzCRLoEij7QLFKNYmwBhIp0BIo9tBgDMAcMc9xzYMJQcugvytl55VtCHWNx9wHaZ0d+mO6sP6Z7mBnQfYA2R2Fl1yMKCHov8zp3kycHKoQ9x3Mkj9Wv/i9s0FxCC9CJca8cv3JlDxBPecfgz/cwzt9j+etO5hFsCbEM/89I2e/QhoqI+2YBzGnfWEGHRuoBRQ6R9nu0hQJ3AIqgkNwEhLR6oPy7o/2MCQwC2AwWfltAxL/oifgFrhfZhtxitvpexAKug7nnU+gKqw2sO6DDk8bwJKKF6wZRPq8IToO28XqkvDnMK5FiNMB1n9SErqGZ4xeGvQV0IYV2f34ed05qgEIAjgZfAc9oyIATiPbgOvLZgA0IgtkMm7NpCGhCC8evIgkNKILHqEJIQjEZgGfR971wfMmasBLiQj5regkLaObifBd/p0Ls+xHBXOd7NgLH+YepDRIWXAK4yIpE9B4QAJaBgjcq0/3Wl8BDxiJUA4Yuqqob+YiGi7i0BiO4JuCfgnoB7Au4J6ME9AfcE3BNQMqjqnoAYrgkDnAc4BuWoH0sGtUS6J7xdWj4bu5wBHIqqL+yYZz6Lrek47wzOL0M7+kfjLAfyLpGJB3NDYrfnE2wq5VLagNF/GJl3nk/wS+pNM+PuKZAc6EefKP5m87ahPjnWpICMq1lllRsSpmCYxy8aq0sBJcbVnjvw23yR0OHwcR6/cPsuKcjoq+kir1d8lH3O0yl9lYw9oz1+0ZSqQ34SU5O6/KOuV/Zfdf3x4dJFltAB8+wZ9PErvoKqL7vxtp90TY5Pmlyy5ZI2QcDNg+qSZy9VQ9fX1Je7uDM91SNjMPZie/QN9vDFrtZ8OaXwsgcfvjB1y64owBJp+PrlsLrIGfSzIUzN4a7HNxSs2cO8+PSLwfLsJ3Dbh4QEfBlsz/xDjHcTQicHAPIGONck8LJBvpkc7OhMduxzk9CtmUL+U3+2BwcyAAAAAIP8re/xVQAAAAAAAAAAAAAAAAAAAAAAKwFiKavpSRGzHgAAAABJRU5ErkJggg==`; -defaultAvatar3 = `data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQAAAAEACAMAAABrrFhUAAAAgVBMVEU7pVxIqmZ4wY+QzaOEx5lsu4TC48zm9Ov////z+fVHqmZUsHCp17jO6Nad0q2d0q5gtnry+vW13cK23cHa7uGp2Lep2Lh4wY6RzKOQzKPa7+Bsu4VgtXrz+vTa7uCExpnn9Orz+fTB48xTsHBHq2a23cKFx5mFxpmRzKR4wI9gtnsomQ4wAAAEZ0lEQVR4AezBgQAAAACAoP2pF6kCAAAAAAAAAAAAAAAAAAAAAIDZuc+1tXUYAMDKcKwMO6sDCCM0dN7//Z191B2iGmJR8/7+1KcWliM746ooTlJYLE5U9BuNXSWZRsS8gIVKjYg6S9TvMPjK4P8sLFRTiKkUPK4mMUgYU6Bs8UsmaeABqUoj4U2BDr+lO/Voo2+RcKYArQCPnIPGtvgTlrUCfEtXJYgXUd3PTIGyidPEVj2xNkmV+m94Gn/OpCBaaVuc1VX9i5k/aU1mO5yluxKkUgZXkSkQ6SWu5hUIlOKKFIhTalyRLkCaDkmQRdAgCbMINK5Mgyg1rs6CICWuLy8DXQGJATFeoxcq0BWQvJDVA3qwAREijZ7kRaCXQGKlbAKCngIdemTD7IFETYEOvbJhTwABU6BDz6z3S0DYU2CL3lnfu4Cgp0CKAmzAnx0KYMCbAUVQgV4DSea/CQp0GUxRCOt/CQxyGdyjGCrQJZBUgXaBJA+1CSAq7ArwUwMaBckDrwAfNfASRalEd0EHbY4HZOCHaLn7ALMt4W/NaeSHHHGpUug+YByAwGlkh8Sj0GORDBepCvjKK35ILXNPfP7FbVrtECLpQrjnjp/UDiGzGljTBhd4wy8e8+tN50bcEjBO8COXuerhh5Ae1qQdzmlqh5AZWloXkE8A3N+TEeK3E4jxuo7ZRfNDvhHDeqzT/2dwD/G9HTB4XQE/c2FWAIXMy2S1QTv+EpozQvyughfHo2rjEDKjEHUYkt02AW9F9YIpvy9xTUCG172DtViZJVCJaoT1TLzmh+xENcM7dLsM8kMAF9jJOgxQjDWUFeL/SODieE7buYX4vw7uHR9b0O4hfrdDg9tjC6ljiP+7IzG6TIFIs0OAQmQ0Ahun93tf8kNqlJUA6/II48Y1ZIYVd1vwPXzrPT9EibtB+PbXn9/auIfM6OUlALsSCJRv3EMkJMAgR6fmv67kHkIyWQkgren7PmvvFkKM3wT490zAMwHPBDwT8EzAMwHPBDwT4Gkv4F//TID/84AgHhi2KJT1eybo30bSc8JmO+LNjNuj/0NR/gM7Q4Y3YYaFJ8NKzp2hE/xjqkd0dKgLKjwxT0iczniFTmm6dKPD6PuB6q69+scfYDXTEZengHLAH33B+GazmWBNNXJSAIM1yHKsBiDKoJifn0wjLwVQDNYccIGDqeICZobv+ecn9XlJCkr4UhNXZqZ8dFalDXwpsi1K+/nJ1LEO+Qk0Q2qr3pij/pcxfW/TuCzgGyprUd7Pz30Lytx34z1+BJ9qvOqTe8s13yYQmXXQ3fPspZvAv8ngnAkcNNd6ZBmG8W579Feyh09OhvHmFMflLHz4ZDAzuyIHW4HDZyyH3V3OoLMBZJq+3fUcJnA2naVd+BiLwYebf7TRxAUQ8dPA3PhGzKH+BOLRAQD/CjBfBAfaID9MDk43q6u/R1/Ao2lE/lN/tgcHMgAAAACD/K3v8VUAAAAAAAAAAAAAAAAAAAAAACsBm86sivq4FSMAAAAASUVORK5CYII=`; -defaultAvatar4 = `data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQAAAAEACAMAAABrrFhUAAAAjVBMVEX6phr6qyj7wWH8zX78x3D8wWH7vFP+47j+9OP/////+fH6sTf+9OL92Jv+6cb904z80o37t0X++vH93qn90436sTb7sTb7x3D80oz93an+7tT92Zv7wmH9zX/8zH7+79P7tkX92Jr82Jr/+vH+6Mb/9OP/9OL7qyj947j6rCj+79T8zX/95Lj7sTf915vvhd1yAAAEbklEQVR4AezBgQAAAACAoP2pF6kCAAAAAAAAAAAAAAAAAAAAAIDZuc/tRpUYAMAisAK54AAJnvFNZ5zYTnn/t7t9dXJc0Y4N8o6//0o8QlMpB0VXcQKt/Ygx+o3ajnGaEdGgdZuGGRGN0hh/h8aPc/ppAi1dc0g+RjhfRZwTE5TAsKTv8riAM4TjjJisBCpaN6rw3FpfEpOUAI8A55yD4qakHSayEWDNaHwL6kXc7/eUQF1cTWMztsyYeIpYw78y2i1PQLXhjovPqrGdlbRTmaemor1Gld4ywJw6kSKoNKbO/AEKJdQhVNj9M+rQKAJtKmJBdoKCWJidIKOOjUCVa+rcBBQZUvcGt4GOgCwHNe6oFxjoCMhmetaAPbkHFaKMejKIAp0C2UTLJiDoEqioRxMda6CgS6CiXk3CLgAFJVBRzyYKpoCQS+CBKOwSyIiCLoGEFIihP4+kQA69QVIBA50DWapzERTAMJiQEhONQ2AAw+ATqYGBDoHsOdBVIBuEughgqK4HBNAHMqKg+wAShd0HXkiVZ9WroCZzs4YE5CEjvfsAF9fwjyKZy0Nm1FatdB/wit+D5uKQu7nSY5G0Zdd8E48c6yFG5564+cVtmvEI0TQRPknbz8yRQ1gBXYqphQVss6A93K8vOmN1Q8BrDdssG9pNHsIsdCnzOKcxRw1hI22rgEENIL2egpB+VwJ3XiX54hGyxx10x3j9HvQIUbIdcHRYBLss5UW8VLYUauiglXwIHQhC+h0Fl55H1c4jZI9I1WFIetwEWFVrwSkdZv0TIF15TaErRmcXeFa1EB7JR7SR5wGUVXAcJpgGRSFALax0HQYg7IJeIQqOBJae57SVR4iKefDJ87GFzCNExXYI/R5bSDxCdNwduSOfEogycQhwiI6FQOz1fu9YHnJNuhJgfF5qevcK2c+ouy2YwLpEHoLqbhBaau1GfjHlIczqSwBVt8Bg+OERoigBjiQq3P91Jf8QlupKACtza21aniyE5T0kQI9LAi4JuCTgkoBLAjpwScAlAZcEWFLKXhIQwmPCCs4DDCllejgTVCVWdHOYXDyno3mNVwoORcUP7OCCjsJhy36HWu4M8dHmp5mTp8a8te54BXQkaeiAUcLlYj1y0Fjk/1nSAU0MnflcUfsUyHPArX8TfLPZ1dAlQ5IUABpHIrMvBIY5qbn87HMuSwG8oXENtdC4r7s3WG++nsvPTNMmBbfwXXH35Wa0U7b4mhbwXXRTkrbLzz6t6JCfQYFT82Wdm2X/cc5aM72r32ANLkrSd/mlb0Hlp914v/6APpmTzs7YfpnA1PUDe8qzF1tD/z7d6R7cKQ6tkXXA+cn26C+6m88SJ3lzSmDZKG8+Q7dnV+ThQVPz5cOhPckZdIqg0+f6rqepwdtnI5j4tA0G8dE/2uiu3oCpLwN35BsxjSlAPz4A4BngOJ2g4Q3y2eQggSNJ/mn9G5ybQuWf+qs9OJABAAAAGORvfY+vAgAAAAAAAAAAAAAAAAAAAABYCfy25L0QL4/pAAAAAElFTkSuQmCC`; -defaultAvatar5 = `data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQAAAAEACAMAAABrrFhUAAAAh1BMVEXtQkXuTVDzfX/1lZf0iYvxcXP5xMT96Oj////+8/PuTlDvWVz95+j3rK360ND2oKL2oaLwZWf+8/T4uLnwZWj83Nz3ra73rK7yfX/1lZb1lJb829zxcXT70ND729z6z9D0lZbziYv95+f0lJb5xMXvWlzuTlHzfYD0iIvziYr73NzyfYD5w8SoNjStAAAEaklEQVR4AezBBwEAIAwAoN3+lY3gAgABAAAAAAAAAAAAAAAAAAAAAMAXWT1xVr352LnT/jZ5GADg6oKpDAanmPWEkLLQnd//6z33o90OmhOszPxfV/vN8iU7wG/UdrXJrxFRFzBTaRDR5Bv1OzS+qvF/FmbaUkhdXXISbjY1EsYQKBv8Ur25gQukqmskvCHg8FvGqUtrfYOEMwRoBbjkHLTbBn/C8laAb5iqBPGuaN57hkB58yrb2MoRazeZUv81z+DP1RmIVm4b9HKVe+35k6bOrUMv40qQStW4iFyBSLe4mDsQKMMFKRCnNLggU4A0DkmSk6BFkuYkMLgwA6JscXEWBClxebpMdAUkNYhxj1GoRFdA8lpWDRjBA4hwZTASXSS6BRKbwCFA/hBwGJFNoAaSPgQcRmUFDIC0h4DDyGz0LSDtIfCA0dnYp4Ckh0CGAjxCPE8oQA3RdCiCSnQPJHn8IijRZTBDIWz8JTDJZbBFMVSiSyCpEq0CiU61CCAq0RlAqkRnANGJz4AYc+AORalEV0Ha9DuNDPwQI/ccMOxL+Fv7PPJDdjhXKfQcMHYA5Hlkh9yPQq9FcpylKtgrx7chVuaZWP/iMc0GhEjaCFtu+4k9cQi5gSW9wRkO8CMH9Bh+veh8FLcEjBP8yItv9vBDiBNXB1v4MXvSEGKkVQF6AuD2JyMkbiXwNmhI3gWEeNzDcmzQ/6cLD4l9HOjxuAJ+5oU7AyjEK5dVBj15wq/5tcx15FWQ3x8DfwAN4WNO0GVIftoEOFG1YIbHufAEcCuvd7AUK3MKVKIKYcNf0UzgBZSLex3G3wYZIYAzPMm6DFCsNZQREv9K4CXwntaFhcTfB9vAxxZMeEjc41AX9thCFhbioeKcBZn9eWXYIUAhMgqBN0Hv997yQ7YoKwE25KWmfWiIhxX3s+B7+NZ7fogS9wOhw9m2/M7khxAnLwHoSiBQHsJDJCSgRw6n/F9XCg8huawEkKZ2zuXN2ULIED8BEa0JWBOwJmBNwJqABawJWBOwJsChUG5NQPz7gCQeGLYolI1/JxjXo6TnhIf9iCcz7j/EvxTlP7DTHfAkhm7mvFNSfhmiq83JjhhI24ImnpgnJJ41HmEyGi4uIAfadTTvGjxCP8Jipg84PwWUA37rC8Y3m4cJlmSRkwLobI8su6oDQs0X0P1kGnkpgKKzvcYZ9FB9LMDT/MjdT6yek4ISvtR+rPqd588PVdbCl662DUrrfjI51iU/gbbLbOX6fmf+1ffO2exjWcA31KFBod3PeAtqOO/Be7yHmCwe1Z6p5KIygcicB+6cdy9ugvimHn2m8xWdQwcydOPZzuh3sptPnnvOm1MML1p480nXe05FAfYCm89YDt1Z7qA/dSDT5MaZb44xTFraxsdYDB7Bjz8JhlcFEPHDYDjxDzHatiAeXQD4dwD+JNB0QL6YHLyHE3n/d+sLuDStyH/qz/bgQAYAAABgkL/1Pb4KAAAAAAAAAAAAAAAAAAAAAGAlB3yyZnlY4UQAAAAASUVORK5CYII=`; -defaultAvatar6 = `data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQAAAAEACAMAAABrrFhUAAAAZlBMVEXrRZ/sUKXxf73zl8nyi8Pwc7f5xOH96PP////+8/ntXKv86PP2rdX60Of1os/vZ7H+9Pn3udvuaLHzi8P73O32rtX0lsnzlsnwdLf95/P4xOH4xeH4udvsUaXxgL383O3yisPvaLFF0RjvAAAET0lEQVR4AezBgQAAAACAoP2pF6kCAAAAAAAAAAAAAAAAAAAAAIDZuc/FVnUYDuBiJbLBKs5ooLvv/5B3X3UTdJzAP4f8PldtLTxkM47K8qKk0fKiyn6jtlfFas3MbnSbfM3M9aqofofGN4H/JzSSaEhoLjkJN0VgZegCvuX3QnFDF6hq1qxsXSDyZ3WsLq31LStLF9AZ4JJzsJGWfyC2GeCTuvEEL9NxP9AF/E2+LaSJSqTYVpWnf9T8s1ASNC8tD4pN3A38SBtWEnlQHT2hqgJPYlURpD1PZk+ASp5QRXB8zROqM0ITWS1yEGxYLXMQ1DyxmqAIT04IiOfpOb/QGVAFgpHzLKqFzoBqh1MDzuSWIGQ1z8RlC10ClSxvEwDYBSLPSJZZA0F1gcizkmV3AIAuEHlmstwlAKILHHh2ssRdAEwXKBnALc1nxwACzaZjCNVC10C1WmYRBDANlgxCljgFAkyDG4ZRLXQKVM1Cq0DlllcEAIyByECahY4A5ZY2AgDGwJ6hNNBVkFuHnWMDe0iNuw8IB09/25S9PWR8mj3oPqDv3gf15pC8Bz0WueNRmuzTzGEPEcw9sfvFbZqkh0AshBtr+5WcOETd4B2H39N37u0b2wegScAwBfSevvPo+Gf2EBXh6mCh70lCCEol4C3P8Rmu50AIViXwlNQl9wkhA3KajiT9P11iCMB2IPBxGf3k0d6JH8FKIcdHPdPP1vZaZg01Cz4mHlWHhJABGdRhyOq0CYhQteCWj4upCbBXXiVNRTCHQANVCNdDM5o9ZAdVDO84fRm0hRCP8Ix1GFBZ5lBDCMCRwGPiOW1MCgFYBzeJjy3UCSEQ26Eu7bGFMi0E4O7IE6d0gaw2h5CGYBQCh6T3e/f2EGGsBEjKI4yH1JABAndb8IU+e7GHVHA3CCOPJvaLaQ9RES8BHD2R8vcJIUAJCGwRq+GvK6WHqBVWAlQbYoyr9mwhKsyQABzXBFwTcE3ANQHXBFwTcE3ANQETiAwqXhOwhMeEAc4DhEHJDGeCUG6Bbg5zOPR8Mv1hB3Moanhgp7vnkwjdyHFXodwZ0qNNLz0ncpLpwIN5QqJ0fEStvbGLCTlwsdO/2fIR7pYm43c8PgX2HGjrM8M3m4OnKQlbUkCdBDbZNR2pKjDM5Ve+t6WAsk6C4xFcaJ4yMjR/4suvxI1Jgaf3Nk9N2PGP1vfNdkPvZdIy2uVXPhoO+d/bdFtpYgi79b9CiFG2Tz6jT6r7lkEvv+EtqHDejXef05yEj3o9U8mlZYLCHAfxnGcv0dP8fDjfgzubYzUyhq4/2x59j918VQbDm1MWjw68+aoLA7uiBAfA5humw3iWM+hVR5h87E//BXjv0BY+w2Rwe/ITuJBnpOC7QTjxjRgnr4RPDwB0BTjNIHC6Qb6YHLzQibz83fqMLs0G8lf92R4cyAAAAAAM8re+x1cBAAAAAAAAAAAAAAAAAAAAAKwEXiSjy96AYeIAAAAASUVORK5CYII=`; - -localStorage.experiment_2025_02_mobile_render = "Treatment 1: Use new mobile check"; - -if (!localStorage.ext_sty_category_tab) { - localStorage.ext_sty_category_tab = "1"; -} - -if (!localStorage.reviews_filter_type) { - localStorage.reviews_filter_type = "2"; -} - -if (!localStorage.reviews_privacy_type) { - localStorage.reviews_privacy_type = "1"; -} - -if (!localStorage.reviews_time_type) { - localStorage.reviews_time_type = "us"; -} - -if (localStorage.sa_theme) { - document.body.classList.add('theme-' + localStorage.sa_theme); -} else if (!localStorage.sa_theme) { - localStorage.sa_theme = "dark"; - document.body.classList.add('theme-dark'); -} - -let communityThemeImport = document.createElement("style"); - -communityThemeImport.id = 'community-theme-import'; -if (localStorage.community_theme_raw) { - communityThemeImport.innerHTML = `${localStorage.community_theme_raw}`; -} - -document.body.appendChild(communityThemeImport); - -if (localStorage.discord_banner) { - -} else { - localStorage.discord_banner = ``; -} - -if (localStorage.discord_banner_color) { - -} else { - localStorage.discord_banner_color = `#829ff4`; -} - -if (localStorage.discord_avatar && localStorage.discord_avatar != '') { - -} else { - setRandomDiscordAvatar() -} - -function setRandomDiscordAvatar() { - localStorage.discord_avatar = ``; - const randomAvatar = Math.floor(Math.random() * (6 - 1 + 1)) + 1; - - if (randomAvatar === 1) { - localStorage.discord_avatar = defaultAvatar1; - } else if (randomAvatar === 2) { - localStorage.discord_avatar = defaultAvatar2; - } else if (randomAvatar === 3) { - localStorage.discord_avatar = defaultAvatar3; - } else if (randomAvatar === 4) { - localStorage.discord_avatar = defaultAvatar4; - } else if (randomAvatar === 5) { - localStorage.discord_avatar = defaultAvatar5; - } else if (randomAvatar === 6) { - localStorage.discord_avatar = defaultAvatar6; - } -} - - -if (localStorage.discord_username && localStorage.discord_username != '') { - -} else { - setRandomDiscordUsername() -} - -function setRandomDiscordUsername() { - localStorage.discord_username = `default_user`; - // fetch('https://apis.kahoot.it/namerator') - // .then(response => response.json()) - // .then((data) => { - // localStorage.discord_username = data.name.toLowerCase(); - // localStorage.discord_displayname = data.name; - // }) - -} - - -if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)){ - if (localStorage.experiment_2025_02_mobile_render === "Treatment 1: Use new mobile check") { - - - - - - document.getElementById("options-sidebar-container").remove(); - - sessionStorage.setItem('api-token', 'token'); - - const api_password = localStorage.getItem("api-password"); - const discord_token = localStorage.getItem("discord_token"); - const api_token = sessionStorage.getItem("api-token"); - api = 'https://api.yapper.shop/v2'; - discordsupport = 'https://support.discord.com/hc/en-us/articles/'; - discordblog = 'https://discord.com/blog/'; - yapperblog = 'https://yapper.shop/blog/'; - cdn = 'https://cdn.yapper.shop/'; - tmpapi = 'https://api.yapper.shop/tmp'; - - - endpoints = [ - COLLECTIBLES = "/collectibles-shop?tab=shop&has-leaks=true", - COLLECTIBLES_IN_SHOP = "/collectibles-categories-published", - CONSUMABLES = "/consumables", - MISCELLANEOUS = "/collectibles-shop?tab=miscellaneous", - PROFILES_PLUS = "/collectibles-shop?tab=pplus", - HOME_PAGE_ALL = "/preview-1", - HOME_PAGE_LEAKS = "/preview-2", - HOME_PAGE_PPLUS = "/preview-3", - PROFILE_EFFECTS = "/profile-effects?tab=discord", - DOWNLOADABLE_DATA = "/downloads", - PROFILES_PLUS_EFFECTS = "/profile-effects?tab=pplus", - LEAKS = "/leaked-categories", - COLLECTIBLES_MARKETING = "/collectibles-marketing", - COLLECTIBLES_VARIANTS = "/collectibles-categories-variants", - EXPERIMENT_ROLLOUTS = "/rollout-handler", - COLLECTIBLES_SHOP_HOME = "/collectibles-shop-home", - NEW_ITEMS = "/new-items", - ORBS_SHOP = "/orbs-shop", - ORBS_SHOP_DEFAULT = "/orbs-shop-default" - ] - - yapper_categories = [ - WINDOWKILL = "profiles-plus-1", - BOPL_BATTLE = "profiles-plus-2", - PAPER_BEACH = "profiles-plus-3", - WINDOWKILL_V2 = "profiles-plus-4", - FIVE_NIGHTS_AT_FREDDYS = "profiles-plus-5", - PLUS_SPECIAL_EVENT = "profiles-plus-6", - GEOMETRY_DASH = "profiles-plus-7", - PAPER_BEACH_V2 = "profiles-plus-8", - RBXDOORS = "profiles-plus-9" - ] - - - discord_categories = [ - FANTASY = "1144003461608906824", - ANIME = "1144302037593497701", - BREAKFAST = "1144054000099012659", - DISXCORE = "1144058340327047249", - FALL = "1157406994873991284", - HALLOWEEN = "1157410718711304313", - WINTER = "1174459301239197856", - MONSTERS = "1179493515038818325", - CYBERPUNK = "1197342727608746044", - LUNAR_NEW_YEAR = "1202069709281828935", - ELEMENTS = "1207046915880124426", - ANIME_V2 = "1212565175790473246", - SPECIAL_EVENTS = "1217175518781243583", - SPECIAL_EVENTS_2 = "1309309974266118144", - SPRINGTOONS = "1217622942175727736", - SHY = "1220513972189663413", - LOFI_VIBES = "1228243842684162121", - GALAXY = "1232029045928099922", - FEELIN_RETRO = "1237649643073044491", - PIRATES = "1237653589896200272", - ARCADE = "1245086656973901894", - TIDE = "1252404112650407998", - DARK_FANTASY = "1256321669388308595", - ROBERT = "1262491137386614805", - STORM = "1265375293397270650", - DOJO = "1266520267946201099", - THE_VAULT = "1277733175191277721", - AUTUMN_EQUINOX = "1282816432056569866", - BAND = "1285465421339693076", - SPOOKY_NIGHT = "1287835634089594972", - CHANCE = "1293373563494993952", - MYTHICAL_CREATURES = "1298033986811068497", - WARRIOR = "1303490165284802580", - KAWAII_MODE = "1306330663213072494", - LOFI_GIRL = "1309668861943218229", - WINTER_WONDERLAND = "1314020997204283476", - FANTASY_V2 = "1324454241254903829", - STEAMPUNK = "1326333074241486859", - PROGRESS = "1333278032999485461", - RADIATE = "1336483992429658112", - VALENTINES = "1333866045521395723", - ORB = "1332505418219655258", - ANIME_V3 = "1341506445249609728", - INSOMNIA = "1343751621364027462", - NAMEPLATE_TEST = "1344802365307621427", - AESPA = "1346499610977243196" - ] - - category_types = [ - HERO = 0, - FEATURED = 1, - FEED = 2, - WIDE_BANNER = 3 - ] - - item_types = [ - NONE = 100, - AVATAR_DECORATION = 0, - PROFILE_EFFECT = 1, - NAMEPLATE = 2, - BUNDLE = 1e3, - VARIANTS_GROUP = 2e3, - EXTERNAL_SKU = 3e3 - ] - - const nameplate_palettes = { - crimson: { - "darkBackground": "#900007", - "lightBackground": "#E7040F" - }, - berry: { - "darkBackground": "#893A99", - "lightBackground": "#B11FCF" - }, - sky: { - "darkBackground": "#0080B7", - "lightBackground": "#56CCFF" - }, - teal: { - "darkBackground": "#086460", - "lightBackground": "#7DEED7" - }, - forest: { - "darkBackground": "#2D5401", - "lightBackground": "#6AA624" - }, - bubble_gum: { - "darkBackground": "#DC3E97", - "lightBackground": "#F957B3" - }, - violet: { - "darkBackground": "#730BC8", - "lightBackground": "#972FED" - }, - cobalt: { - "darkBackground": "#0131C2", - "lightBackground": "#4278FF" - }, - clover: { - "darkBackground": "#047B20", - "lightBackground": "#63CD5A" - } - } - - const params = new URLSearchParams(window.location.search); - - function setParams(params) { - const url = new URL(window.location); - - // Clear all existing query parameters - url.search = ''; - - // Set the new query parameters from the provided object - Object.entries(params).forEach(([key, value]) => { - url.searchParams.set(key, value); - }); - - // Update the address bar without reloading the page - history.replaceState(null, '', url); - } - - function addParams(params) { - const url = new URL(window.location); - - Object.entries(params).forEach(([key, value]) => { - url.searchParams.set(key, value); - }); - - history.replaceState(null, '', url); - } - - const clickable_side_tabs_container = document.getElementById('clickable-side-tabs-container'); - if (clickable_side_tabs_container) { // Check if element exists - document.getElementById('clickable-side-tabs-container').innerHTML = ` - -
Shop
-
- - -
-
-
- `; - - if (localStorage.experiment_2025_02_profiles_plus_home === "Treatment 2: Enabled") { - document.getElementById('new-profiles-plus-tab-container').innerHTML = ` -
Profiles Plus
-
- -
- `; - } - - if (localStorage.experiment_2025_02_profiles_plus_home === "Treatment 3: Hide All Profiles Plus Tabs") { - document.getElementById('new-profiles-plus-tab-container').innerHTML = ``; - } - } - - function pageCheck() { - // if (params.get("page") === "home") { - // document.title = "Featured | Shop Archives"; - // if (localStorage.experiment_2025_02_fetch_from_vercel_endpoits === "Treatment 1: Enabled") { - // if (localStorage.unreleased_discord_collectibles == "true") { - // url = api + HOME_PAGE_ALL; - // apiUrl = new URL(url); - // apiUrl.searchParams.set("include-unpublished", "true"); - // } else { - // apiUrl = api + HOME_PAGE_ALL; - // } - // } else { - // apiUrl = api + HOME_PAGE_ALL; - // } - // createHomePageElement() - // document.getElementById("home-tab").classList.add('dm-button-selected'); - // document.getElementById("top-bar-container").innerHTML = ` - //

Featured

- //
- // `; - // } else if (params.get("page") === "year_recap") { - // document.title = "2025 Recap | Shop Archives"; - // document.getElementById("recap-2024-tab").classList.add('dm-button-selected'); - // localStorage.dismissible_recap_2024 = "Treatment 1: Seen"; - // document.getElementById("top-bar-container").innerHTML = ` - //

2025 Recap

- //
- // `; - // } else - - if (params.get("page") === "shop") { - document.title = "Shop All | Shop Archives"; - if (localStorage.experiment_2025_02_fetch_from_vercel_endpoits === "Treatment 1: Enabled") { - if (localStorage.unreleased_discord_collectibles == "true") { - url = api + COLLECTIBLES; - apiUrl = new URL(url); - apiUrl.searchParams.set("include-unpublished", "true"); - } else { - apiUrl = api + COLLECTIBLES; - } - } else { - apiUrl = api + COLLECTIBLES; - } - createMainShopElement() - document.getElementById("shop-tab").classList.add('dm-button-selected'); - document.getElementById("top-bar-container").innerHTML = ` -

Shop > Shop All

-
- `; - } - - // else if (params.get("page") === "orbs") { - // document.title = "Orb Rewards | Shop Archives"; - // if (localStorage.experiment_2025_02_orbs_shop === "Treatment 2: Orb Shop done like default") { - // apiUrl = api + ORBS_SHOP_DEFAULT; - // } else { - // apiUrl = api + ORBS_SHOP; - // } - // createMainPotionsElement() - // document.getElementById("top-bar-container").innerHTML = ` - //

Shop > Orb Rewards

- //
- // `; - // } - // else if (params.get("page") === "leaks") { - // document.title = "Leaks | Shop Archives"; - // if (localStorage.experiment_2025_02_fetch_from_vercel_endpoits === "Treatment 1: Enabled") { - // if (localStorage.unreleased_discord_collectibles == "true") { - // url = api + LEAKS; - // apiUrl = new URL(url); - // apiUrl.searchParams.set("include-unpublished", "true"); - // } else { - // apiUrl = api + LEAKS; - // } - // } else { - // apiUrl = api + LEAKS; - // } - // createMainShopElement() - // document.getElementById("top-bar-container").innerHTML = ` - //

Shop > Leaks

- //
- // `; - // } - else if (params.get("page") === "consumables") { - document.title = "Potions | Shop Archives"; - if (localStorage.experiment_2025_02_fetch_from_vercel_endpoits === "Treatment 1: Enabled") { - if (localStorage.unreleased_discord_collectibles == "true") { - url = api + CONSUMABLES; - apiUrl = new URL(url); - apiUrl.searchParams.set("include-unpublished", "true"); - } else { - apiUrl = api + CONSUMABLES; - } - } else { - apiUrl = api + CONSUMABLES; - } - createMainPotionsElement() - document.getElementById("potions-tab").classList.add('dm-button-selected'); - document.getElementById("top-bar-container").innerHTML = ` -

Shop > Potions

-
- `; - } else if (params.get("page") === "miscellaneous") { - document.title = "Miscellaneous | Shop Archives"; - if (localStorage.experiment_2025_02_fetch_from_vercel_endpoits === "Treatment 1: Enabled") { - if (localStorage.unreleased_discord_collectibles == "true") { - url = api + MISCELLANEOUS; - apiUrl = new URL(url); - apiUrl.searchParams.set("include-unpublished", "true"); - } else { - apiUrl = api + MISCELLANEOUS; - } - } else { - apiUrl = api + MISCELLANEOUS; - } - createMainShopElement() - document.getElementById("miscellaneous-tab").classList.add('dm-button-selected'); - document.getElementById("top-bar-container").innerHTML = ` -

Shop > Miscellaneous

-
- `; - } - // else if (params.get("page") === "pplus-home") { - // document.title = "Featured | Shop Archives"; - // if (localStorage.experiment_2025_02_fetch_from_vercel_endpoits === "Treatment 1: Enabled") { - // if (localStorage.unreleased_profiles_plus == "true") { - // url = api + HOME_PAGE_PPLUS; - // apiUrl = new URL(url); - // apiUrl.searchParams.set("include-unpublished", "true"); - // } else { - // apiUrl = api + HOME_PAGE_PPLUS; - // } - // } else { - // apiUrl = api + HOME_PAGE_PPLUS; - // } - // createHomePageElement() - // document.getElementById("pplus-home-tab").classList.add('dm-button-selected'); - // document.getElementById("top-bar-container").innerHTML = ` - //

Profiles Plus > Featured

- //
- // `; - // } - - else if (params.get("page") === "pplus") { - document.title = "Profiles Plus | Shop Archives"; - if (localStorage.experiment_2025_02_fetch_from_vercel_endpoits === "Treatment 1: Enabled") { - if (localStorage.unreleased_profiles_plus == "true") { - url = api + PROFILES_PLUS; - apiUrl = new URL(url); - apiUrl.searchParams.set("include-unpublished", "true"); - } else { - apiUrl = api + PROFILES_PLUS; - } - } else { - apiUrl = api + PROFILES_PLUS; - } - if (localStorage.experiment_2024_12_profiles_plus_marketing_variants == "Treatment 1: Paper Beach V2") { - localStorage.dismissible_paper_beach_v2_marketing = "Treatment 1: Seen"; - } else if (localStorage.experiment_2024_12_profiles_plus_marketing_variants == "Treatment 2: Roblox Doors") { - localStorage.dismissible_roblox_doors_marketing = "Treatment 1: Seen"; - } - createMainShopElement() - document.getElementById("pplus-tab").classList.add('dm-button-selected'); - document.getElementById("top-bar-container").innerHTML = ` -

Profiles Plus > Browse All

-
- `; - } else if (params.get("page") === "published_listings") { - document.title = "Published Listings | Shop Archives"; - createPublishedListingsPageElement() - document.getElementById("published-listings-tab").classList.add('dm-button-selected'); - document.getElementById("top-bar-container").innerHTML = ` -

Published Listings

-
- `; - } else if (params.get("page") === "orb_converter") { - document.title = "Orb Converter | Shop Archives"; - createOrbConverterPageElement() - document.getElementById("orb-converter-tab").classList.add('dm-button-selected'); - document.getElementById("top-bar-container").innerHTML = ` -

Orb Converter

-
- `; - } else if (params.get("page") === "item_tool") { - document.title = "Item Tool | Shop Archives"; - createItemToolPageElement() - document.getElementById("avatar-decorations-debug-tab").classList.add('dm-button-selected'); - document.getElementById("top-bar-container").innerHTML = ` -

Item Tool | Staff Only

-
- `; - } else { - setParams({page: 'shop',err: '404'}); - document.title = "Shop All | Shop Archives"; - location.reload(); - } - } - - pageCheck(); - - function fetchData() { - if (params.get("page") != "home" && params.get("page") != "pplus-home" && params.get("page") != "year-recap") { - - - // Make the function async - fetch(apiUrl, { - method: "GET", - headers: { - "Password": api_password, - "Authorization": discord_token, - "Token": api_token - } - }) - .then(response => response.json()) - .then((data) => { - - if (data.message === "Missing Access") { - document.getElementById("everything-housing-container").innerHTML = ` -
- -

Well, this is awkward.

-

Hmmm, we weren’t able to load the shop. Check back later.

-

Error: Missing Access

- -
- `; - } else { - processCategories(); - } - // Define async function inside the .then block - async function processCategories() { - const categoryTemplate = document.querySelector("[data-shop-category-template]"); - const potionTemplate = document.querySelector("[data-potion-card-template]"); - const categoryOutput = document.querySelector("[data-shop-output]"); - const page = params.get("page"); - - for (const apiCategory of data) { - if (page === "pplus") { - // Existing code for 'pplus' page - const category = categoryTemplate.content.cloneNode(true).children[0]; - category.querySelector("[data-shop-category-banner]").id = apiCategory.sku_id; - - category.querySelector("[data-shop-category-banner-image]").src = `https://cdn.yapper.shop/assets/${apiCategory.mobile_banner}.png`; - category.querySelector("[data-shop-category-banner-image]").alt = 'No Mobile Banner'; - - if (apiCategory.category_bg != null) { - category.querySelector("[data-shop-category-marketing-bg]").src = `https://cdn.yapper.shop/assets/${apiCategory.category_bg}.png`; - } - - - const cardOutput = category.querySelector("[data-shop-category-card-holder]"); - if (cardOutput) { - for (const product of apiCategory.products) { - const cardTemplate = document.querySelector("[data-shop-item-card-template]"); - const card = cardTemplate.content.cloneNode(true).children[0]; - - if (product.type === NONE) { - card.classList.add("type_100"); - card.classList.add('hidden') - } else if (product.type === AVATAR_DECORATION) { - product.items.forEach(item => { - card.classList.add("type_0"); - // Set the innerHTML for the preview holder - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - previewHolder.classList.add('avatar-decoration-image'); - - // Set the initial image for the deco card - const imgElement = document.createElement("img"); - imgElement.id = "shop-card-deco-image"; - imgElement.src = `https://cdn.yapper.shop/custom-collectibles/${item.static}.png`; - - previewHolder.appendChild(imgElement); - - const bgimg = document.createElement("div"); - bgimg.id = "shop-card-deco-bg-image"; - - previewHolder.appendChild(bgimg); - - // Set the product details - card.querySelector("[data-product-card-sku-id]").textContent = `Made By: ${product.credits}`; - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - // Hover effect: Change the image src on mouse enter and leave - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - imgElement.src = `https://cdn.yapper.shop/custom-collectibles/${item.animated}.png`; - if (localStorage.discord_avatar != defaultAvatar1 && localStorage.discord_avatar != defaultAvatar2 && localStorage.discord_avatar != defaultAvatar3 && localStorage.discord_avatar != defaultAvatar4 && localStorage.discord_avatar != defaultAvatar5 && localStorage.discord_avatar != defaultAvatar6) { - bgimg.style.backgroundImage = `url(${localStorage.discord_avatar})` - } - }); - - card.addEventListener("mouseleave", () => { - imgElement.src = `https://cdn.yapper.shop/custom-collectibles/${item.static}.png`; - bgimg.style.backgroundImage = `url(data:image/png;base64,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)`; - }); - } - }); - } else if (product.type === PROFILE_EFFECT) { - card.classList.add("type_1"); - - card.querySelector("[data-product-card-sku-id]").textContent = `Made By: ${product.credits}`; - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - // Ensure the item ID is accessible here - let itemId = undefined; - if (Array.isArray(product.items)) { - // If items is an array, find the item with type 1 and get its id - const item = product.items.find(item => item.type === 1); - if (item) { - itemId = item.id; - } - } else if (product.items && product.items.type === 1) { - // If items is an object and has type 1, get its id - itemId = product.items.id; - } - - - // Fetch profile effects API only if not already cached - if (!discordProfileEffectsCache) { - const response = await fetch(api + PROFILES_PLUS_EFFECTS, { - method: "GET", - headers: { - "Password": api_password, - "Authorization": discord_token, - "Token": api_token - } - }); - const effectsData = await response.json(); - discordProfileEffectsCache = effectsData.profile_effect_configs; - } - - // Find matching profile effect - const matchingEffect = discordProfileEffectsCache.find(effect => effect.id === itemId); - - if (matchingEffect) { - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - previewHolder.classList.add('profile-effect-image'); - - previewHolder.innerHTML = ` - - `; - - // Hover effect: change to the first effect URL (use 'src' from the 'effects' array) - const imgElement = card.querySelector("img"); - - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - imgElement.src = effectUrl || matchingEffect.thumbnailPreviewSrc; - } - }); - - card.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - card.addEventListener("mouseenter", () => { - imgElement.src = matchingEffect.reducedMotionSrc; - }); - - card.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } - } else if (product.type === NAMEPLATE) { - card.classList.add("type_2"); - - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - card.querySelector("[data-product-card-sku-id]").textContent = ``; - } else { - card.querySelector("[data-product-card-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - } - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - - if (localStorage.discord_displayname && localStorage.discord_displayname != '') { - previewName = localStorage.discord_displayname; - } else { - previewName = 'Default User' - } - - previewHolder.innerHTML = ` -
-
-
-
-
-
-
-
-
-
-

${previewName}

-
-
-
-
-
-
-
-
-
- `; - - const nameplatePreview = previewHolder.querySelector("[data-user-nameplate-preview]"); - - nameplatePreview.style.backgroundImage = `linear-gradient(10deg, #00000000 40%,rgb(144, 0, 7) 180%), linear-gradient(170deg, #00000000 40%,rgb(144, 0, 7) 180%)`; - nameplatePreview.style.boxShadow = `0 0 0 1px #a10606`; - - const nullUserNameRandomWidth = previewHolder.querySelectorAll("[data-null-user-random-name]"); - - nullUserNameRandomWidth.forEach(UserName => { - const randomWidth = Math.floor(Math.random() * (180 - 80 + 1)) + 80; - UserName.style.width = randomWidth + `px`; - }); - - const nullUserAvatar = previewHolder.querySelectorAll("[data-nameplate-user-random-avatar]"); - - nullUserAvatar.forEach(UserAvatar => { - UserAvatar.style.backgroundImage = `url(${localStorage.discord_avatar})`; - }); - - } else if (product.type === BUNDLE) { - card.classList.add("type_1000"); - // Fetch the bundled products for the bundle summary - const bundledProducts = product.bundled_products || []; - - // Generate the bundle summary from the names of the bundled products - const type0Product = bundledProducts.find(item => item.type === 0); - const type1Product = bundledProducts.find(item => item.type === 1); - - let bundleSummary = "Bundle Includes: "; - if (type0Product) { - bundleSummary += `${type0Product.name} Decoration`; - } - if (type1Product) { - bundleSummary += ` & ${type1Product.name} Profile Effect`; - } - - // Set the summary text - card.querySelector("[data-product-card-summary]").textContent = bundleSummary; - - // Set the basic card details - card.querySelector("[data-product-card-sku-id]").textContent = `Made By: ${product.credits}`; - card.querySelector("[data-product-card-name]").textContent = product.name; - - // Handle each item in the bundle - product.items.forEach(item => { - if (item.type === 0) { - // Avatar decoration - const decoImage = document.createElement("img"); - decoImage.src = `https://cdn.yapper.shop/custom-collectibles/${item.static}.png`; - decoImage.alt = "Avatar Decoration"; - decoImage.classList.add("avatar-decoration-image"); - card.querySelector("[data-shop-card-preview-holder]").appendChild(decoImage); - - const bgimg = document.createElement("div"); - bgimg.classList.add("avatar-decoration-bg-image"); - - card.querySelector("[data-shop-card-preview-holder]").appendChild(bgimg); - - // Hover effect for decoration image - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - decoImage.src = `https://cdn.yapper.shop/custom-collectibles/${item.animated}.png`; - if (localStorage.discord_avatar != defaultAvatar1 && localStorage.discord_avatar != defaultAvatar2 && localStorage.discord_avatar != defaultAvatar3 && localStorage.discord_avatar != defaultAvatar4 && localStorage.discord_avatar != defaultAvatar5 && localStorage.discord_avatar != defaultAvatar6) { - bgimg.style.backgroundImage = `url(${localStorage.discord_avatar})` - } - }); - card.addEventListener("mouseleave", () => { - decoImage.src = `https://cdn.yapper.shop/custom-collectibles/${item.static}.png`; - bgimg.style.backgroundImage = `url(data:image/png;base64,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)`; - }); - } - } else if (item.type === 1) { - // Profile effect - let discordProfileEffectsCache = null; // Cache profile effects to avoid multiple fetches - - (async () => { - if (!discordProfileEffectsCache) { - const response = await fetch(api + PROFILES_PLUS_EFFECTS, { - method: "GET", - headers: { - "Password": api_password, - "Authorization": discord_token, - "Token": api_token - } - }); - const effectsData = await response.json(); - discordProfileEffectsCache = effectsData.profile_effect_configs; - } - - const matchingEffect = discordProfileEffectsCache.find(effect => effect.id === item.id); - - if (matchingEffect) { - const effectImage = document.createElement("img"); - effectImage.src = matchingEffect.thumbnailPreviewSrc; - effectImage.alt = "Profile Effect"; - effectImage.classList.add("profile-effect-image"); - card.querySelector("[data-shop-card-preview-holder]").appendChild(effectImage); - - // Hover effect for profile effect - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects[0] && matchingEffect.effects[0].src) { - effectImage.src = matchingEffect.effects[0].src; - } - }); - card.addEventListener("mouseleave", () => { - effectImage.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - card.addEventListener("mouseenter", () => { - effectImage.src = matchingEffect.reducedMotionSrc; - }); - card.addEventListener("mouseleave", () => { - effectImage.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } - })(); - } - }); - } else if (product.type === VARIANTS_GROUP) { - // Update SKU and summary - card.querySelector("[data-product-card-sku-id]").textContent = `Made By: ${product.credits}`; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - // Always display the base variant name - card.querySelector("[data-product-card-name]").textContent = product.variants[0]?.base_variant_name || "Product"; - - // Render variant color blocks as interactive divs - const variantContainer = card.querySelector("[data-shop-card-var-container]"); - variantContainer.innerHTML = ""; // Clear existing variant blocks - let currentSelectedVariant = null; // Track selected variant - - product.variants.forEach((variant, index) => { - // Create variant color block - const variantColorBlockTmp = document.querySelector("[data-shop-varcolorblock-template]"); - const variantColorBlock = variantColorBlockTmp.content.cloneNode(true).children[0]; - variantColorBlock.classList.add("shop-card-var"); - variantColorBlock.id = "shop-card-var"; - variantColorBlock.style.backgroundColor = `${variant.variant_value}`; - - // Add click event listener to switch variants - variantColorBlock.addEventListener("click", () => { - if (currentSelectedVariant) { - currentSelectedVariant.classList.remove("shop-card-var-selected"); - } - variantColorBlock.classList.add("shop-card-var-selected"); - currentSelectedVariant = variantColorBlock; - applyVariant(variant); - }); - - // Append the color block to the container - variantContainer.appendChild(variantColorBlock); - - // Set the first variant as the default selected - if (index === 0) { - currentSelectedVariant = variantColorBlock; - variantColorBlock.classList.add("shop-card-var-selected"); - } - }); - - let isFirstTimeLoadingVariant = true; - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - - // Function to apply the selected variant - function applyVariant(selectedVariant) { - card.querySelector("[data-shop-card-var-title]").textContent = `(${selectedVariant.variant_label})`; - if (selectedVariant.type === 0) { - card.classList.add("type_2000-0"); - previewHolder.innerHTML = ""; // Clear previous decorations - previewHolder.classList.add('avatar-decoration-image'); - - // Add the avatar decoration based on the selected variant - selectedVariant.items?.forEach(item => { - const decoImage = document.createElement("img"); - const bgimg = document.createElement("div"); - if (isFirstTimeLoadingVariant == true) { - decoImage.src = `https://cdn.yapper.shop/custom-collectibles/${item.static}.png`; - isFirstTimeLoadingVariant = false; - } else { - decoImage.src = `https://cdn.yapper.shop/custom-collectibles/${item.animated}.png`; - if (localStorage.discord_avatar != defaultAvatar1 && localStorage.discord_avatar != defaultAvatar2 && localStorage.discord_avatar != defaultAvatar3 && localStorage.discord_avatar != defaultAvatar4 && localStorage.discord_avatar != defaultAvatar5 && localStorage.discord_avatar != defaultAvatar6) { - bgimg.style.backgroundImage = `url(${localStorage.discord_avatar})` - } - } - decoImage.alt = "Avatar Decoration"; - decoImage.id = "shop-card-deco-image"; - previewHolder.appendChild(decoImage); - - bgimg.id = "shop-card-deco-bg-image"; - - previewHolder.appendChild(bgimg); - - // Hover effect for decoration image - if (localStorage.reduced_motion !== "true") { - card.addEventListener("mouseenter", () => { - decoImage.src = `https://cdn.yapper.shop/custom-collectibles/${item.animated}.png`; - if (localStorage.discord_avatar != defaultAvatar1 && localStorage.discord_avatar != defaultAvatar2 && localStorage.discord_avatar != defaultAvatar3 && localStorage.discord_avatar != defaultAvatar4 && localStorage.discord_avatar != defaultAvatar5 && localStorage.discord_avatar != defaultAvatar6) { - bgimg.style.backgroundImage = `url(${localStorage.discord_avatar})` - } - }); - card.addEventListener("mouseleave", () => { - decoImage.src = `https://cdn.yapper.shop/custom-collectibles/${item.static}.png`; - bgimg.style.backgroundImage = `url(data:image/png;base64,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)`; - }); - } - }); - } else if (selectedVariant.type === 1) { - card.classList.add("type_2000-1"); - (async () => { - // Ensure the item ID is accessible here - let itemId = undefined; - if (Array.isArray(selectedVariant.items)) { - // If items is an array, find the item with type 1 and get its id - const item = selectedVariant.items.find(item => item.type === 1); - if (item) { - itemId = item.id; - } - } else if (selectedVariant.items && selectedVariant.items.type === 1) { - // If items is an object and has type 1, get its id - itemId = selectedVariant.items.id; - } - - - // Fetch profile effects API only if not already cached - if (!discordProfileEffectsCache) { - const response = await fetch(api + PROFILES_PLUS_EFFECTS, { - method: "GET", - headers: { - "Password": api_password, - "Authorization": discord_token, - "Token": api_token - } - }); - const effectsData = await response.json(); - discordProfileEffectsCache = effectsData.profile_effect_configs; - } - - // Find matching profile effect - const matchingEffect = discordProfileEffectsCache.find(effect => effect.id === itemId); - - if (matchingEffect) { - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - previewHolder.classList.add('profile-effect-image'); - - if (isFirstTimeLoadingVariant == true) { - previewHolder.innerHTML = ` - - `; - isFirstTimeLoadingVariant = false; - } else { - previewHolder.innerHTML = ` - - `; - } - - // Hover effect: change to the first effect URL (use 'src' from the 'effects' array) - const imgElement = card.querySelector("img"); - - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - imgElement.src = effectUrl || matchingEffect.thumbnailPreviewSrc; - } - }); - - card.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - card.addEventListener("mouseenter", () => { - imgElement.src = matchingEffect.reducedMotionSrc; - }); - - card.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } - })(); - } - } - - // Apply the default variant (first one) initially - if (product.variants.length > 0) { - applyVariant(product.variants[0]); - } - } else if (product.type === EXTERNAL_SKU) { - card.classList.add("type_3000"); - - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - card.querySelector("[data-product-card-sku-id]").textContent = ``; - } else { - card.querySelector("[data-product-card-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - } - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - - previewHolder.innerHTML = ` -

item type 3000 (EXTERNAL_SKU) is not yet defined on the client, please remove it from the api

- `; - - } else if (product.type === 'plus_more') { - card.querySelector("[data-product-card-sku-id]").textContent = ``; - card.querySelector("[data-product-card-name]").textContent = `Plus More...`; - card.querySelector("[data-product-card-summary]").textContent = `There are more items in this category that are coming soon.`; - - card.querySelector("[data-shop-price-container]").innerHTML = ``; - card.querySelector("[data-product-card-open-in-shop]").innerHTML = ``; - card.querySelector("[data-share-product-card-button]").innerHTML = ``; - - const plusMoreQuestionMark = document.createElement("img"); - plusMoreQuestionMark.src = `https://cdn.discordapp.com/assets/server_products/storefront/question-mark.png`; - plusMoreQuestionMark.classList.add("plus-more-question-mark"); - card.querySelector("[data-shop-card-preview-holder]").appendChild(plusMoreQuestionMark); - - // Hover effect for decoration image - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - plusMoreQuestionMark.src = `https://cdn.discordapp.com/assets/server_products/storefront/question-mark.gif`; - }); - card.addEventListener("mouseleave", () => { - plusMoreQuestionMark.src = `https://cdn.discordapp.com/assets/server_products/storefront/question-mark.png`; - }); - } - } else { - card.classList.add('hidden') - } - - - - if (product.emojiCopy === null) { - card.querySelector("[data-product-card-open-in-shop]").innerHTML = ` - - `; - } else { - card.querySelector("[data-product-card-open-in-shop]").innerHTML = ` - - `; - } - - if (product.premium_type === 2) { - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
- `; - } - - - const unpublishedAt = new Date(product.unpublished_at); - - if (product.unpublished_at && !isNaN(unpublishedAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = unpublishedAt - now; - - if (timeDiff <= 0) { - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

OFF SALE

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${days} DAYS LEFT TO REQUEST

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - - const ExpiredAt = new Date(product.expires_at); - - if (product.expires_at && !isNaN(ExpiredAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = ExpiredAt - now; - - if (timeDiff <= 0) { - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

EXPIRED

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

EXPIRES IN ${days}D ${hours}H

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - const ReleasesAt = new Date(product.releases_at); - - if (product.releases_at && !isNaN(ReleasesAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = ReleasesAt - now; - - if (timeDiff <= 0) { - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

PUBLISHING...

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${days}D ${hours}H

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - // Append card to output - card.classList.add('shop-category-card-transparent') - cardOutput.append(card); - } - } - - categoryOutput.append(category); - - - } else if (page === "consumables") { - // Existing code for 'consumables' page - const potionCard = potionTemplate.content.cloneNode(true).children[0]; - potionCard.querySelector("[data-potion-card-holder]").id = apiCategory.sku_id; - - potionCard.id = apiCategory.sku_id; - - potionCard.querySelector("[data-potion-card-holder]").classList.add('potion-card-gradient1'); - - if (apiCategory.src === null) { - potionCard.querySelector("[data-potion-card-preview-image]").src = `https://cdn.yapper.shop/assets/31.png`; - } else { - potionCard.querySelector("[data-potion-card-preview-image]").src = `https://cdn.yapper.shop/${apiCategory.endpoint}/${apiCategory.src}.${apiCategory.format}`; - } - potionCard.querySelector("[data-potion-card-preview-image]").alt = apiCategory.name; - - if (apiCategory.new_text != null) { - potionCard.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${apiCategory.new_text}

-
- `; - } - - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - potionCard.querySelector("[data-product-card-sku-id]").textContent = ``; - } else { - potionCard.querySelector("[data-product-card-sku-id]").textContent = `SKU ID: ${apiCategory.sku_id}`; - } - potionCard.querySelector("[data-product-card-name]").textContent = apiCategory.name; - potionCard.querySelector("[data-product-card-summary]").textContent = apiCategory.summary; - - let priceStandard = "N/A"; - - if (apiCategory.price) { - priceStandard = apiCategory.price.amount; - } - - - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - potionCard.classList.add('clickable'); - - potionCard.addEventListener("click", () => { - openItemModal(); - }); - - async function openItemModal() { - let modal = document.createElement("div"); - - modal.classList.add('modalv2'); - - if (apiCategory.pdp_bg != null) { - pdp = apiCategory.pdp_bg - } else { - pdp = apiCategory.banner - } - - modal.innerHTML = ` -
-
-

-

-

-
-
- -
-
-
-
-
-
- -
-
- -
-
-
- -
- -
- -
-
-
- `; - - document.body.appendChild(modal); - - setTimeout(() => { - modal.classList.add('show'); - }, 1); - - - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - previewHolder.classList.add('modal-potion-img'); - - const imgElement = document.createElement("img"); - imgElement.classList.add('potion-card-preview'); - imgElement.src = `https://cdn.yapper.shop/${apiCategory.endpoint}/${apiCategory.src}.${apiCategory.format}`; - - previewHolder.appendChild(imgElement); - - // Set the product details - modal.querySelector("[data-product-modal-sku-id]").textContent = `SKU ID: ${apiCategory.sku_id}`; - modal.querySelector("[data-product-modal-name]").textContent = apiCategory.name; - modal.querySelector("[data-product-modal-summary]").textContent = apiCategory.summary; - - - const button_container = document.querySelector("[data-modal-buttons]"); - - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads") { - button_container.innerHTML = ` - - `; - modal.querySelector("[data-download-product-card-button]").innerHTML = ` - - `; - } else if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+") { - button_container.innerHTML = ` - - `; - modal.querySelector("[data-download-product-card-button]").innerHTML = ` - - `; - } else if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - button_container.innerHTML = ` - - `; - modal.querySelector("[data-download-product-card-button]").innerHTML = ` - - `; - } else { - button_container.innerHTML = ` - - `; - } - - - let priceStandard = "N/A"; - - if (apiCategory.price) { - priceStandard = apiCategory.price.amount; - } - - - const priceTextNitro = modal.querySelector("[data-price-nitro]"); - const priceTextStandard = modal.querySelector("[data-price-standard]"); - - const priceContainerNitro = modal.querySelector("[data-price-nitro-container]"); - const priceContainerStandard = modal.querySelector("[data-price-standard-container]"); - - const priceContainer = modal.querySelector("[data-shop-price-container]"); - - if (localStorage.experiment_2025_01_orb_testing === "Treatment 1: Default Prices") { - if (priceTextStandard) { - priceTextStandard.textContent = priceStandard !== "N/A" ? `${priceStandard}` : "Price (USD): N/A"; - } - - let orb_icon = document.createElement("div"); - - orb_icon.classList.add('orb-icon'); - - priceContainerStandard.appendChild(orb_icon); - - } else if (localStorage.experiment_2025_01_orb_testing === "Treatment 2: 50 Orbs") { - if (priceTextStandard) { - priceTextStandard.textContent = `50`; - } - - let orb_icon = document.createElement("div"); - - orb_icon.classList.add('orb-icon'); - - priceContainerStandard.appendChild(orb_icon); - - } else if (localStorage.experiment_2025_01_orb_testing === "Treatment 3: Dynamic") { - - if (apiCategory.price.currency === "discord_orb") { - if (priceTextStandard) { - priceTextStandard.textContent = priceStandard !== "N/A" ? `${priceStandard}` : "Price (USD): N/A"; - } - - let orb_icon = document.createElement("div"); - - orb_icon.classList.add('orb-icon'); - - priceContainerStandard.appendChild(orb_icon); - - } else { - if (priceTextStandard) { - priceTextStandard.textContent = priceStandard !== "N/A" ? `US$${(priceStandard / 100).toFixed(2)}` : "Price (USD): N/A"; - } - } - - } else { - if (priceTextStandard) { - priceTextStandard.textContent = priceStandard !== "N/A" ? `US$${(priceStandard / 100).toFixed(2)}` : "Price (USD): N/A"; - } - } - - if (apiCategory.new_text != null) { - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${apiCategory.new_text}

-
- `; - } - - - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - modal.classList.add('potion-wobble') - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - modal.classList.remove('potion-wobble') - }); - - - - let modal_back = document.createElement("div"); - - modal_back.classList.add('modalv2-back'); - modal_back.id = 'modalv2-back'; - - document.body.appendChild(modal_back); - - setTimeout(() => { - modal_back.classList.add('show'); - }, 1); - - - modal.addEventListener('click', (event) => { - if (event.target === modal) { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - } - }); - - document.querySelector("[data-close-product-card-button]").addEventListener('click', () => { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - }); - } - } - - - const priceTextNitro = potionCard.querySelector("[data-price-nitro]"); - const priceTextStandard = potionCard.querySelector("[data-price-standard]"); - - const priceContainerNitro = potionCard.querySelector("[data-price-nitro-container]"); - const priceContainerStandard = potionCard.querySelector("[data-price-standard-container]"); - - const priceContainer = potionCard.querySelector("[data-shop-price-container]"); - - if (localStorage.experiment_2025_01_orb_testing === "Treatment 1: Default Prices") { - if (priceTextStandard) { - priceTextStandard.textContent = priceStandard !== "N/A" ? `${priceStandard}` : "Price (USD): N/A"; - } - - let orb_icon = document.createElement("div"); - - orb_icon.classList.add('orb-icon'); - - priceContainerStandard.appendChild(orb_icon); - - } else if (localStorage.experiment_2025_01_orb_testing === "Treatment 2: 50 Orbs") { - if (priceTextStandard) { - priceTextStandard.textContent = `50`; - } - - let orb_icon = document.createElement("div"); - - orb_icon.classList.add('orb-icon'); - - priceContainerStandard.appendChild(orb_icon); - - } else { - if (priceTextStandard) { - priceTextStandard.textContent = priceStandard !== "N/A" ? `US$${(priceStandard / 100).toFixed(2)}` : "Price (USD): N/A"; - } - } - - potionCard.querySelector("[data-product-card-open-in-shop]").innerHTML = ` - - `; - - potionCard.addEventListener("mouseenter", () => { - potionCard.classList.add('potion-wobble') - }); - - potionCard.addEventListener("mouseleave", () => { - potionCard.classList.remove('potion-wobble') - }); - - categoryOutput.append(potionCard); - } else { - // Default page handling - const category = categoryTemplate.content.cloneNode(true).children[0]; - category.querySelector("[data-shop-category-banner]").id = apiCategory.sku_id; - - - // Banner Image/Video asset - - if (apiCategory.mobile_banner === null) { - category.querySelector("[data-shop-category-banner-image]").src = `https://cdn.discordapp.com/app-assets/1096190356233670716/${apiCategory.banner}.png?size=4096`; - } else { - category.querySelector("[data-shop-category-banner-image]").src = `https://cdn.discordapp.com/app-assets/1096190356233670716/${apiCategory.mobile_banner}.png?size=4096`; - } - category.querySelector("[data-shop-category-banner-image]").alt = 'No Mobile Banner'; - - if (apiCategory.mobile_bg != null) { - category.querySelector("[data-shop-category-marketing-bg]").src = `https://cdn.discordapp.com/app-assets/1096190356233670716/${apiCategory.mobile_bg}.png?size=4096`; - } - - - category.querySelector("[data-shop-banner-banner-container]").id = `${apiCategory.sku_id}-banner-banner-container`; - - - const unpublishedAt = new Date(apiCategory.unpublished_at); - - if (apiCategory.unpublished_at && !isNaN(unpublishedAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = unpublishedAt - now; - - if (timeDiff <= 0) { - category.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

NOT IN STORE

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - category.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${days} DAYS LEFT IS SHOP

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - - const cardOutput = category.querySelector("[data-shop-category-card-holder]"); - if (cardOutput) { - for (const product of apiCategory.products) { - const cardTemplate = document.querySelector("[data-shop-item-card-template]"); - const card = cardTemplate.content.cloneNode(true).children[0]; - - if (product.type === NONE) { - card.classList.add("type_100"); - card.classList.add('hidden') - } else if (product.type === AVATAR_DECORATION) { - product.items.forEach(item => { - - card.classList.add("type_0"); - // Set the innerHTML for the preview holder - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - previewHolder.classList.add('avatar-decoration-image'); - - // Set the initial image for the deco card - const imgElement = document.createElement("img"); - imgElement.id = "shop-card-deco-image"; - imgElement.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - - previewHolder.appendChild(imgElement); - - const bgimg = document.createElement("div"); - bgimg.id = "shop-card-deco-bg-image"; - - previewHolder.appendChild(bgimg); - - // Set the product details - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - card.querySelector("[data-product-card-sku-id]").textContent = ``; - } else { - card.querySelector("[data-product-card-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - } - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - // Hover effect: Change the image src on mouse enter and leave - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - imgElement.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=true`; - if (localStorage.discord_avatar != defaultAvatar1 && localStorage.discord_avatar != defaultAvatar2 && localStorage.discord_avatar != defaultAvatar3 && localStorage.discord_avatar != defaultAvatar4 && localStorage.discord_avatar != defaultAvatar5 && localStorage.discord_avatar != defaultAvatar6) { - bgimg.style.backgroundImage = `url(${localStorage.discord_avatar})` - } - }); - - card.addEventListener("mouseleave", () => { - imgElement.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - bgimg.style.backgroundImage = `url(data:image/png;base64,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)`; - }); - } - - }); - } else if (product.type === PROFILE_EFFECT) { - card.classList.add("type_1"); - - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - card.querySelector("[data-product-card-sku-id]").textContent = ``; - } else { - card.querySelector("[data-product-card-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - } - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - // Ensure the item ID is accessible here - let itemId = undefined; - if (Array.isArray(product.items)) { - // If items is an array, find the item with type 1 and get its id - const item = product.items.find(item => item.type === 1); - if (item) { - itemId = item.id; - } - } else if (product.items && product.items.type === 1) { - // If items is an object and has type 1, get its id - itemId = product.items.id; - } - - - // Fetch profile effects API only if not already cached - if (!discordProfileEffectsCache) { - const response = await fetch(api + PROFILE_EFFECTS, { - method: "GET", - headers: { - "Password": api_password, - "Authorization": discord_token, - "Token": api_token - } - }); - const effectsData = await response.json(); - discordProfileEffectsCache = effectsData.profile_effect_configs; - } - - // Find matching profile effect - const matchingEffect = discordProfileEffectsCache.find(effect => effect.id === itemId); - - if (matchingEffect) { - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - previewHolder.classList.add('profile-effect-image'); - - previewHolder.innerHTML = ` - - `; - - // Hover effect: change to the first effect URL (use 'src' from the 'effects' array) - const imgElement = card.querySelector("img"); - - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - imgElement.src = effectUrl || matchingEffect.thumbnailPreviewSrc; - } - }); - - card.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - card.addEventListener("mouseenter", () => { - imgElement.src = matchingEffect.reducedMotionSrc; - }); - - card.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } - } else if (product.type === NAMEPLATE) { - card.classList.add("type_2"); - - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - card.querySelector("[data-product-card-sku-id]").textContent = ``; - } else { - card.querySelector("[data-product-card-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - } - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - - if (localStorage.discord_displayname && localStorage.discord_displayname != '') { - previewName = localStorage.discord_displayname; - } else { - previewName = 'Default User' - } - - previewHolder.innerHTML = ` -
-
-
-
-
-
-
-
-
-
-
-
-
- -
-

${previewName}

-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- `; - - product.items.forEach(item => { - const nameplatePreview = previewHolder.querySelector("[data-user-nameplate-preview]"); - const paletteName = item.palette; - const asset = `https://cdn.discordapp.com/assets/collectibles/${item.asset}asset.webm`; - const bgcolor = nameplate_palettes[paletteName].darkBackground; - - const videoElement = previewHolder.querySelector("[data-user-nameplate-preview-img]"); - - videoElement.src = asset; - - nameplatePreview.style.backgroundImage = `linear-gradient(10deg, #00000000 40%, ${bgcolor} 180%), linear-gradient(170deg, #00000000 40%, ${bgcolor} 180%)`; - // nameplatePreview.style.boxShadow = `0 0 0 1px #a10606`; - - const nullUserNameRandomWidth = previewHolder.querySelectorAll("[data-null-user-random-name]"); - - nullUserNameRandomWidth.forEach(UserName => { - const randomWidth = Math.floor(Math.random() * (180 - 80 + 1)) + 80; - UserName.style.width = randomWidth + `px`; - }); - - const nullUserAvatar = previewHolder.querySelectorAll("[data-nameplate-user-random-avatar]"); - - nullUserAvatar.forEach(UserAvatar => { - UserAvatar.style.backgroundImage = `url(${localStorage.discord_avatar})`; - }); - - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - videoElement.play(); - }); - card.addEventListener("mouseleave", () => { - videoElement.pause(); - }); - } - }); - - } else if (product.type === BUNDLE) { - card.classList.add("type_1000"); - // Fetch the bundled products for the bundle summary - const bundledProducts = product.bundled_products || []; - - // Generate the bundle summary from the names of the bundled products - const type0Product = bundledProducts.find(item => item.type === 0); - const type1Product = bundledProducts.find(item => item.type === 1); - - let bundleSummary = "Bundle Includes: "; - if (type0Product) { - bundleSummary += `${type0Product.name} Decoration`; - } - if (type1Product) { - bundleSummary += ` & ${type1Product.name} Profile Effect`; - } - - // Set the summary text - card.querySelector("[data-product-card-summary]").textContent = bundleSummary; - - // Set the basic card details - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - card.querySelector("[data-product-card-sku-id]").textContent = ``; - } else { - card.querySelector("[data-product-card-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - } - card.querySelector("[data-product-card-name]").textContent = product.name; - - // Handle each item in the bundle - product.items.forEach(item => { - if (item.type === 0) { - // Avatar decoration - const decoImage = document.createElement("img"); - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - decoImage.alt = "Avatar Decoration"; - decoImage.classList.add("avatar-decoration-image"); - card.querySelector("[data-shop-card-preview-holder]").appendChild(decoImage); - - const bgimg = document.createElement("div"); - bgimg.classList.add("avatar-decoration-bg-image"); - - card.querySelector("[data-shop-card-preview-holder]").appendChild(bgimg); - - // Hover effect for decoration image - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=true`; - if (localStorage.discord_avatar != defaultAvatar1 && localStorage.discord_avatar != defaultAvatar2 && localStorage.discord_avatar != defaultAvatar3 && localStorage.discord_avatar != defaultAvatar4 && localStorage.discord_avatar != defaultAvatar5 && localStorage.discord_avatar != defaultAvatar6) { - bgimg.style.backgroundImage = `url(${localStorage.discord_avatar})` - } - }); - card.addEventListener("mouseleave", () => { - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - bgimg.style.backgroundImage = `url(data:image/png;base64,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)`; - }); - } - } else if (item.type === 1) { - // Profile effect - (async () => { - // Fetch profile effects if not cached - if (!discordProfileEffectsCache) { - const response = await fetch(api + PROFILE_EFFECTS, { - method: "GET", - headers: { - "Password": api_password, - "Authorization": discord_token, - "Token": api_token - } - }); - const effectsData = await response.json(); - discordProfileEffectsCache = effectsData.profile_effect_configs; - } - - // Find the matching effect - const matchingEffect = discordProfileEffectsCache.find(effect => effect.id === item.id); - - if (matchingEffect) { - const effectImage = document.createElement("img"); - effectImage.src = matchingEffect.thumbnailPreviewSrc; - effectImage.alt = "Profile Effect"; - effectImage.classList.add("profile-effect-image"); - card.querySelector("[data-shop-card-preview-holder]").appendChild(effectImage); - - // Hover effect for profile effect - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects[0] && matchingEffect.effects[0].src) { - effectImage.src = matchingEffect.effects[0].src; - } - }); - card.addEventListener("mouseleave", () => { - effectImage.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - card.addEventListener("mouseenter", () => { - effectImage.src = matchingEffect.reducedMotionSrc; - }); - card.addEventListener("mouseleave", () => { - effectImage.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } - })(); - } - }); - } else if (product.type === VARIANTS_GROUP) { - // Update SKU and summary - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - card.querySelector("[data-product-card-sku-id]").textContent = ``; - } else { - card.querySelector("[data-product-card-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - } - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - // Always display the base variant name - card.querySelector("[data-product-card-name]").textContent = product.variants[0]?.base_variant_name || "Product"; - - // Render variant color blocks as interactive divs - const variantContainer = card.querySelector("[data-shop-card-var-container]"); - variantContainer.innerHTML = ""; // Clear existing variant blocks - let currentSelectedVariant = null; // Track selected variant - - product.variants.forEach((variant, index) => { - // Create variant color block - const variantColorBlockTmp = document.querySelector("[data-shop-varcolorblock-template]"); - const variantColorBlock = variantColorBlockTmp.content.cloneNode(true).children[0]; - variantColorBlock.classList.add("shop-card-var"); - variantColorBlock.id = "shop-card-var"; - variantColorBlock.style.backgroundColor = `${variant.variant_value}`; - - // Add click event listener to switch variants - variantColorBlock.addEventListener("click", () => { - if (currentSelectedVariant) { - currentSelectedVariant.classList.remove("shop-card-var-selected"); - } - variantColorBlock.classList.add("shop-card-var-selected"); - currentSelectedVariant = variantColorBlock; - applyVariant(variant); - }); - - // Append the color block to the container - variantContainer.appendChild(variantColorBlock); - - // Set the first variant as the default selected - if (index === 0) { - currentSelectedVariant = variantColorBlock; - variantColorBlock.classList.add("shop-card-var-selected"); - } - }); - - let isFirstTimeLoadingVariant = true; - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - - // Function to apply the selected variant - function applyVariant(selectedVariant) { - card.querySelector("[data-shop-card-var-title]").textContent = `(${selectedVariant.variant_label})`; - - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - card.querySelector("[data-product-card-sku-id]").textContent = ``; - } else { - card.querySelector("[data-product-card-sku-id]").textContent = `SKU ID: ${selectedVariant.sku_id}`; - } - - if (localStorage.experiment_2025_02_shop_card_modals != "Treatment 1: Enable modals" && localStorage.experiment_2025_02_shop_card_modals != "Treatment 2: Enable modals w/ data downloads" && localStorage.experiment_2025_02_shop_card_modals != "Treatment 3: Enable modals w/ p+" && localStorage.experiment_2025_02_shop_card_modals != "Treatment 4: Enable modals w/ p+ on p+ page" && localStorage.experiment_2025_02_shop_card_modals != "Treatment 5: Enable modals w/ data downloads and p+" && localStorage.experiment_2025_02_shop_card_modals != "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - card.querySelector("[data-share-product-card-button]").innerHTML = ` - - `; - } - - if (selectedVariant.type === 0) { - card.classList.add("type_2000-0"); - previewHolder.innerHTML = ""; // Clear previous decorations - previewHolder.classList.add('avatar-decoration-image'); - - // Add the avatar decoration based on the selected variant - selectedVariant.items?.forEach(item => { - const decoImage = document.createElement("img"); - const bgimg = document.createElement("div"); - if (isFirstTimeLoadingVariant == true) { - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - isFirstTimeLoadingVariant = false; - } else { - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=true`; - if (localStorage.discord_avatar != defaultAvatar1 && localStorage.discord_avatar != defaultAvatar2 && localStorage.discord_avatar != defaultAvatar3 && localStorage.discord_avatar != defaultAvatar4 && localStorage.discord_avatar != defaultAvatar5 && localStorage.discord_avatar != defaultAvatar6) { - bgimg.style.backgroundImage = `url(${localStorage.discord_avatar})` - } - } - decoImage.alt = "Avatar Decoration"; - decoImage.id = "shop-card-deco-image"; - previewHolder.appendChild(decoImage); - - bgimg.id = "shop-card-deco-bg-image"; - - previewHolder.appendChild(bgimg); - - // Hover effect for decoration image - if (localStorage.reduced_motion !== "true") { - card.addEventListener("mouseenter", () => { - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=true`; - if (localStorage.discord_avatar != defaultAvatar1 && localStorage.discord_avatar != defaultAvatar2 && localStorage.discord_avatar != defaultAvatar3 && localStorage.discord_avatar != defaultAvatar4 && localStorage.discord_avatar != defaultAvatar5 && localStorage.discord_avatar != defaultAvatar6) { - bgimg.style.backgroundImage = `url(${localStorage.discord_avatar})` - } - }); - card.addEventListener("mouseleave", () => { - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - bgimg.style.backgroundImage = `url(data:image/png;base64,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)`; - }); - } - }); - } else if (selectedVariant.type === 1) { - card.classList.add("type_2000-1"); - (async () => { - // Ensure the item ID is accessible here - let itemId = undefined; - if (Array.isArray(selectedVariant.items)) { - // If items is an array, find the item with type 1 and get its id - const item = selectedVariant.items.find(item => item.type === 1); - if (item) { - itemId = item.id; - } - } else if (selectedVariant.items && selectedVariant.items.type === 1) { - // If items is an object and has type 1, get its id - itemId = selectedVariant.items.id; - } - - - // Fetch profile effects API only if not already cached - if (!discordProfileEffectsCache) { - const response = await fetch(api + PROFILE_EFFECTS, { - method: "GET", - headers: { - "Password": api_password, - "Authorization": discord_token, - "Token": api_token - } - }); - const effectsData = await response.json(); - discordProfileEffectsCache = effectsData.profile_effect_configs; - } - - // Find matching profile effect - const matchingEffect = discordProfileEffectsCache.find(effect => effect.id === itemId); - - if (matchingEffect) { - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - previewHolder.classList.add('profile-effect-image'); - - if (isFirstTimeLoadingVariant == true) { - previewHolder.innerHTML = ` - - `; - isFirstTimeLoadingVariant = false; - } else { - previewHolder.innerHTML = ` - - `; - } - - // Hover effect: change to the first effect URL (use 'src' from the 'effects' array) - const imgElement = card.querySelector("img"); - - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - imgElement.src = effectUrl || matchingEffect.thumbnailPreviewSrc; - } - }); - - card.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - card.addEventListener("mouseenter", () => { - imgElement.src = matchingEffect.reducedMotionSrc; - }); - - card.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } - })(); - } - } - - // Apply the default variant (first one) initially - if (product.variants.length > 0) { - applyVariant(product.variants[0]); - } - } else if (product.type === EXTERNAL_SKU) { - card.classList.add("type_3000"); - - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - card.querySelector("[data-product-card-sku-id]").textContent = ``; - } else { - card.querySelector("[data-product-card-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - } - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - - previewHolder.innerHTML = ` -

item type 3000 (EXTERNAL_SKU) is not yet defined on the client, please remove it from the api

- `; - - } else if (product.type === 'plus_more') { - card.querySelector("[data-product-card-sku-id]").textContent = ``; - card.querySelector("[data-product-card-name]").textContent = `Plus More...`; - card.querySelector("[data-product-card-summary]").textContent = `There are more items in this category that are coming soon.`; - - card.querySelector("[data-shop-price-container]").innerHTML = ``; - card.querySelector("[data-product-card-open-in-shop]").innerHTML = ``; - card.querySelector("[data-share-product-card-button]").innerHTML = ``; - - const plusMoreQuestionMark = document.createElement("img"); - plusMoreQuestionMark.src = `https://cdn.discordapp.com/assets/server_products/storefront/question-mark.png`; - plusMoreQuestionMark.classList.add("plus-more-question-mark"); - card.querySelector("[data-shop-card-preview-holder]").appendChild(plusMoreQuestionMark); - - // Hover effect for decoration image - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - plusMoreQuestionMark.src = `https://cdn.discordapp.com/assets/server_products/storefront/question-mark.gif`; - }); - card.addEventListener("mouseleave", () => { - plusMoreQuestionMark.src = `https://cdn.discordapp.com/assets/server_products/storefront/question-mark.png`; - }); - } - } else { - card.classList.add('hidden') - } - - - const priceTextNitro = card.querySelector("[data-price-nitro]"); - const priceTextStandard = card.querySelector("[data-price-standard]"); - - const priceContainerNitro = card.querySelector("[data-price-nitro-container]"); - const priceContainerStandard = card.querySelector("[data-price-standard-container]"); - - const priceContainer = card.querySelector("[data-shop-price-container]"); - - let priceStandard = "N/A"; - let priceNitro = "N/A"; - let priceOrb = "N/A"; - - if (localStorage.experiment_2025_02_extra_options === "Treatment 4: Enabled") { - if (localStorage.discord_premium_type === "2") { - if (product.prices && product.prices["4"] && product.prices["4"].country_prices && product.prices["4"].country_prices.prices) { - product.prices["4"].country_prices.prices.forEach(price => { - if (price.currency === "discord_orb") { - priceOrb = price.amount; - } - }); - } - - if (product.prices && product.prices["4"] && product.prices["4"].country_prices && product.prices["4"].country_prices.prices) { - product.prices["4"].country_prices.prices.forEach(price => { - if (price.currency === "usd") { - priceStandard = price.amount; - } - }); - } - - if (priceTextStandard) { - standardPriceOutput = priceStandard !== "N/A" ? `US$${(priceStandard / 100).toFixed(2)}` : "null"; - } - - priceContainerStandard.innerHTML = ` - ${standardPriceOutput} -
- `; - - let orb_price = document.createElement("div"); - - orb_price.innerHTML = ` - ${priceOrb} -
- `; - orb_price.style.position = `absolute`; - orb_price.style.right = `0px`; - - if (priceOrb != 'N/A') { - priceContainer.appendChild(orb_price); - } - } else { - if (product.prices && product.prices["0"] && product.prices["0"].country_prices && product.prices["0"].country_prices.prices) { - product.prices["0"].country_prices.prices.forEach(price => { - if (price.currency === "discord_orb") { - priceOrb = price.amount; - } - }); - } - - if (product.prices && product.prices["0"] && product.prices["0"].country_prices && product.prices["0"].country_prices.prices) { - product.prices["0"].country_prices.prices.forEach(price => { - if (price.currency === "usd") { - priceStandard = price.amount; - } - }); - } - - if (priceTextStandard) { - priceTextStandard.textContent = priceStandard !== "N/A" ? `US$${(priceStandard / 100).toFixed(2)}` : "null"; - } - - let orb_price = document.createElement("div"); - - orb_price.innerHTML = ` - ${priceOrb} -
- `; - orb_price.style.position = `absolute`; - orb_price.style.right = `0px`; - - if (priceOrb != 'N/A') { - priceContainer.appendChild(orb_price); - } - } - - } else { - if (product.prices && product.prices["0"] && product.prices["0"].country_prices && product.prices["0"].country_prices.prices) { - product.prices["0"].country_prices.prices.forEach(price => { - if (price.currency === "usd") { - priceStandard = price.amount; - } - }); - } - - if (product.prices && product.prices["4"] && product.prices["4"].country_prices && product.prices["4"].country_prices.prices) { - product.prices["4"].country_prices.prices.forEach(price => { - if (price.currency === "usd") { - priceNitro = price.amount; - } - }); - } - - if (priceTextStandard) { - priceTextStandard.textContent = priceStandard !== "N/A" ? `US$${(priceStandard / 100).toFixed(2)}` : "null"; - } - - if (priceTextNitro) { - priceTextNitro.textContent = priceNitro !== "N/A" ? `US$${(priceNitro / 100).toFixed(2)} with Nitro` : "null"; - } - } - - if (priceTextStandard.textContent === "null" || priceTextNitro.textContent === "null") { - let error_warning = document.createElement("div"); - - error_warning.classList.add('card_error'); - error_warning.innerHTML = ` -

ERROR

- `; - - card.appendChild(error_warning); - } - - card.querySelector("[data-product-card-open-in-shop]").innerHTML = ` - - `; - - if (product.premium_type === 2) { - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
- `; - } - - card.querySelector("[data-share-product-card-button]").innerHTML = ` - - `; - - - const unpublishedAt = new Date(product.unpublished_at); - - if (product.unpublished_at && !isNaN(unpublishedAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = unpublishedAt - now; - - if (timeDiff <= 0) { - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

OFF SALE

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${days} DAYS LEFT IN SHOP

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - const ExpiredAt = new Date(product.expires_at); - - if (product.expires_at && !isNaN(ExpiredAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = ExpiredAt - now; - - if (timeDiff <= 0) { - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

EXPIRED

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

EXPIRES IN ${days}D ${hours}H

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - // Append card to output - cardOutput.append(card); - } - } - - categoryOutput.append(category); - } - } - } - }) - .catch(error => { - console.error('Error fetching the API:', error); - document.getElementById("everything-housing-container").innerHTML = ` -
- -

Well, this is awkward.

-

Hmmm, we weren’t able to load the shop. Check back later.

-

${error}

- -
- `; - }); - - } - } - - fetchData() - - - function createMainShopElement() { - document.getElementById("everything-housing-container").innerHTML = ` -
-
- - - -
-
-
-
-
-
- `; - } - - - - } -} else if (localStorage.full_client_rework != "false") { - - experimentsList.forEach(({ name, rollout }) => { - try { - if (localStorage.experiment_force_rollout != "false") { - localStorage.setItem(name, rollout); - } else if (localStorage.getItem(name) == null) { - localStorage.setItem(name, rollout); - } - - } catch (error) { - console.error(`Error setting up experiment: ${name}`, error); - } - }); - - function clearSetExperiment(experimentName) { - const experiment = experimentsList.find(exp => exp.name === experimentName); - - if (!experiment) { - console.warn(`Experiment "${experimentName}" not found.`); - return; - } - - const { rollout } = experiment; - const treatmentPicker = document.getElementById(`${experimentName}_treatment_container`); - - if (treatmentPicker) { - treatmentPicker.value = rollout; - localStorage.setItem(experimentName, rollout); - } - } - - sessionStorage.setItem('api-token', 'token'); - - const api_password = localStorage.getItem("api-password"); - const discord_token = localStorage.getItem("discord_token"); - const shop_archives_token = localStorage.getItem("shop_archives_token"); - const api_token = sessionStorage.getItem("api-token"); - - // api = 'https://raw.githubusercontent.com/Yappering/api/main/v2'; - api = 'https://api.yapper.shop/v2'; - prvapi = 'https://raw.githubusercontent.com/Yappering/private-api/refs/heads/main/v2'; - discordsupport = 'https://support.discord.com/hc/en-us/articles/'; - discordblog = 'https://discord.com/blog/'; - apidesignedurl = 'https://api.yapper.shop/v2'; - yapperblog = 'https://yapper.shop/blog/'; - yappersupport = 'https://support.yapper.shop/?page='; - cdn = 'https://cdn.yapper.shop/'; - tmpapi = 'https://api.yapper.shop/tmp'; - - function privateAPICheck() { - // if (localStorage.force_all_api_to_fectch_private_api == "true") { - // api = prvapi; - // tmpapi = 'https://raw.githubusercontent.com/Yappering/api/main/tmp'; - // } else if (localStorage.api_designed_url != "false") { - // api = apidesignedurl; - // } else { - // api = 'https://raw.githubusercontent.com/Yappering/api/main/v2'; - // tmpapi = 'https://raw.githubusercontent.com/Yappering/api/main/tmp'; - // } - } - - - endpoints = [ - DOWNLOADABLE_DATA = "/downloads", - COLLECTIBLES_SHOP = "/collectibles-shop", - PROFILE_EFFECTS = "/profile-effects", - COMMUNITY = "/community", - APISTATUS = "/status", - REVIEWSAPI = "/reviews", - CLAIMABLES_SHOP = "/claimables-shop", - XP_BALANCE = "/users/@me/xp-balance", - CLAIMABLES_CLAIMED = "/users/@me/claimables-claimed", - CLAIMABLES_PROMOTIONS = "/users/@me/claimables-promotions", - REDEEM_GIFT_CODE = "/redeem-gift-code/" - ] - if (app_version2 === "Dev") { - LOGIN_CALLBACK = "/dev/callback" - } else { - LOGIN_CALLBACK = "/callback" - } - - const CUSTOM_EMOJIS = { - ":thing:": "https://cdn.discordapp.com/emojis/1322807908471275561.webp?size=24", - ":yapping_head:": "https://cdn.discordapp.com/emojis/1243471467392274544.webp?size=24", - ":no_yapping:": "https://cdn.discordapp.com/emojis/1280620352338264207.webp?size=24" - }; - - - yapper_categories = [ - WINDOWKILL = "1", - BOPL_BATTLE = "7", - PAPER_BEACH = "20", - WINDOWKILL_V2 = "35", - FIVE_NIGHTS_AT_FREDDYS = "54", - PLUS_SPECIAL_EVENT = "55", - GEOMETRY_DASH = "68", - PAPER_BEACH_V2 = "77", - RBXDOORS = "82", - DATA_EXTRACTION_PROCESS = "85", - HOAX = "86" - ] - - claimable_types = { - REWARD: 0, - PURCHASE: 1 - }; - - discord_categories = { - FANTASY: "1144003461608906824", - ANIME: "1144302037593497701", - BREAKFAST: "1144054000099012659", - DISXCORE: "1144058340327047249", - FALL: "1157406994873991284", - HALLOWEEN: "1157410718711304313", - WINTER: "1174459301239197856", - MONSTERS: "1179493515038818325", - CYBERPUNK: "1197342727608746044", - LUNAR_NEW_YEAR: "1202069709281828935", - ELEMENTS: "1207046915880124426", - ANIME_V2: "1212565175790473246", - SPECIAL_EVENTS: "1217175518781243583", - SPECIAL_EVENTS_2: "1309309974266118144", - SPRINGTOONS: "1217622942175727736", - SHY: "1220513972189663413", - LOFI_VIBES: "1228243842684162121", - GALAXY: "1232029045928099922", - FEELIN_RETRO: "1237649643073044491", - PIRATES: "1237653589896200272", - ARCADE: "1245086656973901894", - TIDE: "1252404112650407998", - DARK_FANTASY: "1256321669388308595", - ROBERT: "1262491137386614805", - STORM: "1265375293397270650", - DOJO: "1266520267946201099", - THE_VAULT: "1277733175191277721", - AUTUMN_EQUINOX: "1282816432056569866", - BAND: "1285465421339693076", - SPOOKY_NIGHT: "1287835634089594972", - CHANCE: "1293373563494993952", - MYTHICAL_CREATURES: "1298033986811068497", - WARRIOR: "1303490165284802580", - KAWAII_MODE: "1306330663213072494", - LOFI_GIRL: "1309668861943218229", - WINTER_WONDERLAND: "1314020997204283476", - FANTASY_V2: "1324454241254903829", - STEAMPUNK: "1326333074241486859", - PROGRESS: "1333278032999485461", - RADIATE: "1336483992429658112", - VALENTINES: "1333866045521395723", - ORB: "1332505418219655258", - ANIME_V3: "1341506445249609728", - INSOMNIA: "1343751621364027462", - NAMEPLATE_TEST: "1344802365307621427", - AESPA: "1346499610977243196", - NAMEPLATE: "1349849614353829990", - HOLIDAYS: "1349486948942745691", - SHENANIGANS: "1352407446500675708", - CHIBI_CAFE: "1354894010849820852", - GGEZ: "1357589632723849316", - HELLO: "1365410896222097539", - COZY_VALLEY: "1369434230962262128", - RC_TEST: "1370467303782617118", - LEAF: "1373015260595884082" - }; - - discord_app_ids = { - COLLECTIBLES_SHOP: "1096190356233670716", - SHOP_ARCHIVES: "1342635740768501886" - }; - - external_skus = [ - NITRO_CREDITS_3_DAYS = "1333912750274904064", - ORB_PROFILE_BADGE = "1342211853484429445" - ] - - category_types = [ - HERO = 0, - FEATURED = 1, - FEED = 2, - WIDE_BANNER = 3 - ] - - item_types = { - NONE: 100, - AVATAR_DECORATION: 0, - PROFILE_EFFECT: 1, - NAMEPLATE: 2, - BUNDLE: 1e3, - VARIANTS_GROUP: 2e3, - EXTERNAL_SKU: 3e3 - } - - const nameplate_palettes = { - crimson: { - "darkBackground": "#900007", - "lightBackground": "#E7040F" - }, - berry: { - "darkBackground": "#893A99", - "lightBackground": "#B11FCF" - }, - sky: { - "darkBackground": "#0080B7", - "lightBackground": "#56CCFF" - }, - teal: { - "darkBackground": "#086460", - "lightBackground": "#7DEED7" - }, - forest: { - "darkBackground": "#2D5401", - "lightBackground": "#6AA624" - }, - bubble_gum: { - "darkBackground": "#DC3E97", - "lightBackground": "#F957B3" - }, - violet: { - "darkBackground": "#730BC8", - "lightBackground": "#972FED" - }, - cobalt: { - "darkBackground": "#0131C2", - "lightBackground": "#4278FF" - }, - clover: { - "darkBackground": "#047B20", - "lightBackground": "#63CD5A" - } - } - - - HELP_AVATAR_DECORATIONS = "13410113109911" - HELP_SHOP = "17162747936663" - HELP_PROFILE_EFFECTS = "17828465914263" - HELP_HD_STREAMING_POTION = "27343254089623" - HELP_CONFETTI_POTION = "29133681590679" - - - BLOG_AVATAR_DECORATIONS_PROFILE_EFFECTS = "avatar-decorations-collect-and-keep-the-newest-styles" - - - YAPPER_BLOG_2024_RECAP = "2024-recap" - YAPPER_BLOG_2025_RECAP = "2025-recap" - - - DISMISSIBLE_2024_RECAP = "assets/103.svg" - DISMISSIBLE_2025_RECAP = "assets/160.png" - - - m = ["1329609528441831537", "1329609528471195659", "1329609528492429332", "1329609528504746075", "1329609528525979658", "1329609528546693170", "1329609528571858975", "1329611507381829702", "1329611507402801312"]; - g = new Date('2025-01-31'); - newColorsSKUIDS = ["1144308439720394944", "1154896005045694555", "1144307257807491094", "1144305233707671573", "1144307629225672846", "1144308196723408958", "1144307957425778779", "1212569856189407352", "1212570343567261736", "1212570596970467378", "1212581390936178768", "1212569433839636530", "1212581147675205652", "1139323101881061466", "1139323093551165533", "1139323101008642101", "1212582298893946880", "1212582372877541427", "1212582452640350238", "1139323100568244355"]; - newColorsExpireDate = new Date('2025-03-08'); - N = new Date(); - I = ["1212569433839636530", "1144308439720394944", "1314020996201713685", "1212570343567261736", "1314020996776329279", "1271174640026255380", "1271175049168031815", "1232073608168472638", "1293373563407175680", "1314020996327542894", "1139323093991575696", "1232071157746765906", "1232071712695386162", "1144307957425778779", "1306330662990643252", "1280621222496964630", "1306330663015809024", "1306330663070334996", "1243617249974288404", "1309668861578186803", "1303490165213237338", "1306330662898372639", "1298033986508951685", "1282816432026943488", "1306330663137443991", "1197344764174008452", "1298033986727055370", "1298033986571866112", "1271175120437641261", "1314020996361093171", "1309668861645426729", "1256321669467865088", "1314020996864413717", "1306752744278982737", "1271174732577767626", "1144307257807491094", "1144308196723408958", "1287835633787732070", "1306330663162609685", "1306330662940311726", "1309668861901279422", "1282816431871754281", "1287835633485877369", "1228234634379132958", "1144305233707671573", "1298033986643169360", "1139323093551165533", "1212569856189407352", "1282816431850782730", "1144307629225672846", "1232070870093008937", "1207047014769234001", "1212582298893946880", "1232073286582538261", "1282816431985004594", "1293373563381878836", "1282816431964028958", "1306752744258011166", "1309668861846753372", "1271174324375519273", "1256321669426053198", "1287835633615765524", "1286504131325853739", "1306330663183581247", "1139323099687436419", "1287835633590734848", "1256321669493166214", "1286504131518791816", "1243620093431119922", "1262492035558932604", "1306330662927859723", "1197344326133502032", "1228251351415263242", "1232073448415821854", "1158572178179108968", "1298033986752221204", "1262491137394868311", "1309668861620260874", "1271174241860980907", "1220513989729976411", "1282820582408192061", "1154896005045694555", "1207047597294886923", "1306330663036780695", "1309668861674786877", "1197344693630009424", "1306330662965477478", "1174460780842856588", "1271174907081789524", "1282816431813169272", "1298033986622328842", "1139323101881061466", "1262491690900656267", "1303490165171294268", "1139323100568244355", "1243619479645065287", "1262491690971955284", "1316087100260483174", "1139323101008642101", "1228251144065777765", "1207048289610899526", "1287835633561239683", "1232072121950146560", "1303490165045727317", "1228246010116050965", "1309668861871919316", "1207049364464345158", "1243618816639107223", "1265421074514841751", "1316087100277395607", "1159280677246742548", "1262492035558932607", "1207047808838799410", "1306752744299954306", "1298033986668335135", "1266160780928352268", "1262491137386614812", "1139323092645183591", "1220513977683935373", "1256321669467865091", "1237654942202990602", "1287835633536209079", "1262491137394868305", "1256321669493166217", "1212582452640350238", "1158572275507937342", "1306752744228524052", "1174459546748600481", "1262491137394868308", "1309668861599285249", "1262492035558932610", "1144046002110738634", "1293373563184877618", "1298033986693500960", "1285465421260263464", "1306330663091306608", "1287835633645125653", "1303490165074825296", "1298033986538569781", "1303490165150322698", "1262491690900656261", "1256321669467865094", "1207048656289534022", "1285681070196396177", "1287835633674620949", "1237654224712765440", "1293373563121696891", "1303490165255180298", "1303490165120962651", "1212582372877541427", "1287835634005970994", "1303490165099991143", "1271564593746939904", "1314020996629532686", "1316087100260483176", "1228233390260486164", "1287835633867559022", "1158572263411556373", "1303490165192265799", "1237654783209508904", "1309668861704146984", "1212581147675205652", "1309668861548957738", "1245088205330710539", "1287835633896783952", "1316087100260483178", "1139323099251232828", "1262491690900656258", "1232072859485208687", "1197344396983664670", "1309668861788033074", "1314020996600172554", "1159280847262859364", "1314020996461760542", "1220514048068812901", "1293373563302318110", "1228251846032756796", "1197344636558114986", "1282820582223642624", "1287835634035331072", "1298033986777387059", "1243619781362450442", "1282816432001777794", "1212570596970467378", "1157409074422481023", "1256321669426053195", "1146328961417224193", "1293373563327483984", "1303490165234208810", "1266160780978556969", "1228237157554978817", "1287835633947115570", "1282820582345408595", "1271174810227179562", "1282816431830077542", "1287835633842258022", "1283211414323990538", "1282820582303334482", "1282820582429298748", "1306330663116472371", "1157407831348228141", "1293373563210043442", "1287835633515102228", "1309668861758672997", "1287835633703845888", "1287835633733341224", "1197344575832981605", "1316087100260483180", "1237653964582031400", "1287835633817227297", "1266493591207940133", "1309668861817393263", "1316087100260483182", "1298033986555351132", "1237650542772228096", "1207049498065375343", "1287835633980669972", "1314020996516286485", "1285465421193154560", "1268362891946627103", "1282820582244880496", "1293373563352649961", "1220432740638523543", "1243620329331626044", "1220432697718083614", "1267521289330102344", "1146328960951668776", "1293373563457507463", "1245088094437507163", "1262491690900656264", "1314020996432400404", "1220513984273186816", "1293373563159449653", "1314020996721803306", "1285681070196396179", "1285465421050548345", "1282820582366511229", "1256321669467865097", "1285465421285429258", "1293373563239272458", "1271174154514595891", "1217625794382401577", "1228252219502100530", "1285465421029576704", "1243618548673417298", "1220432647453409384", "1266493591275044903", "1217626024540508170", "1232072520249643028", "1245088254647205991", "1237654867330469949", "1314020996570812506", "1314020996227006484", "1245087968759382207", "1144006094134456352", "1314020997166403624", "1144048390594908212", "1287835633762701382", "1212581390936178768", "1285465420995756065", "1217626509737459852", "1314020996491116575", "1309668861729312898", "1237650411410685972", "1245087661316898877", "1217627230818009171", "1256321669388308601", "1314020996310896672", "1274105879238676561", "1293373563432341574", "1314020996273016863", "1282816431943057460", "1220513995308400680", "1293373563264569416", "1228252042791878707", "1314020997078323200", "1237654031732703272", "1267521289355268154", "1298033986592837754", "1285465421214126100", "1245087724265013299", "1314020996990242816", "1314020996663087154", "1282820582282629171", "1282816431922085888", "1314020997107683411", "1237654124443734026", "1314020997137043578", "1266161342801383434", "1285465421096685639", "1237654692985700352", "1174459480348565554", "1314020997019602984", "1314020996252176444", "1144003752978829455", "1282816431901118474", "1285465421306400858", "1285465421239291904", "1285465420979245087", "1314020996692447234", "1144048977138946230", "1217627051217911848", "1217626219651006495", "1217625572168044604", "1286504131392962641", "1237650618777075712", "1207048049571139584", "1314020996289921154", "1237654615474962472", "1314020996927328276", "1286504131439366184", "1285465421016862730", "1217625289681801316", "1243619153688920206", "1217624148080332820", "1144049316009353338", "1245481938202918912", "1245088023452975104", "1314020996960882789", "1285465421121851445", "1243617981435478102", "1144049603109470370", "1285465421071519825", "1256321669426053192", "1245087912350187520", "1207049115339591681", "1144049924397334651", "1237649939027333232", "1237650103980920872", "1237650023794081823", "1237650179721527347", "1245087850177888356", "1285465421167988758", "1277733174797008931"]; - - async function setDiscordProfileEffectCache() { - url = api + PROFILE_EFFECTS; - pfxapiUrl = new URL(url); - pfxapiUrl.searchParams.append("tab", "discord"); - const response = await fetch(pfxapiUrl, { - method: "GET", - headers: { - "Password": api_password, - "Authorization": discord_token, - "Token": api_token - } - }); - const effectsData = await response.json(); - discordProfileEffectsCache = effectsData.profile_effect_configs; - } - - setDiscordProfileEffectCache() - - async function setPplusProfileEffectCache() { - url = api + PROFILE_EFFECTS; - pfxapiUrl = new URL(url); - pfxapiUrl.searchParams.append("tab", "pplus"); - const response = await fetch(pfxapiUrl, { - method: "GET", - headers: { - "Password": api_password, - "Authorization": discord_token, - "Token": api_token - } - }); - const effectsData = await response.json(); - pplusProfileEffectsCache = effectsData.profile_effect_configs; - } - - setPplusProfileEffectCache() - - async function setCommunityThemesCache() { - url = api + COMMUNITY; - communityapiUrl = new URL(url); - communityapiUrl.searchParams.append("tab", "themes"); - if (localStorage.staff_unpublished_community_features == "true") { - communityapiUrl.searchParams.append("include-unpublished", "true"); - } - const response = await fetch(communityapiUrl, { - method: "GET", - headers: { - "Password": api_password, - "Authorization": discord_token, - "Token": api_token - } - }); - const themesData = await response.json(); - communityThemesCache = themesData; - } - - setCommunityThemesCache() - - if (!atMeUsercache && shop_archives_token) { - fetch(api + `/users/@me`, { - method: "GET", - headers: { - "Authorization": shop_archives_token - } - }) - .then(response => response.json()) - .then((data) => { - atMeUsercache = data; - localStorage.admin_level = data.admin_level; - - if (Array.isArray(data.rollouts)) { - data.rollouts.forEach(rollout => { - - if (localStorage.experiment_force_rollout != "false") { - localStorage.setItem(rollout.name, rollout.rollout); - } - - }); - } - - if (localStorage.experiment_2025_05_xp_system === "Treatment 1: Enabled" && localStorage.dismissible_new100FreeXP != "Treatment 1: Seen" && data.claimed_100_free_xp === false) { - let new100FreeXPDismissible = document.createElement("div"); - - new100FreeXPDismissible.innerHTML = ` -
-
- -
-

${getTextString("DISMISSIBLE_CONTENT_NEW_CLAIM_100_XP_MODAL_TITLE")}

-
-

${getTextString("DISMISSIBLE_CONTENT_NEW_CLAIM_100_XP_MODAL_SUMMARY_1")}

-
- - -
-
- `; - - new100FreeXPDismissible.classList.add('new100FreeXPDismissible'); - - new100FreeXPDismissible.id = `new100FreeXPDismissible`; - - document.body.appendChild(new100FreeXPDismissible); - - } - - }) - .catch(error => { - console.error(error); - }); - } - - async function checkIfValidDiscordToken() { - if (localStorage.discord_token && !localStorage.discord_profile || localStorage.discord_token && !localStorage.discord_user_id) { - try { - if (localStorage.discord_token && !localStorage.discord_profile || localStorage.discord_token && !localStorage.discord_user_id) { - const userInfo = await fetch('https://discord.com/api/users/@me', { - headers: { Authorization: `Bearer ${localStorage.discord_token}` } - }); - - if (!userInfo.ok) { - // If the response is not ok (e.g., 401 Unauthorized) - setParams({ page: 'home', login: 'false' }); - actuallyLogOutOfDiscord(); - return; - } - - const user = await userInfo.json(); - localStorage.discord_profile = JSON.stringify(user, undefined, 4); - localStorage.discord_avatar = `https://cdn.discordapp.com/avatars/${user.id}/${user.avatar}.webp?size=4096`; - localStorage.discord_username = user.username; - localStorage.discord_user_id = user.id; - if (user.global_name != null) { - localStorage.discord_displayname = user.global_name; - } else { - localStorage.discord_displayname = user.username; - } - localStorage.discord_banner_color = user.banner_color; - localStorage.discord_premium_type = user.premium_type; - - if (user.banner != null) { - localStorage.discord_banner = `https://cdn.discordapp.com/banners/${user.id}/${user.banner}.png?size=4096`; - } else { - localStorage.removeItem('discord_banner'); - } - - console.log('success'); - setParams({ page: 'home', login: 'true' }); - location.reload(); - } - - // Optional: additional check (but `localStorage.discord_profile` is a string, so this check won't work unless parsed) - const parsedProfile = JSON.parse(localStorage.discord_profile); - if (parsedProfile.code === 0) { - setParams({ page: 'home', login: 'false' }); - actuallyLogOutOfDiscord(); - } - - } catch (error) { - setParams({ page: 'home', login: 'false' }); - actuallyLogOutOfDiscord(); - } - } - } - - const params = new URLSearchParams(window.location.search); - - function setParams(params) { - const url = new URL(window.location); - - // Clear all existing query parameters - url.search = ''; - - // Set the new query parameters from the provided object - Object.entries(params).forEach(([key, value]) => { - url.searchParams.set(key, value); - }); - - // Update the address bar without reloading the page - history.replaceState(null, '', url); - } - - function addParams(params) { - const url = new URL(window.location); - - Object.entries(params).forEach(([key, value]) => { - url.searchParams.set(key, value); - }); - - history.replaceState(null, '', url); - } - - function removeParams(params) { - const url = new URL(window.location); - - // Convert params to an array if a single key is passed as a string - if (!Array.isArray(params)) { - params = [params]; - } - - // Remove each specified key from the URL parameters - params.forEach(key => url.searchParams.delete(key)); - - // Update the URL without reloading the page - history.replaceState(null, '', url); - } - - // Function to clear the shop data - function clearShopData() { - const output = document.querySelector("[data-shop-output]"); - output.innerHTML = ''; // Clears the content of the shop category - if (params.get("page") === "consumables") { - createPotionsCategoryLoadingElement() - } else if (params.get("page") === "marketing") { - createMarketingCategoryLoadingElement() - } else { - createShopCategoryLoadingElement() - } - } - - if (localStorage.experiment_2025_05_account_creator != "Treatment 1: Enabled") { - checkIfValidDiscordToken(); - } else if (params.get("page") != "login" && localStorage.discord_token && !localStorage.discord_profile) { - console.log("hoax????") - actuallyLogOutOfDiscord(); - } - - // Function to fetch and display shop data - function fetchData() { - if (params.get("page") === "home" || params.get("page") === "orbs" && localStorage.experiment_2025_05_orbs_shop_home === "Treatment 1: Enabled") { - - fetchFirstHomeData(); - - function fetchFirstHomeData() { - - fetch(apiUrl, { - method: "GET", - headers: { - "Password": api_password, - "Authorization": discord_token, - "Token": api_token - } - }) - .then(response => response.json()) - .then(data => { - if (data.message === "Missing Access") { - document.getElementById("everything-housing-container").innerHTML = ` -
- -

${getTextString("SHOP_NOT_LOAD_ERROR_1")}

-

${getTextString("SHOP_NOT_LOAD_ERROR_2")}

-

${getTextString("SHOP_NOT_LOAD_ERROR")}${data.message}

- -
- `; - } else { - data.forEach(apiCategory => { - async function processCategories() { - const output = document.querySelector("[data-shop-output]"); - const output0 = document.querySelector("[data-shop-0-output]"); - if (apiCategory.type === HERO) { - const template = document.querySelector("[data-shop-category-template]"); - - const category = template.content.cloneNode(true).children[0]; - - if (apiCategory.hero_banner_asset) { - if (apiCategory.hero_banner_asset.animated != null) { - if (apiCategory.hero_banner_asset.static != null) { - category.querySelector("[data-shop-banner-banner-container]").innerHTML = ` - - - `; - } else { - category.querySelector("[data-shop-banner-banner-container]").innerHTML = ` - - - `; - } - } else if (apiCategory.hero_banner_asset.static != null) { - category.querySelector("[data-shop-category-banner-image]").src = `${apiCategory.hero_banner_asset.static}`; - } - } else if (apiCategory.hero_banner != null) { - category.querySelector("[data-shop-category-banner-image]").src = `https://cdn.discordapp.com/app-assets/1096190356233670716/${apiCategory.hero_banner}.png?size=4096`; - category.querySelector("[data-shop-category-banner-image]").alt = apiCategory.name; - } else { - category.querySelector("[data-shop-category-banner-image]").src = `https://cdn.discordapp.com/app-assets/1096190356233670716/${apiCategory.banner}.png?size=4096`; - category.querySelector("[data-shop-category-banner-image]").alt = apiCategory.name; - } - - - if (apiCategory.hero_logo != null) { - category.querySelector("[data-shop-category-logo-image]").src = `https://cdn.discordapp.com/app-assets/1096190356233670716/${apiCategory.hero_logo}.png?size=4096`; - } else if (apiCategory.logo != null) { - category.querySelector("[data-shop-category-logo-image]").src = `https://cdn.discordapp.com/app-assets/1096190356233670716/${apiCategory.logo}.png?size=4096`; - } else { - category.querySelector("[data-shop-category-logo-image]").src = `https://cdn.yapper.shop/assets/31.png`; - } - category.querySelector("[data-shop-category-logo-image]").alt = apiCategory.name; - - if (apiCategory.sku_id === discord_categories.ORB) { - category.querySelector("[data-shop-banner-banner-container]").style.backgroundImage = 'linear-gradient(to bottom,rgba(39, 30, 173, 0.3) 60%,rgba(0, 0, 0, 0)80%)'; - } - - category.querySelector("[data-shop-category-desc]").id = `${apiCategory.sku_id}-summary`; - category.querySelector("[data-shop-category-desc]").textContent = apiCategory.summary; - - category.querySelector("[data-preview-banner-container]").id = apiCategory.sku_id; - category.querySelector("[data-shop-banner-banner-container]").id = `${apiCategory.sku_id}-preview-banner-container`; - - if (apiCategory.leaks_type) { - category.querySelector("[data-preview-new-categoey-button]").innerHTML = ` - - `; - } else { - category.querySelector("[data-preview-new-categoey-button]").innerHTML = ` - - `; - } - - const cardOutput = category.querySelector("[data-shop-category-card-holder]"); - if (cardOutput) { - for (const product of apiCategory.products) { - const cardTemplate = document.querySelector("[data-shop-item-card-template]"); - const card = cardTemplate.content.cloneNode(true).children[0]; - - card.id = product.sku_id; - - if (product.type === item_types.NONE) { - card.classList.add("type_100"); - card.classList.add('hidden') - } else if (product.type === item_types.AVATAR_DECORATION) { - product.items.forEach(item => { - - card.classList.add("type_0"); - // Set the innerHTML for the preview holder - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - previewHolder.classList.add('avatar-decoration-image'); - - // Set the initial image for the deco card - const imgElement = document.createElement("img"); - imgElement.id = "shop-card-deco-image"; - imgElement.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - - previewHolder.appendChild(imgElement); - - const bgimg = document.createElement("div"); - bgimg.id = "shop-card-deco-bg-image"; - - previewHolder.appendChild(bgimg); - - // Set the product details - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - card.querySelector("[data-product-card-sku-id]").textContent = ``; - } else { - card.querySelector("[data-product-card-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - } - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - // Hover effect: Change the image src on mouse enter and leave - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - imgElement.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=true`; - if (localStorage.discord_avatar != defaultAvatar1 && localStorage.discord_avatar != defaultAvatar2 && localStorage.discord_avatar != defaultAvatar3 && localStorage.discord_avatar != defaultAvatar4 && localStorage.discord_avatar != defaultAvatar5 && localStorage.discord_avatar != defaultAvatar6) { - bgimg.style.backgroundImage = `url(${localStorage.discord_avatar})` - } - }); - - card.addEventListener("mouseleave", () => { - imgElement.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - bgimg.style.backgroundImage = `url(data:image/png;base64,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)`; - }); - } - - }); - } else if (product.type === item_types.PROFILE_EFFECT) { - card.classList.add("type_1"); - - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - card.querySelector("[data-product-card-sku-id]").textContent = ``; - } else { - card.querySelector("[data-product-card-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - } - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - // Ensure the item ID is accessible here - let itemId = undefined; - if (Array.isArray(product.items)) { - // If items is an array, find the item with type 1 and get its id - const item = product.items.find(item => item.type === 1); - if (item) { - itemId = item.id; - } - } else if (product.items && product.items.type === 1) { - // If items is an object and has type 1, get its id - itemId = product.items.id; - } - - - if (!discordProfileEffectsCache) { - await setDiscordProfileEffectCache(); - } - - // Find matching profile effect - const matchingEffect = discordProfileEffectsCache.find(effect => effect.id === itemId); - - if (matchingEffect) { - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - previewHolder.classList.add('profile-effect-image'); - - previewHolder.innerHTML = ` - - `; - - // Hover effect: change to the first effect URL (use 'src' from the 'effects' array) - const imgElement = card.querySelector("img"); - - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - imgElement.src = effectUrl || matchingEffect.thumbnailPreviewSrc; - } - }); - - card.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - card.addEventListener("mouseenter", () => { - imgElement.src = matchingEffect.reducedMotionSrc; - }); - - card.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } - } else if (product.type === item_types.NAMEPLATE) { - card.classList.add("type_2"); - - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - card.querySelector("[data-product-card-sku-id]").textContent = ``; - } else { - card.querySelector("[data-product-card-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - } - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - - if (localStorage.discord_displayname && localStorage.discord_displayname != '') { - previewName = localStorage.discord_displayname; - } else { - previewName = 'Default User' - } - - previewHolder.innerHTML = ` -
-
-
-
-
-
-
-
-
-
-
-
-
- -
-

${previewName}

-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- `; - - product.items.forEach(item => { - const nameplatePreview = previewHolder.querySelector("[data-user-nameplate-preview]"); - const paletteName = item.palette; - const asset = `https://cdn.discordapp.com/assets/collectibles/${item.asset}asset.webm`; - const bgcolor = nameplate_palettes[paletteName].darkBackground; - - const videoElement = previewHolder.querySelector("[data-user-nameplate-preview-img]"); - - videoElement.src = asset; - - nameplatePreview.style.backgroundImage = `linear-gradient(90deg, #00000000 -30%, ${bgcolor} 200%)`; - // nameplatePreview.style.boxShadow = `0 0 0 1px #a10606`; - - const nullUserNameRandomWidth = previewHolder.querySelectorAll("[data-null-user-random-name]"); - - nullUserNameRandomWidth.forEach(UserName => { - const randomWidth = Math.floor(Math.random() * (180 - 80 + 1)) + 80; - UserName.style.width = randomWidth + `px`; - }); - - const nullUserAvatar = previewHolder.querySelectorAll("[data-nameplate-user-random-avatar]"); - - nullUserAvatar.forEach(UserAvatar => { - UserAvatar.style.backgroundImage = `url(${localStorage.discord_avatar})`; - }); - - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - videoElement.play(); - }); - card.addEventListener("mouseleave", () => { - videoElement.pause(); - }); - } - }); - - } else if (product.type === item_types.BUNDLE) { - card.classList.add("type_1000"); - // Fetch the bundled products for the bundle summary - const bundledProducts = product.bundled_products || []; - - // Generate the bundle summary from the names of the bundled products - const type0Product = bundledProducts.find(item => item.type === 0); - const type1Product = bundledProducts.find(item => item.type === 1); - - let bundleSummary = `${getTextString("CARD_TYPE_BUNDLE_TITLE")}`; - if (type0Product) { - bundleSummary += `${type0Product.name}${getTextString("CARD_TYPE_BUNDLE_TITLE_DECO")}`; - } - if (type1Product) { - bundleSummary += `${type1Product.name}${getTextString("CARD_TYPE_BUNDLE_TITLE_EFFECT")}`; - } - - // Set the summary text - card.querySelector("[data-product-card-summary]").textContent = bundleSummary; - - // Set the basic card details - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - card.querySelector("[data-product-card-sku-id]").textContent = ``; - } else { - card.querySelector("[data-product-card-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - } - card.querySelector("[data-product-card-name]").textContent = product.name; - - // Handle each item in the bundle - product.items.forEach(item => { - if (item.type === 0) { - // Avatar decoration - const decoImage = document.createElement("img"); - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - decoImage.alt = "Avatar Decoration"; - decoImage.classList.add("avatar-decoration-image"); - card.querySelector("[data-shop-card-preview-holder]").appendChild(decoImage); - - const bgimg = document.createElement("div"); - bgimg.classList.add("avatar-decoration-bg-image"); - - card.querySelector("[data-shop-card-preview-holder]").appendChild(bgimg); - - // Hover effect for decoration image - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=true`; - if (localStorage.discord_avatar != defaultAvatar1 && localStorage.discord_avatar != defaultAvatar2 && localStorage.discord_avatar != defaultAvatar3 && localStorage.discord_avatar != defaultAvatar4 && localStorage.discord_avatar != defaultAvatar5 && localStorage.discord_avatar != defaultAvatar6) { - bgimg.style.backgroundImage = `url(${localStorage.discord_avatar})` - } - }); - card.addEventListener("mouseleave", () => { - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - bgimg.style.backgroundImage = `url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQgAAAEJCAYAAABoqrlaAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAABjZSURBVHgB7Z07kBxVloaPNNA8JAESEnqBhEItgiAUISKIwAFrHHAWBxzWAYdxsDQOa+yuMxbOysIaR1jjMNY64Ow44CwQgSIkIZCEhJ7der9fIxHTX3bfJrtUj8yqzJv38X8RSVW3CqmyKu+f/zn33HOXmUiZDaXHDT2/WzF3rLRqzJaez8wdN0qH+1kkyDITMcMAZ8BPLzyuX3jufu+TGftdLI6Wfj5iEpBokUDEQVkIti88OiGIAQTiyMIxu/D4g4ngkUCECWLwqs2LAY/TliaIBGKxb+FxxkRQSCDCACfw5tyxy+YFwXd4EAoIBKKxb+FRgtExEojuQAjesHlhyFUQRuFCkW9MIUknSCD8UXYJb1o8+YNQII/xtf0uFkp8ekAC0S6IAPmDDyyupGIMOLH40kRrSCDawYUPb5tEoW2cs/jKFIY0jgSiORCCd21eFJRT6AaSmp+bEpyNIYGYHNzCBwuPIhwIPeQqJkQCMR4u4fiWSRhCx7kK5SrGQAJRDxdGvGfKLcSGwo8xkEBUQ8KQDoiDCz8kFCOQQAxHwpAuEooKSCD6I2HIBycUfzcVXz2EBOJhEIYPTcKQG0pm9kEC8TvMRnxiqmHIHQlFCQnEvCAgDJquFGUQCIQi6/xEzgLh8gwfmhCD2WvzQpEluQqEwglRh2zDjtwEAtfwsc2vlxCiLtmFHX+wfKA0es/c8YoJMR4s2ec6umnzzWySJweBwDXsnjv+NHdMmRCT4dbhEJ7SvTvp2onUBYJcw6emGQrRPM5NuBb/SZKyQJBr+LOp4Em0B9eWy2ftswRJMUmpugbRBbiI3ZaYm0jNQSAKJCK3mBB+cbkJNgY6YYmQkkDQ1ek/TIlI0R2IxB8XnicRcqQgEHwpJCJV2yBCwe2G9u3ccc8iJvYcBPmGPaaKSBEm0eclYnYQLt+wxoQIE5eXINy4ZBESq0CwyOq/TfkGET6IxDs2X3150CIjRoEgGfknEyIuXl94jCp5GZtAUPz07yZEnLjanGhEIiaBoPjpHRMibhAJkurfWATEMItBDPcXU2WkSAtWgzLDEfRir9AdBOKgJdoiRZh9Iy/xDwu4ViJkgXDiMG1CpEnwIhGqQEgcRC4ELRIhCoTEQeRGsCIRmkBIHESuBCkSoQkEWd3XTYg8WbNwBDMFGpJAUASlOgeRO7jnYOokQhEIyqdVISnEPC7E7rziMgSBQBw+NCFEGQoDO1/g1bVAsBT2zyaE6Af5OLpmd9bCrstSa+Ksv5q6TgsxDEqxP7KOms505SBcJyg1exFiOPQ8wWmTtPS+bqMrgVDnaSGqg8smcfmVeaYLgSAp+UcTQtQB141QfGse8S0QtIpTNyghxoNVzV5nNpabP1DAD00IMQk4cG9d3H3NYmCNmLFQe3ohJocZDWY2Wk9a+goxOBmtsRCiGbjhMrvRej7Ch0Cw45XyDkI0C/kI9gE9Yi3Sdg6CkOIDE0K0AQscWw3b2xYIOlEr7yBEOxBqfGIt0maIwZSmlm8L0S7cgFub+mxrFoM3/TcTQvigtfUabYUYrdoeIcQSWgs12ggxmLV4z4QQPmkl1GjaQWjWQojuYOw12j6haYHwWgYqhFhC46FGkwLBmvW3TQjRJYzDxvaxbXIWg1kLuQchuofZjPetAZpKUlLzoB4PQoQBoUYjCcsmQgxcg2YthAiLRhKWTTgI6sEbi3mEEI3Aas9/zh0/2ARM6iBwD0pMChEmE88qTioQqnkQImwmGqOTCITcQwesWLHCnn32WYuNp59+unjvwjuM0bFTAI/Y+Mg9tAwDauXKlbZq1arisTzAvv/+e7tz547FwOOPP247d+5c/Pnq1at28+ZNu3Xrlt24caN4LlqFsTpWLmLcOgit1mwB7rIIwerVq4vHP/xhcA6ZQbZ//36LgR07dthzzz038M8fPHhQCMXly5eLR85NNM5uG0MkxnUQcg8N8Nhjj9natWsrCUIviAlH6IOJ9zhMHIDzducDCMaVK1cKweD8YnFKgTOWixhHIJR7mAAGwZo1a4o8AgIxCS+88ELwAsF7rAuCwefjci2EIJznpUuX5C7G59WFo5ZIjCMQcg81caKwfv36Wi6hyt8bsosg9+BcwSSQe+HYtGmT3b17tzjfc+fOSSzq85bVFIi6OQjlHirCwHjqqads8+bNjYpCLyHnIkblHiYFsbh48aKdPXtWYUh1/s1q7KdR10HIPQzhkUceKVwCOYUm7pxV4N/hTj3OAOH9jhIvBuE48J7aFAcgRMNVcCCU58+fLwTj/v37JgbCsoi9VV9cx0HgHvaYVmw+RFshRFXOnDljx44dK54zaEh4MvinpqaKn3nOwaB1rxkHxILB5w7387179wqB4rmbsmzbPQyCBCcicfLkSbmK/uAe3reKLqKOQJCYVK/JEggDSThfbmEQDEwGxqRJz6ZAJEIoinKuYnZ21sQSPreKLqKOQKjfwwKIQtu5BdEcOB0chYRiEXbj+qjKC6te4UyPaEm3zYvDli1bbPlynxuji0kgvCIExGlRiCVszdyxzyq0ya96lb9loojhEQcRJ3x3Lg8jqk04VBEIFUYtUF5PIOIDJzE9PW2igKhgZEOZKgKhZjBzbNy4MZgkoBgfEsp8l6JgZNqgikBkX/uALd26dauJNFCosciuUS8YJRD4sexnLkhMasYiHQg1XnzxRROL6zMGMkog3rXMofipi4If0S4sBOu6fiUQJhKI7PMP46xGFHFAtSduInOGmoBhAoE4ZB1eIA5KTKYL360SlsVMxkAjMEwgsq59IIlFtaRIGxZ6yUUU2/X1ZZSDyBYlJvMAcdi2bZtlzkAzMEggsp698LFUWYQD33XmCcuBYcYggRhoOXJAicn80HdeTyBGFlCkSpUmqyI9yk1zM6XvmO8nEIQW2eYfmPoSeZK5i+i7NmP5gBdmCUVRmtbMF7mIh1ML/QQi2/BCcaiQi1iKHMQCcg8CMncRD5mDXoHYYJlOb8o9CEfG18JD479XILJ0D9wx5B6EI3MXsUQDegUiy/yD3IPoJeNrYqhAZNePiz0ktOxX9JKxi1hiEsoCwRxodgKh1XxiEJm6CHIQi/UQZYHIThy05kIMAweR6UrPRS3IWiCUexCjyNRh9hWI7BKUyj2IUWTaL6KvQGRV/6DCKFEFxGHdunWWGYtmwQlEdgnKDL90MSY0uM2MxUSlE4isxIHkpMILUZVMpzyLiKLsILJByUlRFzb/zYzCNGTpIOQeRF2YDs8sWblEILZbJhBPKjkp6oI4rFixwjJiSQ4imxmMDK2iaIjMQtPCNGQlENwFVDkpxgUHkVGYsZikXGmZJCkznK4SDYI4ZHQNFbqAQCi8EKIimdXPrHQOInlQfwmEmJTMwozpbByEpjZFE+QWZmQjEHIPoilWrVplmbAhmxBDDkI0RU4OgmAqeYGIrSntgwcP7MaNG3b58mW7f/9+cQBrSJ588skom+zevXvXrly5Yrdv3y7O586dO8X5TE1NFXH9M888E81u6oQZfAdXr161xCkEYr0lzlNPPWUxwCA6e/aszc7OLorCINweoqHXdTCITp482Xcw9f6OJfgUI8UgflxTOQgEkv22JZ6H2LJlS3G3CpkTJ07YoUOH7Pr16/bbb7+NfD1icunSJTt//nxheUPLrPP+OB/EgedVuHnzpp05c6Z4HkNIeO7cOUucSwjEe3NHshk8Bs727eEuNWHwHDhwwC5cuGDjgNPgQn3iiSeK8CMEEK6DBw8W4cQ4XLt2LVjhc3DDwe1VEfOYST5JGfICG8Rh//79Rb5hEhAJ7tYh3NF4Dz/++OPIEGkU5Cj4bKq6jy7IYfHWckuckKc3GdQMhKY4fPhwp3ExIQLvoSmcSEwqNm2Rw9R58nUQoao8OYdJnUM/EJ0uBpTLOTQNInHq1CkLkQwcxMrkHUSIyS4GE8m7NkAcjh8/br45ffp0o26o9+8OccYgg7LrtAUi1Ex4kza8H0yT+hxQbnq2TdoS1EnIoYlM0gIRSla/DHG6j8F78eJF84WPwctnFqKLCPEaa5KkBYLqvNBo+07rYJrQVy7C18DlnEJDDiJiQqzI8zWYEAfqCdqG82kr99CLT1dUlRBvQk2SrECEGB8SXvgaTMDah7bxafsRPT7DkOAmlHKiMlmBCNH6+RQHuHfvnrWND5dSJjSBgJS7pCMQzU/GB0CIqu774vbx7/muufAtslVYuTLZYuQbyQpELCs4YyfUKkefJDyTcUMhhhATohAjQjLbJk10SMIhxkyyAhGig/AtWj7ubL7PKUThl4OIjFCbw/i+kHwMJt93z1BDx0RF4iYCEd680YSE+mX5XhviI1HrO0EXqkAkGtIWScoZS4xQvyzX7NQXPv4tn+eDWwn1u000D5FmDiLkaSdf06+EWT7utvwbvkRi48aNFirLlyc5IZhmHUTIdm/Tpk1e3p/Prep9dVYKuZFt6E2Rx2QmyRAj5C8LcWj7Tsj5+xxMtN5vW/RoiR9yIjCWPT1qkmYOIvQvq20X4XtvCc5l27Zt1hYInk9HNA6JOgglKbuA9zc9PW1t4DbU8Q3/Zltb0sWwmU6iAnHEZVaSEokYppwYTE3fFblId+zYYV2B6DU9UPiMQt89LFEKTXACkVSiMpaiFXb8akokGJg7d+7s9NwRZt5DUyKxbt264jOKgQRzEEsE4qiJTmhCJAgruhYHB++B9zJpkpTP5KWXXrJYSLBQapb/ONljb4zXLQH4op5//nmLCQYTWXq2rKuzfJpz3bp1a7G1YEgXKO+FsAAncevWrVrnxGdBmMTnERuJbcX3zdzxg7uqkslBxKrk3Hlfe+21ou8izVmH9V9kEFFwtXnz5qCtLSLBe6UtHZvyDmpg49oD4hpi2LR3EHwXCfXHOMJ/Hin/ILqH5KWbDWBgccG5i46BRJPUmOJdhA+h4Hjw4EGxm1i5KxQlyjiNROsIYqYwDWUHQaIy6Y18YyPmu2k/EAHOKbXzSpTCNJQLyJMIM9QoRoiJ+cE9KQtEEjMZsqqiKxIqlpp1T8oCoTyEEAIWtaAsED+YEEIMEAh+GX1FJZlyIcRE9M1BQPRhhvZpEF0R4qY+Y7AkkugVCJVcC5E3SzSgVyCUhxAib4Y6CAmEEHkzVCBuWOQikUgcKCLk7t27FjkPTVT0a8WrPIQQebKv9xf9BOJrixzNZAjfJHLNPTT2+wlE9PUQqoUQvkngmuubXlg+4IVR10PIQQjfJJD72tfvl4OWPtJN5lWLFJJFoe3hyB3m8OHDRdMUNWKtz7lz54rDtdhPeUftjuibWhgkEF/OHR9bpITmIBCs/fv3L95lEIqTJ08WTVlD3xCmSxDV06dPF63cyt8pIhtKD05HAg6i7+zloLXR92zeQWywCPG5X+QouJh/+uknu3379pLfc8Ffu3ataMVG38Zly5YFvaeoT+ikdeTIETt69GjxGfX2eeSzo38nnbdC6f/B++G9Rgri8Pd+fzCsecIqi7SRrfuiQhCJqakpW716dXE3HNSTEfG4cOFC0YsSsaCnRaIbsQwEUSCEOHTokM3MzAytKWDrwpdfftkeffRRC4FffvmlcDoR87kNyDsuG/I/0X7ufy1iQtgrogwXPaHF7OzsyNe6/TUJQ1Jt0YYoOGGoUmTE5xBSY1veM4JGn83Ied8GdJRbNuJ/3GMRJysdJLXYDzMUcBLHjh0rBkcVnFjQyZrHWHMWuKgrV67Y9evXC5GsmisKTRiA0BCxT2DGjPBi96A/HCUQ71nEycoybr+FkAZXHUdRhhwL3aAJXRCP0GZsHGVB4C5bVRAdIQoD3xlJ5rrnEjCf2vykRF9GCUT0YUYZElpccCG5CXBCwUU3Tjbc7SuBaKxataoQDd+t5DkHRAB3RB6F5+OsTeBcmNkhzxCaU0rINZQZGF7AKIGAJMKMMqHlJhzccdkwZ9gmM3Xg/JxYkCxl8PE7Ht3hXteP8gBHuNweHfz+3r17xfNxhaAXXMKaNWsKcQit8XCCrsFBvdN/DntBFYFAHPZYguAmQtwclgvyu+++s1xAqNhVLLQtC1wdBq4hUYaGF1BFqrEf5CKmLDGYDmVq0Vn0UDh+/HgjDiIWXJ0Du4aFAm7h4MGDRX1DojCuPx31oqpeDg+aVJjhcEU3xM3E713fxZydzQ0SmYQXXX/+CPPPP/+cYq6hF8KLkSu3qwqEcxHJQrESsT+xNW6iqws1N/dQBnFcu3atdQHhBJ89FZwJNH6pwn9ZhVXbVQWCvyja0us6MDgRCiC551MosLXUR+QKIk2y0mcVKcJw6tSpwjVEXCpdl4Gl1b3USRczWf+2ZQIXC6EHNtPXPPyBAweyX6rO3dvHSteyMFCr0bveI3E+mztOVHlhHYEgzEAgstkB3C2oconM8tRg0+BaWI+ROwgEnzH5oDbIXBiAcVx5VrLuhDPTolEu4JoEl8h0jqLp0INBwYIfNbqZh9qKDRs22PLly60pJAyL4B4qN4SqKxDYkncswSnPKpSXaDeZzCQ5lmARztg0Oe3pckrMDGUuDFBparNMXYGgT0SyU551cBcegkHl37i9HFjJeOJEpXAwK5j2nCRh6XpK/Prrr8XflbkwOEhM1trWokolZS/kIP5mGeUiqsCFXLdDVG+nKbEUPtNdu3ZVdmmDOlCJAtzDbhuy7qIf4xS9y0X0oRx+uOmyUdWZCi2G4wb5sFADUbh8+XKRwxnUgUoU4B5qb2kxjoMAuYgKcOejLVq/pi+EFjlWTI4DC+t6Pz+EFWGo01ciY8ZyDzDusjm5iApwJyNXgRiU28nRf5L4WBd2NZg9ovcFhVS0o6PHJ4/KLVRmLPcA4zoIkIsQInzGdg8wyUQz5deVyjWFEJ3xlY0pDjBpJcoXFvk2fUIkDMKw1yZgUoFAHD4zIUSIfG4T0kQtKx1pahVfCCFaB/fwpU1IU8XuEyuVEKJRapVUD6IpgcBBjDWNIoRoHBKTjbj65pbLzecilLAUolsYg3utIZrsL84b+6dluBxciICgNqkxN9+kgwCmPSuvNRdCNMrE05q9tLFDCZsIZNOaToiA+MgaDvPbEAhUjH5hr5gQwhfMJDY+UdB0iOHYaxOUdwohatF4aOFoaxNEVnseNYUaQvig8dDC0eYuqQo1hGifVkILxyTLvavy17lj2oQQTcNN+H1rkbZyEGUqbfElhKgFY2q3tUybIYZDBVRCNA/O/P+tZXwIBBw05SOEaAoaNe01D/gIMRx7TVOfQkxKa1Oa/fCRpCzD7uBYI/WxFKI+hOtMaXq70foKMRyc4OW5400TQtSFTXe9NmfyLRDAYi6ci1rmC1Ed6h2+MM90IRCAChJuqD5CiNF8M3f8j3VAVwIB+2x+6nONCSEGQb7hE5tfvuCdLgWCE/7W5vMRSloK8TBu05tL1hG+ZzH6oZkNIR7G+4xFP7p0EA4+iB9NKz+FKPPx3HHCOiYEgQBUctY0/SkE0LK+9TLqKoQiEKDpTyE6ms4cREgCAUx/SiREriAOey0gQhMIkEiIHAlOHCBEgQCJhMiJIMUBQhUIkEiIHAhWHCBkgQCJhEiZoMUBQhcIkEiIFAleHCAGgQBE4qapbZ1IA+ocgpnKHEYsAgG0rWOvDURiyoSID6qG/zJ3/J9FQkwCAZSessALkdDaDRETblWm14YvkxKbQAAr21gfr1WgIhbcqszO11bUJUaBAKwaIkHDmQ0mRLjgGDpdsj0JsQoEIBJfmWY4RLjQnp6cQyfNXpogZoFwaIZDhAY3L3qc7LXICaFhTFMQauwxhRyiW8g3sN3kEUuAFByEw+UlEIgtJoR/XL4hmQ2iUhIIQCT+YcpLCP98ZvMONtp8Qz9SCjF6UcghfIBboDIyqvqGqqTmIMq4WY5nTftviHZwsxTR1TdUJWWBAOze1zbf7xKRUGGVaAJXMs16iqRCil5SFwgHGWUSmKtMbkJMBtcRicgkZilGkXIOYhC01//AlJsQ9Ug61zCIXBxEGecmEMdXTIjRJJ9rGESODqKMZjrEMHALn1tmrqFM7gLhUNghypCEDGp/iq6QQPwO4uCEQuQJwkA48cXC8+yRQDwMQvHh3PGWiZygZmavJVQm3QQSiMFIKPIg+zzDMCQQo5FQpImEoQISiOpIKNJAwlADCUR9JBTx4dblkHxUjqEGEojxQShonPuuaXo0VDQrMSESiGZgehRHoR4UYaAwoiEkEM3iwo9dJlfhG+cWvjSFEY0hgWgP3ATO4g3TMvO2QBRYzk9+QW6hBSQQ7YM4kKt4Y+FRTAaiwII7ROFrU26hVSQQfkEscBYIhcKQ6pSdwhGTKHhDAtEtry4cu0wJzl4IGfYtPCp86AgJRDg4d8Gx3fITDJxBWRDkEgJAAhEuCMb0wuHCkVTa5THLgAgctXlhUNgQKBKIuCiLBoKx3cJuxjuzcBxdeJQYRIYEIg0QiA09x/qF37s/a1pEZkqPHDdLz90hIYgcCURerOw5yvTOqNywpQN8ZsDvRcL8C4aF6dA8K7JrAAAADmVYSWZNTQAqAAAACAAAAAAAAADSU5MAAAAASUVORK5CYII=)`; - }); - } - } else if (item.type === 1) { - // Profile effect - (async () => { - if (!discordProfileEffectsCache) { - await setDiscordProfileEffectCache(); - } - - // Find the matching effect - const matchingEffect = discordProfileEffectsCache.find(effect => effect.id === item.id); - - if (matchingEffect) { - const effectImage = document.createElement("img"); - effectImage.src = matchingEffect.thumbnailPreviewSrc; - effectImage.alt = "Profile Effect"; - effectImage.classList.add("profile-effect-image"); - card.querySelector("[data-shop-card-preview-holder]").appendChild(effectImage); - - // Hover effect for profile effect - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects[0] && matchingEffect.effects[0].src) { - effectImage.src = matchingEffect.effects[0].src; - } - }); - card.addEventListener("mouseleave", () => { - effectImage.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - card.addEventListener("mouseenter", () => { - effectImage.src = matchingEffect.reducedMotionSrc; - }); - card.addEventListener("mouseleave", () => { - effectImage.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } - })(); - } - }); - } else if (product.type === item_types.VARIANTS_GROUP) { - // Update SKU and summary - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - card.querySelector("[data-product-card-sku-id]").textContent = ``; - } else { - card.querySelector("[data-product-card-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - } - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - // Always display the base variant name - card.querySelector("[data-product-card-name]").textContent = product.variants[0]?.base_variant_name || "Product"; - - // Render variant color blocks as interactive divs - const variantContainer = card.querySelector("[data-shop-card-var-container]"); - variantContainer.innerHTML = ""; // Clear existing variant blocks - let currentSelectedVariant = null; // Track selected variant - - product.variants.forEach((variant, index) => { - // Create variant color block - const variantColorBlockTmp = document.querySelector("[data-shop-varcolorblock-template]"); - const variantColorBlock = variantColorBlockTmp.content.cloneNode(true).children[0]; - variantColorBlock.classList.add("shop-card-var"); - variantColorBlock.id = "shop-card-var"; - variantColorBlock.style.backgroundColor = `${variant.variant_value}`; - - // Add click event listener to switch variants - variantColorBlock.addEventListener("click", () => { - if (currentSelectedVariant) { - currentSelectedVariant.classList.remove("shop-card-var-selected"); - } - variantColorBlock.classList.add("shop-card-var-selected"); - currentSelectedVariant = variantColorBlock; - applyVariant(variant); - }); - - // Append the color block to the container - variantContainer.appendChild(variantColorBlock); - - // Set the first variant as the default selected - if (index === 0) { - currentSelectedVariant = variantColorBlock; - variantColorBlock.classList.add("shop-card-var-selected"); - } - }); - - let isFirstTimeLoadingVariant = true; - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - - // Function to apply the selected variant - function applyVariant(selectedVariant) { - card.querySelector("[data-shop-card-var-title]").textContent = `(${selectedVariant.variant_label})`; - - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - card.querySelector("[data-product-card-sku-id]").textContent = ``; - } else { - card.querySelector("[data-product-card-sku-id]").textContent = `SKU ID: ${selectedVariant.sku_id}`; - } - - if (localStorage.experiment_2025_02_shop_card_modals != "Treatment 1: Enable modals" && localStorage.experiment_2025_02_shop_card_modals != "Treatment 2: Enable modals w/ data downloads" && localStorage.experiment_2025_02_shop_card_modals != "Treatment 3: Enable modals w/ p+" && localStorage.experiment_2025_02_shop_card_modals != "Treatment 4: Enable modals w/ p+ on p+ page" && localStorage.experiment_2025_02_shop_card_modals != "Treatment 5: Enable modals w/ data downloads and p+" && localStorage.experiment_2025_02_shop_card_modals != "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - card.querySelector("[data-share-product-card-button]").innerHTML = ` - - `; - } - - if (selectedVariant.type === 0) { - card.classList.add("type_2000-0"); - previewHolder.innerHTML = ""; // Clear previous decorations - previewHolder.classList.add('avatar-decoration-image'); - - // Add the avatar decoration based on the selected variant - selectedVariant.items?.forEach(item => { - const decoImage = document.createElement("img"); - const bgimg = document.createElement("div"); - if (isFirstTimeLoadingVariant == true) { - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - isFirstTimeLoadingVariant = false; - } else { - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=true`; - if (localStorage.discord_avatar != defaultAvatar1 && localStorage.discord_avatar != defaultAvatar2 && localStorage.discord_avatar != defaultAvatar3 && localStorage.discord_avatar != defaultAvatar4 && localStorage.discord_avatar != defaultAvatar5 && localStorage.discord_avatar != defaultAvatar6) { - bgimg.style.backgroundImage = `url(${localStorage.discord_avatar})` - } - } - decoImage.alt = "Avatar Decoration"; - decoImage.id = "shop-card-deco-image"; - previewHolder.appendChild(decoImage); - - bgimg.id = "shop-card-deco-bg-image"; - - previewHolder.appendChild(bgimg); - - // Hover effect for decoration image - if (localStorage.reduced_motion !== "true") { - card.addEventListener("mouseenter", () => { - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=true`; - if (localStorage.discord_avatar != defaultAvatar1 && localStorage.discord_avatar != defaultAvatar2 && localStorage.discord_avatar != defaultAvatar3 && localStorage.discord_avatar != defaultAvatar4 && localStorage.discord_avatar != defaultAvatar5 && localStorage.discord_avatar != defaultAvatar6) { - bgimg.style.backgroundImage = `url(${localStorage.discord_avatar})` - } - }); - card.addEventListener("mouseleave", () => { - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - bgimg.style.backgroundImage = `url(data:image/png;base64,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)`; - }); - } - }); - } else if (selectedVariant.type === 1) { - card.classList.add("type_2000-1"); - (async () => { - // Ensure the item ID is accessible here - let itemId = undefined; - if (Array.isArray(selectedVariant.items)) { - // If items is an array, find the item with type 1 and get its id - const item = selectedVariant.items.find(item => item.type === 1); - if (item) { - itemId = item.id; - } - } else if (selectedVariant.items && selectedVariant.items.type === 1) { - // If items is an object and has type 1, get its id - itemId = selectedVariant.items.id; - } - - - if (!discordProfileEffectsCache) { - await setDiscordProfileEffectCache(); - } - - // Find matching profile effect - const matchingEffect = discordProfileEffectsCache.find(effect => effect.id === itemId); - - if (matchingEffect) { - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - previewHolder.classList.add('profile-effect-image'); - - if (isFirstTimeLoadingVariant == true) { - previewHolder.innerHTML = ` - - `; - isFirstTimeLoadingVariant = false; - } else { - previewHolder.innerHTML = ` - - `; - } - - // Hover effect: change to the first effect URL (use 'src' from the 'effects' array) - const imgElement = card.querySelector("img"); - - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - imgElement.src = effectUrl || matchingEffect.thumbnailPreviewSrc; - } - }); - - card.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - card.addEventListener("mouseenter", () => { - imgElement.src = matchingEffect.reducedMotionSrc; - }); - - card.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } - })(); - } - } - - // Apply the default variant (first one) initially - if (product.variants.length > 0) { - applyVariant(product.variants[0]); - } - } else if (product.type === item_types.EXTERNAL_SKU) { - card.classList.add("type_3000"); - - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - card.querySelector("[data-product-card-sku-id]").textContent = ``; - } else { - card.querySelector("[data-product-card-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - } - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - - if (product.sku_id === ORB_PROFILE_BADGE) { - previewHolder.classList.add('potion-card-preview-holder'); - - previewHolder.innerHTML = ` - - `; - - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - card.querySelector("#orb-profile-badge-card-video").play(); - }); - card.addEventListener("mouseleave", () => { - card.querySelector("#orb-profile-badge-card-video").pause(); - card.querySelector("#orb-profile-badge-card-video").currentTime = 0; - }); - } - } else if (product.sku_id === NITRO_CREDITS_3_DAYS) { - previewHolder.classList.add('potion-card-preview-holder'); - - previewHolder.innerHTML = ` - - - - - - - - - - - - - - - - - - - - - - - - - `; - } else { - previewHolder.innerHTML = ` -

${getTextString("CARD_TYPE_EXTERNAL_SKU_ERROR")}

- `; - } - - } else if (product.type === 'plus_more') { - card.querySelector("[data-product-card-sku-id]").textContent = ``; - card.querySelector("[data-product-card-name]").textContent = `${getTextString("CARD_TYPE_PLUS_MORE_TITLE")}`; - card.querySelector("[data-product-card-summary]").textContent = `${getTextString("CARD_TYPE_PLUS_MORE_DESC")}`; - - card.querySelector("[data-shop-price-container]").innerHTML = ``; - card.querySelector("[data-product-card-open-in-shop]").innerHTML = ``; - card.querySelector("[data-share-product-card-button]").innerHTML = ``; - - const plusMoreQuestionMark = document.createElement("img"); - plusMoreQuestionMark.src = `https://cdn.discordapp.com/assets/server_products/storefront/question-mark.png`; - plusMoreQuestionMark.classList.add("plus-more-question-mark"); - card.querySelector("[data-shop-card-preview-holder]").appendChild(plusMoreQuestionMark); - - // Hover effect for decoration image - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - plusMoreQuestionMark.src = `https://cdn.discordapp.com/assets/server_products/storefront/question-mark.gif`; - }); - card.addEventListener("mouseleave", () => { - plusMoreQuestionMark.src = `https://cdn.discordapp.com/assets/server_products/storefront/question-mark.png`; - }); - } - } else if (product.items[0].item_type === 'deco') { - product.items.forEach(item => { - - card.classList.add("type_0"); - // Set the innerHTML for the preview holder - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - previewHolder.classList.add('avatar-decoration-image'); - - // Set the initial image for the deco card - const imgElement = document.createElement("img"); - imgElement.id = "shop-card-deco-image"; - imgElement.src = imgElement.src = item.static; - - previewHolder.appendChild(imgElement); - - const bgimg = document.createElement("div"); - bgimg.id = "shop-card-deco-bg-image"; - - previewHolder.appendChild(bgimg); - - // Set the product details - card.querySelector("[data-product-card-sku-id]").textContent = ``; - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - // Hover effect: Change the image src on mouse enter and leave - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - imgElement.src = item.animated; - if (localStorage.discord_avatar != defaultAvatar1 && localStorage.discord_avatar != defaultAvatar2 && localStorage.discord_avatar != defaultAvatar3 && localStorage.discord_avatar != defaultAvatar4 && localStorage.discord_avatar != defaultAvatar5 && localStorage.discord_avatar != defaultAvatar6) { - bgimg.style.backgroundImage = `url(${localStorage.discord_avatar})` - } - }); - - card.addEventListener("mouseleave", () => { - imgElement.src = item.static; - bgimg.style.backgroundImage = `url(data:image/png;base64,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)`; - }); - } - - }); - } else if (product.items[0].item_type === 'effect') { - card.classList.add("type_1"); - - card.querySelector("[data-product-card-sku-id]").textContent = ``; - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - previewHolder.classList.add('profile-effect-image'); - - previewHolder.innerHTML = ` - - `; - - // Hover effect: change to the first effect URL (use 'src' from the 'effects' array) - const imgElement = card.querySelector("img"); - - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - imgElement.src = product.items[0].animated; - }); - - card.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = product.items[0].static; - }); - } - } else { - card.classList.add('hidden') - } - - - const priceTextNitro = card.querySelector("[data-price-nitro]"); - const priceTextStandard = card.querySelector("[data-price-standard]"); - - const priceContainerNitro = card.querySelector("[data-price-nitro-container]"); - const priceContainerStandard = card.querySelector("[data-price-standard-container]"); - - const priceContainer = card.querySelector("[data-shop-price-container]"); - - let priceStandard = "N/A"; - let priceNitro = "N/A"; - let priceOrb = "N/A"; - - if (localStorage.experiment_2025_02_extra_options && localStorage.experiment_2025_02_extra_options != "Treatment 5: Enabled w/o currency picker" && localStorage.experiment_2025_02_extra_options != "Treatment -1: Disabled") { - if (localStorage.discord_premium_type === "2") { - if (product.prices && product.prices["4"] && product.prices["4"].country_prices && product.prices["4"].country_prices.prices) { - product.prices["4"].country_prices.prices.forEach(price => { - if (price.currency === "usd") { - priceStandard = price.amount; - } - if (price.currency === "discord_orb") { - priceOrb = price.amount; - } - }); - - if (priceStandard != "N/A" && priceOrb != "N/A") { - let orb_price = document.createElement("div"); - - orb_price.innerHTML = ` - ${priceOrb} -
- `; - orb_price.style.position = `absolute`; - orb_price.style.right = `0px`; - - priceContainer.appendChild(orb_price); - - standardPriceOutput = `US$${(priceStandard / 100).toFixed(2)}`; - - priceContainerStandard.innerHTML = ` - ${standardPriceOutput} -
- `; - - } else if (priceStandard != "N/A") { - - standardPriceOutput = `US$${(priceStandard / 100).toFixed(2)}`; - - priceContainerStandard.innerHTML = ` - ${standardPriceOutput} -
- `; - - } else if (priceOrb != "N/A") { - - let orb_price = document.createElement("div"); - - orb_price.innerHTML = ` - ${priceOrb} -
- `; - orb_price.style.position = `absolute`; - orb_price.style.left = `23px`; - orb_price.style.bottom = `0px`; - - priceContainer.appendChild(orb_price); - - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_ORB_EXCLUSIVE_TAG")}

-
- `; - - } - } - } else { - if (product.prices && product.prices["0"] && product.prices["0"].country_prices && product.prices["0"].country_prices.prices) { - product.prices["0"].country_prices.prices.forEach(price => { - if (price.currency === "usd") { - priceStandard = price.amount; - } - if (price.currency === "discord_orb") { - priceOrb = price.amount; - } - }); - - if (priceStandard != "N/A" && priceOrb != "N/A") { - let orb_price = document.createElement("div"); - - orb_price.innerHTML = ` - ${priceOrb} -
- `; - orb_price.style.position = `absolute`; - orb_price.style.right = `0px`; - - priceContainer.appendChild(orb_price); - - priceTextStandard.textContent = `US$${(priceStandard / 100).toFixed(2)}`; - - } else if (priceStandard != "N/A") { - - priceTextStandard.textContent = `US$${(priceStandard / 100).toFixed(2)}`; - - } else if (priceOrb != "N/A") { - - let orb_price = document.createElement("div"); - - orb_price.innerHTML = ` - ${priceOrb} -
- `; - orb_price.style.position = `absolute`; - orb_price.style.left = `23px`; - orb_price.style.bottom = `0px`; - - priceContainer.appendChild(orb_price); - - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_ORB_EXCLUSIVE_TAG")}

-
- `; - - } - } - } - - } else { - if (product.prices && product.prices["0"] && product.prices["0"].country_prices && product.prices["0"].country_prices.prices) { - product.prices["0"].country_prices.prices.forEach(price => { - if (price.currency === "usd") { - priceStandard = price.amount; - } - }); - } - - if (product.prices && product.prices["4"] && product.prices["4"].country_prices && product.prices["4"].country_prices.prices) { - product.prices["4"].country_prices.prices.forEach(price => { - if (price.currency === "usd") { - priceNitro = price.amount; - } - }); - } - - if (priceTextStandard) { - priceTextStandard.textContent = priceStandard !== "N/A" ? `US$${(priceStandard / 100).toFixed(2)}` : "null"; - } - - if (priceTextNitro) { - priceTextNitro.textContent = priceNitro !== "N/A" ? `US$${(priceNitro / 100).toFixed(2)} with Nitro` : "null"; - } - } - - if (localStorage.experiment_2025_03_copy_sku_card === "Treatment 1: Enabled" || localStorage.experiment_2025_03_copy_sku_card === "Treatment 2: w/ share button") { - card.querySelector("[data-product-card-open-in-shop]").innerHTML = ` -
- - -
- `; - } else { - card.querySelector("[data-product-card-open-in-shop]").innerHTML = ` - - `; - } - - if (product.items[0] && product.items[0].item_type && product.items[0].item_type === 'deco' || product.items[0] && product.items[0].item_type && product.items[0].item_type === 'effect' || product.sku_id === "0") { - card.querySelector("[data-product-card-open-in-shop]").innerHTML = ``; - } - - if (product.premium_type === 2) { - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
- `; - } - - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - if (product.type === item_types.AVATAR_DECORATION || product.type === item_types.PROFILE_EFFECT || product.type === item_types.NAMEPLATE || product.type === item_types.BUNDLE || product.type === item_types.VARIANTS_GROUP || product.type === item_types.EXTERNAL_SKU) { - card.classList.add('clickable'); - - card.addEventListener("click", (event) => { - if (event.target.matches("[data-shop-card-var]") || event.target.matches(".card-button") || event.target.matches(".shareIcon_f4a996")) { - } else { - openItemModal(); - addParams({itemSkuId: product.sku_id}) - } - }); - - const itemSKUForScroll = params.get("itemSkuId"); - - if (itemSKUForScroll === product.sku_id && modalIsAlreadyOpen != true) { - modalIsAlreadyOpen = true; - setTimeout(() => { - openItemModal(); - }, 1000); - } - - - async function openItemModal() { - let modal = document.createElement("div"); - - modal.classList.add('modalv2'); - - if (apiCategory.pdp_bg != null) { - pdp = apiCategory.pdp_bg - } else { - pdp = apiCategory.banner - } - - modal.innerHTML = ` -
-
-
-

-

-

-
-
- -
-
-
-
-
-
- -
- -
-
- -
-
- -
- -
-
-
- `; - - document.body.appendChild(modal); - - setTimeout(() => { - modal.classList.add('show'); - }, 1); - - if (apiCategory.logo != null) { - modal.querySelector("[data-modalv2-inner-logo]").src = `https://cdn.discordapp.com/app-assets/1096190356233670716/${apiCategory.logo}.png?size=4096`; - } - - const button_container = document.querySelector("[data-modal-buttons]"); - const top_button_container = document.querySelector("[data-modal-top-product-buttons]"); - - - let copyDiscordLink = document.createElement("div"); - - copyDiscordLink.title = getTextString("SHOP_SHARE_DISCORD_LINK"); - copyDiscordLink.innerHTML = ` - - `; - - top_button_container.appendChild(copyDiscordLink); - - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - let downloadItemData = document.createElement("div"); - - downloadItemData.title = getTextString("SHOP_DOWNLOAD_DATA"); - downloadItemData.innerHTML = ` - - `; - - top_button_container.appendChild(downloadItemData); - } - - if (localStorage.experiment_2025_03_view_raw_modal === "Treatment 1: Enabled") { - let rawItemData = document.createElement("div"); - - rawItemData.title = getTextString("SHOP_VIEW_RAW_DATA"); - rawItemData.innerHTML = ` - - `; - - top_button_container.appendChild(rawItemData); - - modal.querySelector("[data-view-raw-product-card-button]").onclick = function(){ - openRawModal(); - }; - - async function openRawModal() { - let modal = document.createElement("div"); - - modal.classList.add('modalv2'); - - modal.innerHTML = ` -
- -
- `; - - document.body.appendChild(modal); - - setTimeout(() => { - modal.classList.add('show'); - }, 1); - - - let modal_back = document.createElement("div"); - - modal_back.classList.add('modalv2-back'); - modal_back.id = 'modalv2-back'; - - document.body.appendChild(modal_back); - - setTimeout(() => { - modal_back.classList.add('show'); - }, 1); - - - modal.addEventListener('click', (event) => { - if (event.target === modal) { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - } - }); - - document.querySelector("[data-close-product-card-button]").addEventListener('click', () => { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - }); - } - } - - button_container.innerHTML = ` - - `; - - if (product.type === item_types.AVATAR_DECORATION) { - - modal.classList.add('modal-0'); - - product.items.forEach(item => { - - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - const previewHolderLeft = modal.querySelector("[data-modal-left-preview-holder]"); - - modal.querySelector("[data-product-modal-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - modal.querySelector("[data-product-modal-name]").textContent = product.name; - modal.querySelector("[data-product-modal-summary]").textContent = product.summary; - - if (localStorage.experiment_2025_02_extra_options && localStorage.experiment_2025_02_extra_options != "Treatment 5: Enabled w/o currency picker" && localStorage.experiment_2025_02_extra_options != "Treatment -1: Disabled") { - - previewHolder.classList.add('modal-preview-profile-container'); - previewHolder.innerHTML = ` -
-
-
-
- No image uploaded -

${localStorage.discord_displayname}

- - -
-
-
- `; - - document.getElementById("modal-username-preview").textContent = localStorage.discord_username.toLowerCase(); - - previewHolderLeft.classList.add('modal-left-avatar-decoration-img'); - - const imgElement = document.createElement("img"); - imgElement.id = "shop-card-deco-image"; - imgElement.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - - previewHolderLeft.appendChild(imgElement); - - if (localStorage.reduced_motion != "true") { - imgElement.addEventListener("mouseenter", () => { - imgElement.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=true`; - }); - - imgElement.addEventListener("mouseleave", () => { - imgElement.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - }); - } - - } else { - - previewHolder.classList.add('modal-avatar-decoration-img'); - - const imgElement = document.createElement("img"); - imgElement.id = "shop-card-deco-image"; - imgElement.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - - previewHolder.appendChild(imgElement); - - // Hover effect: Change the image src on mouse enter and leave - if (localStorage.reduced_motion != "true") { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - imgElement.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=true`; - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - imgElement.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - }); - } - } - - }); - } else if (product.type === item_types.PROFILE_EFFECT) { - modal.classList.add('modal-1'); - - modal.querySelector("[data-product-modal-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - modal.querySelector("[data-product-modal-name]").textContent = product.name; - modal.querySelector("[data-product-modal-summary]").textContent = product.summary; - - // Ensure the item ID is accessible here - let itemId = undefined; - if (Array.isArray(product.items)) { - // If items is an array, find the item with type 1 and get its id - const item = product.items.find(item => item.type === 1); - if (item) { - itemId = item.id; - } - } else if (product.items && product.items.type === 1) { - // If items is an object and has type 1, get its id - itemId = product.items.id; - } - - - if (!discordProfileEffectsCache) { - await setDiscordProfileEffectCache(); - } - - // Find matching profile effect - const matchingEffect = discordProfileEffectsCache.find(effect => effect.id === itemId); - - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - const previewHolderLeft = modal.querySelector("[data-modal-left-preview-holder]"); - - if (matchingEffect) { - if (localStorage.experiment_2025_02_extra_options && localStorage.experiment_2025_02_extra_options != "Treatment 5: Enabled w/o currency picker" && localStorage.experiment_2025_02_extra_options != "Treatment -1: Disabled") { - previewHolder.classList.add('modal-preview-profile-container'); - previewHolder.innerHTML = ` -
-
-
-
- No image uploaded -

${localStorage.discord_displayname}

- -
-
- -
- `; - - document.getElementById("modal-username-preview").textContent = localStorage.discord_username.toLowerCase(); - - previewHolderLeft.classList.add('modal-left-profile-effect-img'); - - const imgElement = document.createElement("img"); - imgElement.src = matchingEffect.thumbnailPreviewSrc; - - previewHolderLeft.appendChild(imgElement); - - if (localStorage.reduced_motion != "true") { - imgElement.addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - imgElement.src = effectUrl || matchingEffect.thumbnailPreviewSrc; - } - }); - - imgElement.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - imgElement.addEventListener("mouseenter", () => { - imgElement.src = matchingEffect.reducedMotionSrc; - }); - - imgElement.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } else { - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - previewHolder.classList.add('modal-profile-effect-img'); - - previewHolder.innerHTML = ` - - `; - - // Hover effect: change to the first effect URL (use 'src' from the 'effects' array) - const imgElement = previewHolder.querySelector("img"); - - if (localStorage.reduced_motion != "true") { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - imgElement.src = effectUrl || matchingEffect.thumbnailPreviewSrc; - } - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - imgElement.src = matchingEffect.reducedMotionSrc; - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } - } - } else if (product.type === item_types.NAMEPLATE) { - card.classList.add("modal-2"); - - modal.querySelector("[data-product-modal-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - modal.querySelector("[data-product-modal-name]").textContent = product.name; - modal.querySelector("[data-product-modal-summary]").textContent = product.summary; - - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - previewHolder.classList.add('nameplate-modal-preview'); - - const previewHolderLeft = modal.querySelector("[data-modal-left-preview-holder]"); - - if (localStorage.discord_displayname && localStorage.discord_displayname != '') { - previewName = localStorage.discord_displayname; - } else { - previewName = 'Default User' - } - - if (localStorage.experiment_2025_03_early_nameplate_warning === "Treatment 2: Nameplate & Nameplate Test Warning" && product.category_sku_id === discord_categories.NAMEPLATE) { - let nameplateWarning = document.createElement("div"); - - nameplateWarning.classList.add('nameplate-modal-early-warning-container'); - nameplateWarning.innerHTML = ` -

${getTextString("SHOP_NAMEPLATE_WARNING_NOTICE_1")}

- `; - - modal.querySelector(".modalv2-inner-left").appendChild(nameplateWarning); - } else if (localStorage.experiment_2025_03_early_nameplate_warning === "Treatment 1: Nameplate Test Warning" || localStorage.experiment_2025_03_early_nameplate_warning === "Treatment 2: Nameplate & Nameplate Test Warning") { - if (product.category_sku_id === discord_categories.NAMEPLATE_TEST) { - let nameplateWarning = document.createElement("div"); - - nameplateWarning.classList.add('nameplate-modal-early-warning-container'); - nameplateWarning.innerHTML = ` -

${getTextString("SHOP_NAMEPLATE_WARNING_NOTICE_2")}

- `; - - modal.querySelector(".modalv2-inner-left").appendChild(nameplateWarning); - } - } - - previewHolder.innerHTML = ` -
-
-
-
-
-
-
-
-
-
-
-
-
- -
-

${previewName}

-
-
-
-
-
-
-
-
-
-
-
-
-
- `; - - previewHolderLeft.innerHTML = ` -
- -
-

${previewName}

-
- `; - - product.items.forEach(item => { - const nameplatePreview = previewHolder.querySelector("[data-user-nameplate-preview]"); - const paletteName = item.palette; - const asset = `https://cdn.discordapp.com/assets/collectibles/${item.asset}asset.webm`; - const bgcolor = nameplate_palettes[paletteName].darkBackground; - - const videoElement = previewHolder.querySelector("[data-user-nameplate-preview-img]"); - - videoElement.src = asset; - - nameplatePreview.style.backgroundImage = `linear-gradient(90deg, #00000000 -30%, ${bgcolor} 200%)`; - // nameplatePreview.style.boxShadow = `0 0 0 1px #a10606`; - - const nullUserNameRandomWidth = previewHolder.querySelectorAll("[data-null-user-random-name]"); - - nullUserNameRandomWidth.forEach(UserName => { - const randomWidth = Math.floor(Math.random() * (180 - 80 + 1)) + 80; - UserName.style.width = randomWidth + `px`; - }); - - const nullUserAvatar = previewHolder.querySelectorAll("[data-nameplate-user-random-avatar]"); - - nullUserAvatar.forEach(UserAvatar => { - UserAvatar.style.backgroundImage = `url(${localStorage.discord_avatar})`; - }); - - if (localStorage.reduced_motion != "true") { - videoElement.play(); - } - - - - const videoElementLeft = previewHolderLeft.querySelector("[data-user-nameplate-preview-img-left]"); - const nameplatePreviewLeft = previewHolderLeft.querySelector("[data-user-nameplate-preview-left]"); - previewHolderLeft.classList.add("modal-left-nameplate-preview"); - - videoElementLeft.src = asset; - - nameplatePreviewLeft.style.backgroundImage = `linear-gradient(90deg, #00000000 -30%, ${bgcolor} 200%)`; - - const nullUserAvatarLeft = previewHolderLeft.querySelectorAll("[data-nameplate-user-random-avatar-left]"); - - nullUserAvatarLeft.forEach(UserAvatar => { - UserAvatar.style.backgroundImage = `url(${localStorage.discord_avatar})`; - }); - - if (localStorage.reduced_motion != "true") { - videoElementLeft.addEventListener("mouseenter", () => { - videoElementLeft.play(); - }); - - videoElementLeft.addEventListener("mouseleave", () => { - videoElementLeft.pause(); - }); - } - }); - - } else if (product.type === item_types.BUNDLE) { - modal.classList.add('modal-1000'); - - const bundledProducts = product.bundled_products || []; - - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - - // Generate the bundle summary from the names of the bundled products - const type0Product = bundledProducts.find(item => item.type === 0); - const type1Product = bundledProducts.find(item => item.type === 1); - - let bundleSummary = `${getTextString("CARD_TYPE_BUNDLE_TITLE")}`; - if (type0Product) { - bundleSummary += `${type0Product.name}${getTextString("CARD_TYPE_BUNDLE_TITLE_DECO")}`; - } - if (type1Product) { - bundleSummary += `${type1Product.name}${getTextString("CARD_TYPE_BUNDLE_TITLE_EFFECT")}`; - } - - // Set the summary text - modal.querySelector("[data-product-modal-summary]").textContent = bundleSummary; - - // Set the basic card details - modal.querySelector("[data-product-modal-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - modal.querySelector("[data-product-modal-name]").textContent = product.name; - - // Handle each item in the bundle - product.items.forEach(item => { - if (localStorage.experiment_2025_02_extra_options && localStorage.experiment_2025_02_extra_options != "Treatment 5: Enabled w/o currency picker" && localStorage.experiment_2025_02_extra_options != "Treatment -1: Disabled") { - - if (item.type === 0) { - decosrc = item.asset - } else if (item.type === 1) { - // Profile effect - (async () => { - if (!discordProfileEffectsCache) { - await setDiscordProfileEffectCache(); - } - - - // Find the matching effect - const matchingEffect = discordProfileEffectsCache.find(effect => effect.id === item.id); - - if (matchingEffect) { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - renderProfile(effectUrl) - } - } - })(); - } - - function renderProfile(effectUrl) { - previewHolder.classList.add('modal-preview-profile-container'); - previewHolder.innerHTML = ` -
-
-
-
- No image uploaded -

${localStorage.discord_displayname}

- - -
-
- -
- `; - document.getElementById("modal-username-preview").textContent = localStorage.discord_username.toLowerCase(); - } - - - } else { - if (item.type === 0) { - const decoImage = document.createElement("img"); - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - decoImage.alt = "Avatar Decoration"; - decoImage.classList.add("modal-avatar-decoration-img"); - modal.querySelector("[data-modal-preview-holder]").appendChild(decoImage); - - // Hover effect for decoration image - if (localStorage.reduced_motion != "true") { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=true`; - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - }); - } - } else if (item.type === 1) { - // Profile effect - (async () => { - // Fetch profile effects if not cached - if (!discordProfileEffectsCache) { - const response = await fetch(api + PROFILE_EFFECTS, { - method: "GET", - headers: { - "Password": api_password, - "Authorization": discord_token, - "Token": api_token - } - }); - const effectsData = await response.json(); - discordProfileEffectsCache = effectsData.profile_effect_configs; - } - - // Find the matching effect - const matchingEffect = discordProfileEffectsCache.find(effect => effect.id === item.id); - - if (matchingEffect) { - const effectImage = document.createElement("img"); - effectImage.src = matchingEffect.thumbnailPreviewSrc; - effectImage.alt = "Profile Effect"; - effectImage.classList.add("modal-profile-effect-img"); - modal.querySelector("[data-modal-preview-holder]").appendChild(effectImage); - - // Hover effect for profile effect - if (localStorage.reduced_motion != "true") { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - effectImage.src = effectUrl || matchingEffect.thumbnailPreviewSrc; - } - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - effectImage.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - effectImage.src = matchingEffect.reducedMotionSrc; - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - effectImage.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } - })(); - } - } - }); - } else if (product.type === item_types.VARIANTS_GROUP) { - modal.querySelector("[data-shop-modal-var-container-container]").classList.add('show'); - // Update SKU and summary - modal.querySelector("[data-product-modal-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - modal.querySelector("[data-product-modal-summary]").textContent = product.summary; - - // Always display the base variant name - modal.querySelector("[data-product-modal-name]").textContent = product.variants[0]?.base_variant_name || "Product"; - - // Render variant color blocks as interactive divs - const variantContainer = modal.querySelector("[data-shop-modal-var-container]"); - variantContainer.innerHTML = ""; // Clear existing variant blocks - let currentSelectedVariant = null; // Track selected variant - - product.variants.forEach((variant, index) => { - // Create variant color block - const variantColorBlock = document.createElement("div"); - variantColorBlock.classList.add("shop-card-var"); - variantColorBlock.style.backgroundColor = `${variant.variant_value}`; - - // Add click event listener to switch variants - variantColorBlock.addEventListener("click", () => { - if (currentSelectedVariant) { - currentSelectedVariant.classList.remove("shop-card-var-selected"); - } - variantColorBlock.classList.add("shop-card-var-selected"); - currentSelectedVariant = variantColorBlock; - applyVariant(variant); - }); - - // Append the color block to the container - variantContainer.appendChild(variantColorBlock); - - // Set the first variant as the default selected - if (index === 0) { - currentSelectedVariant = variantColorBlock; - variantColorBlock.classList.add("shop-card-var-selected"); - } - }); - - let isFirstTimeLoadingVariant = true; - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - const previewHolderLeft = modal.querySelector("[data-modal-left-preview-holder]"); - - // Function to apply the selected variant - function applyVariant(selectedVariant) { - modal.querySelector("[data-shop-modal-var-title]").textContent = `(${selectedVariant.variant_label})`; - modal.querySelector("[data-product-modal-sku-id]").textContent = `SKU ID: ${selectedVariant.sku_id}`; - modal.querySelector("[data-share-product-card-button]").onclick = function(){ - copyEmoji(`https://canary.discord.com/shop#itemSkuId=${selectedVariant.sku_id}`); - }; - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - modal.querySelector("[data-download-product-card-button]").onclick = function(){ - window.open(`https://item.yapper.shop/sku/${selectedVariant.sku_id}/data.zip`); - }; - } - if (localStorage.experiment_2025_02_extra_options && localStorage.experiment_2025_02_extra_options != "Treatment 5: Enabled w/o currency picker" && localStorage.experiment_2025_02_extra_options != "Treatment -1: Disabled") { - - if (selectedVariant.type === 0) { - selectedVariant.items?.forEach(item => { - previewHolder.classList.add('modal-preview-profile-container'); - previewHolder.innerHTML = ` -
-
-
-
- No image uploaded -

${localStorage.discord_displayname}

- - -
-
-
- `; - document.getElementById("modal-username-preview").textContent = localStorage.discord_username.toLowerCase(); - - previewHolderLeft.classList.add('modal-left-avatar-decoration-img'); - - previewHolderLeft.innerHTML = ` - - `; - - const imgElement = previewHolderLeft.querySelector("[data-left-preview-deco-var]"); - - if (localStorage.reduced_motion != "true") { - imgElement.addEventListener("mouseenter", () => { - imgElement.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=true`; - }); - - imgElement.addEventListener("mouseleave", () => { - imgElement.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - }); - } - }); - } else if (selectedVariant.type === 1) { - - modal.classList.add("modal-2000-1"); - (async () => { - // Ensure the item ID is accessible here - let itemId = undefined; - if (Array.isArray(selectedVariant.items)) { - // If items is an array, find the item with type 1 and get its id - const item = selectedVariant.items.find(item => item.type === 1); - if (item) { - itemId = item.id; - } - } else if (selectedVariant.items && selectedVariant.items.type === 1) { - // If items is an object and has type 1, get its id - itemId = selectedVariant.items.id; - } - - - if (!discordProfileEffectsCache) { - await setDiscordProfileEffectCache(); - } - - // Find matching profile effect - const matchingEffect = discordProfileEffectsCache.find(effect => effect.id === itemId); - - if (matchingEffect) { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - previewHolder.classList.add('modal-preview-profile-container'); - previewHolder.innerHTML = ` -
-
-
-
- No image uploaded -

${localStorage.discord_displayname}

- -
-
- -
- `; - document.getElementById("modal-username-preview").textContent = localStorage.discord_username.toLowerCase(); - } - } - - previewHolderLeft.classList.add('modal-left-profile-effect-img'); - - previewHolderLeft.innerHTML = ` - - `; - - const imgElement = previewHolderLeft.querySelector("[data-left-preview-effect-var]"); - - if (localStorage.reduced_motion != "true") { - imgElement.addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - imgElement.src = effectUrl || matchingEffect.thumbnailPreviewSrc; - } - }); - - imgElement.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - imgElement.addEventListener("mouseenter", () => { - imgElement.src = matchingEffect.reducedMotionSrc; - }); - - imgElement.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } - })(); - } - - - } else { - if (selectedVariant.type === 0) { - modal.classList.add("modal-2000-0"); - previewHolder.innerHTML = ""; // Clear previous decorations - previewHolder.classList.add('modal-avatar-decoration-img'); - - // Add the avatar decoration based on the selected variant - selectedVariant.items?.forEach(item => { - const decoImage = document.createElement("img"); - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - decoImage.alt = "Avatar Decoration"; - decoImage.id = "shop-card-deco-image"; - previewHolder.appendChild(decoImage); - - // Hover effect for decoration image - if (localStorage.reduced_motion !== "true") { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=true`; - }); - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - }); - } - }); - } else if (selectedVariant.type === 1) { - modal.classList.add("modal-2000-1"); - (async () => { - // Ensure the item ID is accessible here - let itemId = undefined; - if (Array.isArray(selectedVariant.items)) { - // If items is an array, find the item with type 1 and get its id - const item = selectedVariant.items.find(item => item.type === 1); - if (item) { - itemId = item.id; - } - } else if (selectedVariant.items && selectedVariant.items.type === 1) { - // If items is an object and has type 1, get its id - itemId = selectedVariant.items.id; - } - - - // Fetch profile effects API only if not already cached - if (!discordProfileEffectsCache) { - const response = await fetch(api + PROFILE_EFFECTS, { - method: "GET", - headers: { - "Password": api_password, - "Authorization": discord_token, - "Token": api_token - } - }); - const effectsData = await response.json(); - discordProfileEffectsCache = effectsData.profile_effect_configs; - } - - // Find matching profile effect - const matchingEffect = discordProfileEffectsCache.find(effect => effect.id === itemId); - - if (matchingEffect) { - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - previewHolder.classList.add('modal-profile-effect-img'); - - previewHolder.innerHTML = ` - - `; - - // Hover effect: change to the first effect URL (use 'src' from the 'effects' array) - const imgElement = previewHolder.querySelector("img"); - - if (localStorage.reduced_motion != "true") { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - imgElement.src = effectUrl || matchingEffect.thumbnailPreviewSrc; - } - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - imgElement.src = matchingEffect.reducedMotionSrc; - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } - })(); - } - } - } - - // Apply the default variant (first one) initially - if (product.variants.length > 0) { - applyVariant(product.variants[0]); - } - } else if (product.type === item_types.EXTERNAL_SKU) { - modal.classList.add('modal-3000'); - - modal.querySelector("[data-product-modal-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - modal.querySelector("[data-product-modal-name]").textContent = product.name; - modal.querySelector("[data-product-modal-summary]").textContent = product.summary; - - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - - if (product.sku_id === ORB_PROFILE_BADGE) { - previewHolder.classList.add('modal-preview-profile-container'); - previewHolder.innerHTML = ` -
-
-
-
- No image uploaded -

${localStorage.discord_displayname}

- -
-
-
- -
-
- `; - - document.getElementById("modal-username-preview").textContent = localStorage.discord_username.toLowerCase(); - } else if (product.sku_id === NITRO_CREDITS_3_DAYS) { - previewHolder.classList.add('modal-preview-profile-container'); - - previewHolder.innerHTML = ` -
- - -
- -

Custom emojis anywhere

-
-
- -

Custom profile

-
-
- -

500 MB Uploads

-
-
- -

HD video streaming

-
-
- -

Colour app themes and more!

-
-
- `; - } else { - previewHolder.innerHTML = ` -

${getTextString("CARD_TYPE_EXTERNAL_SKU_ERROR")}

- `; - } - - } - - - const priceTextNitro = modal.querySelector("[data-price-nitro]"); - const priceTextStandard = modal.querySelector("[data-price-standard]"); - - const priceContainerNitro = modal.querySelector("[data-price-nitro-container]"); - const priceContainerStandard = modal.querySelector("[data-price-standard-container]"); - - const priceContainer = modal.querySelector("[data-shop-price-container]"); - - let priceStandard = "N/A"; - let priceNitro = "N/A"; - let priceOrb = "N/A"; - - if (localStorage.experiment_2025_02_extra_options && localStorage.experiment_2025_02_extra_options != "Treatment 5: Enabled w/o currency picker" && localStorage.experiment_2025_02_extra_options != "Treatment -1: Disabled") { - if (localStorage.discord_premium_type === "2") { - if (product.prices && product.prices["4"] && product.prices["4"].country_prices && product.prices["4"].country_prices.prices) { - product.prices["4"].country_prices.prices.forEach(price => { - if (price.currency === "usd") { - priceStandard = price.amount; - } - if (price.currency === "discord_orb") { - priceOrb = price.amount; - } - }); - - if (priceStandard != "N/A" && priceOrb != "N/A") { - - let nitro_price = document.createElement("div"); - - nitro_price.innerHTML = ` - US$${(priceStandard / 100).toFixed(2)} -
- `; - nitro_price.style.position = `absolute`; - nitro_price.style.left = `0px`; - - priceContainer.appendChild(nitro_price); - - let orb_price = document.createElement("div"); - - orb_price.innerHTML = ` - ${priceOrb} -
- `; - orb_price.style.position = `absolute`; - orb_price.style.right = `20px`; - - priceContainer.appendChild(orb_price); - - } else if (priceStandard != "N/A") { - - let nitro_price = document.createElement("div"); - - nitro_price.innerHTML = ` - US$${(priceStandard / 100).toFixed(2)} -
- `; - nitro_price.style.position = `absolute`; - nitro_price.style.left = `0px`; - - priceContainer.appendChild(nitro_price); - - } else if (priceOrb != "N/A") { - - let orb_price = document.createElement("div"); - - orb_price.innerHTML = ` - ${priceOrb} -
- `; - orb_price.style.position = `absolute`; - orb_price.style.left = `23px`; - - priceContainer.appendChild(orb_price); - - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_ORB_EXCLUSIVE_TAG")}

-
- `; - - } - } - if (product.prices && product.prices["0"] && product.prices["0"].country_prices && product.prices["0"].country_prices.prices) { - product.prices["0"].country_prices.prices.forEach(price => { - if (price.currency === "usd") { - priceStandard = price.amount; - } - if (price.currency === "discord_orb") { - priceOrb = price.amount; - } - }); - - if (priceStandard != "N/A" && priceOrb != "N/A") { - - let standard_price = document.createElement("div"); - - standard_price.innerHTML = ` - US$${(priceStandard / 100).toFixed(2)} - `; - standard_price.style.position = `absolute`; - standard_price.style.left = `0px`; - standard_price.style.marginTop = `30px`; - - priceContainer.appendChild(standard_price); - - let orb_standard_price = document.createElement("div"); - - orb_standard_price.innerHTML = ` - ${priceOrb} -
- `; - orb_standard_price.style.position = `absolute`; - orb_standard_price.style.right = `20px`; - orb_standard_price.style.marginTop = `30px`; - - priceContainer.appendChild(orb_standard_price); - - } else if (priceStandard != "N/A") { - - let standard_price = document.createElement("div"); - - standard_price.innerHTML = ` - US$${(priceStandard / 100).toFixed(2)} - `; - standard_price.style.position = `absolute`; - standard_price.style.left = `0px`; - standard_price.style.marginTop = `30px`; - - priceContainer.appendChild(standard_price); - - } else if (priceOrb != "N/A") { - - let orb_standard_price = document.createElement("div"); - - orb_standard_price.innerHTML = ` - ${priceOrb} -
- `; - orb_standard_price.style.position = `absolute`; - orb_standard_price.style.left = `23px`; - orb_standard_price.style.marginTop = `30px`; - - priceContainer.appendChild(orb_standard_price); - - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_ORB_EXCLUSIVE_TAG")}

-
- `; - - } - } - } else { - if (product.prices && product.prices["0"] && product.prices["0"].country_prices && product.prices["0"].country_prices.prices) { - product.prices["0"].country_prices.prices.forEach(price => { - if (price.currency === "usd") { - priceStandard = price.amount; - } - if (price.currency === "discord_orb") { - priceOrb = price.amount; - } - }); - - if (priceStandard != "N/A" && priceOrb != "N/A") { - - let standard_price = document.createElement("div"); - - standard_price.innerHTML = ` - US$${(priceStandard / 100).toFixed(2)} - `; - standard_price.style.position = `absolute`; - standard_price.style.left = `0px`; - - priceContainer.appendChild(standard_price); - - let orb_price = document.createElement("div"); - - orb_price.innerHTML = ` - ${priceOrb} -
- `; - orb_price.style.position = `absolute`; - orb_price.style.right = `20px`; - - priceContainer.appendChild(orb_price); - - } else if (priceStandard != "N/A") { - - let nitro_price = document.createElement("div"); - - nitro_price.innerHTML = ` - US$${(priceStandard / 100).toFixed(2)} - `; - nitro_price.style.position = `absolute`; - nitro_price.style.left = `0px`; - - priceContainer.appendChild(nitro_price); - - } else if (priceOrb != "N/A") { - - let orb_price = document.createElement("div"); - - orb_price.innerHTML = ` - ${priceOrb} -
- `; - orb_price.style.position = `absolute`; - orb_price.style.left = `23px`; - - priceContainer.appendChild(orb_price); - - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_ORB_EXCLUSIVE_TAG")}

-
- `; - - } - } - if (product.prices && product.prices["4"] && product.prices["4"].country_prices && product.prices["4"].country_prices.prices) { - product.prices["4"].country_prices.prices.forEach(price => { - if (price.currency === "usd") { - priceStandard = price.amount; - } - if (price.currency === "discord_orb") { - priceOrb = price.amount; - } - }); - - if (priceStandard != "N/A" && priceOrb != "N/A") { - - let standard_price = document.createElement("div"); - - standard_price.innerHTML = ` - US$${(priceStandard / 100).toFixed(2)} -
- `; - standard_price.style.position = `absolute`; - standard_price.style.left = `0px`; - standard_price.style.marginTop = `30px`; - - priceContainer.appendChild(standard_price); - - let orb_standard_price = document.createElement("div"); - - orb_standard_price.innerHTML = ` - ${priceOrb} -
- `; - orb_standard_price.style.position = `absolute`; - orb_standard_price.style.right = `20px`; - orb_standard_price.style.marginTop = `30px`; - - priceContainer.appendChild(orb_standard_price); - - } else if (priceStandard != "N/A") { - - let standard_price = document.createElement("div"); - - standard_price.innerHTML = ` - US$${(priceStandard / 100).toFixed(2)} -
- `; - standard_price.style.position = `absolute`; - standard_price.style.left = `0px`; - standard_price.style.marginTop = `30px`; - - priceContainer.appendChild(standard_price); - - } else if (priceOrb != "N/A") { - - let orb_standard_price = document.createElement("div"); - - orb_standard_price.innerHTML = ` - ${priceOrb} -
- `; - orb_standard_price.style.position = `absolute`; - orb_standard_price.style.left = `23px`; - orb_standard_price.style.marginTop = `30px`; - - priceContainer.appendChild(orb_standard_price); - - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_ORB_EXCLUSIVE_TAG")}

-
- `; - - } - } - } - - } else { - if (product.prices && product.prices["0"] && product.prices["0"].country_prices && product.prices["0"].country_prices.prices) { - product.prices["0"].country_prices.prices.forEach(price => { - if (price.currency === "usd") { - priceStandard = price.amount; - } - }); - } - - if (product.prices && product.prices["4"] && product.prices["4"].country_prices && product.prices["4"].country_prices.prices) { - product.prices["4"].country_prices.prices.forEach(price => { - if (price.currency === "usd") { - priceNitro = price.amount; - } - }); - } - - if (priceTextStandard) { - priceTextStandard.textContent = priceStandard !== "N/A" ? `US$${(priceStandard / 100).toFixed(2)}` : "null"; - } - - if (priceTextNitro) { - priceTextNitro.textContent = priceNitro !== "N/A" ? `US$${(priceNitro / 100).toFixed(2)} with Nitro` : "null"; - } - } - - - const unpublishedAt = new Date(product.unpublished_at); - - if (product.unpublished_at && !isNaN(unpublishedAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = unpublishedAt - now; - - if (timeDiff <= 0) { - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_UNPUBLISHED_TAG")}

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${days}${getTextString("CARD_UNPUBLISHED_COUNTDOWN_TAG")}

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - const ExpiredAt = new Date(product.expires_at); - - if (product.expires_at && !isNaN(ExpiredAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = ExpiredAt - now; - - if (timeDiff <= 0) { - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_EXPIRED_TAG")}

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_EXPIRED_COUNTDOWN_TAG")}${days}${getTextString("CARD_EXPIRED_COUNTDOWN_TAG_DAYS")}${hours}${getTextString("CARD_EXPIRED_COUNTDOWN_TAG_HOURS")}

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - if (product.premium_type === 2) { - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
- `; - } - - if (localStorage.experiment_2025_04_discord_sign_in_dismissible === "Treatment 1: V1" && product.type != 3000) { - - if (localStorage.dismissible_newLogInWithDiscord != "Treatment 1: Seen") { - let newLogInWithDiscordDismissible = document.createElement("div"); - - newLogInWithDiscordDismissible.innerHTML = ` -
- -
-

${getTextString("DISMISSIBLE_CONTENT_NEW_DISCORD_SIGN_IN_MODAL_TITLE")}

-
-

${getTextString("DISMISSIBLE_CONTENT_NEW_DISCORD_SIGN_IN_MODAL_SUMMARY_1")}

-
-

${getTextString("DISMISSIBLE_CONTENT_NEW_DISCORD_SIGN_IN_MODAL_SUMMARY_2")}

-
- -
- - -
-
- `; - - newLogInWithDiscordDismissible.classList.add('newLogInWithDiscordDismissible'); - - newLogInWithDiscordDismissible.id = `newLogInWithDiscordDismissible`; - - modal.appendChild(newLogInWithDiscordDismissible); - } - } - - - - let modal_back = document.createElement("div"); - - modal_back.classList.add('modalv2-back'); - modal_back.id = 'modalv2-back'; - - document.body.appendChild(modal_back); - - setTimeout(() => { - modal_back.classList.add('show'); - }, 1); - - - modal.addEventListener('click', (event) => { - if (event.target === modal) { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - removeParams('itemSkuId'); - modalIsAlreadyOpen = false; - } - }); - - document.querySelector("[data-close-product-card-button]").addEventListener('click', () => { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - }); - } - } - } - - if (localStorage.experiment_2025_03_copy_sku_card === "Treatment 2: w/ share button" || localStorage.experiment_2025_03_copy_sku_card === "Treatment 3: only share button") { - card.querySelector("[data-share-product-card-button]").innerHTML = ` - - `; - } - - - function newItemCheck() { - - if (N > g) { - } else { - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_NEW_TAG")}

-
- `; - } - } - - if (m.includes(product.sku_id)) { - newItemCheck(); - } - - function newColorItemCheck() { - - if (N > newColorsExpireDate) { - } else { - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_NEW_COLORS_TAG")}

-
- `; - } - } - - if (newColorsSKUIDS.includes(product.sku_id) && discord_categories.ANIME_V3 === apiCategory.sku_id) { - newColorItemCheck(); - } - - function popularItemCheck() { - card.classList.add('popular-item'); - } - - if (I.includes(product.sku_id)) { - popularItemCheck(); - } - - - const unpublishedAt = new Date(product.unpublished_at); - - if (product.unpublished_at && !isNaN(unpublishedAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = unpublishedAt - now; - - if (timeDiff <= 0) { - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_UNPUBLISHED_TAG")}

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${days}${getTextString("CARD_UNPUBLISHED_COUNTDOWN_TAG")}

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - const ExpiredAt = new Date(product.expires_at); - - if (product.expires_at && !isNaN(ExpiredAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = ExpiredAt - now; - - if (timeDiff <= 0) { - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_EXPIRED_TAG")}

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_EXPIRED_COUNTDOWN_TAG")}${days}${getTextString("CARD_EXPIRED_COUNTDOWN_TAG_DAYS")}${hours}${getTextString("CARD_EXPIRED_COUNTDOWN_TAG_HOURS")}

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - // Append card to output - cardOutput.append(card); - - scrollToSKU(product.sku_id, 'true'); - } - } - output0.append(category); - - document.getElementById("shop-category-loading-container").innerHTML = ``; - document.getElementById("shop-category-loading-container").style.display = 'none'; - - - const lofi_girl_banner = document.getElementById(discord_categories.LOFI_GIRL); - const kawaii_mode_banner = document.getElementById(discord_categories.KAWAII_MODE); - - if (localStorage.reduced_motion != "true") { - - if (lofi_girl_banner) { // Check if element exists - document.getElementById(`${discord_categories.LOFI_GIRL}-preview-banner-container`).innerHTML = ` - - `; - } - - if (kawaii_mode_banner) { // Check if element exists - document.getElementById('1306330663213072494-preview-banner-container').innerHTML = ` - - `; - } - } - if (kawaii_mode_banner) { // Check if element exists - document.getElementById('1306330663213072494-summary').style.color = 'black'; - } - } else if (apiCategory.type === FEATURED) { - - const featureContainerTemplate = document.querySelector("[data-shop-subblock-container-template]"); - - const featureBlockContainer = featureContainerTemplate.content.cloneNode(true).children[0]; - - apiCategory.subblocks.forEach(subblock => { - - const template = document.querySelector("[data-shop-category-template-sub]"); - - const featureblock = template.content.cloneNode(true).children[0]; - - const oneImage = featureblock.querySelector("[data-shop-preview-image-sub]"); - oneImage.src = subblock.banner_url; - oneImage.alt = subblock.name; - - featureblock.setAttribute("onclick",`setParams({page: '${subblock.page}'}); addParams({scrollTo: '${subblock.sku_id}'}); location.reload();`); - - featureBlockContainer.append(featureblock); - - }); - - output.append(featureBlockContainer); - - } else if (apiCategory.type === WIDE_BANNER) { - - const template = document.querySelector("[data-shop-category-template-wide]"); - - const category = template.content.cloneNode(true).children[0]; - - const oneImage = category.querySelector("[data-shop-preview-image-wide]"); - oneImage.src = apiCategory.banner_url; - oneImage.alt = apiCategory.name; - - const title = category.querySelector("[data-shop-output-wide-title]"); - title.textContent = apiCategory.title; - title.style.color = apiCategory.banner_text_color; - - const desc = category.querySelector("[data-shop-output-wide-desc]"); - desc.textContent = apiCategory.body; - desc.style.color = apiCategory.banner_text_color; - - if (apiCategory.disable_cta != true) { - category.classList.add('clickable'); - } - - category.setAttribute("onclick",`setParams({page: '${apiCategory.page}'}); location.reload();`); - - output.append(category); - } - } - - processCategories() - }); - } - }) - .catch(error => { - console.error('Error fetching the API:', error); - }); - } - } else if (params.get("page") === "pplus-home") { - - fetchFirstHomeData(); - - function fetchFirstHomeData() { - let discordProfileEffectsCache = null; - - fetch(apiUrl, { - method: "GET", - headers: { - "Password": api_password, - "Authorization": discord_token, - "Token": api_token - } - }) - .then(response => response.json()) - .then(data => { - if (data.message === "Missing Access") { - document.getElementById("everything-housing-container").innerHTML = ` -
- -

${getTextString("SHOP_NOT_LOAD_ERROR_1")}

-

${getTextString("SHOP_NOT_LOAD_ERROR_2")}

-

${getTextString("SHOP_NOT_LOAD_ERROR")}${data.message}

- -
- `; - } else { - data.forEach(apiCategory => { - async function processCategories() { - const output = document.querySelector("[data-shop-output]"); - const output0 = document.querySelector("[data-shop-0-output]"); - if (apiCategory.type === HERO) { - const template = document.querySelector("[data-shop-category-template]"); - - const category = template.content.cloneNode(true).children[0]; - - if (apiCategory.hero_banner_asset) { - if (apiCategory.hero_banner_asset.animated != null) { - if (apiCategory.hero_banner_asset.static != null) { - category.querySelector("[data-shop-banner-banner-container]").innerHTML = ` - - - `; - } else { - category.querySelector("[data-shop-banner-banner-container]").innerHTML = ` - - `; - } - } else if (apiCategory.hero_banner_asset.static != null) { - category.querySelector("[data-shop-category-banner-image]").src = `${apiCategory.hero_banner_asset.static}`; - } - } else if (apiCategory.hero_banner != null) { - category.querySelector("[data-shop-category-banner-image]").src = `https://cdn.yapper.shop/assets/${apiCategory.hero_banner}.png`; - category.querySelector("[data-shop-category-banner-image]").alt = apiCategory.name; - } else { - category.querySelector("[data-shop-category-banner-image]").src = `https://cdn.yapper.shop/assets/${apiCategory.banner}.png`; - category.querySelector("[data-shop-category-banner-image]").alt = apiCategory.name; - } - - - if (apiCategory.hero_logo != null) { - category.querySelector("[data-shop-category-logo-image]").src = `https://cdn.yapper.shop/assets/${apiCategory.hero_logo}.png`; - } else if (apiCategory.logo != null) { - category.querySelector("[data-shop-category-logo-image]").src = `https://cdn.yapper.shop/assets/${apiCategory.logo}.png`; - } else { - category.querySelector("[data-shop-category-logo-image]").src = `https://cdn.yapper.shop/assets/31.png`; - } - category.querySelector("[data-shop-category-logo-image]").alt = apiCategory.name; - - category.querySelector("[data-shop-category-desc]").id = `${apiCategory.sku_id}-summary`; - category.querySelector("[data-shop-category-desc]").textContent = apiCategory.summary; - - category.querySelector("[data-preview-banner-container]").id = apiCategory.sku_id; - category.querySelector("[data-shop-banner-banner-container]").id = `${apiCategory.sku_id}-preview-banner-container`; - - if (apiCategory.leaks_type) { - category.querySelector("[data-preview-new-categoey-button]").innerHTML = ` - - `; - } else { - category.querySelector("[data-preview-new-categoey-button]").innerHTML = ` - - `; - } - - const cardOutput = category.querySelector("[data-shop-category-card-holder]"); - if (cardOutput) { - for (const product of apiCategory.products) { - const cardTemplate = document.querySelector("[data-shop-item-card-template]"); - const card = cardTemplate.content.cloneNode(true).children[0]; - - card.id = product.sku_id; - - if (product.type === item_types.NONE) { - card.classList.add("type_100"); - card.classList.add('hidden') - } else if (product.type === item_types.AVATAR_DECORATION) { - product.items.forEach(item => { - card.classList.add("type_0"); - // Set the innerHTML for the preview holder - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - previewHolder.classList.add('avatar-decoration-image'); - - // Set the initial image for the deco card - const imgElement = document.createElement("img"); - imgElement.id = "shop-card-deco-image"; - imgElement.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/${item.asset}.png`; - - previewHolder.appendChild(imgElement); - - const bgimg = document.createElement("div"); - bgimg.id = "shop-card-deco-bg-image"; - - previewHolder.appendChild(bgimg); - - // Set the product details - card.querySelector("[data-product-card-sku-id]").textContent = `${getTextString("CARD_PPLUS_MADE_BY")}${product.credits}`; - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - // Hover effect: Change the image src on mouse enter and leave - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - imgElement.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/a_${item.asset}.png`; - if (localStorage.discord_avatar != defaultAvatar1 && localStorage.discord_avatar != defaultAvatar2 && localStorage.discord_avatar != defaultAvatar3 && localStorage.discord_avatar != defaultAvatar4 && localStorage.discord_avatar != defaultAvatar5 && localStorage.discord_avatar != defaultAvatar6) { - bgimg.style.backgroundImage = `url(${localStorage.discord_avatar})` - } - }); - - card.addEventListener("mouseleave", () => { - imgElement.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/${item.asset}.png`; - bgimg.style.backgroundImage = `url(data:image/png;base64,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)`; - }); - } - }); - } else if (product.type === item_types.PROFILE_EFFECT) { - card.classList.add("type_1"); - - card.querySelector("[data-product-card-sku-id]").textContent = `${getTextString("CARD_PPLUS_MADE_BY")}${product.credits}`; - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - // Ensure the item ID is accessible here - let itemId = undefined; - if (Array.isArray(product.items)) { - // If items is an array, find the item with type 1 and get its id - const item = product.items.find(item => item.type === 1); - if (item) { - itemId = item.id; - } - } else if (product.items && product.items.type === 1) { - // If items is an object and has type 1, get its id - itemId = product.items.id; - } - - if (!pplusProfileEffectsCache) { - await setPplusProfileEffectCache(); - } - - // Find matching profile effect - const matchingEffect = pplusProfileEffectsCache.find(effect => effect.id === itemId); - - if (matchingEffect) { - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - previewHolder.classList.add('profile-effect-image'); - - previewHolder.innerHTML = ` - - `; - - // Hover effect: change to the first effect URL (use 'src' from the 'effects' array) - const imgElement = card.querySelector("img"); - - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - imgElement.src = effectUrl || matchingEffect.thumbnailPreviewSrc; - } - }); - - card.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - card.addEventListener("mouseenter", () => { - imgElement.src = matchingEffect.reducedMotionSrc; - }); - - card.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } - } else if (product.type === item_types.NAMEPLATE) { - card.classList.add("type_2"); - - card.querySelector("[data-product-card-sku-id]").textContent = `${getTextString("CARD_PPLUS_MADE_BY")}${product.credits}`; - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - - if (localStorage.discord_displayname && localStorage.discord_displayname != '') { - previewName = localStorage.discord_displayname; - } else { - previewName = 'Default User' - } - - previewHolder.innerHTML = ` -
-
-
-
-
-
-
-
-
-
-
-
-
- -
-

${previewName}

-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- `; - - product.items.forEach(item => { - const nameplatePreview = previewHolder.querySelector("[data-user-nameplate-preview]"); - const paletteName = item.palette; - const asset = `https://cdn.yapper.shop/custom-collectibles/${item.asset}.png`; - const bgcolor = nameplate_palettes[paletteName].darkBackground; - - previewHolder.querySelector("[data-user-nameplate-preview-img]").src = asset; - - nameplatePreview.style.backgroundImage = `linear-gradient(10deg, #00000000 40%, ${bgcolor} 180%), linear-gradient(170deg, #00000000 40%, ${bgcolor} 180%)`; - // nameplatePreview.style.boxShadow = `0 0 0 1px #a10606`; - - const nullUserNameRandomWidth = previewHolder.querySelectorAll("[data-null-user-random-name]"); - - nullUserNameRandomWidth.forEach(UserName => { - const randomWidth = Math.floor(Math.random() * (180 - 80 + 1)) + 80; - UserName.style.width = randomWidth + `px`; - }); - - const nullUserAvatar = previewHolder.querySelectorAll("[data-nameplate-user-random-avatar]"); - - nullUserAvatar.forEach(UserAvatar => { - UserAvatar.style.backgroundImage = `url(${localStorage.discord_avatar})`; - }); - }); - - } else if (product.type === item_types.BUNDLE) { - card.classList.add("type_1000"); - // Fetch the bundled products for the bundle summary - const bundledProducts = product.bundled_products || []; - - // Generate the bundle summary from the names of the bundled products - const type0Product = bundledProducts.find(item => item.type === 0); - const type1Product = bundledProducts.find(item => item.type === 1); - - let bundleSummary = `${getTextString("CARD_TYPE_BUNDLE_TITLE")}`; - if (type0Product) { - bundleSummary += `${type0Product.name}${getTextString("CARD_TYPE_BUNDLE_TITLE_DECO")}`; - } - if (type1Product) { - bundleSummary += `${type1Product.name}${getTextString("CARD_TYPE_BUNDLE_TITLE_EFFECT")}`; - } - - // Set the summary text - card.querySelector("[data-product-card-summary]").textContent = bundleSummary; - - // Set the basic card details - card.querySelector("[data-product-card-sku-id]").textContent = `${getTextString("CARD_PPLUS_MADE_BY")}${product.credits}`; - card.querySelector("[data-product-card-name]").textContent = product.name; - - // Handle each item in the bundle - product.items.forEach(item => { - if (item.type === 0) { - // Avatar decoration - const decoImage = document.createElement("img"); - decoImage.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/${item.asset}.png`; - decoImage.alt = "Avatar Decoration"; - decoImage.classList.add("avatar-decoration-image"); - card.querySelector("[data-shop-card-preview-holder]").appendChild(decoImage); - - const bgimg = document.createElement("div"); - bgimg.classList.add("avatar-decoration-bg-image"); - - card.querySelector("[data-shop-card-preview-holder]").appendChild(bgimg); - - // Hover effect for decoration image - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - decoImage.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/a_${item.asset}.png`; - if (localStorage.discord_avatar != defaultAvatar1 && localStorage.discord_avatar != defaultAvatar2 && localStorage.discord_avatar != defaultAvatar3 && localStorage.discord_avatar != defaultAvatar4 && localStorage.discord_avatar != defaultAvatar5 && localStorage.discord_avatar != defaultAvatar6) { - bgimg.style.backgroundImage = `url(${localStorage.discord_avatar})` - } - }); - card.addEventListener("mouseleave", () => { - decoImage.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/${item.asset}.png`; - bgimg.style.backgroundImage = `url(data:image/png;base64,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)`; - }); - } - } else if (item.type === 1) { - // Profile effect - - (async () => { - - if (!pplusProfileEffectsCache) { - await setPplusProfileEffectCache(); - } - - const matchingEffect = pplusProfileEffectsCache.find(effect => effect.id === item.id); - - if (matchingEffect) { - const effectImage = document.createElement("img"); - effectImage.src = matchingEffect.thumbnailPreviewSrc; - effectImage.alt = "Profile Effect"; - effectImage.classList.add("profile-effect-image"); - card.querySelector("[data-shop-card-preview-holder]").appendChild(effectImage); - - // Hover effect for profile effect - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects[0] && matchingEffect.effects[0].src) { - effectImage.src = matchingEffect.effects[0].src; - } - }); - card.addEventListener("mouseleave", () => { - effectImage.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - card.addEventListener("mouseenter", () => { - effectImage.src = matchingEffect.reducedMotionSrc; - }); - card.addEventListener("mouseleave", () => { - effectImage.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } - })(); - } - }); - } else if (product.type === item_types.VARIANTS_GROUP) { - // Update SKU and summary - card.querySelector("[data-product-card-sku-id]").textContent = `${getTextString("CARD_PPLUS_MADE_BY")}${product.credits}`; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - // Always display the base variant name - card.querySelector("[data-product-card-name]").textContent = product.variants[0]?.base_variant_name || "Product"; - - // Render variant color blocks as interactive divs - const variantContainer = card.querySelector("[data-shop-card-var-container]"); - variantContainer.innerHTML = ""; // Clear existing variant blocks - let currentSelectedVariant = null; // Track selected variant - - product.variants.forEach((variant, index) => { - // Create variant color block - const variantColorBlockTmp = document.querySelector("[data-shop-varcolorblock-template]"); - const variantColorBlock = variantColorBlockTmp.content.cloneNode(true).children[0]; - variantColorBlock.classList.add("shop-card-var"); - variantColorBlock.id = "shop-card-var"; - variantColorBlock.style.backgroundColor = `${variant.variant_value}`; - - // Add click event listener to switch variants - variantColorBlock.addEventListener("click", () => { - if (currentSelectedVariant) { - currentSelectedVariant.classList.remove("shop-card-var-selected"); - } - variantColorBlock.classList.add("shop-card-var-selected"); - currentSelectedVariant = variantColorBlock; - applyVariant(variant); - }); - - // Append the color block to the container - variantContainer.appendChild(variantColorBlock); - - // Set the first variant as the default selected - if (index === 0) { - currentSelectedVariant = variantColorBlock; - variantColorBlock.classList.add("shop-card-var-selected"); - } - }); - - let isFirstTimeLoadingVariant = true; - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - - // Function to apply the selected variant - function applyVariant(selectedVariant) { - card.querySelector("[data-shop-card-var-title]").textContent = `(${selectedVariant.variant_label})`; - if (selectedVariant.type === 0) { - card.classList.add("type_2000-0"); - previewHolder.innerHTML = ""; // Clear previous decorations - previewHolder.classList.add('avatar-decoration-image'); - - // Add the avatar decoration based on the selected variant - selectedVariant.items?.forEach(item => { - const decoImage = document.createElement("img"); - const bgimg = document.createElement("div"); - if (isFirstTimeLoadingVariant == true) { - decoImage.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/${item.asset}.png`; - isFirstTimeLoadingVariant = false; - } else { - decoImage.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/a_${item.asset}.png`; - if (localStorage.discord_avatar != defaultAvatar1 && localStorage.discord_avatar != defaultAvatar2 && localStorage.discord_avatar != defaultAvatar3 && localStorage.discord_avatar != defaultAvatar4 && localStorage.discord_avatar != defaultAvatar5 && localStorage.discord_avatar != defaultAvatar6) { - bgimg.style.backgroundImage = `url(${localStorage.discord_avatar})` - } - } - decoImage.alt = "Avatar Decoration"; - decoImage.id = "shop-card-deco-image"; - previewHolder.appendChild(decoImage); - - bgimg.id = "shop-card-deco-bg-image"; - - previewHolder.appendChild(bgimg); - - // Hover effect for decoration image - if (localStorage.reduced_motion !== "true") { - card.addEventListener("mouseenter", () => { - decoImage.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/a_${item.asset}.png`; - if (localStorage.discord_avatar != defaultAvatar1 && localStorage.discord_avatar != defaultAvatar2 && localStorage.discord_avatar != defaultAvatar3 && localStorage.discord_avatar != defaultAvatar4 && localStorage.discord_avatar != defaultAvatar5 && localStorage.discord_avatar != defaultAvatar6) { - bgimg.style.backgroundImage = `url(${localStorage.discord_avatar})` - } - }); - card.addEventListener("mouseleave", () => { - decoImage.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/${item.asset}.png`; - bgimg.style.backgroundImage = `url(data:image/png;base64,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)`; - }); - } - }); - } else if (selectedVariant.type === 1) { - card.classList.add("type_2000-1"); - (async () => { - // Ensure the item ID is accessible here - let itemId = undefined; - if (Array.isArray(selectedVariant.items)) { - // If items is an array, find the item with type 1 and get its id - const item = selectedVariant.items.find(item => item.type === 1); - if (item) { - itemId = item.id; - } - } else if (selectedVariant.items && selectedVariant.items.type === 1) { - // If items is an object and has type 1, get its id - itemId = selectedVariant.items.id; - } - - if (!pplusProfileEffectsCache) { - await setPplusProfileEffectCache(); - } - - // Find matching profile effect - const matchingEffect = pplusProfileEffectsCache.find(effect => effect.id === itemId); - - if (matchingEffect) { - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - previewHolder.classList.add('profile-effect-image'); - - if (isFirstTimeLoadingVariant == true) { - previewHolder.innerHTML = ` - - `; - isFirstTimeLoadingVariant = false; - } else { - previewHolder.innerHTML = ` - - `; - } - - // Hover effect: change to the first effect URL (use 'src' from the 'effects' array) - const imgElement = card.querySelector("img"); - - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - imgElement.src = effectUrl || matchingEffect.thumbnailPreviewSrc; - } - }); - - card.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - card.addEventListener("mouseenter", () => { - imgElement.src = matchingEffect.reducedMotionSrc; - }); - - card.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } - })(); - } - } - - // Apply the default variant (first one) initially - if (product.variants.length > 0) { - applyVariant(product.variants[0]); - } - } else if (product.type === item_types.EXTERNAL_SKU) { - card.classList.add("type_3000"); - - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - card.querySelector("[data-product-card-sku-id]").textContent = ``; - } else { - card.querySelector("[data-product-card-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - } - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - - previewHolder.innerHTML = ` -

${getTextString("CARD_TYPE_EXTERNAL_SKU_ERROR")}

- `; - - } else if (product.type === 'plus_more') { - card.querySelector("[data-product-card-sku-id]").textContent = ``; - card.querySelector("[data-product-card-name]").textContent = `${getTextString("CARD_TYPE_PLUS_MORE_TITLE")}`; - card.querySelector("[data-product-card-summary]").textContent = `${getTextString("CARD_TYPE_PLUS_MORE_DESC")}`; - - card.querySelector("[data-shop-price-container]").innerHTML = ``; - card.querySelector("[data-product-card-open-in-shop]").innerHTML = ``; - card.querySelector("[data-share-product-card-button]").innerHTML = ``; - - const plusMoreQuestionMark = document.createElement("img"); - plusMoreQuestionMark.src = `https://cdn.discordapp.com/assets/server_products/storefront/question-mark.png`; - plusMoreQuestionMark.classList.add("plus-more-question-mark"); - card.querySelector("[data-shop-card-preview-holder]").appendChild(plusMoreQuestionMark); - - // Hover effect for decoration image - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - plusMoreQuestionMark.src = `https://cdn.discordapp.com/assets/server_products/storefront/question-mark.gif`; - }); - card.addEventListener("mouseleave", () => { - plusMoreQuestionMark.src = `https://cdn.discordapp.com/assets/server_products/storefront/question-mark.png`; - }); - } - } else { - card.classList.add('hidden') - } - - - - if (localStorage.experiment_2025_03_copy_sku_card === "Treatment 1: Enabled" || localStorage.experiment_2025_03_copy_sku_card === "Treatment 2: w/ share button") { - if (product.emojiCopy === null && product.type != 'plus_more') { - card.querySelector("[data-product-card-open-in-shop]").innerHTML = ` -
- - -
- `; - } else if (product.type != 'plus_more') { - card.querySelector("[data-product-card-open-in-shop]").innerHTML = ` -
- - -
- `; - } - } else { - if (product.emojiCopy === null && product.type != 'plus_more') { - card.querySelector("[data-product-card-open-in-shop]").innerHTML = ` - - `; - } else if (product.type != 'plus_more') { - card.querySelector("[data-product-card-open-in-shop]").innerHTML = ` - - `; - } - } - - if (product.premium_type === 2) { - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
- `; - } - - - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - if (product.type === item_types.AVATAR_DECORATION || product.type === item_types.PROFILE_EFFECT || product.type === item_types.NAMEPLATE || product.type === item_types.BUNDLE || product.type === item_types.VARIANTS_GROUP) { - card.classList.add('clickable'); - - card.addEventListener("click", (event) => { - if (event.target.matches("[data-shop-card-var]") || event.target.matches(".card-button") || event.target.matches(".shareIcon_f4a996")) { - } else { - openItemModal(); - addParams({itemSkuId: product.sku_id}) - } - }); - - const itemSKUForScroll = params.get("itemSkuId"); - - if (itemSKUForScroll === product.sku_id && modalIsAlreadyOpen != true) { - modalIsAlreadyOpen = true; - setTimeout(() => { - openItemModal(); - }, 1000); - } - - async function openItemModal() { - let modal = document.createElement("div"); - - modal.classList.add('modalv2'); - - if (apiCategory.pdp_bg != null) { - pdp = apiCategory.pdp_bg - } else { - pdp = apiCategory.banner - } - - modal.innerHTML = ` -
-
-
-

-

-

-

-
-
- -
-
-
- -
-
- -
-
-
-
-
-
- -
- -
-
- -
-
-
- -
- -
-
-
- `; - - document.body.appendChild(modal); - - setTimeout(() => { - modal.classList.add('show'); - }, 1); - - if (product.type === item_types.AVATAR_DECORATION) { - - modal.classList.add('modal-0'); - - product.items.forEach(item => { - - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - const previewHolderLeft = modal.querySelector("[data-modal-left-preview-holder]"); - - modal.querySelector("[data-product-modal-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - modal.querySelector("[data-product-modal-credits]").textContent = `Made By: ${product.credits}`; - modal.querySelector("[data-product-modal-name]").textContent = product.name; - modal.querySelector("[data-product-modal-summary]").textContent = product.summary; - - if (localStorage.experiment_2025_02_extra_options && localStorage.experiment_2025_02_extra_options != "Treatment 5: Enabled w/o currency picker" && localStorage.experiment_2025_02_extra_options != "Treatment -1: Disabled") { - - previewHolder.classList.add('modal-preview-profile-container'); - previewHolder.innerHTML = ` -
-
-
-
- No image uploaded -

${localStorage.discord_displayname}

- - -
-
-
- `; - - document.getElementById("modal-username-preview").textContent = localStorage.discord_username.toLowerCase(); - - previewHolderLeft.classList.add('modal-left-avatar-decoration-img'); - - const imgElement = document.createElement("img"); - imgElement.id = "shop-card-deco-image"; - imgElement.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/${item.asset}.png`; - - previewHolderLeft.appendChild(imgElement); - - if (localStorage.reduced_motion != "true") { - imgElement.addEventListener("mouseenter", () => { - imgElement.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/a_${item.asset}.png`; - }); - - imgElement.addEventListener("mouseleave", () => { - imgElement.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/${item.asset}.png`; - }); - } - - } else { - - previewHolder.classList.add('modal-avatar-decoration-img'); - - const imgElement = document.createElement("img"); - imgElement.id = "shop-card-deco-image"; - imgElement.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/${item.asset}.png`; - - previewHolder.appendChild(imgElement); - - // Hover effect: Change the image src on mouse enter and leave - if (localStorage.reduced_motion != "true") { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - imgElement.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/a_${item.asset}.png`; - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - imgElement.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/${item.asset}.png`; - }); - } - } - - }); - } else if (product.type === item_types.PROFILE_EFFECT) { - modal.classList.add('modal-1'); - - modal.querySelector("[data-product-modal-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - modal.querySelector("[data-product-modal-credits]").textContent = `Made By: ${product.credits}`; - modal.querySelector("[data-product-modal-name]").textContent = product.name; - modal.querySelector("[data-product-modal-summary]").textContent = product.summary; - - // Ensure the item ID is accessible here - let itemId = undefined; - if (Array.isArray(product.items)) { - // If items is an array, find the item with type 1 and get its id - const item = product.items.find(item => item.type === 1); - if (item) { - itemId = item.id; - } - } else if (product.items && product.items.type === 1) { - // If items is an object and has type 1, get its id - itemId = product.items.id; - } - - // Find matching profile effect - const matchingEffect = pplusProfileEffectsCache.find(effect => effect.id === itemId); - - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - const previewHolderLeft = modal.querySelector("[data-modal-left-preview-holder]"); - - if (matchingEffect) { - if (localStorage.experiment_2025_02_extra_options && localStorage.experiment_2025_02_extra_options != "Treatment 5: Enabled w/o currency picker" && localStorage.experiment_2025_02_extra_options != "Treatment -1: Disabled") { - previewHolder.classList.add('modal-preview-profile-container'); - previewHolder.innerHTML = ` -
-
-
-
- No image uploaded -

${localStorage.discord_displayname}

- -
-
- -
- `; - - document.getElementById("modal-username-preview").textContent = localStorage.discord_username.toLowerCase(); - - previewHolderLeft.classList.add('modal-left-profile-effect-img'); - - const imgElement = document.createElement("img"); - imgElement.src = matchingEffect.thumbnailPreviewSrc; - - previewHolderLeft.appendChild(imgElement); - - if (localStorage.reduced_motion != "true") { - imgElement.addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - imgElement.src = effectUrl || matchingEffect.thumbnailPreviewSrc; - } - }); - - imgElement.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - imgElement.addEventListener("mouseenter", () => { - imgElement.src = matchingEffect.reducedMotionSrc; - }); - - imgElement.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } else { - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - previewHolder.classList.add('modal-profile-effect-img'); - - previewHolder.innerHTML = ` - - `; - - // Hover effect: change to the first effect URL (use 'src' from the 'effects' array) - const imgElement = previewHolder.querySelector("img"); - - if (localStorage.reduced_motion != "true") { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - imgElement.src = effectUrl || matchingEffect.thumbnailPreviewSrc; - } - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - imgElement.src = matchingEffect.reducedMotionSrc; - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } - } - } else if (product.type === item_types.NAMEPLATE) { - card.classList.add("modal-2"); - - modal.querySelector("[data-product-modal-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - modal.querySelector("[data-product-modal-name]").textContent = product.name; - modal.querySelector("[data-product-modal-summary]").textContent = product.summary; - - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - previewHolder.classList.add('nameplate-modal-preview'); - - if (localStorage.discord_displayname && localStorage.discord_displayname != '') { - previewName = localStorage.discord_displayname; - } else { - previewName = 'Default User' - } - - if (localStorage.experiment_2025_03_early_nameplate_warning === "Treatment 2: Nameplate & Nameplate Test Warning" && product.category_sku_id === discord_categories.NAMEPLATE) { - let nameplateWarning = document.createElement("div"); - - nameplateWarning.classList.add('nameplate-modal-early-warning-container'); - nameplateWarning.innerHTML = ` -

${getTextString("SHOP_NAMEPLATE_WARNING_NOTICE_1")}

- `; - - modal.querySelector(".modalv2-inner-left").appendChild(nameplateWarning); - } else if (localStorage.experiment_2025_03_early_nameplate_warning === "Treatment 1: Nameplate Test Warning" || localStorage.experiment_2025_03_early_nameplate_warning === "Treatment 2: Nameplate & Nameplate Test Warning") { - if (product.category_sku_id === discord_categories.NAMEPLATE_TEST) { - let nameplateWarning = document.createElement("div"); - - nameplateWarning.classList.add('nameplate-modal-early-warning-container'); - nameplateWarning.innerHTML = ` -

${getTextString("SHOP_NAMEPLATE_WARNING_NOTICE_2")}

- `; - - modal.querySelector(".modalv2-inner-left").appendChild(nameplateWarning); - } - } - - previewHolder.innerHTML = ` -
-
-
-
-
-
-
-
-
-
-
-
-
- -
-

${previewName}

-
-
-
-
-
-
-
-
-
-
-
-
-
- `; - - product.items.forEach(item => { - const nameplatePreview = previewHolder.querySelector("[data-user-nameplate-preview]"); - const paletteName = item.palette; - const asset = `https://cdn.discordapp.com/assets/collectibles/${item.asset}img.png`; - const bgcolor = nameplate_palettes[paletteName].darkBackground; - - previewHolder.querySelector("[data-user-nameplate-preview-img]").src = asset; - - nameplatePreview.style.backgroundImage = `linear-gradient(10deg, #00000000 40%, ${bgcolor} 180%), linear-gradient(170deg, #00000000 40%, ${bgcolor} 180%)`; - // nameplatePreview.style.boxShadow = `0 0 0 1px #a10606`; - - const nullUserNameRandomWidth = previewHolder.querySelectorAll("[data-null-user-random-name]"); - - nullUserNameRandomWidth.forEach(UserName => { - const randomWidth = Math.floor(Math.random() * (180 - 80 + 1)) + 80; - UserName.style.width = randomWidth + `px`; - }); - - const nullUserAvatar = previewHolder.querySelectorAll("[data-nameplate-user-random-avatar]"); - - nullUserAvatar.forEach(UserAvatar => { - UserAvatar.style.backgroundImage = `url(${localStorage.discord_avatar})`; - }); - }); - - } else if (product.type === item_types.BUNDLE) { - modal.classList.add('modal-1000'); - - const bundledProducts = product.bundled_products || []; - - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - - // Generate the bundle summary from the names of the bundled products - const type0Product = bundledProducts.find(item => item.type === 0); - const type1Product = bundledProducts.find(item => item.type === 1); - - let bundleSummary = "Bundle Includes: "; - if (type0Product) { - bundleSummary += `${type0Product.name} Decoration`; - } - if (type1Product) { - bundleSummary += ` & ${type1Product.name} Profile Effect`; - } - - // Set the summary text - modal.querySelector("[data-product-modal-summary]").textContent = bundleSummary; - - // Set the basic card details - modal.querySelector("[data-product-modal-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - modal.querySelector("[data-product-modal-credits]").textContent = `Made By: ${product.credits}`; - modal.querySelector("[data-product-modal-name]").textContent = product.name; - - // Handle each item in the bundle - product.items.forEach(item => { - if (localStorage.experiment_2025_02_extra_options && localStorage.experiment_2025_02_extra_options != "Treatment 5: Enabled w/o currency picker" && localStorage.experiment_2025_02_extra_options != "Treatment -1: Disabled") { - - if (item.type === 0) { - decosrc = item.asset - } else if (item.type === 1) { - // Profile effect - (async () => { - - // Find the matching effect - const matchingEffect = pplusProfileEffectsCache.find(effect => effect.id === item.id); - - if (matchingEffect) { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - renderProfile(effectUrl) - } - } - })(); - } - - function renderProfile(effectUrl) { - previewHolder.classList.add('modal-preview-profile-container'); - previewHolder.innerHTML = ` -
-
-
-
- No image uploaded -

${localStorage.discord_displayname}

- - -
-
- -
- `; - document.getElementById("modal-username-preview").textContent = localStorage.discord_username.toLowerCase(); - } - - - } else { - if (item.type === 0) { - const decoImage = document.createElement("img"); - decoImage.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/${item.asset}.png`; - decoImage.alt = "Avatar Decoration"; - decoImage.classList.add("modal-avatar-decoration-img"); - modal.querySelector("[data-modal-preview-holder]").appendChild(decoImage); - - // Hover effect for decoration image - if (localStorage.reduced_motion != "true") { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - decoImage.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/a_${item.asset}.png`; - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - decoImage.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/${item.asset}.png`; - }); - } - } else if (item.type === 1) { - // Profile effect - (async () => { - // Fetch profile effects if not cached - if (!discordProfileEffectsCache) { - const response = await fetch(api + PROFILE_EFFECTS, { - method: "GET", - headers: { - "Password": api_password, - "Authorization": discord_token, - "Token": api_token - } - }); - const effectsData = await response.json(); - discordProfileEffectsCache = effectsData.profile_effect_configs; - } - - // Find the matching effect - const matchingEffect = discordProfileEffectsCache.find(effect => effect.id === item.id); - - if (matchingEffect) { - const effectImage = document.createElement("img"); - effectImage.src = matchingEffect.thumbnailPreviewSrc; - effectImage.alt = "Profile Effect"; - effectImage.classList.add("modal-profile-effect-img"); - modal.querySelector("[data-modal-preview-holder]").appendChild(effectImage); - - // Hover effect for profile effect - if (localStorage.reduced_motion != "true") { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - effectImage.src = effectUrl || matchingEffect.thumbnailPreviewSrc; - } - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - effectImage.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - effectImage.src = matchingEffect.reducedMotionSrc; - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - effectImage.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } - })(); - } - } - }); - } else if (product.type === item_types.VARIANTS_GROUP) { - modal.querySelector("[data-shop-modal-var-container-container]").classList.add('show'); - // Update SKU and summary - modal.querySelector("[data-product-modal-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - modal.querySelector("[data-product-modal-credits]").textContent = `Made By: ${product.credits}`; - modal.querySelector("[data-product-modal-summary]").textContent = product.summary; - - // Always display the base variant name - modal.querySelector("[data-product-modal-name]").textContent = product.variants[0]?.base_variant_name || "Product"; - - // Render variant color blocks as interactive divs - const variantContainer = modal.querySelector("[data-shop-modal-var-container]"); - variantContainer.innerHTML = ""; // Clear existing variant blocks - let currentSelectedVariant = null; // Track selected variant - - product.variants.forEach((variant, index) => { - // Create variant color block - const variantColorBlock = document.createElement("div"); - variantColorBlock.classList.add("shop-card-var"); - variantColorBlock.style.backgroundColor = `${variant.variant_value}`; - - // Add click event listener to switch variants - variantColorBlock.addEventListener("click", () => { - if (currentSelectedVariant) { - currentSelectedVariant.classList.remove("shop-card-var-selected"); - } - variantColorBlock.classList.add("shop-card-var-selected"); - currentSelectedVariant = variantColorBlock; - applyVariant(variant); - }); - - // Append the color block to the container - variantContainer.appendChild(variantColorBlock); - - // Set the first variant as the default selected - if (index === 0) { - currentSelectedVariant = variantColorBlock; - variantColorBlock.classList.add("shop-card-var-selected"); - } - }); - - let isFirstTimeLoadingVariant = true; - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - const previewHolderLeft = modal.querySelector("[data-modal-left-preview-holder]"); - - // Function to apply the selected variant - function applyVariant(selectedVariant) { - modal.querySelector("[data-shop-modal-var-title]").textContent = `(${selectedVariant.variant_label})`; - modal.querySelector("[data-product-modal-sku-id]").textContent = `SKU ID: ${selectedVariant.sku_id}`; - modal.querySelector("[data-product-modal-credits]").textContent = `Made By: ${selectedVariant.credits}`; - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - modal.querySelector("[data-download-product-card-button]").innerHTML = ` - - `; - } - if (localStorage.experiment_2025_02_extra_options && localStorage.experiment_2025_02_extra_options != "Treatment 5: Enabled w/o currency picker" && localStorage.experiment_2025_02_extra_options != "Treatment -1: Disabled") { - - if (selectedVariant.type === 0) { - selectedVariant.items?.forEach(item => { - previewHolder.classList.add('modal-preview-profile-container'); - previewHolder.innerHTML = ` -
-
-
-
- No image uploaded -

${localStorage.discord_displayname}

- - -
-
-
- `; - document.getElementById("modal-username-preview").textContent = localStorage.discord_username.toLowerCase(); - - previewHolderLeft.classList.add('modal-left-avatar-decoration-img'); - - previewHolderLeft.innerHTML = ` - - `; - - const imgElement = previewHolderLeft.querySelector("[data-left-preview-deco-var]"); - - if (localStorage.reduced_motion != "true") { - imgElement.addEventListener("mouseenter", () => { - imgElement.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/a_${item.asset}.png`; - }); - - imgElement.addEventListener("mouseleave", () => { - imgElement.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/${item.asset}.png`; - }); - } - }); - } else if (selectedVariant.type === 1) { - - modal.classList.add("modal-2000-1"); - (async () => { - // Ensure the item ID is accessible here - let itemId = undefined; - if (Array.isArray(selectedVariant.items)) { - // If items is an array, find the item with type 1 and get its id - const item = selectedVariant.items.find(item => item.type === 1); - if (item) { - itemId = item.id; - } - } else if (selectedVariant.items && selectedVariant.items.type === 1) { - // If items is an object and has type 1, get its id - itemId = selectedVariant.items.id; - } - - // Find matching profile effect - const matchingEffect = pplusProfileEffectsCache.find(effect => effect.id === itemId); - - if (matchingEffect) { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - previewHolder.classList.add('modal-preview-profile-container'); - previewHolder.innerHTML = ` -
-
-
-
- No image uploaded -

${localStorage.discord_displayname}

- -
-
- -
- `; - document.getElementById("modal-username-preview").textContent = localStorage.discord_username.toLowerCase(); - } - } - - previewHolderLeft.classList.add('modal-left-profile-effect-img'); - - previewHolderLeft.innerHTML = ` - - `; - - const imgElement = previewHolderLeft.querySelector("[data-left-preview-effect-var]"); - - if (localStorage.reduced_motion != "true") { - imgElement.addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - imgElement.src = effectUrl || matchingEffect.thumbnailPreviewSrc; - } - }); - - imgElement.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - imgElement.addEventListener("mouseenter", () => { - imgElement.src = matchingEffect.reducedMotionSrc; - }); - - imgElement.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } - })(); - } - - - } else { - if (selectedVariant.type === 0) { - modal.classList.add("modal-2000-0"); - previewHolder.innerHTML = ""; // Clear previous decorations - previewHolder.classList.add('modal-avatar-decoration-img'); - - // Add the avatar decoration based on the selected variant - selectedVariant.items?.forEach(item => { - const decoImage = document.createElement("img"); - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - decoImage.alt = "Avatar Decoration"; - decoImage.id = "shop-card-deco-image"; - previewHolder.appendChild(decoImage); - - // Hover effect for decoration image - if (localStorage.reduced_motion !== "true") { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=true`; - }); - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - }); - } - }); - } else if (selectedVariant.type === 1) { - modal.classList.add("modal-2000-1"); - (async () => { - // Ensure the item ID is accessible here - let itemId = undefined; - if (Array.isArray(selectedVariant.items)) { - // If items is an array, find the item with type 1 and get its id - const item = selectedVariant.items.find(item => item.type === 1); - if (item) { - itemId = item.id; - } - } else if (selectedVariant.items && selectedVariant.items.type === 1) { - // If items is an object and has type 1, get its id - itemId = selectedVariant.items.id; - } - - - // Fetch profile effects API only if not already cached - if (!discordProfileEffectsCache) { - const response = await fetch(api + PROFILE_EFFECTS, { - method: "GET", - headers: { - "Password": api_password, - "Authorization": discord_token, - "Token": api_token - } - }); - const effectsData = await response.json(); - discordProfileEffectsCache = effectsData.profile_effect_configs; - } - - // Find matching profile effect - const matchingEffect = discordProfileEffectsCache.find(effect => effect.id === itemId); - - if (matchingEffect) { - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - previewHolder.classList.add('modal-profile-effect-img'); - - previewHolder.innerHTML = ` - - `; - - // Hover effect: change to the first effect URL (use 'src' from the 'effects' array) - const imgElement = previewHolder.querySelector("img"); - - if (localStorage.reduced_motion != "true") { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - imgElement.src = effectUrl || matchingEffect.thumbnailPreviewSrc; - } - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - imgElement.src = matchingEffect.reducedMotionSrc; - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } - })(); - } - } - } - - // Apply the default variant (first one) initially - if (product.variants.length > 0) { - applyVariant(product.variants[0]); - } - } - - - const button_container = document.querySelector("[data-modal-buttons]"); - - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads") { - modal.querySelector("[data-download-product-card-button]").innerHTML = ` - - `; - } else if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page") { - if (typeof product.emojiCopy != 'undefined') { - button_container.innerHTML = ` - - `; - } else { - button_container.innerHTML = ` - - `; - } - } else if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - if (typeof product.emojiCopy != 'undefined') { - button_container.innerHTML = ` - - `; - modal.querySelector("[data-download-product-card-button]").innerHTML = ` - - `; - } else { - button_container.innerHTML = ` - - `; - modal.querySelector("[data-download-product-card-button]").innerHTML = ` - - `; - } - } else { - button_container.innerHTML = ``; - } - - - const unpublishedAt = new Date(product.unpublished_at); - - if (product.unpublished_at && !isNaN(unpublishedAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = unpublishedAt - now; - - if (timeDiff <= 0) { - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_UNPUBLISHED_TAG")}

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${days}${getTextString("CARD_LEFT_TO_REQUEST_COUNTDOWN_TAG")}

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - - const expiresAt = new Date(product.expires_at); - - if (product.expires_at && !isNaN(expiresAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = expiresAt - now; - - if (timeDiff <= 0) { - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_EXPIRED_TAG")}

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_EXPIRED_COUNTDOWN_TAG")}${days}${getTextString("CARD_EXPIRED_COUNTDOWN_TAG_DAYS")}${hours}${getTextString("CARD_EXPIRED_COUNTDOWN_TAG_HOURS")}

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - const ReleasesAt = new Date(product.releases_at); - - if (product.releases_at && !isNaN(ReleasesAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = ReleasesAt - now; - - if (timeDiff <= 0) { - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_PUBLISHING_TAG")}

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${days}${getTextString("CARD_PUBLISHING_COUNTDOWN_TAG_DAYS")}${hours}${getTextString("CARD_PUBLISHING_COUNTDOWN_TAG_HOURS")}

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - if (product.premium_type === 2) { - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
- `; - } - - if (localStorage.experiment_2025_04_discord_sign_in_dismissible === "Treatment 1: V1" && product.type != 3000) { - - if (localStorage.dismissible_newLogInWithDiscord != "Treatment 1: Seen") { - let newLogInWithDiscordDismissible = document.createElement("div"); - - newLogInWithDiscordDismissible.innerHTML = ` -
- -
-

${getTextString("DISMISSIBLE_CONTENT_NEW_DISCORD_SIGN_IN_MODAL_TITLE")}

-
-

${getTextString("DISMISSIBLE_CONTENT_NEW_DISCORD_SIGN_IN_MODAL_SUMMARY_1")}

-
-

${getTextString("DISMISSIBLE_CONTENT_NEW_DISCORD_SIGN_IN_MODAL_SUMMARY_2")}

-
- -
- - -
-
- `; - - newLogInWithDiscordDismissible.classList.add('newLogInWithDiscordDismissible'); - - newLogInWithDiscordDismissible.id = `newLogInWithDiscordDismissible`; - - modal.appendChild(newLogInWithDiscordDismissible); - } - } - - - - let modal_back = document.createElement("div"); - - modal_back.classList.add('modalv2-back'); - modal_back.id = 'modalv2-back'; - - document.body.appendChild(modal_back); - - setTimeout(() => { - modal_back.classList.add('show'); - }, 1); - - - modal.addEventListener('click', (event) => { - if (event.target === modal) { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - removeParams('itemSkuId'); - modalIsAlreadyOpen = false; - } - }); - - document.querySelector("[data-close-product-card-button]").addEventListener('click', () => { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - }); - } - } else if (product.type === "plus_more") { - card.classList.add('clickable'); - - card.addEventListener("click", (event) => { - if (event.target.matches("[data-shop-card-var]")) { - } else { - openItemModal(); - } - }); - - async function openItemModal() { - let modal = document.createElement("div"); - - modal.classList.add('modalv2'); - - if (apiCategory.pdp_bg != null) { - pdp = apiCategory.pdp_bg - } else { - pdp = apiCategory.banner - } - - modal.innerHTML = ` -
-
-
-

-

-

-

-
-
- -
-
-
- -
-
- -
-
-
-
-
-
- -
- -
-
- -
-
-
- -
- -
-
-
- `; - - document.body.appendChild(modal); - - setTimeout(() => { - modal.classList.add('show'); - }, 1); - - modal.querySelector("[data-product-modal-name]").textContent = `${getTextString("CARD_TYPE_PLUS_MORE_TITLE")}`; - modal.querySelector("[data-product-modal-summary]").textContent = `${getTextString("CARD_TYPE_PLUS_MORE_DESC")}`; - - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - previewHolder.classList.add('modal-plus-more-question-mark-img'); - - const plusMoreQuestionMark = document.createElement("img"); - plusMoreQuestionMark.classList.add("plus-more-question-mark"); - plusMoreQuestionMark.src = `https://cdn.discordapp.com/assets/server_products/storefront/question-mark.png`; - - previewHolder.appendChild(plusMoreQuestionMark); - - if (localStorage.reduced_motion != "true") { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - plusMoreQuestionMark.src = `https://cdn.discordapp.com/assets/server_products/storefront/question-mark.gif`; - }); - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - plusMoreQuestionMark.src = `https://cdn.discordapp.com/assets/server_products/storefront/question-mark.png`; - }); - } - - - const button_container = document.querySelector("[data-modal-buttons]"); - - button_container.innerHTML = ``; - - - const unpublishedAt = new Date(product.unpublished_at); - - if (product.unpublished_at && !isNaN(unpublishedAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = unpublishedAt - now; - - if (timeDiff <= 0) { - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_UNPUBLISHED_TAG")}

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${days}${getTextString("CARD_LEFT_TO_REQUEST_COUNTDOWN_TAG")}

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - - const expiresAt = new Date(product.expires_at); - - if (product.expires_at && !isNaN(expiresAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = expiresAt - now; - - if (timeDiff <= 0) { - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_EXPIRED_TAG")}

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_EXPIRED_COUNTDOWN_TAG")}${days}${getTextString("CARD_EXPIRED_COUNTDOWN_TAG_DAYS")}${hours}${getTextString("CARD_EXPIRED_COUNTDOWN_TAG_HOURS")}

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - const ReleasesAt = new Date(product.releases_at); - - if (product.releases_at && !isNaN(ReleasesAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = ReleasesAt - now; - - if (timeDiff <= 0) { - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_PUBLISHING_TAG")}

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${days}${getTextString("CARD_PUBLISHING_COUNTDOWN_TAG_DAYS")}${hours}${getTextString("CARD_PUBLISHING_COUNTDOWN_TAG_HOURS")}

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - if (product.premium_type === 2) { - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
- `; - } - - - - let modal_back = document.createElement("div"); - - modal_back.classList.add('modalv2-back'); - modal_back.id = 'modalv2-back'; - - document.body.appendChild(modal_back); - - setTimeout(() => { - modal_back.classList.add('show'); - }, 1); - - - modal.addEventListener('click', (event) => { - if (event.target === modal) { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - removeParams('itemSkuId'); - modalIsAlreadyOpen = false; - } - }); - - document.querySelector("[data-close-product-card-button]").addEventListener('click', () => { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - }); - } - } - } - - - const unpublishedAt = new Date(product.unpublished_at); - - if (product.unpublished_at && !isNaN(unpublishedAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = unpublishedAt - now; - - if (timeDiff <= 0) { - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_UNPUBLISHED_TAG")}

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${days}${getTextString("CARD_LEFT_TO_REQUEST_COUNTDOWN_TAG")}

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - - const ExpiredAt = new Date(product.expires_at); - - if (product.expires_at && !isNaN(ExpiredAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = ExpiredAt - now; - - if (timeDiff <= 0) { - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_EXPIRED_TAG")}

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_EXPIRED_COUNTDOWN_TAG")}${days}${getTextString("CARD_EXPIRED_COUNTDOWN_TAG_DAYS")}${hours}${getTextString("CARD_EXPIRED_COUNTDOWN_TAG_HOURS")}

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - const ReleasesAt = new Date(product.releases_at); - - if (product.releases_at && !isNaN(ReleasesAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = ReleasesAt - now; - - if (timeDiff <= 0) { - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_PUBLISHING_TAG")}

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${days}${getTextString("CARD_PUBLISHING_COUNTDOWN_TAG_DAYS")}${hours}${getTextString("CARD_PUBLISHING_COUNTDOWN_TAG_HOURS")}

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - // Append card to output - card.classList.add('shop-category-card-transparent') - cardOutput.append(card); - } - } - - output0.append(category); - - document.getElementById("shop-category-loading-container").innerHTML = ``; - document.getElementById("shop-category-loading-container").style.display = 'none'; - } else if (apiCategory.type === FEATURED) { - - const featureContainerTemplate = document.querySelector("[data-shop-subblock-container-template]"); - - const featureBlockContainer = featureContainerTemplate.content.cloneNode(true).children[0]; - - apiCategory.subblocks.forEach(subblock => { - - const template = document.querySelector("[data-shop-category-template-sub]"); - - const featureblock = template.content.cloneNode(true).children[0]; - - const oneImage = featureblock.querySelector("[data-shop-preview-image-sub]"); - oneImage.src = subblock.banner_url; - oneImage.alt = subblock.name; - - featureblock.setAttribute("onclick",`setParams({page: '${subblock.page}'}); location.reload();`); - - featureBlockContainer.append(featureblock); - - }); - - output.append(featureBlockContainer); - - } else if (apiCategory.type === WIDE_BANNER) { - - const template = document.querySelector("[data-shop-category-template-wide]"); - - const wide_banner = template.content.cloneNode(true).children[0]; - - const oneImage = wide_banner.querySelector("[data-shop-preview-image-wide]"); - oneImage.src = apiCategory.banner_url; - oneImage.alt = apiCategory.name; - - const title = wide_banner.querySelector("[data-shop-output-wide-title]"); - title.textContent = apiCategory.title; - title.style.color = apiCategory.banner_text_color; - - const desc = wide_banner.querySelector("[data-shop-output-wide-desc]"); - desc.textContent = apiCategory.body; - desc.style.color = apiCategory.banner_text_color; - - if (apiCategory.disable_cta != true) { - wide_banner.classList.add('clickable'); - } - - wide_banner.setAttribute("onclick",`setParams({page: '${apiCategory.page}'}); location.reload();`); - - output.append(wide_banner); - } - } - - processCategories() - }); - } - }) - .catch(error => { - console.error('Error fetching the API:', error); - }); - } - } else { - - if (params.get("page") === "consumables") { - createMainPotionsElement() - createPotionsCategoryLoadingElement() - } else { - createMainShopElement() - createShopCategoryLoadingElement() - } - - - // Clear the previous data - clearShopData(); - - // Fetch new data - - // Make the function async - fetch(apiUrl, { - method: "GET", - headers: { - "Password": api_password, - "Authorization": discord_token, - "Token": api_token - } - }) - .then(response => response.json()) - .then((data) => { - - if (data.message === "Missing Access") { - document.getElementById("everything-housing-container").innerHTML = ` -
- -

${getTextString("SHOP_NOT_LOAD_ERROR_1")}

-

${getTextString("SHOP_NOT_LOAD_ERROR_2")}

-

${getTextString("SHOP_NOT_LOAD_ERROR")}${data.message}

- -
- `; - } else if (data.message === "No Leaks") { - document.getElementById("everything-housing-container").innerHTML = ` -
- -

${getTextString("SHOP_NO_LEAKS_ERROR_1")}

-

${getTextString("SHOP_NO_LEAKS_ERROR_2")}

-

${getTextString("SHOP_NOT_LOAD_ERROR")}${data.message}

- -
- `; - } else { - processCategories(); - - if (document.getElementById("top-bar-other-things-container") && localStorage.experiment_2025_04_item_search === "Treatment 1: Enabled") { - document.getElementById("open-help-modals-buttons-holder-new").classList.add("with-search"); - document.getElementById("top-bar-other-things-container").innerHTML = ` - - `; - } - } - // Define async function inside the .then block - async function processCategories() { - const categoryTemplate = document.querySelector("[data-shop-category-template]"); - const potionTemplate = document.querySelector("[data-potion-card-template]"); - const categoryOutput = document.querySelector("[data-shop-output]"); - const page = params.get("page"); - - for (const apiCategory of data) { - if (page === "pplus" || page === "leaks_") { - // Existing code for 'pplus' page - const category = categoryTemplate.content.cloneNode(true).children[0]; - category.querySelector("[data-shop-category-banner]").id = apiCategory.sku_id; - - if (localStorage.experiment_2025_02_shop_category_modals === "Treatment 1: Enable category modals" || localStorage.experiment_2025_02_shop_category_modals === "Treatment 2: Enable category modals w/ data downloads") { - category.querySelector("[data-shop-category-banner]").classList.add('clickable') - } - - if (apiCategory.banner_asset) { - if (apiCategory.banner_asset.animated != null) { - if (apiCategory.banner_asset.static != null) { - category.querySelector("[data-shop-banner-banner-container]").innerHTML = ` - - - `; - } else { - category.querySelector("[data-shop-banner-banner-container]").innerHTML = ` - - `; - } - } else if (apiCategory.banner_asset.static != null) { - category.querySelector("[data-shop-category-banner-image]").src = `${apiCategory.banner_asset.static}`; - } - } else { - category.querySelector("[data-shop-category-banner-image]").src = `https://cdn.yapper.shop/assets/${apiCategory.banner}.png`; - category.querySelector("[data-shop-category-banner-image]").alt = apiCategory.name; - } - - category.querySelector("[data-shop-category-logo-image]").src = `https://cdn.yapper.shop/assets/${apiCategory.logo}.png`; - category.querySelector("[data-shop-category-logo-image]").alt = apiCategory.name; - - category.querySelector("[data-shop-category-desc]").id = `${apiCategory.sku_id}-summary`; - category.querySelector("[data-shop-category-desc]").textContent = apiCategory.summary; - if (apiCategory.banner_text_color && apiCategory.banner_text_color != null) { - category.querySelector("[data-shop-category-desc]").style.color = apiCategory.banner_text_color; - } - - category.querySelector("[data-shop-banner-banner-container]").id = `${apiCategory.sku_id}-banner-banner-container`; - category.querySelector("[data-shop-category-logo-holder]").id = `${apiCategory.sku_id}-logo-container`; - category.querySelector("[data-shop-discord-watermark-container]").id = `${apiCategory.sku_id}-discord-watermark-container`; - - if (apiCategory.category_bg != null) { - category.querySelector("[data-shop-category-marketing-bg]").src = `https://cdn.yapper.shop/assets/${apiCategory.category_bg}.png`; - } - - - if (apiCategory.sku_id === PAPER_BEACH) { - category.querySelector("[data-shop-category-logo-holder]").style.display = 'unset'; - } - if (apiCategory.sku_id === WINDOWKILL_V2) { - category.querySelector("[data-shop-category-logo-holder]").style.display = 'unset'; - } - if (apiCategory.sku_id === FIVE_NIGHTS_AT_FREDDYS) { - category.querySelector("[data-shop-category-logo-holder]").style.display = 'unset'; - } - if (apiCategory.sku_id === PLUS_SPECIAL_EVENT) { - category.querySelector("[data-shop-category-logo-holder]").style.display = 'unset'; - } - if (apiCategory.sku_id === GEOMETRY_DASH) { - category.querySelector("[data-shop-category-logo-holder]").style.display = 'unset'; - } - if (apiCategory.sku_id === PAPER_BEACH_V2) { - category.querySelector("[data-shop-category-logo-holder]").style.display = 'unset'; - } - if (apiCategory.sku_id === HOAX) { - category.querySelector("[data-shop-discord-watermark-container]").style.display = 'unset'; - category.querySelector("[data-shop-category-logo-holder]").style.display = 'unset'; - category.querySelector("[data-shop-category-desc]").style.color = 'black'; - } - - if (localStorage.experiment_2025_02_shop_category_modals === "Treatment 1: Enable category modals" || localStorage.experiment_2025_02_shop_category_modals === "Treatment 2: Enable category modals w/ data downloads") { - category.querySelector("[data-shop-category-banner]").classList.add('clickable'); - - category.querySelector("[data-shop-category-banner]").addEventListener("click", () => { - openCategoryModal(); - addParams({itemSkuId: apiCategory.sku_id}) - }); - - const itemSKUForScroll = params.get("itemSkuId"); - - if (itemSKUForScroll === apiCategory.sku_id && modalIsAlreadyOpen != true) { - modalIsAlreadyOpen = true; - setTimeout(() => { - openCategoryModal(); - }, 1000); - } - - - async function openCategoryModal() { - let modal = document.createElement("div"); - - modal.classList.add('modalv2'); - - modal.innerHTML = ` -
-
-

-

-

-

${getTextString("SHOP_CATEGORY_MODAL_ITEM_COUNT")}${apiCategory.products.length}

-
-
-

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_TAB")}

-
- -
-
-
-
-
-
-
- -
-
-
- `; - - if (localStorage.experiment_2025_04_reviews_v2 === "Treatment 1: Enabled") { - modal.querySelector("[data-shop-category-modal-tabs-tab-button-2]").style.display = 'flex'; - } - - fillCategoryModalContentContainer('assets'); - - const tab_button_1 = modal.querySelector("[data-shop-category-modal-tabs-tab-button-1]"); - const tab_button_2 = modal.querySelector("[data-shop-category-modal-tabs-tab-button-2]"); - - tab_button_1.addEventListener('click', () => { - if (tab_button_2.classList.contains("selected")) { - tab_button_2.classList.remove("selected"); - } - tab_button_1.classList.add("selected"); - fillCategoryModalContentContainer('assets'); - }); - - tab_button_2.addEventListener('click', () => { - if (tab_button_1.classList.contains("selected")) { - tab_button_1.classList.remove("selected"); - } - tab_button_2.classList.add("selected"); - fillCategoryModalContentContainer('reviews'); - }); - - function fillCategoryModalContentContainer(tab) { - if (document.getElementById("shop-category-modal-write-review-container")) { - document.getElementById("shop-category-modal-write-review-container").remove(); - } - if (tab === "assets") { - - modal.querySelector("[data-category-modal-inner-content-container]").innerHTML = ``; - - const asset_container = modal.querySelector("[data-category-modal-inner-content-container]"); - - if (apiCategory.banner != null) { - let banner_asset = document.createElement("div"); - - banner_asset.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_BANNER")}

-

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_ID")}${apiCategory.banner}

- - `; - - asset_container.appendChild(banner_asset); - } - - if (apiCategory.banner_asset && apiCategory.banner_asset.static != null) { - let banner_asset = document.createElement("div"); - - banner_asset.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_BANNER_ASSET_1")}

- - `; - - asset_container.appendChild(banner_asset); - } - - if (apiCategory.banner_asset && apiCategory.banner_asset.animated != null) { - let banner_asset = document.createElement("div"); - - banner_asset.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_BANNER_ASSET_2")}

- - `; - - asset_container.appendChild(banner_asset); - } - - if (apiCategory.logo != null) { - let logo_asset = document.createElement("div"); - - logo_asset.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_LOGO")}

-

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_ID")}${apiCategory.logo}

- - `; - - asset_container.appendChild(logo_asset); - } - - if (apiCategory.mobile_bg != null) { - let mobile_bg_asset = document.createElement("div"); - - mobile_bg_asset.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_MOBILE_BG")}

-

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_ID")}${apiCategory.mobile_bg}

- - `; - - asset_container.appendChild(mobile_bg_asset); - } - - if (apiCategory.pdp_bg != null) { - let pdp_bg_asset = document.createElement("div"); - - pdp_bg_asset.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_PDP_BG")}

-

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_ID")}${apiCategory.pdp_bg}

- - `; - - asset_container.appendChild(pdp_bg_asset); - } - - if (apiCategory.success_modal_bg != null) { - let success_modal_bg_asset = document.createElement("div"); - - success_modal_bg_asset.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_SUCCESS_MODAL_BG")}

-

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_ID")}${apiCategory.success_modal_bg}

- - `; - - asset_container.appendChild(success_modal_bg_asset); - } - - if (apiCategory.mobile_banner != null) { - let mobile_banner_asset = document.createElement("div"); - - mobile_banner_asset.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_MOBILE_BANNER")}

-

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_ID")}${apiCategory.mobile_banner}

- - `; - - asset_container.appendChild(mobile_banner_asset); - } - - if (apiCategory.featured_block != null) { - let featured_block_asset = document.createElement("div"); - - featured_block_asset.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_FEATURED_BLOCK")}

-

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_ID")}${apiCategory.featured_block}

- - `; - - asset_container.appendChild(featured_block_asset); - } - - if (apiCategory.hero_banner != null) { - let hero_banner_asset = document.createElement("div"); - - hero_banner_asset.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_HERO_BANNER")}

-

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_ID")}${apiCategory.hero_banner}

- - `; - - asset_container.appendChild(hero_banner_asset); - } - - if (apiCategory.hero_banner_asset && apiCategory.hero_banner_asset.static != null) { - let hero_banner_asset = document.createElement("div"); - - hero_banner_asset.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_HERO_BANNER_ASSET_1")}

- - `; - - asset_container.appendChild(hero_banner_asset); - } - - if (apiCategory.hero_banner_asset && apiCategory.hero_banner_asset.animated != null) { - let hero_banner_asset = document.createElement("div"); - - hero_banner_asset.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_HERO_BANNER_ASSET_2")}

- - `; - - asset_container.appendChild(hero_banner_asset); - } - - if (apiCategory.wide_banner != null) { - let wide_banner_asset = document.createElement("div"); - - wide_banner_asset.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_WIDE_BANNER")}

-

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_ID")}${apiCategory.wide_banner}

- - `; - - asset_container.appendChild(wide_banner_asset); - } - - if (apiCategory.hero_logo != null) { - let hero_logo_asset = document.createElement("div"); - - hero_logo_asset.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_HERO_LOGO")}

-

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_ID")}${apiCategory.hero_logo}

- - `; - - asset_container.appendChild(hero_logo_asset); - } - - if (apiCategory.category_bg != null) { - let category_bg_asset = document.createElement("div"); - - category_bg_asset.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_CATEGORY_BG")}

-

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_ID")}${apiCategory.category_bg}

- - `; - - asset_container.appendChild(category_bg_asset); - } - } else if (tab === "reviews") { - - modal.querySelector("[data-category-modal-inner-content-container]").innerHTML = ` -
-

${getTextString("SHOP_CATEGORY_MODAL_REVIEWS_PPLUS_WARNING")}

-
- `; - } - } - - window.fillCategoryModalContentContainer = fillCategoryModalContentContainer; - - - modal.querySelector("[data-product-modal-sku-id]").textContent = `${getTextString("SHOP_CATEGORY_MODAL_SKU_ID")}${apiCategory.sku_id}`; - modal.querySelector("[data-product-modal-name]").textContent = apiCategory.name; - modal.querySelector("[data-product-modal-summary]").textContent = apiCategory.summary; - - document.body.appendChild(modal); - - setTimeout(() => { - modal.classList.add('show'); - }, 1); - - - const top_button_container = document.querySelector("[data-modal-top-product-buttons]"); - - - if (localStorage.experiment_2025_02_shop_category_modals === "Treatment 2: Enable category modals w/ data downloads") { - let downloadItemData = document.createElement("div"); - - downloadItemData.title = getTextString("SHOP_DOWNLOAD_DATA"); - downloadItemData.innerHTML = ` - - `; - - top_button_container.appendChild(downloadItemData); - } - - if (localStorage.experiment_2025_03_view_raw_modal === "Treatment 1: Enabled") { - let rawItemData = document.createElement("div"); - - rawItemData.title = getTextString("SHOP_VIEW_RAW_DATA"); - rawItemData.innerHTML = ` - - `; - - top_button_container.appendChild(rawItemData); - - modal.querySelector("[data-view-raw-product-card-button]").onclick = function(){ - openRawModal(); - }; - - async function openRawModal() { - let modal = document.createElement("div"); - - modal.classList.add('modalv2'); - - modal.innerHTML = ` -
- -
- `; - - document.body.appendChild(modal); - - setTimeout(() => { - modal.classList.add('show'); - }, 1); - - - let modal_back = document.createElement("div"); - - modal_back.classList.add('modalv2-back'); - modal_back.id = 'modalv2-back'; - - document.body.appendChild(modal_back); - - setTimeout(() => { - modal_back.classList.add('show'); - }, 1); - - - modal.addEventListener('click', (event) => { - if (event.target === modal) { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - } - }); - - document.querySelector("[data-close-product-card-button]").addEventListener('click', () => { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - }); - } - } - - - const unpublishedAt = new Date(apiCategory.unpublished_at); - - if (apiCategory.unpublished_at && !isNaN(unpublishedAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = unpublishedAt - now; - - if (timeDiff <= 0) { - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("SHOP_CATEGORY_NOT_IN_STORE")}

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${days}${getTextString("SHOP_CATEGORY_DAYS_LEFT_IN_STORE")}

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - - - let modal_back = document.createElement("div"); - - modal_back.classList.add('modalv2-back'); - modal_back.id = 'modalv2-back'; - - document.body.appendChild(modal_back); - - setTimeout(() => { - modal_back.classList.add('show'); - }, 1); - - - modal.addEventListener('click', (event) => { - if (event.target === modal) { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - removeParams('itemSkuId'); - modalIsAlreadyOpen = false; - } - }); - - document.querySelector("[data-close-product-card-button]").addEventListener('click', () => { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - }); - } - } - - - const cardOutput = category.querySelector("[data-shop-category-card-holder]"); - if (cardOutput) { - for (const product of apiCategory.products) { - const cardTemplate = document.querySelector("[data-shop-item-card-template]"); - const card = cardTemplate.content.cloneNode(true).children[0]; - - card.id = product.sku_id; - - if (product.type === item_types.NONE) { - card.classList.add("type_100"); - card.classList.add('hidden') - } else if (product.type === item_types.AVATAR_DECORATION) { - product.items.forEach(item => { - card.classList.add("type_0"); - // Set the innerHTML for the preview holder - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - previewHolder.classList.add('avatar-decoration-image'); - - // Set the initial image for the deco card - const imgElement = document.createElement("img"); - imgElement.id = "shop-card-deco-image"; - imgElement.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/${item.asset}.png`; - - previewHolder.appendChild(imgElement); - - const bgimg = document.createElement("div"); - bgimg.id = "shop-card-deco-bg-image"; - - previewHolder.appendChild(bgimg); - - // Set the product details - card.querySelector("[data-product-card-sku-id]").textContent = `${getTextString("CARD_PPLUS_MADE_BY")}${product.credits}`; - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - // Hover effect: Change the image src on mouse enter and leave - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - imgElement.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/a_${item.asset}.png`; - if (localStorage.discord_avatar != defaultAvatar1 && localStorage.discord_avatar != defaultAvatar2 && localStorage.discord_avatar != defaultAvatar3 && localStorage.discord_avatar != defaultAvatar4 && localStorage.discord_avatar != defaultAvatar5 && localStorage.discord_avatar != defaultAvatar6) { - bgimg.style.backgroundImage = `url(${localStorage.discord_avatar})` - } - }); - - card.addEventListener("mouseleave", () => { - imgElement.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/${item.asset}.png`; - bgimg.style.backgroundImage = `url(data:image/png;base64,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)`; - }); - } - }); - } else if (product.type === item_types.PROFILE_EFFECT) { - card.classList.add("type_1"); - - card.querySelector("[data-product-card-sku-id]").textContent = `${getTextString("CARD_PPLUS_MADE_BY")}${product.credits}`; - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - // Ensure the item ID is accessible here - let itemId = undefined; - if (Array.isArray(product.items)) { - // If items is an array, find the item with type 1 and get its id - const item = product.items.find(item => item.type === 1); - if (item) { - itemId = item.id; - } - } else if (product.items && product.items.type === 1) { - // If items is an object and has type 1, get its id - itemId = product.items.id; - } - - if (!pplusProfileEffectsCache) { - await setPplusProfileEffectCache(); - } - - // Find matching profile effect - const matchingEffect = pplusProfileEffectsCache.find(effect => effect.id === itemId); - - if (matchingEffect) { - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - previewHolder.classList.add('profile-effect-image'); - - previewHolder.innerHTML = ` - - `; - - // Hover effect: change to the first effect URL (use 'src' from the 'effects' array) - const imgElement = card.querySelector("img"); - - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - imgElement.src = effectUrl || matchingEffect.thumbnailPreviewSrc; - } - }); - - card.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - card.addEventListener("mouseenter", () => { - imgElement.src = matchingEffect.reducedMotionSrc; - }); - - card.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } - } else if (product.type === item_types.NAMEPLATE) { - card.classList.add("type_2"); - - card.querySelector("[data-product-card-sku-id]").textContent = `${getTextString("CARD_PPLUS_MADE_BY")}${product.credits}`; - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - - previewHolder.innerHTML = ` -

${getTextString("CARD_TYPE_NAMEPLATE_PPLUS_ERROR")}

- `; - - } else if (product.type === item_types.BUNDLE) { - card.classList.add("type_1000"); - // Fetch the bundled products for the bundle summary - const bundledProducts = product.bundled_products || []; - - // Generate the bundle summary from the names of the bundled products - const type0Product = bundledProducts.find(item => item.type === 0); - const type1Product = bundledProducts.find(item => item.type === 1); - - let bundleSummary = `${getTextString("CARD_TYPE_BUNDLE_TITLE")}`; - if (type0Product) { - bundleSummary += `${type0Product.name}${getTextString("CARD_TYPE_BUNDLE_TITLE_DECO")}`; - } - if (type1Product) { - bundleSummary += `${type1Product.name}${getTextString("CARD_TYPE_BUNDLE_TITLE_EFFECT")}`; - } - - // Set the summary text - card.querySelector("[data-product-card-summary]").textContent = bundleSummary; - - // Set the basic card details - card.querySelector("[data-product-card-sku-id]").textContent = `${getTextString("CARD_PPLUS_MADE_BY")}${product.credits}`; - card.querySelector("[data-product-card-name]").textContent = product.name; - - // Handle each item in the bundle - product.items.forEach(item => { - if (item.type === 0) { - // Avatar decoration - const decoImage = document.createElement("img"); - decoImage.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/${item.asset}.png`; - decoImage.alt = "Avatar Decoration"; - decoImage.classList.add("avatar-decoration-image"); - card.querySelector("[data-shop-card-preview-holder]").appendChild(decoImage); - - const bgimg = document.createElement("div"); - bgimg.classList.add("avatar-decoration-bg-image"); - - card.querySelector("[data-shop-card-preview-holder]").appendChild(bgimg); - - // Hover effect for decoration image - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - decoImage.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/a_${item.asset}.png`; - if (localStorage.discord_avatar != defaultAvatar1 && localStorage.discord_avatar != defaultAvatar2 && localStorage.discord_avatar != defaultAvatar3 && localStorage.discord_avatar != defaultAvatar4 && localStorage.discord_avatar != defaultAvatar5 && localStorage.discord_avatar != defaultAvatar6) { - bgimg.style.backgroundImage = `url(${localStorage.discord_avatar})` - } - }); - card.addEventListener("mouseleave", () => { - decoImage.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/${item.asset}.png`; - bgimg.style.backgroundImage = `url(data:image/png;base64,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)`; - }); - } - } else if (item.type === 1) { - // Profile effect - - (async () => { - - if (!pplusProfileEffectsCache) { - await setPplusProfileEffectCache(); - } - - const matchingEffect = pplusProfileEffectsCache.find(effect => effect.id === item.id); - - if (matchingEffect) { - const effectImage = document.createElement("img"); - effectImage.src = matchingEffect.thumbnailPreviewSrc; - effectImage.alt = "Profile Effect"; - effectImage.classList.add("profile-effect-image"); - card.querySelector("[data-shop-card-preview-holder]").appendChild(effectImage); - - // Hover effect for profile effect - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects[0] && matchingEffect.effects[0].src) { - effectImage.src = matchingEffect.effects[0].src; - } - }); - card.addEventListener("mouseleave", () => { - effectImage.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - card.addEventListener("mouseenter", () => { - effectImage.src = matchingEffect.reducedMotionSrc; - }); - card.addEventListener("mouseleave", () => { - effectImage.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } - })(); - } - }); - } else if (product.type === item_types.VARIANTS_GROUP) { - // Update SKU and summary - card.querySelector("[data-product-card-sku-id]").textContent = `${getTextString("CARD_PPLUS_MADE_BY")}${product.credits}`; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - // Always display the base variant name - card.querySelector("[data-product-card-name]").textContent = product.variants[0]?.base_variant_name || "Product"; - - // Render variant color blocks as interactive divs - const variantContainer = card.querySelector("[data-shop-card-var-container]"); - variantContainer.innerHTML = ""; // Clear existing variant blocks - let currentSelectedVariant = null; // Track selected variant - - product.variants.forEach((variant, index) => { - // Create variant color block - const variantColorBlockTmp = document.querySelector("[data-shop-varcolorblock-template]"); - const variantColorBlock = variantColorBlockTmp.content.cloneNode(true).children[0]; - variantColorBlock.classList.add("shop-card-var"); - variantColorBlock.id = "shop-card-var"; - variantColorBlock.style.backgroundColor = `${variant.variant_value}`; - - // Add click event listener to switch variants - variantColorBlock.addEventListener("click", () => { - if (currentSelectedVariant) { - currentSelectedVariant.classList.remove("shop-card-var-selected"); - } - variantColorBlock.classList.add("shop-card-var-selected"); - currentSelectedVariant = variantColorBlock; - applyVariant(variant); - }); - - // Append the color block to the container - variantContainer.appendChild(variantColorBlock); - - // Set the first variant as the default selected - if (index === 0) { - currentSelectedVariant = variantColorBlock; - variantColorBlock.classList.add("shop-card-var-selected"); - } - }); - - let isFirstTimeLoadingVariant = true; - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - - // Function to apply the selected variant - function applyVariant(selectedVariant) { - card.querySelector("[data-shop-card-var-title]").textContent = `(${selectedVariant.variant_label})`; - if (selectedVariant.type === 0) { - card.classList.add("type_2000-0"); - previewHolder.innerHTML = ""; // Clear previous decorations - previewHolder.classList.add('avatar-decoration-image'); - - // Add the avatar decoration based on the selected variant - selectedVariant.items?.forEach(item => { - const decoImage = document.createElement("img"); - const bgimg = document.createElement("div"); - if (isFirstTimeLoadingVariant == true) { - decoImage.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/${item.asset}.png`; - isFirstTimeLoadingVariant = false; - } else { - decoImage.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/a_${item.asset}.png`; - if (localStorage.discord_avatar != defaultAvatar1 && localStorage.discord_avatar != defaultAvatar2 && localStorage.discord_avatar != defaultAvatar3 && localStorage.discord_avatar != defaultAvatar4 && localStorage.discord_avatar != defaultAvatar5 && localStorage.discord_avatar != defaultAvatar6) { - bgimg.style.backgroundImage = `url(${localStorage.discord_avatar})` - } - } - decoImage.alt = "Avatar Decoration"; - decoImage.id = "shop-card-deco-image"; - previewHolder.appendChild(decoImage); - - bgimg.id = "shop-card-deco-bg-image"; - - previewHolder.appendChild(bgimg); - - // Hover effect for decoration image - if (localStorage.reduced_motion !== "true") { - card.addEventListener("mouseenter", () => { - decoImage.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/a_${item.asset}.png`; - if (localStorage.discord_avatar != defaultAvatar1 && localStorage.discord_avatar != defaultAvatar2 && localStorage.discord_avatar != defaultAvatar3 && localStorage.discord_avatar != defaultAvatar4 && localStorage.discord_avatar != defaultAvatar5 && localStorage.discord_avatar != defaultAvatar6) { - bgimg.style.backgroundImage = `url(${localStorage.discord_avatar})` - } - }); - card.addEventListener("mouseleave", () => { - decoImage.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/${item.asset}.png`; - bgimg.style.backgroundImage = `url(data:image/png;base64,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)`; - }); - } - }); - } else if (selectedVariant.type === 1) { - card.classList.add("type_2000-1"); - (async () => { - // Ensure the item ID is accessible here - let itemId = undefined; - if (Array.isArray(selectedVariant.items)) { - // If items is an array, find the item with type 1 and get its id - const item = selectedVariant.items.find(item => item.type === 1); - if (item) { - itemId = item.id; - } - } else if (selectedVariant.items && selectedVariant.items.type === 1) { - // If items is an object and has type 1, get its id - itemId = selectedVariant.items.id; - } - - if (!pplusProfileEffectsCache) { - await setPplusProfileEffectCache(); - } - - // Find matching profile effect - const matchingEffect = pplusProfileEffectsCache.find(effect => effect.id === itemId); - - if (matchingEffect) { - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - previewHolder.classList.add('profile-effect-image'); - - if (isFirstTimeLoadingVariant == true) { - previewHolder.innerHTML = ` - - `; - isFirstTimeLoadingVariant = false; - } else { - previewHolder.innerHTML = ` - - `; - } - - // Hover effect: change to the first effect URL (use 'src' from the 'effects' array) - const imgElement = card.querySelector("img"); - - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - imgElement.src = effectUrl || matchingEffect.thumbnailPreviewSrc; - } - }); - - card.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - card.addEventListener("mouseenter", () => { - imgElement.src = matchingEffect.reducedMotionSrc; - }); - - card.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } - })(); - } - } - - // Apply the default variant (first one) initially - if (product.variants.length > 0) { - applyVariant(product.variants[0]); - } - } else if (product.type === item_types.EXTERNAL_SKU) { - card.classList.add("type_3000"); - - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - card.querySelector("[data-product-card-sku-id]").textContent = ``; - } else { - card.querySelector("[data-product-card-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - } - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - - previewHolder.innerHTML = ` -

${getTextString("CARD_TYPE_EXTERNAL_SKU_ERROR")}

- `; - - } else if (product.type === 'plus_more') { - card.querySelector("[data-product-card-sku-id]").textContent = ``; - card.querySelector("[data-product-card-name]").textContent = `${getTextString("CARD_TYPE_PLUS_MORE_TITLE")}`; - card.querySelector("[data-product-card-summary]").textContent = `${getTextString("CARD_TYPE_PLUS_MORE_DESC")}`; - - card.querySelector("[data-shop-price-container]").innerHTML = ``; - card.querySelector("[data-product-card-open-in-shop]").innerHTML = ``; - card.querySelector("[data-share-product-card-button]").innerHTML = ``; - - const plusMoreQuestionMark = document.createElement("img"); - plusMoreQuestionMark.src = `https://cdn.discordapp.com/assets/server_products/storefront/question-mark.png`; - plusMoreQuestionMark.classList.add("plus-more-question-mark"); - card.querySelector("[data-shop-card-preview-holder]").appendChild(plusMoreQuestionMark); - - // Hover effect for decoration image - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - plusMoreQuestionMark.src = `https://cdn.discordapp.com/assets/server_products/storefront/question-mark.gif`; - }); - card.addEventListener("mouseleave", () => { - plusMoreQuestionMark.src = `https://cdn.discordapp.com/assets/server_products/storefront/question-mark.png`; - }); - } - } else if (product.items[0] && product.items[0].item_type === 'deco') { - card.querySelector("[data-product-card-open-in-shop]").style.display = 'none'; - - product.items.forEach(item => { - - card.classList.add("type_0"); - // Set the innerHTML for the preview holder - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - previewHolder.classList.add('avatar-decoration-image'); - - // Set the initial image for the deco card - const imgElement = document.createElement("img"); - imgElement.id = "shop-card-deco-image"; - imgElement.src = imgElement.src = item.static; - - previewHolder.appendChild(imgElement); - - const bgimg = document.createElement("div"); - bgimg.id = "shop-card-deco-bg-image"; - - previewHolder.appendChild(bgimg); - - // Set the product details - card.querySelector("[data-product-card-sku-id]").textContent = ``; - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - // Hover effect: Change the image src on mouse enter and leave - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - imgElement.src = item.animated; - if (localStorage.discord_avatar != defaultAvatar1 && localStorage.discord_avatar != defaultAvatar2 && localStorage.discord_avatar != defaultAvatar3 && localStorage.discord_avatar != defaultAvatar4 && localStorage.discord_avatar != defaultAvatar5 && localStorage.discord_avatar != defaultAvatar6) { - bgimg.style.backgroundImage = `url(${localStorage.discord_avatar})` - } - }); - - card.addEventListener("mouseleave", () => { - imgElement.src = item.static; - bgimg.style.backgroundImage = `url(data:image/png;base64,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)`; - }); - } - - }); - } else if (product.items[0] && product.items[0].item_type === 'effect') { - card.querySelector("[data-product-card-open-in-shop]").style.display = 'none'; - - card.classList.add("type_1"); - - card.querySelector("[data-product-card-sku-id]").textContent = ``; - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - previewHolder.classList.add('profile-effect-image'); - - previewHolder.innerHTML = ` - - `; - - // Hover effect: change to the first effect URL (use 'src' from the 'effects' array) - const imgElement = card.querySelector("img"); - - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - imgElement.src = product.items[0].animated; - }); - - card.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = product.items[0].static; - }); - } - } else { - card.classList.add('hidden') - } - - - - if (localStorage.experiment_2025_03_copy_sku_card === "Treatment 1: Enabled" || localStorage.experiment_2025_03_copy_sku_card === "Treatment 2: w/ share button") { - if (product.emojiCopy === null && product.type != 'plus_more') { - card.querySelector("[data-product-card-open-in-shop]").innerHTML = ` -
- - -
- `; - } else if (product.type != 'plus_more') { - card.querySelector("[data-product-card-open-in-shop]").innerHTML = ` -
- - -
- `; - } - } else { - if (product.emojiCopy === null && product.type != 'plus_more') { - card.querySelector("[data-product-card-open-in-shop]").innerHTML = ` - - `; - } else if (product.type != 'plus_more') { - card.querySelector("[data-product-card-open-in-shop]").innerHTML = ` - - `; - } - } - - if (product.premium_type === 2) { - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
- `; - } - - - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - if (product.type === item_types.AVATAR_DECORATION || product.type === item_types.PROFILE_EFFECT || product.type === item_types.BUNDLE || product.type === item_types.VARIANTS_GROUP) { - card.classList.add('clickable'); - - card.addEventListener("click", (event) => { - if (event.target.matches("[data-shop-card-var]") || event.target.matches(".card-button") || event.target.matches(".shareIcon_f4a996")) { - } else { - openItemModal(); - addParams({itemSkuId: product.sku_id}) - } - }); - - const itemSKUForScroll = params.get("itemSkuId"); - - if (itemSKUForScroll === product.sku_id && modalIsAlreadyOpen != true) { - modalIsAlreadyOpen = true; - setTimeout(() => { - openItemModal(); - }, 1000); - } - - async function openItemModal() { - let modal = document.createElement("div"); - - modal.classList.add('modalv2'); - - if (apiCategory.pdp_bg != null) { - pdp = apiCategory.pdp_bg - } else { - pdp = apiCategory.banner - } - - modal.innerHTML = ` -
-
-
-

-

-

-

-
-
- -
-
-
-
-
-
- -
- -
-
- -
-
- -
- -
-
-
- `; - - document.body.appendChild(modal); - - setTimeout(() => { - modal.classList.add('show'); - }, 1); - - if (product.type === item_types.AVATAR_DECORATION) { - - modal.classList.add('modal-0'); - - product.items.forEach(item => { - - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - const previewHolderLeft = modal.querySelector("[data-modal-left-preview-holder]"); - - modal.querySelector("[data-product-modal-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - modal.querySelector("[data-product-modal-credits]").textContent = `Made By: ${product.credits}`; - modal.querySelector("[data-product-modal-name]").textContent = product.name; - modal.querySelector("[data-product-modal-summary]").textContent = product.summary; - - if (localStorage.experiment_2025_02_extra_options && localStorage.experiment_2025_02_extra_options != "Treatment 5: Enabled w/o currency picker" && localStorage.experiment_2025_02_extra_options != "Treatment -1: Disabled") { - - previewHolder.classList.add('modal-preview-profile-container'); - previewHolder.innerHTML = ` -
-
-
-
- No image uploaded -

${localStorage.discord_displayname}

- - -
-
-
- `; - - document.getElementById("modal-username-preview").textContent = localStorage.discord_username.toLowerCase(); - - previewHolderLeft.classList.add('modal-left-avatar-decoration-img'); - - const imgElement = document.createElement("img"); - imgElement.id = "shop-card-deco-image"; - imgElement.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/${item.asset}.png`; - - previewHolderLeft.appendChild(imgElement); - - if (localStorage.reduced_motion != "true") { - imgElement.addEventListener("mouseenter", () => { - imgElement.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/a_${item.asset}.png`; - }); - - imgElement.addEventListener("mouseleave", () => { - imgElement.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/${item.asset}.png`; - }); - } - - } else { - - previewHolder.classList.add('modal-avatar-decoration-img'); - - const imgElement = document.createElement("img"); - imgElement.id = "shop-card-deco-image"; - imgElement.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/${item.asset}.png`; - - previewHolder.appendChild(imgElement); - - // Hover effect: Change the image src on mouse enter and leave - if (localStorage.reduced_motion != "true") { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - imgElement.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/a_${item.asset}.png`; - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - imgElement.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/${item.asset}.png`; - }); - } - } - - }); - } else if (product.type === item_types.PROFILE_EFFECT) { - modal.classList.add('modal-1'); - - modal.querySelector("[data-product-modal-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - modal.querySelector("[data-product-modal-credits]").textContent = `Made By: ${product.credits}`; - modal.querySelector("[data-product-modal-name]").textContent = product.name; - modal.querySelector("[data-product-modal-summary]").textContent = product.summary; - - // Ensure the item ID is accessible here - let itemId = undefined; - if (Array.isArray(product.items)) { - // If items is an array, find the item with type 1 and get its id - const item = product.items.find(item => item.type === 1); - if (item) { - itemId = item.id; - } - } else if (product.items && product.items.type === 1) { - // If items is an object and has type 1, get its id - itemId = product.items.id; - } - - // Find matching profile effect - const matchingEffect = pplusProfileEffectsCache.find(effect => effect.id === itemId); - - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - const previewHolderLeft = modal.querySelector("[data-modal-left-preview-holder]"); - - if (matchingEffect) { - if (localStorage.experiment_2025_02_extra_options && localStorage.experiment_2025_02_extra_options != "Treatment 5: Enabled w/o currency picker" && localStorage.experiment_2025_02_extra_options != "Treatment -1: Disabled") { - previewHolder.classList.add('modal-preview-profile-container'); - previewHolder.innerHTML = ` -
-
-
-
- No image uploaded -

${localStorage.discord_displayname}

- -
-
- -
- `; - - document.getElementById("modal-username-preview").textContent = localStorage.discord_username.toLowerCase(); - - previewHolderLeft.classList.add('modal-left-profile-effect-img'); - - const imgElement = document.createElement("img"); - imgElement.src = matchingEffect.thumbnailPreviewSrc; - - previewHolderLeft.appendChild(imgElement); - - if (localStorage.reduced_motion != "true") { - imgElement.addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - imgElement.src = effectUrl || matchingEffect.thumbnailPreviewSrc; - } - }); - - imgElement.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - imgElement.addEventListener("mouseenter", () => { - imgElement.src = matchingEffect.reducedMotionSrc; - }); - - imgElement.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } else { - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - previewHolder.classList.add('modal-profile-effect-img'); - - previewHolder.innerHTML = ` - - `; - - // Hover effect: change to the first effect URL (use 'src' from the 'effects' array) - const imgElement = previewHolder.querySelector("img"); - - if (localStorage.reduced_motion != "true") { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - imgElement.src = effectUrl || matchingEffect.thumbnailPreviewSrc; - } - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - imgElement.src = matchingEffect.reducedMotionSrc; - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } - } - } else if (product.type === item_types.BUNDLE) { - modal.classList.add('modal-1000'); - - const bundledProducts = product.bundled_products || []; - - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - - // Generate the bundle summary from the names of the bundled products - const type0Product = bundledProducts.find(item => item.type === 0); - const type1Product = bundledProducts.find(item => item.type === 1); - - let bundleSummary = "Bundle Includes: "; - if (type0Product) { - bundleSummary += `${type0Product.name} Decoration`; - } - if (type1Product) { - bundleSummary += ` & ${type1Product.name} Profile Effect`; - } - - // Set the summary text - modal.querySelector("[data-product-modal-summary]").textContent = bundleSummary; - - // Set the basic card details - modal.querySelector("[data-product-modal-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - modal.querySelector("[data-product-modal-credits]").textContent = `Made By: ${product.credits}`; - modal.querySelector("[data-product-modal-name]").textContent = product.name; - - // Handle each item in the bundle - product.items.forEach(item => { - if (localStorage.experiment_2025_02_extra_options && localStorage.experiment_2025_02_extra_options != "Treatment 5: Enabled w/o currency picker" && localStorage.experiment_2025_02_extra_options != "Treatment -1: Disabled") { - - if (item.type === 0) { - decosrc = item.asset - } else if (item.type === 1) { - // Profile effect - (async () => { - - // Find the matching effect - const matchingEffect = pplusProfileEffectsCache.find(effect => effect.id === item.id); - - if (matchingEffect) { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - renderProfile(effectUrl) - } - } - })(); - } - - function renderProfile(effectUrl) { - previewHolder.classList.add('modal-preview-profile-container'); - previewHolder.innerHTML = ` -
-
-
-
- No image uploaded -

${localStorage.discord_displayname}

- - -
-
- -
- `; - document.getElementById("modal-username-preview").textContent = localStorage.discord_username.toLowerCase(); - } - - - } else { - if (item.type === 0) { - const decoImage = document.createElement("img"); - decoImage.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/${item.asset}.png`; - decoImage.alt = "Avatar Decoration"; - decoImage.classList.add("modal-avatar-decoration-img"); - modal.querySelector("[data-modal-preview-holder]").appendChild(decoImage); - - // Hover effect for decoration image - if (localStorage.reduced_motion != "true") { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - decoImage.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/a_${item.asset}.png`; - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - decoImage.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/${item.asset}.png`; - }); - } - } else if (item.type === 1) { - // Profile effect - (async () => { - // Fetch profile effects if not cached - if (!discordProfileEffectsCache) { - const response = await fetch(api + PROFILE_EFFECTS, { - method: "GET", - headers: { - "Password": api_password, - "Authorization": discord_token, - "Token": api_token - } - }); - const effectsData = await response.json(); - discordProfileEffectsCache = effectsData.profile_effect_configs; - } - - // Find the matching effect - const matchingEffect = discordProfileEffectsCache.find(effect => effect.id === item.id); - - if (matchingEffect) { - const effectImage = document.createElement("img"); - effectImage.src = matchingEffect.thumbnailPreviewSrc; - effectImage.alt = "Profile Effect"; - effectImage.classList.add("modal-profile-effect-img"); - modal.querySelector("[data-modal-preview-holder]").appendChild(effectImage); - - // Hover effect for profile effect - if (localStorage.reduced_motion != "true") { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - effectImage.src = effectUrl || matchingEffect.thumbnailPreviewSrc; - } - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - effectImage.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - effectImage.src = matchingEffect.reducedMotionSrc; - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - effectImage.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } - })(); - } - } - }); - } else if (product.type === item_types.VARIANTS_GROUP) { - modal.querySelector("[data-shop-modal-var-container-container]").classList.add('show'); - // Update SKU and summary - modal.querySelector("[data-product-modal-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - modal.querySelector("[data-product-modal-credits]").textContent = `Made By: ${product.credits}`; - modal.querySelector("[data-product-modal-summary]").textContent = product.summary; - - // Always display the base variant name - modal.querySelector("[data-product-modal-name]").textContent = product.variants[0]?.base_variant_name || "Product"; - - // Render variant color blocks as interactive divs - const variantContainer = modal.querySelector("[data-shop-modal-var-container]"); - variantContainer.innerHTML = ""; // Clear existing variant blocks - let currentSelectedVariant = null; // Track selected variant - - product.variants.forEach((variant, index) => { - // Create variant color block - const variantColorBlock = document.createElement("div"); - variantColorBlock.classList.add("shop-card-var"); - variantColorBlock.style.backgroundColor = `${variant.variant_value}`; - - // Add click event listener to switch variants - variantColorBlock.addEventListener("click", () => { - if (currentSelectedVariant) { - currentSelectedVariant.classList.remove("shop-card-var-selected"); - } - variantColorBlock.classList.add("shop-card-var-selected"); - currentSelectedVariant = variantColorBlock; - applyVariant(variant); - }); - - // Append the color block to the container - variantContainer.appendChild(variantColorBlock); - - // Set the first variant as the default selected - if (index === 0) { - currentSelectedVariant = variantColorBlock; - variantColorBlock.classList.add("shop-card-var-selected"); - } - }); - - let isFirstTimeLoadingVariant = true; - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - const previewHolderLeft = modal.querySelector("[data-modal-left-preview-holder]"); - - // Function to apply the selected variant - function applyVariant(selectedVariant) { - modal.querySelector("[data-shop-modal-var-title]").textContent = `(${selectedVariant.variant_label})`; - modal.querySelector("[data-product-modal-sku-id]").textContent = `SKU ID: ${selectedVariant.sku_id}`; - modal.querySelector("[data-product-modal-credits]").textContent = `Made By: ${selectedVariant.credits}`; - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - modal.querySelector("[data-download-product-card-button]").innerHTML = ` - - `; - } - if (localStorage.experiment_2025_02_extra_options && localStorage.experiment_2025_02_extra_options != "Treatment 5: Enabled w/o currency picker" && localStorage.experiment_2025_02_extra_options != "Treatment -1: Disabled") { - - if (selectedVariant.type === 0) { - selectedVariant.items?.forEach(item => { - previewHolder.classList.add('modal-preview-profile-container'); - previewHolder.innerHTML = ` -
-
-
-
- No image uploaded -

${localStorage.discord_displayname}

- - -
-
-
- `; - document.getElementById("modal-username-preview").textContent = localStorage.discord_username.toLowerCase(); - - previewHolderLeft.classList.add('modal-left-avatar-decoration-img'); - - previewHolderLeft.innerHTML = ` - - `; - - const imgElement = previewHolderLeft.querySelector("[data-left-preview-deco-var]"); - - if (localStorage.reduced_motion != "true") { - imgElement.addEventListener("mouseenter", () => { - imgElement.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/a_${item.asset}.png`; - }); - - imgElement.addEventListener("mouseleave", () => { - imgElement.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/${item.asset}.png`; - }); - } - }); - } else if (selectedVariant.type === 1) { - - modal.classList.add("modal-2000-1"); - (async () => { - // Ensure the item ID is accessible here - let itemId = undefined; - if (Array.isArray(selectedVariant.items)) { - // If items is an array, find the item with type 1 and get its id - const item = selectedVariant.items.find(item => item.type === 1); - if (item) { - itemId = item.id; - } - } else if (selectedVariant.items && selectedVariant.items.type === 1) { - // If items is an object and has type 1, get its id - itemId = selectedVariant.items.id; - } - - // Find matching profile effect - const matchingEffect = pplusProfileEffectsCache.find(effect => effect.id === itemId); - - if (matchingEffect) { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - previewHolder.classList.add('modal-preview-profile-container'); - previewHolder.innerHTML = ` -
-
-
-
- No image uploaded -

${localStorage.discord_displayname}

- -
-
- -
- `; - document.getElementById("modal-username-preview").textContent = localStorage.discord_username.toLowerCase(); - } - } - - previewHolderLeft.classList.add('modal-left-profile-effect-img'); - - previewHolderLeft.innerHTML = ` - - `; - - const imgElement = previewHolderLeft.querySelector("[data-left-preview-effect-var]"); - - if (localStorage.reduced_motion != "true") { - imgElement.addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - imgElement.src = effectUrl || matchingEffect.thumbnailPreviewSrc; - } - }); - - imgElement.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - imgElement.addEventListener("mouseenter", () => { - imgElement.src = matchingEffect.reducedMotionSrc; - }); - - imgElement.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } - })(); - } - - - } else { - if (selectedVariant.type === 0) { - modal.classList.add("modal-2000-0"); - previewHolder.innerHTML = ""; // Clear previous decorations - previewHolder.classList.add('modal-avatar-decoration-img'); - - // Add the avatar decoration based on the selected variant - selectedVariant.items?.forEach(item => { - const decoImage = document.createElement("img"); - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - decoImage.alt = "Avatar Decoration"; - decoImage.id = "shop-card-deco-image"; - previewHolder.appendChild(decoImage); - - // Hover effect for decoration image - if (localStorage.reduced_motion !== "true") { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=true`; - }); - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - }); - } - }); - } else if (selectedVariant.type === 1) { - modal.classList.add("modal-2000-1"); - (async () => { - // Ensure the item ID is accessible here - let itemId = undefined; - if (Array.isArray(selectedVariant.items)) { - // If items is an array, find the item with type 1 and get its id - const item = selectedVariant.items.find(item => item.type === 1); - if (item) { - itemId = item.id; - } - } else if (selectedVariant.items && selectedVariant.items.type === 1) { - // If items is an object and has type 1, get its id - itemId = selectedVariant.items.id; - } - - - // Fetch profile effects API only if not already cached - if (!discordProfileEffectsCache) { - const response = await fetch(api + PROFILE_EFFECTS, { - method: "GET", - headers: { - "Password": api_password, - "Authorization": discord_token, - "Token": api_token - } - }); - const effectsData = await response.json(); - discordProfileEffectsCache = effectsData.profile_effect_configs; - } - - // Find matching profile effect - const matchingEffect = discordProfileEffectsCache.find(effect => effect.id === itemId); - - if (matchingEffect) { - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - previewHolder.classList.add('modal-profile-effect-img'); - - previewHolder.innerHTML = ` - - `; - - // Hover effect: change to the first effect URL (use 'src' from the 'effects' array) - const imgElement = previewHolder.querySelector("img"); - - if (localStorage.reduced_motion != "true") { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - imgElement.src = effectUrl || matchingEffect.thumbnailPreviewSrc; - } - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - imgElement.src = matchingEffect.reducedMotionSrc; - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } - })(); - } - } - } - - // Apply the default variant (first one) initially - if (product.variants.length > 0) { - applyVariant(product.variants[0]); - } - } - - - const button_container = document.querySelector("[data-modal-buttons]"); - - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads") { - modal.querySelector("[data-download-product-card-button]").innerHTML = ` - - `; - } else if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page") { - if (typeof product.emojiCopy != 'undefined') { - button_container.innerHTML = ` - - `; - } else { - button_container.innerHTML = ` - - `; - } - } else if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - if (typeof product.emojiCopy != 'undefined') { - button_container.innerHTML = ` - - `; - modal.querySelector("[data-download-product-card-button]").innerHTML = ` - - `; - } else { - button_container.innerHTML = ` - - `; - modal.querySelector("[data-download-product-card-button]").innerHTML = ` - - `; - } - } else { - button_container.innerHTML = ``; - } - - - const unpublishedAt = new Date(product.unpublished_at); - - if (product.unpublished_at && !isNaN(unpublishedAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = unpublishedAt - now; - - if (timeDiff <= 0) { - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_UNPUBLISHED_TAG")}

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${days}${getTextString("CARD_LEFT_TO_REQUEST_COUNTDOWN_TAG")}

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - - const expiresAt = new Date(product.expires_at); - - if (product.expires_at && !isNaN(expiresAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = expiresAt - now; - - if (timeDiff <= 0) { - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_EXPIRED_TAG")}

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_EXPIRED_COUNTDOWN_TAG")}${days}${getTextString("CARD_EXPIRED_COUNTDOWN_TAG_DAYS")}${hours}${getTextString("CARD_EXPIRED_COUNTDOWN_TAG_HOURS")}

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - const ReleasesAt = new Date(product.releases_at); - - if (product.releases_at && !isNaN(ReleasesAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = ReleasesAt - now; - - if (timeDiff <= 0) { - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_PUBLISHING_TAG")}

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${days}${getTextString("CARD_PUBLISHING_COUNTDOWN_TAG_DAYS")}${hours}${getTextString("CARD_PUBLISHING_COUNTDOWN_TAG_HOURS")}

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - if (product.premium_type === 2) { - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
- `; - } - - if (localStorage.experiment_2025_04_discord_sign_in_dismissible === "Treatment 1: V1" && product.type != 3000) { - - if (localStorage.dismissible_newLogInWithDiscord != "Treatment 1: Seen") { - let newLogInWithDiscordDismissible = document.createElement("div"); - - newLogInWithDiscordDismissible.innerHTML = ` -
- -
-

${getTextString("DISMISSIBLE_CONTENT_NEW_DISCORD_SIGN_IN_MODAL_TITLE")}

-
-

${getTextString("DISMISSIBLE_CONTENT_NEW_DISCORD_SIGN_IN_MODAL_SUMMARY_1")}

-
-

${getTextString("DISMISSIBLE_CONTENT_NEW_DISCORD_SIGN_IN_MODAL_SUMMARY_2")}

-
- -
- - -
-
- `; - - newLogInWithDiscordDismissible.classList.add('newLogInWithDiscordDismissible'); - - newLogInWithDiscordDismissible.id = `newLogInWithDiscordDismissible`; - - modal.appendChild(newLogInWithDiscordDismissible); - } - } - - - let modal_back = document.createElement("div"); - - modal_back.classList.add('modalv2-back'); - modal_back.id = 'modalv2-back'; - - document.body.appendChild(modal_back); - - setTimeout(() => { - modal_back.classList.add('show'); - }, 1); - - - modal.addEventListener('click', (event) => { - if (event.target === modal) { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - removeParams('itemSkuId'); - modalIsAlreadyOpen = false; - } - }); - - document.querySelector("[data-close-product-card-button]").addEventListener('click', () => { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - }); - } - } else if (product.type === "plus_more") { - card.classList.add('clickable'); - - card.addEventListener("click", (event) => { - if (event.target.matches("[data-shop-card-var]")) { - } else { - openItemModal(); - } - }); - - async function openItemModal() { - let modal = document.createElement("div"); - - modal.classList.add('modalv2'); - - if (apiCategory.pdp_bg != null) { - pdp = apiCategory.pdp_bg - } else { - pdp = apiCategory.banner - } - - modal.innerHTML = ` -
-
-
-

-

-

-

-
-
- -
-
-
- -
-
- -
-
-
-
-
-
- -
- -
-
- -
-
-
- -
- -
-
-
- `; - - document.body.appendChild(modal); - - setTimeout(() => { - modal.classList.add('show'); - }, 1); - - modal.querySelector("[data-product-modal-name]").textContent = `${getTextString("CARD_TYPE_PLUS_MORE_TITLE")}`; - modal.querySelector("[data-product-modal-summary]").textContent = `${getTextString("CARD_TYPE_PLUS_MORE_DESC")}`; - - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - previewHolder.classList.add('modal-plus-more-question-mark-img'); - - const plusMoreQuestionMark = document.createElement("img"); - plusMoreQuestionMark.classList.add("plus-more-question-mark"); - plusMoreQuestionMark.src = `https://cdn.discordapp.com/assets/server_products/storefront/question-mark.png`; - - previewHolder.appendChild(plusMoreQuestionMark); - - if (localStorage.reduced_motion != "true") { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - plusMoreQuestionMark.src = `https://cdn.discordapp.com/assets/server_products/storefront/question-mark.gif`; - }); - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - plusMoreQuestionMark.src = `https://cdn.discordapp.com/assets/server_products/storefront/question-mark.png`; - }); - } - - - const button_container = document.querySelector("[data-modal-buttons]"); - - button_container.innerHTML = ``; - - - const unpublishedAt = new Date(product.unpublished_at); - - if (product.unpublished_at && !isNaN(unpublishedAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = unpublishedAt - now; - - if (timeDiff <= 0) { - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_UNPUBLISHED_TAG")}

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${days}${getTextString("CARD_LEFT_TO_REQUEST_COUNTDOWN_TAG")}

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - - const expiresAt = new Date(product.expires_at); - - if (product.expires_at && !isNaN(expiresAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = expiresAt - now; - - if (timeDiff <= 0) { - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_EXPIRED_TAG")}

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_EXPIRED_COUNTDOWN_TAG")}${days}${getTextString("CARD_EXPIRED_COUNTDOWN_TAG_DAYS")}${hours}${getTextString("CARD_EXPIRED_COUNTDOWN_TAG_HOURS")}

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - const ReleasesAt = new Date(product.releases_at); - - if (product.releases_at && !isNaN(ReleasesAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = ReleasesAt - now; - - if (timeDiff <= 0) { - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_PUBLISHING_TAG")}

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${days}${getTextString("CARD_PUBLISHING_COUNTDOWN_TAG_DAYS")}${hours}${getTextString("CARD_PUBLISHING_COUNTDOWN_TAG_HOURS")}

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - if (product.premium_type === 2) { - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
- `; - } - - - - let modal_back = document.createElement("div"); - - modal_back.classList.add('modalv2-back'); - modal_back.id = 'modalv2-back'; - - document.body.appendChild(modal_back); - - setTimeout(() => { - modal_back.classList.add('show'); - }, 1); - - - modal.addEventListener('click', (event) => { - if (event.target === modal) { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - removeParams('itemSkuId'); - modalIsAlreadyOpen = false; - } - }); - - document.querySelector("[data-close-product-card-button]").addEventListener('click', () => { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - }); - } - } - } - - - const unpublishedAt = new Date(product.unpublished_at); - - if (product.unpublished_at && !isNaN(unpublishedAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = unpublishedAt - now; - - if (timeDiff <= 0) { - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_UNPUBLISHED_TAG")}

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${days}${getTextString("CARD_LEFT_TO_REQUEST_COUNTDOWN_TAG")}

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - - const ExpiredAt = new Date(product.expires_at); - - if (product.expires_at && !isNaN(ExpiredAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = ExpiredAt - now; - - if (timeDiff <= 0) { - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_EXPIRED_TAG")}

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_EXPIRED_COUNTDOWN_TAG")}${days}${getTextString("CARD_EXPIRED_COUNTDOWN_TAG_DAYS")}${hours}${getTextString("CARD_EXPIRED_COUNTDOWN_TAG_HOURS")}

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - const ReleasesAt = new Date(product.releases_at); - - if (product.releases_at && !isNaN(ReleasesAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = ReleasesAt - now; - - if (timeDiff <= 0) { - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_PUBLISHING_TAG")}

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${days}${getTextString("CARD_PUBLISHING_COUNTDOWN_TAG_DAYS")}${hours}${getTextString("CARD_PUBLISHING_COUNTDOWN_TAG_HOURS")}

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - // Append card to output - card.classList.add('shop-category-card-transparent') - cardOutput.append(card); - - scrollToSKU(product.sku_id); - } - } - - categoryOutput.append(category); - - scrollToSKU(apiCategory.sku_id); - - - const paper_beach2_banner = document.getElementById(PAPER_BEACH_V2); - const geometry_dash_banner = document.getElementById(GEOMETRY_DASH); - const special_event_plus_banner = document.getElementById(PLUS_SPECIAL_EVENT); - const fnaf_banner = document.getElementById(FIVE_NIGHTS_AT_FREDDYS); - const windowkill2_banner = document.getElementById(WINDOWKILL_V2); - const paper_beach_banner = document.getElementById(PAPER_BEACH); - const bopl_battle_banner = document.getElementById(BOPL_BATTLE); - const windowkill_banner = document.getElementById(WINDOWKILL); - - if (localStorage.disable_client_banner_overrides != "true") { - - if (paper_beach2_banner) { - document.getElementById(`${PAPER_BEACH_V2}-banner-banner-container`).innerHTML = ` - - - `; - document.getElementById(`${PAPER_BEACH_V2}-logo-container`).innerHTML = ` - - `; - } - - if (windowkill2_banner) { - document.getElementById(WINDOWKILL_V2).innerHTML = ` - -
- -
- `; - } - - if (paper_beach_banner) { - document.getElementById(PAPER_BEACH).innerHTML = ` - -
- -
- `; - } - - if (bopl_battle_banner) { - document.getElementById(BOPL_BATTLE).innerHTML = ` - -
- -
- `; - } - } - - - - - } else if (page === "consumables") { - // Existing code for 'consumables' page - const potionCard = potionTemplate.content.cloneNode(true).children[0]; - potionCard.querySelector("[data-potion-card-holder]").id = apiCategory.sku_id; - - potionCard.id = apiCategory.sku_id; - - potionCard.querySelector("[data-potion-card-holder]").classList.add('potion-card-gradient1'); - - if (apiCategory.src === null) { - potionCard.querySelector("[data-potion-card-preview-image]").src = `https://cdn.yapper.shop/assets/31.png`; - } else { - potionCard.querySelector("[data-potion-card-preview-image]").src = `https://cdn.yapper.shop/${apiCategory.endpoint}/${apiCategory.src}.${apiCategory.format}`; - } - potionCard.querySelector("[data-potion-card-preview-image]").alt = apiCategory.name; - - if (apiCategory.new_text != null) { - potionCard.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${apiCategory.new_text}

-
- `; - } - - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - potionCard.querySelector("[data-product-card-sku-id]").textContent = ``; - } else { - potionCard.querySelector("[data-product-card-sku-id]").textContent = `SKU ID: ${apiCategory.sku_id}`; - } - potionCard.querySelector("[data-product-card-name]").textContent = apiCategory.name; - potionCard.querySelector("[data-product-card-summary]").textContent = apiCategory.summary; - - let priceStandard = "N/A"; - - if (apiCategory.price) { - priceStandard = apiCategory.price.amount; - } - - - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - potionCard.classList.add('clickable'); - - potionCard.addEventListener("click", (event) => { - if (event.target.matches(".card-button")) { - } else { - openItemModal(); - } - }); - - async function openItemModal() { - let modal = document.createElement("div"); - - modal.classList.add('modalv2'); - - if (apiCategory.pdp_bg != null) { - pdp = apiCategory.pdp_bg - } else { - pdp = apiCategory.banner - } - - modal.innerHTML = ` -
-
-

-

-

-
-
- -
-
-
-
-
-
- -
-
- -
-
-
- -
- -
- -
-
-
- `; - - document.body.appendChild(modal); - - setTimeout(() => { - modal.classList.add('show'); - }, 1); - - - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - previewHolder.classList.add('modal-potion-img'); - - const imgElement = document.createElement("img"); - imgElement.classList.add('potion-card-preview'); - imgElement.src = `https://cdn.yapper.shop/${apiCategory.endpoint}/${apiCategory.src}.${apiCategory.format}`; - - previewHolder.appendChild(imgElement); - - // Set the product details - modal.querySelector("[data-product-modal-sku-id]").textContent = `SKU ID: ${apiCategory.sku_id}`; - modal.querySelector("[data-product-modal-name]").textContent = apiCategory.name; - modal.querySelector("[data-product-modal-summary]").textContent = apiCategory.summary; - - - const button_container = document.querySelector("[data-modal-buttons]"); - - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads") { - button_container.innerHTML = ` - - `; - modal.querySelector("[data-download-product-card-button]").innerHTML = ` - - `; - } else if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+") { - button_container.innerHTML = ` - - `; - modal.querySelector("[data-download-product-card-button]").innerHTML = ` - - `; - } else if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - button_container.innerHTML = ` - - `; - modal.querySelector("[data-download-product-card-button]").innerHTML = ` - - `; - } else { - button_container.innerHTML = ` - - `; - } - - - let priceStandard = "N/A"; - - if (apiCategory.price) { - priceStandard = apiCategory.price.amount; - } - - - const priceTextNitro = modal.querySelector("[data-price-nitro]"); - const priceTextStandard = modal.querySelector("[data-price-standard]"); - - const priceContainerNitro = modal.querySelector("[data-price-nitro-container]"); - const priceContainerStandard = modal.querySelector("[data-price-standard-container]"); - - const priceContainer = modal.querySelector("[data-shop-price-container]"); - - if (localStorage.experiment_2025_01_orb_testing === "Treatment 1: Default Prices") { - if (priceTextStandard) { - priceTextStandard.textContent = priceStandard !== "N/A" ? `${priceStandard}` : "Price (USD): N/A"; - } - - let orb_icon = document.createElement("div"); - - orb_icon.classList.add('orb-icon'); - - priceContainerStandard.appendChild(orb_icon); - - } else if (localStorage.experiment_2025_01_orb_testing === "Treatment 2: 50 Orbs") { - if (priceTextStandard) { - priceTextStandard.textContent = `50`; - } - - let orb_icon = document.createElement("div"); - - orb_icon.classList.add('orb-icon'); - - priceContainerStandard.appendChild(orb_icon); - - } else if (localStorage.experiment_2025_01_orb_testing === "Treatment 3: Dynamic") { - - if (apiCategory.price.currency === "discord_orb") { - if (priceTextStandard) { - priceTextStandard.textContent = priceStandard !== "N/A" ? `${priceStandard}` : "Price (USD): N/A"; - } - - let orb_icon = document.createElement("div"); - - orb_icon.classList.add('orb-icon'); - - priceContainerStandard.appendChild(orb_icon); - - } else { - if (priceTextStandard) { - priceTextStandard.textContent = priceStandard !== "N/A" ? `US$${(priceStandard / 100).toFixed(2)}` : "Price (USD): N/A"; - } - } - - } else { - if (priceTextStandard) { - priceTextStandard.textContent = priceStandard !== "N/A" ? `US$${(priceStandard / 100).toFixed(2)}` : "Price (USD): N/A"; - } - } - - if (apiCategory.new_text != null) { - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${apiCategory.new_text}

-
- `; - } - - - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - modal.classList.add('potion-wobble') - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - modal.classList.remove('potion-wobble') - }); - - - - let modal_back = document.createElement("div"); - - modal_back.classList.add('modalv2-back'); - modal_back.id = 'modalv2-back'; - - document.body.appendChild(modal_back); - - setTimeout(() => { - modal_back.classList.add('show'); - }, 1); - - - modal.addEventListener('click', (event) => { - if (event.target === modal) { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - } - }); - - document.querySelector("[data-close-product-card-button]").addEventListener('click', () => { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - }); - } - } - - - const priceTextNitro = potionCard.querySelector("[data-price-nitro]"); - const priceTextStandard = potionCard.querySelector("[data-price-standard]"); - - const priceContainerNitro = potionCard.querySelector("[data-price-nitro-container]"); - const priceContainerStandard = potionCard.querySelector("[data-price-standard-container]"); - - const priceContainer = potionCard.querySelector("[data-shop-price-container]"); - - if (localStorage.experiment_2025_01_orb_testing === "Treatment 1: Default Prices") { - if (priceTextStandard) { - priceTextStandard.textContent = priceStandard !== "N/A" ? `${priceStandard}` : "Price (USD): N/A"; - } - - let orb_icon = document.createElement("div"); - - orb_icon.classList.add('orb-icon'); - - priceContainerStandard.appendChild(orb_icon); - - } else if (localStorage.experiment_2025_01_orb_testing === "Treatment 2: 50 Orbs") { - if (priceTextStandard) { - priceTextStandard.textContent = `50`; - } - - let orb_icon = document.createElement("div"); - - orb_icon.classList.add('orb-icon'); - - priceContainerStandard.appendChild(orb_icon); - - } else { - if (priceTextStandard) { - priceTextStandard.textContent = priceStandard !== "N/A" ? `US$${(priceStandard / 100).toFixed(2)}` : "Price (USD): N/A"; - } - } - - if (localStorage.experiment_2025_03_copy_sku_card === "Treatment 1: Enabled" || localStorage.experiment_2025_03_copy_sku_card === "Treatment 2: w/ share button") { - potionCard.querySelector("[data-product-card-open-in-shop]").innerHTML = ` -
- - -
- `; - } else { - potionCard.querySelector("[data-product-card-open-in-shop]").innerHTML = ` - - `; - } - - potionCard.addEventListener("mouseenter", () => { - potionCard.classList.add('potion-wobble') - }); - - potionCard.addEventListener("mouseleave", () => { - potionCard.classList.remove('potion-wobble') - }); - - categoryOutput.append(potionCard); - } else if (page === "marketing") { - if (localStorage.experiment_2025_04_collectibles_marketing_page === "Treatment 1: Enabled") { - const category = categoryTemplate.content.cloneNode(true).children[0]; - category.querySelector("[data-shop-category-banner]").id = apiCategory.sku_id; - - if (apiCategory.banner_asset) { - if (apiCategory.banner_asset.animated != null) { - if (apiCategory.banner_asset.static != null) { - category.querySelector("[data-shop-banner-banner-container]").innerHTML = ` - - - `; - } else { - category.querySelector("[data-shop-banner-banner-container]").innerHTML = ` - - `; - } - } else if (apiCategory.banner_asset.static != null) { - category.querySelector("[data-shop-category-banner-image]").src = `${apiCategory.banner_asset.static}`; - } - } else { - category.querySelector("[data-shop-category-banner-image]").src = `https://cdn.yapper.shop/assets/${apiCategory.banner}.png`; - category.querySelector("[data-shop-category-banner-image]").alt = apiCategory.name; - } - - category.querySelector("[data-shop-category-logo-image]").src = `https://cdn.yapper.shop/assets/${apiCategory.logo}.png`; - category.querySelector("[data-shop-category-logo-image]").alt = apiCategory.name; - category.querySelector("[data-shop-category-logo-image]").classList.add("shop-category-condensed-banner-img"); - - category.querySelector("[data-shop-category-desc]").id = `${apiCategory.sku_id}-summary`; - category.querySelector("[data-shop-category-desc]").textContent = apiCategory.summary; - if (apiCategory.banner_text_color && apiCategory.banner_text_color != null) { - category.querySelector("[data-shop-category-desc]").style.color = apiCategory.banner_text_color; - } - - category.querySelector("[data-shop-banner-banner-container]").id = `${apiCategory.sku_id}-banner-banner-container`; - category.querySelector("[data-shop-category-logo-holder]").id = `${apiCategory.sku_id}-logo-container`; - category.querySelector("[data-shop-discord-watermark-container]").id = `${apiCategory.sku_id}-discord-watermark-container`; - - - const cardOutput = category.querySelector("[data-shop-category-card-holder]"); - if (cardOutput) { - for (const product of apiCategory.products) { - const cardTemplate = document.querySelector("[data-shop-item-card-template]"); - const card = cardTemplate.content.cloneNode(true).children[0]; - - card.id = product.sku_id; - - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - previewHolder.classList.add('avatar-decoration-image'); - - - if (apiCategory.type === 0) { - // Set the initial image for the deco card - const imgElement = document.createElement("img"); - imgElement.id = "shop-card-deco-image"; - imgElement.src = `https://cdn.discordapp.com/avatar-decoration-presets/${product.asset}.png?size=4096&passthrough=false`; - - previewHolder.appendChild(imgElement); - - const bgimg = document.createElement("div"); - bgimg.id = "shop-card-deco-bg-image"; - bgimg.style.backgroundImage = `url('${product.src}')`; - - previewHolder.appendChild(bgimg); - - // Set the product details - card.querySelector("[data-product-card-sku-id]").textContent = `${getTextString("CARD_SHOP_MARKETING_ID")}${product.id}`; - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - // Hover effect: Change the image src on mouse enter and leave - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - imgElement.src = `https://cdn.discordapp.com/avatar-decoration-presets/${product.asset}.png?size=4096&passthrough=true`; - }); - - card.addEventListener("mouseleave", () => { - imgElement.src = `https://cdn.discordapp.com/avatar-decoration-presets/${product.asset}.png?size=4096&passthrough=false`; - }); - } - - card.querySelector("[data-product-card-open-in-shop]").innerHTML = ` - - `; - } else if (apiCategory.type === 1) { - // Set the initial image for the deco card - const imgElement = document.createElement("img"); - imgElement.id = "shop-card-deco-image"; - imgElement.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/${product.asset}.png`; - - previewHolder.appendChild(imgElement); - - const bgimg = document.createElement("div"); - bgimg.id = "shop-card-deco-bg-image"; - bgimg.style.backgroundImage = `url('${product.src}')`; - - previewHolder.appendChild(bgimg); - - // Set the product details - card.querySelector("[data-product-card-sku-id]").textContent = `${getTextString("CARD_SHOP_MARKETING_ID")}${product.id}`; - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - // Hover effect: Change the image src on mouse enter and leave - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - imgElement.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/a_${product.asset}.png`; - }); - - card.addEventListener("mouseleave", () => { - imgElement.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/${product.asset}.png`; - }); - } - - card.querySelector("[data-product-card-open-in-shop]").innerHTML = ` - - `; - } else { - card.classList.add("hidden"); - } - - cardOutput.append(card); - } - } - - categoryOutput.append(category); - } else if (localStorage.experiment_2025_04_collectibles_marketing_page === "Treatment 2: Enable v2") { - const category = categoryTemplate.content.cloneNode(true).children[0]; - category.querySelector("[data-shop-category-banner]").id = apiCategory.sku_id; - - if (apiCategory.banner_asset) { - if (apiCategory.banner_asset.animated != null) { - if (apiCategory.banner_asset.static != null) { - category.querySelector("[data-shop-banner-banner-container]").innerHTML = ` - - - `; - } else { - category.querySelector("[data-shop-banner-banner-container]").innerHTML = ` - - `; - } - } else if (apiCategory.banner_asset.static != null) { - category.querySelector("[data-shop-category-banner-image]").src = `${apiCategory.banner_asset.static}`; - } - } else { - category.querySelector("[data-shop-category-banner-image]").src = `https://cdn.yapper.shop/assets/${apiCategory.banner}.png`; - category.querySelector("[data-shop-category-banner-image]").alt = apiCategory.name; - } - - category.querySelector("[data-shop-category-logo-image]").src = `https://cdn.yapper.shop/assets/${apiCategory.logo}.png`; - category.querySelector("[data-shop-category-logo-image]").alt = apiCategory.name; - category.querySelector("[data-shop-category-logo-image]").classList.add("shop-category-condensed-banner-img"); - - category.querySelector("[data-shop-category-desc]").id = `${apiCategory.sku_id}-summary`; - category.querySelector("[data-shop-category-desc]").textContent = apiCategory.summary; - if (apiCategory.banner_text_color && apiCategory.banner_text_color != null) { - category.querySelector("[data-shop-category-desc]").style.color = apiCategory.banner_text_color; - } - - category.querySelector("[data-shop-banner-banner-container]").id = `${apiCategory.sku_id}-banner-banner-container`; - category.querySelector("[data-shop-category-logo-holder]").id = `${apiCategory.sku_id}-logo-container`; - category.querySelector("[data-shop-discord-watermark-container]").id = `${apiCategory.sku_id}-discord-watermark-container`; - - category.querySelector("[data-shop-category-banner]").innerHTML = ` - -
- -
- `; - - - const cardOutput = category.querySelector("[data-shop-category-card-holder]"); - if (cardOutput) { - const sortedData = apiCategory.products.sort((b, a) => a.id - b.id); - for (const product of sortedData) { - const cardTemplate = document.querySelector("[data-shop-item-card-template]"); - const card = cardTemplate.content.cloneNode(true).children[0]; - - card.classList.add("shop-marketing-card"); - card.innerHTML = ` -
- -
-
-
- -
-
- -
-
- Failed to load ID -

Failed to load name

-

Failed to load summary

-
-

${getTextString("CARD_MARKETING_SHOP_TAB_PREVIEW_TEXT")}

- -
- `; - - if (product.raw != null && product.raw.marketings["2"] && product.raw.marketings["2"].asset != null) { - card.querySelector("[data-marketing-shop-card-bg]").src = product.raw.marketings["2"].asset; - } - - if (product.raw != null && product.raw.marketings["0"] && product.raw.marketings["0"].ref_target_background != null) { - card.querySelector("[data-shop-tab-preview]").style.display = 'flex'; - card.querySelector("[data-shop-tab-preview-text]").style.display = 'flex'; - if (product.raw != null && product.raw.marketings["0"] && product.raw.marketings["0"].ref_target_background != null && product.raw.marketings["0"].ref_target_background.asset.resting.dark && product.raw.marketings["0"].ref_target_background.asset.resting.dark != null) { - card.querySelector("[data-shop-tab-preview-img]").src = product.raw.marketings["0"].ref_target_background.asset.resting.dark; - } - card.addEventListener("mouseenter", () => { - if (product.raw.marketings["0"].ref_target_background.asset.hovered.dark != null) { - card.querySelector("[data-shop-tab-preview-img]").src = product.raw.marketings["0"].ref_target_background.asset.hovered.dark; - } - }); - - card.addEventListener("mouseleave", () => { - if (product.raw.marketings["0"].ref_target_background.asset.resting.dark != null) { - card.querySelector("[data-shop-tab-preview-img]").src = product.raw.marketings["0"].ref_target_background.asset.resting.dark; - } else { - card.querySelector("[data-shop-tab-preview-img]").src = 'https://cdn.yapper.shop/assets/31.png'; - } - }); - - if (product.raw != null && product.raw.marketings["0"] && product.raw.marketings["0"].ref_target_background != null && product.raw.marketings["0"].ref_target_background.style.resting.dark && product.raw.marketings["0"].ref_target_background.style.resting.dark != null) { - card.querySelector("[data-shop-tab-preview]").style.backgroundImage = product.raw.marketings["0"].ref_target_background.style.resting.dark; - } - card.addEventListener("mouseenter", () => { - if (product.raw.marketings["0"].ref_target_background.style.hovered.dark != null) { - card.querySelector("[data-shop-tab-preview]").style.backgroundImage = product.raw.marketings["0"].ref_target_background.style.hovered.dark; - } - }); - - card.addEventListener("mouseleave", () => { - if (product.raw.marketings["0"].ref_target_background.style.resting.dark != null) { - card.querySelector("[data-shop-tab-preview]").style.backgroundImage = product.raw.marketings["0"].ref_target_background.style.resting.dark; - } - }); - } - - card.querySelector("[data-view-raw-product-card-button]").onclick = function(){ - openRawModal(); - }; - - async function openRawModal() { - let modal = document.createElement("div"); - - modal.classList.add('modalv2'); - - modal.innerHTML = ` -
- -
- `; - - document.body.appendChild(modal); - - setTimeout(() => { - modal.classList.add('show'); - }, 1); - - - let modal_back = document.createElement("div"); - - modal_back.classList.add('modalv2-back'); - modal_back.id = 'modalv2-back'; - - document.body.appendChild(modal_back); - - setTimeout(() => { - modal_back.classList.add('show'); - }, 1); - - - modal.addEventListener('click', (event) => { - if (event.target === modal) { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - } - }); - } - - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - - - if (apiCategory.type === 0) { - // Set the initial image for the deco card - const imgElement = document.createElement("img"); - imgElement.id = "shop-card-deco-image"; - imgElement.src = `https://cdn.discordapp.com/avatar-decoration-presets/${product.asset}.png?size=4096&passthrough=false`; - imgElement.style.height = `150px`; - imgElement.style.width = `150px`; - - previewHolder.appendChild(imgElement); - - const bgimg = document.createElement("div"); - bgimg.id = "shop-card-deco-bg-image"; - bgimg.style.backgroundImage = `url('${product.src}')`; - bgimg.style.height = `150px`; - bgimg.style.width = `150px`; - - previewHolder.appendChild(bgimg); - - // Set the product details - card.querySelector("[data-product-card-sku-id]").textContent = `${getTextString("CARD_SHOP_MARKETING_ID")}${product.id}`; - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - if (product.raw != null && product.raw.marketings["2"] && product.raw.marketings["2"].revert_text_color === true) { - card.querySelector("[data-product-card-sku-id]").style.color = `black`; - card.querySelector("[data-product-card-name]").style.color = `black`; - card.querySelector("[data-product-card-summary]").style.color = `black`; - } - - // Hover effect: Change the image src on mouse enter and leave - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - imgElement.src = `https://cdn.discordapp.com/avatar-decoration-presets/${product.asset}.png?size=4096&passthrough=true`; - }); - - card.addEventListener("mouseleave", () => { - imgElement.src = `https://cdn.discordapp.com/avatar-decoration-presets/${product.asset}.png?size=4096&passthrough=false`; - }); - } - - card.querySelector("[data-product-card-open-in-shop]").innerHTML = ` -
- - -
- `; - } else if (apiCategory.type === 1) { - // Set the initial image for the deco card - const imgElement = document.createElement("img"); - imgElement.id = "shop-card-deco-image"; - imgElement.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/${product.asset}.png`; - imgElement.style.height = `150px`; - imgElement.style.width = `150px`; - - previewHolder.appendChild(imgElement); - - const bgimg = document.createElement("div"); - bgimg.id = "shop-card-deco-bg-image"; - bgimg.style.backgroundImage = `url('${product.src}')`; - bgimg.style.height = `150px`; - bgimg.style.width = `150px`; - - previewHolder.appendChild(bgimg); - - // Set the product details - card.querySelector("[data-product-card-sku-id]").textContent = `${getTextString("CARD_SHOP_MARKETING_ID")}${product.id}`; - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - if (product.raw != null && product.raw.marketings["2"] && product.raw.marketings["2"].revert_text_color === true) { - card.querySelector("[data-product-card-sku-id]").style.color = `black`; - card.querySelector("[data-product-card-name]").style.color = `black`; - card.querySelector("[data-product-card-summary]").style.color = `black`; - } - - // Hover effect: Change the image src on mouse enter and leave - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - imgElement.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/a_${product.asset}.png`; - }); - - card.addEventListener("mouseleave", () => { - imgElement.src = `https://cdn.yapper.shop/custom-collectibles/avatar-decorations/${product.asset}.png`; - }); - } - - card.querySelector("[data-product-card-open-in-shop]").innerHTML = ` -
- - -
- `; - } else { - card.classList.add("hidden"); - } - - cardOutput.append(card); - } - } - - categoryOutput.append(category); - } - - } else { - // Default page handling - const category = categoryTemplate.content.cloneNode(true).children[0]; - category.querySelector("[data-shop-category-banner]").id = apiCategory.sku_id; - - - // Category info modals - - if (localStorage.experiment_2025_02_shop_category_modals === "Treatment 1: Enable category modals" || localStorage.experiment_2025_02_shop_category_modals === "Treatment 2: Enable category modals w/ data downloads") { - category.querySelector("[data-shop-category-banner]").classList.add('clickable') - } - - - // Banner Image/Video asset - - if (apiCategory.banner_asset) { - if (apiCategory.banner_asset.animated != null) { - if (localStorage.reduced_motion != "true") { - if (apiCategory.banner_asset.static != null) { - category.querySelector("[data-shop-banner-banner-container]").innerHTML = ` - - - `; - } else { - category.querySelector("[data-shop-banner-banner-container]").innerHTML = ` - - `; - } - } else if (apiCategory.banner_asset.static != null) { - category.querySelector("[data-shop-category-banner-image]").src = `${apiCategory.banner_asset.static}`; - } else { - category.querySelector("[data-shop-category-banner-image]").src = `https://cdn.discordapp.com/app-assets/1096190356233670716/${apiCategory.banner}.png?size=4096`; - category.querySelector("[data-shop-category-banner-image]").alt = apiCategory.name; - } - } else if (apiCategory.banner_asset.static != null) { - category.querySelector("[data-shop-category-banner-image]").src = `${apiCategory.banner_asset.static}`; - } - } else { - category.querySelector("[data-shop-category-banner-image]").src = `https://cdn.discordapp.com/app-assets/1096190356233670716/${apiCategory.banner}.png?size=4096`; - category.querySelector("[data-shop-category-banner-image]").alt = apiCategory.name; - } - - - category.querySelector("[data-shop-banner-banner-container]").id = `${apiCategory.sku_id}-banner-banner-container`; - - category.querySelector("[data-shop-category-marketing-bg]").remove(); - - - // Logo Image/Video asset - - if (apiCategory.logo != null) { - category.querySelector("[data-shop-category-logo-image]").src = `https://cdn.discordapp.com/app-assets/1096190356233670716/${apiCategory.logo}.png?size=4096`; - } else { - category.querySelector("[data-shop-category-logo-image]").src = `https://cdn.yapper.shop/assets/31.png`; - } - category.querySelector("[data-shop-category-logo-image]").alt = apiCategory.name; - - category.querySelector("[data-shop-category-logo-holder]").id = `${apiCategory.sku_id}-logo-container`; - - - - category.querySelector("[data-shop-category-desc]").id = `${apiCategory.sku_id}-summary`; - category.querySelector("[data-shop-category-desc]").textContent = apiCategory.summary; - if (apiCategory.banner_text_color && apiCategory.banner_text_color != null) { - category.querySelector("[data-shop-category-desc]").style.color = apiCategory.banner_text_color; - } - - - category.querySelector("[data-shop-discord-watermark-container]").id = `${apiCategory.sku_id}-discord-watermark-container`; - - - if (apiCategory.sku_id === discord_categories.FANTASY) { - category.querySelector("[data-shop-category-logo-holder]").style.display = 'unset'; - category.querySelector("[data-shop-discord-watermark-container]").style.display = 'unset'; - } - if (apiCategory.sku_id === discord_categories.ANIME) { - category.querySelector("[data-shop-category-logo-holder]").style.display = 'unset'; - category.querySelector("[data-shop-discord-watermark-container]").style.display = 'unset'; - } - if (apiCategory.sku_id === discord_categories.BREAKFAST) { - category.querySelector("[data-shop-category-logo-holder]").style.display = 'unset'; - category.querySelector("[data-shop-discord-watermark-container]").style.display = 'unset'; - } - if (apiCategory.sku_id === discord_categories.DISXCORE) { - category.querySelector("[data-shop-category-logo-holder]").style.display = 'unset'; - category.querySelector("[data-shop-discord-watermark-container]").style.display = 'unset'; - } - if (apiCategory.sku_id === discord_categories.FALL) { - category.querySelector("[data-shop-category-logo-holder]").style.display = 'unset'; - category.querySelector("[data-shop-discord-watermark-container]").style.display = 'unset'; - } - if (apiCategory.sku_id === discord_categories.HALLOWEEN) { - category.querySelector("[data-shop-category-logo-holder]").style.display = 'unset'; - category.querySelector("[data-shop-discord-watermark-container]").style.display = 'unset'; - } - if (apiCategory.sku_id === discord_categories.WINTER) { - category.querySelector("[data-shop-category-logo-holder]").style.display = 'unset'; - category.querySelector("[data-shop-discord-watermark-container]").style.display = 'unset'; - } - if (apiCategory.sku_id === discord_categories.MONSTERS) { - category.querySelector("[data-shop-category-logo-holder]").style.display = 'unset'; - category.querySelector("[data-shop-discord-watermark-container]").style.display = 'unset'; - } - if (apiCategory.sku_id === discord_categories.CYBERPUNK) { - category.querySelector("[data-shop-category-logo-holder]").style.display = 'unset'; - category.querySelector("[data-shop-discord-watermark-container]").style.display = 'unset'; - } - if (apiCategory.sku_id === discord_categories.LUNAR_NEW_YEAR) { - if (apiCategory.banner === "1202069953306689626") { - category.querySelector("[data-shop-category-logo-holder]").style.display = 'unset'; - category.querySelector("[data-shop-discord-watermark-container]").style.display = 'unset'; - } - } - if (apiCategory.sku_id === discord_categories.ELEMENTS) { - category.querySelector("[data-shop-category-logo-holder]").style.display = 'unset'; - category.querySelector("[data-shop-discord-watermark-container]").style.display = 'unset'; - } - if (apiCategory.sku_id === discord_categories.ANIME_V2) { - category.querySelector("[data-shop-category-logo-holder]").style.display = 'unset'; - category.querySelector("[data-shop-discord-watermark-container]").style.display = 'unset'; - category.querySelector("[data-shop-category-desc]").style.color = 'black'; - } - if (apiCategory.sku_id === discord_categories.SPRINGTOONS) { - category.querySelector("[data-shop-category-logo-holder]").style.display = 'unset'; - category.querySelector("[data-shop-discord-watermark-container]").style.display = 'unset'; - category.querySelector("[data-shop-category-desc]").style.color = 'black'; - } - if (apiCategory.sku_id === discord_categories.SHY) { - category.querySelector("[data-shop-category-logo-holder]").style.display = 'unset'; - category.querySelector("[data-shop-discord-watermark-container]").style.display = 'unset'; - } - if (apiCategory.sku_id === discord_categories.LOFI_VIBES) { - category.querySelector("[data-shop-category-logo-holder]").style.display = 'unset'; - category.querySelector("[data-shop-discord-watermark-container]").style.display = 'unset'; - } - if (apiCategory.sku_id === discord_categories.GALAXY) { - category.querySelector("[data-shop-category-logo-holder]").style.display = 'unset'; - category.querySelector("[data-shop-discord-watermark-container]").style.display = 'unset'; - } - if (apiCategory.sku_id === discord_categories.FEELIN_RETRO) { - category.querySelector("[data-shop-category-logo-holder]").style.display = 'unset'; - category.querySelector("[data-shop-discord-watermark-container]").style.display = 'unset'; - } - if (apiCategory.sku_id === discord_categories.PIRATES) { - category.querySelector("[data-shop-category-logo-holder]").style.display = 'unset'; - category.querySelector("[data-shop-discord-watermark-container]").style.display = 'unset'; - } - if (apiCategory.sku_id === discord_categories.ARCADE) { - category.querySelector("[data-shop-category-logo-holder]").style.display = 'unset'; - category.querySelector("[data-shop-discord-watermark-container]").style.display = 'unset'; - } - if (apiCategory.sku_id === discord_categories.TIDE) { - category.querySelector("[data-shop-category-logo-holder]").style.display = 'unset'; - category.querySelector("[data-shop-discord-watermark-container]").style.display = 'unset'; - } - if (apiCategory.sku_id === discord_categories.DARK_FANTASY) { - category.querySelector("[data-shop-discord-watermark-container]").style.display = 'unset'; - } - if (apiCategory.sku_id === discord_categories.ROBERT) { - category.querySelector("[data-shop-category-desc]").style.color = 'black'; - } - if (apiCategory.sku_id === discord_categories.DOJO) { - category.querySelector("[data-shop-category-desc]").style.color = 'black'; - } - if (apiCategory.sku_id === discord_categories.KAWAII_MODE) { - category.querySelector("[data-shop-category-desc]").style.color = 'black'; - } - - if (localStorage.experiment_2025_02_shop_category_modals === "Treatment 1: Enable category modals" || localStorage.experiment_2025_02_shop_category_modals === "Treatment 2: Enable category modals w/ data downloads") { - category.querySelector("[data-shop-category-banner]").classList.add('clickable'); - - category.querySelector("[data-shop-category-banner]").addEventListener("click", () => { - openCategoryModal(); - addParams({itemSkuId: apiCategory.sku_id}) - }); - - const itemSKUForScroll = params.get("itemSkuId"); - - if (itemSKUForScroll === apiCategory.sku_id && modalIsAlreadyOpen != true) { - modalIsAlreadyOpen = true; - setTimeout(() => { - openCategoryModal(); - }, 1000); - } - - - async function openCategoryModal() { - let modal = document.createElement("div"); - - modal.classList.add('modalv2'); - - let categoryModalTabCache = null; - - modal.innerHTML = ` -
-
-

-

-

-

${getTextString("SHOP_CATEGORY_MODAL_ITEM_COUNT")}${apiCategory.products.length}

-
-
-

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_TAB")}

-
- - -
-
-
-
-
-
-
- -
-
-
- `; - - if (localStorage.ext_sty_category_tab === "2") { - modal.querySelector("[data-shop-category-modal-tabs-tab-button-1]").classList.remove("change-category-modal-content-button") - modal.querySelector("[data-shop-category-modal-tabs-tab-button-2]").classList.remove("change-category-modal-content-button") - - modal.querySelector("[data-shop-category-modal-tabs-tab-button-1]").classList.add("change-category-modal-content-button-transparent") - modal.querySelector("[data-shop-category-modal-tabs-tab-button-2]").classList.add("change-category-modal-content-button-transparent") - } else if (localStorage.ext_sty_category_tab === "3") { - modal.querySelector("[data-shop-category-modal-tabs-tab-button-1]").classList.remove("change-category-modal-content-button") - modal.querySelector("[data-shop-category-modal-tabs-tab-button-2]").classList.remove("change-category-modal-content-button") - - modal.querySelector("[data-shop-category-modal-tabs-tab-button-1]").classList.add("change-category-modal-content-button-legacy") - modal.querySelector("[data-shop-category-modal-tabs-tab-button-2]").classList.add("change-category-modal-content-button-legacy") - } - - if (shop_archives_token && localStorage.experiment_2025_05_xp_system === "Treatment 1: Enabled") { - if (!claimablesPromotionsCache) { - - url = api + CLAIMABLES_PROMOTIONS; - fetchUrl = new URL(url); - if (localStorage.staff_unpublished_xp_events == "true") { - fetchUrl.searchParams.append("include-unpublished", "true"); - } - - fetch(fetchUrl, { - method: "GET", - headers: { - "Authorization": shop_archives_token - } - }) // Replace with your API URL - .then(response => response.json()) - .then(data => { - if (data.message) { - - } else { - claimablesPromotionsCache = data; - if (Array.isArray(data) && modal.querySelector("[data-shop-category-modal-tabs-tab-button-3]")) { - data.forEach(promo => { - if (promo.category_data?.sku_id === apiCategory.sku_id) { - modal.querySelector("[data-shop-category-modal-tabs-tab-button-3]").style.display = 'flex'; - } - }); - } - } - - }) - .catch(error => { - console.error(error); - }); - } else { - if (Array.isArray(claimablesPromotionsCache) && modal.querySelector("[data-shop-category-modal-tabs-tab-button-3]")) { - claimablesPromotionsCache.forEach(promo => { - if (promo.category_data?.sku_id === apiCategory.sku_id) { - modal.querySelector("[data-shop-category-modal-tabs-tab-button-3]").style.display = 'flex'; - } - }); - } - } - } - - if (localStorage.experiment_2025_04_reviews_v2_hide_beta_tag === "Treatment 1: Enabled") { - modal.querySelector("[data-review-beta-tag]").style.display = 'none'; - } - - if (localStorage.experiment_2025_04_reviews_v2 === "Treatment 1: Enabled" && localStorage.reviews_filter_type != "3") { - modal.querySelector("[data-shop-category-modal-tabs-tab-button-2]").style.display = 'flex'; - } - - fillCategoryModalContentContainer('assets'); - - const tab_button_1 = modal.querySelector("[data-shop-category-modal-tabs-tab-button-1]"); - const tab_button_2 = modal.querySelector("[data-shop-category-modal-tabs-tab-button-2]"); - const tab_button_3 = modal.querySelector("[data-shop-category-modal-tabs-tab-button-3]"); - - tab_button_1.addEventListener('click', () => { - if (tab_button_2.classList.contains("selected")) { - tab_button_2.classList.remove("selected"); - } else if (tab_button_3.classList.contains("selected")) { - tab_button_3.classList.remove("selected"); - } - tab_button_1.classList.add("selected"); - fillCategoryModalContentContainer('assets'); - categoryModalTabCache = "assets"; - }); - - tab_button_2.addEventListener('click', () => { - if (tab_button_1.classList.contains("selected")) { - tab_button_1.classList.remove("selected"); - } else if (tab_button_3.classList.contains("selected")) { - tab_button_3.classList.remove("selected"); - } - tab_button_2.classList.add("selected"); - fillCategoryModalContentContainer('reviews'); - categoryModalTabCache = "reviews"; - }); - - tab_button_3.addEventListener('click', () => { - if (tab_button_1.classList.contains("selected")) { - tab_button_1.classList.remove("selected"); - } else if (tab_button_2.classList.contains("selected")) { - tab_button_2.classList.remove("selected"); - } - tab_button_3.classList.add("selected"); - fillCategoryModalContentContainer('xp_rewards'); - categoryModalTabCache = "xp_rewards"; - }); - - function fillCategoryModalContentContainer(tab, bypassCache, bypassCache2) { - if (document.getElementById("shop-category-modal-write-review-container") && categoryModalTabCache != "reviews" || document.getElementById("shop-category-modal-write-review-container") && bypassCache === true) { - document.getElementById("shop-category-modal-write-review-container").remove(); - } - if (document.getElementById("shop-category-modal-write-review-container") && tab != "reviews") { - document.getElementById("shop-category-modal-write-review-container").remove(); - } - if (tab === "assets" && categoryModalTabCache != "assets") { - - modal.querySelector("[data-category-modal-inner-content-container]").innerHTML = ``; - - const asset_container = modal.querySelector("[data-category-modal-inner-content-container]"); - - if (apiCategory.banner != null) { - let banner_asset = document.createElement("div"); - - banner_asset.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_BANNER")}

-

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_ID")}${apiCategory.banner}

- - `; - - asset_container.appendChild(banner_asset); - } - - if (apiCategory.banner_asset && apiCategory.banner_asset.static != null) { - let banner_asset = document.createElement("div"); - - banner_asset.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_BANNER_ASSET_1")}

- - `; - - asset_container.appendChild(banner_asset); - } - - if (apiCategory.banner_asset && apiCategory.banner_asset.animated != null) { - let banner_asset = document.createElement("div"); - - banner_asset.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_BANNER_ASSET_2")}

- - `; - - asset_container.appendChild(banner_asset); - } - - if (apiCategory.logo != null) { - let logo_asset = document.createElement("div"); - - logo_asset.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_LOGO")}

-

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_ID")}${apiCategory.logo}

- - `; - - asset_container.appendChild(logo_asset); - } - - if (apiCategory.mobile_bg != null) { - let mobile_bg_asset = document.createElement("div"); - - mobile_bg_asset.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_MOBILE_BG")}

-

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_ID")}${apiCategory.mobile_bg}

- - `; - - asset_container.appendChild(mobile_bg_asset); - } - - if (apiCategory.pdp_bg != null) { - let pdp_bg_asset = document.createElement("div"); - - pdp_bg_asset.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_PDP_BG")}

-

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_ID")}${apiCategory.pdp_bg}

- - `; - - asset_container.appendChild(pdp_bg_asset); - } - - if (apiCategory.success_modal_bg != null) { - let success_modal_bg_asset = document.createElement("div"); - - success_modal_bg_asset.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_SUCCESS_MODAL_BG")}

-

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_ID")}${apiCategory.success_modal_bg}

- - `; - - asset_container.appendChild(success_modal_bg_asset); - } - - if (apiCategory.mobile_banner != null) { - let mobile_banner_asset = document.createElement("div"); - - mobile_banner_asset.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_MOBILE_BANNER")}

-

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_ID")}${apiCategory.mobile_banner}

- - `; - - asset_container.appendChild(mobile_banner_asset); - } - - if (apiCategory.featured_block != null) { - let featured_block_asset = document.createElement("div"); - - featured_block_asset.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_FEATURED_BLOCK")}

-

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_ID")}${apiCategory.featured_block}

- - `; - - asset_container.appendChild(featured_block_asset); - } - - if (apiCategory.hero_banner != null) { - let hero_banner_asset = document.createElement("div"); - - hero_banner_asset.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_HERO_BANNER")}

-

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_ID")}${apiCategory.hero_banner}

- - `; - - asset_container.appendChild(hero_banner_asset); - } - - if (apiCategory.hero_banner_asset && apiCategory.hero_banner_asset.static != null) { - let hero_banner_asset = document.createElement("div"); - - hero_banner_asset.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_HERO_BANNER_ASSET_1")}

- - `; - - asset_container.appendChild(hero_banner_asset); - } - - if (apiCategory.hero_banner_asset && apiCategory.hero_banner_asset.animated != null) { - let hero_banner_asset = document.createElement("div"); - - hero_banner_asset.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_HERO_BANNER_ASSET_2")}

- - `; - - asset_container.appendChild(hero_banner_asset); - } - - if (apiCategory.wide_banner != null) { - let wide_banner_asset = document.createElement("div"); - - wide_banner_asset.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_WIDE_BANNER")}

-

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_ID")}${apiCategory.wide_banner}

- - `; - - asset_container.appendChild(wide_banner_asset); - } - - if (apiCategory.hero_logo != null) { - let hero_logo_asset = document.createElement("div"); - - hero_logo_asset.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_HERO_LOGO")}

-

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_ID")}${apiCategory.hero_logo}

- - `; - - asset_container.appendChild(hero_logo_asset); - } - - if (apiCategory.category_bg != null) { - let category_bg_asset = document.createElement("div"); - - category_bg_asset.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_CATEGORY_BG")}

-

${getTextString("SHOP_CATEGORY_MODAL_ASSETS_ID")}${apiCategory.category_bg}

- - `; - - asset_container.appendChild(category_bg_asset); - } - } else if (tab === "reviews" && categoryModalTabCache != "reviews" || bypassCache === true) { - - modal.querySelector("[data-category-modal-inner-content-container]").innerHTML = ` -
-

${getTextString("SHOP_CATEGORY_MODAL_REVIEWS_LOADING")}

-
- `; - - fetch(api + REVIEWSAPI + '/' + apiCategory.sku_id, { - method: "GET", - headers: { - "Password": api_password, - "Authorization": discord_token, - "Token": api_token - } - }) // Replace with your API URL - .then(response => response.json()) - .then(data => { - if (data.message && data.message === "Reviews disabled") { - modal.querySelector("[data-category-modal-inner-content-container]").innerHTML = ``; - - let reviewNoneElement = document.createElement("div"); - - reviewNoneElement.classList.add("review-element-warning"); - - reviewNoneElement.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_REVIEWS_DISABLED")}

- `; - - modal.querySelector("[data-category-modal-inner-content-container]").appendChild(reviewNoneElement); - - } else if (data.message && data.message === "This service is temporarily unavailable, down for maintenance.") { - modal.querySelector("[data-category-modal-inner-content-container]").innerHTML = ``; - - let reviewNoneElement = document.createElement("div"); - - reviewNoneElement.classList.add("review-element-warning"); - - reviewNoneElement.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_REVIEWS_UNAVAILABLE")}

- `; - - modal.querySelector("[data-category-modal-inner-content-container]").appendChild(reviewNoneElement); - - } else if (tab === "reviews" && categoryModalTabCache === "reviews") { - renderReviews(data); - - let hasReviewAlready = false; - - data.forEach(review => { - if (review.users.id === localStorage.discord_user_id) { - hasReviewAlready = true; - } - }); - - if (localStorage.experiment_2025_05_m === "Treatment 1: Enabled") { - - } else if (shop_archives_token && hasReviewAlready === false) { - let writeReviewContainer = document.createElement("div"); - - writeReviewContainer.classList.add("shop-category-modal-write-review-container"); - writeReviewContainer.id = 'shop-category-modal-write-review-container'; - writeReviewContainer.innerHTML = ` -

-
-
- - - - - -
- - - -
- `; - - writeReviewContainer.querySelector("[data-post-review-button]").onclick = function(){ - postReview(`${apiCategory.sku_id}`, 0); - }; - - - const stars = writeReviewContainer.querySelectorAll('#star-rating svg'); - let selectedRating = 0; - - stars.forEach(star => { - star.addEventListener('click', () => { - selectedRating = parseInt(star.getAttribute('data-value')); - updateStars(selectedRating); - }); - }); - - function updateStars(rating) { - stars.forEach(star => { - const value = parseInt(star.getAttribute('data-value')); - star.classList.toggle('filled', value <= rating); - }); - writeReviewContainer.querySelector("[data-post-review-button]").onclick = function(){ - postReview(`${apiCategory.sku_id}`, selectedRating); - }; - } - - modal.querySelector(".category-modalv2-inner-left").appendChild(writeReviewContainer); - } else if (shop_archives_token) { - let writeReviewContainer = document.createElement("div"); - - writeReviewContainer.classList.add("shop-category-modal-write-review-container"); - writeReviewContainer.id = 'shop-category-modal-write-review-container'; - writeReviewContainer.innerHTML = ` -

-
-
- - - - - -
- - - -
- `; - - writeReviewContainer.querySelector("[data-post-review-button]").onclick = function(){ - postReview(`${apiCategory.sku_id}`, 0); - }; - - - const stars = writeReviewContainer.querySelectorAll('#star-rating svg'); - let selectedRating = 0; - - stars.forEach(star => { - star.addEventListener('click', () => { - selectedRating = parseInt(star.getAttribute('data-value')); - updateStars(selectedRating); - }); - }); - - function updateStars(rating) { - stars.forEach(star => { - const value = parseInt(star.getAttribute('data-value')); - star.classList.toggle('filled', value <= rating); - }); - writeReviewContainer.querySelector("[data-post-review-button]").onclick = function(){ - postReview(`${apiCategory.sku_id}`, selectedRating); - }; - } - - - modal.querySelector(".category-modalv2-inner-left").appendChild(writeReviewContainer); - } else { - let writeReviewContainer = document.createElement("div"); - - writeReviewContainer.classList.add("shop-category-modal-write-review-container"); - writeReviewContainer.id = 'shop-category-modal-write-review-container'; - writeReviewContainer.innerHTML = ` -
- -
- `; - - modal.querySelector(".category-modalv2-inner-left").appendChild(writeReviewContainer); - } - } - - }) - .catch(error => { - modal.querySelector("[data-category-modal-inner-content-container]").innerHTML = ` -
-

${getTextString("SHOP_CATEGORY_MODAL_REVIEWS_ERROR")}

-

${error}

-
- `; - console.error(error); - }); - - function renderReviews(datareview) { - if (localStorage.experiment_2025_05_m === "Treatment 1: Enabled") { - modal.querySelector("[data-category-modal-inner-content-container]").innerHTML = ``; - - let reviewNoneElement = document.createElement("div"); - - reviewNoneElement.classList.add("review-element-warning"); - - reviewNoneElement.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_REVIEWS_UNAVAILABLE")}

- `; - - modal.querySelector("[data-category-modal-inner-content-container]").appendChild(reviewNoneElement); - } else if (Array.isArray(datareview) && datareview.length === 0) { - modal.querySelector("[data-category-modal-inner-content-container]").innerHTML = ``; - - let reviewNoneElement = document.createElement("div"); - - reviewNoneElement.classList.add("review-element-notice"); - - reviewNoneElement.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_REVIEWS_NONE")}

- `; - - modal.querySelector("[data-category-modal-inner-content-container]").appendChild(reviewNoneElement); - } else { - const reviewContainer = modal.querySelector("[data-category-modal-inner-content-container]"); - - if (localStorage.staff_enable_override_review_content === "true") { - let reviewOverrideWarningElement = document.createElement("div"); - - reviewOverrideWarningElement.classList.add("review-element-notice"); - - reviewOverrideWarningElement.innerHTML = ` -

${getTextString("SHOP_CATEGORY_MODAL_REVIEWS_OVERRIDE_WARNING")}

- `; - - modal.querySelector("[data-category-modal-inner-content-container]").appendChild(reviewOverrideWarningElement); - } - - datareview.forEach(review => { - if (localStorage.reviews_filter_type === "1" || localStorage.discord_user_id === review.users.id || localStorage.reviews_filter_type === "2" && review.review_flag_type != 2) { - let reviewElement = document.createElement("div"); - - reviewElement.classList.add("review-element"); - - if (review.system_type === 1) { - reviewElement.classList.add("review-element-warning"); - reviewElement.classList.add("review-element-system"); - } else if (review.system_type === 2) { - reviewElement.classList.add("review-element-notice"); - reviewElement.classList.add("review-element-system"); - } - - let reviewTextOutput = review.review_text; - - reviewElement.innerHTML = ` -
-
- - -

-
-

-
-
- `; - - if (localStorage.experiment_2025_05_reviews_v2_user_profile === "Treatment 1: Enabled") { - reviewElement.querySelector("[data-shop-modal-review-name]").classList.add("clickable"); - - reviewElement.querySelector("[data-shop-modal-review-name]").addEventListener("click", () => { - fetchUserProfileInfo(review.users.id); - }); - } - - if (review.users.global_name && review.users.global_name != null) { - reviewElement.querySelector("[data-shop-modal-review-name]").textContent = review.users.global_name; - } else { - reviewElement.querySelector("[data-shop-modal-review-name]").textContent = review.users.username; - } - - if (localStorage.experiment_2025_04_reviews_v2_custom_emojis_render === "Treatment 1: Enabled") { - if (localStorage.staff_enable_override_review_content === "true") { - reviewElement.querySelector("[data-review-content-text-output]").innerHTML = renderReviewTextWithEmojis(localStorage.staff_raw_review_override_content); - } else { - reviewElement.querySelector("[data-review-content-text-output]").innerHTML = renderReviewTextWithEmojis(review.review_text); - } - } else { - if (localStorage.staff_enable_override_review_content === "true") { - reviewElement.querySelector("[data-review-content-text-output]").textContent = localStorage.staff_raw_review_override_content; - } else { - reviewElement.querySelector("[data-review-content-text-output]").textContent = reviewTextOutput; - } - } - - if (review.users.id === localStorage.discord_user_id || localStorage.admin_level && localStorage.admin_level != "0") { - let deleteReviewIcon = document.createElement("div"); - - deleteReviewIcon.title = getTextString("SHOP_CATEGORY_MODAL_REVIEWS_DELETE_HOVER"); - - deleteReviewIcon.innerHTML = ` - - `; - - reviewElement.querySelector("[data-shop-modal-review-moderation-buttons]").appendChild(deleteReviewIcon); - } - - if (localStorage.experiment_2025_04_reviews_v2_report === "Treatment 1: Enabled" && review.report_type === 0 && review.users.id != localStorage.discord_user_id && localStorage.account_type === "2") { - let reportReviewIcon = document.createElement("div"); - - reportReviewIcon.title = getTextString("SHOP_CATEGORY_MODAL_REVIEWS_REPORT_HOVER"); - - reportReviewIcon.innerHTML = ` - - `; - - reportReviewIcon.querySelector("[data-report-review-button]").onclick = function(){ - openReviewReportModal(review.id, review.review_text, review.users.username); - }; - - reviewElement.querySelector("[data-shop-modal-review-moderation-buttons]").appendChild(reportReviewIcon); - } else if (localStorage.experiment_2025_04_reviews_v2_report === "Treatment 1: Enabled" && review.report_type != 0 && localStorage.admin_level != "0" && localStorage.account_type === "2") { - let reportReviewIcon = document.createElement("div"); - - reportReviewIcon.title = getTextString("SHOP_CATEGORY_MODAL_REVIEWS_REPORT_HOVER"); - - reportReviewIcon.innerHTML = ` - - `; - - reportReviewIcon.querySelector("[data-report-review-button]").onclick = function(){ - openReviewReportModal(review.id, review.review_text, review.users.username); - }; - - reviewElement.querySelector("[data-shop-modal-review-moderation-buttons]").appendChild(reportReviewIcon); - } - - if (review.users.system === true) { - let moderatorNametag = document.createElement("p"); - - moderatorNametag.classList.add("shop-modal-review-nametag-moderator"); - moderatorNametag.textContent = `${getTextString("SHOP_CATEGORY_MODAL_NAMETAG_SYSTEM")}`; - moderatorNametag.title = `${getTextString("SHOP_CATEGORY_MODAL_NAMETAG_SYSTEM_TITLE")}`; - - reviewElement.querySelector("[data-shop-modal-review-name-container]").appendChild(moderatorNametag); - } - - if (review.users.primary_guild) { - let reviewServerTagContainer = document.createElement("div"); - - reviewServerTagContainer.classList.add("shop-modal-review-server-tag-container"); - reviewServerTagContainer.innerHTML = ` - -

${review.users.primary_guild.tag}

- `; - - reviewElement.querySelector("[data-shop-modal-review-name-container]").appendChild(reviewServerTagContainer); - } - - if (Array.isArray(review.users.badges)) { - let reviewBadgesContainer = document.createElement("div"); - reviewBadgesContainer.classList.add("shop-modal-review-badges-container"); - - review.users.badges.forEach(badge => { - const badgeImg = document.createElement("img"); - badgeImg.src = badge.src; - badgeImg.alt = badge.name; - badgeImg.title = badge.name; - badgeImg.classList.add("review-badge"); - - if (badge.support) { - const badgeLink = document.createElement("a"); - badgeLink.href = badge.support; - badgeLink.target = "_blank"; - badgeLink.rel = "noopener noreferrer"; - badgeLink.appendChild(badgeImg); - reviewBadgesContainer.appendChild(badgeLink); - } else { - reviewBadgesContainer.appendChild(badgeImg); - } - }); - - reviewElement.querySelector("[data-shop-modal-review-name-container]").appendChild(reviewBadgesContainer); - } - - - - let starRating = document.createElement("div"); - - starRating.classList.add("shop-modal-review-star-container"); - starRating.setAttribute('data-shop-modal-review-star-container', ''); - - reviewElement.querySelector("[data-shop-modal-review-name-container]").appendChild(starRating); - - - const date = new Date(review.created_at); - - const day = String(date.getDate()).padStart(2, '0'); - const month = String(date.getMonth() + 1).padStart(2, '0'); // getMonth is 0-indexed - const year = date.getFullYear(); - - if (localStorage.reviews_time_type === "uk") { - const formatted = `${day}/${month}/${year}`; - - let createdAtTag = document.createElement("p"); - - createdAtTag.classList.add("shop-modal-review-time-container"); - createdAtTag.textContent = `${formatted}`; - - reviewElement.querySelector("[data-shop-modal-review-name-container]").appendChild(createdAtTag); - } else { - const formatted = `${month}/${day}/${year}`; - - let createdAtTag = document.createElement("p"); - - createdAtTag.classList.add("shop-modal-review-time-container"); - createdAtTag.textContent = `${formatted}`; - - reviewElement.querySelector("[data-shop-modal-review-name-container]").appendChild(createdAtTag); - } - - - if (review.rating === 5) { - reviewElement.querySelector("[data-shop-modal-review-star-container]").innerHTML = ` - - `; - } else if (review.rating === 4) { - reviewElement.querySelector("[data-shop-modal-review-star-container]").innerHTML = ` - - `; - } else if (review.rating === 3) { - reviewElement.querySelector("[data-shop-modal-review-star-container]").innerHTML = ` - - `; - } else if (review.rating === 2) { - reviewElement.querySelector("[data-shop-modal-review-star-container]").innerHTML = ` - - `; - } else if (review.rating === 1) { - reviewElement.querySelector("[data-shop-modal-review-star-container]").innerHTML = ` - - `; - } else if (review.rating === 0) { - reviewElement.querySelector("[data-shop-modal-review-star-container]").innerHTML = ` - - `; - } - if (document.getElementById("loading-category-reviews")) { - document.getElementById("loading-category-reviews").remove(); - } - - reviewContainer.appendChild(reviewElement); - } - }); - - function openReviewReportModal(reviewID, reviewText, reviewUser) { - let modal = document.createElement("div"); - - modal.classList.add('modalv2'); - modal.id = 'modalv2-report-review'; - - modal.innerHTML = ` -
-

${getTextString("SHOP_CATEGORY_MODAL_REVIEWS_REPORT_HEADER")}

-

${getTextString("SHOP_CATEGORY_MODAL_REVIEWS_REPORT_PREVIEW")}

-
-
-
-

${reviewUser}

-
-

-
-
- - -

${getTextString("SHOP_CATEGORY_MODAL_REVIEWS_REPORT_SUMMARY")}

-
-
-

${getTextString("SHOP_CATEGORY_MODAL_REVIEWS_REPORT_1")}

-
-
-

${getTextString("SHOP_CATEGORY_MODAL_REVIEWS_REPORT_2")}

-
-
-

${getTextString("SHOP_CATEGORY_MODAL_REVIEWS_REPORT_3")}

-
-
-

${getTextString("SHOP_CATEGORY_MODAL_REVIEWS_REPORT_4")}

-

${getTextString("SHOP_CATEGORY_MODAL_REVIEWS_REPORT_4_SUMMARY")}

-
-
-

${getTextString("SHOP_CATEGORY_MODAL_REVIEWS_REPORT_5")}

-
-
-

${getTextString("SHOP_CATEGORY_MODAL_REVIEWS_REPORT_DISCLAIMER")}

-

${getTextString("SHOP_CATEGORY_MODAL_REVIEWS_REPORT_DISCLAIMER1")}

-
-

- -
- -
-
- `; - - modal.querySelector("[data-review-report-text-output]").textContent = reviewText; - - modal.querySelector("[data-reviews-send-report-button]").addEventListener('click', () => { - reportReview(document.getElementById("report-review-report-card-inv-imput-review-id").value, document.getElementById("report-review-report-card-inv-imput").value); - }); - - if (localStorage.dev === "true") { - modal.querySelector("[data-dev-only-remove-report-button-container]").innerHTML = ` - - `; - modal.querySelector("[data-reviews-remove-report-button]").addEventListener('click', () => { - reportReview(document.getElementById("report-review-report-card-inv-imput-review-id").value, 0); - }); - } - - document.body.appendChild(modal); - - setTimeout(() => { - modal.classList.add('show'); - }, 1); - - - let modal_back = document.createElement("div"); - - modal_back.classList.add('modalv2-back'); - modal_back.classList.add('modalv2-back-review-report'); - modal_back.id = 'modalv2-report-review-back'; - - document.body.appendChild(modal_back); - - setTimeout(() => { - modal_back.classList.add('show'); - }, 1); - - - modal.addEventListener('click', (event) => { - if (event.target === modal) { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - } - }); - - modal.querySelector(".cancel-button").addEventListener('click', () => { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - }); - } - - } - - } - } else if (tab === "xp_rewards" && categoryModalTabCache != "xp_rewards" || bypassCache2 === true) { - modal.querySelector("[data-category-modal-inner-content-container]").innerHTML = ``; - - if (Array.isArray(claimablesPromotionsCache)) { - claimablesPromotionsCache.forEach(promo => { - - if (promo.already_claimed === false && promo.category_data?.sku_id === apiCategory.sku_id) { - - let promoBanner = document.createElement("div"); - - promoBanner.classList.add("xp-reward-promo-card"); - - promoBanner.innerHTML = ` -
-

Claim your free ${promo.xp_reward} XP!

-

You have ${promo.xp_reward} XP waiting for you!

- Learn More about XP - -
- `; - - modal.querySelector("[data-category-modal-inner-content-container]").appendChild(promoBanner); - } else if (promo.category_data?.sku_id === apiCategory.sku_id) { - - let promoBanner = document.createElement("div"); - - promoBanner.classList.add("xp-reward-promo-card"); - - promoBanner.innerHTML = ` -
-

You claimed ${promo.xp_reward} XP.

-

You already claimed this reward.

- Learn More about XP -
- `; - - modal.querySelector("[data-category-modal-inner-content-container]").appendChild(promoBanner); - } - }); - } - - } else { - console.log("already on that tab") - } - } - - window.fillCategoryModalContentContainer = fillCategoryModalContentContainer; - - - modal.querySelector("[data-product-modal-sku-id]").textContent = `${getTextString("SHOP_CATEGORY_MODAL_SKU_ID")}${apiCategory.sku_id}`; - modal.querySelector("[data-product-modal-name]").textContent = apiCategory.name; - modal.querySelector("[data-product-modal-summary]").textContent = apiCategory.summary; - - document.body.appendChild(modal); - - setTimeout(() => { - modal.classList.add('show'); - }, 1); - - - const top_button_container = document.querySelector("[data-modal-top-product-buttons]"); - - - if (localStorage.experiment_2025_02_shop_category_modals === "Treatment 2: Enable category modals w/ data downloads") { - let downloadItemData = document.createElement("div"); - - downloadItemData.title = getTextString("SHOP_DOWNLOAD_DATA"); - downloadItemData.innerHTML = ` - - `; - - top_button_container.appendChild(downloadItemData); - } - - if (localStorage.experiment_2025_03_view_raw_modal === "Treatment 1: Enabled") { - let rawItemData = document.createElement("div"); - - rawItemData.title = getTextString("SHOP_VIEW_RAW_DATA"); - rawItemData.innerHTML = ` - - `; - - top_button_container.appendChild(rawItemData); - - modal.querySelector("[data-view-raw-product-card-button]").onclick = function(){ - openRawModal(); - }; - - async function openRawModal() { - let modal = document.createElement("div"); - - modal.classList.add('modalv2'); - - modal.innerHTML = ` -
- -
- `; - - document.body.appendChild(modal); - - setTimeout(() => { - modal.classList.add('show'); - }, 1); - - - let modal_back = document.createElement("div"); - - modal_back.classList.add('modalv2-back'); - modal_back.id = 'modalv2-back'; - - document.body.appendChild(modal_back); - - setTimeout(() => { - modal_back.classList.add('show'); - }, 1); - - - modal.addEventListener('click', (event) => { - if (event.target === modal) { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - } - }); - - document.querySelector("[data-close-product-card-button]").addEventListener('click', () => { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - }); - } - } - - - const unpublishedAt = new Date(apiCategory.unpublished_at); - - if (apiCategory.unpublished_at && !isNaN(unpublishedAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = unpublishedAt - now; - - if (timeDiff <= 0) { - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("SHOP_CATEGORY_NOT_IN_STORE")}

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${days}${getTextString("SHOP_CATEGORY_DAYS_LEFT_IN_STORE")}

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - - - let modal_back = document.createElement("div"); - - modal_back.classList.add('modalv2-back'); - modal_back.id = 'modalv2-back'; - - document.body.appendChild(modal_back); - - setTimeout(() => { - modal_back.classList.add('show'); - }, 1); - - - modal.addEventListener('click', (event) => { - if (event.target === modal) { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - removeParams('itemSkuId'); - modalIsAlreadyOpen = false; - } - }); - - document.querySelector("[data-close-product-card-button]").addEventListener('click', () => { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - removeParams('itemSkuId'); - modalIsAlreadyOpen = false; - }); - } - } - - - const unpublishedAt = new Date(apiCategory.unpublished_at); - - if (apiCategory.unpublished_at && !isNaN(unpublishedAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = unpublishedAt - now; - - if (timeDiff <= 0) { - category.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("SHOP_CATEGORY_NOT_IN_STORE")}

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - category.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${days}${getTextString("SHOP_CATEGORY_DAYS_LEFT_IN_STORE")}

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - - const cardOutput = category.querySelector("[data-shop-category-card-holder]"); - - if (localStorage.ext_sty_shop_cards === "2") { - cardOutput.classList.remove("shop-category-card-holder"); - cardOutput.classList.add("shop-category-card-holder-standard"); - } else { - cardOutput.classList.add("shop-category-card-holder"); - } - - if (cardOutput) { - for (const product of apiCategory.products) { - const cardTemplate = document.querySelector("[data-shop-item-card-template]"); - const card = cardTemplate.content.cloneNode(true).children[0]; - - if (localStorage.ext_sty_shop_cards === "2") { - card.classList.remove("shop-category-card"); - card.classList.add("shop-category-card-standard"); - - if (product.styles && product.styles.background_colors != null) { - function decodePrimaryCard(decimal) { - const r = (decimal >> 16) & 0xFF; // Extract Red (top 8 bits) - const g = (decimal >> 8) & 0xFF; // Extract Green (middle 8 bits) - const b = decimal & 0xFF; // Extract Blue (bottom 8 bits) - return { r, g, b }; - } - - function decodeSecondaryCard(decimal) { - const r1 = (decimal >> 16) & 0xFF; // Extract Red (top 8 bits) - const g1 = (decimal >> 8) & 0xFF; // Extract Green (middle 8 bits) - const b1 = decimal & 0xFF; // Extract Blue (bottom 8 bits) - return { r1, g1, b1 }; - } - - // Example usage: - const cardPrimaryColorDecimal = product.styles.background_colors[0]; // example (like 0xFFA000) - const { r, g, b } = decodePrimaryCard(cardPrimaryColorDecimal); - - const cardSecondaryColorDecimal = product.styles.background_colors[1]; // example (like 0xFFA000) - const { r1, g1, b1 } = decodeSecondaryCard(cardSecondaryColorDecimal); - card.style.backgroundImage = `linear-gradient(rgb(${r}, ${g}, ${b}),rgb(${r1}, ${g1}, ${b1}))`; - } - - } else { - card.classList.add("shop-category-card"); - } - - card.id = product.sku_id; - - if (product.type === item_types.NONE) { - card.classList.add("type_100"); - card.classList.add('hidden') - } else if (product.type === item_types.AVATAR_DECORATION) { - product.items.forEach(item => { - - card.classList.add("type_0"); - // Set the innerHTML for the preview holder - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - previewHolder.classList.add('avatar-decoration-image'); - - // Set the initial image for the deco card - const imgElement = document.createElement("img"); - imgElement.id = "shop-card-deco-image"; - imgElement.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - - previewHolder.appendChild(imgElement); - - const bgimg = document.createElement("div"); - bgimg.id = "shop-card-deco-bg-image"; - - previewHolder.appendChild(bgimg); - - // Set the product details - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - card.querySelector("[data-product-card-sku-id]").textContent = ``; - } else { - card.querySelector("[data-product-card-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - } - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - // Hover effect: Change the image src on mouse enter and leave - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - imgElement.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=true`; - if (localStorage.discord_avatar != defaultAvatar1 && localStorage.discord_avatar != defaultAvatar2 && localStorage.discord_avatar != defaultAvatar3 && localStorage.discord_avatar != defaultAvatar4 && localStorage.discord_avatar != defaultAvatar5 && localStorage.discord_avatar != defaultAvatar6) { - bgimg.style.backgroundImage = `url(${localStorage.discord_avatar})` - } - }); - - card.addEventListener("mouseleave", () => { - imgElement.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - bgimg.style.backgroundImage = `url(data:image/png;base64,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)`; - }); - } - - }); - } else if (product.type === item_types.PROFILE_EFFECT) { - card.classList.add("type_1"); - - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - card.querySelector("[data-product-card-sku-id]").textContent = ``; - } else { - card.querySelector("[data-product-card-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - } - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - // Ensure the item ID is accessible here - let itemId = undefined; - if (Array.isArray(product.items)) { - // If items is an array, find the item with type 1 and get its id - const item = product.items.find(item => item.type === 1); - if (item) { - itemId = item.id; - } - } else if (product.items && product.items.type === 1) { - // If items is an object and has type 1, get its id - itemId = product.items.id; - } - - - if (!discordProfileEffectsCache) { - await setDiscordProfileEffectCache(); - } - - // Find matching profile effect - const matchingEffect = discordProfileEffectsCache.find(effect => effect.id === itemId); - - if (matchingEffect) { - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - previewHolder.classList.add('profile-effect-image'); - - previewHolder.innerHTML = ` - - `; - - // Hover effect: change to the first effect URL (use 'src' from the 'effects' array) - const imgElement = card.querySelector("img"); - - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - imgElement.src = effectUrl || matchingEffect.thumbnailPreviewSrc; - } - }); - - card.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - card.addEventListener("mouseenter", () => { - imgElement.src = matchingEffect.reducedMotionSrc; - }); - - card.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } - } else if (product.type === item_types.NAMEPLATE) { - card.classList.add("type_2"); - - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - card.querySelector("[data-product-card-sku-id]").textContent = ``; - } else { - card.querySelector("[data-product-card-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - } - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - - if (localStorage.discord_displayname && localStorage.discord_displayname != '') { - previewName = localStorage.discord_displayname; - } else { - previewName = 'Default User' - } - - previewHolder.innerHTML = ` -
-
-
-
-
-
-
-
-
-
-
-
-
- -
-

${previewName}

-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- `; - - product.items.forEach(item => { - const nameplatePreview = previewHolder.querySelector("[data-user-nameplate-preview]"); - const paletteName = item.palette; - const asset = `https://cdn.discordapp.com/assets/collectibles/${item.asset}asset.webm`; - const bgcolor = nameplate_palettes[paletteName].darkBackground; - - const videoElement = previewHolder.querySelector("[data-user-nameplate-preview-img]"); - - videoElement.src = asset; - - nameplatePreview.style.backgroundImage = `linear-gradient(90deg, #00000000 -30%, ${bgcolor} 200%)`; - // nameplatePreview.style.boxShadow = `0 0 0 1px #a10606`; - - const nullUserNameRandomWidth = previewHolder.querySelectorAll("[data-null-user-random-name]"); - - nullUserNameRandomWidth.forEach(UserName => { - const randomWidth = Math.floor(Math.random() * (180 - 80 + 1)) + 80; - UserName.style.width = randomWidth + `px`; - }); - - const nullUserAvatar = previewHolder.querySelectorAll("[data-nameplate-user-random-avatar]"); - - nullUserAvatar.forEach(UserAvatar => { - UserAvatar.style.backgroundImage = `url(${localStorage.discord_avatar})`; - }); - - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - videoElement.play(); - }); - card.addEventListener("mouseleave", () => { - videoElement.pause(); - }); - } - }); - - } else if (product.type === item_types.BUNDLE) { - card.classList.add("type_1000"); - // Fetch the bundled products for the bundle summary - const bundledProducts = product.bundled_products || []; - - // Generate the bundle summary from the names of the bundled products - const type0Product = bundledProducts.find(item => item.type === 0); - const type1Product = bundledProducts.find(item => item.type === 1); - - let bundleSummary = `${getTextString("CARD_TYPE_BUNDLE_TITLE")}`; - if (type0Product) { - bundleSummary += `${type0Product.name}${getTextString("CARD_TYPE_BUNDLE_TITLE_DECO")}`; - } - if (type1Product) { - bundleSummary += `${type1Product.name}${getTextString("CARD_TYPE_BUNDLE_TITLE_EFFECT")}`; - } - - // Set the summary text - card.querySelector("[data-product-card-summary]").textContent = bundleSummary; - - // Set the basic card details - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - card.querySelector("[data-product-card-sku-id]").textContent = ``; - } else { - card.querySelector("[data-product-card-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - } - card.querySelector("[data-product-card-name]").textContent = product.name; - - // Handle each item in the bundle - product.items.forEach(item => { - if (item.type === 0) { - // Avatar decoration - const decoImage = document.createElement("img"); - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - decoImage.alt = "Avatar Decoration"; - decoImage.classList.add("avatar-decoration-image"); - card.querySelector("[data-shop-card-preview-holder]").appendChild(decoImage); - - const bgimg = document.createElement("div"); - bgimg.classList.add("avatar-decoration-bg-image"); - - card.querySelector("[data-shop-card-preview-holder]").appendChild(bgimg); - - // Hover effect for decoration image - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=true`; - if (localStorage.discord_avatar != defaultAvatar1 && localStorage.discord_avatar != defaultAvatar2 && localStorage.discord_avatar != defaultAvatar3 && localStorage.discord_avatar != defaultAvatar4 && localStorage.discord_avatar != defaultAvatar5 && localStorage.discord_avatar != defaultAvatar6) { - bgimg.style.backgroundImage = `url(${localStorage.discord_avatar})` - } - }); - card.addEventListener("mouseleave", () => { - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - bgimg.style.backgroundImage = `url(data:image/png;base64,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)`; - }); - } - } else if (item.type === 1) { - // Profile effect - (async () => { - if (!discordProfileEffectsCache) { - await setDiscordProfileEffectCache(); - } - - // Find the matching effect - const matchingEffect = discordProfileEffectsCache.find(effect => effect.id === item.id); - - if (matchingEffect) { - const effectImage = document.createElement("img"); - effectImage.src = matchingEffect.thumbnailPreviewSrc; - effectImage.alt = "Profile Effect"; - effectImage.classList.add("profile-effect-image"); - card.querySelector("[data-shop-card-preview-holder]").appendChild(effectImage); - - // Hover effect for profile effect - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects[0] && matchingEffect.effects[0].src) { - effectImage.src = matchingEffect.effects[0].src; - } - }); - card.addEventListener("mouseleave", () => { - effectImage.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - card.addEventListener("mouseenter", () => { - effectImage.src = matchingEffect.reducedMotionSrc; - }); - card.addEventListener("mouseleave", () => { - effectImage.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } - })(); - } - }); - } else if (product.type === item_types.VARIANTS_GROUP) { - // Update SKU and summary - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - card.querySelector("[data-product-card-sku-id]").textContent = ``; - } else { - card.querySelector("[data-product-card-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - } - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - // Always display the base variant name - card.querySelector("[data-product-card-name]").textContent = product.variants[0]?.base_variant_name || "Product"; - - // Render variant color blocks as interactive divs - const variantContainer = card.querySelector("[data-shop-card-var-container]"); - variantContainer.innerHTML = ""; // Clear existing variant blocks - let currentSelectedVariant = null; // Track selected variant - - product.variants.forEach((variant, index) => { - // Create variant color block - const variantColorBlockTmp = document.querySelector("[data-shop-varcolorblock-template]"); - const variantColorBlock = variantColorBlockTmp.content.cloneNode(true).children[0]; - variantColorBlock.classList.add("shop-card-var"); - variantColorBlock.id = "shop-card-var"; - variantColorBlock.style.backgroundColor = `${variant.variant_value}`; - - // Add click event listener to switch variants - variantColorBlock.addEventListener("click", () => { - if (currentSelectedVariant) { - currentSelectedVariant.classList.remove("shop-card-var-selected"); - } - variantColorBlock.classList.add("shop-card-var-selected"); - currentSelectedVariant = variantColorBlock; - applyVariant(variant); - }); - - // Append the color block to the container - variantContainer.appendChild(variantColorBlock); - - // Set the first variant as the default selected - if (index === 0) { - currentSelectedVariant = variantColorBlock; - variantColorBlock.classList.add("shop-card-var-selected"); - } - }); - - let isFirstTimeLoadingVariant = true; - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - - // Function to apply the selected variant - function applyVariant(selectedVariant) { - card.querySelector("[data-shop-card-var-title]").textContent = `(${selectedVariant.variant_label})`; - - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - card.querySelector("[data-product-card-sku-id]").textContent = ``; - } else { - card.querySelector("[data-product-card-sku-id]").textContent = `SKU ID: ${selectedVariant.sku_id}`; - } - - if (localStorage.experiment_2025_02_shop_card_modals != "Treatment 1: Enable modals" && localStorage.experiment_2025_02_shop_card_modals != "Treatment 2: Enable modals w/ data downloads" && localStorage.experiment_2025_02_shop_card_modals != "Treatment 3: Enable modals w/ p+" && localStorage.experiment_2025_02_shop_card_modals != "Treatment 4: Enable modals w/ p+ on p+ page" && localStorage.experiment_2025_02_shop_card_modals != "Treatment 5: Enable modals w/ data downloads and p+" && localStorage.experiment_2025_02_shop_card_modals != "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - card.querySelector("[data-share-product-card-button]").innerHTML = ` - - `; - } - - if (selectedVariant.type === 0) { - card.classList.add("type_2000-0"); - previewHolder.innerHTML = ""; // Clear previous decorations - previewHolder.classList.add('avatar-decoration-image'); - - // Add the avatar decoration based on the selected variant - selectedVariant.items?.forEach(item => { - const decoImage = document.createElement("img"); - const bgimg = document.createElement("div"); - if (isFirstTimeLoadingVariant == true) { - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - isFirstTimeLoadingVariant = false; - } else { - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=true`; - if (localStorage.discord_avatar != defaultAvatar1 && localStorage.discord_avatar != defaultAvatar2 && localStorage.discord_avatar != defaultAvatar3 && localStorage.discord_avatar != defaultAvatar4 && localStorage.discord_avatar != defaultAvatar5 && localStorage.discord_avatar != defaultAvatar6) { - bgimg.style.backgroundImage = `url(${localStorage.discord_avatar})` - } - } - decoImage.alt = "Avatar Decoration"; - decoImage.id = "shop-card-deco-image"; - previewHolder.appendChild(decoImage); - - bgimg.id = "shop-card-deco-bg-image"; - - previewHolder.appendChild(bgimg); - - // Hover effect for decoration image - if (localStorage.reduced_motion !== "true") { - card.addEventListener("mouseenter", () => { - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=true`; - if (localStorage.discord_avatar != defaultAvatar1 && localStorage.discord_avatar != defaultAvatar2 && localStorage.discord_avatar != defaultAvatar3 && localStorage.discord_avatar != defaultAvatar4 && localStorage.discord_avatar != defaultAvatar5 && localStorage.discord_avatar != defaultAvatar6) { - bgimg.style.backgroundImage = `url(${localStorage.discord_avatar})` - } - }); - card.addEventListener("mouseleave", () => { - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - bgimg.style.backgroundImage = `url(data:image/png;base64,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)`; - }); - } - }); - } else if (selectedVariant.type === 1) { - card.classList.add("type_2000-1"); - (async () => { - // Ensure the item ID is accessible here - let itemId = undefined; - if (Array.isArray(selectedVariant.items)) { - // If items is an array, find the item with type 1 and get its id - const item = selectedVariant.items.find(item => item.type === 1); - if (item) { - itemId = item.id; - } - } else if (selectedVariant.items && selectedVariant.items.type === 1) { - // If items is an object and has type 1, get its id - itemId = selectedVariant.items.id; - } - - - if (!discordProfileEffectsCache) { - await setDiscordProfileEffectCache(); - } - - // Find matching profile effect - const matchingEffect = discordProfileEffectsCache.find(effect => effect.id === itemId); - - if (matchingEffect) { - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - previewHolder.classList.add('profile-effect-image'); - - if (isFirstTimeLoadingVariant == true) { - previewHolder.innerHTML = ` - - `; - isFirstTimeLoadingVariant = false; - } else { - previewHolder.innerHTML = ` - - `; - } - - // Hover effect: change to the first effect URL (use 'src' from the 'effects' array) - const imgElement = card.querySelector("img"); - - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - imgElement.src = effectUrl || matchingEffect.thumbnailPreviewSrc; - } - }); - - card.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - card.addEventListener("mouseenter", () => { - imgElement.src = matchingEffect.reducedMotionSrc; - }); - - card.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } - })(); - } - } - - // Apply the default variant (first one) initially - if (product.variants.length > 0) { - applyVariant(product.variants[0]); - } - } else if (product.type === item_types.EXTERNAL_SKU) { - card.classList.add("type_3000"); - - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - card.querySelector("[data-product-card-sku-id]").textContent = ``; - } else { - card.querySelector("[data-product-card-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - } - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - - if (product.sku_id === ORB_PROFILE_BADGE) { - previewHolder.classList.add('potion-card-preview-holder'); - - previewHolder.innerHTML = ` - - `; - - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - card.querySelector("#orb-profile-badge-card-video").play(); - }); - card.addEventListener("mouseleave", () => { - card.querySelector("#orb-profile-badge-card-video").pause(); - card.querySelector("#orb-profile-badge-card-video").currentTime = 0; - }); - } - } else if (product.sku_id === NITRO_CREDITS_3_DAYS) { - previewHolder.classList.add('potion-card-preview-holder'); - - previewHolder.innerHTML = ` - - - - - - - - - - - - - - - - - - - - - - - - - `; - } else { - previewHolder.innerHTML = ` -

${getTextString("CARD_TYPE_EXTERNAL_SKU_ERROR")}

- `; - } - - } else if (product.type === 'plus_more') { - card.querySelector("[data-product-card-sku-id]").textContent = ``; - card.querySelector("[data-product-card-name]").textContent = `${getTextString("CARD_TYPE_PLUS_MORE_TITLE")}`; - card.querySelector("[data-product-card-summary]").textContent = `${getTextString("CARD_TYPE_PLUS_MORE_DESC")}`; - - card.querySelector("[data-shop-price-container]").innerHTML = ``; - card.querySelector("[data-product-card-open-in-shop]").innerHTML = ``; - card.querySelector("[data-share-product-card-button]").innerHTML = ``; - - const plusMoreQuestionMark = document.createElement("img"); - plusMoreQuestionMark.src = `https://cdn.discordapp.com/assets/server_products/storefront/question-mark.png`; - plusMoreQuestionMark.classList.add("plus-more-question-mark"); - card.querySelector("[data-shop-card-preview-holder]").appendChild(plusMoreQuestionMark); - - // Hover effect for decoration image - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - plusMoreQuestionMark.src = `https://cdn.discordapp.com/assets/server_products/storefront/question-mark.gif`; - }); - card.addEventListener("mouseleave", () => { - plusMoreQuestionMark.src = `https://cdn.discordapp.com/assets/server_products/storefront/question-mark.png`; - }); - } - } else if (product.items[0].item_type === 'deco') { - product.items.forEach(item => { - - card.classList.add("type_0"); - // Set the innerHTML for the preview holder - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - previewHolder.classList.add('avatar-decoration-image'); - - // Set the initial image for the deco card - const imgElement = document.createElement("img"); - imgElement.id = "shop-card-deco-image"; - imgElement.src = imgElement.src = item.static; - - previewHolder.appendChild(imgElement); - - const bgimg = document.createElement("div"); - bgimg.id = "shop-card-deco-bg-image"; - - previewHolder.appendChild(bgimg); - - // Set the product details - card.querySelector("[data-product-card-sku-id]").textContent = ``; - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - // Hover effect: Change the image src on mouse enter and leave - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - imgElement.src = item.animated; - if (localStorage.discord_avatar != defaultAvatar1 && localStorage.discord_avatar != defaultAvatar2 && localStorage.discord_avatar != defaultAvatar3 && localStorage.discord_avatar != defaultAvatar4 && localStorage.discord_avatar != defaultAvatar5 && localStorage.discord_avatar != defaultAvatar6) { - bgimg.style.backgroundImage = `url(${localStorage.discord_avatar})` - } - }); - - card.addEventListener("mouseleave", () => { - imgElement.src = item.static; - bgimg.style.backgroundImage = `url(data:image/png;base64,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)`; - }); - } - - }); - } else if (product.items[0].item_type === 'effect') { - card.classList.add("type_1"); - - card.querySelector("[data-product-card-sku-id]").textContent = ``; - card.querySelector("[data-product-card-name]").textContent = product.name; - card.querySelector("[data-product-card-summary]").textContent = product.summary; - - const previewHolder = card.querySelector("[data-shop-card-preview-holder]"); - previewHolder.classList.add('profile-effect-image'); - - previewHolder.innerHTML = ` - - `; - - // Hover effect: change to the first effect URL (use 'src' from the 'effects' array) - const imgElement = card.querySelector("img"); - - if (localStorage.reduced_motion != "true") { - card.addEventListener("mouseenter", () => { - imgElement.src = product.items[0].animated; - }); - - card.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = product.items[0].static; - }); - } - } else { - card.classList.add('hidden') - } - - - const priceTextNitro = card.querySelector("[data-price-nitro]"); - const priceTextStandard = card.querySelector("[data-price-standard]"); - - const priceContainerNitro = card.querySelector("[data-price-nitro-container]"); - const priceContainerStandard = card.querySelector("[data-price-standard-container]"); - - const priceContainer = card.querySelector("[data-shop-price-container]"); - - let priceStandard = "N/A"; - let priceNitro = "N/A"; - let priceOrb = "N/A"; - - if (localStorage.experiment_2025_02_extra_options && localStorage.experiment_2025_02_extra_options != "Treatment 5: Enabled w/o currency picker" && localStorage.experiment_2025_02_extra_options != "Treatment -1: Disabled") { - if (localStorage.discord_premium_type === "2") { - if (product.prices && product.prices["4"] && product.prices["4"].country_prices && product.prices["4"].country_prices.prices) { - product.prices["4"].country_prices.prices.forEach(price => { - if (price.currency === "usd") { - priceStandard = price.amount; - } - if (price.currency === "discord_orb") { - priceOrb = price.amount; - } - }); - - if (priceStandard != "N/A" && priceOrb != "N/A") { - let orb_price = document.createElement("div"); - - orb_price.innerHTML = ` - ${priceOrb} -
- `; - orb_price.style.position = `absolute`; - orb_price.style.right = `0px`; - - priceContainer.appendChild(orb_price); - - standardPriceOutput = `US$${(priceStandard / 100).toFixed(2)}`; - - priceContainerStandard.innerHTML = ` - ${standardPriceOutput} -
- `; - - } else if (priceStandard != "N/A") { - - standardPriceOutput = `US$${(priceStandard / 100).toFixed(2)}`; - - priceContainerStandard.innerHTML = ` - ${standardPriceOutput} -
- `; - - } else if (priceOrb != "N/A") { - - let orb_price = document.createElement("div"); - - orb_price.innerHTML = ` - ${priceOrb} -
- `; - orb_price.style.position = `absolute`; - orb_price.style.left = `23px`; - orb_price.style.bottom = `0px`; - - priceContainer.appendChild(orb_price); - - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_ORB_EXCLUSIVE_TAG")}

-
- `; - - } - } - } else { - if (product.prices && product.prices["0"] && product.prices["0"].country_prices && product.prices["0"].country_prices.prices) { - product.prices["0"].country_prices.prices.forEach(price => { - if (price.currency === "usd") { - priceStandard = price.amount; - } - if (price.currency === "discord_orb") { - priceOrb = price.amount; - } - }); - - if (priceStandard != "N/A" && priceOrb != "N/A") { - let orb_price = document.createElement("div"); - - orb_price.innerHTML = ` - ${priceOrb} -
- `; - orb_price.style.position = `absolute`; - orb_price.style.right = `0px`; - - priceContainer.appendChild(orb_price); - - priceTextStandard.textContent = `US$${(priceStandard / 100).toFixed(2)}`; - - } else if (priceStandard != "N/A") { - - priceTextStandard.textContent = `US$${(priceStandard / 100).toFixed(2)}`; - - } else if (priceOrb != "N/A") { - - let orb_price = document.createElement("div"); - - orb_price.innerHTML = ` - ${priceOrb} -
- `; - orb_price.style.position = `absolute`; - orb_price.style.left = `23px`; - orb_price.style.bottom = `0px`; - - priceContainer.appendChild(orb_price); - - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_ORB_EXCLUSIVE_TAG")}

-
- `; - - } - } - } - - } else { - if (product.prices && product.prices["0"] && product.prices["0"].country_prices && product.prices["0"].country_prices.prices) { - product.prices["0"].country_prices.prices.forEach(price => { - if (price.currency === "usd") { - priceStandard = price.amount; - } - }); - } - - if (product.prices && product.prices["4"] && product.prices["4"].country_prices && product.prices["4"].country_prices.prices) { - product.prices["4"].country_prices.prices.forEach(price => { - if (price.currency === "usd") { - priceNitro = price.amount; - } - }); - } - - if (priceTextStandard) { - priceTextStandard.textContent = priceStandard !== "N/A" ? `US$${(priceStandard / 100).toFixed(2)}` : "null"; - } - - if (priceTextNitro) { - priceTextNitro.textContent = priceNitro !== "N/A" ? `US$${(priceNitro / 100).toFixed(2)} with Nitro` : "null"; - } - } - - if (localStorage.experiment_2025_03_copy_sku_card === "Treatment 1: Enabled" || localStorage.experiment_2025_03_copy_sku_card === "Treatment 2: w/ share button") { - card.querySelector("[data-product-card-open-in-shop]").innerHTML = ` -
- - -
- `; - } else { - card.querySelector("[data-product-card-open-in-shop]").innerHTML = ` - - `; - } - - if (product.items[0] && product.items[0].item_type && product.items[0].item_type === 'deco' || product.items[0] && product.items[0].item_type && product.items[0].item_type === 'effect' || product.sku_id === "0") { - card.querySelector("[data-product-card-open-in-shop]").innerHTML = ``; - } - - if (product.premium_type === 2) { - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
- `; - } - - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 1: Enable modals" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 3: Enable modals w/ p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 4: Enable modals w/ p+ on p+ page" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - if (product.type === item_types.AVATAR_DECORATION || product.type === item_types.PROFILE_EFFECT || product.type === item_types.NAMEPLATE || product.type === item_types.BUNDLE || product.type === item_types.VARIANTS_GROUP || product.type === item_types.EXTERNAL_SKU) { - card.classList.add('clickable'); - - card.addEventListener("click", (event) => { - if (event.target.matches("[data-shop-card-var]") || event.target.matches(".card-button") || event.target.matches(".shareIcon_f4a996")) { - } else { - openItemModal(); - addParams({itemSkuId: product.sku_id}) - } - }); - - const itemSKUForScroll = params.get("itemSkuId"); - - if (itemSKUForScroll === product.sku_id && modalIsAlreadyOpen != true) { - modalIsAlreadyOpen = true; - setTimeout(() => { - openItemModal(); - }, 1000); - } - - - async function openItemModal() { - let modal = document.createElement("div"); - - modal.classList.add('modalv2'); - - if (apiCategory.pdp_bg != null) { - pdp = apiCategory.pdp_bg - } else { - pdp = apiCategory.banner - } - - modal.innerHTML = ` -
-
-
-

-

-

-
-
- -
-
-
-
-
-
- -
- -
-
- -
-
- -
- -
-
-
- `; - - document.body.appendChild(modal); - - setTimeout(() => { - modal.classList.add('show'); - }, 1); - - if (apiCategory.logo != null) { - modal.querySelector("[data-modalv2-inner-logo]").src = `https://cdn.discordapp.com/app-assets/1096190356233670716/${apiCategory.logo}.png?size=4096`; - } - - const button_container = document.querySelector("[data-modal-buttons]"); - const top_button_container = document.querySelector("[data-modal-top-product-buttons]"); - - - let copyDiscordLink = document.createElement("div"); - - copyDiscordLink.title = getTextString("SHOP_SHARE_DISCORD_LINK"); - copyDiscordLink.innerHTML = ` - - `; - - top_button_container.appendChild(copyDiscordLink); - - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - let downloadItemData = document.createElement("div"); - - downloadItemData.title = getTextString("SHOP_DOWNLOAD_DATA"); - downloadItemData.innerHTML = ` - - `; - - top_button_container.appendChild(downloadItemData); - } - - if (localStorage.experiment_2025_03_view_raw_modal === "Treatment 1: Enabled") { - let rawItemData = document.createElement("div"); - - rawItemData.title = getTextString("SHOP_VIEW_RAW_DATA"); - rawItemData.innerHTML = ` - - `; - - top_button_container.appendChild(rawItemData); - - modal.querySelector("[data-view-raw-product-card-button]").onclick = function(){ - openRawModal(); - }; - - async function openRawModal() { - let modal = document.createElement("div"); - - modal.classList.add('modalv2'); - - modal.innerHTML = ` -
- -
- `; - - document.body.appendChild(modal); - - setTimeout(() => { - modal.classList.add('show'); - }, 1); - - - let modal_back = document.createElement("div"); - - modal_back.classList.add('modalv2-back'); - modal_back.id = 'modalv2-back'; - - document.body.appendChild(modal_back); - - setTimeout(() => { - modal_back.classList.add('show'); - }, 1); - - - modal.addEventListener('click', (event) => { - if (event.target === modal) { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - } - }); - - document.querySelector("[data-close-product-card-button]").addEventListener('click', () => { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - }); - } - } - - button_container.innerHTML = ` - - `; - - if (product.type === item_types.AVATAR_DECORATION) { - - modal.classList.add('modal-0'); - - product.items.forEach(item => { - - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - const previewHolderLeft = modal.querySelector("[data-modal-left-preview-holder]"); - - modal.querySelector("[data-product-modal-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - modal.querySelector("[data-product-modal-name]").textContent = product.name; - modal.querySelector("[data-product-modal-summary]").textContent = product.summary; - - if (localStorage.experiment_2025_02_extra_options && localStorage.experiment_2025_02_extra_options != "Treatment 5: Enabled w/o currency picker" && localStorage.experiment_2025_02_extra_options != "Treatment -1: Disabled") { - - previewHolder.classList.add('modal-preview-profile-container'); - previewHolder.innerHTML = ` -
-
-
-
- No image uploaded -

${localStorage.discord_displayname}

- - -
-
-
- `; - - document.getElementById("modal-username-preview").textContent = localStorage.discord_username.toLowerCase(); - - previewHolderLeft.classList.add('modal-left-avatar-decoration-img'); - - const imgElement = document.createElement("img"); - imgElement.id = "shop-card-deco-image"; - imgElement.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - - previewHolderLeft.appendChild(imgElement); - - if (localStorage.reduced_motion != "true") { - imgElement.addEventListener("mouseenter", () => { - imgElement.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=true`; - }); - - imgElement.addEventListener("mouseleave", () => { - imgElement.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - }); - } - - } else { - - previewHolder.classList.add('modal-avatar-decoration-img'); - - const imgElement = document.createElement("img"); - imgElement.id = "shop-card-deco-image"; - imgElement.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - - previewHolder.appendChild(imgElement); - - // Hover effect: Change the image src on mouse enter and leave - if (localStorage.reduced_motion != "true") { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - imgElement.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=true`; - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - imgElement.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - }); - } - } - - }); - } else if (product.type === item_types.PROFILE_EFFECT) { - modal.classList.add('modal-1'); - - modal.querySelector("[data-product-modal-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - modal.querySelector("[data-product-modal-name]").textContent = product.name; - modal.querySelector("[data-product-modal-summary]").textContent = product.summary; - - // Ensure the item ID is accessible here - let itemId = undefined; - if (Array.isArray(product.items)) { - // If items is an array, find the item with type 1 and get its id - const item = product.items.find(item => item.type === 1); - if (item) { - itemId = item.id; - } - } else if (product.items && product.items.type === 1) { - // If items is an object and has type 1, get its id - itemId = product.items.id; - } - - - if (!discordProfileEffectsCache) { - await setDiscordProfileEffectCache(); - } - - // Find matching profile effect - const matchingEffect = discordProfileEffectsCache.find(effect => effect.id === itemId); - - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - const previewHolderLeft = modal.querySelector("[data-modal-left-preview-holder]"); - - if (matchingEffect) { - if (localStorage.experiment_2025_02_extra_options && localStorage.experiment_2025_02_extra_options != "Treatment 5: Enabled w/o currency picker" && localStorage.experiment_2025_02_extra_options != "Treatment -1: Disabled") { - previewHolder.classList.add('modal-preview-profile-container'); - previewHolder.innerHTML = ` -
-
-
-
- No image uploaded -

${localStorage.discord_displayname}

- -
-
- -
- `; - - document.getElementById("modal-username-preview").textContent = localStorage.discord_username.toLowerCase(); - - previewHolderLeft.classList.add('modal-left-profile-effect-img'); - - const imgElement = document.createElement("img"); - imgElement.src = matchingEffect.thumbnailPreviewSrc; - - previewHolderLeft.appendChild(imgElement); - - if (localStorage.reduced_motion != "true") { - imgElement.addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - imgElement.src = effectUrl || matchingEffect.thumbnailPreviewSrc; - } - }); - - imgElement.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - imgElement.addEventListener("mouseenter", () => { - imgElement.src = matchingEffect.reducedMotionSrc; - }); - - imgElement.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } else { - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - previewHolder.classList.add('modal-profile-effect-img'); - - previewHolder.innerHTML = ` - - `; - - // Hover effect: change to the first effect URL (use 'src' from the 'effects' array) - const imgElement = previewHolder.querySelector("img"); - - if (localStorage.reduced_motion != "true") { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - imgElement.src = effectUrl || matchingEffect.thumbnailPreviewSrc; - } - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - imgElement.src = matchingEffect.reducedMotionSrc; - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } - } - } else if (product.type === item_types.NAMEPLATE) { - card.classList.add("modal-2"); - - modal.querySelector("[data-product-modal-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - modal.querySelector("[data-product-modal-name]").textContent = product.name; - modal.querySelector("[data-product-modal-summary]").textContent = product.summary; - - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - previewHolder.classList.add('nameplate-modal-preview'); - - const previewHolderLeft = modal.querySelector("[data-modal-left-preview-holder]"); - - if (localStorage.discord_displayname && localStorage.discord_displayname != '') { - previewName = localStorage.discord_displayname; - } else { - previewName = 'Default User' - } - - if (localStorage.experiment_2025_03_early_nameplate_warning === "Treatment 2: Nameplate & Nameplate Test Warning" && product.category_sku_id === discord_categories.NAMEPLATE) { - let nameplateWarning = document.createElement("div"); - - nameplateWarning.classList.add('nameplate-modal-early-warning-container'); - nameplateWarning.innerHTML = ` -

${getTextString("SHOP_NAMEPLATE_WARNING_NOTICE_1")}

- `; - - modal.querySelector(".modalv2-inner-left").appendChild(nameplateWarning); - } else if (localStorage.experiment_2025_03_early_nameplate_warning === "Treatment 1: Nameplate Test Warning" || localStorage.experiment_2025_03_early_nameplate_warning === "Treatment 2: Nameplate & Nameplate Test Warning") { - if (product.category_sku_id === discord_categories.NAMEPLATE_TEST) { - let nameplateWarning = document.createElement("div"); - - nameplateWarning.classList.add('nameplate-modal-early-warning-container'); - nameplateWarning.innerHTML = ` -

${getTextString("SHOP_NAMEPLATE_WARNING_NOTICE_2")}

- `; - - modal.querySelector(".modalv2-inner-left").appendChild(nameplateWarning); - } - } - - previewHolder.innerHTML = ` -
-
-
-
-
-
-
-
-
-
-
-
-
- -
-

${previewName}

-
-
-
-
-
-
-
-
-
-
-
-
-
- `; - - previewHolderLeft.innerHTML = ` -
- -
-

${previewName}

-
- `; - - product.items.forEach(item => { - const nameplatePreview = previewHolder.querySelector("[data-user-nameplate-preview]"); - const paletteName = item.palette; - const asset = `https://cdn.discordapp.com/assets/collectibles/${item.asset}asset.webm`; - const bgcolor = nameplate_palettes[paletteName].darkBackground; - - const videoElement = previewHolder.querySelector("[data-user-nameplate-preview-img]"); - - videoElement.src = asset; - - nameplatePreview.style.backgroundImage = `linear-gradient(90deg, #00000000 -30%, ${bgcolor} 200%)`; - // nameplatePreview.style.boxShadow = `0 0 0 1px #a10606`; - - const nullUserNameRandomWidth = previewHolder.querySelectorAll("[data-null-user-random-name]"); - - nullUserNameRandomWidth.forEach(UserName => { - const randomWidth = Math.floor(Math.random() * (180 - 80 + 1)) + 80; - UserName.style.width = randomWidth + `px`; - }); - - const nullUserAvatar = previewHolder.querySelectorAll("[data-nameplate-user-random-avatar]"); - - nullUserAvatar.forEach(UserAvatar => { - UserAvatar.style.backgroundImage = `url(${localStorage.discord_avatar})`; - }); - - if (localStorage.reduced_motion != "true") { - videoElement.play(); - } - - - - const videoElementLeft = previewHolderLeft.querySelector("[data-user-nameplate-preview-img-left]"); - const nameplatePreviewLeft = previewHolderLeft.querySelector("[data-user-nameplate-preview-left]"); - previewHolderLeft.classList.add("modal-left-nameplate-preview"); - - videoElementLeft.src = asset; - - nameplatePreviewLeft.style.backgroundImage = `linear-gradient(90deg, #00000000 -30%, ${bgcolor} 200%)`; - - const nullUserAvatarLeft = previewHolderLeft.querySelectorAll("[data-nameplate-user-random-avatar-left]"); - - nullUserAvatarLeft.forEach(UserAvatar => { - UserAvatar.style.backgroundImage = `url(${localStorage.discord_avatar})`; - }); - - if (localStorage.reduced_motion != "true") { - videoElementLeft.addEventListener("mouseenter", () => { - videoElementLeft.play(); - }); - - videoElementLeft.addEventListener("mouseleave", () => { - videoElementLeft.pause(); - }); - } - }); - - } else if (product.type === item_types.BUNDLE) { - modal.classList.add('modal-1000'); - - const bundledProducts = product.bundled_products || []; - - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - - // Generate the bundle summary from the names of the bundled products - const type0Product = bundledProducts.find(item => item.type === 0); - const type1Product = bundledProducts.find(item => item.type === 1); - - let bundleSummary = `${getTextString("CARD_TYPE_BUNDLE_TITLE")}`; - if (type0Product) { - bundleSummary += `${type0Product.name}${getTextString("CARD_TYPE_BUNDLE_TITLE_DECO")}`; - } - if (type1Product) { - bundleSummary += `${type1Product.name}${getTextString("CARD_TYPE_BUNDLE_TITLE_EFFECT")}`; - } - - // Set the summary text - modal.querySelector("[data-product-modal-summary]").textContent = bundleSummary; - - // Set the basic card details - modal.querySelector("[data-product-modal-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - modal.querySelector("[data-product-modal-name]").textContent = product.name; - - // Handle each item in the bundle - product.items.forEach(item => { - if (localStorage.experiment_2025_02_extra_options && localStorage.experiment_2025_02_extra_options != "Treatment 5: Enabled w/o currency picker" && localStorage.experiment_2025_02_extra_options != "Treatment -1: Disabled") { - - if (item.type === 0) { - decosrc = item.asset - } else if (item.type === 1) { - // Profile effect - (async () => { - if (!discordProfileEffectsCache) { - await setDiscordProfileEffectCache(); - } - - - // Find the matching effect - const matchingEffect = discordProfileEffectsCache.find(effect => effect.id === item.id); - - if (matchingEffect) { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - renderProfile(effectUrl) - } - } - })(); - } - - function renderProfile(effectUrl) { - previewHolder.classList.add('modal-preview-profile-container'); - previewHolder.innerHTML = ` -
-
-
-
- No image uploaded -

${localStorage.discord_displayname}

- - -
-
- -
- `; - document.getElementById("modal-username-preview").textContent = localStorage.discord_username.toLowerCase(); - } - - - } else { - if (item.type === 0) { - const decoImage = document.createElement("img"); - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - decoImage.alt = "Avatar Decoration"; - decoImage.classList.add("modal-avatar-decoration-img"); - modal.querySelector("[data-modal-preview-holder]").appendChild(decoImage); - - // Hover effect for decoration image - if (localStorage.reduced_motion != "true") { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=true`; - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - }); - } - } else if (item.type === 1) { - // Profile effect - (async () => { - // Fetch profile effects if not cached - if (!discordProfileEffectsCache) { - const response = await fetch(api + PROFILE_EFFECTS, { - method: "GET", - headers: { - "Password": api_password, - "Authorization": discord_token, - "Token": api_token - } - }); - const effectsData = await response.json(); - discordProfileEffectsCache = effectsData.profile_effect_configs; - } - - // Find the matching effect - const matchingEffect = discordProfileEffectsCache.find(effect => effect.id === item.id); - - if (matchingEffect) { - const effectImage = document.createElement("img"); - effectImage.src = matchingEffect.thumbnailPreviewSrc; - effectImage.alt = "Profile Effect"; - effectImage.classList.add("modal-profile-effect-img"); - modal.querySelector("[data-modal-preview-holder]").appendChild(effectImage); - - // Hover effect for profile effect - if (localStorage.reduced_motion != "true") { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - effectImage.src = effectUrl || matchingEffect.thumbnailPreviewSrc; - } - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - effectImage.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - effectImage.src = matchingEffect.reducedMotionSrc; - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - effectImage.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } - })(); - } - } - }); - } else if (product.type === item_types.VARIANTS_GROUP) { - modal.querySelector("[data-shop-modal-var-container-container]").classList.add('show'); - // Update SKU and summary - modal.querySelector("[data-product-modal-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - modal.querySelector("[data-product-modal-summary]").textContent = product.summary; - - // Always display the base variant name - modal.querySelector("[data-product-modal-name]").textContent = product.variants[0]?.base_variant_name || "Product"; - - // Render variant color blocks as interactive divs - const variantContainer = modal.querySelector("[data-shop-modal-var-container]"); - variantContainer.innerHTML = ""; // Clear existing variant blocks - let currentSelectedVariant = null; // Track selected variant - - product.variants.forEach((variant, index) => { - // Create variant color block - const variantColorBlock = document.createElement("div"); - variantColorBlock.classList.add("shop-card-var"); - variantColorBlock.style.backgroundColor = `${variant.variant_value}`; - - // Add click event listener to switch variants - variantColorBlock.addEventListener("click", () => { - if (currentSelectedVariant) { - currentSelectedVariant.classList.remove("shop-card-var-selected"); - } - variantColorBlock.classList.add("shop-card-var-selected"); - currentSelectedVariant = variantColorBlock; - applyVariant(variant); - }); - - // Append the color block to the container - variantContainer.appendChild(variantColorBlock); - - // Set the first variant as the default selected - if (index === 0) { - currentSelectedVariant = variantColorBlock; - variantColorBlock.classList.add("shop-card-var-selected"); - } - }); - - let isFirstTimeLoadingVariant = true; - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - const previewHolderLeft = modal.querySelector("[data-modal-left-preview-holder]"); - - // Function to apply the selected variant - function applyVariant(selectedVariant) { - modal.querySelector("[data-shop-modal-var-title]").textContent = `(${selectedVariant.variant_label})`; - modal.querySelector("[data-product-modal-sku-id]").textContent = `SKU ID: ${selectedVariant.sku_id}`; - modal.querySelector("[data-share-product-card-button]").onclick = function(){ - copyEmoji(`https://canary.discord.com/shop#itemSkuId=${selectedVariant.sku_id}`); - }; - if (localStorage.experiment_2025_02_shop_card_modals === "Treatment 2: Enable modals w/ data downloads" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 5: Enable modals w/ data downloads and p+" || localStorage.experiment_2025_02_shop_card_modals === "Treatment 6: Enable modals w/ data downloads and p+ on p+ page") { - modal.querySelector("[data-download-product-card-button]").onclick = function(){ - window.open(`https://item.yapper.shop/sku/${selectedVariant.sku_id}/data.zip`); - }; - } - if (localStorage.experiment_2025_02_extra_options && localStorage.experiment_2025_02_extra_options != "Treatment 5: Enabled w/o currency picker" && localStorage.experiment_2025_02_extra_options != "Treatment -1: Disabled") { - - if (selectedVariant.type === 0) { - selectedVariant.items?.forEach(item => { - previewHolder.classList.add('modal-preview-profile-container'); - previewHolder.innerHTML = ` -
-
-
-
- No image uploaded -

${localStorage.discord_displayname}

- - -
-
-
- `; - document.getElementById("modal-username-preview").textContent = localStorage.discord_username.toLowerCase(); - - previewHolderLeft.classList.add('modal-left-avatar-decoration-img'); - - previewHolderLeft.innerHTML = ` - - `; - - const imgElement = previewHolderLeft.querySelector("[data-left-preview-deco-var]"); - - if (localStorage.reduced_motion != "true") { - imgElement.addEventListener("mouseenter", () => { - imgElement.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=true`; - }); - - imgElement.addEventListener("mouseleave", () => { - imgElement.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - }); - } - }); - } else if (selectedVariant.type === 1) { - - modal.classList.add("modal-2000-1"); - (async () => { - // Ensure the item ID is accessible here - let itemId = undefined; - if (Array.isArray(selectedVariant.items)) { - // If items is an array, find the item with type 1 and get its id - const item = selectedVariant.items.find(item => item.type === 1); - if (item) { - itemId = item.id; - } - } else if (selectedVariant.items && selectedVariant.items.type === 1) { - // If items is an object and has type 1, get its id - itemId = selectedVariant.items.id; - } - - - if (!discordProfileEffectsCache) { - await setDiscordProfileEffectCache(); - } - - // Find matching profile effect - const matchingEffect = discordProfileEffectsCache.find(effect => effect.id === itemId); - - if (matchingEffect) { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - previewHolder.classList.add('modal-preview-profile-container'); - previewHolder.innerHTML = ` -
-
-
-
- No image uploaded -

${localStorage.discord_displayname}

- -
-
- -
- `; - document.getElementById("modal-username-preview").textContent = localStorage.discord_username.toLowerCase(); - } - } - - previewHolderLeft.classList.add('modal-left-profile-effect-img'); - - previewHolderLeft.innerHTML = ` - - `; - - const imgElement = previewHolderLeft.querySelector("[data-left-preview-effect-var]"); - - if (localStorage.reduced_motion != "true") { - imgElement.addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - imgElement.src = effectUrl || matchingEffect.thumbnailPreviewSrc; - } - }); - - imgElement.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - imgElement.addEventListener("mouseenter", () => { - imgElement.src = matchingEffect.reducedMotionSrc; - }); - - imgElement.addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } - })(); - } - - - } else { - if (selectedVariant.type === 0) { - modal.classList.add("modal-2000-0"); - previewHolder.innerHTML = ""; // Clear previous decorations - previewHolder.classList.add('modal-avatar-decoration-img'); - - // Add the avatar decoration based on the selected variant - selectedVariant.items?.forEach(item => { - const decoImage = document.createElement("img"); - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - decoImage.alt = "Avatar Decoration"; - decoImage.id = "shop-card-deco-image"; - previewHolder.appendChild(decoImage); - - // Hover effect for decoration image - if (localStorage.reduced_motion !== "true") { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=true`; - }); - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - decoImage.src = `https://cdn.discordapp.com/avatar-decoration-presets/${item.asset}.png?size=4096&passthrough=false`; - }); - } - }); - } else if (selectedVariant.type === 1) { - modal.classList.add("modal-2000-1"); - (async () => { - // Ensure the item ID is accessible here - let itemId = undefined; - if (Array.isArray(selectedVariant.items)) { - // If items is an array, find the item with type 1 and get its id - const item = selectedVariant.items.find(item => item.type === 1); - if (item) { - itemId = item.id; - } - } else if (selectedVariant.items && selectedVariant.items.type === 1) { - // If items is an object and has type 1, get its id - itemId = selectedVariant.items.id; - } - - - // Fetch profile effects API only if not already cached - if (!discordProfileEffectsCache) { - const response = await fetch(api + PROFILE_EFFECTS, { - method: "GET", - headers: { - "Password": api_password, - "Authorization": discord_token, - "Token": api_token - } - }); - const effectsData = await response.json(); - discordProfileEffectsCache = effectsData.profile_effect_configs; - } - - // Find matching profile effect - const matchingEffect = discordProfileEffectsCache.find(effect => effect.id === itemId); - - if (matchingEffect) { - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - previewHolder.classList.add('modal-profile-effect-img'); - - previewHolder.innerHTML = ` - - `; - - // Hover effect: change to the first effect URL (use 'src' from the 'effects' array) - const imgElement = previewHolder.querySelector("img"); - - if (localStorage.reduced_motion != "true") { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - if (matchingEffect.effects && matchingEffect.effects.length > 0) { - const effectUrl = matchingEffect.effects[0]?.src; - imgElement.src = effectUrl || matchingEffect.thumbnailPreviewSrc; - } - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } else { - document.getElementById('modalv2-inner-right').addEventListener("mouseenter", () => { - imgElement.src = matchingEffect.reducedMotionSrc; - }); - - document.getElementById('modalv2-inner-right').addEventListener("mouseleave", () => { - // Revert back to the original thumbnailPreviewSrc when hover ends - imgElement.src = matchingEffect.thumbnailPreviewSrc; - }); - } - } - })(); - } - } - } - - // Apply the default variant (first one) initially - if (product.variants.length > 0) { - applyVariant(product.variants[0]); - } - } else if (product.type === item_types.EXTERNAL_SKU) { - modal.classList.add('modal-3000'); - - modal.querySelector("[data-product-modal-sku-id]").textContent = `SKU ID: ${product.sku_id}`; - modal.querySelector("[data-product-modal-name]").textContent = product.name; - modal.querySelector("[data-product-modal-summary]").textContent = product.summary; - - const previewHolder = modal.querySelector("[data-modal-preview-holder]"); - - if (product.sku_id === ORB_PROFILE_BADGE) { - previewHolder.classList.add('modal-preview-profile-container'); - previewHolder.innerHTML = ` -
-
-
-
- No image uploaded -

${localStorage.discord_displayname}

- -
-
-
- -
-
- `; - - document.getElementById("modal-username-preview").textContent = localStorage.discord_username.toLowerCase(); - } else if (product.sku_id === NITRO_CREDITS_3_DAYS) { - previewHolder.classList.add('modal-preview-profile-container'); - - previewHolder.innerHTML = ` -
- - -
- -

Custom emojis anywhere

-
-
- -

Custom profile

-
-
- -

500 MB Uploads

-
-
- -

HD video streaming

-
-
- -

Colour app themes and more!

-
-
- `; - } else { - previewHolder.innerHTML = ` -

${getTextString("CARD_TYPE_EXTERNAL_SKU_ERROR")}

- `; - } - - } - - - const priceTextNitro = modal.querySelector("[data-price-nitro]"); - const priceTextStandard = modal.querySelector("[data-price-standard]"); - - const priceContainerNitro = modal.querySelector("[data-price-nitro-container]"); - const priceContainerStandard = modal.querySelector("[data-price-standard-container]"); - - const priceContainer = modal.querySelector("[data-shop-price-container]"); - - let priceStandard = "N/A"; - let priceNitro = "N/A"; - let priceOrb = "N/A"; - - if (localStorage.experiment_2025_02_extra_options && localStorage.experiment_2025_02_extra_options != "Treatment 5: Enabled w/o currency picker" && localStorage.experiment_2025_02_extra_options != "Treatment -1: Disabled") { - if (localStorage.discord_premium_type === "2") { - if (product.prices && product.prices["4"] && product.prices["4"].country_prices && product.prices["4"].country_prices.prices) { - product.prices["4"].country_prices.prices.forEach(price => { - if (price.currency === "usd") { - priceStandard = price.amount; - } - if (price.currency === "discord_orb") { - priceOrb = price.amount; - } - }); - - if (priceStandard != "N/A" && priceOrb != "N/A") { - - let nitro_price = document.createElement("div"); - - nitro_price.innerHTML = ` - US$${(priceStandard / 100).toFixed(2)} -
- `; - nitro_price.style.position = `absolute`; - nitro_price.style.left = `0px`; - - priceContainer.appendChild(nitro_price); - - let orb_price = document.createElement("div"); - - orb_price.innerHTML = ` - ${priceOrb} -
- `; - orb_price.style.position = `absolute`; - orb_price.style.right = `20px`; - - priceContainer.appendChild(orb_price); - - } else if (priceStandard != "N/A") { - - let nitro_price = document.createElement("div"); - - nitro_price.innerHTML = ` - US$${(priceStandard / 100).toFixed(2)} -
- `; - nitro_price.style.position = `absolute`; - nitro_price.style.left = `0px`; - - priceContainer.appendChild(nitro_price); - - } else if (priceOrb != "N/A") { - - let orb_price = document.createElement("div"); - - orb_price.innerHTML = ` - ${priceOrb} -
- `; - orb_price.style.position = `absolute`; - orb_price.style.left = `23px`; - - priceContainer.appendChild(orb_price); - - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_ORB_EXCLUSIVE_TAG")}

-
- `; - - } - } - if (product.prices && product.prices["0"] && product.prices["0"].country_prices && product.prices["0"].country_prices.prices) { - product.prices["0"].country_prices.prices.forEach(price => { - if (price.currency === "usd") { - priceStandard = price.amount; - } - if (price.currency === "discord_orb") { - priceOrb = price.amount; - } - }); - - if (priceStandard != "N/A" && priceOrb != "N/A") { - - let standard_price = document.createElement("div"); - - standard_price.innerHTML = ` - US$${(priceStandard / 100).toFixed(2)} - `; - standard_price.style.position = `absolute`; - standard_price.style.left = `0px`; - standard_price.style.marginTop = `30px`; - - priceContainer.appendChild(standard_price); - - let orb_standard_price = document.createElement("div"); - - orb_standard_price.innerHTML = ` - ${priceOrb} -
- `; - orb_standard_price.style.position = `absolute`; - orb_standard_price.style.right = `20px`; - orb_standard_price.style.marginTop = `30px`; - - priceContainer.appendChild(orb_standard_price); - - } else if (priceStandard != "N/A") { - - let standard_price = document.createElement("div"); - - standard_price.innerHTML = ` - US$${(priceStandard / 100).toFixed(2)} - `; - standard_price.style.position = `absolute`; - standard_price.style.left = `0px`; - standard_price.style.marginTop = `30px`; - - priceContainer.appendChild(standard_price); - - } else if (priceOrb != "N/A") { - - let orb_standard_price = document.createElement("div"); - - orb_standard_price.innerHTML = ` - ${priceOrb} -
- `; - orb_standard_price.style.position = `absolute`; - orb_standard_price.style.left = `23px`; - orb_standard_price.style.marginTop = `30px`; - - priceContainer.appendChild(orb_standard_price); - - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_ORB_EXCLUSIVE_TAG")}

-
- `; - - } - } - } else { - if (product.prices && product.prices["0"] && product.prices["0"].country_prices && product.prices["0"].country_prices.prices) { - product.prices["0"].country_prices.prices.forEach(price => { - if (price.currency === "usd") { - priceStandard = price.amount; - } - if (price.currency === "discord_orb") { - priceOrb = price.amount; - } - }); - - if (priceStandard != "N/A" && priceOrb != "N/A") { - - let standard_price = document.createElement("div"); - - standard_price.innerHTML = ` - US$${(priceStandard / 100).toFixed(2)} - `; - standard_price.style.position = `absolute`; - standard_price.style.left = `0px`; - - priceContainer.appendChild(standard_price); - - let orb_price = document.createElement("div"); - - orb_price.innerHTML = ` - ${priceOrb} -
- `; - orb_price.style.position = `absolute`; - orb_price.style.right = `20px`; - - priceContainer.appendChild(orb_price); - - } else if (priceStandard != "N/A") { - - let nitro_price = document.createElement("div"); - - nitro_price.innerHTML = ` - US$${(priceStandard / 100).toFixed(2)} - `; - nitro_price.style.position = `absolute`; - nitro_price.style.left = `0px`; - - priceContainer.appendChild(nitro_price); - - } else if (priceOrb != "N/A") { - - let orb_price = document.createElement("div"); - - orb_price.innerHTML = ` - ${priceOrb} -
- `; - orb_price.style.position = `absolute`; - orb_price.style.left = `23px`; - - priceContainer.appendChild(orb_price); - - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_ORB_EXCLUSIVE_TAG")}

-
- `; - - } - } - if (product.prices && product.prices["4"] && product.prices["4"].country_prices && product.prices["4"].country_prices.prices) { - product.prices["4"].country_prices.prices.forEach(price => { - if (price.currency === "usd") { - priceStandard = price.amount; - } - if (price.currency === "discord_orb") { - priceOrb = price.amount; - } - }); - - if (priceStandard != "N/A" && priceOrb != "N/A") { - - let standard_price = document.createElement("div"); - - standard_price.innerHTML = ` - US$${(priceStandard / 100).toFixed(2)} -
- `; - standard_price.style.position = `absolute`; - standard_price.style.left = `0px`; - standard_price.style.marginTop = `30px`; - - priceContainer.appendChild(standard_price); - - let orb_standard_price = document.createElement("div"); - - orb_standard_price.innerHTML = ` - ${priceOrb} -
- `; - orb_standard_price.style.position = `absolute`; - orb_standard_price.style.right = `20px`; - orb_standard_price.style.marginTop = `30px`; - - priceContainer.appendChild(orb_standard_price); - - } else if (priceStandard != "N/A") { - - let standard_price = document.createElement("div"); - - standard_price.innerHTML = ` - US$${(priceStandard / 100).toFixed(2)} -
- `; - standard_price.style.position = `absolute`; - standard_price.style.left = `0px`; - standard_price.style.marginTop = `30px`; - - priceContainer.appendChild(standard_price); - - } else if (priceOrb != "N/A") { - - let orb_standard_price = document.createElement("div"); - - orb_standard_price.innerHTML = ` - ${priceOrb} -
- `; - orb_standard_price.style.position = `absolute`; - orb_standard_price.style.left = `23px`; - orb_standard_price.style.marginTop = `30px`; - - priceContainer.appendChild(orb_standard_price); - - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_ORB_EXCLUSIVE_TAG")}

-
- `; - - } - } - } - - } else { - if (product.prices && product.prices["0"] && product.prices["0"].country_prices && product.prices["0"].country_prices.prices) { - product.prices["0"].country_prices.prices.forEach(price => { - if (price.currency === "usd") { - priceStandard = price.amount; - } - }); - } - - if (product.prices && product.prices["4"] && product.prices["4"].country_prices && product.prices["4"].country_prices.prices) { - product.prices["4"].country_prices.prices.forEach(price => { - if (price.currency === "usd") { - priceNitro = price.amount; - } - }); - } - - if (priceTextStandard) { - priceTextStandard.textContent = priceStandard !== "N/A" ? `US$${(priceStandard / 100).toFixed(2)}` : "null"; - } - - if (priceTextNitro) { - priceTextNitro.textContent = priceNitro !== "N/A" ? `US$${(priceNitro / 100).toFixed(2)} with Nitro` : "null"; - } - } - - - const unpublishedAt = new Date(product.unpublished_at); - - if (product.unpublished_at && !isNaN(unpublishedAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = unpublishedAt - now; - - if (timeDiff <= 0) { - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_UNPUBLISHED_TAG")}

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${days}${getTextString("CARD_UNPUBLISHED_COUNTDOWN_TAG")}

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - const ExpiredAt = new Date(product.expires_at); - - if (product.expires_at && !isNaN(ExpiredAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = ExpiredAt - now; - - if (timeDiff <= 0) { - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_EXPIRED_TAG")}

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_EXPIRED_COUNTDOWN_TAG")}${days}${getTextString("CARD_EXPIRED_COUNTDOWN_TAG_DAYS")}${hours}${getTextString("CARD_EXPIRED_COUNTDOWN_TAG_HOURS")}

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - if (product.premium_type === 2) { - modal.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
- `; - } - - if (localStorage.experiment_2025_04_discord_sign_in_dismissible === "Treatment 1: V1" && product.type != 3000) { - - if (localStorage.dismissible_newLogInWithDiscord != "Treatment 1: Seen") { - let newLogInWithDiscordDismissible = document.createElement("div"); - - newLogInWithDiscordDismissible.innerHTML = ` -
- -
-

${getTextString("DISMISSIBLE_CONTENT_NEW_DISCORD_SIGN_IN_MODAL_TITLE")}

-
-

${getTextString("DISMISSIBLE_CONTENT_NEW_DISCORD_SIGN_IN_MODAL_SUMMARY_1")}

-
-

${getTextString("DISMISSIBLE_CONTENT_NEW_DISCORD_SIGN_IN_MODAL_SUMMARY_2")}

-
- -
- - -
-
- `; - - newLogInWithDiscordDismissible.classList.add('newLogInWithDiscordDismissible'); - - newLogInWithDiscordDismissible.id = `newLogInWithDiscordDismissible`; - - modal.appendChild(newLogInWithDiscordDismissible); - } - } - - - - let modal_back = document.createElement("div"); - - modal_back.classList.add('modalv2-back'); - modal_back.id = 'modalv2-back'; - - document.body.appendChild(modal_back); - - setTimeout(() => { - modal_back.classList.add('show'); - }, 1); - - - modal.addEventListener('click', (event) => { - if (event.target === modal) { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - removeParams('itemSkuId'); - modalIsAlreadyOpen = false; - } - }); - - document.querySelector("[data-close-product-card-button]").addEventListener('click', () => { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - }); - } - } - } - - if (localStorage.experiment_2025_03_copy_sku_card === "Treatment 2: w/ share button" || localStorage.experiment_2025_03_copy_sku_card === "Treatment 3: only share button") { - card.querySelector("[data-share-product-card-button]").innerHTML = ` - - `; - } - - - function newItemCheck() { - - if (N > g) { - } else { - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_NEW_TAG")}

-
- `; - } - } - - if (m.includes(product.sku_id)) { - newItemCheck(); - } - - function newColorItemCheck() { - - if (N > newColorsExpireDate) { - } else { - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_NEW_COLORS_TAG")}

-
- `; - } - } - - if (params.get("page") === "leaks") { - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_LEAKED_TAG")}

-
- `; - } - - if (newColorsSKUIDS.includes(product.sku_id) && discord_categories.ANIME_V3 === apiCategory.sku_id) { - newColorItemCheck(); - } - - function popularItemCheck() { - card.classList.add('popular-item'); - } - - if (I.includes(product.sku_id)) { - popularItemCheck(); - } - - - const unpublishedAt = new Date(product.unpublished_at); - - if (product.unpublished_at && !isNaN(unpublishedAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = unpublishedAt - now; - - if (timeDiff <= 0) { - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_UNPUBLISHED_TAG")}

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${days}${getTextString("CARD_UNPUBLISHED_COUNTDOWN_TAG")}

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - const ExpiredAt = new Date(product.expires_at); - - if (product.expires_at && !isNaN(ExpiredAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = ExpiredAt - now; - - if (timeDiff <= 0) { - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_EXPIRED_TAG")}

-
- `; - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / 1000); - - card.querySelector("[data-shop-card-tag-container]").innerHTML = ` -
-

${getTextString("CARD_EXPIRED_COUNTDOWN_TAG")}${days}${getTextString("CARD_EXPIRED_COUNTDOWN_TAG_DAYS")}${hours}${getTextString("CARD_EXPIRED_COUNTDOWN_TAG_HOURS")}

-
- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - // Append card to output - cardOutput.append(card); - - scrollToSKU(product.sku_id); - } - } - - categoryOutput.append(category); - - scrollToSKU(apiCategory.sku_id); - - const nameplates_banner = document.getElementById(discord_categories.NAMEPLATE); - const arcane_banner = document.getElementById(discord_categories.WARRIOR); - const dnd_banner = document.getElementById(discord_categories.CHANCE); - const street_fighter_banner = document.getElementById(discord_categories.BAND); - const fall_banner = document.getElementById(discord_categories.FALL); - const palworld_banner = document.getElementById(discord_categories.TIDE); - const valorant_banner = document.getElementById(discord_categories.SHY); - - if (localStorage.disable_client_banner_overrides != "true") { - if (nameplates_banner) { - document.getElementById(`${discord_categories.NAMEPLATE}-discord-watermark-container`).innerHTML = ``; - document.getElementById(`${discord_categories.NAMEPLATE}-banner-banner-container`).innerHTML = ` - - - `; - } - - if (palworld_banner) { - document.getElementById(`${discord_categories.TIDE}-discord-watermark-container`).innerHTML = ``; - document.getElementById(`${discord_categories.TIDE}-banner-banner-container`).innerHTML = ` - - - - `; - document.getElementById(`${discord_categories.TIDE}-logo-container`).innerHTML = ` - - `; - } - - if (valorant_banner) { - document.getElementById(`${discord_categories.SHY}-discord-watermark-container`).innerHTML = ``; - document.getElementById(`${discord_categories.SHY}-banner-banner-container`).innerHTML = ` -
- - - - `; - document.getElementById(`${discord_categories.SHY}-logo-container`).innerHTML = ` - - `; - } - - if (localStorage.reduced_motion != "true") { - - if (arcane_banner) { - document.getElementById(`${discord_categories.WARRIOR}-banner-banner-container`).innerHTML = ` - - - `; - } - - if (dnd_banner) { - document.getElementById(`${discord_categories.CHANCE}-banner-banner-container`).innerHTML = ` - - - `; - } - - if (street_fighter_banner) { - document.getElementById(`${discord_categories.BAND}-banner-banner-container`).innerHTML = ` - - - `; - } - - if (palworld_banner) { - document.getElementById(`${discord_categories.TIDE}-discord-watermark-container`).innerHTML = ``; - document.getElementById(`${discord_categories.TIDE}-banner-banner-container`).innerHTML = ` - - - - - `; - document.getElementById(`${discord_categories.TIDE}-logo-container`).innerHTML = ` - - `; - } - - if (valorant_banner) { - document.getElementById(`${discord_categories.SHY}-discord-watermark-container`).innerHTML = ``; - document.getElementById(`${discord_categories.SHY}-banner-banner-container`).innerHTML = ` -
- - - - `; - document.getElementById(`${discord_categories.SHY}-logo-container`).innerHTML = ` - - `; - } - - } - } - - if (fall_banner) { - document.getElementById(`${discord_categories.FALL}-discord-watermark-container`).innerHTML = ``; - document.getElementById(`${discord_categories.FALL}-logo-container`).innerHTML = ``; - } - } - } - - // Remove loading container - document.getElementById("shop-category-loading-container").innerHTML = ``; - } - }) - .catch(error => { - console.error('Error fetching the API:', error); - document.getElementById("everything-housing-container").innerHTML = ` -
- -

${getTextString("SHOP_NOT_LOAD_ERROR_1")}

-

${getTextString("SHOP_NOT_LOAD_ERROR_2")}

-

${error}

- -
- `; - }); - - } - } - - async function fetchUserProfileInfo(userID) { - let modal = document.createElement("div"); - - modal.classList.add('modal-profile'); - - modal.innerHTML = ` -
Loading User Profile...
- `; - - document.body.appendChild(modal); - - setTimeout(() => { - modal.classList.add('show'); - }, 1); - - let modal_back = document.createElement("div"); - - modal_back.classList.add('modalv2-back'); - modal_back.id = 'modalv2-back'; - - document.body.appendChild(modal_back); - - modal_back.style.opacity = '0'; - - setTimeout(() => { - modal_back.classList.add('show'); - }, 1); - - - modal.addEventListener('click', (event) => { - if (event.target === modal) { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - } - }); - - fetch(api + `/users/${userID}/profile`, { - method: "GET", - headers: { - "Authorization": localStorage.shop_archives_token - } - }) - .then(response => response.json()) - .then((data) => { - if (data.message) { - modal.innerHTML = ` -
-
-
-
-
- -

${data.message}

-

${data.error}

-
-
- `; - } else { - modal.innerHTML = ` -
-
-
-
-
- -

${data.global_name}

-

${data.username}

-
-
- `; - - if (data.banner_color) { - modal.querySelector("[popout-profile-banner-color]").style.backgroundColor = data.banner_color; - } - - if (data.global_name === null) { - modal.querySelector("[popout-profile-displayname]").textContent = data.username; - } - - modal.querySelector("[popout-profile-username]").textContent = data.username; - } - }) - .catch(error => { - console.error(error); - modal.innerHTML = ` -
-
-
-
-
- -

Unknown User

-

unknownuser

-
-
- `; - }); - } - - - function renderReviewTextWithEmojis(reviewText) { - // Escape HTML special characters - const safeText = reviewText - .replace(/&/g, "&") - .replace(//g, ">"); - - // Replace :emoji: with - const rendered = safeText.replace(/(:[a-zA-Z0-9_]+:)/g, (match) => { - const emojiUrl = CUSTOM_EMOJIS[match]; - if (emojiUrl) { - return `${match}`; - } - return match; // Leave as-is if emoji not found - }); - - return rendered; - } - - - function selectReviewReportType(type) { - if (document.querySelector(".report-card-option-selected")) { - document.querySelectorAll('.report-card-option-selected').forEach((el) => { - el.classList.remove("report-card-option-selected"); - }); - } - - if (type === 1 || type === 2 || type === 3 || type === 4 || type === 5) { - document.getElementById("report-review-report-card-option-" + type).classList.add("report-card-option-selected"); - document.getElementById("report-review-report-card-inv-imput").value = type; - } else { - console.error(type + " is not a valid review report type") - } - } - - function reportReview(reviewId, reportType) { - - fetch(api + REVIEWSAPI + `/report/${reviewId}`, { - method: "POST", - headers: { - "Content-Type": "application/json", - "Authorization": shop_archives_token - }, - body: JSON.stringify({ - reportType: Number(reportType) - }) - }) - .then(response => response.json()) - .then((data) => { - if (data.success && data.success === true) { - const modal = document.getElementById("modalv2-report-review"); - const modal_back = document.getElementById("modalv2-report-review-back"); - - if (modal && modal_back) { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - fillCategoryModalContentContainer('reviews', true); - } - if (document.getElementById("review-panel-report-type-id-" + reviewId) && document.getElementById("review-panel-report-type-id-" + reviewId + "-text")) { - document.getElementById("review-panel-report-type-id-" + reviewId).classList.remove("review-flag-type-2"); - document.getElementById("review-panel-report-type-id-" + reviewId).classList.add("review-flag-type-0"); - document.getElementById("review-panel-report-type-id-" + reviewId + "-text").textContent = "0"; - } - } else { - if (document.getElementById("shop-category-modal-report-review-error-output")) { - document.getElementById("shop-category-modal-report-review-error-output").textContent = data.message; - } - } - }) - .catch(error => { - console.error(error); - if (document.getElementById("shop-category-modal-report-review-error-output")) { - document.getElementById("shop-category-modal-report-review-error-output").textContent = error; - } - }); - } - - - const postReview = async (itemId, rating) => { - - if (document.getElementById("shop-category-modal-write-review-error-output")) { - document.getElementById("shop-category-modal-write-review-error-output").textContent = ``; - } - - const accessToken = localStorage.discord_token; - - const reviewText = document.getElementById("shop-category-modal-write-review-post-input").value; - - if (!accessToken) { - console.error('Access token is missing!'); - return; - } - - const response = await fetch(api + REVIEWSAPI, { - method: 'POST', - headers: { - 'Content-Type': 'application/json', - "Authorization": shop_archives_token - }, - body: JSON.stringify({ - itemId, - rating, - reviewText - }) - }); - - const result = await response.json(); - if (response.ok) { - fillCategoryModalContentContainer('reviews', true); - } else { - if (document.getElementById("shop-category-modal-write-review-error-output")) { - document.getElementById("shop-category-modal-write-review-error-output").textContent = `${result.message}`; - } - } - - }; - - // Example usage: - // postReview('item123', 5, 'This is my review text.'); - - window.postReview = postReview; - - function deleteReview(reviewId) { - - fetch(api + REVIEWSAPI + `/delete/${reviewId}`, { - method: "DELETE", - headers: { - "Content-Type": "application/json", - "Authorization": shop_archives_token - } - }) - .then(response => response.json()) - .then((data) => { - fillCategoryModalContentContainer('reviews', true); - }) - .catch(error => { - console.error(error) - }); - } - - - function deleteAllStoredUserData() { - const accessToken = discord_token; - - fetch(api + REVIEWSAPI + '/all', { - method: "DELETE", - headers: { - "Content-Type": "application/json", - "Password": api_password, - "Authorization": discord_token, - "Token": api_token - }, - body: JSON.stringify({ - accessToken - }) - }) - .catch(error => { - console.error(error) - }); - } - - - // Function to copy the emoji to clipboard - function copyEmoji(emoji) { - navigator.clipboard.writeText(emoji) - } - - // Redirect to Google if emojiCopy is null - function redirectToLink(link) { - window.location.href = link; - } - - - if (params.get("page") != "item_tool" && params.get("page") != "published_listings" && params.get("page") != "orb_converter" && params.get("page") != "year-recap" && params.get("page") != "login") { - window.onload = fetchData; - } - - const clickable_side_tabs_container = document.getElementById('clickable-side-tabs-container'); - if (clickable_side_tabs_container) { // Check if element exists - document.getElementById('clickable-side-tabs-container').innerHTML = ` -

${getTextString("DISCORD_DISCLAIMER")}

-

${getTextString("DISCORD_DISCLAIMER")}

-
- -
-
-
-
${getTextString("SHOP_DM_DEVIDER")}
-
- -
-
-
-
-
-
- - -
-
-
- -
-
-
-
-
${getTextString("TOOLS_DM_DEVIDER")}
-
- -
-
-
-
-
-
- `; - - if (localStorage.experiment_2025_02_profiles_plus_home === "Treatment 2: Enabled") { - document.getElementById('old-pplus-tab').innerHTML = ``; - document.getElementById('new-profiles-plus-tab-container').innerHTML = ` -
${getTextString("PROFILES_PLUS_DM_DEVIDER")}
-
- - -
- `; - } - - if (localStorage.experiment_2025_02_profiles_plus_home === "Treatment 3: Hide All Profiles Plus Tabs") { - document.getElementById('old-pplus-tab').innerHTML = ``; - document.getElementById('new-profiles-plus-tab-container').innerHTML = ``; - } - - if (localStorage.experiment_2025_01_orb_testing === "Treatment 4: Orb Converter") { - document.getElementById('orb-converter').innerHTML = ` - - `; - } - - if (localStorage.experiment_2025_04_collectibles_marketing_page === "Treatment 1: Enabled" || localStorage.experiment_2025_04_collectibles_marketing_page === "Treatment 2: Enable v2") { - document.getElementById('shop-marketing-tab-container').innerHTML = ` - - `; - } - - if (localStorage.dev === "true") { - document.getElementById('secret-tools').innerHTML = ` - - `; - } - } - - if (localStorage.experiment_2024_11_recap === "Treatment 1: Enabled") { - document.getElementById('recap-2024-tab-loading').innerHTML = ` - - - - `; - document.getElementById('recap-2024-tab').style.backgroundImage = "linear-gradient(90deg, rgba(200, 91, 241, 0.00) 18.75%, #C85BF1 108.26%)"; - } else if (localStorage.experiment_2024_11_recap === "Treatment 2: Nameplate Marketing") { - document.getElementById('recap-2024-tab-loading').innerHTML = ` - - - - `; - document.getElementById('recap-2024-tab').style.backgroundImage = "linear-gradient(10deg, rgba(0, 0, 0, 0) 40%, rgb(115, 11, 200) 180%), linear-gradient(170deg, rgba(0, 0, 0, 0) 40%, rgb(115, 11, 200) 180%)"; - } - - function pageCheck() { - privateAPICheck() - if (params.get("page") === "home") { - document.title = `${getTextString("FEATURED_TAB_DOCUMENT_TITLE")}${getTextString("DOCUMENT_TITLE_SITE_NAME")}`; - if (localStorage.experiment_2025_02_fetch_from_vercel_endpoits === "Treatment 1: Enabled") { - url = api + COLLECTIBLES_SHOP; - apiUrl = new URL(url); - apiUrl.searchParams.append("tab", "home"); - if (localStorage.unreleased_discord_collectibles == "true") { - apiUrl.searchParams.append("include-unpublished", "true"); - } - } else { - apiUrl = api + HOME_PAGE_ALL; - } - createHomePageElement() - document.getElementById("home-tab").classList.add('dm-button-selected'); - document.getElementById("top-bar-container").innerHTML = ` -

${getTextString("FEATURED_TAB_PAGE_TITLE")}

-
-
- `; - } else if (params.get("page") === "year-recap") { - document.title = `${getTextString("RECAP_2024_TAB_DOCUMENT_TITLE")}${getTextString("DOCUMENT_TITLE_SITE_NAME")}`; - createRecap2024Element() - document.getElementById("recap-2024-tab").classList.add('dm-button-selected'); - localStorage.dismissible_recap_2024 = "Treatment 1: Seen"; - document.getElementById("top-bar-container").innerHTML = ` -

${getTextString("RECAP_2024_TAB_PAGE_TITLE")}

-
-
- `; - } else if (params.get("page") === "shop") { - document.title = `${getTextString("SHOP_TAB_DOCUMENT_TITLE")}${getTextString("DOCUMENT_TITLE_SITE_NAME")}`; - if (localStorage.experiment_2025_02_fetch_from_vercel_endpoits === "Treatment 1: Enabled") { - url = api + COLLECTIBLES_SHOP; - apiUrl = new URL(url); - apiUrl.searchParams.append("tab", "shop"); - if (localStorage.unreleased_discord_collectibles == "true") { - apiUrl.searchParams.append("include-unpublished", "true"); - } - } else { - apiUrl = api + COLLECTIBLES_VARIANTS; - } - createMainShopElement() - document.getElementById("shop-tab").classList.add('dm-button-selected'); - document.getElementById("top-bar-container").innerHTML = ` -

${getTextString("SHOP_TAB_PAGE_TITLE")}

-
-
- `; - } else if (params.get("page") === "orbs") { - document.title = `${getTextString("ORB_SHOP_TAB_DOCUMENT_TITLE")}${getTextString("DOCUMENT_TITLE_SITE_NAME")}`; - if (localStorage.experiment_2025_02_orbs_shop === "Treatment 2: Orb Shop done like default" || localStorage.experiment_2025_02_orbs_shop === "Treatment 3: Default + New tag") { - url = api + COLLECTIBLES_SHOP; - apiUrl = new URL(url); - - if (localStorage.experiment_2025_05_orbs_shop_home === "Treatment 1: Enabled") { - apiUrl.searchParams.append("tab", "orbs-home"); - createHomePageElement() - } else { - apiUrl.searchParams.append("tab", "orbs"); - createMainShopElement() - } - - if (localStorage.unreleased_discord_collectibles == "true") { - apiUrl.searchParams.append("include-unpublished", "true"); - } - if (localStorage.experiment_2025_02_orbs_shop === "Treatment 3: Default + New tag") { - localStorage.dismissible_orbs_shop_new_tag = "Treatment 1: Seen" - } - } else { - apiUrl = api + ORBS_SHOP; - } - document.getElementById("top-bar-container").innerHTML = ` -

${getTextString("ORB_SHOP_TAB_PAGE_TITLE")}

-
-
- `; - } else if (params.get("page") === "leaks") { - document.title = `${getTextString("LEAKS_TAB_DOCUMENT_TITLE")}${getTextString("DOCUMENT_TITLE_SITE_NAME")}`; - if (localStorage.experiment_2025_02_fetch_from_vercel_endpoits === "Treatment 1: Enabled") { - url = api + COLLECTIBLES_SHOP; - apiUrl = new URL(url); - apiUrl.searchParams.append("tab", "leaks"); - if (localStorage.unreleased_discord_collectibles == "true") { - apiUrl.searchParams.append("include-unpublished", "true"); - } - } else { - apiUrl = api + LEAKS; - } - createMainShopElement() - document.getElementById("top-bar-container").innerHTML = ` -

${getTextString("LEAKS_TAB_PAGE_TITLE")}

-
-
- `; - } else if (params.get("page") === "leaks_") { - document.title = `${getTextString("LEAKS_TAB_DOCUMENT_TITLE")}${getTextString("DOCUMENT_TITLE_SITE_NAME")}`; - if (localStorage.experiment_2025_02_fetch_from_vercel_endpoits === "Treatment 1: Enabled") { - url = api + COLLECTIBLES_SHOP; - apiUrl = new URL(url); - apiUrl.searchParams.append("tab", "fake-leaks"); - if (localStorage.unreleased_discord_collectibles == "true") { - apiUrl.searchParams.append("include-unpublished", "true"); - } - } else { - apiUrl = api + LEAKS; - } - createMainShopElement() - document.getElementById("top-bar-container").innerHTML = ` -

${getTextString("LEAKS_TAB_PAGE_TITLE")}

-
-
- `; - } else if (params.get("page") === "nameplates") { - document.title = `${getTextString("NAMEPLATES_TAB_DOCUMENT_TITLE")}${getTextString("DOCUMENT_TITLE_SITE_NAME")}`; - if (localStorage.experiment_2025_02_fetch_from_vercel_endpoits === "Treatment 1: Enabled") { - url = api + COLLECTIBLES_SHOP; - apiUrl = new URL(url); - apiUrl.searchParams.append("tab", "nameplates"); - if (localStorage.unreleased_discord_collectibles == "true") { - apiUrl.searchParams.append("include-unpublished", "true"); - } - } - createMainShopElement() - document.getElementById("top-bar-container").innerHTML = ` -

${getTextString("NAMEPLATES_TAB_PAGE_TITLE")}

-
-
- `; - } else if (params.get("page") === "consumables") { - document.title = `${getTextString("POTIONS_TAB_DOCUMENT_TITLE")}${getTextString("DOCUMENT_TITLE_SITE_NAME")}`; - if (localStorage.experiment_2025_02_fetch_from_vercel_endpoits === "Treatment 1: Enabled") { - url = api + COLLECTIBLES_SHOP; - apiUrl = new URL(url); - apiUrl.searchParams.append("tab", "consumables"); - if (localStorage.unreleased_discord_collectibles == "true") { - apiUrl.searchParams.append("include-unpublished", "true"); - } - } else { - apiUrl = api + CONSUMABLES; - } - createMainPotionsElement() - document.getElementById("potions-tab").classList.add('dm-button-selected'); - document.getElementById("top-bar-container").innerHTML = ` -

${getTextString("POTIONS_TAB_PAGE_TITLE")}

-
-
- `; - } else if (params.get("page") === "miscellaneous") { - document.title = `${getTextString("MISCELLANEOUS_TAB_DOCUMENT_TITLE")}${getTextString("DOCUMENT_TITLE_SITE_NAME")}`; - if (localStorage.experiment_2025_02_fetch_from_vercel_endpoits === "Treatment 1: Enabled") { - url = api + COLLECTIBLES_SHOP; - apiUrl = new URL(url); - apiUrl.searchParams.append("tab", "miscellaneous"); - if (localStorage.experiment_2025_04_purchasable_items == "Treatment 1: Enabled") { - apiUrl.searchParams.append("include-purchasable", "true"); - } - if (localStorage.unreleased_discord_collectibles == "true") { - apiUrl.searchParams.append("include-unpublished", "true"); - } - } else { - apiUrl = api + MISCELLANEOUS; - } - createMainShopElement() - document.getElementById("miscellaneous-tab").classList.add('dm-button-selected'); - document.getElementById("top-bar-container").innerHTML = ` -

${getTextString("MISCELLANEOUS_TAB_PAGE_TITLE")}

-
-
- `; - } else if (params.get("page") === "marketing") { - document.title = `${getTextString("MARKETING_TAB_DOCUMENT_TITLE")}${getTextString("DOCUMENT_TITLE_SITE_NAME")}`; - if (localStorage.experiment_2025_02_fetch_from_vercel_endpoits === "Treatment 1: Enabled") { - url = api + COLLECTIBLES_SHOP; - apiUrl = new URL(url); - apiUrl.searchParams.append("tab", "marketing"); - if (localStorage.unreleased_discord_collectibles == "true") { - apiUrl.searchParams.append("include-unpublished", "true"); - } - } - createMainShopElement() - document.getElementById("shop-marketing-tab").classList.add('dm-button-selected'); - document.getElementById("top-bar-container").innerHTML = ` -

${getTextString("MARKETING_TAB_PAGE_TITLE")}

-
-
- `; - } else if (params.get("page") === "pplus-home") { - document.title = `${getTextString("PROFILES_PLUS_FEATURED_TAB_DOCUMENT_TITLE")}${getTextString("DOCUMENT_TITLE_SITE_NAME")}`; - if (localStorage.experiment_2025_02_fetch_from_vercel_endpoits === "Treatment 1: Enabled") { - url = api + COLLECTIBLES_SHOP; - apiUrl = new URL(url); - apiUrl.searchParams.append("tab", "pplus-home"); - if (localStorage.unreleased_profiles_plus == "true") { - apiUrl.searchParams.append("include-unpublished", "true"); - } - } else { - apiUrl = api + HOME_PAGE_PPLUS; - } - createHomePageElement() - document.getElementById("pplus-home-tab").classList.add('dm-button-selected'); - document.getElementById("top-bar-container").innerHTML = ` -

${getTextString("PROFILES_PLUS_FEATURED_TAB_PAGE_TITLE")}

-
-
- `; - } else if (params.get("page") === "pplus") { - document.title = `${getTextString("PROFILES_PLUS_BROWSE_ALL_TAB_DOCUMENT_TITLE")}${getTextString("DOCUMENT_TITLE_SITE_NAME")}`; - if (localStorage.experiment_2025_02_fetch_from_vercel_endpoits === "Treatment 1: Enabled") { - url = api + COLLECTIBLES_SHOP; - apiUrl = new URL(url); - apiUrl.searchParams.append("tab", "pplus"); - if (localStorage.unreleased_profiles_plus == "true") { - apiUrl.searchParams.append("include-unpublished", "true"); - } - } else { - apiUrl = api + PROFILES_PLUS; - } - if (localStorage.experiment_2024_12_profiles_plus_marketing_variants == "Treatment 1: Paper Beach V2") { - localStorage.dismissible_paper_beach_v2_marketing = "Treatment 1: Seen"; - } else if (localStorage.experiment_2024_12_profiles_plus_marketing_variants == "Treatment 2: Roblox Doors") { - localStorage.dismissible_roblox_doors_marketing = "Treatment 1: Seen"; - } - createMainShopElement() - document.getElementById("pplus-tab").classList.add('dm-button-selected'); - document.getElementById("top-bar-container").innerHTML = ` -

${getTextString("PROFILES_PLUS_BROWSE_ALL_TAB_PAGE_TITLE")}

-
-
- `; - } else if (params.get("page") === "published_listings") { - document.title = `${getTextString("PUBLISHED_LISTINGS_TAB_DOCUMENT_TITLE")}${getTextString("DOCUMENT_TITLE_SITE_NAME")}`; - createPublishedListingsPageElement() - document.getElementById("published-listings-tab").classList.add('dm-button-selected'); - document.getElementById("top-bar-container").innerHTML = ` -

${getTextString("PUBLISHED_LISTINGS_TAB_PAGE_TITLE")}

-
-
- `; - } else if (params.get("page") === "orb_converter") { - document.title = `${getTextString("ORB_CONVERTER_TAB_DOCUMENT_TITLE")}${getTextString("DOCUMENT_TITLE_SITE_NAME")}`; - createOrbConverterPageElement() - document.getElementById("orb-converter-tab").classList.add('dm-button-selected'); - document.getElementById("top-bar-container").innerHTML = ` -

${getTextString("ORB_CONVERTER_TAB_PAGE_TITLE")}

-
-
- `; - } else if (params.get("page") === "item_tool") { - document.title = `${getTextString("ITEM_DEBUG_TAB_DOCUMENT_TITLE")}${getTextString("DOCUMENT_TITLE_SITE_NAME")}`; - createItemToolPageElement() - document.getElementById("avatar-decorations-debug-tab").classList.add('dm-button-selected'); - document.getElementById("top-bar-container").innerHTML = ` -

${getTextString("ITEM_DEBUG_TAB_PAGE_TITLE")}

-
-
- `; - } else if (params.get("page") === "login") { - document.title = `${getTextString("DOCUMENT_TITLE_WEBSITE_NAME")}`; - if (localStorage.experiment_2025_05_account_creator === "Treatment 1: Enabled") { - document.body.innerHTML = ` -
-
-
-

${getTextString("ACCOUNT_CREATOR_BASIC_HEADER")}

-

${getTextString("ACCOUNT_CREATOR_BASIC_LOG_IN_DESC")}

- -
-
-

BETA

-

${getTextString("ACCOUNT_CREATOR_STANDARD_HEADER")}

-

${getTextString("ACCOUNT_CREATOR_STANDARD_LOG_IN_DESC")}

- -
- -
-
- -
-
- -
-
- -
-
- `; - - changeACType('1'); - - - window.addEventListener('DOMContentLoaded', () => { - const hash = window.location.hash; - const match = hash.match(/#token=([^&]+)/); - - if (match) { - async function login() { - try { - const token = match[1]; - localStorage.setItem('discord_token', token); - window.location.hash = ''; - localStorage.dismissible_newLogInWithDiscord = "Treatment 1: Seen"; - - - } catch (error) { - setParams({ page: 'home', login: 'false' }); - actuallyLogOutOfDiscord(); - } - } - - login(); - } - }); - } else { - document.body.innerHTML = `logging in...`; - window.addEventListener('DOMContentLoaded', () => { - const hash = window.location.hash; - const match = hash.match(/#token=([^&]+)/); - - if (match) { - async function login() { - try { - const token = match[1]; - localStorage.setItem('discord_token', token); - window.location.hash = ''; - localStorage.dismissible_newLogInWithDiscord = "Treatment 1: Seen"; - - if (!localStorage.discord_profile) { - const userInfo = await fetch('https://discord.com/api/users/@me', { - headers: { Authorization: `Bearer ${token}` } - }); - - if (!userInfo.ok) { - // If the response is not ok (e.g., 401 Unauthorized) - setParams({ page: 'home', login: 'false' }); - actuallyLogOutOfDiscord(); - return; - } - - const user = await userInfo.json(); - localStorage.discord_profile = JSON.stringify(user, undefined, 4); - localStorage.discord_avatar = `https://cdn.discordapp.com/avatars/${user.id}/${user.avatar}.webp?size=4096`; - localStorage.discord_username = user.username; - localStorage.discord_user_id = user.id; - if (user.global_name != null) { - localStorage.discord_displayname = user.global_name; - } else { - localStorage.discord_displayname = user.username; - } - localStorage.discord_banner_color = user.banner_color; - localStorage.discord_premium_type = user.premium_type; - - if (user.banner != null) { - localStorage.discord_banner = `https://cdn.discordapp.com/banners/${user.id}/${user.banner}.png?size=4096`; - } else { - localStorage.removeItem('discord_banner'); - } - - console.log('success'); - setParams({ page: 'home', login: 'true' }); - location.reload(); - } - - // Optional: additional check (but `localStorage.discord_profile` is a string, so this check won't work unless parsed) - const parsedProfile = JSON.parse(localStorage.discord_profile); - if (parsedProfile.code === 0) { - setParams({ page: 'home', login: 'false' }); - actuallyLogOutOfDiscord(); - } - - } catch (error) { - setParams({ page: 'home', login: 'false' }); - actuallyLogOutOfDiscord(); - } - } - - login(); - - } else { - setParams({page: 'home', login: 'false'}); - location.reload(); - } - }); - } - } else if (params.get("page")) { - setParams({page: 'home',err: '404'}); - document.title = `${getTextString("FEATURED_TAB_DOCUMENT_TITLE")}${getTextString("DOCUMENT_TITLE_SITE_NAME")}`; - location.reload(); - console.log('b') - } else { - setParams({page: 'home'}); - document.title = `${getTextString("FEATURED_TAB_DOCUMENT_TITLE")}${getTextString("DOCUMENT_TITLE_SITE_NAME")}`; - location.reload(); - console.log('a') - } - - - if (params.get("login") === "true") { - copyNotice('logintrue'); - removeParams('login'); - } else if (params.get("login") === "false") { - copyNotice('loginfalse'); - removeParams('login'); - } - - const open_help_modals_buttons_holder = document.getElementById('open-help-modals-buttons-holder-new'); - - if (localStorage.experiment_2025_02_extra_options != "Treatment 6: Settings like discord" && open_help_modals_buttons_holder) { - if (localStorage.discord_token) { - let user_button = document.createElement("div"); - - user_button.id = 'open-profile-settings-button-1'; - // user_button.setAttribute("onclick","logoutOfDiscord();"); - // user_button.title = `Log Out`; - user_button.title = getTextString("OPTIONS_EXTRA_PROFILE_DISCORD_LOGGED_IN_AS") + localStorage.discord_displayname; - user_button.innerHTML = ` - - `; - - open_help_modals_buttons_holder.appendChild(user_button); - } - - let options_button = document.createElement("div"); - - options_button.id = 'open-options-tools-button-1'; - options_button.setAttribute("onclick","optionsSidebarToggle();"); - options_button.title = `Options`; - if (localStorage.experiment_2025_04_discord_sign_in_dismissible === "Treatment 1: V1" && localStorage.dismissible_newLogInWithDiscord != "Treatment 1: Seen") { - options_button.innerHTML = ` - -
- `; - } else { - options_button.innerHTML = ` - - `; - } - - open_help_modals_buttons_holder.appendChild(options_button); - } - - if (localStorage.dev == "true" && open_help_modals_buttons_holder) { - let devtools_button = document.createElement("div"); - - devtools_button.id = 'open-dev-tools-button-1'; - devtools_button.classList.add("top-bar-button"); - devtools_button.setAttribute("onclick","openDevModal();"); - devtools_button.title = `Dev Tools`; - devtools_button.innerHTML = ` - - `; - - open_help_modals_buttons_holder.appendChild(devtools_button); - } - - if (localStorage.experiment_2025_05_m === "Treatment 1: Enabled" && open_help_modals_buttons_holder) { - let system_warning_button = document.createElement("div"); - - system_warning_button.id = 'system-warning-button'; - system_warning_button.classList.add("top-bar-button"); - system_warning_button.setAttribute("onclick","openNewDiscordLikeSettings();"); - system_warning_button.title = `Notice`; - system_warning_button.innerHTML = ` - - `; - - open_help_modals_buttons_holder.appendChild(system_warning_button); - } - } - - pageCheck(); - - async function createAccountWithDiscord(type, expires_at) { - const errorOutput = document.getElementById("ac-error-container"); - - errorOutput.innerHTML = ``; - - const login = await fetch('https://api.yapper.shop/v2/user-login', { - method: "POST", - headers: { - "Content-Type": "application/json", - "Authorization": `${localStorage.discord_token}` - }, - body: JSON.stringify({ - type, - expires_at - }) - }); - - if (!login.ok) { - const errors = await login.json(); - - if (errors && errors.message && errors.error) { - errorOutput.innerHTML = ` -
-

${errors.error}, ${errors.message}

-
- `; - } - return - } - - const loginInfo = await login.json(); - - if (type === "2") { - localStorage.shop_archives_token = loginInfo.token; - - localStorage.discord_profile = JSON.stringify(loginInfo.user, undefined, 4); - localStorage.discord_avatar = `https://cdn.discordapp.com/avatars/${loginInfo.user.id}/${loginInfo.user.avatar}.webp?size=4096`; - localStorage.discord_username = loginInfo.user.username; - localStorage.discord_user_id = loginInfo.user.id; - if (loginInfo.user.global_name != null) { - localStorage.discord_displayname = loginInfo.user.global_name; - } else { - localStorage.discord_displayname = loginInfo.user.username; - } - localStorage.discord_banner_color = loginInfo.user.banner_color; - localStorage.discord_premium_type = loginInfo.user.premium_type; - - if (loginInfo.user.banner != null) { - localStorage.discord_banner = `https://cdn.discordapp.com/banners/${loginInfo.user.id}/${loginInfo.user.banner}.png?size=4096`; - } else { - localStorage.removeItem('discord_banner'); - } - } else if (type === "1") { - - localStorage.discord_profile = JSON.stringify(loginInfo, undefined, 4); - - localStorage.discord_avatar = `https://cdn.discordapp.com/avatars/${loginInfo.id}/${loginInfo.avatar}.webp?size=4096`; - localStorage.discord_username = loginInfo.username; - localStorage.discord_user_id = loginInfo.id; - if (loginInfo.global_name != null) { - localStorage.discord_displayname = loginInfo.global_name; - } else { - localStorage.discord_displayname = loginInfo.username; - } - localStorage.discord_banner_color = loginInfo.banner_color; - localStorage.discord_premium_type = loginInfo.premium_type; - - if (loginInfo.banner != null) { - localStorage.discord_banner = `https://cdn.discordapp.com/banners/${loginInfo.id}/${loginInfo.banner}.png?size=4096`; - } else { - localStorage.removeItem('discord_banner'); - } - } - - localStorage.account_type = type; - setParams({ page: 'home', login: 'true' }); - location.reload(); - } - - window.createAccountWithDiscord = createAccountWithDiscord; - - - function changeACType(type) { - if (document.getElementById("ac-tier-card-1") && document.getElementById("ac-tier-card-2")) { - - document.getElementById("ac-error-container").innerHTML = ``; - - if (type === "1") { - document.getElementById("ac-tier-card-1").classList.add("selected"); - document.getElementById("ac-tier-card-2").classList.remove("selected"); - document.getElementById("ac-perks-container").innerHTML = ` -

${getTextString("ACCOUNT_CREATOR_BASIC_LOG_IN_TITLE")}

-

${getTextString("ACCOUNT_CREATOR_BASIC_LOG_IN_DESC")}

-
-
-
- -

${getTextString("ACCOUNT_CREATOR_PERKS_1")}

-
-
- -

${getTextString("ACCOUNT_CREATOR_PERKS_2")}

-
-
- -

${getTextString("ACCOUNT_CREATOR_PERKS_3")}

-
-
- -

${getTextString("ACCOUNT_CREATOR_PERKS_4")}

-
-
-
-
- - -
-
- - - `; - } else if (type === "2") { - document.getElementById("ac-tier-card-1").classList.remove("selected"); - document.getElementById("ac-tier-card-2").classList.add("selected"); - document.getElementById("ac-perks-container").innerHTML = ` -

${getTextString("ACCOUNT_CREATOR_STANDARD_LOG_IN_TITLE")}

-

${getTextString("ACCOUNT_CREATOR_STANDARD_LOG_IN_DESC")}

-
-
-
- -

${getTextString("ACCOUNT_CREATOR_PERKS_1")}

-
-
- -

${getTextString("ACCOUNT_CREATOR_PERKS_2")}

-
-
- -

${getTextString("ACCOUNT_CREATOR_PERKS_3")}

-
-
- -

${getTextString("ACCOUNT_CREATOR_PERKS_4")}

-
-
-
-
- - -
-
- - -
-

${getTextString("ACCOUNT_CREATOR_DISCLAIMER")}

- ${getTextString("ACCOUNT_CREATOR_DISCLAIMER_PRIVACY_POLICY")} -
- `; - - if (document.getElementById("ac-login-button") && document.getElementById("ac-log-me-out-after-input")) { - - document.getElementById("ac-login-button").addEventListener('click', (a) => { - createAccountWithDiscord('2', `${document.getElementById("ac-log-me-out-after-input").value}`) - }); - } - } - - } - } - - - - function leaksCheck() { - if (localStorage.experiment_2025_04_see_you_next_year === "Treatment 1: Enabled") { - if (localStorage.override_leaks_button === "true") { - console.log(`Valid Leaks Check: Overridden`); - document.getElementById('leaks_-tab-loading').innerHTML = ` - - `; - if (params.get("page") === "leaks_") { - document.getElementById("leaks_-tab").classList.add('dm-button-selected'); - } - } else { - if (localStorage.experiment_2025_02_fetch_from_vercel_endpoits === "Treatment 1: Enabled") { - url = api + COLLECTIBLES_SHOP; - apiLeaks = new URL(url); - apiLeaks.searchParams.append("tab", "fake-leaks"); - if (localStorage.unreleased_discord_collectibles == "true") { - apiLeaks.searchParams.append("include-unpublished", "true"); - } - } else { - apiLeaks = api + LEAKS; - } - fetch(apiLeaks, { - method: "GET", - headers: { - "Password": api_password, - "Authorization": discord_token, - "Token": api_token - } - }) - .then(response => response.json()) - .then((data) => { - data.forEach(apiCategory => { - console.log(`Valid Leaks Check: True`); - document.getElementById('leaks_-tab-loading').innerHTML = ` - - `; - if (params.get("page") === "leaks_") { - document.getElementById("leaks_-tab").classList.add('dm-button-selected'); - } - }); - }) - .catch(error => { - console.log(`Valid Leaks Check: False`); - document.getElementById('leaks-tab-loading').innerHTML = ``; - }); - } - } else { - if (localStorage.override_leaks_button === "true") { - console.log(`Valid Leaks Check: Overridden`); - document.getElementById('leaks-tab-loading').innerHTML = ` - - `; - if (params.get("page") === "leaks") { - document.getElementById("leaks-tab").classList.add('dm-button-selected'); - } - } else { - if (localStorage.experiment_2025_02_fetch_from_vercel_endpoits === "Treatment 1: Enabled") { - url = api + COLLECTIBLES_SHOP; - apiLeaks = new URL(url); - apiLeaks.searchParams.append("tab", "leaks"); - if (localStorage.unreleased_discord_collectibles == "true") { - apiLeaks.searchParams.append("include-unpublished", "true"); - } - } else { - apiLeaks = api + LEAKS; - } - fetch(apiLeaks, { - method: "GET", - headers: { - "Password": api_password, - "Authorization": discord_token, - "Token": api_token - } - }) - .then(response => response.json()) - .then((data) => { - data.forEach(apiCategory => { - console.log(`Valid Leaks Check: True`); - document.getElementById('leaks-tab-loading').innerHTML = ` - - `; - if (params.get("page") === "leaks") { - document.getElementById("leaks-tab").classList.add('dm-button-selected'); - } - }); - }) - .catch(error => { - console.log(`Valid Leaks Check: False`); - document.getElementById('leaks-tab-loading').innerHTML = ``; - }); - } - } - } - - - - leaksCheck(); - - - if (localStorage.experiment_2025_02_orbs_shop === "Treatment 1: Orb Shop done like Potions" || localStorage.experiment_2025_02_orbs_shop === "Treatment 2: Orb Shop done like default" || localStorage.experiment_2025_02_orbs_shop === "Treatment 3: Default + New tag") { - if (localStorage.experiment_2025_02_orbs_shop === "Treatment 3: Default + New tag" && localStorage.dismissible_orbs_shop_new_tag != "Treatment 1: Seen") { - document.getElementById('orbs-shop-tab-loading').innerHTML = ` - - `; - } else { - document.getElementById('orbs-shop-tab-loading').innerHTML = ` - - `; - } - if (params.get("page") === "orbs") { - document.getElementById("orbs-shop-tab").classList.add('dm-button-selected'); - } - } - - - - function createHomePageElement() { - document.getElementById("everything-housing-container").innerHTML = ` -
-
-
-
- - - -
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- -
-
-
-
- - - - - - - - -
-
- `; - if (params.get("err") === "404") { - document.getElementById("home-page-warning-container").innerHTML = ` -
-

${getTextString("HOME_PAGE_404_ERROR")}

-
- `; - } - if (params.get("err") === "403") { - document.getElementById("home-page-warning-container").innerHTML = ` -
-

${getTextString("HOME_PAGE_403_ERROR")}

-
- `; - } - if (localStorage.experiment_2024_11_recap === "Treatment 1: Enabled") { - if (localStorage.dismissible_recap_2024 != "Treatment 1: Seen") { - document.getElementById("home-page-dismissible-content-container").innerHTML = ` - - `; - } - } - } - - function dismissibleContentRecap2024() { - setParams({page: 'year-recap'}); location.reload(); - localStorage.dismissible_recap_2024 = "Treatment 1: Seen"; - } - - function createRecap2024Element() { - document.getElementById("everything-housing-container").innerHTML = ` -
- - -
-
- -
-

2025 Recap

- -

Things such as Splash Potions and randomness added to Profile Effects and much more were all nice gifts given to us in 2025!

-

The Shop Archives teams has made this article that covers everything that was added to Discord in 2025!

-

why are you here? this page should only be public from 10/12/2025 to 10/01/2026

-

(remove these notes before the rollout)

-
- -
- -
-

Nameplates

- - - -

Make your name stand out with nameplates! These special designs customize how your name appears in your direct messages (DMs), group chats and servers, giving your name that extra fun and flair wherever you go on Discord.

-
- -
- -
-

Spring Nitro Promotion

- - - -

During Spring, if you were a first time Nitro subscriber, you can choose 1 of 3 Avatar Decorations of your own to collect and keep with an active Nitro subscription!

-
- -
- -
-

Valentine's Nitro Promotion

- - - -

This Valentine's day, up until February 18th, 2025, when you purchase a Nitro gift you would receive the 'Heart-to-Heart' Avatar Decoration of your own to collect and keep!

-
- -
- -
-

Emoji Confetti Potions

- - - -

Emoji Confetti turns ordinary messages into extraordinary ones, going beyond standard emoji reactions to create more fun moments and interactions in your conversations. For only US$0.99.

-
- -
- -
-

See what items you got during 2025

- -

This will only display items you currently have, it does not have access to expired/removed items

- -
- How do I find my collectibles-purchases? -

Open discord.com/app on a browser of your choice and make sure you're signed in.

-

Open Dev Tools by pressing CTRL + SHIFT + I (CMD + OPTION + I on mac) on your keyboard.

-

At the top of Dev Tools you should see the "Network" tab, if you don't see it click the two right poiting arrows for a dropdown, then click "Network".

-

On discord.com open your profile tab in user settings.

-

In the "Network" tab press CTRL + F (CMD + F on mac) on your keyboard and search "collectibles-purchases".

-

Go to the "Response" tab of the file, copy the contents and paste it below.

-
- -
-

Paste Raw collectibles-purchases Text

- - -

Upload collectibles-purchases JSON File

- -
- -

The file you upload will not be stored in any online servers, once the page is refreshed all data is deleted.

-
-
- -
- -
-

Profile Effects

-

Avatar Decorations

-

Shop

-

This page will be visible until 10/01/2026

-
- -
-
- `; - - - function processJsonData(data) { - try { - const parsedData = JSON.parse(data); - console.log("Parsed Data:", parsedData); - - const totalItems2024 = parsedData.filter(item => new Date(item.purchased_at).getFullYear() === 2025); - const totalDecorations = totalItems2024.filter(item => item.type === 0).length; - const totalEffects = totalItems2024.filter(item => item.type === 1).length; - const totalNameplates = totalItems2024.filter(item => item.type === 2).length; - const totalBundles = totalItems2024.filter(item => item.type === 1000).length; - - const purchaseTypes = { - 1: "Items purchased", - 5: "Items claimed for free", - 6: "Items claimed from gifts", - 7: "Items claimed with Nitro", - 9: "Items claimed free with Staff", - 10: "Items claimed in Quests", - 12: "Items claimed with Orbs" - }; - - const purchaseTypeCounts = {}; - Object.keys(purchaseTypes).forEach(key => { - const type = parseInt(key, 10); - purchaseTypeCounts[type] = totalItems2024.filter(item => item.purchase_type === type).length; - }); - - // Generate HTML content with all boxes already included - const outputDiv = document.getElementById("collectibles-purchases-output-div"); - outputDiv.innerHTML = ` -
-
- Total items:${totalItems2024.length} -
-
All items you obtained in 2025.
-
- -
-
-
-
- Total Decorations:${totalDecorations} -
-
All Avatar Decorations you obtained in 2025.
-
- -
-
-
-
- Total Effects:${totalEffects} -
-
All Profile Effects you obtained in 2025.
-
- -
-
-
-
- Total Nameplates:${totalNameplates} -
-
All Profile Nameplates you obtained in 2025.
-
- -
-
-
-
- Total Bundles:${totalBundles} -
-
All Bundles you obtained in 2025.
-
- -
-
-
-
- Items purchased:${purchaseTypeCounts[1] || 0} -
-
All items purchased with real money in 2025.
-
- -
-
-
-
- Items claimed for free:${purchaseTypeCounts[5] || 0} -
-
All items claimed with Nitro (Such as DISXCORE items) or when gifting Nitro in 2025.
-
- -
-
-
-
- Items claimed from gifts:${purchaseTypeCounts[6] || 0} -
-
All items claimed from a gift sent by a friend in 2025.
-
- -
-
-
-
- Items claimed with Nitro:${purchaseTypeCounts[7] || 0} -
-
All items claimed when purchasing a Nitro Subscription (Such as Gyoiko Sakura) in 2025.
-
- -
-
-
-
- Items claimed free with Staff:${purchaseTypeCounts[9] || 0} -
-
All items claimed with Staff Pannel (Or however staff claim their free collectibles) in 2025.
-
- -
-
-
-
- Items claimed in Quests:${purchaseTypeCounts[10] || 0} -
-
All items claimed when completing a Quest in 2025.
-
- -
-
-
-
- Items claimed with Orbs:${purchaseTypeCounts[12] || 0} -
-
All items purchased with Discord Orbs in 2025.
-
- -
-
- `; - - // Expandable functionality for each box - const boxes = document.querySelectorAll('.output-box .box-header'); - boxes.forEach(box => { - box.addEventListener('click', () => { - const expandableContent = box.nextElementSibling.nextElementSibling; // Grabbing the expandable content - if (expandableContent.classList.contains('a2024-output-box-expanded')) { - expandableContent.classList.remove('a2024-output-box-expanded'); - } else { - expandableContent.classList.add('a2024-output-box-expanded'); - } - }); - }); - - // Log results for debugging - console.log(`Total items purchased in 2025: ${totalItems2024.length}`); - console.log(`Total Decorations: ${totalDecorations}`); - console.log(`Total Effects: ${totalEffects}`); - console.log(`Total Bundles: ${totalBundles}`); - Object.entries(purchaseTypeCounts).forEach(([type, count]) => { - console.log(`${purchaseTypes[type]}: ${count}`); - }); - } catch (error) { - console.error("Invalid JSON format:", error.message); - } - } - - // Handle JSON from textarea - document.getElementById('load-raw-collectibles-purchases-by-text-button').addEventListener('click', () => { - const textareaValue = document.getElementById('load-raw-collectibles-purchases-by-text-input').value.trim(); - if (textareaValue) { - processJsonData(textareaValue); - } else { - console.warn("Textarea is empty."); - } - }); - - // Handle JSON file upload - document.getElementById('load-raw-collectibles-purchases-by-file-input').addEventListener('change', (event) => { - const file = event.target.files[0]; - if (file) { - const reader = new FileReader(); - reader.onload = (e) => { - const fileContent = e.target.result; - processJsonData(fileContent); - }; - reader.readAsText(file); - } else { - console.warn("No file selected."); - } - }); - - } - - - function createMainShopElement() { - document.getElementById("everything-housing-container").innerHTML = ` -
-
- - - -
-
-
-
-
-
- `; - } - - function createShopCategoryLoadingElement() { - document.getElementById("shop-category-loading-container").innerHTML = ` -
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- `; - } - - - function createMainPotionsElement() { - document.getElementById("everything-housing-container").innerHTML = ` -
-
- -
-
-
-
-
-
- `; - } - - function createPotionsCategoryLoadingElement() { - document.getElementById("shop-category-loading-container").innerHTML = ` -
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- `; - } - - function createMarketingCategoryLoadingElement() { - document.getElementById("shop-category-loading-container").innerHTML = ` -
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- `; - } - - function createItemToolPageElement() { - document.getElementById("everything-housing-container").innerHTML = ` -
-
-

Avatar Decoration

- -
- Deco Preview -
- SKU ID: SKU ID -

Decoration Name

-

Decoration Description

-
- Price Standard - Price Nitro -
-
-
- -
-
-
- -
- -
- -
- -
- -
- -
- -
- -
- - -
- -
- - -
- -
- -
- -
- - - -
-
-

Upload Item Asset

- -
- - -
- -
-

Load item from JSON

- - -
-
- -
-

Profile Effect

- -
- Effect Preview -
- SKU ID: SKU ID -

Effect Name

-

Effect Description

-
- Price Standard - Price Nitro -
-
-
- -
-
-
- -
- -
- -
- -
- -
- -
- -
- -
- - -
- -
- - -
- -
- -
- -
- - - -
-
-

Upload Item Asset

- -
- - -
- -
-

Load item from JSON

- - -
-
- -
- `; - - - const customDecorationInput = document.getElementById('customDecorationInput'); - const customDecorationUrlInput = document.getElementById('customDecorationUrlInput'); - const loadCustomDecorationUrlButton = document.getElementById('loadCustomDecorationUrl'); - const customDecorationPreview = document.getElementById('customDecorationPreview'); - const decoDataUrlOutput = document.getElementById('deco-dataUrlOutput'); - - // Function to handle file upload - customDecorationInput.addEventListener('change', function(event) { - const file = event.target.files[0]; - if (file) { - const reader = new FileReader(); - - reader.onload = function(e) { - const dataUrl = e.target.result; - - // Display custom decoration preview - customDecorationPreview.src = dataUrl; - customDecorationPreview.style.display = 'block'; - - // Display Data URL - decoDataUrlOutput.textContent = dataUrl; - }; - - reader.readAsDataURL(file); - } - }); - - // Function to handle custom decoration URL input - loadCustomDecorationUrlButton.addEventListener('click', function() { - const customDecorationUrl = customDecorationUrlInput.value; - - if (customDecorationUrl) { - const img = new Image(); - img.crossOrigin = 'Anonymous'; // This is needed to avoid CORS issues - - img.onload = function() { - const canvas = document.createElement('canvas'); - canvas.width = img.width; - canvas.height = img.height; - const ctx = canvas.getContext('2d'); - - ctx.drawImage(img, 0, 0); - - // Convert custom decoration to Data URL - const dataUrl = canvas.toDataURL('image/png'); - - // Display custom decoration preview - customDecorationPreview.src = dataUrl; - customDecorationPreview.style.display = 'block'; - - // Display Data URL - decoDataUrlOutput.textContent = dataUrl; - }; - - img.src = customDecorationUrl; - } - }); - - - - - - - const inputs = { - name: document.getElementById('deco-name-intput-box'), - description: document.getElementById('deco-desc-intput-box'), - id: document.getElementById('deco-skuid-input-box'), - animatedLink: document.getElementById('deco-animated-link-input-box'), - staticLink: document.getElementById('deco-static-link-input-box'), - price: document.getElementById('deco-price-input-box'), - price2: document.getElementById('deco-price2-input-box') - }; - - // Define output elements - const outputs = { - name: document.getElementById('deco-name-output-text'), - description: document.getElementById('deco-desc-output-text'), - id: document.getElementById('deco-skuid-output-text'), - animatedLink: document.getElementById('deco-animated-link-output-text'), - staticLink: document.getElementById('deco-static-link-output-text'), - price: document.getElementById('deco-price-output-text'), - price2: document.getElementById('deco-price2-output-text') - }; - - const decoImagePreview = document.getElementById('customDecorationPreview'); - const decoPreviewCard = document.getElementById('deco-preview-card'); - let DecoStaticLink = ''; - let DecoAnimatedLink = ''; - - // Add event listeners to update text live - for (const key in inputs) { - inputs[key].addEventListener('input', function() { - outputs[key].textContent = `${inputs[key].value}`; - - if (key === 'staticLink') { - DecoStaticLink = inputs.staticLink.value; - decoImagePreview.src = DecoStaticLink; - } else if (key === 'animatedLink') { - DecoAnimatedLink = inputs.animatedLink.value; - } - }); - } - - decoPreviewCard.addEventListener('mouseenter', function() { - if (DecoAnimatedLink) { - decoImagePreview.src = DecoAnimatedLink; - } - }); - - // Reset image source to static link on mouse leave - decoPreviewCard.addEventListener('mouseleave', function() { - if (DecoStaticLink) { - decoImagePreview.src = DecoStaticLink; - } - }); - - // Load JSON from textarea into inputs - document.getElementById('deco-load-json-button').addEventListener('click', function() { - try { - const jsonData = JSON.parse(document.getElementById('deco-json-input').value); - - // Populate the input fields with the JSON data - inputs.name.value = jsonData.name || ""; - inputs.description.value = jsonData.summary || ""; - inputs.id.value = jsonData.sku_id || ""; - inputs.price.value = jsonData.price || ""; - inputs.price2.value = jsonData.price_nitro || ""; - inputs.staticLink.value = jsonData.items[0].static || ""; - inputs.animatedLink.value = jsonData.items[0].animated || ""; - - // Trigger input events to update the live preview - for (const key in inputs) { - inputs[key].dispatchEvent(new Event('input')); - } - } catch (e) { - alert("Invalid JSON! Please check the format."); - } - }); - - // Copy button functionality - document.getElementById('custom-deco-copy-button').addEventListener('click', function() { - // Create JSON string for API use - const jsonData = { - name: inputs.name.value, - summary: inputs.description.value, - sku_id: inputs.id.value, - price: inputs.price.value, - price_nitro: inputs.price2.value, - unpublished_at: null, - isNew: "false", - emojiCopy: null, - items: [ - { - item_type: "deco", - name: inputs.name.value, - static: inputs.staticLink.value, - animated: inputs.animatedLink.value, - summary: inputs.description.value - } - ] - }; - - // Stringify JSON data with indentation for better formatting - const jsonString = JSON.stringify(jsonData, null, 4); - - // Create a temporary textarea to hold the text - const tempTextarea = document.createElement('textarea'); - tempTextarea.value = jsonString; - document.body.appendChild(tempTextarea); - tempTextarea.select(); - document.execCommand('copy'); - document.body.removeChild(tempTextarea); - }); - - - - - - const customEffectInput = document.getElementById('customEffectInput'); - const customEffectUrlInput = document.getElementById('customEffectUrlInput'); - const loadCustomEffectUrlButton = document.getElementById('loadCustomEffectUrl'); - const customEffectPreview = document.getElementById('customEffectPreview'); - const effectDataUrlOutput = document.getElementById('effect-dataUrlOutput'); - - // Function to handle file upload - customEffectInput.addEventListener('change', function(event) { - const file = event.target.files[0]; - if (file) { - const reader = new FileReader(); - - reader.onload = function(e) { - const dataUrl = e.target.result; - - // Display custom Effect preview - customEffectPreview.src = dataUrl; - customEffectPreview.style.display = 'block'; - - // Display Data URL - effectDataUrlOutput.textContent = dataUrl; - }; - - reader.readAsDataURL(file); - } - }); - - // Function to handle custom Effect URL input - loadCustomEffectUrlButton.addEventListener('click', function() { - const customEffectUrl = customEffectUrlInput.value; - - if (customEffectUrl) { - const img = new Image(); - img.crossOrigin = 'Anonymous'; // This is needed to avoid CORS issues - - img.onload = function() { - const canvas = document.createElement('canvas'); - canvas.width = img.width; - canvas.height = img.height; - const ctx = canvas.getContext('2d'); - - ctx.drawImage(img, 0, 0); - - // Convert custom Effect to Data URL - const dataUrl = canvas.toDataURL('image/png'); - - // Display custom Effect preview - customEffectPreview.src = dataUrl; - customEffectPreview.style.display = 'block'; - - // Display Data URL - effectDataUrlOutput.textContent = dataUrl; - }; - - img.src = customEffectUrl; - } - }); - - - - - - - const effectinputs = { - name: document.getElementById('effect-name-intput-box'), - description: document.getElementById('effect-desc-intput-box'), - id: document.getElementById('effect-skuid-input-box'), - animatedLink: document.getElementById('effect-animated-link-input-box'), - staticLink: document.getElementById('effect-static-link-input-box'), - price: document.getElementById('effect-price-input-box'), - price2: document.getElementById('effect-price2-input-box') - }; - - // Define output elements - const effectoutputs = { - name: document.getElementById('effect-name-output-text'), - description: document.getElementById('effect-desc-output-text'), - id: document.getElementById('effect-skuid-output-text'), - animatedLink: document.getElementById('effect-animated-link-output-text'), - staticLink: document.getElementById('effect-static-link-output-text'), - price: document.getElementById('effect-price-output-text'), - price2: document.getElementById('effect-price2-output-text') - }; - - const effectImagePreview = document.getElementById('customEffectPreview'); - const effectPreviewCard = document.getElementById('effect-preview-card'); - let effectStaticLink = ''; - let effectAnimatedLink = ''; - - // Add event listeners to update text live - for (const key in effectinputs) { - effectinputs[key].addEventListener('input', function() { - effectoutputs[key].textContent = `${effectinputs[key].value}`; - - if (key === 'staticLink') { - effectStaticLink = effectinputs.staticLink.value; - effectImagePreview.src = effectStaticLink; - } else if (key === 'animatedLink') { - effectAnimatedLink = effectinputs.animatedLink.value; - } - }); - } - - effectPreviewCard.addEventListener('mouseenter', function() { - if (effectAnimatedLink) { - effectImagePreview.src = effectAnimatedLink; - } - }); - - // Reset image source to static link on mouse leave - effectPreviewCard.addEventListener('mouseleave', function() { - if (effectStaticLink) { - effectImagePreview.src = effectStaticLink; - } - }); - - // Load JSON from textarea into inputs - document.getElementById('effect-load-json-button').addEventListener('click', function() { - try { - const jsonData = JSON.parse(document.getElementById('effect-json-input').value); - - // Populate the input fields with the JSON data - effectinputs.name.value = jsonData.name || ""; - effectinputs.description.value = jsonData.summary || ""; - effectinputs.id.value = jsonData.sku_id || ""; - effectinputs.price.value = jsonData.price || ""; - effectinputs.price2.value = jsonData.price_nitro || ""; - effectinputs.staticLink.value = jsonData.items[0].static || ""; - effectinputs.animatedLink.value = jsonData.items[0].animated || ""; - - // Trigger input events to update the live preview - for (const key in effectinputs) { - effectinputs[key].dispatchEvent(new Event('input')); - } - } catch (e) { - alert("Invalid JSON! Please check the format."); - } - }); - - // Copy button functionality - document.getElementById('custom-effect-copy-button').addEventListener('click', function() { - // Create JSON string for API use - const jsonData = { - name: effectinputs.name.value, - summary: effectinputs.description.value, - sku_id: effectinputs.id.value, - price: effectinputs.price.value, - price_nitro: effectinputs.price2.value, - unpublished_at: null, - isNew: "false", - emojiCopy: null, - items: [ - { - item_type: "effect", - name: effectinputs.name.value, - static: effectinputs.staticLink.value, - animated: effectinputs.animatedLink.value, - summary: effectinputs.description.value - } - ] - }; - - // Stringify JSON data with indentation for better formatting - const jsonString = JSON.stringify(jsonData, null, 4); - - // Create a temporary textarea to hold the text - const tempTextarea = document.createElement('textarea'); - tempTextarea.value = jsonString; - document.body.appendChild(tempTextarea); - tempTextarea.select(); - document.execCommand('copy'); - document.body.removeChild(tempTextarea); - }); - } - - - - function createOrbConverterPageElement() { - document.getElementById("everything-housing-container").innerHTML = ` -
-
- USD - - - Orbs -
-
- `; - } - - - - function createPublishedListingsPageElement() { - document.getElementById("everything-housing-container").innerHTML = ` -
-
- -

Check Published Listing by SKU ID

- -
- - - - - -
-

SKU ID:

-

Name:

-

Summary:

-

Type:

-

Slug:

-

Application ID:

-

Application Name:

-

Standard Price:

-

Nitro Price:

-
- -
-
-
-
- `; - if (localStorage.dev === "true") { - document.getElementById("secret-published-listings-testers").innerHTML = ` -
- -

Category Items List | Staff Only

- -
- - - - - -
-

SKU ID:

-

Name:

-

Summary:

-

Slug:

-

Application ID:

-

Application Name:

-
- -
- `; - } - } - - function checkValidSKUID() { - const SKUinput = document.getElementById('sku-id-input').value; - - document.getElementById('sku-is-valid-or-not-container').innerHTML = ``; - - fetch(`https://canary.discord.com/api/v9/store/published-listings/skus/${SKUinput}`) - .then(response => response.json()) - .then((data) => { - - itemType = data.sku.type; - - if (data.sku.price != null) { - priceStandard = data.sku.price.amount; - priceStandardOutput = `${data.sku.price.currency}$${(priceStandard / 100).toFixed(2)}`; - } else { - priceStandard = 'N/A'; - priceStandardOutput = 'N/A'; - } - - if (data.sku.price != null) { - if (data.sku.price.premium != null) { - priceNitro = data.sku.price.premium["2"].amount; - priceNitroOutput = `${data.sku.price.currency}$${(priceNitro / 100).toFixed(2)}`; - } else { - priceNitroOutput = 'N/A'; - priceNitro = 'N/A'; - } - } else { - priceNitro = 'N/A'; - priceNitroOutput = 'N/A'; - } - - if (itemType === 2) { - itemTypeOutput = `Collectible/Category`; - } else if (itemType === 3) { - itemTypeOutput = `Consumable`; - } else if (itemType === 4) { - itemTypeOutput = `Bundle of Collectibles`; - } - - document.getElementById('sku-check-info-container').innerHTML = ` -

SKU ID: ${data.sku.id}

-

Name: ${data.sku.name}

-

Summary: ${data.summary}

-

Type: ${itemTypeOutput} (${itemType})

-

Slug: ${data.sku.slug}

-

Application ID: ${data.sku.application.id}

-

Application Name: ${data.sku.application.name}

-

Standard Price: ${priceStandardOutput} (${priceStandard})

-

Nitro Price: ${priceNitroOutput} (${priceNitro})

- `; - }) - .catch(error => { - if (SKUinput != '') { - document.getElementById('sku-is-valid-or-not-container').innerHTML = ` -
-

The SKU ID '${SKUinput}' is either invalid or unpublished!

-
- `; - document.getElementById('sku-check-info-container').innerHTML = ` -

SKU ID:

-

Name:

-

Summary:

-

Type:

-

Slug:

-

Application ID:

-

Application Name:

-

Standard Price:

-

Nitro Price:

- `; - } else { - document.getElementById('sku-is-valid-or-not-container').innerHTML = ` -
-

Please input an SKU ID below!

-
- `; - document.getElementById('sku-check-info-container').innerHTML = ` -

SKU ID:

-

Name:

-

Summary:

-

Type:

-

Slug:

-

Application ID:

-

Application Name:

-

Standard Price:

-

Nitro Price:

- `; - } - console.error(error); - }); - } - - function categoryCheckValidSKUID() { - const SKUinput = document.getElementById('category-sku-id-input').value; - - document.getElementById('category-sku-is-valid-or-not-container').innerHTML = ``; - - fetch(`https://canary.discord.com/api/v9/store/published-listings/skus/${SKUinput}`) - .then(response => response.json()) - .then((data) => { - - if (data.child_skus == null) { - if (SKUinput != '') { - document.getElementById('category-sku-is-valid-or-not-container').innerHTML = ` -
-

The SKU ID '${SKUinput}' has no child SKUs or is unpublished!

-
- `; - document.getElementById('category-sku-check-info-container').innerHTML = ` -

SKU ID:

-

Name:

-

Summary:

-

Slug:

-

Application ID:

-

Application Name:

- `; - } else { - document.getElementById('category-sku-is-valid-or-not-container').innerHTML = ` -
-

Please input an SKU ID below!

-
- `; - document.getElementById('category-sku-check-info-container').innerHTML = ` -

SKU ID:

-

Name:

-

Summary:

-

Slug:

-

Application ID:

-

Application Name:

- `; - } - document.getElementById('category-sku-check-info-container').innerHTML = ` -

SKU ID:

-

Name:

-

Summary:

-

Slug:

-

Application ID:

-

Application Name:

- `; - } else { - document.getElementById('category-sku-check-info-container').innerHTML = ` -

SKU ID: ${data.sku.id}

-

Name: ${data.sku.name}

-

Summary: ${data.summary}

-

Slug: ${data.sku.slug}

-

Application ID: ${data.sku.application.id}

-

Application Name: ${data.sku.application.name}

-
- `; - - const childContainer = document.querySelector("[data-category-child-sku-output-container]"); - - data.child_skus.forEach(item => { - const childBlock = document.createElement("div"); - childBlock.classList.add('category-child-sku-output') - itemType = item.type; - - fetch(`https://canary.discord.com/api/v9/store/published-listings/skus/${item.id}`) - .then(response => response.json()) - .then((itemItself) => { - - itemType = itemItself.sku.type; - - if (itemItself.sku.price != null) { - priceStandard = itemItself.sku.price.amount; - priceStandardOutput = `${itemItself.sku.price.currency}$${(priceStandard / 100).toFixed(2)}`; - } else { - priceStandard = 'N/A'; - priceStandardOutput = 'N/A'; - } - - if (itemItself.sku.price != null) { - if (itemItself.sku.price.premium != null) { - priceNitro = itemItself.sku.price.premium["2"].amount; - priceNitroOutput = `${itemItself.sku.price.currency}$${(priceNitro / 100).toFixed(2)}`; - } else { - priceNitroOutput = 'N/A'; - priceNitro = 'N/A'; - } - } else { - priceNitro = 'N/A'; - priceNitroOutput = 'N/A'; - } - - if (itemType === 2) { - itemTypeOutput = `Collectible/Category`; - } else if (itemType === 3) { - itemTypeOutput = `Consumable`; - } else if (itemType === 4) { - itemTypeOutput = `Bundle of Collectibles`; - } - - childBlock.innerHTML = ` -

SKU ID: ${itemItself.sku.id}

-

Name: ${itemItself.sku.name}

-

Summary: ${itemItself.summary}

-

Type: ${itemTypeOutput} (${itemType})

-

Slug: ${itemItself.sku.slug}

-

Application ID: ${itemItself.sku.application.id}

-

Application Name: ${itemItself.sku.application.name}

-

Standard Price: ${priceStandardOutput} (${priceStandard})

-

Nitro Price: ${priceNitroOutput} (${priceNitro})

- `; - }) - .catch(error => { - if (item.price != null) { - priceStandard = item.price.amount; - priceStandardOutput = `${item.price.currency}$${(priceStandard / 100).toFixed(2)}`; - } else { - priceStandard = 'N/A'; - priceStandardOutput = 'N/A'; - } - - if (item.price != null) { - if (item.price.premium != null) { - priceNitro = item.price.premium["2"].amount; - priceNitroOutput = `${item.price.currency}$${(priceNitro / 100).toFixed(2)}`; - } else { - priceNitroOutput = 'N/A'; - priceNitro = 'N/A'; - } - } else { - priceNitro = 'N/A'; - priceNitroOutput = 'N/A'; - } - - - if (itemType === 2) { - itemTypeOutput = `Collectible/Category`; - } else if (itemType === 3) { - itemTypeOutput = `Consumable`; - } else if (itemType === 4) { - itemTypeOutput = `Bundle of Collectibles`; - } - - childBlock.innerHTML = ` -
-
-

This item is not Published!

-
-

SKU ID: ${item.id}

-

Name: ${item.name}

-

Summary: ${item.summary}

-

Type: ${itemTypeOutput} (${itemType})

-

Slug: ${item.slug}

-

Standard Price: ${priceStandardOutput} (${priceStandard})

-

Nitro Price: ${priceNitroOutput} (${priceNitro})

-
- `; - console.error(error); - }); - - childContainer.appendChild(childBlock); - }); - } - }) - .catch(error => { - if (SKUinput != '') { - document.getElementById('category-sku-is-valid-or-not-container').innerHTML = ` -
-

The SKU ID '${SKUinput}' is either invalid or unpublished!

-
- `; - document.getElementById('category-sku-check-info-container').innerHTML = ` -

SKU ID:

-

Name:

-

Summary:

-

Slug:

- `; - } else { - document.getElementById('category-sku-is-valid-or-not-container').innerHTML = ` -
-

Please input an SKU ID below!

-
- `; - document.getElementById('category-sku-check-info-container').innerHTML = ` -

SKU ID:

-

Name:

-

Summary:

-

Slug:

- `; - } - console.error(error); - }); - } - - - if (localStorage.experiment_2025_02_extra_options === "Treatment 6: Settings like discord") { - const dm_container = document.querySelector(".dm-list"); - let u_bar = document.createElement("div"); - - u_bar.classList.add("ubar-profile-and-settings") - u_bar.innerHTML = ` - No image uploaded -

${localStorage.discord_displayname ? localStorage.discord_displayname : "Default User"}

-

${localStorage.discord_username ? localStorage.discord_username : "default_user"}

- - `; - - dm_container.appendChild(u_bar); - } - - function openNewDiscordLikeSettings() { - let modal = document.createElement("div"); - - modal.classList.add('modalv3'); - - modal.innerHTML = ` -
-
-
- -
-
- -
-
-
-
-
- -
-
-
- -
- -
-
-
-
- `; - - document.body.appendChild(modal); - - document.getElementById("modalv3-side-tabs-container").innerHTML = ` -
-

${getTextString("MODAL_V3_TAB_HEADER_USER_SETTINGS")}

-
- - -
- -
- -
- -
-
-

${getTextString("MODAL_V3_TAB_HEADER_SITE_SETTINGS")}

-
- - -
- -
- -
- -
- -
- -
-

Website made by:

DTACat -

${app_version2} ${app_version1}

-
- `; - - if (localStorage.experiment_2025_04_profile_tab_v2 === "Treatment 1: Enabled") { - document.getElementById("modalv3-side-tabs-profile-container").innerHTML = ` - - `; - } - - if (localStorage.experiment_2025_04_reviews_v2 === "Treatment 1: Enabled") { - document.getElementById("modalv3-side-tabs-reviews-container").innerHTML = ` - - `; - } - - if (localStorage.experiment_2025_04_reviews_v2_warning_system === "Treatment 1: Enabled" && discord_token) { - document.getElementById("modalv3-side-tabs-warnings-container").innerHTML = ` - - `; - } - - if (localStorage.experiment_2025_04_accessibility_v2 === "Treatment 1: Enabled") { - document.getElementById("modalv3-side-tabs-accessibility-container").innerHTML = ` - - `; - } - - if (localStorage.experiment_2025_05_xp_system === "Treatment 1: Enabled") { - document.getElementById("xp-perks-options-modalv3-container").innerHTML = ` -
-
-

${getTextString("MODAL_V3_TAB_HEADER_XP_PERKS")}

-

BETA

-
- - - - `; - } - - if (localStorage.dev === "true") { - document.getElementById("staff-options-modalv3-container").innerHTML = ` -
-
-

${getTextString("MODAL_V3_TAB_HEADER_STAFF_ONLY")}

-
- - - - - - - `; - } - - setTimeout(() => { - modal.classList.add('show'); - }, 1); - - setModalv3InnerContent('account'); - - - document.addEventListener("keydown", function (event) { - if (event.key === "Escape") { - modal.classList.remove('show'); - setTimeout(() => { - modal.remove(); - }, 300); - } - }); - - document.querySelector("[data-discord-like-settings-close-button]").addEventListener('click', (event) => { - modal.classList.remove('show'); - setTimeout(() => { - modal.remove(); - }, 300); - }); - } - - async function setModalv3InnerContent(tab) { - if (!document.getElementById("modalv3-right-content-container-inner")) { - openNewDiscordLikeSettings(); - } - const tabPageOutput = document.getElementById("modalv3-right-content-container-inner"); - - if (document.querySelector(".side-tabs-button-selected")) { - document.querySelectorAll('.side-tabs-button-selected').forEach((el) => { - el.classList.remove("side-tabs-button-selected"); - }); - } - - document.getElementById("modalv3-right-content-container").scrollTo(0,0); - - if (localStorage.discord_token) { - document.getElementById("login-logout-options-modalv3-container").innerHTML = ` -
- - `; - } else if (localStorage.experiment_2025_05_m != "Treatment 1: Enabled") { - document.getElementById("login-logout-options-modalv3-container").innerHTML = ` -
- - `; - } - - if (tab === "account") { - document.getElementById("modal-v3-tab-" + tab).classList.add("side-tabs-button-selected"); - tabPageOutput.innerHTML = ` -

${getTextString("MODAL_V3_TAB_ACCOUNT_HEADER")}

-
-

${getTextString("MODAL_V3_TAB_ACCOUNT_DISCORD_ACCOUNT_HEADER")}

-

${getTextString("MODAL_V3_TAB_ACCOUNT_DISCORD_ACCOUNT_SUMMARY")}

- -
-
- -
- -
-
- -
- -
- `; - - if (localStorage.experiment_2025_05_account_creator === "Treatment 1: Enabled" && localStorage.discord_token && !localStorage.account_type && document.getElementById("modalv3-account-account-outdated-container")) { - document.getElementById("modalv3-account-account-outdated-container").innerHTML = ` -
-

Account outdated!

-

You logged in to Shop Archives before the new account system, if you ignore this warning some things may break. Please log in again.

-
- `; - } - - const accountDetails = document.getElementById("modalv3-account-account-details-container"); - - if (localStorage.experiment_2025_05_m === "Treatment 1: Enabled") { - tabPageOutput.innerHTML = ` -

${getTextString("MODAL_V3_TAB_ACCOUNT_HEADER")}

-
-

${getTextString("MODAL_V3_TAB_ACCOUNT_DISCORD_ACCOUNT_HEADER")}

-

${getTextString("MODAL_V3_TAB_ACCOUNT_DISCORD_ACCOUNT_SUMMARY")}

- -
-

${getTextString("MODAL_V3_TAB_ACCOUNT_DISCORD_ACCOUNT_UNAVAILABLE_HEADER")}

-

${getTextString("MODAL_V3_TAB_ACCOUNT_DISCORD_ACCOUNT_UNAVAILABLE_SUMMARY")}

-
-
- `; - } else if (localStorage.discord_token && localStorage.account_type != "2") { - const discordProfile = JSON.parse(localStorage.discord_profile); - accountDetails.innerHTML = ` -
-
-
-
- -
- -

${discordProfile.global_name}

- - -
- -
-
- `; - } else if (localStorage.discord_token && localStorage.account_type === "2") { - - if (!atMeUsercache) { - fetch(api + `/users/@me`, { - method: "GET", - headers: { - "Authorization": localStorage.shop_archives_token - } - }) - .then(response => response.json()) - .then((data) => { - renderAtMeAccountPage(data); - atMeUsercache = data; - }) - .catch(error => { - console.error(error); - accountDetails.innerHTML = ` - error - `; - }); - } else { - renderAtMeAccountPage(atMeUsercache) - } - - function renderAtMeAccountPage(atMe) { - if (atMe.message) { - accountDetails.innerHTML = ` -
-
-
-
- -
-
-

Error

- - -
- -
-
- `; - } else { - accountDetails.innerHTML = ` -
-
-
-
- -
- -

- - -
- -
-
- `; - - if (atMe.banner_color) { - accountDetails.querySelector("[data-modalv3-banner-color]").style.backgroundColor = atMe.banner_color; - } - - if (atMe.global_name === null) { - accountDetails.querySelector("[data-modalv3-account-displayname]").textContent = atMe.username; - } else { - accountDetails.querySelector("[data-modalv3-account-displayname]").textContent = atMe.global_name; - } - - if (atMe.global_name === null) { - accountDetails.querySelector("[data-modalv3-account-displayname2]").textContent = atMe.username; - } else { - accountDetails.querySelector("[data-modalv3-account-displayname2]").textContent = atMe.global_name; - } - - accountDetails.querySelector("[data-modalv3-account-username2]").textContent = atMe.username; - } - } - } else { - tabPageOutput.innerHTML = ` -

${getTextString("MODAL_V3_TAB_ACCOUNT_HEADER")}

-
-
-

${getTextString("MODAL_V3_TAB_ACCOUNT_DISCORD_ACCOUNT_NOT_LOGGED_IN_HEADER")}

-

${getTextString("MODAL_V3_TAB_ACCOUNT_DISCORD_ACCOUNT_NOT_LOGGED_IN_SUMMARY")}

- -
-
- `; - } - } else if (tab === "profile") { - document.getElementById("modal-v3-tab-" + tab).classList.add("side-tabs-button-selected"); - tabPageOutput.innerHTML = ` -

${getTextString("MODAL_V3_TAB_PROFILE_HEADER")}

-
-

${getTextString("MODAL_V3_TAB_PROFILE_DISCORD_PROFILE_HEADER")}

-

${getTextString("MODAL_V3_TAB_PROFILE_DISCORD_PROFILE_SUMMARY")}

-
-
-
-
-
- `; - - document.getElementById("modalv3-profile-editor-preview-container").innerHTML = ` -

Preview:

-
-
-
-
- No image uploaded -
-
-

${localStorage.discord_displayname}

-

-
- `; - - document.getElementById("modalv3-profile-editor-content-container").innerHTML = ` -
- -
-
-

${getTextString("MODAL_V3_TAB_PROFILE_DISCORD_PROFILE_CHANGE_DISPLAY_NAME_HEADER")}

- -
-
-
-

${getTextString("MODAL_V3_TAB_PROFILE_DISCORD_PROFILE_CHANGE_AVATAR_HEADER")}

- - - -
-
-
-
-

${getTextString("MODAL_V3_TAB_PROFILE_DISCORD_PROFILE_CHANGE_BANNER_HEADER")}

- - - -
-
-
-
-

${getTextString("MODAL_V3_TAB_PROFILE_DISCORD_PROFILE_CHANGE_BANNER_COLOR_HEADER")}

- -
- `; - - if (discord_token) { - document.getElementById("modalv3-profile-tab-sign-in-notice").innerHTML = ` -
-

${getTextString("MODAL_V3_TAB_PROFILE_DISCORD_PROFILE_LOGGED_IN_TITLE")}

-

${getTextString("MODAL_V3_TAB_PROFILE_DISCORD_PROFILE_LOGGED_IN_SUMMARY")}

-
- `; - } - - document.getElementById("options-username-preview").textContent = localStorage.discord_username.toLowerCase(); - - const avatarImageInput = document.getElementById("profileAvatarInput"); - const avatarImagePreview = document.getElementById("profileAvatarPreview"); - const removeAvatarImageButton = document.getElementById("removeProfileAvatarButton"); - - // Load saved image from localStorage on page load - document.addEventListener("DOMContentLoaded", () => { - const savedImage = localStorage.getItem("discord_avatar"); - if (savedImage) { - avatarImagePreview.src = savedImage; - } - }); - - // Handle image upload - avatarImageInput.addEventListener("change", function () { - document.getElementById("options-avatar-img-input-option-error").innerHTML = ``; - const file = this.files[0]; - if (file) { - const reader = new FileReader(); - reader.onload = function (event) { - const dataUrl = event.target.result; - try { - localStorage.setItem("discord_avatar", dataUrl); - avatarImagePreview.src = dataUrl; - } catch(error) { - document.getElementById("options-avatar-img-input-option-error").innerHTML = ` -
-

${getTextString("OPTIONS_EXTRA_PROFILE_FILE_TOO_BIG")}

-

${getTextString("OPTIONS_EXTRA_PROFILE_FILE_TOO_BIG_SUMMARY")}

-
- `; - } - }; - reader.readAsDataURL(file); - } - }); - - // Handle image removal - removeAvatarImageButton.addEventListener("click", function () { - setRandomDiscordAvatar() - avatarImagePreview.src = localStorage.discord_avatar; - document.getElementById("options-avatar-img-input-option-error").innerHTML = ``; - }); - - - const bannerImageInput = document.getElementById("profileBannerInput"); - const bannerImagePreview = document.getElementById("profileBannerPreview"); - const removeBannerImageButton = document.getElementById("removeProfileBannerButton"); - - - if (localStorage.discord_banner === ``) { - removeBannerImageButton.style.display = 'none'; - } - - // Load saved image from localStorage on page load - document.addEventListener("DOMContentLoaded", () => { - const savedImage = localStorage.getItem("discord_banner"); - if (savedImage) { - bannerImagePreview.style.backgroundImage = `url(${savedImage})`; - } - }); - - // Handle image upload - bannerImageInput.addEventListener("change", function () { - document.getElementById("options-banner-img-input-option-error").innerHTML = ``; - removeBannerImageButton.style.display = 'unset'; - const file = this.files[0]; - if (file) { - const reader = new FileReader(); - reader.onload = function (event) { - const dataUrl = event.target.result; - try { - localStorage.setItem("discord_banner", dataUrl); - bannerImagePreview.style.backgroundImage = `url(${dataUrl})`; - } catch(error) { - document.getElementById("options-banner-img-input-option-error").innerHTML = ` -
-

${getTextString("OPTIONS_EXTRA_PROFILE_FILE_TOO_BIG")}

-

${getTextString("OPTIONS_EXTRA_PROFILE_FILE_TOO_BIG_SUMMARY")}

-
- `; - } - }; - reader.readAsDataURL(file); - } - }); - - // Handle image removal - removeBannerImageButton.addEventListener("click", function () { - removeBannerImageButton.style.display = 'none'; - localStorage.discord_banner = `` - bannerImagePreview.style.backgroundImage = ''; - document.getElementById("options-banner-img-input-option-error").innerHTML = ``; - }); - - } else if (tab === "warnings") { - document.getElementById("modal-v3-tab-" + tab).classList.add("side-tabs-button-selected"); - tabPageOutput.innerHTML = ` -

${getTextString("MODAL_V3_TAB_WARNINGS_HEADER")}

-
-

${getTextString("MODAL_V3_TAB_WARNINGS_ACCOUNT_WARNINGS_HEADER")}

-

${getTextString("MODAL_V3_TAB_WARNINGS_ACCOUNT_WARNINGS_SUMMARY")}

- -
-
-
- `; - - updateAndCacheReviewsWarnings(); - } else if (tab === "reviews") { - document.getElementById("modal-v3-tab-" + tab).classList.add("side-tabs-button-selected"); - if (localStorage.experiment_2025_05_m === "Treatment 1: Enabled") { - tabPageOutput.innerHTML = ` -

${getTextString("MODAL_V3_TAB_REVIEWS_HEADER")}

-
-

${getTextString("MODAL_V3_TAB_REVIEWS_UNAVAILABLE_HEADER")}

-

${getTextString("MODAL_V3_TAB_REVIEWS_UNAVAILABLE_SUMMARY")}

-
- `; - } else if (localStorage.discord_token && shop_archives_token) { - tabPageOutput.innerHTML = ` -

${getTextString("MODAL_V3_TAB_REVIEWS_HEADER")}

-
-

${getTextString("MODAL_V3_TAB_REVIEWS_REVIEWS_FILTER_HEADER")}

-

${getTextString("MODAL_V3_TAB_REVIEWS_REVIEWS_FILTER_SUMMARY")}

- -
-
-

${getTextString("MODAL_V3_TAB_REVIEWS_REVIEWS_FILTER_SETTINGS_3")}

-

${getTextString("MODAL_V3_TAB_REVIEWS_REVIEWS_FILTER_SETTINGS_3_SUMMARY")}

-
-
-
-
-

${getTextString("MODAL_V3_TAB_REVIEWS_REVIEWS_FILTER_SETTINGS_2")}

-

${getTextString("MODAL_V3_TAB_REVIEWS_REVIEWS_FILTER_SETTINGS_2_SUMMARY")}

-
-
-
-
-

${getTextString("MODAL_V3_TAB_REVIEWS_REVIEWS_FILTER_SETTINGS_1")}

-

${getTextString("MODAL_V3_TAB_REVIEWS_REVIEWS_FILTER_SETTINGS_1_SUMMARY")}

-
-
-
- `; - - updateReviewsFilterStore(); - } else { - tabPageOutput.innerHTML = ` -

${getTextString("MODAL_V3_TAB_REVIEWS_HEADER")}

-
-

${getTextString("MODAL_V3_TAB_REVIEWS_REVIEWS_FILTER_HEADER")}

-

${getTextString("MODAL_V3_TAB_REVIEWS_DISCORD_ACCOUNT_NOT_LOGGED_IN_SUMMARY")}

- -
-
-

${getTextString("MODAL_V3_TAB_REVIEWS_REVIEWS_FILTER_SETTINGS_3")}

-

${getTextString("MODAL_V3_TAB_REVIEWS_REVIEWS_FILTER_SETTINGS_3_SUMMARY")}

-
-
-
- -
-
-

${getTextString("MODAL_V3_TAB_REVIEWS_REVIEWS_FILTER_SETTINGS_2")}

-

${getTextString("MODAL_V3_TAB_REVIEWS_REVIEWS_FILTER_SETTINGS_2_SUMMARY")}

-
-
-
-
-

${getTextString("MODAL_V3_TAB_REVIEWS_REVIEWS_FILTER_SETTINGS_1")}

-

${getTextString("MODAL_V3_TAB_REVIEWS_REVIEWS_FILTER_SETTINGS_1_SUMMARY")}

-
-
-
- `; - } - - } else if (tab === "appearance") { - document.getElementById("modal-v3-tab-" + tab).classList.add("side-tabs-button-selected"); - tabPageOutput.innerHTML = ` -

${getTextString("MODAL_V3_TAB_APPEARANCE_HEADER")}

-
-

${getTextString("MODAL_V3_TAB_APPEARANCE_THEME_HEADER")}

-

${getTextString("MODAL_V3_TAB_APPEARANCE_THEME_SUMMARY")}

- -
-
-
- - - -
-
-

${getTextString("MODAL_V3_TAB_APPEARANCE_TIME_HEADER")}

-

${getTextString("MODAL_V3_TAB_APPEARANCE_TIME_SUMMARY")}

-
-
-

${getTextString("MODAL_V3_TAB_APPEARANCE_TIME_SETTINGS_2")}

-

${getTextString("MODAL_V3_TAB_APPEARANCE_TIME_SETTINGS_2_SUMMARY")}

-
-
-
-
-

${getTextString("MODAL_V3_TAB_APPEARANCE_TIME_SETTINGS_1")}

-

${getTextString("MODAL_V3_TAB_APPEARANCE_TIME_SETTINGS_1_SUMMARY")}

-
-
-
- - - `; - - updateReviewsTimeFormatStore(); - - document.getElementById("modalv3-theme-selection-container").innerHTML = ` -
-
-
- `; - - if (localStorage.experiment_2025_04_theme_picker_v2_color === "Treatment 1: Enabled") { - document.getElementById("modal-v3-color-themes-experiment-output").innerHTML = ` -
-
-

${getTextString("MODAL_V3_TAB_APPEARANCE_THEME_COLOR_HEADER")}

-

${getTextString("MODAL_V3_TAB_APPEARANCE_THEME_COLOR_SUMMARY")}

- -
-
-
- `; - - document.getElementById("modalv3-color-theme-selection-container").innerHTML = ` -
-
-
- `; - } - - if (localStorage.experiment_2025_04_theme_picker_v2_custom === "Treatment 1: Enabled") { - document.getElementById("modal-v3-custom-themes-experiment-output").innerHTML = ` -
-
-

${getTextString("MODAL_V3_TAB_APPEARANCE_THEME_CUSTOM_HEADER")}

-

${getTextString("MODAL_V3_TAB_APPEARANCE_THEME_CUSTOM_SUMMARY")}

- -
-
-
- `; - - document.getElementById("modalv3-custom-theme-selection-container").innerHTML = ` -
- -
- `; - } - - if (localStorage.experiment_2025_04_theme_picker_v2_community === "Treatment 2: As banners") { - document.getElementById("modal-v3-community-themes-experiment-output").innerHTML = ` -
-
-

${getTextString("MODAL_V3_TAB_APPEARANCE_THEME_COMMUNITY_HEADER")}

-

${getTextString("MODAL_V3_TAB_APPEARANCE_THEME_COMMUNITY_SUMMARY")}

- -
-
-
- `; - fetchAndRenderCommunityThemesAsBanners(); - } - - async function fetchAndRenderCommunityThemesAsBanners() { - if (!communityThemesCache) { - await setCommunityThemesCache(); - } - - try { - communityThemesCache.forEach(theme => { - let themeIcon = document.createElement("div"); - - themeIcon.classList.add("modalv3-community-theme-banner"); - themeIcon.id = 'theme-community-' + theme.id + '-button' - themeIcon.style.color = theme.text_color; - if (theme.banner.src != null) { - themeIcon.style.backgroundImage = `linear-gradient(-90deg,rgba(0, 0, 0, 0) 30%,${theme.banner.color_primary}), url('${theme.banner.src}')`; - } else if (theme.banner.color_secondary != null) { - themeIcon.style.backgroundImage = `linear-gradient(-90deg, ${theme.banner.color_secondary} 30%,${theme.banner.color_primary})`; - } else { - themeIcon.style.backgroundColor = theme.banner.color_primary; - } - - themeIcon.innerHTML = ` -

${theme.name}

- -
-
- -
-
- `; - - document.getElementById("modalv3-community-theme-selection-container").appendChild(themeIcon); - }); - if (document.getElementById("theme-" + localStorage.sa_theme + "-button")) { - document.getElementById("theme-" + localStorage.sa_theme + "-button").classList.add('theme-selection-box-selected'); - } - } - catch(error) { - document.getElementById("modalv3-community-theme-selection-container").innerHTML = `There was an error loading community themes`; - } - } - - if (document.getElementById("theme-" + localStorage.sa_theme + "-button")) { - document.getElementById("theme-" + localStorage.sa_theme + "-button").classList.add('theme-selection-box-selected'); - } - - if (localStorage.experiment_2025_04_extended_styles === "Treatment 1: Enabled" || localStorage.experiment_2025_04_extended_styles === "Treatment 2: Card Styles") { - document.getElementById("modal-v3-extended-styles-experiment-output").innerHTML = ` -
-
-

${getTextString("MODAL_V3_TAB_APPEARANCE_EXTENDED_STYLES_CATEGORY_TABS_HEADER")}

-

${getTextString("MODAL_V3_TAB_APPEARANCE_EXTENDED_STYLES_CATEGORY_TABS_SUMMARY")}

- -
-
- `; - - document.getElementById("modalv3-extended-styles-card-container-category-tabs").innerHTML = ` -
-

${getTextString("MODAL_V3_TAB_APPEARANCE_EXTENDED_STYLES_CATEGORY_TABS_DARK")}

-
-
- -
-

${getTextString("MODAL_V3_TAB_APPEARANCE_EXTENDED_STYLES_CATEGORY_TABS_SELECTED")}

-
- -
-

${getTextString("MODAL_V3_TAB_APPEARANCE_EXTENDED_STYLES_CATEGORY_TABS_OTHER")}

-
- -
-
-
-
-
-
-

${getTextString("MODAL_V3_TAB_APPEARANCE_EXTENDED_STYLES_CATEGORY_TABS_TRANSPARENT")}

-
-
- -
-

${getTextString("MODAL_V3_TAB_APPEARANCE_EXTENDED_STYLES_CATEGORY_TABS_SELECTED")}

-
- -
-

${getTextString("MODAL_V3_TAB_APPEARANCE_EXTENDED_STYLES_CATEGORY_TABS_OTHER")}

-
- -
-
-
-
-
-
-

${getTextString("MODAL_V3_TAB_APPEARANCE_EXTENDED_STYLES_CATEGORY_TABS_LEGACY")}

-
-
- -
-

${getTextString("MODAL_V3_TAB_APPEARANCE_EXTENDED_STYLES_CATEGORY_TABS_SELECTED")}

-
- -
-

${getTextString("MODAL_V3_TAB_APPEARANCE_EXTENDED_STYLES_CATEGORY_TABS_OTHER")}

-
- -
-
-
-
-
- `; - - updateExtendedStylesCategoryTab(); - } - - if (localStorage.experiment_2025_04_extended_styles === "Treatment 2: Card Styles") { - document.getElementById("modal-v3-extended-styles-cards-experiment-output").innerHTML = ` -
-
-

${getTextString("MODAL_V3_TAB_APPEARANCE_EXTENDED_STYLES_SHOP_CARDS_HEADER")}

-

${getTextString("MODAL_V3_TAB_APPEARANCE_EXTENDED_STYLES_SHOP_CARDS_SUMMARY")}

- -
- `; - } - - } else if (tab === "accessibility") { - document.getElementById("modal-v3-tab-" + tab).classList.add("side-tabs-button-selected"); - tabPageOutput.innerHTML = ` -

${getTextString("MODAL_V3_TAB_ACCESSIBILITY_HEADER")}

-
-

${getTextString("MODAL_V3_TAB_ACCESSIBILITY_REDUCED_MOTION_HEADER")}

-

${getTextString("MODAL_V3_TAB_ACCESSIBILITY_REDUCED_MOTION_SUMMARY")}

-

${getTextString("MODAL_V3_TAB_ACCESSIBILITY_REDUCED_MOTION_SUMMARY2")}

- - -
- `; - - } else if (tab === "xp_events") { - document.getElementById("modal-v3-tab-" + tab).classList.add("side-tabs-button-selected"); - tabPageOutput.innerHTML = ` - -
-
- -

${getTextString("MODAL_V3_TAB_XP_EVENTS_HEADER")}

- -
-
- -
-

${getTextString("MODAL_V3_TAB_XP_EVENTS_EVENTS_HEADER")}

-

${getTextString("MODAL_V3_TAB_XP_EVENTS_EVENTS_SUMMARY")}

- Learn More about XP - -
- -
-
-

Loading Events...

-

Events are currently being loaded, please wait...

-
-
- - - - -
- `; - - if (localStorage.dismissible_XPnotice != "Treatment 1: Seen") { - document.getElementById("modalv3-xp-notice-container").innerHTML = ` -
- -

${getTextString("MODAL_V3_XP_NOTICE_1")}

-

${getTextString("MODAL_V3_XP_NOTICE_2")}

-
- `; - } - - if (!claimablesPromotionsCache) { - try { - - url = api + CLAIMABLES_PROMOTIONS; - fetchUrl = new URL(url); - if (localStorage.staff_unpublished_xp_events == "true") { - fetchUrl.searchParams.append("include-unpublished", "true"); - } - - const userInfo = await fetch(fetchUrl, { - headers: { Authorization: `${shop_archives_token}` } - }); - - if (!userInfo.ok) { - document.getElementById("modalv3-failed-to-load-xp-events-balance").innerHTML = ` -
-

${getTextString("MODAL_V3_TAB_XP_EVENTS_ERROR_1")}

-
-
- `; - } - - const data = await userInfo.json(); - - if (data.message) { - document.getElementById("modalv3-failed-to-load-xp-events-balance").innerHTML = ` -
-

${getTextString("MODAL_V3_TAB_XP_EVENTS_ERROR_1")}

-

${data.error}, ${data.message}

-
-
- `; - } else { - claimablesPromotionsCache = data; - } - - } catch (error) { - console.error(error) - } - } - - function fetchXpEvents() { - document.getElementById("modalv3-xp-events-output").innerHTML = ``; - document.getElementById("modalv3-xp-events-output2").innerHTML = ``; - if (Array.isArray(claimablesPromotionsCache) && claimablesPromotionsCache.length != 0) { - claimablesPromotionsCache.forEach(promo => { - - let promoBanner = document.createElement("div"); - - promoBanner.classList.add("xp-reward-event-card"); - - if (promo.already_claimed === false) { - - if (promo.category_data) { - promoBanner.innerHTML = ` -
-
-

${promo.name}

-

You have ${promo.xp_reward.toLocaleString()} XP waiting for you!

- -
- `; - } else { - promoBanner.innerHTML = ` -
-
-

${promo.name}

-

You have ${promo.xp_reward.toLocaleString()} XP waiting for you!

- -
- `; - } - - const expiresAt = new Date(promo.expires_at); - - if (promo.expires_at && !isNaN(expiresAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = expiresAt - now; - - if (timeDiff <= 0) { - promoBanner.classList.add("hidden"); - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / (1000 * 60)); - const seconds = Math.floor((timeDiff % (1000 * 60)) / 1000); - - const date = `ENDS IN ${days}d ${hours}h ${minutes}m ${seconds}s`; - - promoBanner.querySelector("[data-xp-event-expires-at]").innerHTML = ` -

${date.replace(" 0d 0h 0m", "").replace(" 0d 0h", "").replace(" 0d", "")}

- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - document.getElementById("modalv3-xp-events-output").appendChild(promoBanner); - } else { - - promoBanner.classList.add("claimed"); - - promoBanner.innerHTML = ` -
-
-

${promo.name}

-

You already claimed this reward for ${promo.xp_reward.toLocaleString()} XP.

- -
- `; - - const expiresAt = new Date(promo.expires_at); - - if (promo.expires_at && !isNaN(expiresAt.getTime())) { - - function updateTimer() { - const now = new Date(); - const timeDiff = expiresAt - now; - - if (timeDiff <= 0) { - promoBanner.classList.add("hidden"); - clearInterval(timerInterval); - } else { - const days = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - const hours = Math.floor((timeDiff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - const minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / (1000 * 60)); - const seconds = Math.floor((timeDiff % (1000 * 60)) / 1000); - - const date = `ENDS IN ${days}d ${hours}h ${minutes}m ${seconds}s`; - - promoBanner.querySelector("[data-xp-event-expires-at]").innerHTML = ` -

${date.replace(" 0d 0h 0m", "").replace(" 0d 0h", "").replace(" 0d", "")}

- `; - } - } - - const timerInterval = setInterval(updateTimer, 1000); - updateTimer(); - } - - document.getElementById("modalv3-xp-events-output2").appendChild(promoBanner); - } - }); - - document.getElementById("modalv3-xp-events-output").style.display = 'unset'; - document.getElementById("modalv3-xp-events-output2").style.display = 'unset'; - document.getElementById("modalv3-xp-events-loading").style.display = 'none'; - } else { - document.getElementById("modalv3-xp-events-output").style.display = 'unset'; - document.getElementById("modalv3-xp-events-loading").style.display = 'none'; - - document.getElementById("modalv3-xp-events-output").innerHTML = ` -
-
-

All is quiet...

-

There are currently no events happening right now, check back later.

-
-
- `; - } - } - - window.fetchXpEvents = fetchXpEvents; - - fetchXpEvents(); - - } else if (tab === "xp_general") { - document.getElementById("modal-v3-tab-" + tab).classList.add("side-tabs-button-selected"); - tabPageOutput.innerHTML = ` - -
-
- -

${getTextString("MODAL_V3_TAB_XP_SHOP_HEADER")}

- -
-
- -
-
- -
-

${getTextString("MODAL_V3_TAB_XP_SHOP_XP_LEVEL_HEADER")}

- -
-
- -
-
-

...

-
-
-
-
-
-

${getTextString("MODAL_V3_TAB_XP_SHOP_CLAIMABLES_FEATURED")}

-

${getTextString("MODAL_V3_TAB_XP_SHOP_CLAIMABLES_FEATURED_SUMMARY")}

- - - - -
-
-
-

${getTextString("MODAL_V3_TAB_XP_SHOP_CLAIMABLES_ADDITIONAL")}

- - -
- `; - - if (localStorage.dismissible_XPnotice != "Treatment 1: Seen") { - document.getElementById("modalv3-xp-notice-container").innerHTML = ` -
- -

${getTextString("MODAL_V3_XP_NOTICE_1")}

-

${getTextString("MODAL_V3_XP_NOTICE_2")}

-
- `; - } - - if (!atMeUsercache) { - try { - - const userInfo = await fetch('https://api.yapper.shop/v2/users/@me', { - headers: { Authorization: `${shop_archives_token}` } - }); - - if (!userInfo.ok) { - document.getElementById("modalv3-failed-to-load-xp-shop").innerHTML = ` -
-

${getTextString("MODAL_V3_TAB_XP_SHOP_ERROR_2")}

-
-
- `; - } - - const data = await userInfo.json(); - - if (data.message) { - document.getElementById("modalv3-failed-to-load-xp-shop").innerHTML = ` -
-

${getTextString("MODAL_V3_TAB_XP_SHOP_ERROR_2")}

-

${data.error}, ${data.message}

-
-
- `; - } else { - atMeUsercache = data; - } - - } catch (error) { - console.error(error) - } - } - - if (!myClaimablesClaimedCache) { - try { - - const userInfo = await fetch(api + CLAIMABLES_CLAIMED, { - headers: { Authorization: `${shop_archives_token}` } - }); - - if (!userInfo.ok) { - document.getElementById("modalv3-failed-to-load-xp-shop").innerHTML = ` -
-

${getTextString("MODAL_V3_TAB_XP_SHOP_ERROR_2")}

-
-
- `; - } - - const claimablesClaimed = await userInfo.json(); - - if (claimablesClaimed.message) { - document.getElementById("modalv3-failed-to-load-xp-shop").innerHTML = ` -
-

${getTextString("MODAL_V3_TAB_XP_SHOP_ERROR_2")}

-

${claimablesClaimed.error}, ${claimablesClaimed.message}

-
-
- `; - } else { - myClaimablesClaimedCache = claimablesClaimed; - } - - } catch (error) { - console.error(error) - } - } - - if (!claimablesShopcache) { - - url = api + CLAIMABLES_SHOP; - fetchUrl = new URL(url); - if (localStorage.staff_unpublished_xp_shop == "true") { - fetchUrl.searchParams.append("include-unpublished", "true"); - } - - fetch(fetchUrl, { - method: "GET", - headers: { - "Authorization": shop_archives_token - } - }) - .then(response => response.json()) - .then(data => { - if (data.message) { - document.getElementById("modalv3-failed-to-load-xp-shop").innerHTML = ` -
-

${getTextString("MODAL_V3_TAB_XP_SHOP_ERROR_2")}

-

${data.error}, ${data.message}

-
-
- `; - } else { - claimablesShopcache = data; - renderXPShop(data); - } - }) - .catch(error => { - console.error(error); - document.getElementById("modalv3-failed-to-load-xp-shop").innerHTML = ` -
-

${getTextString("MODAL_V3_TAB_XP_SHOP_ERROR_2")}

-

${error}

-
-
- `; - }); - } else { - renderXPShop(claimablesShopcache) - } - - if (!myXPBalancecache) { - fetch(api + XP_BALANCE, { - method: "GET", - headers: { - "Authorization": shop_archives_token - } - }) - .then(response => response.json()) - .then(data => { - if (data.message) { - document.getElementById("modalv3-failed-to-load-xp-balance").innerHTML = ` -
-

${getTextString("MODAL_V3_TAB_XP_SHOP_ERROR_3")}

-

${data.error}, ${data.message}

-
-
- `; - } else { - myXPBalancecache = data; - rendermyXPBalanceShop(data); - } - }) - .catch(error => { - console.error(error); - document.getElementById("modalv3-failed-to-load-xp-balance").innerHTML = ` -
-

${getTextString("MODAL_V3_TAB_XP_SHOP_ERROR_3")}

-

-

-
- `; - }); - } else { - rendermyXPBalanceShop(myXPBalancecache) - } - - function renderXPShop(data) { - document.getElementById("modalv3-xp-perks-featured-output").innerHTML = ``; - document.getElementById("modalv3-xp-perks-shop-output").innerHTML = ``; - - data.featured.forEach(featured => { - let featuredCard = document.createElement("div"); - - featuredCard.classList.add("xp-card-featured"); - - let itemPrice = `${featured.price.toLocaleString()} XP`; - - let alreadyClaimed = false; - - let nonoClaim = false; - - if (myClaimablesClaimedCache != null) { - myClaimablesClaimedCache.forEach(claimed => { - if (claimed.id === featured.id) { - itemPrice = "Already Claimed" - alreadyClaimed = true; - } - }); - } - - featuredCard.innerHTML = ` -

${featured.name}

-

${featured.summary}

-
-
-

${itemPrice}

- `; - - const today = new Date(); - const year = today.getFullYear(); - const month = String(today.getMonth() + 1).padStart(2, '0'); // Months are 0-indexed - const day = String(today.getDate()).padStart(2, '0'); - let formattedDate = `${day}/${month}/${year}` - - if (localStorage.reviews_time_type === "us") { - formattedDate = `${month}/${day}/${year}` - } - - if (featured.id === "2" && atMeUsercache.primary_guild) { - - featuredCard.querySelector("[data-possible-review-preview]").innerHTML = ` -
-
-
- - -

${atMeUsercache.global_name ? atMeUsercache.global_name : atMeUsercache.username}

-
- -

${atMeUsercache.primary_guild.tag}

-
-
- -
-

${formattedDate}

-
-

${featured.preview_text}

-
-
- `; - - } else if (featured.id === "2" && !atMeUsercache.primary_guild) { - - let featuredCardBlock = document.createElement("div"); - - featuredCardBlock.classList.add("xp-card-featured-block"); - - featuredCardBlock.innerHTML = ` -
-

${getTextString("MODAL_V3_TAB_XP_SHOP_CANT_CLAIM_1")}

-

${getTextString("MODAL_V3_TAB_XP_SHOP_CANT_CLAIM_2")}

- Learn More -
- `; - - featuredCard.appendChild(featuredCardBlock); - - nonoClaim = true; - - } else if (featured.id === "3") { - - featuredCard.querySelector("[data-possible-review-preview]").innerHTML = ` -
-
-
- -

${atMeUsercache.global_name ? atMeUsercache.global_name : atMeUsercache.username}

-
- -
-

${formattedDate}

-
-

${featured.preview_text}

-
-
- `; - - } else if (featured.id === "5" && atMeUsercache.avatar_decoration_data) { - - featuredCard.querySelector("[data-possible-review-preview]").innerHTML = ` -
-
-
- - -

${atMeUsercache.global_name ? atMeUsercache.global_name : atMeUsercache.username}

-
- -
-

${formattedDate}

-
-

${featured.preview_text}

-
-
- `; - } else if (featured.id === "5" && !atMeUsercache.avatar_decoration_data) { - - let featuredCardBlock = document.createElement("div"); - - featuredCardBlock.classList.add("xp-card-featured-block"); - - featuredCardBlock.innerHTML = ` -
-

${getTextString("MODAL_V3_TAB_XP_SHOP_CANT_CLAIM_1")}

-

${getTextString("MODAL_V3_TAB_XP_SHOP_CANT_CLAIM_2")}

- Learn More -
- `; - - featuredCard.appendChild(featuredCardBlock); - - nonoClaim = true; - - } - - if (alreadyClaimed === false && nonoClaim === false) { - featuredCard.addEventListener('click', () => { - openClaimablesPurchaseModal(featured.id) - }); - featuredCard.classList.add("clickable"); - } - - document.getElementById("modalv3-xp-perks-featured-output").appendChild(featuredCard); - - }); - - data.shop.forEach(claimable => { - let shopCard = document.createElement("div"); - - shopCard.classList.add("xp-card-shop"); - - let itemPrice = `${claimable.price.toLocaleString()} XP`; - - let alreadyClaimed = false; - - if (myClaimablesClaimedCache != null) { - myClaimablesClaimedCache.forEach(claimed => { - if (claimed.id === claimable.id) { - itemPrice = "Already Claimed" - alreadyClaimed = true; - } - }); - } - - if (itemPrice != "Already Claimed") { - shopCard.classList.add("clickable"); - } - - if (alreadyClaimed === false) { - shopCard.addEventListener('click', () => { - openClaimablesPurchaseModal(claimable.id) - }); - } - - shopCard.innerHTML = ` -

${claimable.name}

-

${claimable.summary}

-

${itemPrice}

- `; - - document.getElementById("modalv3-xp-perks-shop-output").appendChild(shopCard); - - }); - - document.getElementById("modalv3-xp-perks-featured-output").style.display = `grid`; - document.getElementById("modalv3-xp-perks-shop-output").style.display = `grid`; - document.getElementById("modalv3-xp-perks-loading").style.display = `none`; - } - - window.renderXPShop = renderXPShop; - - function rendermyXPBalanceShop(data) { - document.getElementById("modalv3-xp-balance-text").textContent = ` ${data.xp_balance.toLocaleString()} `; - } - - } else if (tab === "xp_inventory") { - document.getElementById("modal-v3-tab-" + tab).classList.add("side-tabs-button-selected"); - tabPageOutput.innerHTML = ` - -
-
- -

${getTextString("MODAL_V3_TAB_XP_INVENTORY_HEADER")}

- -
-
- -
-
- -
-

${getTextString("MODAL_V3_TAB_XP_INVENTORY_CLAIMS_HEADER")}

-

${getTextString("MODAL_V3_TAB_XP_INVENTORY_CLAIMS_SUMMARY")}

- -
- -
-
-

Loading Inventory...

-

Your inventory is currently being loaded, please wait...

-
-
- - -
-
-
-

${getTextString("MODAL_V3_TAB_XP_INVENTORY_REWARDS_HEADER")}

-

${getTextString("MODAL_V3_TAB_XP_INVENTORY_REWARDS_SUMMARY")}

- -
- - -
- `; - - if (localStorage.experiment_2025_05_redeem_gift_codes === "Treatment 1: Enabled") { - document.getElementById("modalv3-xp-inventory-redeem-gift").innerHTML = ` -
-

${getTextString("MODAL_V3_TAB_XP_INVENTORY_REDEEM_HEADER")}

-

${getTextString("MODAL_V3_TAB_XP_INVENTORY_REDEEM_SUMMARY")}

- -
- - -
-

-
-
- `; - - document.getElementById("xp-inventory-claim-code-button").addEventListener("click", function () { - document.getElementById("xp-inventory-claim-code-loading").classList.remove("invalid"); - document.getElementById("xp-inventory-claim-code-loading").textContent = ''; - document.getElementById("xp-inventory-claim-code-button").disabled = true; - document.getElementById("xp-inventory-claim-code-button").textContent = '...'; - redeemXPGiftCode(document.getElementById("xp-inventory-claim-code-input").value); - }); - } - - if (localStorage.dismissible_XPnotice != "Treatment 1: Seen") { - document.getElementById("modalv3-xp-notice-container").innerHTML = ` -
- -

${getTextString("MODAL_V3_XP_NOTICE_1")}

-

${getTextString("MODAL_V3_XP_NOTICE_2")}

-
- `; - } - - if (!myClaimablesClaimedCache) { - try { - - const userInfo = await fetch(api + CLAIMABLES_CLAIMED, { - headers: { Authorization: `${shop_archives_token}` } - }); - - if (!userInfo.ok) { - document.getElementById("modalv3-failed-to-load-xp-inventory").innerHTML = ` -
-

${getTextString("MODAL_V3_TAB_XP_INVENTORY_ERROR_1")}

-
-
- `; - } - - const data = await userInfo.json(); - - if (data.message) { - document.getElementById("modalv3-failed-to-load-xp-inventory").innerHTML = ` -
-

${getTextString("MODAL_V3_TAB_XP_INVENTORY_ERROR_1")}

-

${data.error}, ${data.message}

-
-
- `; - } else { - myClaimablesClaimedCache = data; - } - - } catch (error) { - console.error(error) - } - } - - function fetchXpInventory() { - document.getElementById("modalv3-xp-inventory-output").innerHTML = ``; - if (Array.isArray(myClaimablesClaimedCache)) { - - myClaimablesClaimedCache.sort((a, b) => new Date(b.claim_date) - new Date(a.claim_date)); - - myClaimablesClaimedCache.forEach(claimable => { - - let formatted = null; - - if (localStorage.reviews_time_type === "uk") { - const date = new Date(claimable.claim_date); - - const day = String(date.getDate()).padStart(2, '0'); - const month = String(date.getMonth() + 1).padStart(2, '0'); // getMonth is 0-indexed - const year = date.getFullYear(); - - formatted = `${day}/${month}/${year}`; - } else { - const date = new Date(claimable.claim_date); - - const day = String(date.getDate()).padStart(2, '0'); - const month = String(date.getMonth() + 1).padStart(2, '0'); // getMonth is 0-indexed - const year = date.getFullYear(); - - formatted = `${day}/${month}/${year}`; - } - - if (claimable.type === 1) { - - let promoBanner = document.createElement("div"); - - promoBanner.classList.add("xp-inventory-card"); - - promoBanner.innerHTML = ` -
-
-

${claimable.name}

-

You claimed this item on ${formatted}.

-

-${claimable.price.toLocaleString()} XP

-
- `; - - if (claimable.refunded === true) { - promoBanner.querySelector("[data-xp-inventory-tag-refund-text]").innerHTML = ` -

${getTextString("MODAL_V3_TAB_XP_INVENTORY_TAG_REFUNDED")}

- `; - promoBanner.querySelector("[data-xp-inventory-price]").classList.remove("remove"); - promoBanner.querySelector("[data-xp-inventory-price]").classList.add("normal"); - } - - document.getElementById("modalv3-xp-inventory-output").appendChild(promoBanner); - } else if (claimable.type === 0) { - - let promoBanner = document.createElement("div"); - - promoBanner.classList.add("xp-inventory-card"); - - promoBanner.innerHTML = ` -
-
-

${claimable.name}

-

You claimed this reward on ${formatted}.

-

+${claimable.price.toLocaleString()} XP

-
- `; - - if (claimable.refunded === true) { - promoBanner.querySelector("[data-xp-inventory-tag-revoke-text]").innerHTML = ` -

${getTextString("MODAL_V3_TAB_XP_INVENTORY_TAG_REVOKED")}

- `; - promoBanner.querySelector("[data-xp-inventory-price]").classList.remove("add"); - promoBanner.querySelector("[data-xp-inventory-price]").classList.add("normal"); - } - - document.getElementById("modalv3-xp-inventory-output2").appendChild(promoBanner); - } - }); - - document.getElementById("modalv3-xp-inventory-output").style.display = 'grid'; - document.getElementById("modalv3-xp-inventory-output2").style.display = 'grid'; - document.getElementById("modalv3-xp-inventory-loading").style.display = 'none'; - } - if (!myClaimablesClaimedCache.find(item => item.type === 0)) { - document.getElementById("modalv3-xp-inventory-output2").innerHTML = ` -
-
-

No Claimed Rewards.

-

You don't have any claimed rewards.

-
-
- `; - } - if (!myClaimablesClaimedCache.find(item => item.type === 1)) { - document.getElementById("modalv3-xp-inventory-output").innerHTML = ` -
-
-

No Claimed Items.

-

You don't have any claimed items.

-
-
- `; - } - } - - window.fetchXpInventory = fetchXpInventory; - - fetchXpInventory(); - } else if (tab === "experiments") { - document.getElementById("modal-v3-tab-" + tab).classList.add("side-tabs-button-selected"); - tabPageOutput.innerHTML = ` -

${getTextString("MODAL_V3_TAB_EXPERIMENTS_HEADER")}

- -
-

${getTextString("MODAL_V3_TAB_EXPERIMENTS_DISABLE_FORCE_ROLLOUT_HEADER")}

-

${getTextString("MODAL_V3_TAB_EXPERIMENTS_DISABLE_FORCE_ROLLOUT_SUMMARY")}

- - -
- -
-
- `; - - if (localStorage.experiment_force_rollout === "false") { - document.getElementById("experiments-force-rollout-checkbox").checked = true; - } - - experimentsList.forEach(({ title, id, name, treatments, rollout, needs_api_token, not_needed }) => { - if (not_needed != "true") { - try { - - let hrel = document.createElement("hr"); - - document.getElementById("modalv3-experiment-output").appendChild(hrel); - - let experimentCard = document.createElement("div"); - - experimentCard.classList.add('modalv3-experiment-container'); - experimentCard.innerHTML = ` -

${title}

-

${id}

-

${getTextString("MODAL_V3_TAB_EXPERIMENTS_ROLLOUT")}${rollout}

-
- - -
- `; - - if (needs_api_token === "true") { - let apiNotice = document.createElement("p"); - - apiNotice.classList.add('modalv3-experiment-api-notice'); - apiNotice.textContent = getTextString("MODAL_V3_TAB_EXPERIMENTS_API_WARNING"); - - experimentCard.appendChild(apiNotice); - } - - - document.getElementById("modalv3-experiment-output").appendChild(experimentCard); - - const treatmentPicker = document.getElementById(`${name}_treatment_container`); - - if (!treatmentPicker) return; // Skip if element doesn't exist - - populateExperimentOptions(treatmentPicker, treatments); - - const storedTreatment = localStorage.getItem(name); - if (storedTreatment) { - treatmentPicker.value = storedTreatment; - } - - treatmentPicker.addEventListener("change", () => { - localStorage.setItem(name, treatmentPicker.value); - }); - - } catch (error) { - console.error(`Error setting up experiment: ${name}`, error); - } - } - }); - - function populateExperimentOptions(selectElement, treatments) { - treatments.forEach((treatment) => { - const optElement = document.createElement("option"); - optElement.value = treatment; - optElement.textContent = treatment; - selectElement.appendChild(optElement); - }); - } - } else if (tab === "dismissible_content") { - document.getElementById("modal-v3-tab-" + tab).classList.add("side-tabs-button-selected"); - tabPageOutput.innerHTML = ` -

${getTextString("MODAL_V3_TAB_DISMISSIBLE_CONTENT_HEADER")}

- -
-
- `; - - dismissibleContentList.forEach(({ title, id, name, treatments, needs_api_token }) => { - try { - - let hrel = document.createElement("hr"); - - document.getElementById("modalv3-dismissible-content-output").appendChild(hrel); - - let experimentCard = document.createElement("div"); - - experimentCard.classList.add('modalv3-experiment-container'); - experimentCard.innerHTML = ` -

${title}

-

${id}

-
- -
- `; - - - document.getElementById("modalv3-dismissible-content-output").appendChild(experimentCard); - - const treatmentPicker = document.getElementById(`${name}_treatment_container`); - - if (!treatmentPicker) return; // Skip if element doesn't exist - - populateDismissibleContentOptions(treatmentPicker, treatments); - - const storedTreatment = localStorage.getItem(name); - if (storedTreatment) { - treatmentPicker.value = storedTreatment; - } - - treatmentPicker.addEventListener("change", () => { - localStorage.setItem(name, treatmentPicker.value); - }); - - } catch (error) { - console.error(`Error setting up experiment: ${name}`, error); - } - }); - - function populateDismissibleContentOptions(selectElement, treatments) { - treatments.forEach((treatment) => { - const optElement = document.createElement("option"); - optElement.value = treatment; - optElement.textContent = treatment; - selectElement.appendChild(optElement); - }); - } - } else if (tab === "api_test_fetch") { - document.getElementById("modal-v3-tab-" + tab).classList.add("side-tabs-button-selected"); - tabPageOutput.innerHTML = ` -

${getTextString("MODAL_V3_TAB_API_TEST_FETCH_HEADER")}

-
-

${getTextString("MODAL_V3_TAB_API_TESTING_API_STATUS_HEADER")}

-

${getTextString("MODAL_V3_TAB_API_TESTING_API_STATUS_SUMMARY")}

- -
-
-
-
-
-

${getTextString("MODAL_V3_TAB_API_TESTING_TEST_FETCH_HEADER")}

-

${getTextString("MODAL_V3_TAB_API_TESTING_TEST_FETCH_SUMMARY")}

- -
-

${getTextString("MODAL_V3_TAB_API_TESTING_TEST_FETCH_BASE_URL")}

- -
- -
-

${getTextString("MODAL_V3_TAB_API_TESTING_TEST_FETCH_API_VERSION")}

- -
- -
-

${getTextString("MODAL_V3_TAB_API_TESTING_TEST_FETCH_ENDPOINT")}

- -
- -
-

${getTextString("MODAL_V3_TAB_API_TESTING_TEST_FETCH_PARAMS")}

- - - -
- -
-
- - -

?is-test-fetch=true

-
-
- - - - - -
- `; - - fetch(api + APISTATUS, { - method: "GET", - headers: { - "Password": api_password, - "Authorization": discord_token, - "Token": api_token - } - }) - .then(response => response.json()) - .then(data => { - if (data.message && data.message === "Missing Access") { - document.getElementById("modalv3-api-status-container").innerHTML = ` -
-

Shop

- -

Missing Access

-
-
-

Discord Auth

- -

Missing Access

-
-
-

Database

- -

Missing Access

-
- `; - } else { - data.forEach(apistatus => { - let statuscard = document.createElement("div"); - - statuscard.classList.add("modalv3-api-status-card"); - - if (apistatus.status === "Operational") { - statuscard.innerHTML = ` -

${apistatus.name}

- -

${apistatus.status}

- `; - } else if (apistatus.status === "Down") { - statuscard.innerHTML = ` -

${apistatus.name}

- -

${apistatus.status}

- `; - } - - document.getElementById("modalv3-api-status-container").appendChild(statuscard); - - }); - } - }) - .catch(error => { - document.getElementById("modalv3-api-status-container").innerHTML = ` -
-

Shop

- -

Down

-
-
-

Discord Auth

- -

Down

-
-
-

Database

- -

Down

-
- `; - }); - } else if (tab === "claimables_purchase") { - document.getElementById("modal-v3-tab-" + tab).classList.add("side-tabs-button-selected"); - tabPageOutput.innerHTML = ` -

${getTextString("MODAL_V3_TAB_CLAIMABLES_PURCHASE_HEADER")}

-
-

${getTextString("MODAL_V3_TAB_CLAIMABLES_PURCHASE_TITLE_HEADER")}

-

${getTextString("MODAL_V3_TAB_CLAIMABLES_PURCHASE_TITLE_SUMMARY")}

- -
-

${getTextString("MODAL_V3_TAB_CLAIMABLES_PURCHASE_OPEN_MODAL_TITLE")}

- -
- - -
-
-
-

${getTextString("MODAL_V3_TAB_CLAIMABLES_REWARD_CLAIM_TITLE_HEADER")}

-

${getTextString("MODAL_V3_TAB_CLAIMABLES_REWARD_CLAIM_TITLE_SUMMARY")}

- -
-

${getTextString("MODAL_V3_TAB_CLAIMABLES_REWARD_CLAIM_OPEN_MODAL_TITLE")}

- -
- - -
- `; - document.getElementById("modalv3-claimable-id-button").addEventListener("click", function () { - openClaimablesPurchaseModal(document.getElementById("modalv3-claimable-id-test").value); - }); - document.getElementById("modalv3-claimable-reward-id-button").addEventListener("click", function () { - openClaimablesRewardClaimModal(document.getElementById("modalv3-claimable-reward-id-test").value); - }); - } else if (tab === "local_storage") { - document.getElementById("modal-v3-tab-" + tab).classList.add("side-tabs-button-selected"); - tabPageOutput.innerHTML = ` -

${getTextString("MODAL_V3_TAB_LOCAL_STORAGE_HEADER")}

-
-

${getTextString("MODAL_V3_TAB_STORAGE_LOCAL_STORAGE_HEADER")}

-

${getTextString("MODAL_V3_TAB_STORAGE_LOCAL_STORAGE_SUMMARY")}

- -
- - - -
-
-
-
-
-

${getTextString("MODAL_V3_TAB_STORAGE_SESSION_STORAGE_HEADER")}

-

${getTextString("MODAL_V3_TAB_STORAGE_SESSION_STORAGE_SUMMARY")}

- -
- - - -
-
-
- `; - - modalv3RefreshLocalStorageList() - modalv3RefreshSessionStorageList() - } else if (tab === "misc") { - document.getElementById("modal-v3-tab-" + tab).classList.add("side-tabs-button-selected"); - tabPageOutput.innerHTML = ` -

${getTextString("MODAL_V3_TAB_MISC_HEADER")}

-
-

${getTextString("MODAL_V3_TAB_MISC_REVIEW_CONTENT_OVERRIDE_HEADER")}

-

${getTextString("MODAL_V3_TAB_MISC_REVIEW_CONTENT_OVERRIDE_SUMMARY")}

- - -
-
- -
-
-
-

${getTextString("MODAL_V3_TAB_MISC_UNPUBLISHED_XP_EVENTS_HEADER")}

-

${getTextString("MODAL_V3_TAB_MISC_UNPUBLISHED_XP_EVENTS_SUMMARY")}

- - -
-
-
-

${getTextString("MODAL_V3_TAB_MISC_UNPUBLISHED_XP_SHOP_HEADER")}

-

${getTextString("MODAL_V3_TAB_MISC_UNPUBLISHED_XP_SHOP_SUMMARY")}

- - -
- `; - - if (localStorage.staff_enable_override_review_content === "true") { - document.getElementById("override-review-text-content-checkbox").checked = true; - } - if (localStorage.staff_unpublished_xp_events === "true") { - document.getElementById("unpublished-xp-events-checkbox").checked = true; - } - if (localStorage.staff_unpublished_xp_shop === "true") { - document.getElementById("unpublished-xp-shop-checkbox").checked = true; - } - } else { - console.error(tab + ' is not a valid tab'); - } - } - - window.setModalv3InnerContent = setModalv3InnerContent; - - - // Misc Staff - - function toggleStaffUnpublishedXPEvents() { - if (localStorage.staff_unpublished_xp_events === "true") { - localStorage.staff_unpublished_xp_events = "false" - } else { - localStorage.staff_unpublished_xp_events = "true" - } - } - - function toggleStaffUnpublishedXPShop() { - if (localStorage.staff_unpublished_xp_shop === "true") { - localStorage.staff_unpublished_xp_shop = "false" - } else { - localStorage.staff_unpublished_xp_shop = "true" - } - } - - - - - async function redeemXPGiftCode(giftCode) { - if (giftCode.length != 0) { - try { - - const userInfo = await fetch(api + REDEEM_GIFT_CODE + giftCode, { - headers: { Authorization: `${shop_archives_token}` } - }); - - if (!userInfo.ok) { - document.getElementById("xp-inventory-claim-code-loading").classList.add("invalid"); - document.getElementById("xp-inventory-claim-code-loading").textContent = 'Invalid Code'; - document.getElementById("xp-inventory-claim-code-button").disabled = false; - document.getElementById("xp-inventory-claim-code-button").textContent = 'Redeem'; - } - - const data = await userInfo.json(); - - if (data.message === "Invalid Gift Code.") { - document.getElementById("xp-inventory-claim-code-loading").classList.add("invalid"); - document.getElementById("xp-inventory-claim-code-loading").textContent = `Invalid Gift Code.`; - document.getElementById("xp-inventory-claim-code-button").disabled = false; - document.getElementById("xp-inventory-claim-code-button").textContent = 'Redeem'; - } else if (data.message) { - document.getElementById("xp-inventory-claim-code-loading").classList.add("invalid"); - document.getElementById("xp-inventory-claim-code-loading").textContent = `${data.error}, ${data.message}`; - document.getElementById("xp-inventory-claim-code-button").disabled = false; - document.getElementById("xp-inventory-claim-code-button").textContent = 'Redeem'; - } else { - if (data.type === 0) { - openClaimablesRewardClaimModal(data.id, data, giftCode) - } else if (data.type === 1) { - openClaimablesPurchaseModal(data.id, data, giftCode) - } - - document.getElementById("xp-inventory-claim-code-loading").textContent = ``; - document.getElementById("xp-inventory-claim-code-input").value = ``; - document.getElementById("xp-inventory-claim-code-button").disabled = false; - document.getElementById("xp-inventory-claim-code-button").textContent = 'Redeem'; - } - - } catch (error) { - console.error(error) - } - } else { - document.getElementById("xp-inventory-claim-code-loading").classList.add("invalid"); - document.getElementById("xp-inventory-claim-code-loading").textContent = `Invalid Gift Code.`; - document.getElementById("xp-inventory-claim-code-button").disabled = false; - document.getElementById("xp-inventory-claim-code-button").textContent = 'Redeem'; - } - } - - - - async function openClaimablesPurchaseModal(claimableId, existingClaimableData, giftCode) { - - let disclaimerString = ''; - - if (claimableId === "2" || claimableId === 2) { - disclaimerString = getTextString("MODAL_V3_TAB_XP_SHOP_CLAIM_MODAL_2"); - } else if (claimableId === "3" || claimableId === 3) { - disclaimerString = getTextString("MODAL_V3_TAB_XP_SHOP_CLAIM_MODAL_3"); - } else if (claimableId === "4" || claimableId === 4) { - disclaimerString = getTextString("MODAL_V3_TAB_XP_SHOP_CLAIM_MODAL_4"); - } else if (claimableId === "5" || claimableId === 5) { - disclaimerString = getTextString("MODAL_V3_TAB_XP_SHOP_CLAIM_MODAL_5"); - } - - if (!claimableId) { - claimableId = null; - } - - let modal = document.createElement("div"); - - modal.classList.add('modalv2'); - - modal.style.zIndex = '601'; - - modal.innerHTML = ` -
-
-
- -
-
- -
-
-

${getTextString("MODAL_V3_TAB_XP_SHOP_CLAIM_MODAL_HEADER")}

-
-

Dummy_Text

-

Loading...

-

-
-
-

You have ... XP

-
- -

${getTextString("MODAL_V3_TAB_XP_SHOP_CLAIM_MODAL_1")}

-

${disclaimerString}

- -
-

- -
-
- `; - - if (!myXPBalancecache) { - try { - - const userInfo = await fetch(api + XP_BALANCE, { - headers: { Authorization: `${shop_archives_token}` } - }); - - if (!userInfo.ok) { - - } - - const xpBalance = await userInfo.json(); - - if (xpBalance.message) { - - } else { - myXPBalancecache = xpBalance; - rendermyXPBalanceModal(xpBalance); - } - - } catch (error) { - console.error(error) - } - } else { - rendermyXPBalanceModal(myXPBalancecache) - } - - function rendermyXPBalanceModal(data) { - modal.querySelector("[data-claimable-purchase-your-xp]").textContent = `You have ${data.xp_balance.toLocaleString()} XP`; - } - - if (existingClaimableData) { - renderModalContent(existingClaimableData); - } else { - fetch(api + '/claimables/published/' + claimableId, { - method: "GET", - headers: { - "Authorization": shop_archives_token - } - }) - .then(response => response.json()) - .then(data => { - if (data.message) { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - } else { - renderModalContent(data); - } - }) - .catch(error => { - console.error(error); - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - }); - } - - function renderModalContent(data) { - modal.querySelector("[data-claimable-purchase-modal-name-preview]").textContent = data.name; - modal.querySelector("[data-claimable-purchase-modal-price-preview]").textContent = data.xp_price.toLocaleString() + ' XP'; - modal.querySelector("[data-claimable-purchase-button]").textContent = `Claim for ${data.xp_price.toLocaleString()} XP`; - modal.querySelector("[data-claimable-purchase-button]").style.display = 'unset'; - - if (myXPBalancecache.xp_balance < data.xp_price) { - modal.querySelector("[data-claimable-purchase-button]").disabled = true; - modal.querySelector("[data-shop-claim-item-modal-error-output]").textContent = getTextString("MODAL_V3_TAB_XP_SHOP_CLAIM_MODAL_NOT_ENOUGH_ERROR"); - } - modal.querySelector("[data-claimable-purchase-button]").addEventListener('click', () => { - modal.querySelector("[data-claimable-purchase-button]").disabled = true; - modal.querySelector("[data-claimable-purchase-button]").textContent = `...`; - claimPerkWithXP(data.id, modal, modal_back, giftCode) - }); - } - - document.body.appendChild(modal); - - setTimeout(() => { - modal.classList.add('show'); - }, 1); - - let modal_back = document.createElement("div"); - - modal_back.classList.add('modalv2-back'); - modal_back.id = 'modalv2-back'; - - modal_back.style.zIndex = '600'; - - document.body.appendChild(modal_back); - - setTimeout(() => { - modal_back.classList.add('show'); - }, 1); - - modal.addEventListener('click', (event) => { - if (event.target === modal) { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - } - }); - - modal.querySelector("[data-close-product-card-button]").addEventListener('click', () => { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - }); - } - - async function claimPerkWithXP(perkId, modal, modal_back, giftCode) { - document.getElementById("shop-claim-item-modal-error-output").textContent = ''; - - if (!giftCode) { - giftCode = null; - } - - try { - - const userInfo = await fetch(api + '/claimables/purchase/' + perkId, { - method: "POST", - headers: { - Authorization: `${shop_archives_token}`, - 'Content-Type': 'application/json' - }, - body: JSON.stringify({ - giftCode - }) - }); - - if (!userInfo.ok) { - - } - - const purchase = await userInfo.json(); - - if (purchase.message) { - document.getElementById("shop-claim-item-modal-error-output").textContent = purchase.message; - } else { - await updateXPBalance(); - await updateClaimablesClaimed(); - await updatePerksShop(); - - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - } - - } catch (error) { - console.error(error) - document.getElementById("shop-claim-item-modal-error-output").textContent = error; - } - } - - - async function openClaimablesRewardClaimModal(claimableId, existingClaimableData, giftCode) { - - if (!claimableId) { - claimableId = null; - } - - let modal = document.createElement("div"); - - modal.classList.add('modalv2'); - - modal.style.zIndex = '601'; - - modal.innerHTML = ` -
-
-
- -
-
- -
-
-

... XP

-

${getTextString("MODAL_V3_TAB_XP_SHOP_CLAIM_REWARD_MODAL_HEADER")}

-

${getTextString("MODAL_V3_TAB_XP_SHOP_CLAIM_REWARD_MODAL_SUMMARY")} ... XP

- Learn More about XP - -
-

- -
-
- `; - - if (existingClaimableData) { - renderModalContent(existingClaimableData); - } else { - fetch(api + '/claimables/published/' + claimableId, { - method: "GET", - headers: { - "Authorization": shop_archives_token - } - }) - .then(response => response.json()) - .then(data => { - if (data.message) { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - } else { - renderModalContent(data) - } - }) - .catch(error => { - console.error(error); - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - }); - } - - function renderModalContent(data) { - modal.querySelector("[data-claimable-purchase-modal-price-preview]").textContent = getTextString("MODAL_V3_TAB_XP_SHOP_CLAIM_REWARD_MODAL_SUMMARY") + data.xp_reward.toLocaleString() + ' XP'; - modal.querySelector("[data-claimable-purchase-modal-price-preview2]").textContent = data.xp_reward.toLocaleString() + ' XP'; - modal.querySelector("[data-claimable-purchase-button]").textContent = `Claim ${data.xp_reward.toLocaleString()} XP`; - modal.querySelector("[data-claimable-purchase-button]").style.display = 'unset'; - - modal.querySelector("[data-claimable-purchase-button]").addEventListener('click', () => { - modal.querySelector("[data-claimable-purchase-button]").disabled = true; - modal.querySelector("[data-claimable-purchase-button]").textContent = `...`; - claimFreeXPReward(data.id, modal, modal_back, giftCode) - }); - } - - document.body.appendChild(modal); - - setTimeout(() => { - modal.classList.add('show'); - }, 1); - - let modal_back = document.createElement("div"); - - modal_back.classList.add('modalv2-back'); - modal_back.id = 'modalv2-back'; - - modal_back.style.zIndex = '600'; - - document.body.appendChild(modal_back); - - setTimeout(() => { - modal_back.classList.add('show'); - }, 1); - - modal.addEventListener('click', (event) => { - if (event.target === modal) { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - } - }); - - modal.querySelector("[data-close-product-card-button]").addEventListener('click', () => { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - }); - } - - window.openClaimablesRewardClaimModal = openClaimablesRewardClaimModal; - - async function claimFreeXPReward(perkId, modal, modal_back, giftCode) { - document.getElementById("shop-claim-item-modal-error-output").textContent = ''; - - if (!giftCode) { - giftCode = null; - } - - try { - - const userInfo = await fetch(api + '/claim-free-xp-reward/' + perkId, { - method: "POST", - headers: { - Authorization: `${shop_archives_token}`, - 'Content-Type': 'application/json' - }, - body: JSON.stringify({ - giftCode - }) - }); - - if (!userInfo.ok) { - - } - - const purchase = await userInfo.json(); - - if (purchase.message) { - document.getElementById("shop-claim-item-modal-error-output").textContent = purchase.message; - } else { - await updateXPBalance(); - await updateClaimablesClaimed(); - await updatePerksShop(); - await updateClaimablesPromotions(); - - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - } - - } catch (error) { - console.error(error) - document.getElementById("shop-claim-item-modal-error-output").textContent = error; - } - } - - - async function updateXPBalance() { - try { - - const userInfo = await fetch(api + XP_BALANCE, { - headers: { Authorization: `${shop_archives_token}` } - }); - - if (!userInfo.ok) { - } - - const data = await userInfo.json(); - - if (data.message) { - - } else { - myXPBalancecache = data; - if (document.getElementById("modalv3-xp-balance-text")) { - document.getElementById("modalv3-xp-balance-text").textContent = data.xp_balance.toLocaleString(); - } - } - - } catch (error) { - console.error(error) - } - } - - async function updatePerksShop() { - try { - - url = api + CLAIMABLES_SHOP; - fetchUrl = new URL(url); - if (localStorage.staff_unpublished_xp_shop == "true") { - fetchUrl.searchParams.append("include-unpublished", "true"); - } - - const userInfo = await fetch(fetchUrl, { - headers: { Authorization: `${shop_archives_token}` } - }); - - if (!userInfo.ok) { - } - - const data = await userInfo.json(); - - if (data.message) { - - } else { - claimablesShopcache = data; - try { - renderXPShop(data); - } catch (error) { - } - } - - } catch (error) { - console.error(error) - } - } - - async function updateClaimablesClaimed() { - try { - - const userInfo = await fetch(api + CLAIMABLES_CLAIMED, { - headers: { Authorization: `${shop_archives_token}` } - }); - - if (!userInfo.ok) { - } - - const data = await userInfo.json(); - - if (data.message) { - - } else { - myClaimablesClaimedCache = data; - try { - fetchXpInventory(); - } catch (error) { - } - } - - } catch (error) { - console.error(error) - } - } - - async function updateClaimablesPromotions() { - try { - - url = api + CLAIMABLES_PROMOTIONS; - fetchUrl = new URL(url); - if (localStorage.staff_unpublished_xp_events == "true") { - fetchUrl.searchParams.append("include-unpublished", "true"); - } - - const userInfo = await fetch(fetchUrl, { - headers: { Authorization: `${shop_archives_token}` } - }); - - if (!userInfo.ok) { - } - - const data = await userInfo.json(); - - if (data.message) { - - } else { - claimablesPromotionsCache = data; - try { - fillCategoryModalContentContainer('xp_rewards', null, true); - } catch (error) { - } - try { - fetchXpEvents(); - } catch (error) { - } - } - - } catch (error) { - console.error(error) - } - } - - - function updateExtendedStylesCategoryTab(setFilter) { - const el1 = document.getElementById("modalv3-extended-styles-category-tab-1"); - const el2 = document.getElementById("modalv3-extended-styles-category-tab-2"); - const el3 = document.getElementById("modalv3-extended-styles-category-tab-3"); - - if (el1 && el1.classList.contains('selected')) { - el1.classList.remove('selected'); - } else if (el2 && el2.classList.contains('selected')) { - el2.classList.remove('selected'); - } else if (el3 && el3.classList.contains('selected')) { - el3.classList.remove('selected'); - } - - if (setFilter) { - localStorage.ext_sty_category_tab = setFilter; - document.getElementById("modalv3-extended-styles-category-tab-" + setFilter).classList.add('selected'); - } else { - document.getElementById("modalv3-extended-styles-category-tab-" + localStorage.ext_sty_category_tab).classList.add('selected'); - } - } - - function updateReviewsFilterStore(setFilter) { - const el3 = document.getElementById("modalv3-ratio-card-reviews-filter-3"); - const el2 = document.getElementById("modalv3-ratio-card-reviews-filter-2"); - const el1 = document.getElementById("modalv3-ratio-card-reviews-filter-1"); - - if (el3 && el3.classList.contains('modalv3-content-ratio-card-selected')) { - el3.classList.remove('modalv3-content-ratio-card-selected'); - } else if (el2 && el2.classList.contains('modalv3-content-ratio-card-selected')) { - el2.classList.remove('modalv3-content-ratio-card-selected'); - } else if (el1 && el1.classList.contains('modalv3-content-ratio-card-selected')) { - el1.classList.remove('modalv3-content-ratio-card-selected'); - } - - if (setFilter) { - localStorage.reviews_filter_type = setFilter; - document.getElementById("modalv3-ratio-card-reviews-filter-" + setFilter).classList.add('modalv3-content-ratio-card-selected'); - } else { - document.getElementById("modalv3-ratio-card-reviews-filter-" + localStorage.reviews_filter_type).classList.add('modalv3-content-ratio-card-selected'); - } - } - - function updateReviewsTimeFormatStore(setTimeFormat) { - const el2 = document.getElementById("modalv3-ratio-card-reviews-time-us"); - const el1 = document.getElementById("modalv3-ratio-card-reviews-time-uk"); - - if (el2 && el2.classList.contains('modalv3-content-ratio-card-selected')) { - el2.classList.remove('modalv3-content-ratio-card-selected'); - } else if (el1 && el1.classList.contains('modalv3-content-ratio-card-selected')) { - el1.classList.remove('modalv3-content-ratio-card-selected'); - } - - if (setTimeFormat) { - localStorage.reviews_time_type = setTimeFormat; - document.getElementById("modalv3-ratio-card-reviews-time-" + setTimeFormat).classList.add('modalv3-content-ratio-card-selected'); - } else { - document.getElementById("modalv3-ratio-card-reviews-time-" + localStorage.reviews_time_type).classList.add('modalv3-content-ratio-card-selected'); - } - } - - let userReviewsWarnsCache = null; - - async function updateAndCacheReviewsWarnings() { - let warningsRaw = null; - if (userReviewsWarnsCache === null) { - warningsRaw = await fetch(api + REVIEWSAPI + "/users/" + localStorage.discord_user_id + "/warns", { - headers: { Authorization: `${localStorage.discord_token}`, Token: sessionStorage.getItem("api-token") } - }); - - const warnings = await warningsRaw.json(); - - console.log(warnings) - userReviewsWarnsCache = warnings; - } - - if (document.getElementById("modalv3-warnings-warns-output-container")) { - if (Array.isArray(userReviewsWarnsCache) && userReviewsWarnsCache.length === 0) { - - } else { - userReviewsWarnsCache.forEach(warn => { - let warningCard = document.createElement("div"); - - let formatted = null; - - if (localStorage.reviews_time_type === "uk") { - const date = new Date(warn.created_at); - - const day = String(date.getDate()).padStart(2, '0'); - const month = String(date.getMonth() + 1).padStart(2, '0'); // getMonth is 0-indexed - const year = date.getFullYear(); - - formatted = `${day}/${month}/${year}`; - } else { - const date = new Date(warn.created_at); - - const day = String(date.getDate()).padStart(2, '0'); - const month = String(date.getMonth() + 1).padStart(2, '0'); // getMonth is 0-indexed - const year = date.getFullYear(); - - formatted = `${day}/${month}/${year}`; - } - - - warningCard.classList.add('review-element-warning'); - warningCard.style.paddingLeft = '10px'; - warningCard.innerHTML = ` -

Warning!

-

At: ${formatted}

-

Reason: ${warn.message}

- `; - - document.getElementById("modalv3-warnings-warns-output-container").appendChild(warningCard); - }) - } - } - } - - - function modalv3RefreshLocalStorageList() { - const container = document.getElementById('modalv3-localstorage-output'); - container.innerHTML = ''; - - const keys = Object.keys(localStorage).sort(); - - if (keys.length === 0) { - container.innerHTML = '

No items in localStorage.

'; - return; - } - - keys.forEach(key => { - const value = localStorage.getItem(key); - - const div = document.createElement('div'); - div.className = 'modalv3-localstorage-item-card'; - - div.innerHTML = ` - - - - - `; - - container.appendChild(div); - }); - } - - function modalv3AddLocalStorage() { - const key = document.getElementById('modalv3-localstorage-add-input-key').value.trim(); - const value = document.getElementById('modalv3-localstorage-add-input-value').value; - - if (!key) { - alert("Key cannot be empty."); - return; - } - - localStorage.setItem(key, value); - document.getElementById('modalv3-localstorage-add-input-key').value = ''; - document.getElementById('modalv3-localstorage-add-input-value').value = ''; - modalv3RefreshLocalStorageList(); - } - - function modalv3UpdateLocalStorage(key) { - const newValue = document.getElementById(`value-local-${key}`).value; - localStorage.setItem(key, newValue); - modalv3RefreshLocalStorageList(); - } - - function modalv3DeleteLocalStorage(key) { - if (confirm(`Delete key "${key}"?`)) { - localStorage.removeItem(key); - modalv3RefreshLocalStorageList(); - } - } - - - function modalv3RefreshSessionStorageList() { - const container = document.getElementById('modalv3-sessionstorage-output'); - container.innerHTML = ''; - - const keys = Object.keys(sessionStorage).sort(); - - if (keys.length === 0) { - container.innerHTML = '

No items in sessionStorage.

'; - return; - } - - keys.forEach(key => { - const value = sessionStorage.getItem(key); - - const div = document.createElement('div'); - div.className = 'modalv3-localstorage-item-card'; - - div.innerHTML = ` - - - - - `; - - container.appendChild(div); - }); - } - - function modalv3AddSessionStorage() { - const key = document.getElementById('modalv3-sessionstorage-add-input-key').value.trim(); - const value = document.getElementById('modalv3-sessionstorage-add-input-value').value; - - if (!key) { - alert("Key cannot be empty."); - return; - } - - sessionStorage.setItem(key, value); - document.getElementById('modalv3-sessionstorage-add-input-key').value = ''; - document.getElementById('modalv3-sessionstorage-add-input-value').value = ''; - modalv3RefreshSessionStorageList(); - } - - function modalv3UpdateSessionStorage(key) { - const newValue = document.getElementById(`value-session-${key}`).value; - sessionStorage.setItem(key, newValue); - modalv3RefreshSessionStorageList(); - } - - function modalv3DeleteSessionStorage(key) { - if (confirm(`Delete key "${key}"?`)) { - sessionStorage.removeItem(key); - modalv3RefreshSessionStorageList(); - } - } - - - - function adminDeleteReview(reviewId) { - - const accessToken = discord_token; - - fetch(api + REVIEWSAPI, { - method: "DELETE", - headers: { - "Content-Type": "application/json", - "Password": api_password, - "Authorization": discord_token, - "Token": api_token - }, - body: JSON.stringify({ - accessToken, - reviewId - }) - }) - .catch(error => { - console.error(error) - }); - - if (document.getElementById(reviewId + "-review-admin-card")) { - document.getElementById(reviewId + "-review-admin-card").remove(); - } - } - - function modalv3AddTestFetchParam() { - const key = document.getElementById("modalv3-test-fetch-search-params-key").value; - const value = document.getElementById('modalv3-test-fetch-search-params-value').value; - - const container = document.getElementById('modalv3-test-fetch-params-output'); - const div = document.createElement('div'); - div.className = 'modalv3-api-testfetch-param-card'; - div.innerHTML = ` - - -

&${key}=${value}

- - `; - container.appendChild(div); - - document.getElementById('modalv3-test-fetch-search-params-value').value = ''; - } - - function fetchAPITestFetch() { - const baseurl = document.getElementById("modalv3-test-fetch-base-url").value; - const versionid = document.getElementById("modalv3-test-fetch-version").value; - const endpoint = document.getElementById("modalv3-test-fetch-endpoint").value; - const output = document.getElementById("modalv3-test-fetch-output"); - - url = baseurl + "/" + versionid + endpoint; - testFetchURL = new URL(url); - - const keyInputs = document.querySelectorAll('.test-fetch-param-key'); - const valueInputs = document.querySelectorAll('.test-fetch-param-value'); - - const params = new URLSearchParams(); - for (let i = 0; i < keyInputs.length; i++) { - const key = keyInputs[i].value.trim(); - const value = valueInputs[i].value.trim(); - if (key) params.append(key, value); - } - - const finalUrl = `${testFetchURL}?${params.toString()}`; - - fetch(finalUrl, { - method: "GET", - headers: { - "Password": api_password, - "Authorization": discord_token, - "Token": api_token - } - }) - .then(response => response.json()) - .then((data) => { - console.log(data); - output.textContent = JSON.stringify(data, undefined, 4); - }) - .catch(error => { - console.log(`Failed to test fetch: `, error); - }); - } - - function disabledExperimentForceRolloutV2() { - if (localStorage.experiment_force_rollout === "false") { - localStorage.experiment_force_rollout = "true" - } else { - localStorage.experiment_force_rollout = "false" - } - } - - function overrideReviewTextContent() { - if (localStorage.staff_enable_override_review_content === "true") { - localStorage.staff_enable_override_review_content = "false" - } else { - localStorage.staff_enable_override_review_content = "true" - } - } - - function overrideRawReviewTextContent() { - localStorage.staff_raw_review_override_content = document.getElementById("modalv3-update-review-content-override").value; - } - - function updateThemeStore(theme, hasButtons, raw) { - localStorage.sa_theme = theme; - localStorage.removeItem('community_theme_raw'); - if (hasButtons === "true") { - try { - if (document.querySelector(".theme-selection-box-selected")) { - document.querySelectorAll('.theme-selection-box-selected').forEach((el) => { - el.classList.remove("theme-selection-box-selected"); - }); - } - document.body.removeAttribute("class"); - } catch (error) { - } - if (document.getElementById("theme-" + theme + "-button")) { - document.getElementById("theme-" + theme + "-button").classList.add('theme-selection-box-selected'); - } - } - document.body.classList.add('theme-' + theme); - if (raw != null) { - localStorage.community_theme_raw = raw; - fetch(raw, { - method: "GET" - }) - .then(response => response.text()) - .then((data) => { - - document.getElementById("community-theme-import").innerHTML = `${data}`; - - }) - .catch(error => { - console.error(error) - }); - - if (document.getElementById("theme-" + theme + "-button")) { - document.getElementById("theme-" + theme + "-button").classList.add('theme-selection-box-selected'); - } - } else { - document.getElementById("community-theme-import").innerHTML = ``; - } - } - - function updateThemeToCommunity() { - if (localStorage.community_theme_raw) { - fetch(localStorage.community_theme_raw, { - method: "GET" - }) - .then(response => response.text()) - .then((data) => { - document.getElementById("community-theme-import").innerHTML = `${data}`; - }) - .catch(error => { - console.error(error) - }); - } - } - - updateThemeToCommunity(); - - function optionsSidebarToggle() { - if (document.getElementById('options-sidebar-container').classList.contains('options-sidebar-container-expanded')) { - document.getElementById('options-sidebar-container').classList.remove("options-sidebar-container-expanded"); - } else { - document.getElementById('options-sidebar-container').classList.add("options-sidebar-container-expanded"); - document.getElementById('options-sidebar-container').innerHTML = ` -

${getTextString("OPTIONS_SIDEBAR_TITLE")}

-
- -
-
-
-

${getTextString("OPTIONS_SIDEBAR_CURRENCY_PICKER")}

- -
-
- -
-

${getTextString("OPTIONS_SIDEBAR_REDUCED_MOTION")}

- -
- -
-

${getTextString("OPTIONS_SIDEBAR_REDUCED_MOTION_BANNERS")}

- -
-
- -
- -
-
-
-

${getTextString("OPTIONS_SIDEBAR_DOWNLOADS")}

-
-
- -
-
-

${getTextString("OPTIONS_SIDEBAR_YAPPER_HELP")}

-
- - -
- ${getTextString("APP_VERSION")}${tcbx926n29} - `; - - if (app_version2 === "Stable") { - let betatester = document.createElement("div"); - - betatester.innerHTML = ` - - `; - - document.getElementById("yapper-article-container").appendChild(betatester); - } - - if (localStorage.experiment_2025_02_extra_options === "Treatment 4: Enabled" || localStorage.experiment_2025_02_extra_options === "Treatment 5: Enabled w/o currency picker" || localStorage.experiment_2025_02_extra_options === "Treatment 6: Settings like discord") { - document.getElementById("username-picker-container-dev").innerHTML = ` -

${getTextString("OPTIONS_EXTRA_PROFILE")}

-

${getTextString("OPTIONS_EXTRA_PROFILE_DESC")}

-
-
-
-
-
-

${getTextString("OPTIONS_EXTRA_PROFILE_CHANGE_USERNAME")}

- -
-
-

${getTextString("OPTIONS_EXTRA_PROFILE_CHANGE_BANNER_COLOR")}

- -
-
- - - -
-
-
- - - -
-
-
-
-
-
-
- No image uploaded -
-
-

${localStorage.discord_displayname}

-

-
-
-
- `; - - if (localStorage.experiment_2025_04_discord_sign_in === "Treatment 3: Force Logged In" || localStorage.experiment_2025_04_discord_sign_in === "Treatment 1: Dynamic" && localStorage.getItem('discord_token')) { - let cantChangeProfileWhenLoggedIn = document.createElement("div"); - - cantChangeProfileWhenLoggedIn.classList.add('cant-change-profile-when-logged-in-container'); - cantChangeProfileWhenLoggedIn.innerHTML = ` -
- -

${getTextString("OPTIONS_EXTRA_PROFILE_ERROR_1")}

-

${getTextString("OPTIONS_EXTRA_PROFILE_ERROR_2")}

- - -
- `; - - - document.getElementById("profile-change-settings").appendChild(cantChangeProfileWhenLoggedIn); - - document.getElementById("discord-integration-options-container").innerHTML = ` -
-

${getTextString("OPTIONS_EXTRA_PROFILE_DISCORD_LOGGED_IN_AS")}${localStorage.discord_displayname} (${localStorage.discord_username})

- - `; - if (localStorage.dismissible_newLogInWithDiscord != "Treatment 1: Seen" && localStorage.experiment_2025_04_discord_sign_in_dismissible === "Treatment 1: V1") { - document.getElementById('discord-sign-in-title-container').innerHTML = ` -

${getTextString("OPTIONS_EXTRA_PROFILE_DISCORD")}

-
${getTextString("DM_NEW")}
- `; - } else { - document.getElementById('discord-sign-in-title-container').innerHTML = ` -

${getTextString("OPTIONS_EXTRA_PROFILE_DISCORD")}

- `; - } - } else if (localStorage.experiment_2025_04_discord_sign_in === "Treatment 1: Dynamic" || localStorage.experiment_2025_04_discord_sign_in === "Treatment 2: Force Logged Out") { - document.getElementById("discord-integration-options-container").innerHTML = ` -
-

${getTextString("OPTIONS_EXTRA_PROFILE_DISCORD_SUMMARY")}

- - `; - if (localStorage.dismissible_newLogInWithDiscord != "Treatment 1: Seen" && localStorage.experiment_2025_04_discord_sign_in_dismissible === "Treatment 1: V1") { - document.getElementById('discord-sign-in-title-container').innerHTML = ` -

${getTextString("OPTIONS_EXTRA_PROFILE_DISCORD")}

-
${getTextString("DM_NEW")}
- `; - } else { - document.getElementById('discord-sign-in-title-container').innerHTML = ` -

${getTextString("OPTIONS_EXTRA_PROFILE_DISCORD")}

- `; - } - } - - if (localStorage.experiment_2025_04_discord_sign_in === "Treatment 6: Force Logged In v2" || localStorage.experiment_2025_04_discord_sign_in === "Treatment 4: Dynamic v2" && localStorage.getItem('discord_token')) { - - document.getElementById("options-profile-nono-change-container").innerHTML = ` -

${getTextString("OPTIONS_EXTRA_PROFILE_ERROR_1")}

-

${getTextString("OPTIONS_EXTRA_PROFILE_ERROR_2")}

-

${getTextString("OPTIONS_EXTRA_PROFILE_ERROR_3")}

- `; - - document.getElementById("profile-settings-edit").style.display = 'none'; - - document.getElementById("discord-integration-options-container").innerHTML = ` -
-

${getTextString("OPTIONS_EXTRA_PROFILE_DISCORD_LOGGED_IN_AS")}${localStorage.discord_displayname} (${localStorage.discord_username})

-
- - -
- `; - if (localStorage.dismissible_newLogInWithDiscord != "Treatment 1: Seen" && localStorage.experiment_2025_04_discord_sign_in_dismissible === "Treatment 1: V1") { - document.getElementById('discord-sign-in-title-container').innerHTML = ` -

${getTextString("OPTIONS_EXTRA_PROFILE_DISCORD")}

-
${getTextString("DM_NEW")}
- `; - } else { - document.getElementById('discord-sign-in-title-container').innerHTML = ` -

${getTextString("OPTIONS_EXTRA_PROFILE_DISCORD")}

- `; - } - } else if (localStorage.experiment_2025_04_discord_sign_in === "Treatment 4: Dynamic v2") { - document.getElementById("discord-integration-options-container").innerHTML = ` -
-

${getTextString("OPTIONS_EXTRA_PROFILE_DISCORD_SUMMARY")}

- - `; - if (localStorage.dismissible_newLogInWithDiscord != "Treatment 1: Seen" && localStorage.experiment_2025_04_discord_sign_in_dismissible === "Treatment 1: V1") { - document.getElementById('discord-sign-in-title-container').innerHTML = ` -

${getTextString("OPTIONS_EXTRA_PROFILE_DISCORD")}

-
${getTextString("DM_NEW")}
- `; - } else { - document.getElementById('discord-sign-in-title-container').innerHTML = ` -

${getTextString("OPTIONS_EXTRA_PROFILE_DISCORD")}

- `; - } - } - - - - document.getElementById("accessibility-options-container").innerHTML = ` -

${getTextString("OPTIONS_SIDEBAR_ACCESSIBILITY")}

-
-
-

${getTextString("OPTIONS_SIDEBAR_REDUCED_MOTION")}

- -
- `; - document.getElementById("old-options-container-dev").innerHTML = ``; - - document.getElementById("options-username-preview").textContent = localStorage.discord_username.toLowerCase(); - - // if (localStorage.experiment_2025_02_extra_options != "Treatment 5: Enabled w/o currency picker") { - // document.getElementById("currency-picker-experiment-container").innerHTML = ` - //
- //

${getTextString("OPTIONS_SIDEBAR_NITRO_DISCOUNT")}

- // - //
- // `; - //
- //

Currency

- // - //
- // } - - - const avatarImageInput = document.getElementById("profileAvatarInput"); - const avatarImagePreview = document.getElementById("profileAvatarPreview"); - const removeAvatarImageButton = document.getElementById("removeProfileAvatarButton"); - - // Load saved image from localStorage on page load - document.addEventListener("DOMContentLoaded", () => { - const savedImage = localStorage.getItem("discord_avatar"); - if (savedImage) { - avatarImagePreview.src = savedImage; - } - }); - - // Handle image upload - avatarImageInput.addEventListener("change", function () { - document.getElementById("options-avatar-img-input-option-error").classList.remove('options-img-input-option-error') - document.getElementById("options-avatar-img-input-option-error").innerHTML = ``; - const file = this.files[0]; - if (file) { - const reader = new FileReader(); - reader.onload = function (event) { - const dataUrl = event.target.result; - try { - localStorage.setItem("discord_avatar", dataUrl); - avatarImagePreview.src = dataUrl; - } catch(error) { - document.getElementById("options-avatar-img-input-option-error").classList.add('options-img-input-option-error') - document.getElementById("options-avatar-img-input-option-error").innerHTML = ` -

${getTextString("OPTIONS_EXTRA_PROFILE_FILE_TOO_BIG")}

- `; - } - }; - reader.readAsDataURL(file); - } - }); - - // Handle image removal - removeAvatarImageButton.addEventListener("click", function () { - setRandomDiscordAvatar() - avatarImagePreview.src = localStorage.discord_avatar; - }); - - - const bannerImageInput = document.getElementById("profileBannerInput"); - const bannerImagePreview = document.getElementById("profileBannerPreview"); - const removeBannerImageButton = document.getElementById("removeProfileBannerButton"); - - - if (localStorage.discord_banner === ``) { - removeBannerImageButton.style.display = 'none'; - } - - // Load saved image from localStorage on page load - document.addEventListener("DOMContentLoaded", () => { - const savedImage = localStorage.getItem("discord_banner"); - if (savedImage) { - bannerImagePreview.style.backgroundImage = `url(${savedImage})`; - } - }); - - // Handle image upload - bannerImageInput.addEventListener("change", function () { - document.getElementById("options-banner-img-input-option-error").classList.remove('options-img-input-option-error') - document.getElementById("options-banner-img-input-option-error").innerHTML = ``; - removeBannerImageButton.style.display = 'block'; - const file = this.files[0]; - if (file) { - const reader = new FileReader(); - reader.onload = function (event) { - const dataUrl = event.target.result; - try { - localStorage.setItem("discord_banner", dataUrl); - bannerImagePreview.style.backgroundImage = `url(${dataUrl})`; - } catch(error) { - document.getElementById("options-banner-img-input-option-error").classList.add('options-img-input-option-error') - document.getElementById("options-banner-img-input-option-error").innerHTML = ` -

${getTextString("OPTIONS_EXTRA_PROFILE_FILE_TOO_BIG")}

- `; - } - }; - reader.readAsDataURL(file); - } - }); - - // Handle image removal - removeBannerImageButton.addEventListener("click", function () { - removeBannerImageButton.style.display = 'none'; - localStorage.discord_banner = `` - bannerImagePreview.style.backgroundImage = ''; - }); - } - - try { - const currency_picker_currencies = ["USD", "Discord Orb"]; - - const currency_picker_currencies_picker = document.getElementById("currency_picker_container"); - - - populate_currency_picker(); - - const storedTreatment = localStorage.getItem("currency"); - if (storedTreatment) { - currency_picker_currencies_picker.value = storedTreatment; - } - - function populate_currency_picker() { - currency_picker_currencies.forEach((treatments) => { - const optElement = document.createElement("option"); - optElement.value = treatments; - optElement.textContent = treatments; - currency_picker_currencies_picker.appendChild(optElement); - }); - } - - currency_picker_currencies_picker.addEventListener("change", () => { - const selectedTreatment = currency_picker_currencies_picker.value; - - // Store the selection - localStorage.setItem("currency", selectedTreatment); - }); - } catch(error) { - } - - if (localStorage.experiment_2024_12_theme_picker == "Treatment 1: Enabled" || localStorage.experiment_2024_12_theme_picker == "Treatment 2: Enabled with custom css") { - document.getElementById("theme-picker-container").innerHTML = ` -

${getTextString("OPTIONS_SIDEBAR_APPEARANCE")}

- -
-
-
-
-
- - `; - if (localStorage.experiment_2024_12_theme_picker == "Treatment 2: Enabled with custom css") { - const themes_container = document.getElementById("theme-picker-container"); - - document.getElementById("default-theme-title").style.display = 'unset'; - document.getElementById("custom-theme-title").style.display = 'unset'; - - let custom_themes = document.createElement("div"); - custom_themes.id = 'theme-selection-box-container'; - - custom_themes.innerHTML = ` -
-
-
-
-
-
-
-
-
-
- -
-
- `; - - themes_container.appendChild(custom_themes); - } - } - - if (localStorage.sa_theme == "dark") { - try { - document.getElementById("theme-dark-button").classList.add('theme-selection-box-selected'); - document.body.classList.add('theme-dark'); - } catch (error) { - } - } else - if (localStorage.sa_theme == "midnight") { - try { - document.getElementById("theme-midnight-button").classList.add('theme-selection-box-selected'); - document.body.classList.add('theme-midnight'); - } catch (error) { - } - } else - if (localStorage.sa_theme == "light") { - try { - document.getElementById("theme-light-button").classList.add('theme-selection-box-selected'); - document.body.classList.add('theme-light'); - } catch (error) { - } - } else - if (localStorage.sa_theme == "neongreen") { - try { - document.getElementById("theme-neongreen-button").classList.add('theme-selection-box-selected'); - document.body.classList.add('theme-neongreen'); - } catch (error) { - } - } else - if (localStorage.sa_theme == "neonpurple") { - try { - document.getElementById("theme-neonpurple-button").classList.add('theme-selection-box-selected'); - document.body.classList.add('theme-neonpurple'); - } catch (error) { - } - } - - - if (localStorage.fetch_collectibles_variants == "true") { - document.getElementById("is-in-shop-box").checked = true; - } - - if (localStorage.fetch_collectibles_variants == "none") { - document.getElementById("is-in-shop-box").checked = true; - } - - if (localStorage.reduced_motion == "true") { - document.getElementById("reduced-motion-box").checked = true; - } - - // if (localStorage.is_nitro_user == "true" && localStorage.experiment_2025_02_extra_options && localStorage.experiment_2025_02_extra_options != "Treatment 5: Enabled w/o currency picker" && localStorage.experiment_2025_02_extra_options != "Treatment -1: Disabled") { - // document.getElementById("options-has-nitro-box").checked = true; - // } - - if (localStorage.disable_client_banner_overrides == "true") { - document.getElementById("disable-banner-overrides-box").checked = true; - } - - if (localStorage.experiment_2025_04_collectibles_marketing_page === "Treatment 1: Enabled" || localStorage.experiment_2025_04_collectibles_marketing_page === "Treatment 2: Enable v2") { - const content = document.getElementById('downloadables-output'); - content.innerHTML = ` -

${getTextString("OPTIONS_SIDEBAR_MARKETING_DOWNLOADS_HAVE_MOVED")}

-
- -
- `; - } else { - - fetch(api + DOWNLOADABLE_DATA, { - method: "GET", - headers: { - "Password": api_password, - "Authorization": discord_token, - "Token": api_token - } - }) - .then(response => response.json()) - .then(data => { - // Call the function to display the data - displayData(data); - }) - .catch(error => { - console.error('Error fetching the API:', error); - }); - - // Function to display the data in the HTML - function displayData(data) { - const content = document.getElementById('downloadables-output'); - const template = document.getElementById('downloadables-api-template'); - - data.forEach(item => { - // Clone the template - const clone = template.content.cloneNode(true); - - // Fill in the name and summary - clone.querySelector('.name').textContent = item.name; - clone.querySelector('.summary').textContent = item.summary; - - if (item.id === "discord_marketing") { - // Add buttons for downloadables - const downloadablesDiv = clone.querySelector('.downloadables'); - item.downloadables.forEach(downloadable => { - const button = document.createElement('button'); - button.textContent = `${downloadable.id}: ` + downloadable.name; - button.classList.add('card-button'); - button.addEventListener('click', () => { - window.open('https://item.yapper.shop/marketing/' + downloadable.id + '/data.zip', '_blank'); - }); - downloadablesDiv.appendChild(button); - }); - } - - if (item.id === "profiles_plus_marketing") { - // Add buttons for downloadables - const downloadablesDiv = clone.querySelector('.downloadables'); - item.downloadables.forEach(downloadable => { - const button = document.createElement('button'); - button.textContent = `${downloadable.id}: ` + downloadable.name; - button.classList.add('card-button'); - button.addEventListener('click', () => { - window.open('https://item.yapper.shop/profiles-plus-marketing/' + downloadable.id + '/data.zip', '_blank'); - }); - downloadablesDiv.appendChild(button); - }); - } - - // Append the cloned template to the content - content.appendChild(clone); - }); - } - - } - if (localStorage.experiment_2025_03_extra_options_dismissible_content === "Treatment 1: V1") { - localStorage.dismissible_newProfileSettings = "Treatment 1: Seen" - if (document.getElementById("newProfileSettingsDismissible")) { - document.getElementById("newProfileSettingsDismissible").remove(); - } - } - if (localStorage.experiment_2025_04_discord_sign_in_dismissible === "Treatment 1: V1" && localStorage.staff_dont_dismiss_discord_login != "true") { - localStorage.dismissible_newLogInWithDiscord = "Treatment 1: Seen" - if (document.getElementById("open-options-tools-button-1")) { - document.getElementById("open-options-tools-button-1").innerHTML = ` - - `; - } - if (document.getElementById("newLogInWithDiscordDismissible")) { - document.getElementById("newLogInWithDiscordDismissible").remove(); - } - } - } - } - - - function loginToDiscord() { - const discordUrl = `https://discord.com/api/oauth2/authorize?client_id=${discord_app_ids.SHOP_ARCHIVES}&redirect_uri=${encodeURIComponent(api + LOGIN_CALLBACK)}&response_type=code&scope=identify`; - window.location.href = discordUrl; - } - - function logoutOfDiscord() { - let modal = document.createElement("div"); - - modal.classList.add('modalv2'); - - modal.innerHTML = ` -
-
-
- -
-
-

${getTextString("OPTIONS_EXTRA_PROFILE_DISCORD_LOGOUT_1")}

- -

${getTextString("OPTIONS_EXTRA_PROFILE_DISCORD_LOGOUT_2")}

-
- -
-
- `; - - document.body.appendChild(modal); - - setTimeout(() => { - modal.classList.add('show'); - }, 1); - - let modal_back = document.createElement("div"); - - modal_back.classList.add('modalv2-back'); - modal_back.id = 'modalv2-back'; - - document.body.appendChild(modal_back); - - setTimeout(() => { - modal_back.classList.add('show'); - }, 1); - - - modal.addEventListener('click', (event) => { - if (event.target === modal) { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - } - }); - - modal.querySelector("[data-close-product-card-button]").addEventListener('click', () => { - modal.classList.remove('show'); - modal_back.classList.remove('show'); - setTimeout(() => { - modal.remove(); - modal_back.remove(); - }, 300); - }); - } - - function actuallyLogOutOfDiscord() { - localStorage.removeItem('discord_token'); - localStorage.removeItem('discord_profile'); - sessionStorage.removeItem('discord_profile'); - localStorage.removeItem('discord_avatar'); - localStorage.removeItem('discord_username'); - localStorage.removeItem('discord_user_id'); - localStorage.removeItem('discord_displayname'); - localStorage.removeItem('discord_banner_color'); - localStorage.removeItem('discord_banner'); - localStorage.removeItem('discord_premium_type'); - localStorage.removeItem('admin_level'); - localStorage.removeItem('account_type'); - localStorage.removeItem('shop_archives_token'); - localStorage.dev = "false"; - localStorage.reviews_filter_type = "2"; - location.reload(); - } - - function closeLoginDismissibleCoachtip() { - if (document.getElementById('newLogInWithDiscordDismissible')) { - localStorage.dismissible_newLogInWithDiscord = "Treatment 1: Seen"; - document.getElementById('newLogInWithDiscordDismissible').remove(); - } - } - - function closenew100FreeXPDismissibleCoachtip() { - if (document.getElementById('new100FreeXPDismissible')) { - localStorage.dismissible_new100FreeXP = "Treatment 1: Seen"; - document.getElementById('new100FreeXPDismissible').remove(); - } - } - - function closeXPnoticeDismissibleCoachtip() { - if (document.getElementById('XPnotice')) { - localStorage.dismissible_XPnotice = "Treatment 1: Seen"; - document.getElementById('XPnotice').remove(); - } - } - - async function updateDiscordProfilePlaceholder() { - await updateDiscordProfile(localStorage.discord_token); - optionsSidebarToggle(); - optionsSidebarToggle(); - if (apiUrl) { - fetchData(pageCheck()); - } - } - - window.updateDiscordProfilePlaceholder = updateDiscordProfilePlaceholder; - - async function updateDiscordProfileModalv3() { - await updateDiscordProfile(localStorage.discord_token); - setModalv3InnerContent('account'); - if (apiUrl) { - fetchData(pageCheck()); - } - } - - window.updateDiscordProfileModalv3 = updateDiscordProfileModalv3; - - async function updateDiscordProfile(token) { - if (localStorage.account_type === "2") { - try { - const userInfo = await fetch('https://api.yapper.shop/v2/users/@me', { - method: "POST", - headers: { Authorization: `${localStorage.shop_archives_token}` } - }); - - if (!userInfo.ok) { - // If the response is not ok (e.g., 401 Unauthorized) - setParams({ page: 'home', login: 'false' }); - actuallyLogOutOfDiscord(); - return; - } - - const user = await userInfo.json(); - localStorage.discord_profile = JSON.stringify(user, undefined, 4); - localStorage.discord_avatar = `https://cdn.discordapp.com/avatars/${user.id}/${user.avatar}.webp?size=4096`; - localStorage.discord_username = user.username; - if (user.global_name != null) { - localStorage.discord_displayname = user.global_name; - } else { - localStorage.discord_displayname = user.username; - } - localStorage.discord_banner_color = user.banner_color; - localStorage.discord_premium_type = user.premium_type; - - if (user.banner != null) { - localStorage.discord_banner = `https://cdn.discordapp.com/banners/${user.id}/${user.banner}.png?size=4096`; - } else { - localStorage.removeItem('discord_banner'); - } - - const atMe = await fetch('https://api.yapper.shop/v2/users/@me', { - headers: { Authorization: `${localStorage.shop_archives_token}` } - }); - - const atMe2 = await atMe.json(); - - atMeUsercache = atMe2; - - console.log('success'); - - // Optional: additional check (but `localStorage.discord_profile` is a string, so this check won't work unless parsed) - const parsedProfile = JSON.parse(localStorage.discord_profile); - if (parsedProfile.code === 0) { - setParams({ page: 'home', login: 'false' }); - actuallyLogOutOfDiscord(); - } - - } catch (error) { - setParams({ page: 'home', login: 'false' }); - actuallyLogOutOfDiscord(); - } - } else { - try { - const userInfo = await fetch('https://discord.com/api/users/@me', { - headers: { Authorization: `Bearer ${token}` } - }); - - if (!userInfo.ok) { - // If the response is not ok (e.g., 401 Unauthorized) - setParams({ page: 'home', login: 'false' }); - actuallyLogOutOfDiscord(); - return; - } - - const user = await userInfo.json(); - localStorage.discord_profile = JSON.stringify(user, undefined, 4); - localStorage.discord_avatar = `https://cdn.discordapp.com/avatars/${user.id}/${user.avatar}.webp?size=4096`; - localStorage.discord_username = user.username; - if (user.global_name != null) { - localStorage.discord_displayname = user.global_name; - } else { - localStorage.discord_displayname = user.username; - } - localStorage.discord_banner_color = user.banner_color; - localStorage.discord_premium_type = user.premium_type; - - if (user.banner != null) { - localStorage.discord_banner = `https://cdn.discordapp.com/banners/${user.id}/${user.banner}.png?size=4096`; - } else { - localStorage.removeItem('discord_banner'); - } - - console.log('success'); - - // Optional: additional check (but `localStorage.discord_profile` is a string, so this check won't work unless parsed) - const parsedProfile = JSON.parse(localStorage.discord_profile); - if (parsedProfile.code === 0) { - setParams({ page: 'home', login: 'false' }); - actuallyLogOutOfDiscord(); - } - - } catch (error) { - setParams({ page: 'home', login: 'false' }); - actuallyLogOutOfDiscord(); - } - } - } - - function changeUsernameFromInput() { - const input = document.getElementById('profile-username-text-input') - - localStorage.discord_username = input.value; - localStorage.discord_displayname = input.value; - - const displayname = document.getElementById('options-preview-profile-displayname') - - displayname.textContent = input.value; - - - const usernamename = document.getElementById('options-username-preview') - - usernamename.textContent = input.value.toLowerCase(); - } - - function changeBannerColorFromInput() { - const input = document.getElementById('profile-banner-color-input') - - localStorage.discord_banner_color = input.value; - - const banner = document.getElementById('options-preview-profile-banner-color') - - banner.style.backgroundColor = input.value; - } - - function changeAvatarFromInput() { - const input = document.getElementById('profile-avatar-text-input') - - localStorage.discord_avatar = input.value; - } - - - if (localStorage.experiment_2025_03_extra_options_dismissible_content === "Treatment 1: V1") { - - if (localStorage.dismissible_newProfileSettings != "Treatment 1: Seen") { - let newProfileSettingsDismissible = document.createElement("div"); - - newProfileSettingsDismissible.onclick = function() { - optionsSidebarToggle(); - localStorage.dismissible_newProfileSettings = "Treatment 1: Seen" - newProfileSettingsDismissible.remove(); - }; - - newProfileSettingsDismissible.classList.add('newProfileSettingsDismissible'); - - newProfileSettingsDismissible.id = `newProfileSettingsDismissible`; - - document.body.appendChild(newProfileSettingsDismissible); - } - } - - if (localStorage.experiment_2024_12_profiles_plus_marketing_variants === "Treatment 1: Paper Beach V2") { - - if (localStorage.dismissible_paper_beach_v2_marketing != "Treatment 1: Seen") { - const profiles_plus_tab = document.getElementById("pplus-tab"); - if (profiles_plus_tab) { - profiles_plus_tab.innerHTML = ` - -

${getTextString("PROFILES_PLUS_BROWSE_ALL_TAB_TITLE")}

-
${getTextString("DM_NEW")}
-
-
- -
-
-
-

${getTextString("DISMISSIBLE_CONTENT_PAPER_BEACH_V2_TITLE")}

- `; - profiles_plus_tab.classList.add('paper_beach_v2_marketing_tab'); - - profiles_plus_tab.addEventListener("mouseenter", () => { - if (document.getElementById("dm-tab-preview-avatar-decoration").src == "https://cdn.yapper.shop/custom-collectibles/paper-beach/avatar-decorations/12.png") { - document.getElementById("dm-tab-preview-avatar-decoration-container").innerHTML = ` - - `; - } else if (document.getElementById("dm-tab-preview-avatar-decoration").src == "https://cdn.yapper.shop/custom-collectibles/paper-beach/avatar-decorations/8.png") { - document.getElementById("dm-tab-preview-avatar-decoration-container").innerHTML = ` - - `; - } else if (document.getElementById("dm-tab-preview-avatar-decoration").src == "https://cdn.yapper.shop/custom-collectibles/paper-beach/avatar-decorations/2.png") { - document.getElementById("dm-tab-preview-avatar-decoration-container").innerHTML = ` - - `; - } - }); - } - } - } - - - if (localStorage.experiment_2024_12_profiles_plus_marketing_variants === "Treatment 2: Roblox Doors") { - - if (localStorage.dismissible_roblox_doors_marketing != "Treatment 1: Seen") { - const profiles_plus_tab = document.getElementById("pplus-tab"); - if (profiles_plus_tab) { - profiles_plus_tab.innerHTML = ` - -

${getTextString("PROFILES_PLUS_BROWSE_ALL_TAB_TITLE")}

-
${getTextString("DM_NEW")}
-
-
- -
-
-
-

${getTextString("DISMISSIBLE_CONTENT_ROBLOX_DOORS_TITLE")}

- `; - profiles_plus_tab.classList.add('roblox_doors_marketing_tab'); - - profiles_plus_tab.addEventListener("mouseenter", () => { - if (document.getElementById("dm-tab-preview-avatar-decoration").src == "https://cdn.yapper.shop/custom-collectibles/paper-beach/avatar-decorations/12.png") { - document.getElementById("dm-tab-preview-avatar-decoration-container").innerHTML = ` - - `; - } else if (document.getElementById("dm-tab-preview-avatar-decoration").src == "https://cdn.yapper.shop/custom-collectibles/paper-beach/avatar-decorations/8.png") { - document.getElementById("dm-tab-preview-avatar-decoration-container").innerHTML = ` - - `; - } else if (document.getElementById("dm-tab-preview-avatar-decoration").src == "https://cdn.yapper.shop/custom-collectibles/paper-beach/avatar-decorations/2.png") { - document.getElementById("dm-tab-preview-avatar-decoration-container").innerHTML = ` - - `; - } - }); - } - } - } - - - - - - function themeDarkChecked() { - clearCurrentTheme() - localStorage.sa_theme = "dark" - document.body.classList.add('theme-dark'); - document.getElementById("theme-dark-button").classList.add('theme-selection-box-selected'); - } - - function themeMidnightChecked() { - clearCurrentTheme() - localStorage.sa_theme = "midnight" - document.body.classList.add('theme-midnight'); - document.getElementById("theme-midnight-button").classList.add('theme-selection-box-selected'); - } - - function themeLightChecked() { - clearCurrentTheme() - localStorage.sa_theme = "light" - document.body.classList.add('theme-light'); - document.getElementById("theme-light-button").classList.add('theme-selection-box-selected'); - } - - function themeNeonGreenChecked() { - clearCurrentTheme() - localStorage.sa_theme = "neongreen" - document.body.classList.add('theme-neongreen'); - document.getElementById("theme-neongreen-button").classList.add('theme-selection-box-selected'); - } - - function themeNeonPurpleChecked() { - clearCurrentTheme() - localStorage.sa_theme = "neonpurple" - document.body.classList.add('theme-neonpurple'); - document.getElementById("theme-neonpurple-button").classList.add('theme-selection-box-selected'); - } - - function clearCurrentTheme() { - try { - document.getElementById("theme-dark-button").classList.remove('theme-selection-box-selected'); - document.body.classList.remove('theme-dark'); - document.getElementById("theme-midnight-button").classList.remove('theme-selection-box-selected'); - document.body.classList.remove('theme-midnight'); - document.getElementById("theme-light-button").classList.remove('theme-selection-box-selected'); - document.body.classList.remove('theme-light'); - document.getElementById("theme-neongreen-button").classList.remove('theme-selection-box-selected'); - document.body.classList.remove('theme-neongreen'); - document.getElementById("theme-neonpurple-button").classList.remove('theme-selection-box-selected'); - document.body.classList.remove('theme-neonpurple'); - } catch (error) { - } - } - - function disabledExperimentForceRollout() { - if (!localStorage.experiment_force_rollout) { - localStorage.experiment_force_rollout = "true" - } else if (localStorage.experiment_force_rollout != "true") { - localStorage.experiment_force_rollout = "true" - } else { - localStorage.experiment_force_rollout = "false" - } - } - - function inShopIsChecked() { - if (localStorage.fetch_collectibles_variants != "true") { - localStorage.fetch_collectibles_variants = "true" - } - else { - localStorage.fetch_collectibles_variants = "false" - } - if (typeof fetchData === 'function') { - fetchData(pageCheck()); - } - } - - function reducedMotionChecked() { - if (!localStorage.reduced_motion) { - localStorage.reduced_motion = "true" - } else if (localStorage.reduced_motion != "true") { - localStorage.reduced_motion = "true" - } else { - localStorage.reduced_motion = "false" - } - if (typeof fetchData === 'function') { - fetchData(pageCheck()); - } - } - - function optionsHasNitroChecked() { - if (localStorage.is_nitro_user != "true") { - localStorage.is_nitro_user = "true" - } else { - localStorage.is_nitro_user = "false" - } - if (typeof fetchData === 'function') { - fetchData(pageCheck()); - } - } - - function disableBannerOverridesChecked() { - if (localStorage.disable_client_banner_overrides != "true") { - localStorage.disable_client_banner_overrides = "true" - } - else { - localStorage.disable_client_banner_overrides = "false" - } - if (typeof fetchData === 'function') { - fetchData(pageCheck()); - } - } - - function noBundlesInShopIsChecked() { - if (localStorage.shop_have_no_bundles != "true") { - localStorage.shop_have_no_bundles = "true" - } - else { - localStorage.shop_have_no_bundles = "false" - } - if (typeof fetchData === 'function') { - pageCheck(); - } - } - - function openMobileModal() { - const lost_modal = document.getElementById('modal-housing'); - lost_modal.innerHTML = ` - - `; - } - - function openOptionsModal() { - const options_modal = document.getElementById('modal-housing'); - options_modal.innerHTML = ` - - `; - - if (localStorage.fetch_collectibles_variants == "true") { - document.getElementById("is-in-shop-box").checked = true; - } - - if (localStorage.fetch_collectibles_variants == "none") { - document.getElementById("is-in-shop-box").checked = true; - } - - if (localStorage.items_in_shop != "true") { - if (localStorage.items_in_shop != "none") { - document.getElementById("is-in-shop-box-option").style.display = 'none'; - } - } - - - if (localStorage.shop_have_no_bundles == "true") { - document.getElementById("no-bundles-in-shop-box").checked = true; - } - } - - function openDownloadsModal() { - const downloads_modal = document.getElementById('modal-housing'); - downloads_modal.innerHTML = ` -