Bug 662520 - NewTab popup indicator 'arrow' is missing or is pointed to the right instead of left

This commit is contained in:
Lucas Rocha 2011-08-01 11:03:00 -04:00
Родитель 5f6d0d266e
Коммит cf4ab51fd0
2 изменённых файлов: 80 добавлений и 17 удалений

Просмотреть файл

@ -80,18 +80,19 @@
<property name="offset" onget="return parseInt(this.getAttribute('offset')) || 0;" <property name="offset" onget="return parseInt(this.getAttribute('offset')) || 0;"
onset="this.setAttribute('offset', val); return val;"/> onset="this.setAttribute('offset', val); return val;"/>
<field name="anchorNode">null</field> <method name="_updateArrow">
<method name="anchorTo"> <parameter name="popupRect"/>
<parameter name="aAnchorNode"/> <parameter name="targetRect"/>
<parameter name="horizPos"/>
<parameter name="vertPos"/>
<body> <body>
<![CDATA[ <![CDATA[
let arrow = document.getAnonymousElementByAttribute(this, "anonid", "arrow"); let arrow = document.getAnonymousElementByAttribute(this, "anonid", "arrow");
if (!aAnchorNode) { if (!popupRect || !targetRect) {
arrow.hidden = true; arrow.hidden = true;
return; return;
} }
this.anchorNode = aAnchorNode;
let container = document.getAnonymousElementByAttribute(this, "anonid", "container"); let container = document.getAnonymousElementByAttribute(this, "anonid", "container");
let content = document.getAnonymousElementByAttribute(this, "anonid", "arrowcontent"); let content = document.getAnonymousElementByAttribute(this, "anonid", "arrowcontent");
let arrowbox = document.getAnonymousElementByAttribute(this, "anonid", "arrowbox"); let arrowbox = document.getAnonymousElementByAttribute(this, "anonid", "arrowbox");
@ -107,15 +108,6 @@
this.style.minHeight = (window.innerHeight - parseInt(this.top) - kBottomMargin) + "px"; this.style.minHeight = (window.innerHeight - parseInt(this.top) - kBottomMargin) + "px";
} }
let anchorRect = aAnchorNode.getBoundingClientRect();
let popupRect = this.getBoundingClientRect();
let offset = this.offset;
let horizPos = (Math.round(popupRect.right) <= Math.round(anchorRect.left + offset)) ? -1 :
(Math.round(popupRect.left) >= Math.round(anchorRect.right - offset)) ? 1 : 0;
let vertPos = (Math.round(popupRect.bottom) <= Math.round(anchorRect.top + offset)) ? -1 :
(Math.round(popupRect.top) >= Math.round(anchorRect.bottom - offset)) ? 1 : 0;
let HALF_ARROW_WIDTH = 16; let HALF_ARROW_WIDTH = 16;
let anchorClass = ""; let anchorClass = "";
@ -126,7 +118,7 @@
if (vertPos == 0) { if (vertPos == 0) {
hideArrow = true; hideArrow = true;
} else { } else {
arrowbox.style.marginLeft = ((anchorRect.left - popupRect.left) + (anchorRect.width / 2) - HALF_ARROW_WIDTH) + "px"; arrowbox.style.marginLeft = ((targetRect.left - popupRect.left) + (targetRect.width / 2) - HALF_ARROW_WIDTH) + "px";
if (vertPos == 1) { if (vertPos == 1) {
container.dir = "normal"; container.dir = "normal";
anchorClass = "top"; anchorClass = "top";
@ -138,7 +130,7 @@
} else if (vertPos == 0) { } else if (vertPos == 0) {
container.orient = ""; container.orient = "";
arrowbox.orient = "vertical"; arrowbox.orient = "vertical";
arrowbox.style.marginTop = ((anchorRect.top - popupRect.top) + (anchorRect.height / 2) - HALF_ARROW_WIDTH) + "px"; arrowbox.style.marginTop = ((targetRect.top - popupRect.top) + (targetRect.height / 2) - HALF_ARROW_WIDTH) + "px";
if (horizPos == 1) { if (horizPos == 1) {
container.dir = "ltr"; container.dir = "ltr";
anchorClass = "left"; anchorClass = "left";
@ -154,6 +146,64 @@
]]> ]]>
</body> </body>
</method> </method>
<field name="anchorNode">null</field>
<method name="anchorTo">
<parameter name="aAnchorNode"/>
<body>
<![CDATA[
if (!aAnchorNode) {
this._updateArrow(null, null, 0, 0);
return;
}
this.anchorNode = aAnchorNode;
let anchorRect = aAnchorNode.getBoundingClientRect();
let popupRect = this.getBoundingClientRect();
let offset = this.offset;
let horizPos = (Math.round(popupRect.right) <= Math.round(anchorRect.left + offset)) ? -1 :
(Math.round(popupRect.left) >= Math.round(anchorRect.right - offset)) ? 1 : 0;
let vertPos = (Math.round(popupRect.bottom) <= Math.round(anchorRect.top + offset)) ? -1 :
(Math.round(popupRect.top) >= Math.round(anchorRect.bottom - offset)) ? 1 : 0;
this._updateArrow(popupRect, anchorRect, horizPos, vertPos);
]]>
</body>
</method>
<method name="pointLeftAt">
<parameter name="targetNode"/>
<body>
<![CDATA[
if (!targetNode) {
this._updateArrow(null, null, 0, 0);
return;
}
let popupRect = this.getBoundingClientRect();
let targetRect = targetNode.getBoundingClientRect();
this._updateArrow(popupRect, targetRect, 1, 0);
]]>
</body>
</method>
<method name="pointRightAt">
<parameter name="targetNode"/>
<body>
<![CDATA[
if (!targetNode) {
this._updateArrow(null, null, 0, 0);
return;
}
let popupRect = this.getBoundingClientRect();
let targetRect = targetNode.getBoundingClientRect();
this._updateArrow(popupRect, targetRect, -1, 0);
]]>
</body>
</method>
<field name="_eventHandler"><![CDATA[ <field name="_eventHandler"><![CDATA[
({ ({
@ -164,6 +214,9 @@
let self = this.self; let self = this.self;
switch (aEvent.type) { switch (aEvent.type) {
case "resize": case "resize":
// Do nothing if there's no anchorNode
if (!self.anchorNode)
break;
let arrowbox = document.getAnonymousElementByAttribute(self, "anonid", "arrowbox"); let arrowbox = document.getAnonymousElementByAttribute(self, "anonid", "arrowbox");
arrowbox.style.marginLeft = "0px"; arrowbox.style.marginLeft = "0px";
arrowbox.style.marginTop = "0px"; arrowbox.style.marginTop = "0px";

Просмотреть файл

@ -437,7 +437,17 @@ var NewTabPopup = {
setTimeout((function() { setTimeout((function() {
let boxRect = this.box.getBoundingClientRect(); let boxRect = this.box.getBoundingClientRect();
this.box.top = tabRect.top + (tabRect.height / 2) - (boxRect.height / 2); this.box.top = tabRect.top + (tabRect.height / 2) - (boxRect.height / 2);
this.box.anchorTo(aTab);
let tabs = document.getElementById("tabs");
// We don't use anchorTo() here because the tab
// being anchored to might be overflowing the tabs
// scrollbox which confuses the dynamic arrow direction
// calculation (see bug 662520).
if (tabs.getBoundingClientRect().left < 0)
this.box.pointLeftAt(aTab);
else
this.box.pointRightAt(aTab);
}).bind(this), 0); }).bind(this), 0);
if (this._timeout) if (this._timeout)