Filament selection dialog > Switch to column browser UI with search boxes (#12167)

* init

* update

* add ability to select / unselect filtered items

* update

* update

* match icon placements on filter / search boxes

* add clear button

* add ability to filter checked / unchecked items

* update

* update

* update

* update

* remove use of :has selector for better browser support

* increase contrast on light mode

---------

Co-authored-by: SoftFever <softfeverever@gmail.com>
This commit is contained in:
yw4z
2026-02-11 12:42:57 +03:00
committed by GitHub
parent 89eb0b26d1
commit b02a50add0
8 changed files with 892 additions and 163 deletions

View File

@@ -61,7 +61,7 @@ function SortUI()
{
let sModel=ModelList[n];
/* ORCA use label tag to allow checkbox to toggle when user ckicked to text */
HtmlMode+='<label><input type="checkbox" mode="'+sModel['model']+'" nozzle="'+sModel['nozzle_selected']+'" onChange="MachineClick()" />'+sModel['model']+'</label>';
HtmlMode+='<label><input type="checkbox" mode="'+sModel['model']+'" nozzle="'+sModel['nozzle_selected']+'" onChange="MachineClick()" /><span>'+sModel['model']+'</span></label>';
}
$('#MachineList .CValues').append(HtmlMode);
@@ -132,7 +132,7 @@ function SortUI()
if(!TypeHtmlArray.hasOwnProperty(LowType))
{
/* ORCA use label tag to allow checkbox to toggle when user ckicked to text */
let HtmlType='<label><input type="checkbox" filatype="'+fType+'" onChange="FilaClick()" />'+fType+'</label>';
let HtmlType='<label><input type="checkbox" filatype="'+fType+'" onChange="FilaClick()" /><span>'+fType+'</span></label>';
TypeHtmlArray[LowType]=HtmlType;
}
@@ -142,7 +142,7 @@ function SortUI()
if(!VendorHtmlArray.hasOwnProperty(lowVendor))
{
/* ORCA use label tag to allow checkbox to toggle when user ckicked to text */
let HtmlVendor='<label><input type="checkbox" vendor="'+fVendor+'" onChange="VendorClick()" />'+fVendor+'</label>';
let HtmlVendor='<label><input type="checkbox" vendor="'+fVendor+'" onChange="VendorClick()" /><span>'+fVendor+'</span></label>';
VendorHtmlArray[lowVendor]=HtmlVendor;
}
@@ -152,7 +152,7 @@ function SortUI()
if(pFila.length==0)
{
/* ORCA use label tag to allow checkbox to toggle when user ckicked to text */
let HtmlFila='<label class="MItem"><input type="checkbox" vendor="'+fVendor+'" filatype="'+fType+'" filalist="'+fWholeName+';'+'" model="'+fModel+'" name="'+fShortName+'" />'+fShortName+'</label>';
let HtmlFila='<label class="MItem"><input type="checkbox" vendor="'+fVendor+'" filatype="'+fType+'" filalist="'+fWholeName+';'+'" model="'+fModel+'" name="'+fShortName+'" /><span>'+fShortName+'</span></label>';
// Separate generic and non-generic filaments
if(fVendor.toLowerCase() === 'generic') {
@@ -475,13 +475,14 @@ function ChooseDefaultFilament()
function SelectAllFilament( nShow )
{
if( nShow==0 )
{
$('#ItemBlockArea input').prop("checked",false);
// ORCA add ability to only select / unselect filted items
if (document.querySelector('.cbr-filter-bar').value) {
$('#ItemBlockArea .MItem:visible input')
.filter(function() {return $(this).closest('.MItem').css('position') !== 'absolute'})
.prop("checked", nShow != 0);
}
else
{
$('#ItemBlockArea input').prop("checked",true);
else {
$('#ItemBlockArea .MItem:visible input').prop("checked",nShow!=0);
}
}