mirror of
https://github.com/fusionpbx/fusionpbx.git
synced 2026-01-06 11:43:50 +00:00
Live on demand domain search.
This commit is contained in:
@@ -298,6 +298,8 @@
|
||||
$('#domains_hide').on('click', function() { hide_domains(); });
|
||||
|
||||
function show_domains() {
|
||||
search_domains('domains_list');
|
||||
|
||||
$('#domains_visible').val(1);
|
||||
var scrollbar_width = (window.innerWidth - $(window).width()); //gold: only solution that worked with body { overflow:auto } (add -ms-overflow-style: scrollbar; to <body> style for ie 10+)
|
||||
if (scrollbar_width > 0) {
|
||||
@@ -308,7 +310,7 @@
|
||||
$(document).scrollTop(0);
|
||||
$('#domains_container').show();
|
||||
$('#domains_block').animate({marginRight: '+=300'}, 400, function() {
|
||||
$('#domains_filter').trigger('focus');
|
||||
$('#domains_search').trigger('focus');
|
||||
});
|
||||
}
|
||||
|
||||
@@ -316,8 +318,7 @@
|
||||
$('#domains_visible').val(0);
|
||||
$(document).ready(function() {
|
||||
$('#domains_block').animate({marginRight: '-=300'}, 400, function() {
|
||||
$('#domains_filter').val('');
|
||||
domain_search($('#domains_filter').val());
|
||||
$('#domains_search').val('');
|
||||
$('.navbar').css('margin-right','0'); //restore navbar margin
|
||||
$('#domains_container').css('right','0'); //domain container right position
|
||||
$('#domains_container').hide();
|
||||
@@ -556,7 +557,6 @@
|
||||
});
|
||||
{/literal}
|
||||
|
||||
|
||||
//link list rows
|
||||
{literal}
|
||||
$('.tr_hover tr,.list tr').each(function(i,e) {
|
||||
@@ -1017,6 +1017,94 @@
|
||||
{*//session timer *}
|
||||
{$session_timer}
|
||||
|
||||
{*//domain selector *}
|
||||
function search_domains(element_id) {
|
||||
var xhttp = new XMLHttpRequest();
|
||||
xhttp.onreadystatechange = function() {
|
||||
//if (this.readyState == 4 && this.status == 200) {
|
||||
// document.getElementById(element_id).innerHTML = this.responseText;
|
||||
//}
|
||||
|
||||
//remove current options
|
||||
document.getElementById(element_id).innerHTML = '';
|
||||
|
||||
if (this.readyState == 4 && this.status == 200) {
|
||||
|
||||
//create the json object from the response
|
||||
obj = JSON.parse(this.responseText);
|
||||
|
||||
//update the domain count
|
||||
document.getElementById('domain_count').innerText = '('+ obj.length +')';
|
||||
|
||||
//add new options from the json results
|
||||
for (var i=0; i < obj.length; i++) {
|
||||
|
||||
//get the variables
|
||||
domain_uuid = obj[i].domain_uuid;
|
||||
domain_name = obj[i].domain_name;
|
||||
if (obj[i].domain_description != null) {
|
||||
// domain_description = DOMPurify.sanitize(obj[i].domain_description);
|
||||
}
|
||||
|
||||
//create a div element
|
||||
var div = document.createElement('div');
|
||||
|
||||
//add a div title
|
||||
div.title = obj[i].domain_name;
|
||||
|
||||
//add a css class
|
||||
div.classList.add("domains_list_item");
|
||||
|
||||
//alternate the background color
|
||||
if(i%2==0) {
|
||||
div.style.background = '{$domain_selector_background_color_1}';
|
||||
}
|
||||
else {
|
||||
div.style.background = '{$domain_selector_background_color_2}';
|
||||
}
|
||||
|
||||
//set the active domain style
|
||||
if ('{$domain_uuid}' == obj[i].domain_uuid) {
|
||||
div.style.background = '{$domain_active_background_color}';
|
||||
div.style.fontWeight = 'bold';
|
||||
//div.classList.add("domains_list_item_active");
|
||||
//var item_description_class = 'domain_active_list_item_description';
|
||||
}
|
||||
else {
|
||||
//div.classList.add("domains_list_item_inactive");
|
||||
//var item_description_class = 'domain_inactive_list_item_description';
|
||||
}
|
||||
|
||||
link_label = obj[i].domain_name;
|
||||
if (obj[i].domain_description != null) {
|
||||
link_label += ' - ' + obj[i].domain_description;
|
||||
}
|
||||
var a_tag = document.createElement('a');
|
||||
a_tag.setAttribute('href','{$domains_app_path}?domain_uuid='+obj[i].domain_uuid+'&domain_change=true');
|
||||
a_tag.innerText = link_label;
|
||||
div.appendChild(a_tag);
|
||||
|
||||
//div.innerHTML = '<a href="{$domains_app_path}?domain_uuid='+obj[i].domain_uuid+'&domain_change=true">'+obj[i].domain_name+'</a> ';
|
||||
//if (obj[i].domain_description != null) {
|
||||
// div.innerHTML += '<span class="domain_list_item_description" title="'+obj[i].domain_description+'"> - '+obj[i].domain_description+'</span>';
|
||||
//}
|
||||
|
||||
document.getElementById(element_id).appendChild(div);
|
||||
}
|
||||
}
|
||||
};
|
||||
search = document.getElementById('domains_search');
|
||||
if (search.value) {
|
||||
//xhttp.open("GET", "/core/domains/domain_list.php?search="+search.value, true);
|
||||
xhttp.open("GET", "/core/domains/domain_json.php?search="+search.value, true);
|
||||
}
|
||||
else {
|
||||
//xhttp.open("GET", "/core/domains/domain_list.php", true);
|
||||
xhttp.open("GET", "/core/domains/domain_json.php", true);
|
||||
}
|
||||
xhttp.send();
|
||||
}
|
||||
{*//domain selector *}
|
||||
</script>
|
||||
|
||||
</head>
|
||||
@@ -1033,70 +1121,11 @@
|
||||
<div id='domains_block'>
|
||||
<div id='domains_header'>
|
||||
<input id='domains_hide' type='button' class='btn' style='float: right' value="{$text.theme_button_close}">
|
||||
<a id='domains_title' href='{$domains_app_path}'>{$text.theme_title_domains} <span style='font-size: 80%;'>({$domain_count})</span></a>
|
||||
<a id='domains_title' href='{$domains_app_path}'>{$text.theme_title_domains} <span id='domain_count' style='font-size: 80%;'></span></a>
|
||||
<br><br>
|
||||
<input type='text' id='domains_filter' class='formfld' style='margin-left: 0; min-width: 100%; width: 100%;' placeholder="{$text.theme_label_search}" onkeyup='domain_search(this.value)'>
|
||||
<input type='text' id='domains_search' class='formfld' style='margin-left: 0; min-width: 100%; width: 100%;' placeholder="{$text.theme_label_search}" onkeyup="search_domains('domains_list');">
|
||||
</div>
|
||||
<div id='domains_list'>
|
||||
{foreach $domains as $row}
|
||||
{if $row.domain_enabled}
|
||||
{*//alternate background colors of inactive domains *}
|
||||
{if $background_color == $domain_selector_background_color_1}
|
||||
{$background_color=$domain_selector_background_color_2}
|
||||
{else}
|
||||
{$background_color=$domain_selector_background_color_1}
|
||||
{/if}
|
||||
{*//set active domain color *}
|
||||
{if $domain_active_background_color != ''}
|
||||
{if $row.domain_uuid == $domain_uuid}{$background_color=$domain_active_background_color}{/if}
|
||||
{/if}
|
||||
{*//active domain text hover color *}
|
||||
{if $settings.theme.domain_active_text_color_hover != '' && $row.domain_uuid == $domain_uuid}
|
||||
<div id='{$row.domain_name}' class='domains_list_item_active' style='background-color: {$background_color}' onclick="document.location.href='{$domains_app_path}?domain_uuid={$row.domain_uuid}&domain_change=true';">
|
||||
{elseif $settings.theme.domain_inactive_text_color_hover != '' && $row.domain_uuid != $domain_uuid}
|
||||
<div id='{$row.domain_name}' class='domains_list_item_inactive' style='background-color: {$background_color}' onclick="document.location.href='{$domains_app_path}?domain_uuid={$row.domain_uuid}&domain_change=true';">
|
||||
{else}
|
||||
<div id='{$row.domain_name}' class='domains_list_item' style='background-color: {$background_color}' onclick="document.location.href='{$domains_app_path}?domain_uuid={$row.domain_uuid}&domain_change=true';">
|
||||
{/if}
|
||||
{*//domain link *}
|
||||
<a href='{$domains_app_path}?domain_uuid={$row.domain_uuid}&domain_change=true' {if $row.domain_uuid == $domain_uuid}style='font-weight: bold;'{/if}>{$row.domain_name}</a>
|
||||
{*//domain description *}
|
||||
{if $row.domain_description != ''}
|
||||
{*//active domain description text color *}
|
||||
{if $settings.theme.domain_active_desc_text_color != '' && $row.domain_uuid == $domain_uuid}
|
||||
<span class='domain_active_list_item_description' title="{$row.domain_description}"> - {$row.domain_description}</span>
|
||||
{*//inactive domains description text color *}
|
||||
{elseif $settings.theme.domain_inactive_desc_text_color != '' && $row.domain_uuid != $domain_uuid}
|
||||
<span class='domain_inactive_list_item_description' title="{$row.domain_description}"> - {$row.domain_description}</span>
|
||||
{*//default domain description text color *}
|
||||
{else}
|
||||
<span class='domain_list_item_description' title="{$row.domain_description}"> - {$row.domain_description}</span>
|
||||
{/if}
|
||||
{/if}
|
||||
</div>
|
||||
{$ary_domain_names[]=$row.domain_name}
|
||||
{$ary_domain_descs[]=$row.domain_description|replace:'"':'\"'}
|
||||
{/if}
|
||||
{/foreach}
|
||||
</div>
|
||||
|
||||
<script>
|
||||
{literal}
|
||||
var domain_names = new Array("{/literal}{'","'|implode:$ary_domain_names}{literal}");
|
||||
var domain_descs = new Array("{/literal}{'","'|implode:$ary_domain_descs}{literal}");
|
||||
function domain_search(criteria) {
|
||||
for (var x = 0; x < domain_names.length; x++) {
|
||||
if (domain_names[x].toLowerCase().match(criteria.toLowerCase()) || domain_descs[x].toLowerCase().match(criteria.toLowerCase())) {
|
||||
document.getElementById(domain_names[x]).style.display = '';
|
||||
}
|
||||
else {
|
||||
document.getElementById(domain_names[x]).style.display = 'none';
|
||||
}
|
||||
}
|
||||
}
|
||||
{/literal}
|
||||
</script>
|
||||
|
||||
<div id='domains_list'></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user