mirror of
https://gitlab.winehq.org/wine/wine-gecko.git
synced 2024-09-13 09:24:08 -07:00
Back out 3 changesets (bug 1111142) for having a startling perf impact
CLOSED TREE Backed out changeset 9b62d0e8b412 (bug 1111142) Backed out changeset e66b9aa4b22c (bug 1111142) Backed out changeset 6b480b80299a (bug 1111142) --HG-- rename : toolkit/components/reader/AboutReader.jsm => toolkit/components/reader/content/aboutReader.js
This commit is contained in:
Phil Ringnalda
parent
f17c7b51bb
commit
63631dcf81
@ -5,7 +5,9 @@
|
|||||||
|
|
||||||
"use strict";
|
"use strict";
|
||||||
|
|
||||||
XPCOMUtils.defineLazyModuleGetter(this, "ReaderMode", "resource://gre/modules/ReaderMode.jsm");
|
const { utils: Cu } = Components;
|
||||||
|
|
||||||
|
Cu.import("resource://gre/modules/ReaderMode.jsm");
|
||||||
|
|
||||||
let Reader = {
|
let Reader = {
|
||||||
// These values should match those defined in BrowserContract.java.
|
// These values should match those defined in BrowserContract.java.
|
||||||
@ -15,136 +17,13 @@ let Reader = {
|
|||||||
STATUS_FETCH_FAILED_UNSUPPORTED_FORMAT: 3,
|
STATUS_FETCH_FAILED_UNSUPPORTED_FORMAT: 3,
|
||||||
STATUS_FETCHED_ARTICLE: 4,
|
STATUS_FETCHED_ARTICLE: 4,
|
||||||
|
|
||||||
MESSAGES: [
|
get isEnabledForParseOnLoad() {
|
||||||
"Reader:AddToList",
|
delete this.isEnabledForParseOnLoad;
|
||||||
"Reader:ArticleGet",
|
|
||||||
"Reader:FaviconRequest",
|
|
||||||
"Reader:ListStatusRequest",
|
|
||||||
"Reader:RemoveFromList",
|
|
||||||
"Reader:Share",
|
|
||||||
"Reader:ShowToast",
|
|
||||||
"Reader:ToolbarVisibility",
|
|
||||||
"Reader:SystemUIVisibility",
|
|
||||||
"Reader:UpdateIsArticle",
|
|
||||||
],
|
|
||||||
|
|
||||||
init: function() {
|
// Listen for future pref changes.
|
||||||
for (let msg of this.MESSAGES) {
|
Services.prefs.addObserver("reader.parse-on-load.", this, false);
|
||||||
window.messageManager.addMessageListener(msg, this);
|
|
||||||
}
|
|
||||||
|
|
||||||
Services.obs.addObserver(this, "Reader:Added", false);
|
return this.isEnabledForParseOnLoad = this._getStateForParseOnLoad();
|
||||||
Services.obs.addObserver(this, "Reader:Removed", false);
|
|
||||||
Services.obs.addObserver(this, "Gesture:DoubleTap", false);
|
|
||||||
},
|
|
||||||
|
|
||||||
observe: function Reader_observe(aMessage, aTopic, aData) {
|
|
||||||
switch (aTopic) {
|
|
||||||
case "Reader:Added": {
|
|
||||||
window.messageManager.broadcastAsyncMessage("Reader:Added", { url: aData });
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
case "Reader:Removed": {
|
|
||||||
let uri = Services.io.newURI(aData, null, null);
|
|
||||||
ReaderMode.removeArticleFromCache(uri).catch(e => Cu.reportError("Error removing article from cache: " + e));
|
|
||||||
|
|
||||||
window.messageManager.broadcastAsyncMessage("Reader:Removed", { url: aData });
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
case "Gesture:DoubleTap": {
|
|
||||||
// XXX: Ideally, we would just do this all with web APIs in AboutReader.jsm.
|
|
||||||
let win = BrowserApp.selectedBrowser.contentWindow;
|
|
||||||
let scrollBy;
|
|
||||||
// Arbitrary choice of innerHeight (50) to give some context after scroll.
|
|
||||||
if (JSON.parse(aData).y < (win.innerHeight / 2)) {
|
|
||||||
scrollBy = - win.innerHeight + 50;
|
|
||||||
} else {
|
|
||||||
scrollBy = win.innerHeight - 50;
|
|
||||||
}
|
|
||||||
|
|
||||||
let viewport = BrowserApp.selectedTab.getViewport();
|
|
||||||
let newY = Math.min(Math.max(viewport.cssY + scrollBy, viewport.cssPageTop), viewport.cssPageBottom);
|
|
||||||
let newRect = new Rect(viewport.cssX, newY, viewport.cssWidth, viewport.cssHeight);
|
|
||||||
ZoomHelper.zoomToRect(newRect, -1);
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
receiveMessage: function(message) {
|
|
||||||
switch (message.name) {
|
|
||||||
case "Reader:AddToList":
|
|
||||||
this.addArticleToReadingList(message.data.article);
|
|
||||||
break;
|
|
||||||
|
|
||||||
case "Reader:ArticleGet":
|
|
||||||
this._getArticle(message.data.url, message.target).then((article) => {
|
|
||||||
message.target.messageManager.sendAsyncMessage("Reader:ArticleData", { article: article });
|
|
||||||
});
|
|
||||||
break;
|
|
||||||
|
|
||||||
case "Reader:FaviconRequest": {
|
|
||||||
let observer = (s, t, d) => {
|
|
||||||
Services.obs.removeObserver(observer, "Reader:FaviconReturn", false);
|
|
||||||
message.target.messageManager.sendAsyncMessage("Reader:FaviconReturn", JSON.parse(d));
|
|
||||||
};
|
|
||||||
Services.obs.addObserver(observer, "Reader:FaviconReturn", false);
|
|
||||||
Messaging.sendRequest({
|
|
||||||
type: "Reader:FaviconRequest",
|
|
||||||
url: message.data.url
|
|
||||||
});
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
|
|
||||||
case "Reader:ListStatusRequest":
|
|
||||||
Messaging.sendRequestForResult({
|
|
||||||
type: "Reader:ListStatusRequest",
|
|
||||||
url: message.data.url
|
|
||||||
}).then((data) => {
|
|
||||||
message.target.messageManager.sendAsyncMessage("Reader:ListStatusData", JSON.parse(data));
|
|
||||||
});
|
|
||||||
break;
|
|
||||||
|
|
||||||
case "Reader:RemoveFromList":
|
|
||||||
Messaging.sendRequest({
|
|
||||||
type: "Reader:RemoveFromList",
|
|
||||||
url: message.data.url
|
|
||||||
});
|
|
||||||
break;
|
|
||||||
|
|
||||||
case "Reader:Share":
|
|
||||||
Messaging.sendRequest({
|
|
||||||
type: "Reader:Share",
|
|
||||||
url: message.data.url,
|
|
||||||
title: message.data.title
|
|
||||||
});
|
|
||||||
break;
|
|
||||||
|
|
||||||
case "Reader:ShowToast":
|
|
||||||
NativeWindow.toast.show(message.data.toast, "short");
|
|
||||||
break;
|
|
||||||
|
|
||||||
case "Reader:SystemUIVisibility":
|
|
||||||
Messaging.sendRequest({
|
|
||||||
type: "SystemUI:Visibility",
|
|
||||||
visible: message.data.visible
|
|
||||||
});
|
|
||||||
break;
|
|
||||||
|
|
||||||
case "Reader:ToolbarVisibility":
|
|
||||||
Messaging.sendRequest({
|
|
||||||
type: "BrowserToolbar:Visibility",
|
|
||||||
visible: message.data.visible
|
|
||||||
});
|
|
||||||
break;
|
|
||||||
|
|
||||||
case "Reader:UpdateIsArticle": {
|
|
||||||
let tab = BrowserApp.getTabForBrowser(message.target);
|
|
||||||
tab.isArticle = message.data.isArticle;
|
|
||||||
this.updatePageAction(tab);
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
|
|
||||||
pageAction: {
|
pageAction: {
|
||||||
@ -188,7 +67,7 @@ let Reader = {
|
|||||||
// Only stop a reader session if the foreground viewer is not visible.
|
// Only stop a reader session if the foreground viewer is not visible.
|
||||||
UITelemetry.stopSession("reader.1", "", null);
|
UITelemetry.stopSession("reader.1", "", null);
|
||||||
|
|
||||||
if (tab.isArticle) {
|
if (tab.savedArticle) {
|
||||||
this.pageAction.id = PageActions.add({
|
this.pageAction.id = PageActions.add({
|
||||||
title: Strings.browser.GetStringFromName("readerMode.enter"),
|
title: Strings.browser.GetStringFromName("readerMode.enter"),
|
||||||
icon: "drawable://reader",
|
icon: "drawable://reader",
|
||||||
@ -199,14 +78,32 @@ let Reader = {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
observe: function(aMessage, aTopic, aData) {
|
||||||
|
switch(aTopic) {
|
||||||
|
case "Reader:Removed": {
|
||||||
|
let uri = Services.io.newURI(aData, null, null);
|
||||||
|
ReaderMode.removeArticleFromCache(uri).catch(e => Cu.reportError("Error removing article from cache: " + e));
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
|
||||||
|
case "nsPref:changed":
|
||||||
|
if (aData.startsWith("reader.parse-on-load.")) {
|
||||||
|
this.isEnabledForParseOnLoad = this._getStateForParseOnLoad();
|
||||||
|
}
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
_addTabToReadingList: Task.async(function* (tabID) {
|
_addTabToReadingList: Task.async(function* (tabID) {
|
||||||
let tab = BrowserApp.getTabForId(tabID);
|
let tab = BrowserApp.getTabForId(tabID);
|
||||||
if (!tab) {
|
if (!tab) {
|
||||||
throw new Error("Can't add tab to reading list because no tab found for ID: " + tabID);
|
throw new Error("Can't add tab to reading list because no tab found for ID: " + tabID);
|
||||||
}
|
}
|
||||||
|
|
||||||
let urlWithoutRef = tab.browser.currentURI.specIgnoringRef;
|
let uri = tab.browser.currentURI;
|
||||||
let article = yield this._getArticle(urlWithoutRef, tab.browser).catch(e => {
|
let urlWithoutRef = uri.specIgnoringRef;
|
||||||
|
|
||||||
|
let article = yield this.getArticle(urlWithoutRef, tabID).catch(e => {
|
||||||
Cu.reportError("Error getting article for tab: " + e);
|
Cu.reportError("Error getting article for tab: " + e);
|
||||||
return null;
|
return null;
|
||||||
});
|
});
|
||||||
@ -243,25 +140,36 @@ let Reader = {
|
|||||||
ReaderMode.storeArticleInCache(article).catch(e => Cu.reportError("Error storing article in cache: " + e));
|
ReaderMode.storeArticleInCache(article).catch(e => Cu.reportError("Error storing article in cache: " + e));
|
||||||
},
|
},
|
||||||
|
|
||||||
|
_getStateForParseOnLoad: function () {
|
||||||
|
let isEnabled = Services.prefs.getBoolPref("reader.parse-on-load.enabled");
|
||||||
|
let isForceEnabled = Services.prefs.getBoolPref("reader.parse-on-load.force-enabled");
|
||||||
|
// For low-memory devices, don't allow reader mode since it takes up a lot of memory.
|
||||||
|
// See https://bugzilla.mozilla.org/show_bug.cgi?id=792603 for details.
|
||||||
|
return isForceEnabled || (isEnabled && !BrowserApp.isOnLowMemoryPlatform);
|
||||||
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Gets an article for a given URL. This method will download and parse a document
|
* Gets an article for a given URL. This method will download and parse a document
|
||||||
* if it does not find the article in the tab data or the cache.
|
* if it does not find the article in the tab data or the cache.
|
||||||
*
|
*
|
||||||
* @param url The article URL.
|
* @param url The article URL.
|
||||||
* @param browser The browser where the article is currently loaded.
|
* @param tabId (optional) The id of the tab where we can look for a saved article.
|
||||||
* @return {Promise}
|
* @return {Promise}
|
||||||
* @resolves JS object representing the article, or null if no article is found.
|
* @resolves JS object representing the article, or null if no article is found.
|
||||||
*/
|
*/
|
||||||
_getArticle: Task.async(function* (url, browser) {
|
getArticle: Task.async(function* (url, tabId) {
|
||||||
// First, look for a saved article.
|
// First, look for an article object stored on the tab.
|
||||||
let article = yield this._getSavedArticle(browser);
|
let tab = BrowserApp.getTabForId(tabId);
|
||||||
if (article && article.url == url) {
|
if (tab) {
|
||||||
return article;
|
let article = tab.savedArticle;
|
||||||
|
if (article && article.url == url) {
|
||||||
|
return article;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Next, try to find a parsed article in the cache.
|
// Next, try to find a parsed article in the cache.
|
||||||
let uri = Services.io.newURI(url, null, null);
|
let uri = Services.io.newURI(url, null, null);
|
||||||
article = yield ReaderMode.getArticleFromCache(uri);
|
let article = yield ReaderMode.getArticleFromCache(uri);
|
||||||
if (article) {
|
if (article) {
|
||||||
return article;
|
return article;
|
||||||
}
|
}
|
||||||
@ -271,18 +179,6 @@ let Reader = {
|
|||||||
return yield ReaderMode.downloadAndParseDocument(url);
|
return yield ReaderMode.downloadAndParseDocument(url);
|
||||||
}),
|
}),
|
||||||
|
|
||||||
_getSavedArticle: function(browser) {
|
|
||||||
return new Promise((resolve, reject) => {
|
|
||||||
let mm = browser.messageManager;
|
|
||||||
let listener = (message) => {
|
|
||||||
mm.removeMessageListener("Reader:SavedArticleData", listener);
|
|
||||||
resolve(message.data.article);
|
|
||||||
};
|
|
||||||
mm.addMessageListener("Reader:SavedArticleData", listener);
|
|
||||||
mm.sendAsyncMessage("Reader:SavedArticleGet");
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Migrates old indexedDB reader mode cache to new JSON cache.
|
* Migrates old indexedDB reader mode cache to new JSON cache.
|
||||||
*/
|
*/
|
||||||
|
|||||||
@ -109,13 +109,14 @@ XPCOMUtils.defineLazyModuleGetter(this, "SharedPreferences",
|
|||||||
XPCOMUtils.defineLazyModuleGetter(this, "Notifications",
|
XPCOMUtils.defineLazyModuleGetter(this, "Notifications",
|
||||||
"resource://gre/modules/Notifications.jsm");
|
"resource://gre/modules/Notifications.jsm");
|
||||||
|
|
||||||
// XXX: Make this into a module?
|
XPCOMUtils.defineLazyModuleGetter(this, "ReaderMode",
|
||||||
Services.scriptloader.loadSubScript("chrome://browser/content/Reader.js", this);
|
"resource://gre/modules/ReaderMode.jsm");
|
||||||
|
|
||||||
// Lazily-loaded browser scripts:
|
// Lazily-loaded browser scripts:
|
||||||
[
|
[
|
||||||
["SelectHelper", "chrome://browser/content/SelectHelper.js"],
|
["SelectHelper", "chrome://browser/content/SelectHelper.js"],
|
||||||
["InputWidgetHelper", "chrome://browser/content/InputWidgetHelper.js"],
|
["InputWidgetHelper", "chrome://browser/content/InputWidgetHelper.js"],
|
||||||
|
["AboutReader", "chrome://global/content/reader/aboutReader.js"],
|
||||||
["MasterPassword", "chrome://browser/content/MasterPassword.js"],
|
["MasterPassword", "chrome://browser/content/MasterPassword.js"],
|
||||||
["PluginHelper", "chrome://browser/content/PluginHelper.js"],
|
["PluginHelper", "chrome://browser/content/PluginHelper.js"],
|
||||||
["OfflineApps", "chrome://browser/content/OfflineApps.js"],
|
["OfflineApps", "chrome://browser/content/OfflineApps.js"],
|
||||||
@ -146,6 +147,7 @@ Services.scriptloader.loadSubScript("chrome://browser/content/Reader.js", this);
|
|||||||
["Feedback", ["Feedback:Show"], "chrome://browser/content/Feedback.js"],
|
["Feedback", ["Feedback:Show"], "chrome://browser/content/Feedback.js"],
|
||||||
["SelectionHandler", ["TextSelection:Get"], "chrome://browser/content/SelectionHandler.js"],
|
["SelectionHandler", ["TextSelection:Get"], "chrome://browser/content/SelectionHandler.js"],
|
||||||
["EmbedRT", ["GeckoView:ImportScript"], "chrome://browser/content/EmbedRT.js"],
|
["EmbedRT", ["GeckoView:ImportScript"], "chrome://browser/content/EmbedRT.js"],
|
||||||
|
["Reader", ["Reader:Removed"], "chrome://browser/content/Reader.js"],
|
||||||
].forEach(function (aScript) {
|
].forEach(function (aScript) {
|
||||||
let [name, notifications, script] = aScript;
|
let [name, notifications, script] = aScript;
|
||||||
XPCOMUtils.defineLazyGetter(window, name, function() {
|
XPCOMUtils.defineLazyGetter(window, name, function() {
|
||||||
@ -447,7 +449,6 @@ var BrowserApp = {
|
|||||||
#ifdef NIGHTLY_BUILD
|
#ifdef NIGHTLY_BUILD
|
||||||
ShumwayUtils.init();
|
ShumwayUtils.init();
|
||||||
#endif
|
#endif
|
||||||
Reader.init();
|
|
||||||
|
|
||||||
let url = null;
|
let url = null;
|
||||||
let pinned = false;
|
let pinned = false;
|
||||||
@ -499,8 +500,6 @@ var BrowserApp = {
|
|||||||
// Tiles reporting is disabled.
|
// Tiles reporting is disabled.
|
||||||
}
|
}
|
||||||
|
|
||||||
window.messageManager.loadFrameScript("chrome://browser/content/content.js", true);
|
|
||||||
|
|
||||||
// Notify Java that Gecko has loaded.
|
// Notify Java that Gecko has loaded.
|
||||||
Messaging.sendRequest({ type: "Gecko:Ready" });
|
Messaging.sendRequest({ type: "Gecko:Ready" });
|
||||||
},
|
},
|
||||||
@ -3225,7 +3224,7 @@ function Tab(aURL, aParams) {
|
|||||||
this.clickToPlayPluginsActivated = false;
|
this.clickToPlayPluginsActivated = false;
|
||||||
this.desktopMode = false;
|
this.desktopMode = false;
|
||||||
this.originalURI = null;
|
this.originalURI = null;
|
||||||
this.isArticle = false;
|
this.savedArticle = null;
|
||||||
this.hasTouchListener = false;
|
this.hasTouchListener = false;
|
||||||
this.browserWidth = 0;
|
this.browserWidth = 0;
|
||||||
this.browserHeight = 0;
|
this.browserHeight = 0;
|
||||||
@ -3566,6 +3565,7 @@ Tab.prototype = {
|
|||||||
BrowserApp.deck.selectedPanel = selectedPanel;
|
BrowserApp.deck.selectedPanel = selectedPanel;
|
||||||
|
|
||||||
this.browser = null;
|
this.browser = null;
|
||||||
|
this.savedArticle = null;
|
||||||
},
|
},
|
||||||
|
|
||||||
// This should be called to update the browser when the tab gets selected/unselected
|
// This should be called to update the browser when the tab gets selected/unselected
|
||||||
@ -3961,6 +3961,14 @@ Tab.prototype = {
|
|||||||
}
|
}
|
||||||
|
|
||||||
if (docURI.startsWith("about:reader")) {
|
if (docURI.startsWith("about:reader")) {
|
||||||
|
// During browser restart / recovery, duplicate "DOMContentLoaded" messages are received here
|
||||||
|
// For the visible tab ... where more than one tab is being reloaded, the inital "DOMContentLoaded"
|
||||||
|
// Message can be received before the document body is available ... so we avoid instantiating an
|
||||||
|
// AboutReader object, expecting that an eventual valid message will follow.
|
||||||
|
let contentDocument = this.browser.contentDocument;
|
||||||
|
if (contentDocument.body) {
|
||||||
|
new AboutReader(contentDocument, this.browser.contentWindow);
|
||||||
|
}
|
||||||
// Update the page action to show the "reader active" icon.
|
// Update the page action to show the "reader active" icon.
|
||||||
Reader.updatePageAction(this);
|
Reader.updatePageAction(this);
|
||||||
}
|
}
|
||||||
@ -4265,6 +4273,31 @@ Tab.prototype = {
|
|||||||
xhr.send(this.tilesData);
|
xhr.send(this.tilesData);
|
||||||
this.tilesData = null;
|
this.tilesData = null;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Don't try to parse the document if reader mode is disabled,
|
||||||
|
// or if the page is already in reader mode.
|
||||||
|
if (!Reader.isEnabledForParseOnLoad || this.readerActive) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Reader mode is disabled until proven enabled.
|
||||||
|
this.savedArticle = null;
|
||||||
|
Reader.updatePageAction(this);
|
||||||
|
|
||||||
|
// Once document is fully loaded, parse it
|
||||||
|
ReaderMode.parseDocumentFromBrowser(this.browser).then(article => {
|
||||||
|
// The loaded page may have changed while we were parsing the document.
|
||||||
|
// Make sure we've got the current one.
|
||||||
|
let currentURL = this.browser.currentURI.specIgnoringRef;
|
||||||
|
|
||||||
|
// Do nothing if there's no article or the page in this tab has changed.
|
||||||
|
if (article == null || (article.url != currentURL)) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.savedArticle = article;
|
||||||
|
Reader.updatePageAction(this);
|
||||||
|
}).catch(e => Cu.reportError("Error parsing document from tab: " + e));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|||||||
@ -1,86 +0,0 @@
|
|||||||
/* -*- indent-tabs-mode: nil; js-indent-level: 2 -*- */
|
|
||||||
/* This Source Code Form is subject to the terms of the Mozilla Public
|
|
||||||
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
|
||||||
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
|
||||||
|
|
||||||
let { classes: Cc, interfaces: Ci, utils: Cu } = Components;
|
|
||||||
|
|
||||||
Cu.import("resource://gre/modules/Services.jsm");
|
|
||||||
Cu.import("resource://gre/modules/XPCOMUtils.jsm");
|
|
||||||
|
|
||||||
XPCOMUtils.defineLazyModuleGetter(this, "AboutReader", "resource://gre/modules/AboutReader.jsm");
|
|
||||||
XPCOMUtils.defineLazyModuleGetter(this, "ReaderMode", "resource://gre/modules/ReaderMode.jsm");
|
|
||||||
|
|
||||||
let dump = Cu.import("resource://gre/modules/AndroidLog.jsm", {}).AndroidLog.d.bind(null, "Content");
|
|
||||||
|
|
||||||
let global = this;
|
|
||||||
|
|
||||||
let AboutReaderListener = {
|
|
||||||
_savedArticle: null,
|
|
||||||
|
|
||||||
init: function() {
|
|
||||||
addEventListener("AboutReaderContentLoaded", this, false, true);
|
|
||||||
addEventListener("pageshow", this, false);
|
|
||||||
addMessageListener("Reader:SavedArticleGet", this);
|
|
||||||
},
|
|
||||||
|
|
||||||
receiveMessage: function(message) {
|
|
||||||
switch (message.name) {
|
|
||||||
case "Reader:SavedArticleGet":
|
|
||||||
sendAsyncMessage("Reader:SavedArticleData", { article: this._savedArticle });
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
get isAboutReader() {
|
|
||||||
return content.document.documentURI.startsWith("about:reader");
|
|
||||||
},
|
|
||||||
|
|
||||||
handleEvent: function(event) {
|
|
||||||
if (event.originalTarget.defaultView != content) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
switch (event.type) {
|
|
||||||
case "AboutReaderContentLoaded":
|
|
||||||
if (!this.isAboutReader) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
// If we are restoring multiple reader mode tabs during session restore, duplicate "DOMContentLoaded"
|
|
||||||
// events may be fired for the visible tab. The inital "DOMContentLoaded" may be received before the
|
|
||||||
// document body is available, so we avoid instantiating an AboutReader object, expecting that a
|
|
||||||
// valid message will follow. See bug 925983.
|
|
||||||
if (content.document.body) {
|
|
||||||
new AboutReader(global, content);
|
|
||||||
}
|
|
||||||
break;
|
|
||||||
|
|
||||||
case "pageshow":
|
|
||||||
if (!ReaderMode.isEnabledForParseOnLoad || this.isAboutReader) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Reader mode is disabled until proven enabled.
|
|
||||||
this._savedArticle = null;
|
|
||||||
sendAsyncMessage("Reader:UpdateIsArticle", { isArticle: false });
|
|
||||||
|
|
||||||
ReaderMode.parseDocument(content.document).then(article => {
|
|
||||||
// The loaded page may have changed while we were parsing the document.
|
|
||||||
// Make sure we've got the current one.
|
|
||||||
let currentURL = Services.io.newURI(content.document.documentURI, null, null).specIgnoringRef;
|
|
||||||
|
|
||||||
// Do nothing if there's no article or the page in this tab has changed.
|
|
||||||
if (article == null || (article.url != currentURL)) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
this._savedArticle = article;
|
|
||||||
sendAsyncMessage("Reader:UpdateIsArticle", { isArticle: true });
|
|
||||||
|
|
||||||
}).catch(e => Cu.reportError("Error parsing document: " + e));
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
AboutReaderListener.init();
|
|
||||||
@ -10,7 +10,6 @@ chrome.jar:
|
|||||||
* content/about.xhtml (content/about.xhtml)
|
* content/about.xhtml (content/about.xhtml)
|
||||||
content/config.xhtml (content/config.xhtml)
|
content/config.xhtml (content/config.xhtml)
|
||||||
content/config.js (content/config.js)
|
content/config.js (content/config.js)
|
||||||
content/content.js (content/content.js)
|
|
||||||
content/aboutAddons.xhtml (content/aboutAddons.xhtml)
|
content/aboutAddons.xhtml (content/aboutAddons.xhtml)
|
||||||
content/aboutAddons.js (content/aboutAddons.js)
|
content/aboutAddons.js (content/aboutAddons.js)
|
||||||
content/aboutCertError.xhtml (content/aboutCertError.xhtml)
|
content/aboutCertError.xhtml (content/aboutCertError.xhtml)
|
||||||
|
|||||||
@ -1,792 +0,0 @@
|
|||||||
/* This Source Code Form is subject to the terms of the Mozilla Public
|
|
||||||
* License, v. 2.0. If a copy of the MPL was not distributed with this file,
|
|
||||||
* You can obtain one at http://mozilla.org/MPL/2.0/. */
|
|
||||||
|
|
||||||
"use strict";
|
|
||||||
|
|
||||||
let Ci = Components.interfaces, Cc = Components.classes, Cu = Components.utils;
|
|
||||||
|
|
||||||
this.EXPORTED_SYMBOLS = [ "AboutReader" ];
|
|
||||||
|
|
||||||
Cu.import("resource://gre/modules/Services.jsm");
|
|
||||||
Cu.import("resource://gre/modules/XPCOMUtils.jsm");
|
|
||||||
|
|
||||||
XPCOMUtils.defineLazyModuleGetter(this, "Rect", "resource://gre/modules/Geometry.jsm");
|
|
||||||
XPCOMUtils.defineLazyModuleGetter(this, "Task", "resource://gre/modules/Task.jsm");
|
|
||||||
XPCOMUtils.defineLazyModuleGetter(this, "UITelemetry", "resource://gre/modules/UITelemetry.jsm");
|
|
||||||
|
|
||||||
function dump(s) {
|
|
||||||
Services.console.logStringMessage("AboutReader: " + s);
|
|
||||||
}
|
|
||||||
|
|
||||||
let gStrings = Services.strings.createBundle("chrome://global/locale/aboutReader.properties");
|
|
||||||
|
|
||||||
let AboutReader = function(mm, win) {
|
|
||||||
let doc = win.document;
|
|
||||||
|
|
||||||
this._mm = mm;
|
|
||||||
this._mm.addMessageListener("Reader:Added", this);
|
|
||||||
this._mm.addMessageListener("Reader:Removed", this);
|
|
||||||
|
|
||||||
this._docRef = Cu.getWeakReference(doc);
|
|
||||||
this._winRef = Cu.getWeakReference(win);
|
|
||||||
|
|
||||||
this._article = null;
|
|
||||||
|
|
||||||
this._headerElementRef = Cu.getWeakReference(doc.getElementById("reader-header"));
|
|
||||||
this._domainElementRef = Cu.getWeakReference(doc.getElementById("reader-domain"));
|
|
||||||
this._titleElementRef = Cu.getWeakReference(doc.getElementById("reader-title"));
|
|
||||||
this._creditsElementRef = Cu.getWeakReference(doc.getElementById("reader-credits"));
|
|
||||||
this._contentElementRef = Cu.getWeakReference(doc.getElementById("reader-content"));
|
|
||||||
this._toolbarElementRef = Cu.getWeakReference(doc.getElementById("reader-toolbar"));
|
|
||||||
this._messageElementRef = Cu.getWeakReference(doc.getElementById("reader-message"));
|
|
||||||
|
|
||||||
this._toolbarEnabled = false;
|
|
||||||
|
|
||||||
this._scrollOffset = win.pageYOffset;
|
|
||||||
|
|
||||||
let body = doc.body;
|
|
||||||
body.addEventListener("touchstart", this, false);
|
|
||||||
body.addEventListener("click", this, false);
|
|
||||||
|
|
||||||
win.addEventListener("unload", this, false);
|
|
||||||
win.addEventListener("scroll", this, false);
|
|
||||||
win.addEventListener("popstate", this, false);
|
|
||||||
win.addEventListener("resize", this, false);
|
|
||||||
|
|
||||||
doc.addEventListener("visibilitychange", this, false);
|
|
||||||
|
|
||||||
this._setupAllDropdowns();
|
|
||||||
this._setupButton("toggle-button", this._onReaderToggle.bind(this));
|
|
||||||
this._setupButton("share-button", this._onShare.bind(this));
|
|
||||||
|
|
||||||
let colorSchemeOptions = [
|
|
||||||
{ name: gStrings.GetStringFromName("aboutReader.colorSchemeDark"),
|
|
||||||
value: "dark"},
|
|
||||||
{ name: gStrings.GetStringFromName("aboutReader.colorSchemeLight"),
|
|
||||||
value: "light"},
|
|
||||||
{ name: gStrings.GetStringFromName("aboutReader.colorSchemeAuto"),
|
|
||||||
value: "auto"}
|
|
||||||
];
|
|
||||||
|
|
||||||
let colorScheme = Services.prefs.getCharPref("reader.color_scheme");
|
|
||||||
this._setupSegmentedButton("color-scheme-buttons", colorSchemeOptions, colorScheme, this._setColorSchemePref.bind(this));
|
|
||||||
this._setColorSchemePref(colorScheme);
|
|
||||||
|
|
||||||
let fontTypeSample = gStrings.GetStringFromName("aboutReader.fontTypeSample");
|
|
||||||
let fontTypeOptions = [
|
|
||||||
{ name: fontTypeSample,
|
|
||||||
description: gStrings.GetStringFromName("aboutReader.fontTypeSerif"),
|
|
||||||
value: "serif",
|
|
||||||
linkClass: "serif" },
|
|
||||||
{ name: fontTypeSample,
|
|
||||||
description: gStrings.GetStringFromName("aboutReader.fontTypeSansSerif"),
|
|
||||||
value: "sans-serif",
|
|
||||||
linkClass: "sans-serif"
|
|
||||||
},
|
|
||||||
];
|
|
||||||
|
|
||||||
let fontType = Services.prefs.getCharPref("reader.font_type");
|
|
||||||
this._setupSegmentedButton("font-type-buttons", fontTypeOptions, fontType, this._setFontType.bind(this));
|
|
||||||
this._setFontType(fontType);
|
|
||||||
|
|
||||||
let fontSizeSample = gStrings.GetStringFromName("aboutReader.fontSizeSample");
|
|
||||||
let fontSizeOptions = [
|
|
||||||
{ name: fontSizeSample,
|
|
||||||
value: 1,
|
|
||||||
linkClass: "font-size1-sample" },
|
|
||||||
{ name: fontSizeSample,
|
|
||||||
value: 2,
|
|
||||||
linkClass: "font-size2-sample" },
|
|
||||||
{ name: fontSizeSample,
|
|
||||||
value: 3,
|
|
||||||
linkClass: "font-size3-sample" },
|
|
||||||
{ name: fontSizeSample,
|
|
||||||
value: 4,
|
|
||||||
linkClass: "font-size4-sample" },
|
|
||||||
{ name: fontSizeSample,
|
|
||||||
value: 5,
|
|
||||||
linkClass: "font-size5-sample" }
|
|
||||||
];
|
|
||||||
|
|
||||||
let fontSize = Services.prefs.getIntPref("reader.font_size");
|
|
||||||
this._setupSegmentedButton("font-size-buttons", fontSizeOptions, fontSize, this._setFontSize.bind(this));
|
|
||||||
this._setFontSize(fontSize);
|
|
||||||
|
|
||||||
let queryArgs = this._decodeQueryString(win.location.href);
|
|
||||||
|
|
||||||
// Track status of reader toolbar add/remove toggle button
|
|
||||||
this._isReadingListItem = -1;
|
|
||||||
this._updateToggleButton();
|
|
||||||
|
|
||||||
this._loadArticle(queryArgs.url);
|
|
||||||
}
|
|
||||||
|
|
||||||
AboutReader.prototype = {
|
|
||||||
_BLOCK_IMAGES_SELECTOR: ".content p > img:only-child, " +
|
|
||||||
".content p > a:only-child > img:only-child, " +
|
|
||||||
".content .wp-caption img, " +
|
|
||||||
".content figure img",
|
|
||||||
|
|
||||||
get _doc() {
|
|
||||||
return this._docRef.get();
|
|
||||||
},
|
|
||||||
|
|
||||||
get _win() {
|
|
||||||
return this._winRef.get();
|
|
||||||
},
|
|
||||||
|
|
||||||
get _headerElement() {
|
|
||||||
return this._headerElementRef.get();
|
|
||||||
},
|
|
||||||
|
|
||||||
get _domainElement() {
|
|
||||||
return this._domainElementRef.get();
|
|
||||||
},
|
|
||||||
|
|
||||||
get _titleElement() {
|
|
||||||
return this._titleElementRef.get();
|
|
||||||
},
|
|
||||||
|
|
||||||
get _creditsElement() {
|
|
||||||
return this._creditsElementRef.get();
|
|
||||||
},
|
|
||||||
|
|
||||||
get _contentElement() {
|
|
||||||
return this._contentElementRef.get();
|
|
||||||
},
|
|
||||||
|
|
||||||
get _toolbarElement() {
|
|
||||||
return this._toolbarElementRef.get();
|
|
||||||
},
|
|
||||||
|
|
||||||
get _messageElement() {
|
|
||||||
return this._messageElementRef.get();
|
|
||||||
},
|
|
||||||
|
|
||||||
receiveMessage: function (message) {
|
|
||||||
switch (message.name) {
|
|
||||||
case "Reader:Added": {
|
|
||||||
// Page can be added by long-press pageAction, or by tap on banner icon.
|
|
||||||
if (message.data.url == this._article.url) {
|
|
||||||
if (this._isReadingListItem != 1) {
|
|
||||||
this._isReadingListItem = 1;
|
|
||||||
this._updateToggleButton();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
case "Reader:Removed": {
|
|
||||||
if (message.data.url == this._article.url) {
|
|
||||||
if (this._isReadingListItem != 0) {
|
|
||||||
this._isReadingListItem = 0;
|
|
||||||
this._updateToggleButton();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
handleEvent: function Reader_handleEvent(aEvent) {
|
|
||||||
if (!aEvent.isTrusted)
|
|
||||||
return;
|
|
||||||
|
|
||||||
switch (aEvent.type) {
|
|
||||||
case "click":
|
|
||||||
// XXX: Don't toggle the toolbar on double click. (See the "Gesture:DoubleTap" handler in Reader.js)
|
|
||||||
this._toggleToolbarVisibility();
|
|
||||||
break;
|
|
||||||
case "scroll":
|
|
||||||
let isScrollingUp = this._scrollOffset > aEvent.pageY;
|
|
||||||
this._setToolbarVisibility(isScrollingUp);
|
|
||||||
this._scrollOffset = aEvent.pageY;
|
|
||||||
break;
|
|
||||||
case "popstate":
|
|
||||||
if (!aEvent.state)
|
|
||||||
this._closeAllDropdowns();
|
|
||||||
break;
|
|
||||||
case "resize":
|
|
||||||
this._updateImageMargins();
|
|
||||||
break;
|
|
||||||
|
|
||||||
case "devicelight":
|
|
||||||
this._handleDeviceLight(aEvent.value);
|
|
||||||
break;
|
|
||||||
|
|
||||||
case "visibilitychange":
|
|
||||||
this._handleVisibilityChange();
|
|
||||||
break;
|
|
||||||
|
|
||||||
case "unload":
|
|
||||||
this._mm.removeMessageListener("Reader:Added", this);
|
|
||||||
this._mm.removeMessageListener("Reader:Removed", this);
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
_updateToggleButton: function Reader_updateToggleButton() {
|
|
||||||
let classes = this._doc.getElementById("toggle-button").classList;
|
|
||||||
|
|
||||||
if (this._isReadingListItem == 1) {
|
|
||||||
classes.add("on");
|
|
||||||
} else {
|
|
||||||
classes.remove("on");
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
_requestReadingListStatus: function Reader_requestReadingListStatus() {
|
|
||||||
let handleListStatusData = (message) => {
|
|
||||||
this._mm.removeMessageListener("Reader:ListStatusData", handleListStatusData);
|
|
||||||
|
|
||||||
let args = message.data;
|
|
||||||
if (args.url == this._article.url) {
|
|
||||||
if (this._isReadingListItem != args.inReadingList) {
|
|
||||||
let isInitialStateChange = (this._isReadingListItem == -1);
|
|
||||||
this._isReadingListItem = args.inReadingList;
|
|
||||||
this._updateToggleButton();
|
|
||||||
|
|
||||||
// Display the toolbar when all its initial component states are known
|
|
||||||
if (isInitialStateChange) {
|
|
||||||
this._setToolbarVisibility(true);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
this._mm.addMessageListener("Reader:ListStatusData", handleListStatusData);
|
|
||||||
this._mm.sendAsyncMessage("Reader:ListStatusRequest", { url: this._article.url });
|
|
||||||
},
|
|
||||||
|
|
||||||
_onReaderToggle: function Reader_onToggle() {
|
|
||||||
if (!this._article)
|
|
||||||
return;
|
|
||||||
|
|
||||||
if (this._isReadingListItem == 0) {
|
|
||||||
this._mm.sendAsyncMessage("Reader:AddToList", { article: this._article });
|
|
||||||
UITelemetry.addEvent("save.1", "button", null, "reader");
|
|
||||||
} else {
|
|
||||||
this._mm.sendAsyncMessage("Reader:RemoveFromList", { url: this._article.url });
|
|
||||||
UITelemetry.addEvent("unsave.1", "button", null, "reader");
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
_onShare: function Reader_onShare() {
|
|
||||||
if (!this._article)
|
|
||||||
return;
|
|
||||||
|
|
||||||
this._mm.sendAsyncMessage("Reader:Share", {
|
|
||||||
url: this._article.url,
|
|
||||||
title: this._article.title
|
|
||||||
});
|
|
||||||
UITelemetry.addEvent("share.1", "list", null);
|
|
||||||
},
|
|
||||||
|
|
||||||
_setFontSize: function Reader_setFontSize(newFontSize) {
|
|
||||||
let bodyClasses = this._doc.body.classList;
|
|
||||||
|
|
||||||
if (this._fontSize > 0)
|
|
||||||
bodyClasses.remove("font-size" + this._fontSize);
|
|
||||||
|
|
||||||
this._fontSize = newFontSize;
|
|
||||||
bodyClasses.add("font-size" + this._fontSize);
|
|
||||||
|
|
||||||
Services.prefs.setIntPref("reader.font_size", this._fontSize);
|
|
||||||
},
|
|
||||||
|
|
||||||
_handleDeviceLight: function Reader_handleDeviceLight(newLux) {
|
|
||||||
// Desired size of the this._luxValues array.
|
|
||||||
let luxValuesSize = 10;
|
|
||||||
// Add new lux value at the front of the array.
|
|
||||||
this._luxValues.unshift(newLux);
|
|
||||||
// Add new lux value to this._totalLux for averaging later.
|
|
||||||
this._totalLux += newLux;
|
|
||||||
|
|
||||||
// Don't update when length of array is less than luxValuesSize except when it is 1.
|
|
||||||
if (this._luxValues.length < luxValuesSize) {
|
|
||||||
// Use the first lux value to set the color scheme until our array equals luxValuesSize.
|
|
||||||
if (this._luxValues.length == 1) {
|
|
||||||
this._updateColorScheme(newLux);
|
|
||||||
}
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
// Holds the average of the lux values collected in this._luxValues.
|
|
||||||
let averageLuxValue = this._totalLux/luxValuesSize;
|
|
||||||
|
|
||||||
this._updateColorScheme(averageLuxValue);
|
|
||||||
// Pop the oldest value off the array.
|
|
||||||
let oldLux = this._luxValues.pop();
|
|
||||||
// Subtract oldLux since it has been discarded from the array.
|
|
||||||
this._totalLux -= oldLux;
|
|
||||||
},
|
|
||||||
|
|
||||||
_handleVisibilityChange: function Reader_handleVisibilityChange() {
|
|
||||||
let colorScheme = Services.prefs.getCharPref("reader.color_scheme");
|
|
||||||
if (colorScheme != "auto") {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Turn off the ambient light sensor if the page is hidden
|
|
||||||
this._enableAmbientLighting(!this._doc.hidden);
|
|
||||||
},
|
|
||||||
|
|
||||||
// Setup or teardown the ambient light tracking system.
|
|
||||||
_enableAmbientLighting: function Reader_enableAmbientLighting(enable) {
|
|
||||||
if (enable) {
|
|
||||||
this._win.addEventListener("devicelight", this, false);
|
|
||||||
this._luxValues = [];
|
|
||||||
this._totalLux = 0;
|
|
||||||
} else {
|
|
||||||
this._win.removeEventListener("devicelight", this, false);
|
|
||||||
delete this._luxValues;
|
|
||||||
delete this._totalLux;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
_updateColorScheme: function Reader_updateColorScheme(luxValue) {
|
|
||||||
// Upper bound value for "dark" color scheme beyond which it changes to "light".
|
|
||||||
let upperBoundDark = 50;
|
|
||||||
// Lower bound value for "light" color scheme beyond which it changes to "dark".
|
|
||||||
let lowerBoundLight = 10;
|
|
||||||
// Threshold for color scheme change.
|
|
||||||
let colorChangeThreshold = 20;
|
|
||||||
|
|
||||||
// Ignore changes that are within a certain threshold of previous lux values.
|
|
||||||
if ((this._colorScheme === "dark" && luxValue < upperBoundDark) ||
|
|
||||||
(this._colorScheme === "light" && luxValue > lowerBoundLight))
|
|
||||||
return;
|
|
||||||
|
|
||||||
if (luxValue < colorChangeThreshold)
|
|
||||||
this._setColorScheme("dark");
|
|
||||||
else
|
|
||||||
this._setColorScheme("light");
|
|
||||||
},
|
|
||||||
|
|
||||||
_setColorScheme: function Reader_setColorScheme(newColorScheme) {
|
|
||||||
// "auto" is not a real color scheme
|
|
||||||
if (this._colorScheme === newColorScheme || newColorScheme === "auto")
|
|
||||||
return;
|
|
||||||
|
|
||||||
let bodyClasses = this._doc.body.classList;
|
|
||||||
|
|
||||||
if (this._colorScheme)
|
|
||||||
bodyClasses.remove(this._colorScheme);
|
|
||||||
|
|
||||||
this._colorScheme = newColorScheme;
|
|
||||||
bodyClasses.add(this._colorScheme);
|
|
||||||
},
|
|
||||||
|
|
||||||
// Pref values include "dark", "light", and "auto", which automatically switches
|
|
||||||
// between light and dark color schemes based on the ambient light level.
|
|
||||||
_setColorSchemePref: function Reader_setColorSchemePref(colorSchemePref) {
|
|
||||||
this._enableAmbientLighting(colorSchemePref === "auto");
|
|
||||||
this._setColorScheme(colorSchemePref);
|
|
||||||
|
|
||||||
Services.prefs.setCharPref("reader.color_scheme", colorSchemePref);
|
|
||||||
},
|
|
||||||
|
|
||||||
_setFontType: function Reader_setFontType(newFontType) {
|
|
||||||
if (this._fontType === newFontType)
|
|
||||||
return;
|
|
||||||
|
|
||||||
let bodyClasses = this._doc.body.classList;
|
|
||||||
|
|
||||||
if (this._fontType)
|
|
||||||
bodyClasses.remove(this._fontType);
|
|
||||||
|
|
||||||
this._fontType = newFontType;
|
|
||||||
bodyClasses.add(this._fontType);
|
|
||||||
|
|
||||||
Services.prefs.setCharPref("reader.font_type", this._fontType);
|
|
||||||
},
|
|
||||||
|
|
||||||
_getToolbarVisibility: function Reader_getToolbarVisibility() {
|
|
||||||
return !this._toolbarElement.classList.contains("toolbar-hidden");
|
|
||||||
},
|
|
||||||
|
|
||||||
_setToolbarVisibility: function Reader_setToolbarVisibility(visible) {
|
|
||||||
let win = this._win;
|
|
||||||
if (win.history.state)
|
|
||||||
win.history.back();
|
|
||||||
|
|
||||||
if (!this._toolbarEnabled)
|
|
||||||
return;
|
|
||||||
|
|
||||||
// Don't allow visible toolbar until banner state is known
|
|
||||||
if (this._isReadingListItem == -1)
|
|
||||||
return;
|
|
||||||
|
|
||||||
if (this._getToolbarVisibility() === visible)
|
|
||||||
return;
|
|
||||||
|
|
||||||
this._toolbarElement.classList.toggle("toolbar-hidden");
|
|
||||||
this._setSystemUIVisibility(visible);
|
|
||||||
|
|
||||||
if (!visible && !this._hasUsedToolbar) {
|
|
||||||
this._hasUsedToolbar = Services.prefs.getBoolPref("reader.has_used_toolbar");
|
|
||||||
if (!this._hasUsedToolbar) {
|
|
||||||
this._mm.sendAsyncMessage("Reader:ShowToast", { toast: gStrings.GetStringFromName("aboutReader.toolbarTip") });
|
|
||||||
Services.prefs.setBoolPref("reader.has_used_toolbar", true);
|
|
||||||
this._hasUsedToolbar = true;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
_toggleToolbarVisibility: function Reader_toggleToolbarVisibility() {
|
|
||||||
this._setToolbarVisibility(!this._getToolbarVisibility());
|
|
||||||
},
|
|
||||||
|
|
||||||
_setBrowserToolbarVisiblity: function Reader_setBrowserToolbarVisiblity(visible) {
|
|
||||||
this._mm.sendAsyncMessage("Reader:ToolbarVisibility", { visible: visible });
|
|
||||||
},
|
|
||||||
|
|
||||||
_setSystemUIVisibility: function Reader_setSystemUIVisibility(visible) {
|
|
||||||
this._mm.sendAsyncMessage("Reader:SystemUIVisibility", { visible: visible });
|
|
||||||
},
|
|
||||||
|
|
||||||
_loadArticle: Task.async(function* (url) {
|
|
||||||
this._showProgressDelayed();
|
|
||||||
|
|
||||||
let article = yield this._getArticle(url);
|
|
||||||
if (article && article.url == url) {
|
|
||||||
this._showContent(article);
|
|
||||||
} else {
|
|
||||||
this._win.location.href = url;
|
|
||||||
}
|
|
||||||
}),
|
|
||||||
|
|
||||||
_getArticle: function(url) {
|
|
||||||
return new Promise((resolve, reject) => {
|
|
||||||
let listener = (message) => {
|
|
||||||
this._mm.removeMessageListener("Reader:ArticleData", listener);
|
|
||||||
resolve(message.data.article);
|
|
||||||
};
|
|
||||||
this._mm.addMessageListener("Reader:ArticleData", listener);
|
|
||||||
this._mm.sendAsyncMessage("Reader:ArticleGet", { url: url });
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
_requestFavicon: function Reader_requestFavicon() {
|
|
||||||
let handleFaviconReturn = (message) => {
|
|
||||||
this._mm.removeMessageListener("Reader:FaviconReturn", handleFaviconReturn);
|
|
||||||
this._loadFavicon(message.data.url, message.data.faviconUrl);
|
|
||||||
};
|
|
||||||
|
|
||||||
this._mm.addMessageListener("Reader:FaviconReturn", handleFaviconReturn);
|
|
||||||
this._mm.sendAsyncMessage("Reader:FaviconRequest", { url: this._article.url });
|
|
||||||
},
|
|
||||||
|
|
||||||
_loadFavicon: function Reader_loadFavicon(url, faviconUrl) {
|
|
||||||
if (this._article.url !== url)
|
|
||||||
return;
|
|
||||||
|
|
||||||
let doc = this._doc;
|
|
||||||
|
|
||||||
let link = doc.createElement('link');
|
|
||||||
link.rel = 'shortcut icon';
|
|
||||||
link.href = faviconUrl;
|
|
||||||
|
|
||||||
doc.getElementsByTagName('head')[0].appendChild(link);
|
|
||||||
},
|
|
||||||
|
|
||||||
_updateImageMargins: function Reader_updateImageMargins() {
|
|
||||||
let windowWidth = this._win.innerWidth;
|
|
||||||
let contentWidth = this._contentElement.offsetWidth;
|
|
||||||
let maxWidthStyle = windowWidth + "px !important";
|
|
||||||
|
|
||||||
let setImageMargins = function(img) {
|
|
||||||
if (!img._originalWidth)
|
|
||||||
img._originalWidth = img.offsetWidth;
|
|
||||||
|
|
||||||
let imgWidth = img._originalWidth;
|
|
||||||
|
|
||||||
// If the image is taking more than half of the screen, just make
|
|
||||||
// it fill edge-to-edge.
|
|
||||||
if (imgWidth < contentWidth && imgWidth > windowWidth * 0.55)
|
|
||||||
imgWidth = windowWidth;
|
|
||||||
|
|
||||||
let sideMargin = Math.max((contentWidth - windowWidth) / 2,
|
|
||||||
(contentWidth - imgWidth) / 2);
|
|
||||||
|
|
||||||
let imageStyle = sideMargin + "px !important";
|
|
||||||
let widthStyle = imgWidth + "px !important";
|
|
||||||
|
|
||||||
let cssText = "max-width: " + maxWidthStyle + ";" +
|
|
||||||
"width: " + widthStyle + ";" +
|
|
||||||
"margin-left: " + imageStyle + ";" +
|
|
||||||
"margin-right: " + imageStyle + ";";
|
|
||||||
|
|
||||||
img.style.cssText = cssText;
|
|
||||||
}
|
|
||||||
|
|
||||||
let imgs = this._doc.querySelectorAll(this._BLOCK_IMAGES_SELECTOR);
|
|
||||||
for (let i = imgs.length; --i >= 0;) {
|
|
||||||
let img = imgs[i];
|
|
||||||
|
|
||||||
if (img.width > 0) {
|
|
||||||
setImageMargins(img);
|
|
||||||
} else {
|
|
||||||
img.onload = function() {
|
|
||||||
setImageMargins(img);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
_maybeSetTextDirection: function Read_maybeSetTextDirection(article){
|
|
||||||
if(!article.dir)
|
|
||||||
return;
|
|
||||||
|
|
||||||
//Set "dir" attribute on content
|
|
||||||
this._contentElement.setAttribute("dir", article.dir);
|
|
||||||
this._headerElement.setAttribute("dir", article.dir);
|
|
||||||
},
|
|
||||||
|
|
||||||
_showError: function Reader_showError(error) {
|
|
||||||
this._headerElement.style.display = "none";
|
|
||||||
this._contentElement.style.display = "none";
|
|
||||||
|
|
||||||
this._messageElement.innerHTML = error;
|
|
||||||
this._messageElement.style.display = "block";
|
|
||||||
|
|
||||||
this._doc.title = error;
|
|
||||||
},
|
|
||||||
|
|
||||||
// This function is the JS version of Java's StringUtils.stripCommonSubdomains.
|
|
||||||
_stripHost: function Reader_stripHost(host) {
|
|
||||||
if (!host)
|
|
||||||
return host;
|
|
||||||
|
|
||||||
let start = 0;
|
|
||||||
|
|
||||||
if (host.startsWith("www."))
|
|
||||||
start = 4;
|
|
||||||
else if (host.startsWith("m."))
|
|
||||||
start = 2;
|
|
||||||
else if (host.startsWith("mobile."))
|
|
||||||
start = 7;
|
|
||||||
|
|
||||||
return host.substring(start);
|
|
||||||
},
|
|
||||||
|
|
||||||
_showContent: function Reader_showContent(article) {
|
|
||||||
this._messageElement.style.display = "none";
|
|
||||||
|
|
||||||
this._article = article;
|
|
||||||
|
|
||||||
this._domainElement.href = article.url;
|
|
||||||
let articleUri = Services.io.newURI(article.url, null, null);
|
|
||||||
this._domainElement.innerHTML = this._stripHost(articleUri.host);
|
|
||||||
|
|
||||||
this._creditsElement.innerHTML = article.byline;
|
|
||||||
|
|
||||||
this._titleElement.textContent = article.title;
|
|
||||||
this._doc.title = article.title;
|
|
||||||
|
|
||||||
this._headerElement.style.display = "block";
|
|
||||||
|
|
||||||
let parserUtils = Cc["@mozilla.org/parserutils;1"].getService(Ci.nsIParserUtils);
|
|
||||||
let contentFragment = parserUtils.parseFragment(article.content, Ci.nsIParserUtils.SanitizerDropForms,
|
|
||||||
false, articleUri, this._contentElement);
|
|
||||||
this._contentElement.innerHTML = "";
|
|
||||||
this._contentElement.appendChild(contentFragment);
|
|
||||||
this._updateImageMargins();
|
|
||||||
this._maybeSetTextDirection(article);
|
|
||||||
|
|
||||||
this._contentElement.style.display = "block";
|
|
||||||
this._requestReadingListStatus();
|
|
||||||
|
|
||||||
this._toolbarEnabled = true;
|
|
||||||
this._setToolbarVisibility(true);
|
|
||||||
|
|
||||||
this._requestFavicon();
|
|
||||||
},
|
|
||||||
|
|
||||||
_hideContent: function Reader_hideContent() {
|
|
||||||
this._headerElement.style.display = "none";
|
|
||||||
this._contentElement.style.display = "none";
|
|
||||||
},
|
|
||||||
|
|
||||||
_showProgressDelayed: function Reader_showProgressDelayed() {
|
|
||||||
this._win.setTimeout(function() {
|
|
||||||
// Article has already been loaded, no need to show
|
|
||||||
// progress anymore.
|
|
||||||
if (this._article)
|
|
||||||
return;
|
|
||||||
|
|
||||||
this._headerElement.style.display = "none";
|
|
||||||
this._contentElement.style.display = "none";
|
|
||||||
|
|
||||||
this._messageElement.innerHTML = gStrings.GetStringFromName("aboutReader.loading");
|
|
||||||
this._messageElement.style.display = "block";
|
|
||||||
}.bind(this), 300);
|
|
||||||
},
|
|
||||||
|
|
||||||
_decodeQueryString: function Reader_decodeQueryString(url) {
|
|
||||||
let result = {};
|
|
||||||
let query = url.split("?")[1];
|
|
||||||
if (query) {
|
|
||||||
let pairs = query.split("&");
|
|
||||||
for (let i = 0; i < pairs.length; i++) {
|
|
||||||
let [name, value] = pairs[i].split("=");
|
|
||||||
result[name] = decodeURIComponent(value);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return result;
|
|
||||||
},
|
|
||||||
|
|
||||||
_setupSegmentedButton: function Reader_setupSegmentedButton(id, options, initialValue, callback) {
|
|
||||||
let doc = this._doc;
|
|
||||||
let segmentedButton = doc.getElementById(id);
|
|
||||||
|
|
||||||
for (let i = 0; i < options.length; i++) {
|
|
||||||
let option = options[i];
|
|
||||||
|
|
||||||
let item = doc.createElement("li");
|
|
||||||
let link = doc.createElement("a");
|
|
||||||
link.textContent = option.name;
|
|
||||||
item.appendChild(link);
|
|
||||||
|
|
||||||
if (option.linkClass !== undefined)
|
|
||||||
link.classList.add(option.linkClass);
|
|
||||||
|
|
||||||
if (option.description !== undefined) {
|
|
||||||
let description = doc.createElement("div");
|
|
||||||
description.textContent = option.description;
|
|
||||||
item.appendChild(description);
|
|
||||||
}
|
|
||||||
|
|
||||||
link.style.MozUserSelect = 'none';
|
|
||||||
segmentedButton.appendChild(item);
|
|
||||||
|
|
||||||
link.addEventListener("click", function(aEvent) {
|
|
||||||
if (!aEvent.isTrusted)
|
|
||||||
return;
|
|
||||||
|
|
||||||
aEvent.stopPropagation();
|
|
||||||
|
|
||||||
// Just pass the ID of the button as an extra and hope the ID doesn't change
|
|
||||||
// unless the context changes
|
|
||||||
UITelemetry.addEvent("action.1", "button", null, id);
|
|
||||||
|
|
||||||
let items = segmentedButton.children;
|
|
||||||
for (let j = items.length - 1; j >= 0; j--) {
|
|
||||||
items[j].classList.remove("selected");
|
|
||||||
}
|
|
||||||
|
|
||||||
item.classList.add("selected");
|
|
||||||
callback(option.value);
|
|
||||||
}.bind(this), true);
|
|
||||||
|
|
||||||
if (option.value === initialValue)
|
|
||||||
item.classList.add("selected");
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
_setupButton: function Reader_setupButton(id, callback) {
|
|
||||||
let button = this._doc.getElementById(id);
|
|
||||||
|
|
||||||
button.addEventListener("click", function(aEvent) {
|
|
||||||
if (!aEvent.isTrusted)
|
|
||||||
return;
|
|
||||||
|
|
||||||
aEvent.stopPropagation();
|
|
||||||
callback();
|
|
||||||
}, true);
|
|
||||||
},
|
|
||||||
|
|
||||||
_setupAllDropdowns: function Reader_setupAllDropdowns() {
|
|
||||||
let doc = this._doc;
|
|
||||||
let win = this._win;
|
|
||||||
|
|
||||||
let dropdowns = doc.getElementsByClassName("dropdown");
|
|
||||||
|
|
||||||
for (let i = dropdowns.length - 1; i >= 0; i--) {
|
|
||||||
let dropdown = dropdowns[i];
|
|
||||||
|
|
||||||
let dropdownToggle = dropdown.getElementsByClassName("dropdown-toggle")[0];
|
|
||||||
let dropdownPopup = dropdown.getElementsByClassName("dropdown-popup")[0];
|
|
||||||
|
|
||||||
if (!dropdownToggle || !dropdownPopup)
|
|
||||||
continue;
|
|
||||||
|
|
||||||
let dropdownArrow = doc.createElement("div");
|
|
||||||
dropdownArrow.className = "dropdown-arrow";
|
|
||||||
dropdownPopup.appendChild(dropdownArrow);
|
|
||||||
|
|
||||||
let updatePopupPosition = function() {
|
|
||||||
let popupWidth = dropdownPopup.offsetWidth + 30;
|
|
||||||
let arrowWidth = dropdownArrow.offsetWidth;
|
|
||||||
let toggleWidth = dropdownToggle.offsetWidth;
|
|
||||||
let toggleLeft = dropdownToggle.offsetLeft;
|
|
||||||
|
|
||||||
let popupShift = (toggleWidth - popupWidth) / 2;
|
|
||||||
let popupLeft = Math.max(0, Math.min(win.innerWidth - popupWidth, toggleLeft + popupShift));
|
|
||||||
dropdownPopup.style.left = popupLeft + "px";
|
|
||||||
|
|
||||||
let arrowShift = (toggleWidth - arrowWidth) / 2;
|
|
||||||
let arrowLeft = toggleLeft - popupLeft + arrowShift;
|
|
||||||
dropdownArrow.style.left = arrowLeft + "px";
|
|
||||||
};
|
|
||||||
|
|
||||||
win.addEventListener("resize", function(aEvent) {
|
|
||||||
if (!aEvent.isTrusted)
|
|
||||||
return;
|
|
||||||
|
|
||||||
// Wait for reflow before calculating the new position of the popup.
|
|
||||||
win.setTimeout(updatePopupPosition, 0);
|
|
||||||
}, true);
|
|
||||||
|
|
||||||
dropdownToggle.addEventListener("click", function(aEvent) {
|
|
||||||
if (!aEvent.isTrusted)
|
|
||||||
return;
|
|
||||||
|
|
||||||
aEvent.stopPropagation();
|
|
||||||
|
|
||||||
if (!this._getToolbarVisibility())
|
|
||||||
return;
|
|
||||||
|
|
||||||
let dropdownClasses = dropdown.classList;
|
|
||||||
|
|
||||||
if (dropdownClasses.contains("open")) {
|
|
||||||
win.history.back();
|
|
||||||
} else {
|
|
||||||
updatePopupPosition();
|
|
||||||
if (!this._closeAllDropdowns())
|
|
||||||
this._pushDropdownState();
|
|
||||||
|
|
||||||
dropdownClasses.add("open");
|
|
||||||
}
|
|
||||||
}.bind(this), true);
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
_pushDropdownState: function Reader_pushDropdownState() {
|
|
||||||
// FIXME: We're getting a NS_ERROR_UNEXPECTED error when we try
|
|
||||||
// to do win.history.pushState() here (see bug 682296). This is
|
|
||||||
// a workaround that allows us to push history state on the target
|
|
||||||
// content document.
|
|
||||||
|
|
||||||
let doc = this._doc;
|
|
||||||
let body = doc.body;
|
|
||||||
|
|
||||||
if (this._pushStateScript)
|
|
||||||
body.removeChild(this._pushStateScript);
|
|
||||||
|
|
||||||
this._pushStateScript = doc.createElement('script');
|
|
||||||
this._pushStateScript.type = "text/javascript";
|
|
||||||
this._pushStateScript.innerHTML = 'history.pushState({ dropdown: 1 }, document.title);';
|
|
||||||
|
|
||||||
body.appendChild(this._pushStateScript);
|
|
||||||
},
|
|
||||||
|
|
||||||
_closeAllDropdowns : function Reader_closeAllDropdowns() {
|
|
||||||
let dropdowns = this._doc.querySelectorAll(".dropdown.open");
|
|
||||||
for (let i = dropdowns.length - 1; i >= 0; i--) {
|
|
||||||
dropdowns[i].classList.remove("open");
|
|
||||||
}
|
|
||||||
|
|
||||||
return (dropdowns.length > 0)
|
|
||||||
}
|
|
||||||
};
|
|
||||||
@ -27,49 +27,16 @@ let ReaderMode = {
|
|||||||
// performance reasons)
|
// performance reasons)
|
||||||
MAX_ELEMS_TO_PARSE: 3000,
|
MAX_ELEMS_TO_PARSE: 3000,
|
||||||
|
|
||||||
get isEnabledForParseOnLoad() {
|
|
||||||
delete this.isEnabledForParseOnLoad;
|
|
||||||
|
|
||||||
// Listen for future pref changes.
|
|
||||||
Services.prefs.addObserver("reader.parse-on-load.", this, false);
|
|
||||||
|
|
||||||
return this.isEnabledForParseOnLoad = this._getStateForParseOnLoad();
|
|
||||||
},
|
|
||||||
|
|
||||||
get isOnLowMemoryPlatform() {
|
|
||||||
let memory = Cc["@mozilla.org/xpcom/memory-service;1"].getService(Ci.nsIMemory);
|
|
||||||
delete this.isOnLowMemoryPlatform;
|
|
||||||
return this.isOnLowMemoryPlatform = memory.isLowMemoryPlatform();
|
|
||||||
},
|
|
||||||
|
|
||||||
_getStateForParseOnLoad: function () {
|
|
||||||
let isEnabled = Services.prefs.getBoolPref("reader.parse-on-load.enabled");
|
|
||||||
let isForceEnabled = Services.prefs.getBoolPref("reader.parse-on-load.force-enabled");
|
|
||||||
// For low-memory devices, don't allow reader mode since it takes up a lot of memory.
|
|
||||||
// See https://bugzilla.mozilla.org/show_bug.cgi?id=792603 for details.
|
|
||||||
return isForceEnabled || (isEnabled && !this.isOnLowMemoryPlatform);
|
|
||||||
},
|
|
||||||
|
|
||||||
observe: function(aMessage, aTopic, aData) {
|
|
||||||
switch(aTopic) {
|
|
||||||
case "nsPref:changed":
|
|
||||||
if (aData.startsWith("reader.parse-on-load.")) {
|
|
||||||
this.isEnabledForParseOnLoad = this._getStateForParseOnLoad();
|
|
||||||
}
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Gets an article from a loaded browser's document. This method will parse the document
|
* Gets an article from a loaded browser's document. This method will parse the document
|
||||||
* if it does not find the article in the cache.
|
* if it does not find the article in the cache.
|
||||||
*
|
*
|
||||||
* @param doc A document to parse.
|
* @param browser A browser with a loaded page.
|
||||||
* @return {Promise}
|
* @return {Promise}
|
||||||
* @resolves JS object representing the article, or null if no article is found.
|
* @resolves JS object representing the article, or null if no article is found.
|
||||||
*/
|
*/
|
||||||
parseDocument: Task.async(function* (doc) {
|
parseDocumentFromBrowser: Task.async(function* (browser) {
|
||||||
let uri = Services.io.newURI(doc.documentURI, null, null);
|
let uri = browser.currentURI;
|
||||||
if (!this._shouldCheckUri(uri)) {
|
if (!this._shouldCheckUri(uri)) {
|
||||||
this.log("Reader mode disabled for URI");
|
this.log("Reader mode disabled for URI");
|
||||||
return null;
|
return null;
|
||||||
@ -82,6 +49,7 @@ let ReaderMode = {
|
|||||||
return article;
|
return article;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
let doc = browser.contentWindow.document;
|
||||||
return yield this._readerParse(uri, doc);
|
return yield this._readerParse(uri, doc);
|
||||||
}),
|
}),
|
||||||
|
|
||||||
|
|||||||
@ -6,8 +6,6 @@
|
|||||||
<meta name="viewport" content="width=device-width; user-scalable=0" />
|
<meta name="viewport" content="width=device-width; user-scalable=0" />
|
||||||
|
|
||||||
<link rel="stylesheet" href="chrome://global/skin/aboutReader.css" type="text/css"/>
|
<link rel="stylesheet" href="chrome://global/skin/aboutReader.css" type="text/css"/>
|
||||||
|
|
||||||
<script type="text/javascript;version=1.8" src="chrome://global/content/reader/aboutReader.js"></script>
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
|||||||
@ -1,9 +1,843 @@
|
|||||||
/* This Source Code Form is subject to the terms of the Mozilla Public
|
/* This Source Code Form is subject to the terms of the Mozilla Public
|
||||||
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
* License, v. 2.0. If a copy of the MPL was not distributed with this file,
|
||||||
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
* You can obtain one at http://mozilla.org/MPL/2.0/. */
|
||||||
|
|
||||||
"use strict";
|
let Ci = Components.interfaces, Cc = Components.classes, Cu = Components.utils;
|
||||||
|
|
||||||
window.addEventListener("DOMContentLoaded", function () {
|
Cu.import("resource://gre/modules/Messaging.jsm");
|
||||||
document.dispatchEvent(new CustomEvent("AboutReaderContentLoaded", { bubbles: true }));
|
Cu.import("resource://gre/modules/Services.jsm")
|
||||||
});
|
Cu.import("resource://gre/modules/XPCOMUtils.jsm");
|
||||||
|
|
||||||
|
XPCOMUtils.defineLazyModuleGetter(this, "UITelemetry",
|
||||||
|
"resource://gre/modules/UITelemetry.jsm");
|
||||||
|
|
||||||
|
XPCOMUtils.defineLazyGetter(window, "gChromeWin", function ()
|
||||||
|
window.QueryInterface(Ci.nsIInterfaceRequestor)
|
||||||
|
.getInterface(Ci.nsIWebNavigation)
|
||||||
|
.QueryInterface(Ci.nsIDocShellTreeItem)
|
||||||
|
.rootTreeItem
|
||||||
|
.QueryInterface(Ci.nsIInterfaceRequestor)
|
||||||
|
.getInterface(Ci.nsIDOMWindow)
|
||||||
|
.QueryInterface(Ci.nsIDOMChromeWindow));
|
||||||
|
|
||||||
|
function dump(s) {
|
||||||
|
Services.console.logStringMessage("AboutReader: " + s);
|
||||||
|
}
|
||||||
|
|
||||||
|
let gStrings = Services.strings.createBundle("chrome://global/locale/aboutReader.properties");
|
||||||
|
|
||||||
|
let AboutReader = function(doc, win) {
|
||||||
|
dump("Init()");
|
||||||
|
|
||||||
|
this._docRef = Cu.getWeakReference(doc);
|
||||||
|
this._winRef = Cu.getWeakReference(win);
|
||||||
|
|
||||||
|
Services.obs.addObserver(this, "Reader:FaviconReturn", false);
|
||||||
|
Services.obs.addObserver(this, "Reader:Added", false);
|
||||||
|
Services.obs.addObserver(this, "Reader:Removed", false);
|
||||||
|
Services.obs.addObserver(this, "Gesture:DoubleTap", false);
|
||||||
|
|
||||||
|
this._article = null;
|
||||||
|
|
||||||
|
dump("Feching toolbar, header and content notes from about:reader");
|
||||||
|
this._headerElementRef = Cu.getWeakReference(doc.getElementById("reader-header"));
|
||||||
|
this._domainElementRef = Cu.getWeakReference(doc.getElementById("reader-domain"));
|
||||||
|
this._titleElementRef = Cu.getWeakReference(doc.getElementById("reader-title"));
|
||||||
|
this._creditsElementRef = Cu.getWeakReference(doc.getElementById("reader-credits"));
|
||||||
|
this._contentElementRef = Cu.getWeakReference(doc.getElementById("reader-content"));
|
||||||
|
this._toolbarElementRef = Cu.getWeakReference(doc.getElementById("reader-toolbar"));
|
||||||
|
this._messageElementRef = Cu.getWeakReference(doc.getElementById("reader-message"));
|
||||||
|
|
||||||
|
this._toolbarEnabled = false;
|
||||||
|
|
||||||
|
this._scrollOffset = win.pageYOffset;
|
||||||
|
|
||||||
|
let body = doc.body;
|
||||||
|
body.addEventListener("touchstart", this, false);
|
||||||
|
body.addEventListener("click", this, false);
|
||||||
|
|
||||||
|
win.addEventListener("unload", this, false);
|
||||||
|
win.addEventListener("scroll", this, false);
|
||||||
|
win.addEventListener("popstate", this, false);
|
||||||
|
win.addEventListener("resize", this, false);
|
||||||
|
|
||||||
|
doc.addEventListener("visibilitychange", this, false);
|
||||||
|
|
||||||
|
this._setupAllDropdowns();
|
||||||
|
this._setupButton("toggle-button", this._onReaderToggle.bind(this));
|
||||||
|
this._setupButton("share-button", this._onShare.bind(this));
|
||||||
|
|
||||||
|
let colorSchemeOptions = [
|
||||||
|
{ name: gStrings.GetStringFromName("aboutReader.colorSchemeDark"),
|
||||||
|
value: "dark"},
|
||||||
|
{ name: gStrings.GetStringFromName("aboutReader.colorSchemeLight"),
|
||||||
|
value: "light"},
|
||||||
|
{ name: gStrings.GetStringFromName("aboutReader.colorSchemeAuto"),
|
||||||
|
value: "auto"}
|
||||||
|
];
|
||||||
|
|
||||||
|
let colorScheme = Services.prefs.getCharPref("reader.color_scheme");
|
||||||
|
this._setupSegmentedButton("color-scheme-buttons", colorSchemeOptions, colorScheme, this._setColorSchemePref.bind(this));
|
||||||
|
this._setColorSchemePref(colorScheme);
|
||||||
|
|
||||||
|
let fontTypeSample = gStrings.GetStringFromName("aboutReader.fontTypeSample");
|
||||||
|
let fontTypeOptions = [
|
||||||
|
{ name: fontTypeSample,
|
||||||
|
description: gStrings.GetStringFromName("aboutReader.fontTypeSerif"),
|
||||||
|
value: "serif",
|
||||||
|
linkClass: "serif" },
|
||||||
|
{ name: fontTypeSample,
|
||||||
|
description: gStrings.GetStringFromName("aboutReader.fontTypeSansSerif"),
|
||||||
|
value: "sans-serif",
|
||||||
|
linkClass: "sans-serif"
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
let fontType = Services.prefs.getCharPref("reader.font_type");
|
||||||
|
this._setupSegmentedButton("font-type-buttons", fontTypeOptions, fontType, this._setFontType.bind(this));
|
||||||
|
this._setFontType(fontType);
|
||||||
|
|
||||||
|
let fontSizeSample = gStrings.GetStringFromName("aboutReader.fontSizeSample");
|
||||||
|
let fontSizeOptions = [
|
||||||
|
{ name: fontSizeSample,
|
||||||
|
value: 1,
|
||||||
|
linkClass: "font-size1-sample" },
|
||||||
|
{ name: fontSizeSample,
|
||||||
|
value: 2,
|
||||||
|
linkClass: "font-size2-sample" },
|
||||||
|
{ name: fontSizeSample,
|
||||||
|
value: 3,
|
||||||
|
linkClass: "font-size3-sample" },
|
||||||
|
{ name: fontSizeSample,
|
||||||
|
value: 4,
|
||||||
|
linkClass: "font-size4-sample" },
|
||||||
|
{ name: fontSizeSample,
|
||||||
|
value: 5,
|
||||||
|
linkClass: "font-size5-sample" }
|
||||||
|
];
|
||||||
|
|
||||||
|
let fontSize = Services.prefs.getIntPref("reader.font_size");
|
||||||
|
this._setupSegmentedButton("font-size-buttons", fontSizeOptions, fontSize, this._setFontSize.bind(this));
|
||||||
|
this._setFontSize(fontSize);
|
||||||
|
|
||||||
|
dump("Decoding query arguments");
|
||||||
|
let queryArgs = this._decodeQueryString(win.location.href);
|
||||||
|
|
||||||
|
// Track status of reader toolbar add/remove toggle button
|
||||||
|
this._isReadingListItem = -1;
|
||||||
|
this._updateToggleButton();
|
||||||
|
|
||||||
|
let url = queryArgs.url;
|
||||||
|
let tabId = queryArgs.tabId;
|
||||||
|
this._loadArticle(url, tabId);
|
||||||
|
}
|
||||||
|
|
||||||
|
AboutReader.prototype = {
|
||||||
|
_BLOCK_IMAGES_SELECTOR: ".content p > img:only-child, " +
|
||||||
|
".content p > a:only-child > img:only-child, " +
|
||||||
|
".content .wp-caption img, " +
|
||||||
|
".content figure img",
|
||||||
|
|
||||||
|
get _doc() {
|
||||||
|
return this._docRef.get();
|
||||||
|
},
|
||||||
|
|
||||||
|
get _win() {
|
||||||
|
return this._winRef.get();
|
||||||
|
},
|
||||||
|
|
||||||
|
get _headerElement() {
|
||||||
|
return this._headerElementRef.get();
|
||||||
|
},
|
||||||
|
|
||||||
|
get _domainElement() {
|
||||||
|
return this._domainElementRef.get();
|
||||||
|
},
|
||||||
|
|
||||||
|
get _titleElement() {
|
||||||
|
return this._titleElementRef.get();
|
||||||
|
},
|
||||||
|
|
||||||
|
get _creditsElement() {
|
||||||
|
return this._creditsElementRef.get();
|
||||||
|
},
|
||||||
|
|
||||||
|
get _contentElement() {
|
||||||
|
return this._contentElementRef.get();
|
||||||
|
},
|
||||||
|
|
||||||
|
get _toolbarElement() {
|
||||||
|
return this._toolbarElementRef.get();
|
||||||
|
},
|
||||||
|
|
||||||
|
get _messageElement() {
|
||||||
|
return this._messageElementRef.get();
|
||||||
|
},
|
||||||
|
|
||||||
|
observe: function Reader_observe(aMessage, aTopic, aData) {
|
||||||
|
switch(aTopic) {
|
||||||
|
case "Reader:FaviconReturn": {
|
||||||
|
let args = JSON.parse(aData);
|
||||||
|
this._loadFavicon(args.url, args.faviconUrl);
|
||||||
|
Services.obs.removeObserver(this, "Reader:FaviconReturn");
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
|
||||||
|
case "Reader:Added": {
|
||||||
|
// Page can be added by long-press pageAction, or by tap on banner icon.
|
||||||
|
if (aData == this._article.url) {
|
||||||
|
if (this._isReadingListItem != 1) {
|
||||||
|
this._isReadingListItem = 1;
|
||||||
|
this._updateToggleButton();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
|
||||||
|
case "Reader:Removed": {
|
||||||
|
if (aData == this._article.url) {
|
||||||
|
if (this._isReadingListItem != 0) {
|
||||||
|
this._isReadingListItem = 0;
|
||||||
|
this._updateToggleButton();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
|
||||||
|
case "Gesture:DoubleTap": {
|
||||||
|
let args = JSON.parse(aData);
|
||||||
|
let scrollBy;
|
||||||
|
// Arbitary choice of innerHeight - 50 to give some context after scroll
|
||||||
|
if (args.y < (this._win.innerHeight / 2)) {
|
||||||
|
scrollBy = -this._win.innerHeight + 50;
|
||||||
|
} else {
|
||||||
|
scrollBy = this._win.innerHeight - 50;
|
||||||
|
}
|
||||||
|
this._scrollPage(scrollBy);
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
handleEvent: function Reader_handleEvent(aEvent) {
|
||||||
|
if (!aEvent.isTrusted)
|
||||||
|
return;
|
||||||
|
|
||||||
|
switch (aEvent.type) {
|
||||||
|
case "touchstart":
|
||||||
|
this._scrolled = false;
|
||||||
|
break;
|
||||||
|
case "click":
|
||||||
|
if (!this._scrolled)
|
||||||
|
this._toggleToolbarVisibility();
|
||||||
|
break;
|
||||||
|
case "scroll":
|
||||||
|
if (!this._scrolled) {
|
||||||
|
let isScrollingUp = this._scrollOffset > aEvent.pageY;
|
||||||
|
this._setToolbarVisibility(isScrollingUp);
|
||||||
|
this._scrollOffset = aEvent.pageY;
|
||||||
|
}
|
||||||
|
break;
|
||||||
|
case "popstate":
|
||||||
|
if (!aEvent.state)
|
||||||
|
this._closeAllDropdowns();
|
||||||
|
break;
|
||||||
|
case "resize":
|
||||||
|
this._updateImageMargins();
|
||||||
|
break;
|
||||||
|
|
||||||
|
case "devicelight":
|
||||||
|
this._handleDeviceLight(aEvent.value);
|
||||||
|
break;
|
||||||
|
|
||||||
|
case "visibilitychange":
|
||||||
|
this._handleVisibilityChange();
|
||||||
|
break;
|
||||||
|
|
||||||
|
case "unload":
|
||||||
|
Services.obs.removeObserver(this, "Reader:Added");
|
||||||
|
Services.obs.removeObserver(this, "Reader:Removed");
|
||||||
|
Services.obs.removeObserver(this, "Gesture:DoubleTap");
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
_scrollPage: function Reader_scrollPage(scrollByPixels) {
|
||||||
|
let viewport = BrowserApp.selectedTab.getViewport();
|
||||||
|
let newY = Math.min(Math.max(viewport.cssY + scrollByPixels, viewport.cssPageTop), viewport.cssPageBottom);
|
||||||
|
let newRect = new Rect(viewport.cssX, newY, viewport.cssWidth, viewport.cssHeight);
|
||||||
|
|
||||||
|
this._setToolbarVisibility(false);
|
||||||
|
this._setBrowserToolbarVisiblity(false);
|
||||||
|
this._scrolled = true;
|
||||||
|
ZoomHelper.zoomToRect(newRect, -1);
|
||||||
|
},
|
||||||
|
|
||||||
|
_updateToggleButton: function Reader_updateToggleButton() {
|
||||||
|
let classes = this._doc.getElementById("toggle-button").classList;
|
||||||
|
|
||||||
|
if (this._isReadingListItem == 1) {
|
||||||
|
classes.add("on");
|
||||||
|
} else {
|
||||||
|
classes.remove("on");
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
_requestReadingListStatus: function Reader_requestReadingListStatus() {
|
||||||
|
Messaging.sendRequestForResult({
|
||||||
|
type: "Reader:ListStatusRequest",
|
||||||
|
url: this._article.url
|
||||||
|
}).then((data) => {
|
||||||
|
let args = JSON.parse(data);
|
||||||
|
if (args.url == this._article.url) {
|
||||||
|
if (this._isReadingListItem != args.inReadingList) {
|
||||||
|
let isInitialStateChange = (this._isReadingListItem == -1);
|
||||||
|
this._isReadingListItem = args.inReadingList;
|
||||||
|
this._updateToggleButton();
|
||||||
|
|
||||||
|
// Display the toolbar when all its initial component states are known
|
||||||
|
if (isInitialStateChange) {
|
||||||
|
this._setToolbarVisibility(true);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
_onReaderToggle: function Reader_onToggle() {
|
||||||
|
if (!this._article)
|
||||||
|
return;
|
||||||
|
|
||||||
|
if (this._isReadingListItem == 0) {
|
||||||
|
// If we're in reader mode, we must have fetched the article.
|
||||||
|
this._article.status = gChromeWin.Reader.STATUS_FETCHED_ARTICLE;
|
||||||
|
gChromeWin.Reader.addArticleToReadingList(this._article);
|
||||||
|
|
||||||
|
UITelemetry.addEvent("save.1", "button", null, "reader");
|
||||||
|
} else {
|
||||||
|
Messaging.sendRequest({
|
||||||
|
type: "Reader:RemoveFromList",
|
||||||
|
url: this._article.url
|
||||||
|
});
|
||||||
|
|
||||||
|
UITelemetry.addEvent("unsave.1", "button", null, "reader");
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
_onShare: function Reader_onShare() {
|
||||||
|
if (!this._article)
|
||||||
|
return;
|
||||||
|
|
||||||
|
Messaging.sendRequest({
|
||||||
|
type: "Reader:Share",
|
||||||
|
url: this._article.url,
|
||||||
|
title: this._article.title
|
||||||
|
});
|
||||||
|
|
||||||
|
UITelemetry.addEvent("share.1", "list", null);
|
||||||
|
},
|
||||||
|
|
||||||
|
_setFontSize: function Reader_setFontSize(newFontSize) {
|
||||||
|
let bodyClasses = this._doc.body.classList;
|
||||||
|
|
||||||
|
if (this._fontSize > 0)
|
||||||
|
bodyClasses.remove("font-size" + this._fontSize);
|
||||||
|
|
||||||
|
this._fontSize = newFontSize;
|
||||||
|
bodyClasses.add("font-size" + this._fontSize);
|
||||||
|
|
||||||
|
Services.prefs.setIntPref("reader.font_size", this._fontSize);
|
||||||
|
},
|
||||||
|
|
||||||
|
_handleDeviceLight: function Reader_handleDeviceLight(newLux) {
|
||||||
|
// Desired size of the this._luxValues array.
|
||||||
|
let luxValuesSize = 10;
|
||||||
|
// Add new lux value at the front of the array.
|
||||||
|
this._luxValues.unshift(newLux);
|
||||||
|
// Add new lux value to this._totalLux for averaging later.
|
||||||
|
this._totalLux += newLux;
|
||||||
|
|
||||||
|
// Don't update when length of array is less than luxValuesSize except when it is 1.
|
||||||
|
if (this._luxValues.length < luxValuesSize) {
|
||||||
|
// Use the first lux value to set the color scheme until our array equals luxValuesSize.
|
||||||
|
if (this._luxValues.length == 1) {
|
||||||
|
this._updateColorScheme(newLux);
|
||||||
|
}
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
// Holds the average of the lux values collected in this._luxValues.
|
||||||
|
let averageLuxValue = this._totalLux/luxValuesSize;
|
||||||
|
|
||||||
|
this._updateColorScheme(averageLuxValue);
|
||||||
|
// Pop the oldest value off the array.
|
||||||
|
let oldLux = this._luxValues.pop();
|
||||||
|
// Subtract oldLux since it has been discarded from the array.
|
||||||
|
this._totalLux -= oldLux;
|
||||||
|
},
|
||||||
|
|
||||||
|
_handleVisibilityChange: function Reader_handleVisibilityChange() {
|
||||||
|
let colorScheme = Services.prefs.getCharPref("reader.color_scheme");
|
||||||
|
if (colorScheme != "auto") {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Turn off the ambient light sensor if the page is hidden
|
||||||
|
this._enableAmbientLighting(!this._doc.hidden);
|
||||||
|
},
|
||||||
|
|
||||||
|
// Setup or teardown the ambient light tracking system.
|
||||||
|
_enableAmbientLighting: function Reader_enableAmbientLighting(enable) {
|
||||||
|
if (enable) {
|
||||||
|
this._win.addEventListener("devicelight", this, false);
|
||||||
|
this._luxValues = [];
|
||||||
|
this._totalLux = 0;
|
||||||
|
} else {
|
||||||
|
this._win.removeEventListener("devicelight", this, false);
|
||||||
|
delete this._luxValues;
|
||||||
|
delete this._totalLux;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
_updateColorScheme: function Reader_updateColorScheme(luxValue) {
|
||||||
|
// Upper bound value for "dark" color scheme beyond which it changes to "light".
|
||||||
|
let upperBoundDark = 50;
|
||||||
|
// Lower bound value for "light" color scheme beyond which it changes to "dark".
|
||||||
|
let lowerBoundLight = 10;
|
||||||
|
// Threshold for color scheme change.
|
||||||
|
let colorChangeThreshold = 20;
|
||||||
|
|
||||||
|
// Ignore changes that are within a certain threshold of previous lux values.
|
||||||
|
if ((this._colorScheme === "dark" && luxValue < upperBoundDark) ||
|
||||||
|
(this._colorScheme === "light" && luxValue > lowerBoundLight))
|
||||||
|
return;
|
||||||
|
|
||||||
|
if (luxValue < colorChangeThreshold)
|
||||||
|
this._setColorScheme("dark");
|
||||||
|
else
|
||||||
|
this._setColorScheme("light");
|
||||||
|
},
|
||||||
|
|
||||||
|
_setColorScheme: function Reader_setColorScheme(newColorScheme) {
|
||||||
|
// "auto" is not a real color scheme
|
||||||
|
if (this._colorScheme === newColorScheme || newColorScheme === "auto")
|
||||||
|
return;
|
||||||
|
|
||||||
|
let bodyClasses = this._doc.body.classList;
|
||||||
|
|
||||||
|
if (this._colorScheme)
|
||||||
|
bodyClasses.remove(this._colorScheme);
|
||||||
|
|
||||||
|
this._colorScheme = newColorScheme;
|
||||||
|
bodyClasses.add(this._colorScheme);
|
||||||
|
},
|
||||||
|
|
||||||
|
// Pref values include "dark", "light", and "auto", which automatically switches
|
||||||
|
// between light and dark color schemes based on the ambient light level.
|
||||||
|
_setColorSchemePref: function Reader_setColorSchemePref(colorSchemePref) {
|
||||||
|
this._enableAmbientLighting(colorSchemePref === "auto");
|
||||||
|
this._setColorScheme(colorSchemePref);
|
||||||
|
|
||||||
|
Services.prefs.setCharPref("reader.color_scheme", colorSchemePref);
|
||||||
|
},
|
||||||
|
|
||||||
|
_setFontType: function Reader_setFontType(newFontType) {
|
||||||
|
if (this._fontType === newFontType)
|
||||||
|
return;
|
||||||
|
|
||||||
|
let bodyClasses = this._doc.body.classList;
|
||||||
|
|
||||||
|
if (this._fontType)
|
||||||
|
bodyClasses.remove(this._fontType);
|
||||||
|
|
||||||
|
this._fontType = newFontType;
|
||||||
|
bodyClasses.add(this._fontType);
|
||||||
|
|
||||||
|
Services.prefs.setCharPref("reader.font_type", this._fontType);
|
||||||
|
},
|
||||||
|
|
||||||
|
_getToolbarVisibility: function Reader_getToolbarVisibility() {
|
||||||
|
return !this._toolbarElement.classList.contains("toolbar-hidden");
|
||||||
|
},
|
||||||
|
|
||||||
|
_setToolbarVisibility: function Reader_setToolbarVisibility(visible) {
|
||||||
|
let win = this._win;
|
||||||
|
if (win.history.state)
|
||||||
|
win.history.back();
|
||||||
|
|
||||||
|
if (!this._toolbarEnabled)
|
||||||
|
return;
|
||||||
|
|
||||||
|
// Don't allow visible toolbar until banner state is known
|
||||||
|
if (this._isReadingListItem == -1)
|
||||||
|
return;
|
||||||
|
|
||||||
|
if (this._getToolbarVisibility() === visible)
|
||||||
|
return;
|
||||||
|
|
||||||
|
this._toolbarElement.classList.toggle("toolbar-hidden");
|
||||||
|
this._setSystemUIVisibility(visible);
|
||||||
|
|
||||||
|
if (!visible && !this._hasUsedToolbar) {
|
||||||
|
this._hasUsedToolbar = Services.prefs.getBoolPref("reader.has_used_toolbar");
|
||||||
|
if (!this._hasUsedToolbar) {
|
||||||
|
gChromeWin.NativeWindow.toast.show(gStrings.GetStringFromName("aboutReader.toolbarTip"), "short");
|
||||||
|
|
||||||
|
Services.prefs.setBoolPref("reader.has_used_toolbar", true);
|
||||||
|
this._hasUsedToolbar = true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
_toggleToolbarVisibility: function Reader_toggleToolbarVisibility() {
|
||||||
|
this._setToolbarVisibility(!this._getToolbarVisibility());
|
||||||
|
},
|
||||||
|
|
||||||
|
_setBrowserToolbarVisiblity: function Reader_setBrowserToolbarVisiblity(visible) {
|
||||||
|
Messaging.sendRequest({
|
||||||
|
type: "BrowserToolbar:Visibility",
|
||||||
|
visible: visible
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
_setSystemUIVisibility: function Reader_setSystemUIVisibility(visible) {
|
||||||
|
Messaging.sendRequest({
|
||||||
|
type: "SystemUI:Visibility",
|
||||||
|
visible: visible
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
_loadArticle: Task.async(function* (url, tabId) {
|
||||||
|
this._showProgressDelayed();
|
||||||
|
|
||||||
|
let article = yield gChromeWin.Reader.getArticle(url, tabId).catch(e => {
|
||||||
|
Cu.reportError("Error loading article: " + e);
|
||||||
|
return null;
|
||||||
|
});
|
||||||
|
if (article) {
|
||||||
|
this._showContent(article);
|
||||||
|
} else {
|
||||||
|
this._win.location.href = url;
|
||||||
|
}
|
||||||
|
}),
|
||||||
|
|
||||||
|
_requestFavicon: function Reader_requestFavicon() {
|
||||||
|
Messaging.sendRequest({
|
||||||
|
type: "Reader:FaviconRequest",
|
||||||
|
url: this._article.url
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
_loadFavicon: function Reader_loadFavicon(url, faviconUrl) {
|
||||||
|
if (this._article.url !== url)
|
||||||
|
return;
|
||||||
|
|
||||||
|
let doc = this._doc;
|
||||||
|
|
||||||
|
let link = doc.createElement('link');
|
||||||
|
link.rel = 'shortcut icon';
|
||||||
|
link.href = faviconUrl;
|
||||||
|
|
||||||
|
doc.getElementsByTagName('head')[0].appendChild(link);
|
||||||
|
},
|
||||||
|
|
||||||
|
_updateImageMargins: function Reader_updateImageMargins() {
|
||||||
|
let windowWidth = this._win.innerWidth;
|
||||||
|
let contentWidth = this._contentElement.offsetWidth;
|
||||||
|
let maxWidthStyle = windowWidth + "px !important";
|
||||||
|
|
||||||
|
let setImageMargins = function(img) {
|
||||||
|
if (!img._originalWidth)
|
||||||
|
img._originalWidth = img.offsetWidth;
|
||||||
|
|
||||||
|
let imgWidth = img._originalWidth;
|
||||||
|
|
||||||
|
// If the image is taking more than half of the screen, just make
|
||||||
|
// it fill edge-to-edge.
|
||||||
|
if (imgWidth < contentWidth && imgWidth > windowWidth * 0.55)
|
||||||
|
imgWidth = windowWidth;
|
||||||
|
|
||||||
|
let sideMargin = Math.max((contentWidth - windowWidth) / 2,
|
||||||
|
(contentWidth - imgWidth) / 2);
|
||||||
|
|
||||||
|
let imageStyle = sideMargin + "px !important";
|
||||||
|
let widthStyle = imgWidth + "px !important";
|
||||||
|
|
||||||
|
let cssText = "max-width: " + maxWidthStyle + ";" +
|
||||||
|
"width: " + widthStyle + ";" +
|
||||||
|
"margin-left: " + imageStyle + ";" +
|
||||||
|
"margin-right: " + imageStyle + ";";
|
||||||
|
|
||||||
|
img.style.cssText = cssText;
|
||||||
|
}
|
||||||
|
|
||||||
|
let imgs = this._doc.querySelectorAll(this._BLOCK_IMAGES_SELECTOR);
|
||||||
|
for (let i = imgs.length; --i >= 0;) {
|
||||||
|
let img = imgs[i];
|
||||||
|
|
||||||
|
if (img.width > 0) {
|
||||||
|
setImageMargins(img);
|
||||||
|
} else {
|
||||||
|
img.onload = function() {
|
||||||
|
setImageMargins(img);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
_maybeSetTextDirection: function Read_maybeSetTextDirection(article){
|
||||||
|
if(!article.dir)
|
||||||
|
return;
|
||||||
|
|
||||||
|
//Set "dir" attribute on content
|
||||||
|
this._contentElement.setAttribute("dir", article.dir);
|
||||||
|
this._headerElement.setAttribute("dir", article.dir);
|
||||||
|
},
|
||||||
|
|
||||||
|
_showError: function Reader_showError(error) {
|
||||||
|
this._headerElement.style.display = "none";
|
||||||
|
this._contentElement.style.display = "none";
|
||||||
|
|
||||||
|
this._messageElement.innerHTML = error;
|
||||||
|
this._messageElement.style.display = "block";
|
||||||
|
|
||||||
|
this._doc.title = error;
|
||||||
|
},
|
||||||
|
|
||||||
|
// This function is the JS version of Java's StringUtils.stripCommonSubdomains.
|
||||||
|
_stripHost: function Reader_stripHost(host) {
|
||||||
|
if (!host)
|
||||||
|
return host;
|
||||||
|
|
||||||
|
let start = 0;
|
||||||
|
|
||||||
|
if (host.startsWith("www."))
|
||||||
|
start = 4;
|
||||||
|
else if (host.startsWith("m."))
|
||||||
|
start = 2;
|
||||||
|
else if (host.startsWith("mobile."))
|
||||||
|
start = 7;
|
||||||
|
|
||||||
|
return host.substring(start);
|
||||||
|
},
|
||||||
|
|
||||||
|
_showContent: function Reader_showContent(article) {
|
||||||
|
this._messageElement.style.display = "none";
|
||||||
|
|
||||||
|
this._article = article;
|
||||||
|
|
||||||
|
this._domainElement.href = article.url;
|
||||||
|
let articleUri = Services.io.newURI(article.url, null, null);
|
||||||
|
this._domainElement.innerHTML = this._stripHost(articleUri.host);
|
||||||
|
|
||||||
|
this._creditsElement.innerHTML = article.byline;
|
||||||
|
|
||||||
|
this._titleElement.textContent = article.title;
|
||||||
|
this._doc.title = article.title;
|
||||||
|
|
||||||
|
this._headerElement.style.display = "block";
|
||||||
|
|
||||||
|
let parserUtils = Cc["@mozilla.org/parserutils;1"].getService(Ci.nsIParserUtils);
|
||||||
|
let contentFragment = parserUtils.parseFragment(article.content, Ci.nsIParserUtils.SanitizerDropForms,
|
||||||
|
false, articleUri, this._contentElement);
|
||||||
|
this._contentElement.innerHTML = "";
|
||||||
|
this._contentElement.appendChild(contentFragment);
|
||||||
|
this._updateImageMargins();
|
||||||
|
this._maybeSetTextDirection(article);
|
||||||
|
|
||||||
|
this._contentElement.style.display = "block";
|
||||||
|
this._requestReadingListStatus();
|
||||||
|
|
||||||
|
this._toolbarEnabled = true;
|
||||||
|
this._setToolbarVisibility(true);
|
||||||
|
|
||||||
|
this._requestFavicon();
|
||||||
|
},
|
||||||
|
|
||||||
|
_hideContent: function Reader_hideContent() {
|
||||||
|
this._headerElement.style.display = "none";
|
||||||
|
this._contentElement.style.display = "none";
|
||||||
|
},
|
||||||
|
|
||||||
|
_showProgressDelayed: function Reader_showProgressDelayed() {
|
||||||
|
this._win.setTimeout(function() {
|
||||||
|
// Article has already been loaded, no need to show
|
||||||
|
// progress anymore.
|
||||||
|
if (this._article)
|
||||||
|
return;
|
||||||
|
|
||||||
|
this._headerElement.style.display = "none";
|
||||||
|
this._contentElement.style.display = "none";
|
||||||
|
|
||||||
|
this._messageElement.innerHTML = gStrings.GetStringFromName("aboutReader.loading");
|
||||||
|
this._messageElement.style.display = "block";
|
||||||
|
}.bind(this), 300);
|
||||||
|
},
|
||||||
|
|
||||||
|
_decodeQueryString: function Reader_decodeQueryString(url) {
|
||||||
|
let result = {};
|
||||||
|
let query = url.split("?")[1];
|
||||||
|
if (query) {
|
||||||
|
let pairs = query.split("&");
|
||||||
|
for (let i = 0; i < pairs.length; i++) {
|
||||||
|
let [name, value] = pairs[i].split("=");
|
||||||
|
result[name] = decodeURIComponent(value);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return result;
|
||||||
|
},
|
||||||
|
|
||||||
|
_setupSegmentedButton: function Reader_setupSegmentedButton(id, options, initialValue, callback) {
|
||||||
|
let doc = this._doc;
|
||||||
|
let segmentedButton = doc.getElementById(id);
|
||||||
|
|
||||||
|
for (let i = 0; i < options.length; i++) {
|
||||||
|
let option = options[i];
|
||||||
|
|
||||||
|
let item = doc.createElement("li");
|
||||||
|
let link = doc.createElement("a");
|
||||||
|
link.textContent = option.name;
|
||||||
|
item.appendChild(link);
|
||||||
|
|
||||||
|
if (option.linkClass !== undefined)
|
||||||
|
link.classList.add(option.linkClass);
|
||||||
|
|
||||||
|
if (option.description !== undefined) {
|
||||||
|
let description = doc.createElement("div");
|
||||||
|
description.textContent = option.description;
|
||||||
|
item.appendChild(description);
|
||||||
|
}
|
||||||
|
|
||||||
|
link.style.MozUserSelect = 'none';
|
||||||
|
segmentedButton.appendChild(item);
|
||||||
|
|
||||||
|
link.addEventListener("click", function(aEvent) {
|
||||||
|
if (!aEvent.isTrusted)
|
||||||
|
return;
|
||||||
|
|
||||||
|
aEvent.stopPropagation();
|
||||||
|
|
||||||
|
// Just pass the ID of the button as an extra and hope the ID doesn't change
|
||||||
|
// unless the context changes
|
||||||
|
UITelemetry.addEvent("action.1", "button", null, id);
|
||||||
|
|
||||||
|
let items = segmentedButton.children;
|
||||||
|
for (let j = items.length - 1; j >= 0; j--) {
|
||||||
|
items[j].classList.remove("selected");
|
||||||
|
}
|
||||||
|
|
||||||
|
item.classList.add("selected");
|
||||||
|
callback(option.value);
|
||||||
|
}.bind(this), true);
|
||||||
|
|
||||||
|
if (option.value === initialValue)
|
||||||
|
item.classList.add("selected");
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
_setupButton: function Reader_setupButton(id, callback) {
|
||||||
|
let button = this._doc.getElementById(id);
|
||||||
|
|
||||||
|
button.addEventListener("click", function(aEvent) {
|
||||||
|
if (!aEvent.isTrusted)
|
||||||
|
return;
|
||||||
|
|
||||||
|
aEvent.stopPropagation();
|
||||||
|
callback();
|
||||||
|
}, true);
|
||||||
|
},
|
||||||
|
|
||||||
|
_setupAllDropdowns: function Reader_setupAllDropdowns() {
|
||||||
|
let doc = this._doc;
|
||||||
|
let win = this._win;
|
||||||
|
|
||||||
|
let dropdowns = doc.getElementsByClassName("dropdown");
|
||||||
|
|
||||||
|
for (let i = dropdowns.length - 1; i >= 0; i--) {
|
||||||
|
let dropdown = dropdowns[i];
|
||||||
|
|
||||||
|
let dropdownToggle = dropdown.getElementsByClassName("dropdown-toggle")[0];
|
||||||
|
let dropdownPopup = dropdown.getElementsByClassName("dropdown-popup")[0];
|
||||||
|
|
||||||
|
if (!dropdownToggle || !dropdownPopup)
|
||||||
|
continue;
|
||||||
|
|
||||||
|
let dropdownArrow = doc.createElement("div");
|
||||||
|
dropdownArrow.className = "dropdown-arrow";
|
||||||
|
dropdownPopup.appendChild(dropdownArrow);
|
||||||
|
|
||||||
|
let updatePopupPosition = function() {
|
||||||
|
let popupWidth = dropdownPopup.offsetWidth + 30;
|
||||||
|
let arrowWidth = dropdownArrow.offsetWidth;
|
||||||
|
let toggleWidth = dropdownToggle.offsetWidth;
|
||||||
|
let toggleLeft = dropdownToggle.offsetLeft;
|
||||||
|
|
||||||
|
let popupShift = (toggleWidth - popupWidth) / 2;
|
||||||
|
let popupLeft = Math.max(0, Math.min(win.innerWidth - popupWidth, toggleLeft + popupShift));
|
||||||
|
dropdownPopup.style.left = popupLeft + "px";
|
||||||
|
|
||||||
|
let arrowShift = (toggleWidth - arrowWidth) / 2;
|
||||||
|
let arrowLeft = toggleLeft - popupLeft + arrowShift;
|
||||||
|
dropdownArrow.style.left = arrowLeft + "px";
|
||||||
|
};
|
||||||
|
|
||||||
|
win.addEventListener("resize", function(aEvent) {
|
||||||
|
if (!aEvent.isTrusted)
|
||||||
|
return;
|
||||||
|
|
||||||
|
// Wait for reflow before calculating the new position of the popup.
|
||||||
|
setTimeout(updatePopupPosition, 0);
|
||||||
|
}, true);
|
||||||
|
|
||||||
|
dropdownToggle.addEventListener("click", function(aEvent) {
|
||||||
|
if (!aEvent.isTrusted)
|
||||||
|
return;
|
||||||
|
|
||||||
|
aEvent.stopPropagation();
|
||||||
|
|
||||||
|
if (!this._getToolbarVisibility())
|
||||||
|
return;
|
||||||
|
|
||||||
|
let dropdownClasses = dropdown.classList;
|
||||||
|
|
||||||
|
if (dropdownClasses.contains("open")) {
|
||||||
|
win.history.back();
|
||||||
|
} else {
|
||||||
|
updatePopupPosition();
|
||||||
|
if (!this._closeAllDropdowns())
|
||||||
|
this._pushDropdownState();
|
||||||
|
|
||||||
|
dropdownClasses.add("open");
|
||||||
|
}
|
||||||
|
}.bind(this), true);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
_pushDropdownState: function Reader_pushDropdownState() {
|
||||||
|
// FIXME: We're getting a NS_ERROR_UNEXPECTED error when we try
|
||||||
|
// to do win.history.pushState() here (see bug 682296). This is
|
||||||
|
// a workaround that allows us to push history state on the target
|
||||||
|
// content document.
|
||||||
|
|
||||||
|
let doc = this._doc;
|
||||||
|
let body = doc.body;
|
||||||
|
|
||||||
|
if (this._pushStateScript)
|
||||||
|
body.removeChild(this._pushStateScript);
|
||||||
|
|
||||||
|
this._pushStateScript = doc.createElement('script');
|
||||||
|
this._pushStateScript.type = "text/javascript";
|
||||||
|
this._pushStateScript.innerHTML = 'history.pushState({ dropdown: 1 }, document.title);';
|
||||||
|
|
||||||
|
body.appendChild(this._pushStateScript);
|
||||||
|
},
|
||||||
|
|
||||||
|
_closeAllDropdowns : function Reader_closeAllDropdowns() {
|
||||||
|
let dropdowns = this._doc.querySelectorAll(".dropdown.open");
|
||||||
|
for (let i = dropdowns.length - 1; i >= 0; i--) {
|
||||||
|
dropdowns[i].classList.remove("open");
|
||||||
|
}
|
||||||
|
|
||||||
|
return (dropdowns.length > 0)
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|||||||
@ -7,6 +7,5 @@
|
|||||||
JAR_MANIFESTS += ['jar.mn']
|
JAR_MANIFESTS += ['jar.mn']
|
||||||
|
|
||||||
EXTRA_JS_MODULES += [
|
EXTRA_JS_MODULES += [
|
||||||
'AboutReader.jsm',
|
|
||||||
'ReaderMode.jsm'
|
'ReaderMode.jsm'
|
||||||
]
|
]
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user