|
|
@@ -1,56 +1,102 @@
|
|
|
+function comboOpenFormById(formId) {
|
|
|
+ var form = qi(formId);
|
|
|
+ form && comboOpenForm(form);
|
|
|
+}
|
|
|
+
|
|
|
+function comboCloseFormById(formId) {
|
|
|
+ var form = qi(formId);
|
|
|
+ form && comboCloseForm(form);
|
|
|
+}
|
|
|
+
|
|
|
+function comboOpenForm(container) {
|
|
|
+ var dropdown = container.parentNode.querySelector('.dropdown');
|
|
|
+ container.scrollTop = 0;
|
|
|
+ container.parentNode.classList.add('dropdown-open');
|
|
|
+ dropdown.classList.add('dropdown-open');
|
|
|
+ activeForm = container.id;
|
|
|
+};
|
|
|
+
|
|
|
+function comboCloseForm(container) {
|
|
|
+ container.parentNode.classList.remove('dropdown-open');
|
|
|
+ //container.previousSibling.classList.remove('dropdown-open');
|
|
|
+ activeForm = undefined;
|
|
|
+};
|
|
|
+
|
|
|
+function comboLookupTextApply(dom) {
|
|
|
+ let elem = qi(dom);
|
|
|
+ if (elem) {
|
|
|
+ let textareaSplit = dom.split('_');
|
|
|
+ textareaSplit.pop();
|
|
|
+ const textarea = qi(textareaSplit.join('_'));
|
|
|
+ textarea ? textarea.value = elem.value : null;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
function comboClear(dom) {
|
|
|
let elem = qi('comboContainer_' + dom)
|
|
|
+ var dropdown = qi(dom).closest('.dropdown');
|
|
|
if (elem) { elem.style.display = 'none' }
|
|
|
+ dropdown.classList.remove('dropdown-open');
|
|
|
+ dropdown.classList.remove('is-reversed');
|
|
|
activeCombo = undefined; currentItem = undefined;
|
|
|
}
|
|
|
|
|
|
function comboSelect(dom, row, feed, mod, id) {
|
|
|
- let elem = qi(dom); comboClear(dom);
|
|
|
+ let elem = qi(dom);
|
|
|
+ comboClear(dom);
|
|
|
if (qi(id)) elem.setAttribute("data-bind", qi(id).getAttribute('data-bind'));
|
|
|
elem.value = row;
|
|
|
elem.style.backgroundColor = 'white';
|
|
|
+ var dropdown = qi(dom).closest('.dropdown');
|
|
|
+ dropdown.classList.remove('dropdown-open');
|
|
|
+ dropdown.classList.remove('is-reversed');
|
|
|
+ dropdown.classList.add('dropdown-bind');
|
|
|
+ let value = qi(id) ? dec(unbase64(qi(id).getAttribute('data-bind'))) : string(row);
|
|
|
direct(tuple(atom('comboSelect'),
|
|
|
+ value,
|
|
|
string(dom),
|
|
|
- string(row),
|
|
|
string(feed),
|
|
|
atom(mod)));
|
|
|
+ comboLookupTextApply(dom);
|
|
|
}
|
|
|
|
|
|
function comboLookupChange(dom) {
|
|
|
let elem = qi(dom);
|
|
|
- if (elem && elem.value == "" && elem.getAttribute("data-bind")) {
|
|
|
+ if (elem) {
|
|
|
elem.removeAttribute("data-bind");
|
|
|
+ const dropdown = qi(dom).closest('.dropdown');
|
|
|
+ if (dropdown) { dropdown.classList.remove('dropdown-bind'); }
|
|
|
+ comboLookupTextApply(dom);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
-function clearInput(dom) {
|
|
|
- const input = qi(dom);
|
|
|
- if (input) {
|
|
|
- input.value = '';
|
|
|
- input.removeAttribute('data-bind');
|
|
|
- }
|
|
|
- comboClear(dom);
|
|
|
-}
|
|
|
-
|
|
|
function comboLookupClick(dom, feed, mod) {
|
|
|
+ var dropdown = qi(dom).closest('.dropdown');
|
|
|
var char = event.which || event.keyCode;
|
|
|
if (char == 1 && !activeCombo && qi(dom).value == '') {
|
|
|
activeCombo = dom;
|
|
|
currentItem = undefined;
|
|
|
+ dropdown.classList.add('dropdown-open');
|
|
|
+ if (window.innerHeight - dropdown.getBoundingClientRect().bottom < 100)
|
|
|
+ dropdown.classList.add('is-reversed');
|
|
|
direct(tuple(atom('comboKey'),
|
|
|
atom('all'),
|
|
|
string(dom),
|
|
|
string(feed),
|
|
|
atom(mod)));
|
|
|
return
|
|
|
- } else if(char == 1 && activeCombo == dom){comboClear(dom);}
|
|
|
+ } else if (char == 1 && activeCombo == dom) { comboClear(dom); }
|
|
|
}
|
|
|
|
|
|
function comboLookupKeydown(dom, feed, mod) {
|
|
|
+ var dropdown = qi(dom).closest('.dropdown');
|
|
|
var char = event.which || event.keyCode;
|
|
|
if (char == 40 && !activeCombo && qi(dom).value == '') {
|
|
|
activeCombo = dom;
|
|
|
currentItem = undefined;
|
|
|
+ dropdown.classList.add('dropdown-open');
|
|
|
+ if (window.innerHeight - dropdown.getBoundingClientRect().bottom < 100)
|
|
|
+ dropdown.classList.add('is-reversed');
|
|
|
direct(tuple(atom('comboKey'),
|
|
|
atom('all'),
|
|
|
string(dom),
|
|
|
@@ -58,29 +104,34 @@ function comboLookupKeydown(dom, feed, mod) {
|
|
|
atom(mod)));
|
|
|
return
|
|
|
}
|
|
|
- if (activeCombo && [38, 40].includes(char)) {
|
|
|
+ if (activeCombo && [35, 36, 38, 40].includes(char)) {
|
|
|
event.preventDefault();
|
|
|
- console.log('Keycode: ' + char + ", DOM: " + dom);
|
|
|
if (char == 40) { set_focus( currentItem && ( !cycleEnabled || currentItem.nextSibling)
|
|
|
? currentItem.nextSibling : qi('comboContainer_' + dom).firstChild, true) }
|
|
|
+ if (char == 35) { set_focus( currentItem && ( !cycleEnabled || currentItem.nextSibling)
|
|
|
+ ? currentItem.parentNode.lastChild : currentItem, true) }
|
|
|
+
|
|
|
if (char == 38) { set_focus( currentItem && ( !cycleEnabled || currentItem.previousSibling)
|
|
|
? currentItem.previousSibling : qi('comboContainer_' + dom).lastChild, true) }
|
|
|
+ if (char == 36) { set_focus( currentItem && ( !cycleEnabled || currentItem.previousSibling)
|
|
|
+ ? currentItem.parentNode.firstChild : currentItem, true) }
|
|
|
}
|
|
|
+ if (char == 13) { event.preventDefault(); return }
|
|
|
}
|
|
|
|
|
|
function comboLookupKeyup(dom, feed, mod) {
|
|
|
+ var dropdown = qi(dom).closest('.dropdown')
|
|
|
var char = event.which || event.keyCode;
|
|
|
- if (char == 27 || (char == 8 || char == 46) && qi(dom).value == '') {
|
|
|
- qi(dom).value = '';
|
|
|
- comboClear(dom);
|
|
|
- return
|
|
|
- }
|
|
|
+ if (char == 27 || (char == 8 || char == 46) && qi(dom).value == '') { clearInput(dom); return }
|
|
|
if (char == 13 && currentItem) { currentItem.click(); return }
|
|
|
- if ([33, 34, 35, 36, 37, 39].includes(char)) { return }
|
|
|
- if (activeCombo && [38, 40].includes(char)) { return }
|
|
|
+ if ([33, 34, 37, 39].includes(char)) { return }
|
|
|
+ if (activeCombo && [35, 36, 38, 40].includes(char)) { return }
|
|
|
else {
|
|
|
activeCombo = dom;
|
|
|
currentItem = undefined;
|
|
|
+ dropdown.classList.add('dropdown-open');
|
|
|
+ if (window.innerHeight - dropdown.getBoundingClientRect().bottom < 100)
|
|
|
+ dropdown.classList.add('is-reversed');
|
|
|
direct(tuple(atom('comboKey'),
|
|
|
bin(qi(dom).value),
|
|
|
string(dom),
|
|
|
@@ -102,11 +153,24 @@ function set_focus(elem, scroll) {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
+function clearInput(dom) {
|
|
|
+ const input = qi(dom);
|
|
|
+ if (input) {
|
|
|
+ input.value = '';
|
|
|
+ input.removeAttribute('value');
|
|
|
+ }
|
|
|
+ comboLookupChange(dom);
|
|
|
+ comboClear(dom);
|
|
|
+}
|
|
|
+
|
|
|
document.addEventListener("click", () => {
|
|
|
if (activeCombo && event.target.className != 'triangle' &&
|
|
|
!event.target.closest('#comboContainer_' + activeCombo)) {
|
|
|
qi(activeCombo).value = '';
|
|
|
comboClear(activeCombo);
|
|
|
+ } else if (activeForm && event.target.className != 'triangle' &&
|
|
|
+ !event.target.closest("#" + activeForm)) {
|
|
|
+ comboCloseFormById(activeForm);
|
|
|
}
|
|
|
})
|
|
|
|
|
|
@@ -115,5 +179,6 @@ function comboOnFocus(e) { }
|
|
|
function comboLookupMouseOut(dom) { }
|
|
|
|
|
|
var activeCombo = undefined
|
|
|
+var activeForm = undefined
|
|
|
var currentItem = undefined
|
|
|
var cycleEnabled = false
|
Namdak Tonpa