Untitled
unknown
plain_text
a month ago
4.2 kB
2
Indexable
Never
<script> // scripts.js document.addEventListener('DOMContentLoaded', function() { // Set the initial value of the dropdown button to the first option var firstOption = document.querySelector(".dropdown-option"); var dropdownButton = document.querySelector(".dropdown-button"); if (firstOption) { dropdownButton.innerText = firstOption.innerText; } }); function toggleDropdown() { var dropdownOptions = document.getElementById("dropdown-options"); var dropdownContainer = document.querySelector(".dropdown-container"); dropdownOptions.classList.toggle("show"); dropdownContainer.classList.toggle("selected"); } function selectOption(value) { document.querySelector(".dropdown-button").innerText = value; document.getElementById("dropdown-options").classList.remove("show"); document.querySelector(".dropdown-container").classList.remove("selected"); } // Close the dropdown if the user clicks outside of it window.onclick = function(event) { var dropdownContainer = document.querySelector(".dropdown-container"); var dropdownOptions = document.getElementById("dropdown-options"); if (!event.target.closest('.dropdown-container')) { if (dropdownOptions.classList.contains('show')) { dropdownOptions.classList.remove('show'); dropdownContainer.classList.remove('selected'); } } } </script> add_filter( 'render_block', function( $block_content, $block ) { if ( 'blackstone/performance-data' === $block['blockName'] ) { if ( $block['innerBlocks'] ) { $tabs = '<div class="dropdown-container">'; $tabs .= '<div class="dropdown-header" onclick="toggleDropdown()">'; $tabs .= '<div class="share">Share Class</div>'; $tabs .= '<div class="dropdown-button">Select an option</div>'; $tabs .= '</div>'; $tabs .= '<div class="dropdown-options" id="dropdown-options">'; $tabs .= '<div class="dropdown-group">'; $tabs .= '<div class="dropdown-group-title">USD</div>'; $tabs .= '<div class="dropdown-option" onclick="selectOption(\'I USD Accumulating\')">I USD Accumulating</div>'; $tabs .= '<div class="dropdown-option" onclick="selectOption(\'I USD Distributing\')">I USD Distributing</div>'; $tabs .= '</div>'; $tabs .= '<div class="dropdown-group">'; $tabs .= '<div class="dropdown-group-title">EUR</div>'; $tabs .= '<div class="dropdown-option" onclick="selectOption(\'I EUR Accumulating\')">I EUR Accumulating</div>'; $tabs .= '<div class="dropdown-option" onclick="selectOption(\'I EUR Distributing\')">I EUR Distributing</div>'; $tabs .= '</div>'; $tabs .= '<div class="dropdown-group">'; $tabs .= '<div class="dropdown-group-title">CHF</div>'; $tabs .= '<div class="dropdown-option" onclick="selectOption(\'I CHF Accumulating\')">I CHF Accumulating</div>'; $tabs .= '<div class="dropdown-option" onclick="selectOption(\'I CHF Distributing\')">I CHF Distributing</div>'; $tabs .= '</div>'; $tabs .= '</div>'; $tabs .= '</div>'; // Add custom select. $block_content = str_replace( '<!-- Tabs Placeholder -->', $tabs, $block_content ); $block_content = str_replace( 'data-component="chart-tabs-tab-item-link"', 'data-component="chart-tabs-tab-item-link" data-disable-ga-auto-tracking="true"', $block_content ); if ( $has_default_states ) { $block_content = str_replace( 'data-initially-hidden="false"', 'data-initially-hidden="true"', $block_content ); } // Make first item visible. $block_content = preg_replace( '/role=\"tabpanel\" aria-selected=\"false\"/', 'role="tabpanel" aria-selected="true"', $block_content, 1 ); } } return $block_content; }, 10, 2 );
Leave a Comment