JotaChina
/
mmpSearch
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

colocando botões

This commit is contained in:
jotachina 2024-07-28 13:19:01 -03:00
parent 5477310b98
commit b78cf024c4
18 changed files with 429 additions and 352 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
Gemfile
View File

@ -8,8 +8,6 @@ source "https://rubygems.org"
# This will help ensure the proper Jekyll version is running.
# Happy Jekylling!
gem "jekyll", "~> 4.3.3"
# This is the default theme for new Jekyll sites. You may change this to anything you like.
gem "minima", "~> 2.5"
# If you want to use GitHub Pages, remove the "gem "jekyll"" above and
# uncomment the line below. To upgrade, run `bundle update github-pages`.
# gem "github-pages", group: :jekyll_plugins
@ -25,9 +23,6 @@ platforms :mingw, :x64_mingw, :mswin, :jruby do
gem "tzinfo-data"
end
# Performance-booster for watching directories on Windows
gem "wdm", "~> 0.1.1", :platforms => [:mingw, :x64_mingw, :mswin]
# Lock `http_parser.rb` gem to `v0.6.x` on JRuby builds since newer versions of the gem
# do not have a Java counterpart.
gem "http_parser.rb", "~> 0.6.0", :platforms => [:jruby]

13
_includes/sidebar.html Normal file
View File

@ -0,0 +1,13 @@
<aside class="sidebar">
<nav>
<ul>
<li><a href="{{ site.baseurl }}/">Home</a></li>
<li><a href="{{ site.baseurl }}/quantasVezesAparecemInstrumentos">Repetições</a></li>
<li><a href="{{ site.baseurl }}/quaisProjetos/">Quais Projetos</a></li>
<li><a href="{{ site.baseurl }}/beatsDisponiveis/">Beats Disponíveis</a></li>
<li><a href="{{ site.baseurl }}/arquivosMMP/" class="active">Arquivos MMP</a></li>
<li><a href="{{ site.baseurl }}/buscas/">Buscas</a></li>
<li><a href="{{ site.baseurl }}/about/">Sobre</a></li>
</ul>
</nav>
</aside>

66
_layouts/default.html
View File

@ -1,55 +1,33 @@
<!DOCTYPE html>
<html lang="en">
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="assets/css/main.css">
<title>{{ page.title }}</title>
<!-- Adicione outros links de estilos necessários -->
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{ page.title }}</title>
<link rel="stylesheet" href="{{ '/assets/css/style.css' | relative_url }}">
<script src="{{ site.baseurl }}/assets/js/search.js"></script>
</head>
<body>
<header>
<nav>
<a href="/~jotachina/mmpSearch/_site/">Home</a>
<a href="/~jotachina/mmpSearch/_site/quantasVezesAparecemInstrumentos">Repetições</a>
<a href="/~jotachina/mmpSearch/_site/quaisProjetos/">Quais projetos usam quais instrumentos?</a>
<a href="/~jotachina/mmpSearch/_site/beatsDisponiveis/">Beats disponíveis</a>
<a href="/~jotachina/mmpSearch/_site/arquivosMMP/">Projetos disponíveis</a>
<a href="/~jotachina/mmpSearch/_site/about/">Sobre</a>
</nav>
</header>
<header style="background-color: #f0f0f0; padding: 20px;">
<h1>MMPSearch</h1>
<img src="/assets/images/logo.jpg" alt="Logo MMPSearch">
</header>
{% include sidebar.html %}
<main class="main-content">
<div class="container">
<aside>
<div class="post-grid">
<div class="post">1</div>
<div class="post">1</div>
<div class="post">1</div>
<div class="post">1</div>
<div class="post">1</div>
<div class="post">1</div>
<div class="post">1</div>
<div class="post">1</div>
<div class="post">1</div>
</div>
</aside>
</main>
<div class="contet">
{{ content }}
<div class="wrapper">
{{ content }}
</div>
</div>
<footer>
<!-- Rodapé -->
Alice UFSJ
</footer>
<!-- Scripts no final da página para melhor performance -->
<!-- Adicione outros scripts conforme necessário -->
<footer>
<p>Alice UFSJ</p>
<div class="footer-images">
<a href="link-da-imagem1.html"><img src="/assets/images/image1.jpg" alt="Imagem 1"></a>
<a href="link-da-imagem2.html"><img src="/assets/images/image2.jpg" alt="Imagem 2"></a>
</div>
</footer>
</body>
</html>

