tunes.html

---
layout: default
---
<h1>Full Tunebook</h1>
<div class="input-group">
  <div class="input-group-prepend">
    <span class="input-group-text"><i class="fas fa-search"></i></span>
  </div>
	<input class="form-control form-control-lg" type="text" placeholder="Search all Tunes..." id="keyword-search">
  <div id="loading-spinner" style="position: absolute; right: 0px; z-index: 100; margin: 7px;">
    <i class="fas fa-spinner fa-2x fa-spin"></i>
  </div>
</div>
<a href="javascript:void(0);" onclick="javascript:ToggleAdvancedSearch();" class="lbl-advanced-search"><p><i class="fas fa-caret-down"></i> Advanced Search Options <i class="fas fa-caret-down"></i></p></a>
<div id="advanced-search-opts" style="display:none;">
  <hr/>
  <p>
    <label class="switch">
      <input type="checkbox" id="fav-filter">
      <span class="slider round"></span>
    </label>
     Show only favorited
  </p>
  <select class="custom-select" id="composer-select">
    <option selected value="">Filter by composer...</option>
  </select>
  <select class="custom-select" id="type-select">
    <option selected value="">Filter by tune type...</option>
  </select>
  <select class="custom-select" id="bars-select">
    <option selected value="">Filter by number of bars...</option>
  </select>
</div>

<hr/>


<span id="searchDesc"></span>
<nav class="tune-pagination">
	<span class="discrete page-count">Showing ? - ? of ?</span>
	<span class="discrete d-none d-sm-block" id="updateTime" style="text-align:right;flex-grow:5;"></span>
  <select class="custom-select" id="sort-select" style="width:unset; margin-left:auto">
    <option selected value="relevance"> Relevance</option>
    <option value="alphabetical"> Alphabetical</option>
    <option value="revalphabetical"> Rev. Alphabetical</option>
    <option value="newest"> Newest</option>
    <option value="oldest"> Oldest</option>
  </select>
</nav>


<hr/>

<div id="tune-container">
	<p class="loading-spinner"><i class="fas fa-spinner fa-2x fa-spin"></i></p>
</div>
<div class="no-tunes-found">
  <h2>No tunes found</h2>
  <p>Try using a different search filter</p>
</div>

<hr/>

<nav class="tune-pagination">
  <ul class="pagination">
    <li class="page-item disabled">
      <a class="page-link" href="#" tabindex="-1">1</a>
    </li>
    <li class="page-item"><a class="page-link" href="#">2</a></li>
    <li class="page-item"><a class="page-link" href="#">3</a></li>
  </ul>
	<span class="discrete page-count">Showing ? - ? of ?</span>
</nav>

<script src="./scripts/tunes.js"></script>