Bug 1004930 - Generic way to add buttons for actions to a conversation. r=florian

This commit is contained in:
Mayank Kumar 2014-10-15 14:39:58 -04:00
Родитель 032adea001
Коммит 9930654dc4
2 изменённых файлов: 94 добавлений и 47 удалений

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

@ -1740,13 +1740,34 @@
<method name="initConversationUI">
<body>
<![CDATA[
let cti = this.getElt("conv-top-info");
// The toolbarbuttons for different services to be added below.
// Target switcher button.
let targetSwitcher = document.createElement("toolbarbutton");
targetSwitcher.setAttribute("disabled", "true");
targetSwitcher.classList.add("alltargets-button");
let account = this._conv.account;
targetSwitcher.setAttribute("image",
account.protocol.iconBaseURI + "icon.png");
let targetTooltip =
this.bundle.formatStringFromName("targetTooltipChat",
[this._conv.title,
account.name,
account.protocol.name], 3);
targetSwitcher.setAttribute("tooltiptext", targetTooltip);
let targetPopup = document.createElement("menupopup");
targetPopup.classList.add("all-targets-popup");
targetPopup.setAttribute("postion", "after_end");
targetSwitcher.appendChild(targetPopup);
cti.appendChild(targetSwitcher);
if (this._conv.isChat) {
this.updateTopic();
this.setAttribute("chat", "true");
this.tab.setAttribute("chat", "true");
this.tab.setAttribute("prpl", this._conv.account.protocol.id);
let cti = this.getElt("conv-top-info");
cti.setAttribute("displayName", this._conv.title);
cti.setAttribute("status", "chat");
@ -1998,16 +2019,13 @@
</xul:stack>
<xul:stack class="displayNameAndstatusMessageStack"
mousethrough="always" flex="1">
<xul:hbox align="center" flex="1">
<xul:hbox align="right" flex="1" class="displayNameAndToolbar">
<xul:description anonid="displayName" class="displayName" flex="1"
crop="end" xbl:inherits="value=displayName"/>
<xul:toolbarbutton class="prplIcon alltargets-button"
anonid="targetPrplIcon" context=""
xbl:inherits="image=prplIcon,tooltiptext=targetTooltiptext">
<xul:menupopup class="all-targets-popup"
anonid="all-targets-popup"
position="after_end"/>
</xul:toolbarbutton>
<!-- Set "context" else context attribute from parent node is used. -->
<xul:hbox class="convToolbar" mousethrough="always" context="">
<children/>
</xul:hbox>
</xul:hbox>
<xul:description anonid="statusMessage" class="statusMessage"
xbl:inherits="value=statusMessage,tooltiptext=statusTooltiptext,editable=topicEditable,editing,noTopic,context=topicContext,role=topicRole"
@ -2020,8 +2038,6 @@
<![CDATA[
this.topic
.addEventListener("click", this.startEditTopic.bind(this));
if (this.hasAttribute("allowTargetChange"))
this.allowTargetChange();
// Cancel any ongoing edit if the binding changes.
this.editing = false;
@ -2150,15 +2166,14 @@
<method name="allowTargetChange">
<body>
<![CDATA[
let targetButton =
document.getAnonymousElementByAttribute(this, "anonid", "targetPrplIcon");
let targetButton = this.querySelector(".alltargets-button");
targetButton.setAttribute("type", "menu");
targetButton.setAttribute("mousethrough", "never");
this.setAttribute("allowTargetChange", "true");
let popup = document.getAnonymousElementByAttribute(this, "anonid",
"all-targets-popup");
let popup = this.querySelector(".all-targets-popup");
popup.addEventListener("popupshowing", this.showAllTargets.bind(this));
popup.addEventListener("popuphiding", this.hideAllTargets.bind(this));
targetButton.removeAttribute("disabled");
]]>
</body>
</method>
@ -2166,8 +2181,7 @@
<method name="showAllTargets">
<body>
<![CDATA[
let popup = document.getAnonymousElementByAttribute(this, "anonid",
"all-targets-popup");
let popup = this.querySelector(".all-targets-popup");
let _conv = document.getBindingParent(this)._conv;
if (!_conv.contact)
return;
@ -2213,8 +2227,7 @@
<method name="hideAllTargets">
<body>
<![CDATA[
let popup = document.getAnonymousElementByAttribute(this, "anonid",
"all-targets-popup");
let popup = this.querySelector(".all-targets-popup");
while (popup.hasChildNodes())
popup.lastChild.remove();
popup.removeEventListener("command", this.changeTargetCommand);
@ -2239,13 +2252,9 @@
class="statusMessageWithDash"
xbl:inherits="value=statusMessageWithDash,tooltiptext=statusTooltiptext,editable=topicEditable,editing,noTopic,context=topicContext,role=topicRole"
crop="end" flex="100000"/>
<xul:toolbarbutton class="prplIcon alltargets-button" mousethrough="always"
anonid="targetPrplIcon" context=""
xbl:inherits="image=prplIcon,tooltiptext=targetTooltiptext">
<xul:menupopup class="all-targets-popup"
anonid="all-targets-popup"
position="after_end"/>
</xul:toolbarbutton>
<xul:hbox class="convToolbar" mousethrough="always" context="">
<children/>
</xul:hbox>
</content>
<implementation>
<constructor>

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

@ -91,26 +91,57 @@
font-style: italic;
}
.alltargets-button {
min-width: 16px;
padding: 0 0;
-moz-appearance: none;
border: none;
}
.alltargets-button > .toolbarbutton-text,
.alltargets-button > .toolbarbutton-menu-dropmarker {
display: none;
}
.alltargets-button[type="menu"] {
cursor: pointer;
/* Remove the margin set by the menu dropmarker so that target switcher button
* doesn't have uneven padding. */
.alltargets-button > .toolbarbutton-icon {
margin: 0;
}
.alltargets-item[selected="true"] {
font-weight: bold;
}
/* The Australis themed button is borrowed from the Firefox toolbarbutton
* (browser/themes/windows/browser.css). The properties are set in class
* toolbarbutton-1 of the CSS file. */
.conv-top-info > toolbarbutton {
-moz-appearance: none;
max-height: 22px;
border: 1px solid transparent;
padding: 2px 3px;
margin: 0 0;
}
.conv-top-info > toolbarbutton:hover:not([disabled="true"]) {
background: hsla(0,0%,100%,0.5) linear-gradient(hsla(0,0%,100%,0.1), hsla(0,0%,100%,0.2)) padding-box;
transition: background-color 250ms;
border: 1px solid hsla(0,0%,0%,0.5);
box-shadow: 0 1px 0 hsla(0,0%,100%,0.5),
0 1px 0 hsla(0,0%,100%,0.7) inset;
border-radius: 3px;
}
.conv-top-info > toolbarbutton[open="true"],
.conv-top-info > toolbarbutton[open="true"]:hover,
.conv-top-info > toolbarbutton:active:not([disabled="true"]) {
background: linear-gradient(transparent, rgba(0,0,0,0.15)) !important;
border: 1px solid hsla(0,0%,0%,0.5);
box-shadow: 0 1px 0 hsla(0,0%,100%,0.5),
0 1px 0 hsla(0,0%,0%,0.05) inset,
0 1px 1px hsla(0,0%,0%,0.2) inset;
border-radius: 3px;
}
.displayNameAndToolbar {
border-bottom: 1px solid rgba(0,0,0,0.25);
margin: 1px 4px 22px 0;
}
.status-overlay-icon[status="away"],
.status-overlay-icon[status="unavailable"] {
list-style-image: url('chrome://chat/skin/away.png');
@ -135,7 +166,11 @@
@media all and (min-height: 251px) {
.statusImageStack,
.displayNameAndstatusMessageStack {
margin: 2px 2px;
margin: 2px 0 2px 2px;
}
.displayNameAndstatusMessageStack {
-moz-margin-start: 4px;
}
.statusMessage {
@ -156,19 +191,18 @@
.displayName {
font-size: large;
border-bottom: 1px solid rgba(0,0,0,0.25);
margin: 0 0 16px !important;
margin: 5px 0 0 0 !important;
padding-right: 20px;
}
.prplIcon {
margin: 0 1px 16px -16px !important;
}
.statusTypeIcon {
margin: 32px 0 0;
}
.convToolbar {
margin: -1px 0 0;
}
.userIconHolder[userIcon] + .statusTypeIcon {
margin-left: 32px;
}
@ -184,11 +218,6 @@
margin: 2px 0 !important;
}
.prplIcon {
margin: 1px 3px !important;
padding: 0 0;
}
.statusMessage[editing] {
%ifdef XP_WIN
margin: -1px 2px 0px 8px !important;
@ -200,6 +229,15 @@
.statusTypeIcon {
margin: 1px 3px;
}
.convToolbar {
margin: -1px 1px 0;
}
.conv-top-info > toolbarbutton {
max-height: 20px;
padding: 1px 2px;
}
}
.conv-messages {