Bug 971116 - Implement new Australis UITour highlight effect. ui-r=madhava, r=Unfocused

This commit is contained in:
Blake Winton 2014-03-13 09:29:24 -04:00
parent 6ea5833cdd
commit 994a414863
3 changed files with 15 additions and 10 deletions

View File

@ -1009,10 +1009,13 @@ toolbarpaletteitem[place="palette"][hidden] {
@keyframes uitour-wobble {
from {
transform: rotate(0deg) translateX(2px) rotate(0deg);
transform: rotate(0deg) translateX(3px) rotate(0deg);
}
50% {
transform: rotate(360deg) translateX(3px) rotate(-360deg);
}
to {
transform: rotate(360deg) translateX(2px) rotate(-360deg);
transform: rotate(720deg) translateX(0px) rotate(-720deg);
}
}
@ -1054,7 +1057,9 @@ toolbarpaletteitem[place="palette"][hidden] {
#UITourHighlight[active="wobble"] {
animation-name: uitour-wobble;
animation-duration: 1s;
animation-delay: 0s;
animation-duration: 1.5s;
animation-iteration-count: 1;
}
#UITourHighlight[active="zoom"] {
animation-name: uitour-zoom;

View File

@ -71,7 +71,7 @@ this.UITour = {
widgetName: "PanelUI-fxa-status",
}],
["addons", {query: "#add-ons-button"}],
["appMenu", {query: "#PanelUI-menu-button"}],
["appMenu", {query: "#PanelUI-button"}],
["backForward", {
query: "#back-button",
widgetName: "urlbar-container",
@ -703,7 +703,7 @@ this.UITour = {
// Handle the non-customizable buttons at the bottom of the menu which aren't proper widgets.
return targetElement.id.startsWith("PanelUI-")
&& targetElement.id != "PanelUI-menu-button";
&& targetElement.id != "PanelUI-button";
},
/**
@ -811,9 +811,9 @@ this.UITour = {
let minDimension = Math.min(highlightHeight, highlightWidth);
let maxDimension = Math.max(highlightHeight, highlightWidth);
// If the dimensions are within 40% of eachother, make the highlight a circle with the
// largest dimension as the diameter.
if (maxDimension / minDimension <= 1.4) {
// If the dimensions are within 110% of each other (to include the bookmarks button),
// make the highlight a circle with the largest dimension as the diameter.
if (maxDimension / minDimension <= 2.1) {
highlightHeight = highlightWidth = maxDimension;
highlighter.style.borderRadius = "100%";
} else {

View File

@ -32,7 +32,7 @@ let tests = [
// Move the highlight outside which should close the app menu.
gContentAPI.showHighlight("appMenu");
waitForPopupAtAnchor(highlight.parentElement, document.getElementById("PanelUI-menu-button"), () => {
waitForPopupAtAnchor(highlight.parentElement, document.getElementById("PanelUI-button"), () => {
isnot(PanelUI.panel.state, "open",
"Panel should have closed after the highlight moved elsewhere.");
is(tooltip.state, "open", "The info panel should have remained open");
@ -143,7 +143,7 @@ let tests = [
// Move the info panel outside which should close the app menu.
gContentAPI.showInfo("appMenu", "Cool menu button", "It's three lines");
waitForPopupAtAnchor(tooltip, document.getElementById("PanelUI-menu-button"), () => {
waitForPopupAtAnchor(tooltip, document.getElementById("PanelUI-button"), () => {
isnot(PanelUI.panel.state, "open",
"Menu should have closed after the highlight moved elsewhere.");
is(highlight.parentElement.state, "open", "The highlight should have remained visible");