2013-09-06 10:56:01 -07:00
|
|
|
<?xml version="1.0"?>
|
|
|
|
|
|
|
|
|
|
<bindings id="socialMarkBindings"
|
|
|
|
|
xmlns="http://www.mozilla.org/xbl"
|
|
|
|
|
xmlns:xbl="http://www.mozilla.org/xbl"
|
|
|
|
|
xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<binding id="toolbarbutton-marks" display="xul:button"
|
|
|
|
|
extends="chrome://global/content/bindings/toolbarbutton.xml#toolbarbutton">
|
|
|
|
|
<content disabled="true">
|
2013-12-16 21:24:44 -08:00
|
|
|
<xul:panel anonid="panel" hidden="true" type="arrow" class="social-panel"/>
|
2013-09-06 10:56:01 -07:00
|
|
|
<xul:image class="toolbarbutton-icon" xbl:inherits="validate,src=image,label"/>
|
|
|
|
|
<xul:label class="toolbarbutton-text" crop="right" flex="1"
|
2014-03-10 17:28:42 -07:00
|
|
|
xbl:inherits="value=label,accesskey,crop,wrap"/>
|
|
|
|
|
<xul:label class="toolbarbutton-multiline-text" flex="1"
|
|
|
|
|
xbl:inherits="xbl:text=label,accesskey,wrap"/>
|
2013-09-06 10:56:01 -07:00
|
|
|
</content>
|
|
|
|
|
<implementation implements="nsIDOMEventListener, nsIObserver">
|
2014-05-13 11:10:47 -07:00
|
|
|
<field name="_useDynamicResizer">false</field>
|
2013-12-16 21:24:44 -08:00
|
|
|
<field name="inMenuPanel">false</field>
|
2013-09-06 10:56:01 -07:00
|
|
|
|
2013-12-16 21:24:44 -08:00
|
|
|
<property name="panel">
|
|
|
|
|
<getter>
|
|
|
|
|
let widgetGroup = CustomizableUI.getWidget(this.getAttribute("id"));
|
|
|
|
|
let widget = widgetGroup.forWindow(window);
|
|
|
|
|
this.inMenuPanel = widgetGroup.areaType == CustomizableUI.TYPE_MENU_PANEL;
|
|
|
|
|
if (this.inMenuPanel) {
|
2014-01-21 11:01:16 -08:00
|
|
|
widget.node.setAttribute("closemenu", "none");
|
2013-12-16 21:24:44 -08:00
|
|
|
return document.getElementById("PanelUI-socialapi");
|
|
|
|
|
}
|
|
|
|
|
return document.getAnonymousElementByAttribute(this, "anonid", "panel");
|
|
|
|
|
</getter>
|
|
|
|
|
</property>
|
|
|
|
|
|
|
|
|
|
<property name="content">
|
|
|
|
|
<getter><![CDATA[
|
|
|
|
|
if (this._frame)
|
|
|
|
|
return this._frame;
|
|
|
|
|
let notificationFrameId = "social-mark-frame-" + this.getAttribute("origin");
|
2014-05-13 11:10:47 -07:00
|
|
|
let provider = Social._getProviderFromOrigin(this.getAttribute("origin"));
|
|
|
|
|
let size = provider.getPageSize("marks");
|
|
|
|
|
let {width, height} = size ? size : {width: 330, height: 100};
|
|
|
|
|
this._useDynamicResizer = !size;
|
|
|
|
|
|
2013-12-16 21:24:44 -08:00
|
|
|
this._frame = SharedFrame.createFrame(
|
|
|
|
|
notificationFrameId, /* frame name */
|
|
|
|
|
this.panel, /* parent */
|
|
|
|
|
{
|
|
|
|
|
"type": "content",
|
|
|
|
|
"mozbrowser": "true",
|
|
|
|
|
"class": "social-panel-frame",
|
|
|
|
|
"id": notificationFrameId,
|
|
|
|
|
"tooltip": "aHTMLTooltip",
|
|
|
|
|
"flex": "1",
|
|
|
|
|
"context": "contentAreaContextMenu",
|
|
|
|
|
"origin": this.getAttribute("origin"),
|
2014-05-13 11:10:47 -07:00
|
|
|
"src": "about:blank",
|
|
|
|
|
"style": "width: " + width + "px; height: " + height + "px;",
|
2013-12-16 21:24:44 -08:00
|
|
|
}
|
|
|
|
|
);
|
|
|
|
|
this._frame.addEventListener("DOMLinkAdded", this);
|
|
|
|
|
this.setAttribute("notificationFrameId", notificationFrameId);
|
|
|
|
|
return this._frame;
|
|
|
|
|
]]></getter>
|
|
|
|
|
</property>
|
2013-09-06 10:56:01 -07:00
|
|
|
|
|
|
|
|
<property name="contentWindow">
|
|
|
|
|
<getter>
|
|
|
|
|
return this.content.contentWindow;
|
|
|
|
|
</getter>
|
|
|
|
|
</property>
|
|
|
|
|
|
|
|
|
|
<property name="contentDocument">
|
|
|
|
|
<getter>
|
|
|
|
|
return this.content.contentDocument;
|
|
|
|
|
</getter>
|
|
|
|
|
</property>
|
|
|
|
|
|
|
|
|
|
<property name="provider">
|
|
|
|
|
<getter>
|
|
|
|
|
return Social._getProviderFromOrigin(this.getAttribute("origin"));
|
|
|
|
|
</getter>
|
|
|
|
|
</property>
|
|
|
|
|
|
|
|
|
|
<property name="isMarked">
|
2013-12-16 21:24:44 -08:00
|
|
|
<setter><![CDATA[
|
2013-09-06 10:56:01 -07:00
|
|
|
this._isMarked = val;
|
|
|
|
|
let provider = this.provider;
|
|
|
|
|
// we cannot size the image when we apply it via listStyleImage, so
|
|
|
|
|
// use the toolbar image
|
2013-12-16 21:24:44 -08:00
|
|
|
let place = CustomizableUI.getPlaceForItem(this);
|
|
|
|
|
val = val && place != "palette";
|
|
|
|
|
let icon = val ? provider.markedIcon : provider.unmarkedIcon;
|
|
|
|
|
let iconURL = icon || provider.icon32URL || provider.iconURL;
|
|
|
|
|
this.setAttribute("image", iconURL);
|
|
|
|
|
]]></setter>
|
2013-09-06 10:56:01 -07:00
|
|
|
<getter>
|
|
|
|
|
return this._isMarked;
|
|
|
|
|
</getter>
|
|
|
|
|
</property>
|
|
|
|
|
|
|
|
|
|
<method name="update">
|
|
|
|
|
<body><![CDATA[
|
|
|
|
|
// update the button for use with the current tab
|
|
|
|
|
let provider = this.provider;
|
|
|
|
|
if (this._dynamicResizer) {
|
|
|
|
|
this._dynamicResizer.stop();
|
|
|
|
|
this._dynamicResizer = null;
|
|
|
|
|
}
|
2013-12-16 21:24:44 -08:00
|
|
|
this.content.setAttribute("src", "about:blank");
|
2013-09-06 10:56:01 -07:00
|
|
|
|
|
|
|
|
// do we have a savable page loaded?
|
|
|
|
|
let aURI = gBrowser.currentURI;
|
|
|
|
|
this.disabled = !aURI || !(aURI.schemeIs('http') || aURI.schemeIs('https'));
|
|
|
|
|
if (this.disabled) {
|
|
|
|
|
this.isMarked = false;
|
|
|
|
|
} else {
|
|
|
|
|
Social.isURIMarked(provider.origin, aURI, (isMarked) => {
|
|
|
|
|
this.isMarked = isMarked;
|
|
|
|
|
});
|
|
|
|
|
}
|
2013-12-16 21:24:44 -08:00
|
|
|
|
|
|
|
|
this.content.setAttribute("origin", provider.origin);
|
|
|
|
|
if (!this.inMenuPanel) {
|
|
|
|
|
let panel = this.panel;
|
|
|
|
|
// if customization is currently happening, we may not have a panel
|
|
|
|
|
// that we can hide
|
|
|
|
|
if (panel.hidePopup) {
|
|
|
|
|
panel.hidePopup();
|
|
|
|
|
panel.hidden = true;
|
|
|
|
|
}
|
|
|
|
|
}
|
2013-09-06 10:56:01 -07:00
|
|
|
this.pageData = null;
|
|
|
|
|
]]></body>
|
|
|
|
|
</method>
|
|
|
|
|
|
|
|
|
|
<method name="loadPanel">
|
|
|
|
|
<parameter name="pageData"/>
|
|
|
|
|
<body><![CDATA[
|
|
|
|
|
let provider = this.provider;
|
2013-12-16 21:24:44 -08:00
|
|
|
let panel = this.panel;
|
|
|
|
|
panel.hidden = false;
|
|
|
|
|
|
|
|
|
|
// reparent the iframe if we've been customized to a new location
|
|
|
|
|
if (this.content.parentNode != panel)
|
|
|
|
|
panel.appendChild(this.content);
|
|
|
|
|
|
2013-09-06 10:56:01 -07:00
|
|
|
let URLTemplate = provider.markURL;
|
|
|
|
|
this.pageData = pageData || OpenGraphBuilder.getData(gBrowser);
|
|
|
|
|
let endpoint = OpenGraphBuilder.generateEndpointURL(URLTemplate, this.pageData);
|
|
|
|
|
|
|
|
|
|
// setup listeners
|
2013-12-16 21:24:44 -08:00
|
|
|
let DOMContentLoaded = (event) => {
|
2013-09-06 10:56:01 -07:00
|
|
|
if (event.target != this.contentDocument)
|
|
|
|
|
return;
|
|
|
|
|
this._loading = false;
|
2013-12-16 21:24:44 -08:00
|
|
|
this.content.removeEventListener("DOMContentLoaded", DOMContentLoaded, true);
|
2013-09-06 10:56:01 -07:00
|
|
|
// add our resizer after the dom is ready
|
2014-05-13 11:10:47 -07:00
|
|
|
if (!this.inMenuPanel && this._useDynamicResizer) {
|
2013-12-16 21:24:44 -08:00
|
|
|
let DynamicResizeWatcher = Cu.import("resource:///modules/Social.jsm", {}).DynamicResizeWatcher;
|
|
|
|
|
this._dynamicResizer = new DynamicResizeWatcher();
|
|
|
|
|
this._dynamicResizer.start(this.panel, this.content);
|
|
|
|
|
} else if (this._dynamicResizer) {
|
|
|
|
|
this._dynamicResizer.stop();
|
|
|
|
|
this._dynamicResizer = null;
|
|
|
|
|
}
|
2013-09-06 10:56:01 -07:00
|
|
|
// send the opengraph data
|
|
|
|
|
let evt = this.contentDocument.createEvent("CustomEvent");
|
|
|
|
|
evt.initCustomEvent("OpenGraphData", true, true, JSON.stringify(this.pageData));
|
|
|
|
|
this.contentDocument.documentElement.dispatchEvent(evt);
|
|
|
|
|
|
|
|
|
|
let contentWindow = this.contentWindow;
|
|
|
|
|
let markUpdate = function(event) {
|
|
|
|
|
// update the annotation based on this event, then update the
|
|
|
|
|
// icon as well
|
|
|
|
|
this.isMarked = JSON.parse(event.detail).marked;
|
|
|
|
|
let uri = Services.io.newURI(this.pageData.url, null, null);
|
|
|
|
|
if (this.isMarked) {
|
|
|
|
|
Social.markURI(provider.origin, uri);
|
|
|
|
|
} else {
|
|
|
|
|
Social.unmarkURI(provider.origin, uri, () => {
|
|
|
|
|
this.update();
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
}.bind(this);
|
|
|
|
|
contentWindow.addEventListener("socialMarkUpdate", markUpdate);
|
|
|
|
|
contentWindow.addEventListener("unload", function unload() {
|
|
|
|
|
contentWindow.removeEventListener("unload", unload);
|
|
|
|
|
contentWindow.removeEventListener("socialMarkUpdate", markUpdate);
|
|
|
|
|
});
|
2013-12-16 21:24:44 -08:00
|
|
|
}
|
|
|
|
|
this.content.addEventListener("DOMContentLoaded", DOMContentLoaded, true);
|
2013-09-06 10:56:01 -07:00
|
|
|
this._loading = true;
|
2013-12-16 21:24:44 -08:00
|
|
|
this.content.setAttribute("src", endpoint);
|
2013-09-06 10:56:01 -07:00
|
|
|
]]></body>
|
|
|
|
|
</method>
|
|
|
|
|
|
2013-12-16 21:24:44 -08:00
|
|
|
<method name="openPanel">
|
|
|
|
|
<parameter name="aResetOnClose"/>
|
|
|
|
|
<body><![CDATA[
|
|
|
|
|
let panel = this.panel;
|
|
|
|
|
let frameId = this.getAttribute("notificationFrameId");
|
|
|
|
|
|
|
|
|
|
let wasAlive = SharedFrame.isGroupAlive(frameId);
|
|
|
|
|
SharedFrame.setOwner(frameId, this.content);
|
|
|
|
|
|
|
|
|
|
// Clear dimensions on all browsers so the panel size will
|
|
|
|
|
// only use the selected browser.
|
|
|
|
|
let frameIter = panel.firstElementChild;
|
|
|
|
|
while (frameIter) {
|
|
|
|
|
frameIter.collapsed = (frameIter != this.content);
|
|
|
|
|
frameIter = frameIter.nextElementSibling;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// if we're a slice in the hambuger, use that panel instead
|
|
|
|
|
let widgetGroup = CustomizableUI.getWidget(this.getAttribute("id"));
|
|
|
|
|
let widget = widgetGroup.forWindow(window);
|
|
|
|
|
let inMenuPanel = widgetGroup.areaType == CustomizableUI.TYPE_MENU_PANEL;
|
|
|
|
|
if (inMenuPanel) {
|
|
|
|
|
PanelUI.showSubView("PanelUI-socialapi", widget.node,
|
|
|
|
|
CustomizableUI.AREA_PANEL);
|
|
|
|
|
} else {
|
2014-01-09 15:49:08 -08:00
|
|
|
let anchor = document.getAnonymousElementByAttribute(this, "class", "toolbarbutton-icon");
|
|
|
|
|
panel.openPopup(anchor, "bottomcenter topright", 0, 0, false, false);
|
|
|
|
|
this.setAttribute("open", "true");
|
2013-12-16 21:24:44 -08:00
|
|
|
}
|
|
|
|
|
if (aResetOnClose) {
|
|
|
|
|
let evName = inMenuPanel ? "ViewHiding": "popuphidden";
|
2014-03-13 17:23:34 -07:00
|
|
|
let _hidden = () => {
|
2013-12-16 21:24:44 -08:00
|
|
|
panel.removeEventListener(evName, _hidden);
|
|
|
|
|
this.update();
|
2014-03-13 17:23:34 -07:00
|
|
|
};
|
|
|
|
|
panel.addEventListener(evName, _hidden, false);
|
2013-12-16 21:24:44 -08:00
|
|
|
}
|
|
|
|
|
]]></body>
|
|
|
|
|
</method>
|
|
|
|
|
|
2013-09-06 10:56:01 -07:00
|
|
|
<method name="markCurrentPage">
|
|
|
|
|
<parameter name="aOpenPanel"/>
|
|
|
|
|
<body><![CDATA[
|
|
|
|
|
// we always set the src on click if it has not been set for this tab,
|
|
|
|
|
// but we only want to open the panel if it was previously annotated.
|
2013-12-16 21:24:44 -08:00
|
|
|
let openPanel = this.isMarked || aOpenPanel ||
|
|
|
|
|
this.inMenuPanel || !this.provider.haveLoggedInUser();
|
|
|
|
|
let src = this.content.getAttribute("src");
|
2013-09-06 10:56:01 -07:00
|
|
|
if (!src || src == "about:blank") {
|
|
|
|
|
this.loadPanel();
|
|
|
|
|
}
|
|
|
|
|
if (openPanel)
|
2013-12-16 21:24:44 -08:00
|
|
|
this.openPanel();
|
2013-09-06 10:56:01 -07:00
|
|
|
]]></body>
|
|
|
|
|
</method>
|
|
|
|
|
|
|
|
|
|
<method name="markLink">
|
|
|
|
|
<parameter name="aUrl"/>
|
|
|
|
|
<body><![CDATA[
|
|
|
|
|
if (!aUrl) {
|
|
|
|
|
this.markCurrentPage(true);
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
// initiated form an external source, such as gContextMenu, where
|
|
|
|
|
// pageData is passed into us. In this case, we always load the iframe
|
|
|
|
|
// and show it since the url may not be the browser tab, but an image,
|
|
|
|
|
// link, etc. inside the page. We also "update" the iframe to the
|
|
|
|
|
// previous url when it is closed.
|
2013-12-16 21:24:44 -08:00
|
|
|
this.content.setAttribute("src", "about:blank");
|
2013-09-06 10:56:01 -07:00
|
|
|
this.loadPanel({ url: aUrl });
|
2013-12-16 21:24:44 -08:00
|
|
|
this.openPanel(true);
|
2013-09-06 10:56:01 -07:00
|
|
|
]]></body>
|
|
|
|
|
</method>
|
|
|
|
|
|
|
|
|
|
<method name="dispatchPanelEvent">
|
|
|
|
|
<parameter name="name"/>
|
|
|
|
|
<body><![CDATA[
|
|
|
|
|
let evt = this.contentDocument.createEvent("CustomEvent");
|
|
|
|
|
evt.initCustomEvent(name, true, true, {});
|
|
|
|
|
this.contentDocument.documentElement.dispatchEvent(evt);
|
|
|
|
|
]]></body>
|
|
|
|
|
</method>
|
|
|
|
|
|
2013-12-16 21:24:44 -08:00
|
|
|
<method name="onShown">
|
|
|
|
|
<body><![CDATA[
|
2013-09-06 10:56:01 -07:00
|
|
|
// because the panel may be preloaded, we need to size the panel when
|
|
|
|
|
// showing as well as after load
|
|
|
|
|
let sizeSocialPanelToContent = Cu.import("resource:///modules/Social.jsm", {}).sizeSocialPanelToContent;
|
2013-12-16 21:24:44 -08:00
|
|
|
if (!this._loading && this.contentDocument &&
|
|
|
|
|
this.contentDocument.readyState == "complete") {
|
2013-09-06 10:56:01 -07:00
|
|
|
this.dispatchPanelEvent("socialFrameShow");
|
2014-05-13 11:10:47 -07:00
|
|
|
if (!this.inMenuPanel && this._useDynamicResizer)
|
2013-12-16 21:24:44 -08:00
|
|
|
sizeSocialPanelToContent(this.panel, this.content);
|
2013-09-06 10:56:01 -07:00
|
|
|
} else {
|
2014-03-13 17:23:34 -07:00
|
|
|
let panelBrowserOnload = (e) => {
|
2013-09-06 10:56:01 -07:00
|
|
|
this.content.removeEventListener("load", panelBrowserOnload, true);
|
|
|
|
|
this.dispatchPanelEvent("socialFrameShow");
|
2014-05-13 11:10:47 -07:00
|
|
|
if (!this.inMenuPanel && this._useDynamicResizer)
|
2013-12-16 21:24:44 -08:00
|
|
|
sizeSocialPanelToContent(this.panel, this.content);
|
2014-03-13 17:23:34 -07:00
|
|
|
};
|
|
|
|
|
this.content.addEventListener("load", panelBrowserOnload, true);
|
2013-12-16 21:24:44 -08:00
|
|
|
}
|
|
|
|
|
]]></body>
|
|
|
|
|
</method>
|
|
|
|
|
|
|
|
|
|
<method name="handleEvent">
|
|
|
|
|
<parameter name="aEvent"/>
|
|
|
|
|
<body><![CDATA[
|
|
|
|
|
if (aEvent.eventPhase != aEvent.BUBBLING_PHASE)
|
|
|
|
|
return;
|
|
|
|
|
switch(aEvent.type) {
|
|
|
|
|
case "DOMLinkAdded": {
|
|
|
|
|
// much of this logic is from DOMLinkHandler in browser.js, this sets
|
|
|
|
|
// the presence icon for a chat user, we simply use favicon style
|
|
|
|
|
// updating
|
|
|
|
|
let link = aEvent.originalTarget;
|
|
|
|
|
let rel = link.rel && link.rel.toLowerCase();
|
|
|
|
|
if (!link || !link.ownerDocument || !rel || !link.href)
|
|
|
|
|
return;
|
|
|
|
|
if (link.rel.indexOf("icon") < 0)
|
|
|
|
|
return;
|
|
|
|
|
|
2014-02-08 17:41:34 -08:00
|
|
|
let ContentLinkHandler = Cu.import("resource:///modules/ContentLinkHandler.jsm", {}).ContentLinkHandler;
|
|
|
|
|
let uri = ContentLinkHandler.getLinkIconURI(link);
|
2013-12-16 21:24:44 -08:00
|
|
|
if (!uri)
|
|
|
|
|
return;
|
|
|
|
|
|
|
|
|
|
// we cannot size the image when we apply it via listStyleImage, so
|
|
|
|
|
// use the toolbar image
|
|
|
|
|
this.setAttribute("image", uri.spec);
|
|
|
|
|
}
|
|
|
|
|
break;
|
|
|
|
|
case "ViewShowing":
|
|
|
|
|
this.onShown();
|
|
|
|
|
break;
|
|
|
|
|
case "ViewHiding":
|
|
|
|
|
this.dispatchPanelEvent("socialFrameHide");
|
|
|
|
|
break;
|
2013-09-06 10:56:01 -07:00
|
|
|
}
|
2013-12-16 21:24:44 -08:00
|
|
|
]]></body>
|
|
|
|
|
</method>
|
|
|
|
|
|
|
|
|
|
</implementation>
|
|
|
|
|
<handlers>
|
|
|
|
|
<handler event="popupshown"><![CDATA[
|
|
|
|
|
this.onShown();
|
2013-09-06 10:56:01 -07:00
|
|
|
]]></handler>
|
|
|
|
|
<handler event="popuphidden"><![CDATA[
|
|
|
|
|
this.dispatchPanelEvent("socialFrameHide");
|
2014-01-09 15:49:08 -08:00
|
|
|
this.removeAttribute("open");
|
2013-09-06 10:56:01 -07:00
|
|
|
]]></handler>
|
|
|
|
|
<handler event="command"><![CDATA[
|
|
|
|
|
this.markCurrentPage();
|
|
|
|
|
]]></handler>
|
|
|
|
|
</handlers>
|
|
|
|
|
</binding>
|
|
|
|
|
|
|
|
|
|
</bindings>
|
