comboLookup.js 3.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117
  1. function comboClear(dom) {
  2. let elem = qi('comboContainer_' + dom)
  3. if (elem) { elem.style.display = 'none' }
  4. activeCombo = undefined; currentItem = undefined;
  5. }
  6. function comboSelect(dom, row, feed, mod, id) {
  7. let elem = qi(dom); comboClear(dom);
  8. let selected_value = string(row);
  9. if (qi(id)) {
  10. let bind = qi(id).getAttribute('data-bind')
  11. elem.setAttribute("data-bind", bind);
  12. selected_value = dec(unbase64(bind));
  13. }
  14. elem.value = row;
  15. elem.style.backgroundColor = 'white';
  16. direct(tuple(atom('comboSelect'),
  17. selected_value,
  18. string(dom),
  19. string(feed),
  20. atom(mod)));
  21. }
  22. function comboLookupChange(dom) {
  23. let elem = qi(dom);
  24. if (elem && elem.value == "" && elem.getAttribute("data-bind")) {
  25. elem.removeAttribute("data-bind");
  26. }
  27. }
  28. function comboLookupClick(dom, feed, mod) {
  29. var char = event.which || event.keyCode;
  30. if (char == 1 && !activeCombo && qi(dom).value == '') {
  31. activeCombo = dom;
  32. currentItem = undefined;
  33. direct(tuple(atom('comboKey'),
  34. atom('all'),
  35. string(dom),
  36. string(feed),
  37. atom(mod)));
  38. return
  39. } else if(char == 1 && activeCombo == dom){comboClear(dom);}
  40. }
  41. function comboLookupKeydown(dom, feed, mod) {
  42. var char = event.which || event.keyCode;
  43. if (char == 40 && !activeCombo && qi(dom).value == '') {
  44. activeCombo = dom;
  45. currentItem = undefined;
  46. direct(tuple(atom('comboKey'),
  47. atom('all'),
  48. string(dom),
  49. string(feed),
  50. atom(mod)));
  51. return
  52. }
  53. if (activeCombo && [38, 40].includes(char)) {
  54. event.preventDefault();
  55. console.log('Keycode: ' + char + ", DOM: " + dom);
  56. if (char == 40) { set_focus( currentItem && ( !cycleEnabled || currentItem.nextSibling)
  57. ? currentItem.nextSibling : qi('comboContainer_' + dom).firstChild, true) }
  58. if (char == 38) { set_focus( currentItem && ( !cycleEnabled || currentItem.previousSibling)
  59. ? currentItem.previousSibling : qi('comboContainer_' + dom).lastChild, true) }
  60. }
  61. }
  62. function comboLookupKeyup(dom, feed, mod) {
  63. var char = event.which || event.keyCode;
  64. if (char == 27 || (char == 8 || char == 46) && qi(dom).value == '') {
  65. qi(dom).value = '';
  66. comboClear(dom);
  67. return
  68. }
  69. if (char == 13 && currentItem) { currentItem.click(); return }
  70. if ([33, 34, 35, 36, 37, 39].includes(char)) { return }
  71. if (activeCombo && [38, 40].includes(char)) { return }
  72. else {
  73. activeCombo = dom;
  74. currentItem = undefined;
  75. direct(tuple(atom('comboKey'),
  76. bin(qi(dom).value),
  77. string(dom),
  78. string(feed),
  79. atom(mod)));
  80. }
  81. }
  82. function comboLookupMouseMove(dom) {
  83. set_focus(event.target.closest('.dropdown-item'), false)
  84. }
  85. function set_focus(elem, scroll) {
  86. if (elem) {
  87. if(currentItem) {currentItem.className = "dropdown-item"}
  88. elem.className = "dropdown-item focus"
  89. if (scroll==true) {elem.scrollIntoView({block: "nearest", inline: "nearest"})}
  90. currentItem = elem
  91. }
  92. }
  93. document.addEventListener("click", () => {
  94. if (activeCombo && event.target.className != 'triangle' &&
  95. !event.target.closest('#comboContainer_' + activeCombo)) {
  96. qi(activeCombo).value = '';
  97. comboClear(activeCombo);
  98. }
  99. })
  100. function comboLostFocus(e) { }
  101. function comboOnFocus(e) { }
  102. function comboLookupMouseOut(dom) { }
  103. var activeCombo = undefined
  104. var currentItem = undefined
  105. var cycleEnabled = false