Added search filter to multi-desktop view.

Ylian Saint-Hilaire committed May 1, 2020 at 22:53 UTC 4c93dfd0cbac76c14e76c65dc9d8ef2c601e9bb4
1 file changed +16 -14
views/default.handlebars
+16 -14
@@ -224,7 +224,7 @@
224 <td id=devListToolbar class=style14 style="display:none">
225 &nbsp;&nbsp;<input type="button" id="SelectAllButton" onclick="selectallButtonFunction();" value="Select All" />&nbsp;
226 <input type=button id=GroupActionButton disabled="disabled" value="Group Action" onclick=groupActionFunction() />&nbsp;
227 - <input id=SearchInput type=text placeholder=Filter onchange=masterUpdate(5) onkeyup=masterUpdate(5) autocomplete=off onfocus=onSearchFocus(1) onblur=onSearchFocus(0) />&nbsp;
227 + <input id=SearchInput type=text placeholder=Filter onchange=onDeviceSearchChanged(event) onkeyup=onDeviceSearchChanged(event) autocomplete=off onfocus=onSearchFocus(1) onblur=onSearchFocus(0) />&nbsp;
228 <label><input type=checkbox id=RealNameCheckBox onclick=onRealNameCheckBox() /><span title="Show devices operating system name">OS Name</span></label>
229 </td>
230 <td id=kvmListToolbar class=style14 style="display:none">
@@ -232,6 +232,7 @@
232 <input type="button" onclick="disconnectAllKvmFunction()" value="Disconnect All" />&nbsp;
233 <label><input type="checkbox" id="autoConnectDesktopCheckbox" onclick="autoConnectDesktops(event)" title="Automatic connect" />Auto&nbsp;</label>
234 <input type="button" onclick="showMultiDesktopSettings()" value="Settings" />&nbsp;
235 + <input id=KvmSearchInput type=text placeholder=Filter onchange=onDeviceSearchChanged(event) onkeyup=onDeviceSearchChanged(event) autocomplete=off onfocus=onSearchFocus(1) onblur=onSearchFocus(0) />&nbsp;
236 </td>
237 <td id=devMapToolbar class=style14 style="display:none">
238 &nbsp;&nbsp;<input type=text id=mapSearchLocation placeholder="Search Location" onfocus=onMapSearchFocus(1) onblur=onMapSearchFocus(0) />
@@ -1298,7 +1299,7 @@
1299 // Setup page controls
1300 Q('sortselect').selectedIndex = sort = getstore('sort', 0);
1301 Q('sizeselect').selectedIndex = getstore('viewsize', 1);
1301 - Q('SearchInput').value = getstore('_search', '');
1302 + Q('KvmSearchInput').value = Q('SearchInput').value = getstore('_search', '');
1303 showRealNames = (getstore('showRealNames', 0) == 1);
1304 Q('RealNameCheckBox').checked = showRealNames;
1305 Q('viewselect').value = getstore('deviceView', 1);
@@ -2868,18 +2869,18 @@
2869 return;
2870 }
2871 if (e.ctrlKey == true || e.altKey == true || e.metaKey == true) return;
2871 - if (Q('viewselect').value < 3) {
2872 + if (Q('viewselect').value < 4) {
2873 var processed = 0;
2874 if (e.key) {
2874 - if (e.key.length === 1 && searchFocus == 0) { Q('SearchInput').value = ((Q('SearchInput').value + e.key)); processed = 1; }
2875 - if (e.keyCode == 8 && searchFocus == 0) { var x = Q('SearchInput').value; Q('SearchInput').value = x.substring(0, x.length - 1); processed = 1; }
2876 - if (e.keyCode == 27) { Q('SearchInput').value = ''; processed = 1; }
2875 + if (e.key.length === 1 && searchFocus == 0) { Q('KvmSearchInput').value = Q('SearchInput').value = ((Q('SearchInput').value + e.key)); processed = 1; }
2876 + if (e.keyCode == 8 && searchFocus == 0) { var x = Q('SearchInput').value; Q('KvmSearchInput').value = Q('SearchInput').value = x.substring(0, x.length - 1); processed = 1; }
2877 + if (e.keyCode == 27) { Q('KvmSearchInput').value = Q('SearchInput').value = ''; processed = 1; }
2878 } else {
2878 - if (e.charCode != 0 && searchFocus == 0) { Q('SearchInput').value = ((Q('SearchInput').value + String.fromCharCode(e.charCode))); processed = 1; }
2879 + if (e.charCode != 0 && searchFocus == 0) { Q('KvmSearchInput').value = Q('SearchInput').value = ((Q('SearchInput').value + String.fromCharCode(e.charCode))); processed = 1; }
2880 }
2881 if (processed > 0) { if (processed == 1) { masterUpdate(5); } return haltEvent(e); }
2882 }
2882 - if (Q('viewselect').value == 3) {
2883 + if (Q('viewselect').value == 4) {
2884 if (e.key) {
2885 if (e.key.length === 1 && mapSearchFocus == 0) { Q('mapSearchLocation').value = ((Q('mapSearchLocation').value + e.key)); processed = 1; }
2886 //if (e.keyCode == 8 && mapSearchFocus == 0) { var x = Q('mapSearchLocation').value; Q('mapSearchLocation').value = x.substring(0, x.length - 1); processed = 1; }
@@ -2914,12 +2915,12 @@
2915 }
2916 if (xxdialogMode || xxcurrentView != 1 || e.ctrlKey == true || e.altKey == true || e.metaKey == true) return;
2917 var processed = 0;
2917 - if (Q('viewselect').value < 3) {
2918 - if (e.keyCode === 8 && searchFocus == 0) { var x = Q('SearchInput').value; Q('SearchInput').value = (x.substring(0, x.length - 1)); processed = 1; }
2919 - if (e.keyCode === 27) { Q('SearchInput').value = ''; processed = 1; }
2918 + if (Q('viewselect').value < 4) {
2919 + if (e.keyCode === 8 && searchFocus == 0) { var x = Q('SearchInput').value; Q('KvmSearchInput').value = Q('SearchInput').value = (x.substring(0, x.length - 1)); processed = 1; }
2920 + if (e.keyCode === 27) { Q('KvmSearchInput').value = Q('SearchInput').value = ''; processed = 1; }
2921 if (processed > 0) { if (processed == 1) { masterUpdate(5); } return haltEvent(e); }
2922 }
2922 - if (Q('viewselect').value == 3) {
2923 + if (Q('viewselect').value == 4) {
2924 if (e.keyCode === 8 && mapSearchFocus == 0) { var x = Q('mapSearchLocation').value; Q('mapSearchLocation').value = (x.substring(0, x.length - 1)); processed = 1; }
2925 if (e.keyCode === 27) { Q('mapSearchLocation').value = ''; mapCloseSearchWindow(); processed = 1; }
2926 }
@@ -2943,8 +2944,8 @@
2944 if (!xxdialogMode && xxcurrentView == 4) { if ((e.keyCode === 8 && searchFocus == 0) || e.keyCode === 27) { return haltEvent(e); } }
2945 if (xxdialogMode && e.keyCode == 27) { dialogclose(0); }
2946 if (xxdialogMode || xxcurrentView != 0 || e.ctrlKey == true || e.altKey == true || e.metaKey == true) return;
2946 - if (Q('viewselect').value < 3) { if ((e.keyCode === 8 && searchFocus == 0) || e.keyCode === 27) { return haltEvent(e); } }
2947 - if (Q('viewselect').value == 3) { if ((e.keyCode === 8 && mapSearchFocus == 0) || e.keyCode === 27) { return haltEvent(e); } }
2947 + if (Q('viewselect').value < 4) { if ((e.keyCode === 8 && searchFocus == 0) || e.keyCode === 27) { return haltEvent(e); } }
2948 + if (Q('viewselect').value == 4) { if ((e.keyCode === 8 && mapSearchFocus == 0) || e.keyCode === 27) { return haltEvent(e); } }
2949 }
2950
2951 //function ondocfocus() { }
@@ -3404,6 +3405,7 @@
3405 }
3406 function disconnectAllKvmFunction() { if (xxdialogMode) return false; for (var nodeid in multiDesktop) { multiDesktop[nodeid].Stop(); } multiDesktop = {}; }
3407 function onMultiDesktopStateChange(desk, state) { try { QH('skvmid_' + desk.shortid, ["Disconnected", "Connecting...", "Setup...", '', ''][state]); } catch (ex) {} }
3408 + function onDeviceSearchChanged(e) { if (e.target.id == 'SearchInput') { Q('KvmSearchInput').value = Q('SearchInput').value; } else { Q('SearchInput').value = Q('KvmSearchInput').value; } masterUpdate(5); }
3409
3410 function showMultiDesktopSettings() {
3411 QV('d7amtkvm', false);