TList = function(param) {
return {
html: `
`,
objName: param.objName,
blockName: param.blockName,
elementName: param.elementName,
elementType: param.elementType,
infoId: param.infoId,
header: param.header,
title: param.title,
valueMask: param.valueMask,
placeholder: param.placeholder,
isRequired: (('isRequired' in param) ? param.isRequired : false),
timeHide: null,
timePeriod: 1000,
timeAttempt: 0,
getHtml: function(){
let infoIdContent = '';
let infoIdDom = document.getElementById(this.infoId);
if (infoIdDom) {
infoIdContent = infoIdDom.innerHTML;
}
let labelDop = ((this.header) ? '' : 'style="display:none;"');
let commentDop = ((infoIdContent) ? '' : 'style="display:none;"');
return this.html
.replace(new RegExp('BBBobjNameBBB', 'gim'), this.objName)
.replace(new RegExp('BBBblockNameBBB', 'gim'), this.blockName)
.replace(new RegExp('BBBelementNameBBB', 'gim'), this.elementName)
.replace(new RegExp('BBBelementObjBBB', 'gim'), this.objName)
.replace(new RegExp('BBBinfoBBB', 'gim'), infoIdContent)
.replace(new RegExp('BBBheaderBBB', 'gim'), this.header)
.replace(new RegExp('BBBtitleBBB', 'gim'), this.title)
.replace(new RegExp('BBBvalueMaskBBB', 'gim'), this.valueMask)
.replace(new RegExp('BBBplaceholderBBB', 'gim'), this.placeholder)
.replace(new RegExp('BBBlabelDopBBB', 'gim'), labelDop)
.replace(new RegExp('BBBcommentDopBBB', 'gim'), commentDop)
.replace(new RegExp('BBBdatasetValueBBB', 'gim'), ((param.datasetValue) ? param.datasetValue : ''))
.replace(new RegExp('BBBdatasetTxtValueBBB', 'gim'), ((param.datasetTxtValue) ? param.datasetTxtValue : ''))
;
},
showList: function(data, txt){
let res = document.getElementById(this.blockName + '_' + this.elementName + '_res');
if (res) {
let txtValue = txt.value;
if (txtValue) {
/*
res.innerHTML = '' + (data.map(element => {
let res = '';
let exp = new RegExp('('+txtValue+')', 'im');
res += ''
+ element.txt.replace(exp, '$&')
+ ''
;
return res;
})).join('') + '';
*/
res.innerHTML = (data.map(element => {
let res = '';
let exp = new RegExp('('+txtValue+')', 'im');
res += ''
+ element.txt.replace(exp, '$&')
+ ''
;
return res;
})).join('');
res.style.display = 'block';
if (data.length == 1) {
let firstElement = res.querySelector('li');
if (firstElement) {
firstElement.classList.add('eReg__activelistarrow');
}
}
let arrow = document.getElementById(this.blockName + '_' + this.elementName + '_arrow');
if (arrow) {
if (arrow.dataset.up) arrow.classList.remove(arrow.dataset.up);
if (arrow.dataset.down) arrow.classList.add(arrow.dataset.down);
}
this.timeAttempt = 0;
if (this.timeHide) window.clearInterval(this.timeHide);
this.timeHide = window.setInterval(()=>{
let element = document.getElementById(this.blockName + '_' + this.elementName);
let activeElement = document.activeElement;
if (element) {
if ((this.timeAttempt>1) && (element != activeElement)){
window.clearInterval(this.timeHide);
this.hideList();
if ((!element.dataset.value) || (element.dataset.txtValue != element.value)){
this.clear();
let e = new CustomEvent(this.blockName + 'ClearData', {
bubbles: true,
cancelable: true,
composed: true,
detail: {
'event': {},
'blockName': this.blockName,
'elementName':this.elementName,
'elementType':this.elementType,
'element': txt,
},
});
document.dispatchEvent(e);
}
}
this.timeAttempt++;
}
}, this.timePeriod);
} else {
this.hideList();
}
}
},
setValue: function(ev, t){
if ((t) && ('dataset' in t) && (t.dataset)) {
if (t.dataset.target){
let targerDom = document.getElementById(t.dataset.target);
if (targerDom) {
targerDom.value = t.dataset.text;
targerDom.dataset.value = t.dataset.value;
targerDom.dataset.txtValue = t.dataset.text;
let e = new CustomEvent(this.blockName + 'SetData', {
bubbles: true,
cancelable: true,
composed: true,
detail: {
'event': ev,
'blockName': this.blockName,
'elementName':this.elementName,
'elementType':this.elementType,
'element': t,
},
});
document.dispatchEvent(e);
}
}
}
this.hideList();
},
hideList: function(){
let res = document.getElementById(this.blockName + '_' + this.elementName + '_res');
if (res) {
res.innerHTML = ''
res.style.display = 'none';
let arrow = document.getElementById(this.blockName + '_' + this.elementName + '_arrow');
if (arrow) {
if (arrow.dataset.down) arrow.classList.remove(arrow.dataset.down);
if (arrow.dataset.up) arrow.classList.add(arrow.dataset.up);
}
}
},
click: function(ev, t){
},
keydown: function(ev, t){
let res = document.getElementById(this.blockName + '_' + this.elementName);
if (res) {
let code = 0;
if (ev.which == null) {
code = ev.keyCode;
} else {
if (ev.which) {
code = ev.which;
}
}
if (ev.customKeyCode) {
code = ev.customKeyCode;
}
/* ESC */
if (code == 27) {
this.clear();
/*
window.setTimeout(() => {
*/
let e = new CustomEvent(this.blockName + 'ClearData', {
bubbles: true,
cancelable: true,
composed: true,
detail: {
'event': ev,
'blockName': this.blockName,
'elementName':this.elementName,
'elementType':this.elementType,
'element': res,
},
});
document.dispatchEvent(e);
/*
}, 10);
*/
}
/* Enter */
if (code == 13){
let list = document.getElementById(this.blockName + '_' + this.elementName + '_res');
if (
(list)
&&(list.style.display != 'none')
){
let actElementDom = list.querySelector('li.eReg__activelistarrow');
if (actElementDom) {
/*
window.setTimeout(() => {
*/
let e = new CustomEvent(this.blockName + 'ClearData', {
bubbles: true,
cancelable: true,
composed: true,
detail: {
'event': ev,
'blockName': this.blockName,
'elementName':this.elementName,
'elementType':this.elementType,
'element': res,
},
});
document.dispatchEvent(e);
/*let elA = actElementDom.querySelector('a');
this.setValue(ev, elA);
*/
this.setValue(ev, actElementDom);
let nextElement = clAlert.findNextTabStop(res);
if (nextElement) {
nextElement.focus();
}
/*
}, 10);
*/
} else {
if (res.dataset.txtValue != res.value){
this.clear();
/*
window.setTimeout(() => {
*/
let e = new CustomEvent(this.blockName + 'ClearData', {
bubbles: true,
cancelable: true,
composed: true,
detail: {
'event': ev,
'blockName': this.blockName,
'elementName':this.elementName,
'elementType':this.elementType,
'element': res,
},
});
document.dispatchEvent(e);
/*
}, 10);
*/
} else {
if (
(res.dataset.txtValue)
&&(res.dataset.txtValue == res.value)
) {
let nextElement = clAlert.findNextTabStop(res);
if (nextElement) {
nextElement.focus();
}
}
}
}
}
if (
(list)
&&(list.style.display == 'none')
){
if (
(res.value == '')
||(!res.dataset.value)
||(res.dataset.txtValue != res.value)
){
this.clear();
/*
window.setTimeout(() => {
*/
let e = new CustomEvent(this.blockName + 'ClearData', {
bubbles: true,
cancelable: true,
composed: true,
detail: {
'event': ev,
'blockName': this.blockName,
'elementName':this.elementName,
'elementType':this.elementType,
'element': res,
},
});
document.dispatchEvent(e);
/*
}, 10);
*/
} else {
let nextElement = clAlert.findNextTabStop(res);
if (nextElement) {
nextElement.focus();
}
}
}
this.hideList();
}
/* TAB */
if (code == 9){
let list = document.getElementById(this.blockName + '_' + this.elementName + '_res');
if (
(list)
&&(list.style.display != 'none')
){
let actElementDom = list.querySelector('li.eReg__activelistarrow');
if (actElementDom) {
/*
window.setTimeout(() => {
*/
let e = new CustomEvent(this.blockName + 'ClearData', {
bubbles: true,
cancelable: true,
composed: true,
detail: {
'event': ev,
'blockName': this.blockName,
'elementName':this.elementName,
'elementType':this.elementType,
'element': res,
},
});
document.dispatchEvent(e);
/*
let elA = actElementDom.querySelector('a');
this.setValue(ev, elA);
*/
this.setValue(ev, actElementDom);
/*
}, 10);
*/
} else {
if (res.dataset.txtValue != res.value){
this.clear();
/*
window.setTimeout(() => {
*/
let e = new CustomEvent(this.blockName + 'ClearData', {
bubbles: true,
cancelable: true,
composed: true,
detail: {
'event': ev,
'blockName': this.blockName,
'elementName':this.elementName,
'elementType':this.elementType,
'element': res,
},
});
document.dispatchEvent(e);
/*
}, 10);
*/
}
}
} else {
if (
(!res.dataset.txtValue)
&& (res.dataset.txtValue != res.value)
){
this.clear();
window.setTimeout(() => {
let e = new CustomEvent(this.blockName + 'ClearData', {
bubbles: true,
cancelable: true,
composed: true,
detail: {
'event': ev,
'blockName': this.blockName,
'elementName':this.elementName,
'elementType':this.elementType,
'element': res,
},
});
document.dispatchEvent(e);
}, 10);
}
}
this.hideList();
}
/* Стрелка вниз */
if (code == 40){
let list = document.getElementById(this.blockName + '_' + this.elementName + '_res');
if (
(list)
&&(list.style.display != 'none')
){
let actElementDom = list.querySelector('li.eReg__activelistarrow');
if (actElementDom) {
let nextElement = actElementDom.nextElementSibling;
if (nextElement) {
actElementDom.classList.remove('eReg__activelistarrow');
nextElement.classList.add('eReg__activelistarrow');
nextElement.scrollIntoView({block: 'nearest'});
}
} else {
let firstElementDom = list.querySelector('li');
/*
let firstElementDomA = firstElementDom.querySelector('a');
*/
if (
(firstElementDom)
&&(firstElementDom.dataset)
&&('value' in firstElementDom.dataset)
){
firstElementDom.classList.add('eReg__activelistarrow');
firstElementDom.scrollIntoView({block: 'nearest'});
}
}
} else {
let e = new CustomEvent(this.blockName + 'GetData', {
bubbles: true,
cancelable: true,
composed: true,
detail: {
'event': ev,
'blockName': this.blockName,
'elementName':this.elementName,
'elementType':this.elementType,
'element': res,
},
});
document.dispatchEvent(e);
}
}
/* Стрелка вверх */
if (code == 38){
let list = document.getElementById(this.blockName + '_' + this.elementName + '_res');
if (
(list)
&&(list.style.display != 'none')
){
let actElementDom = list.querySelector('li.eReg__activelistarrow');
if (actElementDom) {
let previousElement = actElementDom.previousElementSibling;
if (previousElement) {
actElementDom.classList.remove('eReg__activelistarrow');
previousElement.classList.add('eReg__activelistarrow');
previousElement.scrollIntoView({block: 'nearest'});
}
}
}
}
}
},
clear: function(){
let res = document.getElementById(this.blockName + '_' + this.elementName);
if (res) {
res.value = '';
res.dataset.value = '';
this.hideList();
}
},
input: function(ev, t){
let e = new CustomEvent(this.blockName + 'GetData', {
bubbles: true,
cancelable: true,
composed: true,
detail: {
'event': ev,
'blockName': this.blockName,
'elementName':this.elementName,
'elementType':this.elementType,
'element': t,
},
});
document.dispatchEvent(e);
},
focus: function(ev, t){
t.classList.remove('input-error');
t.select();
},
blur: function(ev, t){
window.setTimeout(() => {
if ((!t.value) && (this.isRequired)) {
t.classList.add('input-error');
}
}, 500);
},
arrowClick: function(ev, t){
let res = document.getElementById(this.blockName + '_' + this.elementName);
if (
(res)
&&(t.dataset.up)
&&(t.dataset.down)
){
if (t.classList.contains(t.dataset.up)){
let e = new CustomEvent(this.blockName + 'GetData', {
bubbles: true,
cancelable: true,
composed: true,
detail: {
'event': ev,
'blockName': this.blockName,
'elementName':this.elementName,
'elementType':this.elementType,
'element': res,
},
});
document.dispatchEvent(e);
res.focus();
} else {
this.hideList();
}
}
},
};
};