// ==UserScript== // @name 3CX TAPI // @version 1 // @grant GM.xmlHttpRequest // @include https://192.168.0.154:5001/webclient* // @include https://cpsolution.my3cx.at:5001/webclient* // @downloadURL http://scootaloo.cp-austria.at/gitlist/3cx_tapi.git/raw/master/3CX_TAPI.user.js // @require https://cdn.jsdelivr.net/gh/CoeJoder/waitForKeyElements.js@v1.2/waitForKeyElements.js // ==/UserScript== console.log('TAPI init'); function fireChangeEvents(element){ var changeEvent = null; changeEvent = document.createEvent ("HTMLEvents"); changeEvent.initEvent ("input", true, true); element.dispatchEvent (changeEvent); console.debug('input event dispatched for element: '+element.id); changeEvent = document.createEvent ("HTMLEvents"); changeEvent.initEvent ("keyup", true, true); element.dispatchEvent (changeEvent); console.debug('keyup event dispatched for element: '+element.id); changeEvent = document.createEvent ("HTMLEvents"); changeEvent.initEvent ("change", true, true); element.dispatchEvent (changeEvent); console.debug('change event dispatched for element: '+element.id); } var doSearch = function() { var search = document.getElementById('tapiSearchInput'); var searchText = search.value.trim(); if (searchText == '') { return; } console.log('Searching TAPI'); GM.xmlHttpRequest({ method: 'GET', url: 'http://cpatapi.cpsrvweb2016.cp-austria.at/search?query=' + encodeURIComponent(searchText), onload: function(response) { console.log('TAPI Search response', response); var contacts = JSON.parse(response.responseText); console.log('TAPI Contacts', contacts); var resultList = document.getElementById('tapiResults'); if (resultList) { resultList.parentNode.removeChild(resultList); } resultList = document.createElement('ul'); resultList.id = 'tapiResults'; resultList.classList.add('search-nav-absolute'); resultList.classList.add('search-nav-ul'); document.getElementById('tapiSearchBox').appendChild(resultList); resultList.innerHTML = ''; for(var i = 0; i < contacts.length; i++) { var li = document.createElement('li'); li.classList.add('search-result'); li.classList.add('pointer'); li.onmouseover = function() { this.classList.add('bg-light'); }; li.onmouseout = function() { this.classList.remove('bg-light'); }; li.contact = contacts[i]; li.onclick = function() { var contact = this.contact; var searchInput = document.getElementsByName('searchByNumberInput'); if (searchInput.length > 0) { searchInput[0].value = contact.tD_NUMBER_TAPI; searchInput[0].focus(); fireChangeEvents(searchInput[0]); } }; li.style.listStyle = 'outside none none';// display: flex; align-items: center; var resultText = document.createElement('div'); resultText.classList.add('search-result-txt'); li.appendChild(resultText); var line1 = document.createElement('div') line1.appendChild(document.createTextNode(contacts[i].tD_NAME)); resultText.appendChild(line1); var line2 = document.createElement('div') line2.appendChild(document.createTextNode(contacts[i].tD_NUMBER_TAPI)); resultText.appendChild(line2); resultList.appendChild(li); } } }); }; waitForKeyElements('div.nav-search', (element) => { console.log('Create TAPI Search'); var form = document.createElement('form'); form.style.width = '200px'; form.style.float = 'right'; form.style.marginRight = '20px'; var searchBox = document.createElement('div'); searchBox.classList.add('contact-search-box'); searchBox.id = 'tapiSearchBox'; form.appendChild(searchBox); var searchWrapper = document.createElement('div'); searchWrapper.classList.add('search-input-wrapper'); searchWrapper.style.position = 'relative'; searchBox.appendChild(searchWrapper); var search = document.createElement('input'); search.id = 'tapiSearchInput'; search.classList.add('padder'); search.classList.add('rounded'); search.classList.add('bg-light'); search.classList.add('no-border'); search.classList.add('contact-search-box'); search.placeholder = 'TAPI Suche'; search.onfocus = doSearch; search.onkeyup = doSearch; search.onblur = function() { console.log('TAPI Search exit'); setTimeout(function() { console.log('TAPI clear search results'); var resultList = document.getElementById('tapiResults'); console.log('TAPI tapiResults', resultList); if (resultList) { resultList.parentNode.removeChild(resultList); }; }, 500); }; searchWrapper.appendChild(search); var icon = document.createElement('span'); icon.classList.add('fa'); icon.classList.add('fa-search'); icon.classList.add('form-control-feedback'); icon.style.color = 'grey'; searchWrapper.appendChild(icon); element.appendChild(form); }, false);