61 lines
2.1 KiB
HTML
61 lines
2.1 KiB
HTML
<div class="dropdown is-hoverable is-up is-right">
|
|
<div class="dropdown-trigger">
|
|
<button class="button is-small" aria-haspopup="true" aria-controls="dropdown-menu4">
|
|
<span class="icon"><i class="fa-solid fa-robot"></i></span>
|
|
</button>
|
|
</div>
|
|
<div class="dropdown-menu" id="dropdown-menu4" role="menu">
|
|
<div class="dropdown-content is-small">
|
|
<div class="dropdown-item">
|
|
{% for LLM in LLMs %}
|
|
<!-- Added "has-text" as a default class -->
|
|
<div class="icon-text has-text unselected" onclick="toggleSelection(this)" style="cursor: pointer;"
|
|
value="{{ LLM.ID.String() }}">
|
|
<span class="icon">
|
|
<img src="{{ LLM.Model.Company.Icon }}" />
|
|
</span>
|
|
<span>{{ LLM.Name }}</span>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
function toggleSelection(element) {
|
|
// Check if the element currently has the 'has-text-info' class
|
|
if (element.classList.contains('selected')) {
|
|
// It has 'has-text-info', so remove it and add 'has-text'
|
|
element.classList.add('unselected');
|
|
element.classList.remove('selected');
|
|
} else {
|
|
// It doesn't have 'has-text-info', so add it and remove 'has-text'
|
|
element.classList.remove('unselected');
|
|
element.classList.add('selected');
|
|
}
|
|
}
|
|
|
|
function getSelectedModelsIDs() {
|
|
var selectedModelsIDs = [];
|
|
var selectedModels = document.getElementsByClassName('selected');
|
|
for (var i = 0; i < selectedModels.length; i++) {
|
|
selectedModelsIDs.push(selectedModels[i].getAttribute('value'));
|
|
}
|
|
return JSON.stringify(selectedModelsIDs);
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
.selected {
|
|
border: 2px solid #3273dc;
|
|
/* Bulma's primary color */
|
|
border-radius: 4px;
|
|
padding: 2px;
|
|
}
|
|
|
|
.unselected {
|
|
border-radius: 4px;
|
|
padding: 4px;
|
|
}
|
|
</style> |