[Pkg-mozext-commits] [adblock-plus-element-hiding-helper] 244/483: Use better code to determine element position (borrowed from Adblock Plus)
David Prévot
taffit at moszumanska.debian.org
Thu Jan 22 21:41:45 UTC 2015
This is an automated email from the git hooks/post-receive script.
taffit pushed a commit to branch master
in repository adblock-plus-element-hiding-helper.
commit 8ec856c5d51de1db946ac3b6be78b44954dd91c4
Author: Wladimir Palant <trev at adblockplus.org>
Date: Mon Oct 25 15:07:36 2010 +0200
Use better code to determine element position (borrowed from Adblock Plus)
---
chrome/content/elementmarker.css | 36 +++++++------
chrome/content/overlay.xul | 2 +-
modules/Aardvark.jsm | 108 +++++++++++++++++++++++++--------------
3 files changed, 89 insertions(+), 57 deletions(-)
diff --git a/chrome/content/elementmarker.css b/chrome/content/elementmarker.css
index bc32cb0..cd2da67 100644
--- a/chrome/content/elementmarker.css
+++ b/chrome/content/elementmarker.css
@@ -59,7 +59,7 @@
.%%CLASS%%
{
- position: absolute !important;
+ position: fixed !important;
width: auto !important;
height: auto !important;
@@ -70,9 +70,24 @@
border: 2px solid #ff0000 !important;
}
-.%%CLASS%% > .label,
-.%%CLASS%% > .label > b
+.%%CLASS%% > .label
+{
+ float: left !important;
+ background-color: #fff0cc !important;
+ border-color: #000000 !important;
+ border-width: 0px 2px 1px 2px !important;
+ border-style: solid !important;
+ -moz-border-radius-bottomleft: 6px !important;
+ -moz-border-radius-bottomright: 6px !important;
+ padding: 2px 5px !important;
+ width: auto !important;
+ height: auto !important;
+}
+
+.%%CLASS%% > .label > .labelTag,
+.%%CLASS%% > .label > .labelAddition
{
+ display: inline !important;
font-family: Arial !important;
font-size: 12px !important;
color: #000000 !important;
@@ -97,20 +112,7 @@
word-spacing: 0px !important;
}
-.%%CLASS%% > .label
-{
- float: left !important;
- background-color: #fff0cc !important;
- border-color: #000000 !important;
- border-width: 0px 2px 1px 2px !important;
- border-style: solid !important;
- -moz-border-radius-bottomleft: 6px !important;
- -moz-border-radius-bottomright: 6px !important;
- padding: 2px 5px !important;
-}
-
-.%%CLASS%% > .label > b
+.%%CLASS%% > .label > .labelTag
{
- display: inline !important;
font-weight: bold !important;
}
diff --git a/chrome/content/overlay.xul b/chrome/content/overlay.xul
index f53de83..abd29b2 100644
--- a/chrome/content/overlay.xul
+++ b/chrome/content/overlay.xul
@@ -52,7 +52,7 @@
<tooltip id="ehh-elementmarker">
<html:div>
<html:div class="border"/>
- <html:div class="label"/>
+ <html:div class="label"><html:span class="labelTag"/><html:span class="labelAddition"/></html:div>
</html:div>
</tooltip>
</popupset>
diff --git a/modules/Aardvark.jsm b/modules/Aardvark.jsm
index 41a4c1e..1bb30b6 100644
--- a/modules/Aardvark.jsm
+++ b/modules/Aardvark.jsm
@@ -210,7 +210,7 @@ Aardvark.onMouseMove = function(event) {
}
if (elem)
- this.showBoxAndLabel(elem, this.makeElementLabelString(elem));
+ this.showBoxAndLabel(elem);
}
// Makes sure event handlers like Aardvark.keyPress redirect
@@ -240,42 +240,40 @@ Aardvark.appendDescription = function(node, value, className) {
* Highlight frame display *
***************************/
-Aardvark.makeElementLabelString = function(elem) {
- var s = "<b style='color:#000'>" + elem.tagName.toLowerCase() + "</b>";
- if (elem.id != '')
- s += ", id: " + elem.id;
- if (elem.className != '')
- s += ", class: " + elem.className;
- if (elem.style.cssText != '')
- s += ", style: " + elem.style.cssText;
+Aardvark.makeElementLabelString = function(elem)
+{
+ let tagName = elem.tagName.toLowerCase();
+ let addition = "";
+ if (elem.id != "")
+ addition += ", id: " + elem.id;
+ if (elem.className != "")
+ addition += ", class: " + elem.className;
+ if (elem.style.cssText != "")
+ addition += ", style: " + elem.style.cssText;
- return s;
+ return [tagName, addition];
}
-Aardvark.showBoxAndLabel = function(elem, string) {
- var doc = elem.ownerDocument;
- if (!doc || !doc.body)
- return;
-
+Aardvark.showBoxAndLabel = function(elem, string)
+{
this.selectedElem = elem;
- if (this.boxElem.ownerDocument != doc)
- this.boxElem = doc.importNode(this.boxElem, true);
-
- var pos = this.getPos(elem)
- var dims = this.getWindowDimensions (doc);
-
let border = this.boxElem.getElementsByClassName("border")[0];
- let label = this.boxElem.getElementsByClassName("label")[0];
+ let labelTag = this.boxElem.getElementsByClassName("labelTag")[0];
+ let labelAddition = this.boxElem.getElementsByClassName("labelAddition")[0];
- this.boxElem.style.left = (pos.x - 1) + "px";
- this.boxElem.style.top = (pos.y - 1) + "px";
- border.style.width = (elem.offsetWidth - 2) + "px";
- border.style.height = (elem.offsetHeight - 2) + "px";
+ let pos = this.getElementPosition(elem);
+ this.boxElem.style.left = (pos.left - 1) + "px";
+ this.boxElem.style.top = (pos.top - 1) + "px";
+ border.style.width = (pos.right - pos.left - 2) + "px";
+ border.style.height = (pos.bottom - pos.top - 2) + "px";
- label.innerHTML = string;
+ [labelTag.textContent, labelAddition.textContent] = this.makeElementLabelString(elem);
- doc.body.appendChild(this.boxElem);
+ let doc = this.browser.contentDocument;
+ if (this.boxElem.ownerDocument != doc)
+ this.boxElem = doc.importNode(this.boxElem, true);
+ doc.documentElement.appendChild(this.boxElem);
}
Aardvark.clearBox = function() {
@@ -291,17 +289,51 @@ Aardvark.hideTooltips = function()
E("ehh-viewsource").hidePopup();
}
-Aardvark.getPos = function (elem)
+Aardvark.getElementPosition = function(element)
{
- var pos = {x: 0, y: 0};
+ // Restrict rectangle coordinates by the boundaries of a window's client area
+ function intersectRect(rect, wnd)
+ {
+ let doc = wnd.document;
+ let wndWidth = doc.documentElement.clientWidth;
+ let wndHeight = doc.documentElement.clientHeight;
+ if (doc.compatMode == "BackCompat") // clientHeight will be bogus in quirks mode
+ wndHeight = doc.documentElement.offsetHeight - wnd.scrollMaxY;
+
+ rect.left = Math.max(rect.left, 0);
+ rect.top = Math.max(rect.top, 0);
+ rect.right = Math.min(rect.right, wndWidth);
+ rect.bottom = Math.min(rect.bottom, wndHeight);
+ }
- while (elem)
+ let rect = element.getBoundingClientRect();
+ let wnd = element.ownerDocument.defaultView;
+
+ rect = {left: rect.left, top: rect.top,
+ right: rect.right, bottom: rect.bottom};
+ while (true)
{
- pos.x += elem.offsetLeft;
- pos.y += elem.offsetTop;
- elem = elem.offsetParent;
+ intersectRect(rect, wnd);
+
+ if (!wnd.frameElement)
+ break;
+
+ // Recalculate coordinates to be relative to frame's parent window
+ let frameElement = wnd.frameElement;
+ wnd = frameElement.ownerDocument.defaultView;
+
+ let frameRect = frameElement.getBoundingClientRect();
+ let frameStyle = wnd.getComputedStyle(frameElement, null);
+ let relLeft = frameRect.left + parseFloat(frameStyle.borderLeftWidth) + parseFloat(frameStyle.paddingLeft);
+ let relTop = frameRect.top + parseFloat(frameStyle.borderTopWidth) + parseFloat(frameStyle.paddingTop);
+
+ rect.left += relLeft;
+ rect.right += relLeft;
+ rect.top += relTop;
+ rect.bottom += relTop;
}
- return pos;
+
+ return rect;
}
Aardvark.getWindowDimensions = function (doc)
@@ -362,8 +394,7 @@ Aardvark.wider = function (elem)
{
this.widerStack = [elem, newElem];
}
- this.showBoxAndLabel (newElem,
- this.makeElementLabelString (newElem));
+ this.showBoxAndLabel(newElem);
return true;
}
return false;
@@ -379,8 +410,7 @@ Aardvark.narrower = function (elem)
{
this.widerStack.pop();
var newElem = this.widerStack[this.widerStack.length-1];
- this.showBoxAndLabel (newElem,
- this.makeElementLabelString (newElem));
+ this.showBoxAndLabel(newElem);
return true;
}
}
--
Alioth's /usr/local/bin/git-commit-notice on /srv/git.debian.org/git/pkg-mozext/adblock-plus-element-hiding-helper.git
More information about the Pkg-mozext-commits
mailing list