You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
105 lines
3.3 KiB
105 lines
3.3 KiB
{# |
|
Copyright (c) 2024-2025, The Linux Foundation. |
|
SPDX-License-Identifier: Apache-2.0 |
|
#} |
|
|
|
<form class="filter-form" aria-label="Filter boards by name, architecture, and vendor"> |
|
|
|
<div class="form-group" style="flex-basis: 100%"> |
|
<label for="name">Name</label> |
|
<input type="text" id="name" |
|
placeholder='Name (or partial name) of the board, e.g. "reel board", "nucleo", …' |
|
oninput="filterBoards()" /> |
|
</div> |
|
|
|
<div class="form-group"> |
|
<label for="arch">Architecture</label> |
|
<div class="select-container"> |
|
<select id="arch"> |
|
<option value="" disabled selected>Select an architecture</option> |
|
<option value="arm">ARM</option> |
|
<option value="arm64">ARM 64</option> |
|
<option value="mips">MIPS</option> |
|
<option value="posix">POSIX</option> |
|
<option value="riscv">RISC-V</option> |
|
<option value="sparc">SPARC</option> |
|
<option value="arc">Synopsys DesignWare ARC</option> |
|
<option value="x86">x86</option> |
|
<option value="xtensa">Xtensa</option> |
|
</select> |
|
</div> |
|
</div> |
|
|
|
<div class="form-group" style="flex-basis: 400px"> |
|
<label for="vendor">Vendor</label> |
|
<div class="select-container"> |
|
<select id="vendor"> |
|
<option value="" disabled selected>Select a vendor</option> |
|
{# Only show those vendors that have actual boards in the catalog. |
|
Note: as sorting per vendor name is not feasible in Jinja, the option list is sorted in the JavaScript code later #} |
|
{% for vendor in (boards | items | map(attribute='1.vendor') | unique ) -%} |
|
<option value="{{ vendor }}">{{ vendors[vendor] }}</option> |
|
{% endfor %} |
|
</select> |
|
</div> |
|
</div> |
|
|
|
<div class="form-group"> |
|
<label for="family">Family</label> |
|
<select id="family" name="family" size="10" multiple></select> |
|
</div> |
|
|
|
<div class="form-group"> |
|
<label for="series">Series</label> |
|
<select id="series" name="series" size="10" multiple></select> |
|
</div> |
|
|
|
<div class="form-group"> |
|
<label for="soc">SoC</label> |
|
<select id="soc" name="soc" size="10" multiple></select> |
|
</div> |
|
|
|
<div class="form-group" style="flex-basis: 100%"> |
|
<label for="hw-capabilities">Supported Hardware Capabilities</label> |
|
<div class="tag-container" id="tag-container"> |
|
<input list="tag-list" class="tag-input" id="tag-input" |
|
placeholder="{% if hw_features_present -%} |
|
Type a tag... |
|
{%- else -%} |
|
List of supported hardware capabilities is not available |
|
{%- endif %}" |
|
{% if not hw_features_present %}disabled{% endif %}> |
|
<datalist id="tag-list"></datalist> |
|
</div> |
|
</div> |
|
|
|
</form> |
|
|
|
<div id="form-options" style="text-align: center; margin-bottom: 20px"> |
|
<button |
|
id="reset-filters" |
|
class="btn btn-info btn-disabled fa fa-times" |
|
tabindex="0" |
|
onclick="resetForm()"> |
|
Reset Filters |
|
</button> |
|
<button |
|
id="toggle-compact" |
|
class="btn btn-info fa fa-bars" |
|
tabindex="0" |
|
onclick="toggleDisplayMode(this)"> |
|
Switch to Compact View |
|
</button> |
|
</div> |
|
|
|
<div id="nb-matches" style="text-align: center"></div> |
|
|
|
<div id="catalog"> |
|
{% for board_name, board in boards | items | sort(attribute='1.full_name') -%} |
|
{% include "board-card.html" %} |
|
{% endfor %} |
|
</div> |
|
|
|
<script> |
|
socs_data = {{ socs | tojson }}; |
|
</script>
|
|
|