Fixed dropdown menus behavior on linux.
This commit is contained in:
@@ -166,7 +166,7 @@
|
||||
<div class="control">
|
||||
<div class="dropdown" id="zones-dropdown" onclick="toggle(this, event);" title="Select your TLD - Top Level Domain">
|
||||
<div class="dropdown-trigger">
|
||||
<button class="button" aria-haspopup="true" aria-controls="zones-menu" onblur="closeZonesDropdown()">
|
||||
<button class="button" aria-haspopup="true" aria-controls="zones-menu">
|
||||
<span id="zones-current-name">Select zone</span>
|
||||
<span class="icon is-small">
|
||||
<svg viewBox="0 0 24 24" style="width: 20px; height: 20px;"><path d="M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z"></path></svg>
|
||||
@@ -184,7 +184,7 @@
|
||||
<div class="control">
|
||||
<div class="dropdown" id="advanced-dropdown" onclick="toggle(this, event);">
|
||||
<div class="dropdown-trigger">
|
||||
<button class="button" aria-haspopup="true" aria-controls="advanced-menu" onblur="closeAdvancedDropdown()">
|
||||
<button class="button" aria-haspopup="true" aria-controls="advanced-menu">
|
||||
<span>Advanced</span>
|
||||
<span class="icon is-small">
|
||||
<svg viewBox="0 0 24 24" style="width: 20px; height: 20px;"><path d="M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z"></path></svg>
|
||||
|
||||
+17
-16
@@ -5,6 +5,18 @@ var availableZones = [];
|
||||
var myDomains = [];
|
||||
var currentZone;
|
||||
|
||||
document.addEventListener('click', function (event) {
|
||||
closeDropdowns();
|
||||
});
|
||||
|
||||
function closeDropdowns() {
|
||||
// Get all elements with class="dropdowns" and hide them
|
||||
var dropdowns = document.getElementsByClassName("dropdown is-active");
|
||||
for (i = 0; i < dropdowns.length; i++) {
|
||||
dropdowns[i].classList.remove('is-active');
|
||||
}
|
||||
}
|
||||
|
||||
function addRecord(record) {
|
||||
recordsBuffer.push(record);
|
||||
refreshRecordsList();
|
||||
@@ -187,6 +199,7 @@ function openTab(element, tabName) {
|
||||
|
||||
function toggle(element, event) {
|
||||
event.stopPropagation();
|
||||
closeDropdowns();
|
||||
element.classList.toggle('is-active');
|
||||
}
|
||||
|
||||
@@ -486,20 +499,6 @@ function keystoreChanged(path, pub_key, hash) {
|
||||
var new_domain = document.getElementById("new_domain").disabled = false;
|
||||
}
|
||||
|
||||
function closeZonesDropdown() {
|
||||
var active = document.activeElement;
|
||||
if (active == null || (active.id != 'zones-menu' && active.tagName != 'BODY')) {
|
||||
document.getElementById("zones-dropdown").className = "dropdown";
|
||||
}
|
||||
}
|
||||
|
||||
function closeAdvancedDropdown() {
|
||||
var active = document.activeElement;
|
||||
if (active == null || (active.id != 'advanced-menu' && active.tagName != 'BODY')) {
|
||||
document.getElementById("advanced-dropdown").className = "dropdown";
|
||||
}
|
||||
}
|
||||
|
||||
function refreshZonesList() {
|
||||
var buf = "";
|
||||
availableZones.sort(function compare(rhs, lhs) {
|
||||
@@ -522,7 +521,7 @@ function refreshZonesList() {
|
||||
if (typeof currentZone !== 'undefined' && currentZone.name == value.name) {
|
||||
add_class = "is-active";
|
||||
}
|
||||
buf += "<a id=\"zone-{1}\" class=\"dropdown-item {2}\" onclick=\"changeZone('{3}');\">.{4}</a>"
|
||||
buf += "<a id=\"zone-{1}\" class=\"dropdown-item {2}\" onclick=\"changeZone('{3}', event);\">.{4}</a>"
|
||||
.replace("{1}", value.name)
|
||||
.replace("{2}", add_class)
|
||||
.replace("{3}", value.name)
|
||||
@@ -545,7 +544,9 @@ function zonesChanged(text) {
|
||||
refreshZonesList();
|
||||
}
|
||||
|
||||
function changeZone(zone) {
|
||||
function changeZone(zone, event) {
|
||||
event.stopPropagation();
|
||||
closeDropdowns();
|
||||
availableZones.forEach(function(value, index, array) {
|
||||
if (value.name == zone) {
|
||||
currentZone = value;
|
||||
|
||||
Reference in New Issue
Block a user