mmpSearch/instruments.md

layout, title, permalink

layout	title	permalink
default	Projetos com Instrumentos	/instruments/

{% include sidebar.html %}

Projetos e seus instrumentos:

Limpar filtro

<!-- Projetos -->
<div id="project-list" class="columns is-multiline">
  {% for projeto in site.data.all %}
    <div class="column is-6 project-item" data-project-id="{{ projeto.file }}">
      <div class="box">
        <!-- Botão do projeto -->
        {% assign file_url = projeto.file | downcase 
                              | replace: ' ', '-' 
                              | replace: 'ç', 'c' 
                              | replace: 'ã', 'a' 
                              | replace: 'á', 'a'
                              | replace: 'â', 'a'
                              | replace: 'é', 'e'
                              | replace: 'ê', 'e'
                              | replace: 'í', 'i' 
                              | replace: 'ó', 'o' 
                              | replace: 'ô', 'o'
                              | replace: 'õ', 'o'
                              | replace: 'ú', 'u' %}

        <a href="../mmp_pages/{{ file_url }}.html" class="button is-link is-fullwidth">
          {{ projeto.file }}
        </a>

        <!-- Lista de Instrumentos clicáveis -->
        <div class="instruments">
          {% assign instruments_exibidos = "" %}
          {% for track in projeto.tracks %}
            {% if track.instruments %}
              {% for instrument in track.instruments %}
                {% unless instruments_exibidos contains instrument.instrument_name %}
                  {% capture instruments_exibidos %}{{ instruments_exibidos }},{{ instrument.instrument_name }}{% endcapture %}

                  <!-- Gerar link para o instrumento -->
                  {% assign instrument_slug = instrument.instrument_name %}
                  <a href="{{ '/instruments/?instrument=' | append: instrument_slug | encodeURIComponent | relative_url }}" class="button is-link instrument-button" style="margin: 0.5rem;">
                    {{ instrument.instrument_name }}
                  </a>

                {% endunless %}
              {% endfor %}
            {% endif %}
          {% endfor %}
        </div>
      </div>
    </div>
  {% endfor %}
</div>

<script> document.addEventListener("DOMContentLoaded", function() { const instrumentButtons = document.querySelectorAll('.instrument-button'); const projectItems = document.querySelectorAll('.project-item'); const urlParams = new URLSearchParams(window.location.search); let instrumentFilter = urlParams.get('instrument'); // Pega o parâmetro 'instrument' da URL, se houver // Decodificando o valor do instrumento para garantir que espaços e caracteres especiais sejam tratados if (instrumentFilter) { instrumentFilter = decodeURIComponent(instrumentFilter); } // Função para aplicar o filtro de instrumento function filterProjects() { projectItems.forEach(project => { const projectId = project.getAttribute('data-project-id'); let projectContainsInstrument = false; // Verificar se algum instrumento do projeto corresponde ao filtro project.querySelectorAll('.instrument-button').forEach(button => { const instrumentSlug = button.getAttribute('href').split('=')[1]; // Pega o instrumento do link // Decodificando o slug do instrumento para comparar corretamente const decodedSlug = decodeURIComponent(instrumentSlug); // Se o projeto contém o instrumento desejado, exibe o projeto if (decodedSlug === instrumentFilter) { projectContainsInstrument = true; } }); // Ocultar ou exibir o projeto com base no filtro if (instrumentFilter && !projectContainsInstrument) { project.style.display = 'none'; // Oculta o projeto } else { project.style.display = 'block'; // Exibe o projeto } }); } filterProjects(); // Aplica o filtro de instrumentos assim que a página é carregada // Botão para limpar filtro const clearFilterButton = document.querySelector('#clearFilterButton'); if (clearFilterButton) { clearFilterButton.addEventListener('click', function () { // Limpa o filtro e mostra todos os projetos projectItems.forEach(project => { project.style.display = 'block'; // Exibe todos os projetos }); // Remove o parâmetro 'instrument' da URL const newUrl = new URL(window.location.href); newUrl.searchParams.delete('instrument'); window.history.replaceState({}, '', newUrl); }); } }); </script>