From f0fd9bbfae20bb508a0c42179d6042eca3e5ff84 Mon Sep 17 00:00:00 2001 From: Kyle Spearrin Date: Thu, 29 Sep 2016 20:20:13 -0400 Subject: [PATCH] field icon adjustments when dom changes --- src/content/field.js | 55 ++++++++++++++++++++++++++++++++++++++++---- 1 file changed, 50 insertions(+), 5 deletions(-) diff --git a/src/content/field.js b/src/content/field.js index 1a6f334cde..d84482b8c5 100644 --- a/src/content/field.js +++ b/src/content/field.js @@ -12,18 +12,58 @@ document.addEventListener('DOMContentLoaded', function () { setFieldOverlayIcons(); - var bodies = document.querySelectorAll('body'); + var bodies = document.querySelectorAll('body'), + setIconsTimeoutId = null; + if (bodies.length > 0) { - observeDOM(bodies[0], function () { - //causes infinite loop - //setTimeout(setFieldOverlayIcons, 1000); + var obs = new window.MutationObserver(function (mutations, observer) { + var refreshIcons = false; + for (var i = 0; i < mutations.length; i++) { + var mutation = mutations[i]; + for (var j = 0; j < mutation.addedNodes.length; j++) { + if (mutation.addedNodes[j].className !== 'bitwarden-field-icon') { + refreshIcons = true; + break; + } + } + + if (refreshIcons) { + break; + } + + for (var j = 0; j < mutation.removedNodes.length; j++) { + if (mutation.removedNodes[j].className !== 'bitwarden-field-icon') { + refreshIcons = true; + break; + } + } + + if (refreshIcons) { + break; + } + } + + if (refreshIcons) { + if (setIconsTimeoutId) { + clearTimeout(setIconsTimeoutId); + setIconsTimeoutId = null; + } + + //setFieldOverlayIcons(); + setIconsTimeoutId = setTimeout(setFieldOverlayIcons, 1000); + } + else { + adjustIconPositions(); + } }); + + obs.observe(bodies[0], { childList: true, subtree: true, attributes: true, characterData: true, attributeFilter: ['style'] }); } }, false); function setFieldOverlayIcons() { for (var i = 0; i < icons.length; i++) { - icons[i].parentElement.removeChild(icons[i]); + icons[i].icon.parentElement.removeChild(icons[i].icon); } icons = []; @@ -52,7 +92,12 @@ for (i = 0; i < iconFields.length; i++) { var element = getElement(iconFields[i].opid); + if (!element.offsetHeight) { + continue; + } + var div = document.createElement('div'); + div.className = 'bitwarden-field-icon'; div.style.cssText = 'position: absolute; z-index: 99999; width: 25px; height: ' + element.offsetHeight + 'px;' + 'background-position: center center; background-repeat: no-repeat; cursor: pointer;'; div.style.backgroundImage = "url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/" +