78
_site/404.html
View File

@ -1,46 +1,37 @@
<!DOCTYPE html>
<html lang="en">
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="assets/css/main.css">
<title></title>
<!-- Adicione outros links de estilos necessários -->
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title></title>
<link rel="stylesheet" href="/~jotachina/mmpSearch/_site/assets/css/style.css">
<script src="/~jotachina/mmpSearch/_site/assets/js/search.js"></script>
</head>
<body>
<header>
<nav>
<a href="/~jotachina/mmpSearch/_site/">Home</a>
<a href="/~jotachina/mmpSearch/_site/quantasVezesAparecemInstrumentos">Repetições</a>
<a href="/~jotachina/mmpSearch/_site/quaisProjetos/">Quais projetos usam quais instrumentos?</a>
<a href="/~jotachina/mmpSearch/_site/beatsDisponiveis/">Beats disponíveis</a>
<a href="/~jotachina/mmpSearch/_site/arquivosMMP/">Projetos disponíveis</a>
<a href="/~jotachina/mmpSearch/_site/about/">Sobre</a>
</nav>
</header>
<header style="background-color: #f0f0f0; padding: 20px;">
<h1>MMPSearch</h1>
<img src="/assets/images/logo.jpg" alt="Logo MMPSearch">
</header>
<aside class="sidebar">
<nav>
<ul>
<li><a href="/~jotachina/mmpSearch/_site/">Home</a></li>
<li><a href="/~jotachina/mmpSearch/_site/quantasVezesAparecemInstrumentos">Repetições</a></li>
<li><a href="/~jotachina/mmpSearch/_site/quaisProjetos/">Quais Projetos</a></li>
<li><a href="/~jotachina/mmpSearch/_site/beatsDisponiveis/">Beats Disponíveis</a></li>
<li><a href="/~jotachina/mmpSearch/_site/arquivosMMP/" class="active">Arquivos MMP</a></li>
<li><a href="/~jotachina/mmpSearch/_site/buscas/">Buscas</a></li>
<li><a href="/~jotachina/mmpSearch/_site/about/">Sobre</a></li>
</ul>
</nav>
</aside>
<main class="main-content">
<div class="container">
<aside>
<div class="post-grid">
<div class="post">1</div>
<div class="post">1</div>
<div class="post">1</div>
<div class="post">1</div>
<div class="post">1</div>
<div class="post">1</div>
<div class="post">1</div>
<div class="post">1</div>
<div class="post">1</div>
</div>
</aside>
</main>
<div class="contet">
<style type="text/css" media="screen">
<div class="wrapper">
<style type="text/css" media="screen">
.container {
margin: 10px auto;
max-width: 600px;
@ -62,15 +53,14 @@
</div>
</div>
</div>
<footer>
<!-- Rodapé -->
Alice UFSJ
</footer>
<!-- Scripts no final da página para melhor performance -->
<!-- Adicione outros scripts conforme necessário -->
<footer>
<p>Alice UFSJ</p>
<div class="footer-images">
<a href="link-da-imagem1.html"><img src="/assets/images/image1.jpg" alt="Imagem 1"></a>
<a href="link-da-imagem2.html"><img src="/assets/images/image2.jpg" alt="Imagem 2"></a>
</div>
</footer>
</body>
</html>

2
_site/feed.xml
View File

@ -1,4 +1,4 @@
<?xml version="1.0" encoding="utf-8"?><feed xmlns="http://www.w3.org/2005/Atom" ><generator uri="https://jekyllrb.com/" version="4.3.3">Jekyll</generator><link href="/~jotachina/mmpSearch/_site/feed.xml" rel="self" type="application/atom+xml" /><link href="/~jotachina/mmpSearch/_site/" rel="alternate" type="text/html" /><updated>2024-07-27T13:50:03-03:00</updated><id>/~jotachina/mmpSearch/_site/feed.xml</id><title type="html">Your awesome title</title><subtitle>Write an awesome description for your new site here. You can edit this line in _config.yml. It will appear in your document head meta (for Google search results) and in your feed.xml site description.</subtitle><entry><title type="html">Welcome to Jekyll!</title><link href="/~jotachina/mmpSearch/_site/jekyll/update/2024/07/25/welcome-to-jekyll.html" rel="alternate" type="text/html" title="Welcome to Jekyll!" /><published>2024-07-25T17:06:48-03:00</published><updated>2024-07-25T17:06:48-03:00</updated><id>/~jotachina/mmpSearch/_site/jekyll/update/2024/07/25/welcome-to-jekyll</id><content type="html" xml:base="/~jotachina/mmpSearch/_site/jekyll/update/2024/07/25/welcome-to-jekyll.html"><![CDATA[<p>You’ll find this post in your <code class="language-plaintext highlighter-rouge">_posts</code> directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run <code class="language-plaintext highlighter-rouge">jekyll serve</code>, which launches a web server and auto-regenerates your site when a file is updated.</p>
<?xml version="1.0" encoding="utf-8"?><feed xmlns="http://www.w3.org/2005/Atom" ><generator uri="https://jekyllrb.com/" version="4.3.3">Jekyll</generator><link href="/~jotachina/mmpSearch/_site/feed.xml" rel="self" type="application/atom+xml" /><link href="/~jotachina/mmpSearch/_site/" rel="alternate" type="text/html" /><updated>2024-07-28T13:15:01-03:00</updated><id>/~jotachina/mmpSearch/_site/feed.xml</id><title type="html">Your awesome title</title><subtitle>Write an awesome description for your new site here. You can edit this line in _config.yml. It will appear in your document head meta (for Google search results) and in your feed.xml site description.</subtitle><entry><title type="html">Welcome to Jekyll!</title><link href="/~jotachina/mmpSearch/_site/jekyll/update/2024/07/25/welcome-to-jekyll.html" rel="alternate" type="text/html" title="Welcome to Jekyll!" /><published>2024-07-25T17:06:48-03:00</published><updated>2024-07-25T17:06:48-03:00</updated><id>/~jotachina/mmpSearch/_site/jekyll/update/2024/07/25/welcome-to-jekyll</id><content type="html" xml:base="/~jotachina/mmpSearch/_site/jekyll/update/2024/07/25/welcome-to-jekyll.html"><![CDATA[<p>You’ll find this post in your <code class="language-plaintext highlighter-rouge">_posts</code> directory. Go ahead and edit it and re-build the site to see your changes. You can rebuild the site in many different ways, but the most common way is to run <code class="language-plaintext highlighter-rouge">jekyll serve</code>, which launches a web server and auto-regenerates your site when a file is updated.</p>
<p>Jekyll requires blog post files to be named according to the following format:</p>

92
_site/index.html
View File

@ -1,57 +1,63 @@
<!DOCTYPE html>
<html lang="en">
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="assets/css/main.css">
<title>MMPSearch</title>
<!-- Adicione outros links de estilos necessários -->
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>MMPSearch</title>
<link rel="stylesheet" href="/~jotachina/mmpSearch/_site/assets/css/style.css">
<script src="/~jotachina/mmpSearch/_site/assets/js/search.js"></script>
</head>
<body>
<header>
<nav>
<a href="/~jotachina/mmpSearch/_site/">Home</a>
<a href="/~jotachina/mmpSearch/_site/quantasVezesAparecemInstrumentos">Repetições</a>
<a href="/~jotachina/mmpSearch/_site/quaisProjetos/">Quais projetos usam quais instrumentos?</a>
<a href="/~jotachina/mmpSearch/_site/beatsDisponiveis/">Beats disponíveis</a>
<a href="/~jotachina/mmpSearch/_site/arquivosMMP/">Projetos disponíveis</a>
<a href="/~jotachina/mmpSearch/_site/about/">Sobre</a>
</nav>
</header>
<header style="background-color: #f0f0f0; padding: 20px;">
<h1>MMPSearch</h1>
<img src="/assets/images/logo.jpg" alt="Logo MMPSearch">
</header>
<aside class="sidebar">
<nav>
<ul>
<li><a href="/~jotachina/mmpSearch/_site/">Home</a></li>
<li><a href="/~jotachina/mmpSearch/_site/quantasVezesAparecemInstrumentos">Repetições</a></li>
<li><a href="/~jotachina/mmpSearch/_site/quaisProjetos/">Quais Projetos</a></li>
<li><a href="/~jotachina/mmpSearch/_site/beatsDisponiveis/">Beats Disponíveis</a></li>
<li><a href="/~jotachina/mmpSearch/_site/arquivosMMP/" class="active">Arquivos MMP</a></li>
<li><a href="/~jotachina/mmpSearch/_site/buscas/">Buscas</a></li>
<li><a href="/~jotachina/mmpSearch/_site/about/">Sobre</a></li>
</ul>
</nav>
</aside>
<main class="main-content">
<div class="container">
<aside>
<div class="post-grid">
<div class="post">1</div>
<div class="post">1</div>
<div class="post">1</div>
<div class="post">1</div>
<div class="post">1</div>
<div class="post">1</div>
<div class="post">1</div>
<div class="post">1</div>
<div class="post">1</div>
</div>
</aside>
</main>
<div class="contet">
<div class="wrapper">
<main class="main-content">
<div class="container">
<div class="post-grid">
<!-- Exemplo de posts -->
<div class="post">Post 1</div>
<div class="post">Post 2</div>
<div class="post">Post 3</div>
<div class="post">Post 4</div>
<div class="post">Post 5</div>
<div class="post">Post 6</div>
<div class="post">Post 7</div>
<div class="post">Post 8</div>
<div class="post">Post 9</div>
</div>
</div>
</main>
</div>
</div>
<footer>
<!-- Rodapé -->
Alice UFSJ
</footer>
<!-- Scripts no final da página para melhor performance -->
<!-- Adicione outros scripts conforme necessário -->
<footer>
<p>Alice UFSJ</p>
<div class="footer-images">
<a href="link-da-imagem1.html"><img src="/assets/images/image1.jpg" alt="Imagem 1"></a>
<a href="link-da-imagem2.html"><img src="/assets/images/image2.jpg" alt="Imagem 2"></a>
</div>
</footer>
</body>
</html>

18
assets/css/css/main.css
View File

@ -1,18 +0,0 @@
@charset "UTF-8";
/* Error: Can't find stylesheet to import.
* ,
* 1 | @import 'variables';
* | ^^^^^^^^^^^
* '
* assets/main.scss 1:9 root stylesheet */
body::before {
font-family: "Source Code Pro", "SF Mono", Monaco, Inconsolata, "Fira Mono", "Droid Sans Mono", monospace, monospace;
white-space: pre;
display: block;
padding: 1em;
margin-bottom: 1em;
border-bottom: 2px solid black;
content: "Error: Can't find stylesheet to import.\a ╷\a 1 │ @import 'variables';\a │ ^^^^^^^^^^^\a ╵\a assets/main.scss 1:9 root stylesheet";
}
/*# sourceMappingURL=main.css.map */

1
assets/css/css/main.css.map
View File

@ -1 +0,0 @@
{"version":3,"sourceRoot":"","sources":["../main.css"],"names":[],"mappings":";AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAOA;EACE;EAEA;EACA;EACA;EACA;EACA;EACA","file":"main.css"}

68
assets/css/main.css
View File

@ -1,68 +0,0 @@
body {
margin: 0;
font-family: Arial, sans-serif;
display: flex;
height: 100vh;
}
.container {
display: flex;
width: 100%;
height: 100%;
}
.sidebar {
width: 200px;
background-color: #2c3e50;
color: #ecf0f1;
display: flex;
flex-direction: column;
padding: 20px;
box-shadow: 2px 0 5px rgba(0, 0, 0, 0.1);
}
.sidebar-button {
background-color: #34495e;
color: #ecf0f1;
border: none;
border-radius: 5px;
padding: 10px;
margin-bottom: 10px;
cursor: pointer;
text-align: left;
width: 100%;
}
.sidebar-button:hover {
background-color: #1abc9c;
}
.main-content {
flex: 1;
padding: 20px;
background-color: #ecf0f1;
display: flex;
flex-wrap: wrap;
gap: 10px;
}
.post-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 10px;
width: 100%;
}
.post {
background-color: #3498db;
color: #fff;
padding: 20px;
text-align: center;
border-radius: 5px;
height: 150px;
display: flex;
justify-content: center;
align-items: center;
}
/*# sourceMappingURL=main.css.map */

1
assets/css/main.css.map
View File

@ -1 +0,0 @@
{"version":3,"sourceRoot":"","sources":["../main.scss"],"names":[],"mappings":"AAAA;EACC;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA","file":"main.css"}

56
assets/js/search.js Normal file
View File

@ -0,0 +1,56 @@
document.addEventListener("DOMContentLoaded", function() {
var fileItemsMMP = document.querySelectorAll('#file-list-mmp .file-item');
var fileItemsWAV = document.querySelectorAll('#file-list-wav li');
// Buscar por instrumento usando o campo de entrada para MMP
var searchButton = document.getElementById('search-button');
searchButton.addEventListener('click', function() {
var searchInput = document.getElementById('instrument-search').value.trim().toLowerCase();
if (searchInput === '') {
resetSearchMMP();
return;
}
fileItemsMMP.forEach(function(item) {
var instrumentsList = item.querySelectorAll('.instrument-list .instrument-name');
var hasInstrument = false;
instrumentsList.forEach(function(instrument) {
var instrumentName = instrument.getAttribute('data-instrument').toLowerCase();
if (instrumentName.includes(searchInput)) {
hasInstrument = true;
}
});
if (hasInstrument) {
item.style.display = 'block';
} else {
item.style.display = 'none';
}
});
// Exibir a lista de arquivos MMP após a busca
document.getElementById('file-list-mmp').style.display = 'block';
});
// Buscar por nome do arquivo WAV
var searchWavButton = document.getElementById('search-wav-button');
searchWavButton.addEventListener('click', function() {
var searchInput = document.getElementById('file-wav-search').value.trim().toLowerCase();
fileItemsWAV.forEach(function(item) {
var fileName = item.querySelector('span').textContent.toLowerCase();
if (fileName.includes(searchInput)) {
item.style.display = 'block';
} else {
item.style.display = 'none';
}
});
// Exibir a lista de arquivos WAV após a busca
document.getElementById('file-list-wav').style.display = 'block';
});
// Função para resetar a busca para arquivos MMP
function resetSearchMMP() {
fileItemsMMP.forEach(function(item) {
item.style.display = 'block';
});
document.getElementById('file-list-mmp').style.display = 'none';
}
});

127
assets/main.scss
View File

@ -1,67 +1,92 @@
body{
margin: 0;
font-family: Arial, sans-serif;
display: flex;
height: 100vh;
/* Estilos para o layout */
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
min-height: 100vh; /* Para ocupar pelo menos toda a altura da tela */
}
.container{
display:flex;
width: 100%;
height: 100%;
header {
background-color: #f0f0f0;
padding: 20px;
}
.sidebar{
width: 200px;
background-color: #2c3e50;
color: #ecf0f1;
display: flex;
flex-direction: column;
padding: 20px;
box-shadow: 2px 0 5px rgba(0,0,0,0.1);
.wrapper {
display: flex;
flex: 1;
}
.sidebar-button{
background-color: #34495e;
color: #ecf0f1;
border: none;
border-radius: 5px;
padding: 10px;
margin-bottom: 10px;
cursor: pointer;
text-align: left;
width: 100%;
.sidebar {
width: 200px;
background-color: #333;
color: #fff;
}
.sidebar-button:hover{
background-color: #1abc9c;
.sidebar nav ul {
list-style-type: none;
padding: 0;
}
.main-content{
flex: 1;
padding: 20px;
background-color: #ecf0f1;
display: flex;
flex-wrap: wrap;
gap: 10px;
.sidebar nav ul li {
padding: 10px;
}
.post-grid{
display: grid;
grid-template-columns: repeat(3,1fr);
gap: 10px;
width: 100%;
.sidebar nav ul li a {
color: #fff;
text-decoration: none;
}
.post{
background-color: #3498db;
color: #fff;
padding: 20px;
text-align: center;
border-radius: 5px;
height: 150px;
display: flex;
justify-content: center;
align-items: center;
.container {
flex: 1;
padding: 20px;
}
.post-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
gap: 20px;
}
.post {
background-color: #f0f0f0;
padding: 20px;
border-radius: 5px;
}
footer {
background-color: #ccc;
padding: 10px;
text-align: center;
}
.footer-images {
margin-top: 10px;
}
.footer-images img {
width: 100px;
height: 100px;
margin: 5px;
border-radius: 50%;
}
/* Estilos para tornar o layout responsivo */
@media only screen and (max-width: 768px) {
.wrapper {
flex-direction: column;
}
.sidebar {
width: 100%;
order: 2; /* Altera a ordem para colocar a sidebar abaixo no layout mobile */
}
.container {
order: 1; /* Coloca a área de conteúdo antes da sidebar no layout mobile */
}
}

23
index.markdown
View File

@ -1,9 +1,22 @@
---
# Feel free to add content and custom Front Matter to this file.
# To modify the layout, see https://jekyllrb.com/docs/themes/#overriding-theme-defaults
layout: default
title: "MMPSearch"
title: MMPSearch
---
<main class="main-content">
<div class="container">
<div class="post-grid">
<!-- Exemplo de posts -->
<div class="post">Post 1</div>
<div class="post">Post 2</div>
<div class="post">Post 3</div>
<div class="post">Post 4</div>
<div class="post">Post 5</div>
<div class="post">Post 6</div>
<div class="post">Post 7</div>
<div class="post">Post 8</div>
<div class="post">Post 9</div>
</div>
</div>
</main>

48
mmp_files.md
View File

@ -4,28 +4,32 @@ title: Arquivos MMP Processados
permalink: /arquivosMMP/
---
<h2>Arquivos MMP disponíveis:</h2>
<main class="main-content">
<div class="container">
<h2>Arquivos MMP disponíveis:</h2>
<ul>
{% for files in site.data %}
{% assign file_data = files %}
{% for item in file_data %}
{% if item.file %}
<li>File path: <strong>{{ item.file }}</strong></li>
{% endif %}
{% if item.bpm %}
<li>BPM: {{ item.bpm }}</li>
{% endif %}
<ul>
{% for track in item.tracks %}
<li>{{ track.track_name }} ({{ track.type }})</li>
<ul>
{% for instrument in track.instruments %}
<li>{{ instrument.instrument_name }}</li>
<ul>
{% for files in site.data %}
{% assign file_data = files %}
{% for item in file_data %}
{% if item.file %}
<li><strong>Arquivo:</strong> {{ item.file }}</li>
{% endif %}
{% if item.bpm %}
<li><strong>BPM:</strong> {{ item.bpm }}</li>
{% endif %}
<ul>
{% for track in item.tracks %}
<li><strong>Nome da Faixa:</strong> {{ track.track_name }} ({{ track.type }})</li>
<ul>
{% for instrument in track.instruments %}
<li><strong>Instrumento:</strong> {{ instrument.instrument_name }}</li>
{% endfor %}
</ul>
{% endfor %}
</ul>
</ul>
{% endfor %}
</ul>
{% endfor %}
{% endfor %}
</ul>
{% endfor %}
</ul>
</div>
</main>

31
projetosComMesmoInstrumento.md
View File

@ -1,18 +1,23 @@
---
layout: default
title: Instrumentos Similares
title: Projetos com Instrumentos Similares
permalink: /quaisProjetos/
---
<h2>Arquivos que possuem instrumentos similares:</h2>
<ul>
{% for item in site.data.processed_data %}
<li>{{ item.instrument_name }}:
<ul>
{% for file_name in item.files %}
<li>{{ file_name }}</li>
{% endfor %}
</ul>
</li>
{% endfor %}
</ul>
<main class="main-content">
<div class="container">
<h2>Arquivos que possuem instrumentos similares:</h2>
<ul>
{% for item in site.data.processed_data %}
<li>{{ item.instrument_name }}:
<ul>
{% for file_name in item.files %}
<li>{{ file_name }}</li>
{% endfor %}
</ul>
</li>
{% endfor %}
</ul>
</div>
</main>

33
quantasVezes.md
View File

@ -1,31 +1,36 @@
---
layout: default
title: Quantidade de repetições de instrumentos
title: Quantidade de Repetições de Instrumentos
permalink: /quantasVezesAparecemInstrumentos/
---
<h2>Quantidade de vezes que cada instrumento é utilizado:</h2>
<ul id="instrument-list">
{% for item in site.data.processed_data %}
<li data-count="{{ item.count }}">{{ item.instrument_name }}: {{ item.count }}</li>
{% endfor %}
</ul>
<main class="main-content">
<div class="container">
<h2>Quantidade de vezes que cada instrumento é utilizado:</h2>
<ul id="instrument-list">
{% for item in site.data.processed_data %}
<li data-count="{{ item.count }}">{{ item.instrument_name }}: {{ item.count }}</li>
{% endfor %}
</ul>
</div>
</main>
<script>
// Apenas para deixar em ordem decrescente
document.addEventListener("DOMContentLoaded", function() {
// Ordenação dos itens em ordem decrescente por contagem
document.addEventListener("DOMContentLoaded", function() {
var instrumentList = document.getElementById('instrument-list');
var items = Array.from(instrumentList.children);
items.sort(function(a, b) {
var countA = parseInt(a.getAttribute('data-count'));
var countB = parseInt(b.getAttribute('data-count'));
return countB - countA; // Ordenação decrescente
var countA = parseInt(a.getAttribute('data-count'));
var countB = parseInt(b.getAttribute('data-count'));
return countB - countA; // Ordenação decrescente
});
instrumentList.innerHTML = '';
items.forEach(function(item) {
instrumentList.appendChild(item);
instrumentList.appendChild(item);
});
});
});
</script>

73
search.md Normal file
View File

@ -0,0 +1,73 @@
---
layout: default
title: Arquivos MMP Disponíveis
permalink: /buscas/
---
<main class="content">
<div class="container">
<h2>Arquivos MMP disponíveis:</h2>
<div id="tags">
<strong>Instrumentos:</strong>
<ul id="instrument-tags">
{% assign all_instruments = site.data.all_instruments %}
{% for instrument in all_instruments %}
<li class="tag" data-instrument="{{ instrument }}">{{ instrument }}</li>
{% endfor %}
</ul>
</div>
<div id="search">
<label for="instrument-search">Buscar instrumento:</label>
<input type="text" id="instrument-search" placeholder="Digite o nome do instrumento...">
<button id="search-button">Buscar</button>
</div>
<div id="search-wav">
<label for="file-wav-search">Buscar beat:</label>
<input type="text" id="file-wav-search" placeholder="Buscar por nome do arquivo">
<button id="search-wav-button">Buscar</button>
</div>
<ul id="file-list-wav" style="display: none;">
{% assign files = site.static_files %}
{% for file in files %}
{% if file.path contains '/mmp/wav/' %}
<li class="file-wav-item">
<span>{{ file.name }}</span><br>
<audio controls>
<source src="{{ file.path | relative_url }}" type="audio/wav">
Seu navegador não suporta o elemento de áudio.
</audio>
</li>
<br>
{% endif %}
{% endfor %}
</ul>
<ul id="file-list-mmp" style="display: none;">
{% for files in site.data %}
{% assign file_data = files %}
{% for item in file_data %}
{% if item.file %}
<li class="file-item" data-file="{{ item.file }}">
<strong>Arquivo:</strong> {{ item.file }}<br>
{% if item.bpm %}
<strong>BPM:</strong> {{ item.bpm }}<br>
{% endif %}
<strong>Instrumentos:</strong>
<ul class="instrument-list">
{% for track in item.tracks %}
{% for instrument in track.instruments %}
<li class="instrument-name" data-instrument="{{ instrument.instrument_name }}">{{ instrument.instrument_name }}</li>
{% endfor %}
{% endfor %}
</ul>
</li>
{% endif %}
{% endfor %}
{% endfor %}
</ul>
</div>
</main>

42
wavFiles.md
View File

@ -1,27 +1,29 @@
---
layout: default
title: Músicas
title: Beats Disponíveis
permalink: /beatsDisponiveis/
---
<h1>Lista de Beats</h1>
<main class="main-content">
<div class="container">
<h1>Lista de Beats</h1>
<p>Aqui estão os beats disponíveis.</p>
Aqui estão os beats disponíveis.
<ul>
{% assign files = site.static_files %}
{% for file in files %}
{% if file.path contains '/mmp/wav/' %}
<li>
<span>{{ file.name }}</span><br>
<audio controls>
<source src="{{ file.path | relative_url }}" type="audio/wav">
Seu navegador não suporta o elemento de áudio.
</audio>
</li>
<br>
{% endif %}
{% endfor %}
</ul>
</div>
</main>
<ul>
{% assign files = site.static_files %}
{% for file in files %}
{% if file.path contains '/mmp/wav/' %}
<li>
<span> {{ file.name }} </span>
<br>
<audio controls>
<source src="{{ file.path | relative_url }}"
type="audio/wav">
Seu navegador não suporta o elemento de áudio.
</audio>
</li>
<br>
{% endif %}
{% endfor %}
</ul>