From 2c1e7a96469698aa9b9cc21bd6c2bde2ac8ffefd Mon Sep 17 00:00:00 2001 From: Ian Bicking Date: Mon, 20 Mar 2017 14:28:00 -0500 Subject: [PATCH 01/40] Change code that reads className to classList This avoids some fragility if there are overlapping classnames, which will become more likely if we remove pageshot-* prefixes from classes --- addon/webextension/selector/ui.js | 11 ++++++----- addon/webextension/selector/uicontrol.js | 7 +++---- 2 files changed, 9 insertions(+), 9 deletions(-) diff --git a/addon/webextension/selector/ui.js b/addon/webextension/selector/ui.js index 6558fc5ec4..0b7e35e945 100644 --- a/addon/webextension/selector/ui.js +++ b/addon/webextension/selector/ui.js @@ -31,11 +31,11 @@ window.ui = (function () { // eslint-disable-line no-unused-vars exports.isHeader = function (el) { while (el) { - if (el.className && - (el.className.indexOf("pageshot-saver") !== -1 || - el.className.indexOf("pageshot-myshots") !== -1 || - el.className.indexOf("pageshot-visible") !== -1 || - el.className.indexOf("pageshot-full-page") !== -1)) { + if (el.classList && + (el.classList.contains("pageshot-saver") || + el.classList.contains("pageshot-myshots") || + el.classList.contains("pageshot-visible") || + el.classList.contains("pageshot-full-page"))) { return true; } el = el.parentNode; @@ -221,6 +221,7 @@ window.ui = (function () { // eslint-disable-line no-unused-vars
+ `; this.el.querySelector(".pageshot-preview-instructions").textContent = browser.i18n.getMessage("screenshotInstructions"); this.el.querySelector(".pageshot-myshots-text").textContent = browser.i18n.getMessage("myShotsLink"); diff --git a/addon/webextension/selector/uicontrol.js b/addon/webextension/selector/uicontrol.js index 08f40a587b..78109c0bc8 100644 --- a/addon/webextension/selector/uicontrol.js +++ b/addon/webextension/selector/uicontrol.js @@ -360,16 +360,15 @@ window.uicontrol = (function () { mousemove: function (event) { ui.PixelDimensions.display(event.pageX, event.pageY, event.pageX, event.pageY); - if (event.target.className && - event.target.className !== "pageshot-preview-overlay" && - event.target.className.startsWith("pageshot-")) { + if (event.target.classList && + (! event.target.classList.contains("pageshot-preview-overlay"))) { // User is hovering over a Page Shot button or control autoDetectRect = null; ui.HoverBox.hide(); return; } let el; - if (event.target.className === "pageshot-preview-overlay") { + if (event.target.classList.contains("pageshot-preview-overlay")) { // The hover is on the overlay, so we need to figure out the real element el = ui.iframe.getElementFromPoint( event.pageX - window.pageXOffset, From 0a5e773a55d2cbf147a52f97c8fa74f7b0d34d17 Mon Sep 17 00:00:00 2001 From: Ian Bicking Date: Mon, 20 Mar 2017 14:40:50 -0500 Subject: [PATCH 02/40] Remove pageshot-saver from isHeader check The save button isn't displayed on the selection screen where this function is applied Also remove pageshot-saver CSS rule, because it now has the class pageshot-highlight-button-save --- addon/webextension/selector/ui.js | 3 +-- static/css/inline-selection.scss | 43 ------------------------------- 2 files changed, 1 insertion(+), 45 deletions(-) diff --git a/addon/webextension/selector/ui.js b/addon/webextension/selector/ui.js index 0b7e35e945..e99199a368 100644 --- a/addon/webextension/selector/ui.js +++ b/addon/webextension/selector/ui.js @@ -32,8 +32,7 @@ window.ui = (function () { // eslint-disable-line no-unused-vars exports.isHeader = function (el) { while (el) { if (el.classList && - (el.classList.contains("pageshot-saver") || - el.classList.contains("pageshot-myshots") || + (el.classList.contains("pageshot-myshots") || el.classList.contains("pageshot-visible") || el.classList.contains("pageshot-full-page"))) { return true; diff --git a/static/css/inline-selection.scss b/static/css/inline-selection.scss index 1cfbbfe72e..7ae74ccbaa 100644 --- a/static/css/inline-selection.scss +++ b/static/css/inline-selection.scss @@ -620,46 +620,3 @@ $overlay-z-index: 9999999999; pointer-events: none; z-index: $overlay-z-index+1; } - -.pageshot-saver { - position: fixed; - z-index: $overlay-z-index + 100; - background-color: #fcfcfc; - color: #333; - font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen-Sans", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif; - top: 0; - left: 0; - height: 40px; - width: 100%; - box-shadow: 0 -1px 1px rgba(#000, 0.4) inset; - - a, - a:visited, - a:link, - a:hover { - color: #000; - text-decoration: none; - } - - .pageshot-save-help { - display: inline-block; - padding-top: 9px; - padding-left: 10px; - font-size: 13px; - } - - .pageshot-save { - border-radius: 4px; - background: #0996f8; - color: #fff; - box-shadow: 0 0 10px #ff0; - border: 1px solid #0675d3; - } - - .pageshot-cancel { - border-radius: 4px; - color: #858585; - background-color: #fcfcfc; - border: 1px solid #d4d4d4; - } -} From 586da245eb1922e8a5503ab93e0697c6b7b656ae Mon Sep 17 00:00:00 2001 From: Ian Bicking Date: Mon, 20 Mar 2017 14:52:41 -0500 Subject: [PATCH 03/40] Remove references to myshots-reminder, which was removed --- static/css/inline-selection.scss | 54 -------------------------------- 1 file changed, 54 deletions(-) diff --git a/static/css/inline-selection.scss b/static/css/inline-selection.scss index 7ae74ccbaa..d2cf105bb7 100644 --- a/static/css/inline-selection.scss +++ b/static/css/inline-selection.scss @@ -543,65 +543,11 @@ $overlay-z-index: 9999999999; left: 60%; } -.pageshot-myshots-reminder { - display: flex; - position: fixed; - z-index: $overlay-z-index + 20; - top: -17px; - left: 10px; - - &.pageshot-myshots-reminder-chrome { - top: 44px; - } -} - .pageshot-panel * { box-sizing: border-box; text-align: start; } -.pageshot-myshots-reminder > .pageshot-panel { - background-clip: padding-box; - background-color: #fcfcfc; - border: 1px solid rgba(#181a1b, 0.2); - box-shadow: 0 3px 5px rgba(#181a1b, 0.1), 0 0 7px rgba(#181a1b, 0.1); - box-sizing: content-box; - color: #222426; - cursor: default; - display: flex; - flex-direction: column; - font: caption; - margin: 2em auto 0.5em; - padding: 0; - position: relative; - -moz-user-select: none; -} - -.pageshot-myshots-reminder > .pageshot-panel > .pageshot-panel-arrowUp { - // From http://firefoxux.github.io/StyleGuide/static/77bfee72eee9836269c3062731a60ad7.png - background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAOCAYAAAA1+Nx+AAABUklEQVR42p2STU6DQBSAn9ZSBFv8oVEwYdrUqtu2XsAT2Fbv0AU7woZFN5B0xYID9JhupCn1vWQ0L0AZ4+JbzAx83yMD3N65jRhidtKE6v2/iE8ZLYLvqUJKuRSeSdoMWrdUkSZ5i0k7iF6iUxeqBLbbLaxWK0iSpE6uSZnRd8QQX5ggs77jjWhPnmnlyHq9hizLII5jAN/3IQzDOnkHOTe9Sdd2xYjkeZ5/Hg6H/Xzx/oqRsSkmPQr9fA2PRFEEm80GIE3TY3KDBFxeFMUXQZG3+RIjgiLWsUgQBNAkt2x38EDy3W73Ky9HbEc8yohZFwH2p7Sr8vspn7wh8sQiOo8ALdhlmlxemVwduWQRjdwgFwZyQQ9U5WrkxcvI9ApdXenUQS4sPLhG+bgs/2fkhpzkpkCPqrY79FD+rJArI4vlxwsOOqCBKQK4ydmrReoId34DYcLiW8YxuloAAAAASUVORK5CYII="); - background-position: 12px top; - background-repeat: no-repeat; - height: 14px; - margin-top: -14px; - pointer-events: none; - position: absolute; - width: 100%; -} - -.pageshot-myshots-reminder > .pageshot-panel > .pageshot-panel-section { - display: flex; - flex-direction: row; -} - -.pageshot-myshots-reminder > .pageshot-panel > .pageshot-panel-section-header { - padding: 16px; -} - -.pageshot-myshots-reminder > .pageshot-panel > .pageshot-panel-section-header > .pageshot-text-section-list { - font-size: 13px; -} - @keyframes pageshot-fade-in { 0% { opacity: 0; From 41248a49bc16b6f39e6aff5cd695adf76c7dea72 Mon Sep 17 00:00:00 2001 From: Ian Bicking Date: Mon, 20 Mar 2017 14:53:51 -0500 Subject: [PATCH 04/40] Rename .pageshot-myshots to .myshots-button Also rename .pageshot-myshots-text to .myshots-text, .pageshot-pre|post-myshots to .myshots-text-pre|post --- addon/webextension/selector/ui.js | 14 +++++++------- server/src/pages/homepage/view.js | 8 ++++---- static/css/inline-selection.scss | 20 ++++++++++---------- static/css/styles.scss | 8 ++++---- 4 files changed, 25 insertions(+), 25 deletions(-) diff --git a/addon/webextension/selector/ui.js b/addon/webextension/selector/ui.js index e99199a368..cf4218268a 100644 --- a/addon/webextension/selector/ui.js +++ b/addon/webextension/selector/ui.js @@ -32,7 +32,7 @@ window.ui = (function () { // eslint-disable-line no-unused-vars exports.isHeader = function (el) { while (el) { if (el.classList && - (el.classList.contains("pageshot-myshots") || + (el.classList.contains("myshots-button") || el.classList.contains("pageshot-visible") || el.classList.contains("pageshot-full-page"))) { return true; @@ -213,20 +213,20 @@ window.ui = (function () { // eslint-disable-line no-unused-vars this.el.innerHTML = `
-
-
-
-
+
+
+
+
`; this.el.querySelector(".pageshot-preview-instructions").textContent = browser.i18n.getMessage("screenshotInstructions"); - this.el.querySelector(".pageshot-myshots-text").textContent = browser.i18n.getMessage("myShotsLink"); + this.el.querySelector(".myshots-text").textContent = browser.i18n.getMessage("myShotsLink"); this.el.querySelector(".pageshot-visible").textContent = browser.i18n.getMessage("saveScreenshotVisibleArea"); this.el.querySelector(".pageshot-full-page").textContent = browser.i18n.getMessage("saveScreenshotFullPage"); - this.el.querySelector(".pageshot-myshots").addEventListener( + this.el.querySelector(".myshots-button").addEventListener( "click", watchFunction(callbacks.onOpenMyShots), false); this.el.querySelector(".pageshot-visible").addEventListener( "click", watchFunction(callbacks.onClickVisible), false); diff --git a/server/src/pages/homepage/view.js b/server/src/pages/homepage/view.js index d37e984709..7f8e53379b 100644 --- a/server/src/pages/homepage/view.js +++ b/server/src/pages/homepage/view.js @@ -36,10 +36,10 @@ class Body extends React.Component { render() { let myShots; if (this.props.showMyShots) { - myShots = ; } return ( diff --git a/static/css/inline-selection.scss b/static/css/inline-selection.scss index d2cf105bb7..e18ecf5d70 100644 --- a/static/css/inline-selection.scss +++ b/static/css/inline-selection.scss @@ -370,7 +370,7 @@ $overlay-z-index: 9999999999; z-index: 999999999; } -.pageshot-myshots { +.myshots-button { @extend .button; @extend .secondary; @include flex-container(row, center, center); @@ -383,34 +383,34 @@ $overlay-z-index: 9999999999; } /* styleMyShotsButton test: */ -.styleMyShotsButton-control .pageshot-myshots-button { +.styleMyShotsButton-control .myshots-button { } -.styleMyShotsButton-bright .pageshot-myshots-button { +.styleMyShotsButton-bright .myshots-button { color: #fff; background: $link-blue; } -.styleMyShotsButton-bright .pageshot-pre-myshots, -.styleMyShotsButton-bright .pageshot-post-myshots { +.styleMyShotsButton-bright .myshots-text-pre, +.styleMyShotsButton-bright .myshots-text-post { filter: brightness(20); } /* end styleMyShotsButton test */ .pageshot-visible { - @extend .pageshot-myshots; + @extend .myshots-button; pointer-events: all; top: 60px; } .pageshot-full-page { - @extend .pageshot-myshots; + @extend .myshots-button; pointer-events: all; top: 105px; } -.pageshot-pre-myshots { +.myshots-text-pre { /* Data version of static/img/my-shots.svg */ background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIwLjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCAxNiAxNiIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMTYgMTY7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4KCS5zdDB7ZmlsbDojNEQ0RDREO30KPC9zdHlsZT4KPHBhdGggY2xhc3M9InN0MCIgZD0iTTEyLDEyaDR2MmMwLDEuMS0wLjksMi0yLDJoLTJWMTJMMTIsMTJ6IE0wLDEyaDR2NEgyYy0xLjEsMC0yLTAuOS0yLTJWMTJMMCwxMnogTTEyLDZoNHY0aC00VjZMMTIsNnogTTYsNmg0djQKCUg2VjZMNiw2eiBNMCw2aDR2NEgwVjZMMCw2eiBNMTIsMGgyYzEuMSwwLDIsMC45LDIsMnYyaC00VjBMMTIsMHogTTYsMGg0djRINlYwTDYsMHogTTYsMTJoNHY0SDZWMTJMNiwxMnogTTAsMmMwLTEuMSwwLjktMiwyLTJoMgoJdjRIMFYyTDAsMnoiLz4KPC9zdmc+Cg=="); background-position: left center; @@ -421,7 +421,7 @@ $overlay-z-index: 9999999999; width: 24px; } -.pageshot-post-myshots { +.myshots-text-post { /* Data version of static/img/arrow-right.svg */ background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIwLjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCAxNiAxNiIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMTYgMTY7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4KCS5zdDB7ZmlsbDojMzMzMzMzO30KPC9zdHlsZT4KPHBhdGggY2xhc3M9InN0MCIgZD0iTTUuNywyLjhMNS43LDIuOGMwLjQtMC40LDEuMS0wLjQsMS41LDBMMTIuNCw4bC01LjEsNS4yYy0wLjQsMC40LTEuMSwwLjQtMS41LDBsMCwwYy0wLjQtMC40LTAuNC0xLjEsMC0xLjUKCUw5LjQsOEw1LjcsNC4yQzUuMywzLjgsNS4zLDMuMiw1LjcsMi44eiIvPgo8L3N2Zz4K"); background-position: right center; @@ -433,7 +433,7 @@ $overlay-z-index: 9999999999; width: 20px; } -.pageshot-myshots-text { +.myshots-text { flex: 0; position: relative; top: 1px; diff --git a/static/css/styles.scss b/static/css/styles.scss index 8ad6e58377..e778d7a375 100644 --- a/static/css/styles.scss +++ b/static/css/styles.scss @@ -319,7 +319,7 @@ a.subheading-link { } -.pageshot-myshots { +.myshots-button { display: block; position: absolute; top: 15px; @@ -343,7 +343,7 @@ a.subheading-link { cursor: pointer; } -.pageshot-pre-myshots { +.myshots-text-pre { display: inline-block; /* Data version of static/img/my-shots.svg */ background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KCjwhLS0gVGhpcyBTb3VyY2UgQ29kZSBGb3JtIGlzIHN1YmplY3QgdG8gdGhlIHRlcm1zIG9mIHRoZSBNb3ppbGxhIFB1YmxpYwogICAtIExpY2Vuc2UsIHYuIDIuMC4gSWYgYSBjb3B5IG9mIHRoZSBNUEwgd2FzIG5vdCBkaXN0cmlidXRlZCB3aXRoIHRoaXMKICAgLSBmaWxlLCBZb3UgY2FuIG9idGFpbiBvbmUgYXQgaHR0cDovL21vemlsbGEub3JnL01QTC8yLjAvLiAtLT4KCjxzdmcgdmVyc2lvbj0iMS4xIgogICAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgICB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIKICAgICB3aWR0aD0iMTYiCiAgICAgaGVpZ2h0PSIxNiIKICAgICB2aWV3Qm94PSIwIDAgMTYgMTYiCiAgICAgZmlsbD0iIzRkNGQ0ZCI+CgogIDxwYXRoIGQ9Ik0xMiwxMiBMMTYsMTIgTDE2LDE0IEMxNiwxNS4xMDQ1Njk1IDE1LjExMjI3MDQsMTYgMTQsMTYgTDEyLDE2IEwxMiwxMiBMMTIsMTIgWiBNNiwxMy4wMDkzNjg5IEM2LDEyLjQ1MTkwOTggNi40NDMzNTMxOCwxMiA3LjAwOTM2ODksMTIgTDguOTkwNjMxMSwxMiBDOS41NDgwOTAxNSwxMiAxMCwxMi40NDMzNTMyIDEwLDEzLjAwOTM2ODkgTDEwLDE0Ljk5MDYzMTEgQzEwLDE1LjU0ODA5MDIgOS41NTY2NDY4MiwxNiA4Ljk5MDYzMTEsMTYgTDcuMDA5MzY4OSwxNiBDNi40NTE5MDk4NSwxNiA2LDE1LjU1NjY0NjggNiwxNC45OTA2MzExIEw2LDEzLjAwOTM2ODkgTDYsMTMuMDA5MzY4OSBaIE0wLDEyIEw0LDEyIEw0LDE2IEwyLDE2IEMwLjg5NTQzMDUsMTYgMCwxNS4xMTIyNzA0IDAsMTQgTDAsMTIgTDAsMTIgWiBNMTIsNiBMMTYsNiBMMTYsMTAgTDEyLDEwIEwxMiw2IEwxMiw2IFogTTYsNiBMMTAsNiBMMTAsMTAgTDYsMTAgTDYsNiBMNiw2IFogTTAsNiBMNCw2IEw0LDEwIEwwLDEwIEwwLDYgTDAsNiBaIE0xMiwwIEwxNCwwIEMxNS4xMDQ1Njk1LDAgMTYsMC44ODc3Mjk2NDUgMTYsMiBMMTYsNCBMMTIsNCBMMTIsMCBMMTIsMCBaIE02LDAgTDEwLDAgTDEwLDQgTDYsNCBMNiwwIEw2LDAgWiBNMCwyIEMwLDAuODk1NDMwNSAwLjg4NzcyOTY0NSwwIDIsMCBMNCwwIEw0LDQgTDAsNCBMMCwyIEwwLDIgWiIvPgoKPC9zdmc+Cg=="); @@ -353,12 +353,12 @@ a.subheading-link { vertical-align: middle; } -.pageshot-myshots-text { +.myshots-text { padding: 10px; vertical-align: middle; } -.pageshot-post-myshots { +.myshots-text-post { display: inline-block; /* Data version of static/img/arrow-right.svg */ background-image: url("data:image/svg+xml;base64,PCEtLSBUaGlzIFNvdXJjZSBDb2RlIEZvcm0gaXMgc3ViamVjdCB0byB0aGUgdGVybXMgb2YgdGhlIE1vemlsbGEgUHVibGljCiAgIC0gTGljZW5zZSwgdi4gMi4wLiBJZiBhIGNvcHkgb2YgdGhlIE1QTCB3YXMgbm90IGRpc3RyaWJ1dGVkIHdpdGggdGhpcwogICAtIGZpbGUsIFlvdSBjYW4gb2J0YWluIG9uZSBhdCBodHRwOi8vbW96aWxsYS5vcmcvTVBMLzIuMC8uIC0tPgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjhweCIgaGVpZ2h0PSIxNHB4IiB2aWV3Qm94PSIwIDAgOCAxNCI+CiAgPHBhdGggZmlsbD0iI2IxYjFiMSIgZD0ibTcuOTg2NzksMTMuMDEzMjFsLTAuOTkxMTksMC45OTEybC02Ljk5NTYsLTYuOTk1Nmw3LjAwODgxLC03LjAwODgxbDAuOTkxMTksMC45OTExOWwtNi4wMTc2MSw2LjAxNzYybDYuMDA0NCw2LjAwNDR6IiB0cmFuc2Zvcm09InJvdGF0ZSgtMTgwLCA0LCA3KSIvPgo8L3N2Zz4K"); From 9717fc28c8da3563085049feb382142d4dbf7984 Mon Sep 17 00:00:00 2001 From: Ian Bicking Date: Mon, 20 Mar 2017 14:55:58 -0500 Subject: [PATCH 05/40] Rename .pageshot-visible|full-page to .visible|full-page --- addon/webextension/selector/ui.js | 16 ++++++++-------- static/css/inline-selection.scss | 4 ++-- 2 files changed, 10 insertions(+), 10 deletions(-) diff --git a/addon/webextension/selector/ui.js b/addon/webextension/selector/ui.js index cf4218268a..0c5f9cbf9e 100644 --- a/addon/webextension/selector/ui.js +++ b/addon/webextension/selector/ui.js @@ -33,8 +33,8 @@ window.ui = (function () { // eslint-disable-line no-unused-vars while (el) { if (el.classList && (el.classList.contains("myshots-button") || - el.classList.contains("pageshot-visible") || - el.classList.contains("pageshot-full-page"))) { + el.classList.contains("visible") || + el.classList.contains("full-page"))) { return true; } el = el.parentNode; @@ -218,19 +218,19 @@ window.ui = (function () { // eslint-disable-line no-unused-vars
-
-
+
+
`; this.el.querySelector(".pageshot-preview-instructions").textContent = browser.i18n.getMessage("screenshotInstructions"); this.el.querySelector(".myshots-text").textContent = browser.i18n.getMessage("myShotsLink"); - this.el.querySelector(".pageshot-visible").textContent = browser.i18n.getMessage("saveScreenshotVisibleArea"); - this.el.querySelector(".pageshot-full-page").textContent = browser.i18n.getMessage("saveScreenshotFullPage"); + this.el.querySelector(".visible").textContent = browser.i18n.getMessage("saveScreenshotVisibleArea"); + this.el.querySelector(".full-page").textContent = browser.i18n.getMessage("saveScreenshotFullPage"); this.el.querySelector(".myshots-button").addEventListener( "click", watchFunction(callbacks.onOpenMyShots), false); - this.el.querySelector(".pageshot-visible").addEventListener( + this.el.querySelector(".visible").addEventListener( "click", watchFunction(callbacks.onClickVisible), false); - this.el.querySelector(".pageshot-full-page").addEventListener( + this.el.querySelector(".full-page").addEventListener( "click", watchFunction(callbacks.onClickFullPage), false); this.movingEl = this.el.querySelector(".pageshot-moving-element"); iframe.document.body.appendChild(this.el); diff --git a/static/css/inline-selection.scss b/static/css/inline-selection.scss index e18ecf5d70..7ba3017662 100644 --- a/static/css/inline-selection.scss +++ b/static/css/inline-selection.scss @@ -398,13 +398,13 @@ $overlay-z-index: 9999999999; /* end styleMyShotsButton test */ -.pageshot-visible { +.visible { @extend .myshots-button; pointer-events: all; top: 60px; } -.pageshot-full-page { +.full-page { @extend .myshots-button; pointer-events: all; top: 105px; From 33804172cf015fb575b0f658abf17a7f0c4112b3 Mon Sep 17 00:00:00 2001 From: Ian Bicking Date: Mon, 20 Mar 2017 15:54:39 -0500 Subject: [PATCH 06/40] Rename .pageshot-preview-overlay and .pageshot-moving-element Use .fixed-container for moving-element, to better explain the purpose --- addon/webextension/selector/ui.js | 6 +++--- addon/webextension/selector/uicontrol.js | 4 ++-- static/css/inline-selection.scss | 8 ++++---- 3 files changed, 9 insertions(+), 9 deletions(-) diff --git a/addon/webextension/selector/ui.js b/addon/webextension/selector/ui.js index 0c5f9cbf9e..9d328cd000 100644 --- a/addon/webextension/selector/ui.js +++ b/addon/webextension/selector/ui.js @@ -209,9 +209,9 @@ window.ui = (function () { // eslint-disable-line no-unused-vars display: function (callbacks) { this.remove(); - this.el = makeEl("div", "pageshot-preview-overlay"); + this.el = makeEl("div", "preview-overlay"); this.el.innerHTML = ` -
+
@@ -232,7 +232,7 @@ window.ui = (function () { // eslint-disable-line no-unused-vars "click", watchFunction(callbacks.onClickVisible), false); this.el.querySelector(".full-page").addEventListener( "click", watchFunction(callbacks.onClickFullPage), false); - this.movingEl = this.el.querySelector(".pageshot-moving-element"); + this.movingEl = this.el.querySelector(".fixed-container"); iframe.document.body.appendChild(this.el); this.resetPosition(); window.addEventListener("scroll", this.onScroll, false); diff --git a/addon/webextension/selector/uicontrol.js b/addon/webextension/selector/uicontrol.js index 78109c0bc8..ae698c5789 100644 --- a/addon/webextension/selector/uicontrol.js +++ b/addon/webextension/selector/uicontrol.js @@ -361,14 +361,14 @@ window.uicontrol = (function () { mousemove: function (event) { ui.PixelDimensions.display(event.pageX, event.pageY, event.pageX, event.pageY); if (event.target.classList && - (! event.target.classList.contains("pageshot-preview-overlay"))) { + (! event.target.classList.contains("preview-overlay"))) { // User is hovering over a Page Shot button or control autoDetectRect = null; ui.HoverBox.hide(); return; } let el; - if (event.target.classList.contains("pageshot-preview-overlay")) { + if (event.target.classList.contains("preview-overlay")) { // The hover is on the overlay, so we need to figure out the real element el = ui.iframe.getElementFromPoint( event.pageX - window.pageXOffset, diff --git a/static/css/inline-selection.scss b/static/css/inline-selection.scss index 7ba3017662..100b9dd4e4 100644 --- a/static/css/inline-selection.scss +++ b/static/css/inline-selection.scss @@ -308,7 +308,7 @@ $overlay-z-index: 9999999999; pointer-events: none; } -.pageshot-preview-overlay { +.preview-overlay { align-items: center; background-color: rgba(#000, 0.5); display: flex; @@ -337,9 +337,9 @@ $overlay-z-index: 9999999999; 1px 1px 0 #fff; } -// FIXME: some of the styles in .pageshot-moving-element were copied from -// .pageshot-preview-overlay and are probably unnecessary -.pageshot-moving-element { +// FIXME: some of the styles in .fixed-container were copied from +// .preview-overlay and are probably unnecessary +.fixed-container { pointer-events: none; position: absolute; align-items: center; From bc9275a3c811badf63fcc99e3ff666ee5598b4a8 Mon Sep 17 00:00:00 2001 From: Ian Bicking Date: Mon, 20 Mar 2017 15:57:08 -0500 Subject: [PATCH 07/40] Rename .pageshot-preview-instructions to .preview-instructions --- addon/webextension/selector/ui.js | 4 ++-- static/css/inline-selection.scss | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/addon/webextension/selector/ui.js b/addon/webextension/selector/ui.js index 9d328cd000..0a66dbb880 100644 --- a/addon/webextension/selector/ui.js +++ b/addon/webextension/selector/ui.js @@ -212,7 +212,7 @@ window.ui = (function () { // eslint-disable-line no-unused-vars this.el = makeEl("div", "preview-overlay"); this.el.innerHTML = `
-
+
@@ -222,7 +222,7 @@ window.ui = (function () { // eslint-disable-line no-unused-vars
`; - this.el.querySelector(".pageshot-preview-instructions").textContent = browser.i18n.getMessage("screenshotInstructions"); + this.el.querySelector(".preview-instructions").textContent = browser.i18n.getMessage("screenshotInstructions"); this.el.querySelector(".myshots-text").textContent = browser.i18n.getMessage("myShotsLink"); this.el.querySelector(".visible").textContent = browser.i18n.getMessage("saveScreenshotVisibleArea"); this.el.querySelector(".full-page").textContent = browser.i18n.getMessage("saveScreenshotFullPage"); diff --git a/static/css/inline-selection.scss b/static/css/inline-selection.scss index 100b9dd4e4..c3e7a60945 100644 --- a/static/css/inline-selection.scss +++ b/static/css/inline-selection.scss @@ -353,7 +353,7 @@ $overlay-z-index: 9999999999; width: 100%; } -.pageshot-preview-instructions { +.preview-instructions { @include flex-container(row, center, center); pointer-events: none; animation: pageshot-pulse ease-in-out 200ms; From a111864876c7ac00b266b3392ed4c4caa394c8ac Mon Sep 17 00:00:00 2001 From: Ian Bicking Date: Mon, 20 Mar 2017 15:57:52 -0500 Subject: [PATCH 08/40] Remove .pageshot-overlay-button that has no associated rules --- addon/webextension/selector/ui.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/addon/webextension/selector/ui.js b/addon/webextension/selector/ui.js index 0a66dbb880..e0e6e74faf 100644 --- a/addon/webextension/selector/ui.js +++ b/addon/webextension/selector/ui.js @@ -218,8 +218,8 @@ window.ui = (function () { // eslint-disable-line no-unused-vars
-
-
+
+
`; this.el.querySelector(".preview-instructions").textContent = browser.i18n.getMessage("screenshotInstructions"); From d755658e53020ad94909c55b25689475d16df0d9 Mon Sep 17 00:00:00 2001 From: Ian Bicking Date: Mon, 20 Mar 2017 16:00:50 -0500 Subject: [PATCH 09/40] Rename .pageshot-small-selection and .pageshot-bottom-selection to remove pageshot- --- addon/webextension/selector/ui.js | 8 ++++---- static/css/inline-selection.scss | 12 ++++++------ 2 files changed, 10 insertions(+), 10 deletions(-) diff --git a/addon/webextension/selector/ui.js b/addon/webextension/selector/ui.js index e0e6e74faf..01985de9b5 100644 --- a/addon/webextension/selector/ui.js +++ b/addon/webextension/selector/ui.js @@ -325,17 +325,17 @@ window.ui = (function () { // eslint-disable-line no-unused-vars let pageYOffset = window.pageYOffset; if ((pos.right - pos.left) < 78 || (pos.bottom - pos.top) < 78) { - this.el.classList.add("pageshot-small-selection"); + this.el.classList.add("small-selection"); } else { - this.el.classList.remove("pageshot-small-selection"); + this.el.classList.remove("small-selection"); } // if the selection bounding box is w/in SAVE_BUTTON_HEIGHT px of the bottom of // the window, flip controls into the box if (pos.bottom > ((winBottom + pageYOffset) - SAVE_BUTTON_HEIGHT)) { - this.el.classList.add("pageshot-bottom-selection"); + this.el.classList.add("bottom-selection"); } else { - this.el.classList.remove("pageshot-bottom-selection"); + this.el.classList.remove("bottom-selection"); } this.el.style.top = (pos.top - bodyRect.top) + "px"; this.el.style.left = (pos.left - bodyRect.left) + "px"; diff --git a/static/css/inline-selection.scss b/static/css/inline-selection.scss index c3e7a60945..0ea085c71e 100644 --- a/static/css/inline-selection.scss +++ b/static/css/inline-selection.scss @@ -43,7 +43,7 @@ $overlay-z-index: 9999999999; right: 0; z-index: 6; - .pageshot-bottom-selection & { + .bottom-selection & { bottom: 5px; } } @@ -201,7 +201,7 @@ $overlay-z-index: 9999999999; width: $handle-size; z-index: 1001; - .pageshot-small-selection & { + .small-selection & { height: $handle-size-small; width: $handle-size-small; } @@ -217,7 +217,7 @@ $overlay-z-index: 9999999999; left: 50%; margin-left: -$handle-size / 2; - .pageshot-small-selection & { + .small-selection & { margin-left: -$handle-size-small / 2; } } @@ -232,7 +232,7 @@ $overlay-z-index: 9999999999; margin-top: -$handle-size / 2; left: $handle-mover-offset; - .pageshot-small-selection & { + .small-selection & { margin-top: -$handle-size-small / 2; } } @@ -242,7 +242,7 @@ $overlay-z-index: 9999999999; margin-top: -$handle-size / 2; right: $handle-mover-offset; - .pageshot-small-selection & { + .small-selection & { margin-top: -$handle-size-small / 2; } } @@ -257,7 +257,7 @@ $overlay-z-index: 9999999999; margin-left: -$handle-size / 2; bottom: $handle-mover-offset; - .pageshot-small-selection & { + .small-selection & { margin-left: -$handle-size-small / 2; } } From cf5f35770f404303382c24ce4affd577271e3485 Mon Sep 17 00:00:00 2001 From: Ian Bicking Date: Mon, 20 Mar 2017 16:02:26 -0500 Subject: [PATCH 10/40] Rename .pageshot-highlight(-*) to remove .pageshot- --- addon/webextension/selector/ui.js | 22 +++++++++++----------- static/css/inline-selection.scss | 20 ++++++++++---------- 2 files changed, 21 insertions(+), 21 deletions(-) diff --git a/addon/webextension/selector/ui.js b/addon/webextension/selector/ui.js index 01985de9b5..c27bd672ef 100644 --- a/addon/webextension/selector/ui.js +++ b/addon/webextension/selector/ui.js @@ -374,15 +374,15 @@ window.ui = (function () { // eslint-disable-line no-unused-vars if (boxEl) { return; } - boxEl = makeEl("div", "pageshot-highlight"); - let buttons = makeEl("div", "pageshot-highlight-buttons"); - let cancel = makeEl("button", "pageshot-highlight-button-cancel"); + boxEl = makeEl("div", "highlight"); + let buttons = makeEl("div", "highlight-buttons"); + let cancel = makeEl("button", "highlight-button-cancel"); cancel.title = browser.i18n.getMessage("cancelScreenshot"); buttons.appendChild(cancel); - let download = makeEl("button", "pageshot-highlight-button-download"); + let download = makeEl("button", "highlight-button-download"); download.title = browser.i18n.getMessage("downloadScreenshot"); buttons.appendChild(download); - let save = makeEl("button", "pageshot-highlight-button-save"); + let save = makeEl("button", "highlight-button-save"); save.textContent = browser.i18n.getMessage("saveScreenshotSelectedArea"); save.title = browser.i18n.getMessage("saveScreenshotSelectedArea"); buttons.appendChild(save); @@ -396,13 +396,13 @@ window.ui = (function () { // eslint-disable-line no-unused-vars elTarget.appendChild(elMover); boxEl.appendChild(elTarget); } - this.bgTop = makeEl("div", "pageshot-bghighlight"); + this.bgTop = makeEl("div", "bghighlight"); iframe.document.body.appendChild(this.bgTop); - this.bgLeft = makeEl("div", "pageshot-bghighlight"); + this.bgLeft = makeEl("div", "bghighlight"); iframe.document.body.appendChild(this.bgLeft); - this.bgRight = makeEl("div", "pageshot-bghighlight"); + this.bgRight = makeEl("div", "bghighlight"); iframe.document.body.appendChild(this.bgRight); - this.bgBottom = makeEl("div", "pageshot-bghighlight"); + this.bgBottom = makeEl("div", "bghighlight"); iframe.document.body.appendChild(this.bgBottom); iframe.document.body.appendChild(boxEl); this.el = boxEl; @@ -431,7 +431,7 @@ window.ui = (function () { // eslint-disable-line no-unused-vars if (target.tagName === "BUTTON") { return false; } - if (target.nodeType == document.ELEMENT_NODE && target.classList.contains("pageshot-highlight")) { + if (target.nodeType == document.ELEMENT_NODE && target.classList.contains("highlight")) { return true; } target = target.parentNode; @@ -441,7 +441,7 @@ window.ui = (function () { // eslint-disable-line no-unused-vars isControl: function (target) { while (target) { - if (target.nodeType === document.ELEMENT_NODE && target.classList.contains("pageshot-highlight-buttons")) { + if (target.nodeType === document.ELEMENT_NODE && target.classList.contains("highlight-buttons")) { return true; } target = target.parentNode; diff --git a/static/css/inline-selection.scss b/static/css/inline-selection.scss index 0ea085c71e..65121786d8 100644 --- a/static/css/inline-selection.scss +++ b/static/css/inline-selection.scss @@ -27,7 +27,7 @@ $overlay-z-index: 9999999999; display: none; } -.pageshot-highlight { +.highlight { position: absolute; cursor: move; border: 1px dashed rgba($link-blue, 0.5); @@ -36,7 +36,7 @@ $overlay-z-index: 9999999999; z-index: $overlay-z-index; } -.pageshot-highlight-buttons { +.highlight-buttons { @include flex-container(row, center, center, wrap); position: absolute; bottom: -55px; @@ -48,7 +48,7 @@ $overlay-z-index: 9999999999; } } -.pageshot-highlight-button-cancel { +.highlight-button-cancel { @extend .button; @extend .secondary; background: $very-light-grey url("MOZ_EXTENSION/icons/cancel.svg") center center no-repeat; @@ -64,7 +64,7 @@ $overlay-z-index: 9999999999; } } -.pageshot-highlight-button-save { +.highlight-button-save { @extend .button; @extend .primary; font-size: 18px; @@ -72,7 +72,7 @@ $overlay-z-index: 9999999999; width: 80px; } -.pageshot-highlight-button-download { +.highlight-button-download { @extend .button; @extend .secondary; background: $very-light-grey url("MOZ_EXTENSION/icons/download.svg") center center no-repeat; @@ -88,8 +88,8 @@ $overlay-z-index: 9999999999; } } -.pageshot-highlight-button-cancel, -.pageshot-highlight-button-download { +.highlight-button-cancel, +.highlight-button-download { opacity: 0.9; transition: opacity 250ms; @@ -106,14 +106,14 @@ $overlay-z-index: 9999999999; pointer-events: auto; } -.pageshot-highlight, +.highlight, .pageshot-mover-target { background-color: transparent; background-image: none; } .pageshot-mover-target, -.pageshot-bghighlight { +.bghighlight { border: 0; } @@ -267,7 +267,7 @@ $overlay-z-index: 9999999999; bottom: $handle-mover-offset; } -.pageshot-bghighlight { +.bghighlight { position: absolute; background-color: rgba(#323232, 0.5); z-index: $overlay-z-index; From 3387c67344746fc4bed3fdca971a74e2c3120e27 Mon Sep 17 00:00:00 2001 From: Ian Bicking Date: Mon, 20 Mar 2017 16:10:32 -0500 Subject: [PATCH 11/40] Rename .pageshot-{direction} to .direction-{direction} --- addon/webextension/selector/ui.js | 2 +- static/css/inline-selection.scss | 32 +++++++++++++++---------------- 2 files changed, 17 insertions(+), 17 deletions(-) diff --git a/addon/webextension/selector/ui.js b/addon/webextension/selector/ui.js index c27bd672ef..74068adea0 100644 --- a/addon/webextension/selector/ui.js +++ b/addon/webextension/selector/ui.js @@ -391,7 +391,7 @@ window.ui = (function () { // eslint-disable-line no-unused-vars this.save = save; boxEl.appendChild(buttons); for (let name of movements) { - let elTarget = makeEl("div", "pageshot-mover-target pageshot-" + name); + let elTarget = makeEl("div", "pageshot-mover-target direction-" + name); let elMover = makeEl("div", "pageshot-mover"); elTarget.appendChild(elMover); boxEl.appendChild(elTarget); diff --git a/static/css/inline-selection.scss b/static/css/inline-selection.scss index 65121786d8..4c22147166 100644 --- a/static/css/inline-selection.scss +++ b/static/css/inline-selection.scss @@ -117,7 +117,7 @@ $overlay-z-index: 9999999999; border: 0; } -.pageshot-mover-target.pageshot-topLeft { +.pageshot-mover-target.direction-topLeft { cursor: nwse-resize; top: -$mover-outer; left: -$mover-outer; @@ -125,7 +125,7 @@ $overlay-z-index: 9999999999; height: $mover-size; } -.pageshot-mover-target.pageshot-top { +.pageshot-mover-target.direction-top { cursor: ns-resize; top: -$mover-outer; left: 0; @@ -135,7 +135,7 @@ $overlay-z-index: 9999999999; z-index: 4; } -.pageshot-mover-target.pageshot-topRight { +.pageshot-mover-target.direction-topRight { cursor: nesw-resize; top: -$mover-outer; right: -$mover-outer; @@ -143,7 +143,7 @@ $overlay-z-index: 9999999999; width: $mover-size; } -.pageshot-mover-target.pageshot-left { +.pageshot-mover-target.direction-left { cursor: ew-resize; top: 0; left: -$mover-outer; @@ -152,7 +152,7 @@ $overlay-z-index: 9999999999; z-index: 4; } -.pageshot-mover-target.pageshot-right { +.pageshot-mover-target.direction-right { cursor: ew-resize; top: 0; right: -$mover-outer; @@ -161,7 +161,7 @@ $overlay-z-index: 9999999999; z-index: 4; } -.pageshot-mover-target.pageshot-bottomLeft { +.pageshot-mover-target.direction-bottomLeft { cursor: nesw-resize; left: -$mover-outer; bottom: -$mover-outer; @@ -169,7 +169,7 @@ $overlay-z-index: 9999999999; height: $mover-size; } -.pageshot-mover-target.pageshot-bottom { +.pageshot-mover-target.direction-bottom { cursor: ns-resize; left: 0; bottom: -$mover-outer; @@ -178,7 +178,7 @@ $overlay-z-index: 9999999999; z-index: 4; } -.pageshot-mover-target.pageshot-bottomRight { +.pageshot-mover-target.direction-bottomRight { cursor: nwse-resize; bottom: -$mover-outer; right: -$mover-outer; @@ -207,12 +207,12 @@ $overlay-z-index: 9999999999; } } -.pageshot-topLeft .pageshot-mover { +.direction-topLeft .pageshot-mover { top: $handle-mover-offset; left: $handle-mover-offset; } -.pageshot-top .pageshot-mover { +.direction-top .pageshot-mover { top: $handle-mover-offset; left: 50%; margin-left: -$handle-size / 2; @@ -222,12 +222,12 @@ $overlay-z-index: 9999999999; } } -.pageshot-topRight .pageshot-mover { +.direction-topRight .pageshot-mover { top: $handle-mover-offset; right: $handle-mover-offset; } -.pageshot-left .pageshot-mover { +.direction-left .pageshot-mover { top: 50%; margin-top: -$handle-size / 2; left: $handle-mover-offset; @@ -237,7 +237,7 @@ $overlay-z-index: 9999999999; } } -.pageshot-right .pageshot-mover { +.direction-right .pageshot-mover { top: 50%; margin-top: -$handle-size / 2; right: $handle-mover-offset; @@ -247,12 +247,12 @@ $overlay-z-index: 9999999999; } } -.pageshot-bottomLeft .pageshot-mover { +.direction-bottomLeft .pageshot-mover { bottom: $handle-mover-offset; left: $handle-mover-offset; } -.pageshot-bottom .pageshot-mover { +.direction-bottom .pageshot-mover { left: 50%; margin-left: -$handle-size / 2; bottom: $handle-mover-offset; @@ -262,7 +262,7 @@ $overlay-z-index: 9999999999; } } -.pageshot-bottomRight .pageshot-mover { +.direction-bottomRight .pageshot-mover { right: $handle-mover-offset; bottom: $handle-mover-offset; } From 7bc5bd58d2aed502d48d008772d891995d1f7a08 Mon Sep 17 00:00:00 2001 From: Ian Bicking Date: Mon, 20 Mar 2017 16:13:06 -0500 Subject: [PATCH 12/40] Rename .pageshot-mover|mover-target to remove pageshot- --- addon/webextension/selector/ui.js | 8 +++--- static/css/inline-selection.scss | 44 +++++++++++++++---------------- 2 files changed, 26 insertions(+), 26 deletions(-) diff --git a/addon/webextension/selector/ui.js b/addon/webextension/selector/ui.js index 74068adea0..f7277998e6 100644 --- a/addon/webextension/selector/ui.js +++ b/addon/webextension/selector/ui.js @@ -391,8 +391,8 @@ window.ui = (function () { // eslint-disable-line no-unused-vars this.save = save; boxEl.appendChild(buttons); for (let name of movements) { - let elTarget = makeEl("div", "pageshot-mover-target direction-" + name); - let elMover = makeEl("div", "pageshot-mover"); + let elTarget = makeEl("div", "mover-target direction-" + name); + let elMover = makeEl("div", "mover"); elTarget.appendChild(elMover); boxEl.appendChild(elTarget); } @@ -411,14 +411,14 @@ window.ui = (function () { // eslint-disable-line no-unused-vars draggerDirection: function (target) { while (target) { if (target.nodeType == document.ELEMENT_NODE) { - if (target.classList.contains("pageshot-mover-target")) { + if (target.classList.contains("mover-target")) { for (let name of movements) { if (target.classList.contains("pageshot-" + name)) { return name; } } catcher.unhandled(new Error("Surprising mover element"), {element: target.outerHTML}); - console.warn("Got pageshot-mover-target that wasn't a specific direction"); + console.warn("Got mover-target that wasn't a specific direction"); } } target = target.parentNode; diff --git a/static/css/inline-selection.scss b/static/css/inline-selection.scss index 4c22147166..0a834a2394 100644 --- a/static/css/inline-selection.scss +++ b/static/css/inline-selection.scss @@ -23,7 +23,7 @@ $handle-mover-offset: $mover-outer - $handle-outside-extent / 2; $mover-size: $mover-outer + $mover-inner; $overlay-z-index: 9999999999; -.pageshot-hide-movers .pageshot-mover { +.pageshot-hide-movers .mover { display: none; } @@ -100,24 +100,24 @@ $overlay-z-index: 9999999999; } } -.pageshot-mover-target { +.mover-target { position: absolute; z-index: 5; pointer-events: auto; } .highlight, -.pageshot-mover-target { +.mover-target { background-color: transparent; background-image: none; } -.pageshot-mover-target, +.mover-target, .bghighlight { border: 0; } -.pageshot-mover-target.direction-topLeft { +.mover-target.direction-topLeft { cursor: nwse-resize; top: -$mover-outer; left: -$mover-outer; @@ -125,7 +125,7 @@ $overlay-z-index: 9999999999; height: $mover-size; } -.pageshot-mover-target.direction-top { +.mover-target.direction-top { cursor: ns-resize; top: -$mover-outer; left: 0; @@ -135,7 +135,7 @@ $overlay-z-index: 9999999999; z-index: 4; } -.pageshot-mover-target.direction-topRight { +.mover-target.direction-topRight { cursor: nesw-resize; top: -$mover-outer; right: -$mover-outer; @@ -143,7 +143,7 @@ $overlay-z-index: 9999999999; width: $mover-size; } -.pageshot-mover-target.direction-left { +.mover-target.direction-left { cursor: ew-resize; top: 0; left: -$mover-outer; @@ -152,7 +152,7 @@ $overlay-z-index: 9999999999; z-index: 4; } -.pageshot-mover-target.direction-right { +.mover-target.direction-right { cursor: ew-resize; top: 0; right: -$mover-outer; @@ -161,7 +161,7 @@ $overlay-z-index: 9999999999; z-index: 4; } -.pageshot-mover-target.direction-bottomLeft { +.mover-target.direction-bottomLeft { cursor: nesw-resize; left: -$mover-outer; bottom: -$mover-outer; @@ -169,7 +169,7 @@ $overlay-z-index: 9999999999; height: $mover-size; } -.pageshot-mover-target.direction-bottom { +.mover-target.direction-bottom { cursor: ns-resize; left: 0; bottom: -$mover-outer; @@ -178,7 +178,7 @@ $overlay-z-index: 9999999999; z-index: 4; } -.pageshot-mover-target.direction-bottomRight { +.mover-target.direction-bottomRight { cursor: nwse-resize; bottom: -$mover-outer; right: -$mover-outer; @@ -186,11 +186,11 @@ $overlay-z-index: 9999999999; height: $mover-size; } -.pageshot-mover-target:hover .pageshot-mover { +.mover-target:hover .mover { opacity: 1; } -.pageshot-mover { +.mover { background-color: $link-blue; border-radius: 2px; box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.1) inset; @@ -207,12 +207,12 @@ $overlay-z-index: 9999999999; } } -.direction-topLeft .pageshot-mover { +.direction-topLeft .mover { top: $handle-mover-offset; left: $handle-mover-offset; } -.direction-top .pageshot-mover { +.direction-top .mover { top: $handle-mover-offset; left: 50%; margin-left: -$handle-size / 2; @@ -222,12 +222,12 @@ $overlay-z-index: 9999999999; } } -.direction-topRight .pageshot-mover { +.direction-topRight .mover { top: $handle-mover-offset; right: $handle-mover-offset; } -.direction-left .pageshot-mover { +.direction-left .mover { top: 50%; margin-top: -$handle-size / 2; left: $handle-mover-offset; @@ -237,7 +237,7 @@ $overlay-z-index: 9999999999; } } -.direction-right .pageshot-mover { +.direction-right .mover { top: 50%; margin-top: -$handle-size / 2; right: $handle-mover-offset; @@ -247,12 +247,12 @@ $overlay-z-index: 9999999999; } } -.direction-bottomLeft .pageshot-mover { +.direction-bottomLeft .mover { bottom: $handle-mover-offset; left: $handle-mover-offset; } -.direction-bottom .pageshot-mover { +.direction-bottom .mover { left: 50%; margin-left: -$handle-size / 2; bottom: $handle-mover-offset; @@ -262,7 +262,7 @@ $overlay-z-index: 9999999999; } } -.direction-bottomRight .pageshot-mover { +.direction-bottomRight .mover { right: $handle-mover-offset; bottom: $handle-mover-offset; } From f2fab10a760f44d2ea4ffa07e86f7815a5ba9144 Mon Sep 17 00:00:00 2001 From: Ian Bicking Date: Mon, 20 Mar 2017 16:14:16 -0500 Subject: [PATCH 13/40] Detect directional resizes after name change --- addon/webextension/selector/ui.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/addon/webextension/selector/ui.js b/addon/webextension/selector/ui.js index f7277998e6..e2993e66fd 100644 --- a/addon/webextension/selector/ui.js +++ b/addon/webextension/selector/ui.js @@ -413,7 +413,7 @@ window.ui = (function () { // eslint-disable-line no-unused-vars if (target.nodeType == document.ELEMENT_NODE) { if (target.classList.contains("mover-target")) { for (let name of movements) { - if (target.classList.contains("pageshot-" + name)) { + if (target.classList.contains("direction-" + name)) { return name; } } From f2425cdb1fbccda515da4fa4b39b4f66ce059994 Mon Sep 17 00:00:00 2001 From: Ian Bicking Date: Mon, 20 Mar 2017 16:16:09 -0500 Subject: [PATCH 14/40] Rename .pageshot-hover-highlight and .pageshot-pixel-dimensions to remove .pageshot- --- addon/webextension/selector/ui.js | 4 ++-- static/css/inline-selection.scss | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/addon/webextension/selector/ui.js b/addon/webextension/selector/ui.js index e2993e66fd..acd7000e82 100644 --- a/addon/webextension/selector/ui.js +++ b/addon/webextension/selector/ui.js @@ -462,7 +462,7 @@ window.ui = (function () { // eslint-disable-line no-unused-vars display: function (rect) { if (! this.el) { - this.el = makeEl("div", "pageshot-hover-highlight"); + this.el = makeEl("div", "hover-highlight"); iframe.document.body.appendChild(this.el); } this.el.style.display = ""; @@ -490,7 +490,7 @@ window.ui = (function () { // eslint-disable-line no-unused-vars yEl: null, display: function (xPos, yPos, x, y) { if (! this.el) { - this.el = makeEl("div", "pageshot-pixel-dimensions"); + this.el = makeEl("div", "pixel-dimensions"); this.xEl = makeEl("div"); this.el.appendChild(this.xEl); this.yEl = makeEl("div"); diff --git a/static/css/inline-selection.scss b/static/css/inline-selection.scss index 0a834a2394..94140b386f 100644 --- a/static/css/inline-selection.scss +++ b/static/css/inline-selection.scss @@ -323,7 +323,7 @@ $overlay-z-index: 9999999999; z-index: $overlay-z-index; } -.pageshot-pixel-dimensions { +.pixel-dimensions { position: absolute; pointer-events: none; font-weight: bold; @@ -558,7 +558,7 @@ $overlay-z-index: 9999999999; } } -.pageshot-hover-highlight { +.hover-highlight { animation: pageshot-fade-in 500ms forwards; opacity: 0; position: absolute; From 0b8b8366dea354b1710b1eecbd53d80491a1e05a Mon Sep 17 00:00:00 2001 From: Ian Bicking Date: Mon, 20 Mar 2017 16:18:58 -0500 Subject: [PATCH 15/40] Remove now-unused content.css that was left over from DOM freezing --- static/css/content.scss | 6 ------ 1 file changed, 6 deletions(-) delete mode 100644 static/css/content.scss diff --git a/static/css/content.scss b/static/css/content.scss deleted file mode 100644 index 93be5f56bd..0000000000 --- a/static/css/content.scss +++ /dev/null @@ -1,6 +0,0 @@ -.pageshot-clip-highlight { - position: absolute; - pointer-events: none; - z-index: 10000; - border: 3px solid rgba(#0095dd, 0.5); -} From f829a300e1af9aac027ff9a4b935361537a39e72 Mon Sep 17 00:00:00 2001 From: Ian Bicking Date: Mon, 20 Mar 2017 16:23:43 -0500 Subject: [PATCH 16/40] Remove last vestiges of the long-disabled export functionality --- server/src/config.js | 22 --- server/src/export-shots.sh | 44 ------ server/src/exporter.js | 269 --------------------------------- server/src/jobs.js | 3 - server/src/pages/shot/model.js | 2 - server/src/server.js | 10 -- static/css/styles.scss | 2 - 7 files changed, 352 deletions(-) delete mode 100755 server/src/export-shots.sh delete mode 100644 server/src/exporter.js diff --git a/server/src/config.js b/server/src/config.js index ebb8f74450..3337206e04 100644 --- a/server/src/config.js +++ b/server/src/config.js @@ -1,7 +1,6 @@ /* Note: do not use ES6 features here, we need to use this module from the build system before translation */ const convict = require("convict"); const envc = require("envc"); -const path = require("path"); // Populate `process.env` with overrides from environment-specific `.env` // files as a side effect. See `https://npmjs.org/envc` for more info. @@ -124,20 +123,6 @@ var conf = convict({ env: "GA_ID", arg: "ga-id" }, - exportBase: { - doc: "File location to keep exports", - format: String, - default: path.join(path.dirname(__dirname), "export-files"), - env: "EXPORT_BASE", - arg: "export-base" - }, - exportKeepTime: { - doc: "Minutes to keep an export", - format: "int", - default: 60, - env: "EXPORT_KEEP_TIME", - arg: "export-keep-time" - }, // This is mostly configurable for debugging purposes: checkDeletedInterval: { doc: "Frequency in seconds to check for items that should be purged", @@ -174,13 +159,6 @@ var conf = convict({ env: "DISABLE_METRICS", arg: "disable-metrics" }, - allowExport: { - doc: "Whether to allow exporting shots", - format: Boolean, - default: false, - env: "ALLOW_EXPORT", - arg: "allow-export" - }, sentryDSN: { doc: "The sentry DSN URL to use for recording errors, if any. Sentry is not used on the server unless this parameter is provided.", format: String, diff --git a/server/src/export-shots.sh b/server/src/export-shots.sh deleted file mode 100755 index a3295a84ef..0000000000 --- a/server/src/export-shots.sh +++ /dev/null @@ -1,44 +0,0 @@ -#!/usr/bin/env bash - -set -e - -mkdir -p $BASE_DIR -cd $BASE_DIR -base="$(pwd)" - -( - set -ex - - _cleanup () { - rm -f $base/script-process.pid - echo -n $? > $base/script-exit-code.txt - node -e 'console.log(Date.now())' > $base/script-exit-time.txt - } - - echo -n $$ > $base/wget-process.pid - - trap _cleanup EXIT - - mkdir -p pageshot-export - cd pageshot-export - - set +e - wget --mirror --page-requisites --convert-links --execute robots=no \ - --no-host-directories --adjust-extension --no-verbose \ - --header "X-Magic-Auth: $AUTH" \ - --header "X-Device-Id: $DEVICE_ID" \ - --header "X-Simple: true" \ - http://localhost:$PORT/shots - code="$?" - if [[ "$code" != 0 ]] && [[ "$code" != 8 ]] ; then - # response code 8 is the only good one - echo "Error from wget: $code" - exit $code - fi - set -e - - mv shots.html index.html - - cd $base - zip -r --move pageshot-export.zip pageshot-export/ -) >& $base/script.log diff --git a/server/src/exporter.js b/server/src/exporter.js deleted file mode 100644 index dc6f0c4b41..0000000000 --- a/server/src/exporter.js +++ /dev/null @@ -1,269 +0,0 @@ -const config = require("./config").getProperties(); -const path = require("path"); -const fs = require("fs"); -const child_process = require("child_process"); -const rimraf = require("rimraf"); -const ua = require("universal-analytics"); - -// Convert to milliseconds: -let keepTime = config.exportKeepTime * 60 * 1000; - -function exportPath(deviceId) { - if (deviceId.search(/^[a-z0-9\-]+$/i) == -1) { - throw new Error("Bad deviceId"); - } - return path.join(config.exportBase, "export---" + deviceId); -} - -function removeExportPath(dir) { - return new Promise((resolve, reject) => { - rimraf(dir, (error) => { - if (error && error.code != "ENOENT") { - reject(error); - } else { - resolve(); - } - }); - }); -} - -function launchWget(deviceId) { - return new Promise((resolve, reject) => { - let dir = exportPath(deviceId); - let script = path.join(__dirname, "export-shots.sh"); - let start = Date.now(); - let subprocess = child_process.spawn( - script, - { - env: { - BASE_DIR: dir, - AUTH: require("./dbschema").getTextKeys()[0], - DEVICE_ID: deviceId, - PORT: config.port, - CONTENT_PORT: config.contentPort, - } - } - ); - subprocess.on("close", function (code) { - console.info("Exported to", dir, "in", (Date.now() - start) + "ms", "exit code:", code); - }); - subprocess.on("error", function (e) { - console.warn("Error launching wget:", e); - }); - resolve(); - }); -} - -function getWgetStatus(deviceId) { - return new Promise((resolve, reject) => { - let dir = exportPath(deviceId); - let result = {errors: []}; - let steps = 3; - function resolveIfDone() { - if (steps <= 0) { - resolve(result); - } - } - fs.readFile(path.join(dir, "wget-process.pid"), {encoding: "UTF-8"}, (error, data) => { - if (error && error.code == "ENOENT") { - // File doesn't exist - result.running = false; - } else if (error) { - result.errors.push(["Error loading process PID:", error]); - } else { - result.running = true; - } - steps--; - resolveIfDone(); - }); - fs.readFile(path.join(dir, "script-exit-code.txt"), {encoding: "UTF-8"}, (error, data) => { - if (error && error.code == "ENOENT") { - // Do nothing - } else if (error) { - result.errors.push(["Error loading exit code:", error]); - } else { - let code = parseInt(data, 10); - if (code) { - result.success = false; - } else { - result.success = true; - } - } - steps--; - resolveIfDone(); - }); - fs.stat(path.join(dir, "pageshot-export.zip"), (error, stat) => { - if (error && error.code == "ENOENT") { - result.zip = false; - } else if (error) { - result.errors.push(["Error checking zip file:", error]); - } else { - result.zip = { - size: stat.size, - mtime: stat.mtime.getTime(), - keepTime: keepTime - }; - } - steps--; - resolveIfDone(); - }); - }); -} - -let warnedAboutExportsDirectory = false; - -exports.cleanExports = function () { - let start = Date.now(); - fs.readdir(config.exportBase, (error, files) => { - if (error && error.code == "ENOENT") { - if (!warnedAboutExportsDirectory) { - warnedAboutExportsDirectory = true; - console.info("EXPORT: Could not clean exports, directory", config.exportBase, "does not exist"); - } - return; - } - if (error) { - console.warn("EXPORT: Error listing", config.exportBase, ":", error); - return; - } - let toCheck = files.filter((file) => file.startsWith("export--")); - let count = toCheck.length; - let deletedCount = 0; - let errorCount = 0; - function oneDone(deleted, errored) { - count--; - if (deleted) { - deletedCount++; - } - if (errored) { - errorCount++; - } - if (count <= 0) { - console.info("EXPORT: finished cleanup run;", toCheck.length, "checked;", deletedCount, "deleted;", errorCount, "had errors; total time:", (Date.now() - start) + "ms"); - } - } - for (let dir of toCheck) { - let fullDir = path.join(config.exportBase, dir); - let file = path.join(fullDir, "pageshot-export.zip"); - fs.stat(file, (error, stat) => { - if (error && error.code == "ENOENT") { - fs.stat(fullDir, (error, stat) => { - if (error && error.code == "ENOENT") { - console.info("EXPORT: directory", fullDir, "disappeared during cleanup"); - oneDone(false, false); - return; - } else if (error) { - console.warn("EXPORT: could not stat directory", fullDir, ":", error); - oneDone(false, true); - return; - } - if (stat.mtime.getTime() + keepTime < Date.now()) { - rimraf(fullDir, (error) => { - if (error) { - oneDone(false, true); - console.warn("EXPORT: failed to remove unfinished export", fullDir, ":", error); - } else { - oneDone(true, false); - console.info("EXPORT: removed unfinished export", fullDir); - } - }); - } - }); - return; - } else if (error) { - oneDone(false, true); - console.warn("EXPORT: Error doing stat on", file, ":", error); - return; - } - if (stat.mtime.getTime() + keepTime < Date.now()) { - rimraf(fullDir, (error) => { - if (error) { - oneDone(false, true); - console.warn("EXPORT: failed to remove outdated export", fullDir, ":", error); - } else { - oneDone(true, false); - console.info("EXPORT: removed outdated export:", fullDir); - } - }); - } else { - oneDone(false, false); - } - }); - } - }); -}; - -exports.setup = function (app) { - - app.get("/export", function (req, res) { - if (! req.config.allowExport) { - res.type("txt").status(403).send("Export is not enabled on this server"); - return; - } - if (! req.deviceId) { - res.type("txt").status(403).send("You must have the addon installed to export your shots"); - return; - } - require("./views/export").render(req, res); - }); - - app.post("/export", function (req, res) { - if (! req.deviceId) { - res.type("txt").status(403).send("You must have the addon installed to export your shots"); - return; - } - let userAnalytics = ua(config.gaId, req.deviceId, {strictCidFormat: false}); - userAnalytics.event("click", "export"); - launchWget(req.deviceId).then(() => { - res.redirect("/export/status?started=" + encodeURIComponent(Date.now())); - }).catch((e) => { - require("./responses").errorResponse(res, "Failed to launch export", e); - }); - }); - - app.get("/export/status", function (req, res) { - if (! req.deviceId) { - res.type("txt").status(403).send("You must have the addon installed to export your shots"); - return; - } - let started = parseInt(req.query.started, 10); - getWgetStatus(req.deviceId).then((status) => { - if ((! status.running) && ((! started) || (started + 10000 < Date.now()))) { - res.redirect("/export"); - return; - } - if (started && status.zip) { - res.redirect("/export/status"); - return; - } - req.wgetStatus = status; - req.keepTime = keepTime; - require("./views/export").renderStatus(req, res); - }).catch((e) => { - require("./responses").errorResponse(res, "Failed to get status", e); - }); - }); - - app.get("/export/download/pageshot-export.zip", function (req, res) { - if (! req.deviceId) { - res.type("txt").status(403).send("You must have the addon installed to download your shots"); - return; - } - let dir = exportPath(req.deviceId); - let fn = path.join(dir, "pageshot-export.zip"); - res.sendFile(fn); - }); - - app.post("/export/remove", function (req, res) { - if (! req.deviceId) { - res.type("txt").status(403).send("You must have the addon installed"); - } - let dir = exportPath(req.deviceId); - removeExportPath(dir).then(() => { - res.redirect("/export?deleted"); - }).catch((e) => { - require("./responses").errorResponse(res, "Failed to remove directory", e); - }); - }); - -}; diff --git a/server/src/jobs.js b/server/src/jobs.js index 09401c7ee3..8b14b6a705 100644 --- a/server/src/jobs.js +++ b/server/src/jobs.js @@ -5,7 +5,6 @@ const mozlog = require("mozlog")("jobs"); const ua = require("universal-analytics"); // Convert to milliseconds: -//let keepTime = config.exportKeepTime * 60 * 1000; let checkDeletedInterval = config.checkDeletedInterval * 1000; exports.start = function () { @@ -14,8 +13,6 @@ exports.start = function () { return; } - //setInterval(require("./exporter").cleanExports, keepTime / 10); - setInterval(function () { require("./servershot").Shot.cleanDeletedShots() .then((rowCount) => { diff --git a/server/src/pages/shot/model.js b/server/src/pages/shot/model.js index 1f76f471a5..9f1a2100d0 100644 --- a/server/src/pages/shot/model.js +++ b/server/src/pages/shot/model.js @@ -6,7 +6,6 @@ exports.createModel = function (req) { let isMobile = !! (new MobileDetect(req.headers['user-agent'])).mobile(); let serverPayload = { title: req.shot.title, - allowExport: req.config.allowExport, staticLink: req.staticLink, backend: req.backend, shot: req.shot, @@ -33,7 +32,6 @@ exports.createModel = function (req) { }; let clientPayload = { title: req.shot.title, - allowExport: req.config.allowExport, gitRevision: getGitRevision(), backend: req.backend, shot: req.shot.asJson(), diff --git a/server/src/server.js b/server/src/server.js index ebc6020e27..4e7099dbc3 100644 --- a/server/src/server.js +++ b/server/src/server.js @@ -281,16 +281,6 @@ function decodeAuthHeader(header) { return {deviceId, abTests}; } -app.use(function (req, res, next) { - // FIXME: remove this as part of removing all export-related functions - // (was used for the exporter process to act as the user) - let magicAuth = req.headers['x-magic-auth']; - if (magicAuth && dbschema.getTextKeys().indexOf(magicAuth) != -1) { - req.deviceId = req.headers['x-device-id']; - } - next(); -}); - app.use(function (req, res, next) { req.staticLink = linker.staticLink; req.staticLinkWithHost = linker.staticLinkWithHost.bind(null, req); diff --git a/static/css/styles.scss b/static/css/styles.scss index e778d7a375..77b3a630c4 100644 --- a/static/css/styles.scss +++ b/static/css/styles.scss @@ -301,8 +301,6 @@ a.subheading-link { cursor: pointer; } -/* Exporter styles */ - .button { // FIXME: copied from panel.scss .simplified-edit-button display: inline-block; From e37d327c5156f36fd0226f3772cc7274b248172a Mon Sep 17 00:00:00 2001 From: Ian Bicking Date: Mon, 20 Mar 2017 16:25:04 -0500 Subject: [PATCH 17/40] Remove documentation reference to now-gone HTML freezing --- docs/testing-the-api.md | 4 ---- 1 file changed, 4 deletions(-) diff --git a/docs/testing-the-api.md b/docs/testing-the-api.md index c94e2efcd9..50f679a4b4 100644 --- a/docs/testing-the-api.md +++ b/docs/testing-the-api.md @@ -157,10 +157,6 @@ Not authenticated. Gets a saved S3 image. Typically the `PUT` request will ret Not authenticated. Gets the HTML page for a shot. -`GET https://pageshot-usercontent.net/content/{random_id}/{domain}` - -Not authenticated. Gets the HTML for the iframe that's embedded in the shot page. - `GET /shots` Authenticated. Gets HTML for shot index. From cbf635ba08be65023c5c0368cc212423408655ae Mon Sep 17 00:00:00 2001 From: Ian Bicking Date: Mon, 20 Mar 2017 16:29:07 -0500 Subject: [PATCH 18/40] Remove unused CSS rules for now-gone classes starting with pageshot- --- static/css/inline-selection.scss | 134 ------------------------------- static/css/styles.scss | 24 ------ 2 files changed, 158 deletions(-) diff --git a/static/css/inline-selection.scss b/static/css/inline-selection.scss index 94140b386f..9989e2706f 100644 --- a/static/css/inline-selection.scss +++ b/static/css/inline-selection.scss @@ -23,10 +23,6 @@ $handle-mover-offset: $mover-outer - $handle-outside-extent / 2; $mover-size: $mover-outer + $mover-inner; $overlay-z-index: 9999999999; -.pageshot-hide-movers .mover { - display: none; -} - .highlight { position: absolute; cursor: move; @@ -273,41 +269,6 @@ $overlay-z-index: 9999999999; z-index: $overlay-z-index; } -.pageshot-textbutton { - position: absolute; - width: 20px; - height: 20px; - border: 1px solid #666; - box-shadow: 5px 5px 10px #999; - border-radius: 2px; - text-align: center; - vertical-align: center; - color: #000; - background-color: #fff; - z-index: 2000; - cursor: pointer; -} - -.pageshot-horizcross { - position: fixed; - left: 0; - width: 100%; - height: 0; - border: 1px solid rgba(#fff, 0.6); - z-index: $overlay-z-index + 50; - pointer-events: none; -} - -.pageshot-vertcross { - position: fixed; - top: 0; - height: 100%; - width: 0; - border: 1px solid rgba(#fff, 0.6); - z-index: $overlay-z-index + 50; - pointer-events: none; -} - .preview-overlay { align-items: center; background-color: rgba(#000, 0.5); @@ -439,87 +400,6 @@ $overlay-z-index: 9999999999; top: 1px; } -.pageshot-select-mode-background { - position: fixed; - top: 0; - left: 0; - right: 0; - bottom: 0; - background-color: rgba(#000, 0.7); - z-index: 9999999; - display: flex; - align-items: center; - justify-content: center; -} - -.pageshot-select-mode { - position: relative; - width: 380px; - height: 200px; - background-color: #fcfcfc; - text-align: center; - padding-top: 1.5em !important; - padding-bottom: 1.5em !important; - font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen-Sans", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif; - font-size: 14px; -} - -.pageshot-select-mode-square-button { - width: 90px; - height: 90px; - padding-top: 0.25em; - box-sizing: border-box; - border: 0; - border-image-width: 0; - cursor: pointer; - background-color: #fcfcfc; -} - -.pageshot-select-mode-button { - position: absolute; - bottom: 0; - width: 190px; - height: 40px; - padding-top: 0.25em; - box-sizing: border-box; - border: 0; - border-image-width: 0; - border-top: 1px solid #d4d4d4; - background-color: #efefef; - cursor: pointer; -} - -.pageshot-crosshair-pulse { - position: fixed; - top: 20%; - left: 60%; - margin-left: -20px; - margin-top: -20px; - width: 40px; - height: 40px; - border-radius: 20px; - border: 1px solid rgba(#ff0, 0.5); - z-index: $overlay-z-index + 1000; - background-image: radial-gradient(20px at 50% 50%, rgba(#ff0, 0.1), rgba(#ff0, 0.5)); - animation-name: pageshot-pulse; - animation-duration: 1s; - animation-fill-mode: both; - animation-iteration-count: 20; -} - -.pageshot-crosshair-inner { - position: fixed; - top: 20%; - left: 60%; - margin-left: -4px; - margin-top: -4px; - width: 10px; - height: 10px; - border-radius: 5px; - background-color: #fff; - z-index: $overlay-z-index + 101; -} - @keyframes pageshot-pulse { 0% { transform: scale(1); @@ -534,20 +414,6 @@ $overlay-z-index: 9999999999; } } - -.pageshot-horizcross.pageshot-crosshair-preview { - top: 20%; -} - -.pageshot-vertcross.pageshot-crosshair-preview { - left: 60%; -} - -.pageshot-panel * { - box-sizing: border-box; - text-align: start; -} - @keyframes pageshot-fade-in { 0% { opacity: 0; diff --git a/static/css/styles.scss b/static/css/styles.scss index 77b3a630c4..02ec88aa3e 100644 --- a/static/css/styles.scss +++ b/static/css/styles.scss @@ -262,12 +262,6 @@ a.subheading-link { color: #0095dd; } -.pageshot-footer { - position: absolute; - bottom: 1em; - left: 1em; -} - .feedback-footer { position: absolute; bottom: 1em; @@ -275,24 +269,6 @@ a.subheading-link { text-align: right; } -#use-pageshot-to-create { - position: fixed; - left: 0; - right: 0; - bottom: 0; - padding: 1em; - padding-right: 3em; - background-color: $text-color; - color: #000; - z-index: 2000; - box-shadow: 0 -2px 5px $shadow-color; -} - -#use-pageshot-to-create a { - color: #000; - text-decoration: underline; -} - #banner-close { position: absolute; right: 0; From c0054d6240900fc5a5038d5dc1f742f499b02186 Mon Sep 17 00:00:00 2001 From: Ian Bicking Date: Mon, 20 Mar 2017 16:30:02 -0500 Subject: [PATCH 19/40] Rename pageshot-fade-in and pageshot-pulse animations to remove pageshot- --- static/css/inline-selection.scss | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/static/css/inline-selection.scss b/static/css/inline-selection.scss index 9989e2706f..67a5788ca5 100644 --- a/static/css/inline-selection.scss +++ b/static/css/inline-selection.scss @@ -317,7 +317,7 @@ $overlay-z-index: 9999999999; .preview-instructions { @include flex-container(row, center, center); pointer-events: none; - animation: pageshot-pulse ease-in-out 200ms; + animation: pulse ease-in-out 200ms; background-color: rgba(#000, 0.6); border-radius: 20px; color: #fff; @@ -400,7 +400,7 @@ $overlay-z-index: 9999999999; top: 1px; } -@keyframes pageshot-pulse { +@keyframes pulse { 0% { transform: scale(1); } @@ -414,7 +414,7 @@ $overlay-z-index: 9999999999; } } -@keyframes pageshot-fade-in { +@keyframes fade-in { 0% { opacity: 0; } @@ -425,7 +425,7 @@ $overlay-z-index: 9999999999; } .hover-highlight { - animation: pageshot-fade-in 500ms forwards; + animation: fade-in 500ms forwards; opacity: 0; position: absolute; border: 1px dashed rgba($link-blue, 0.5); From 8cc4f79f8bcbc2cb7f5d216dc123f18665071ea9 Mon Sep 17 00:00:00 2001 From: Ian Bicking Date: Mon, 20 Mar 2017 16:30:52 -0500 Subject: [PATCH 20/40] Remove now-unused content-helper.js script --- static/js/content-helper.js | 142 ------------------------------------ 1 file changed, 142 deletions(-) delete mode 100644 static/js/content-helper.js diff --git a/static/js/content-helper.js b/static/js/content-helper.js deleted file mode 100644 index 41c73864e6..0000000000 --- a/static/js/content-helper.js +++ /dev/null @@ -1,142 +0,0 @@ -/* global SITE_ORIGIN */ - -let lastDisplayClip; - -window.addEventListener( - "load", - function () { - window.parent.postMessage( - {type: "setHeight", height: document.documentElement.scrollHeight || document.body.scrollHeight}, - SITE_ORIGIN); - }, - false); - -window.addEventListener( - "message", - (m) => { - if (m.origin !== SITE_ORIGIN) { - console.warn("Content iframe received message from unexpected origin:", m.origin, "instead of", SITE_ORIGIN); - return; - } - let message = m.data; - let type = message.type; - if (! type) { - console.warn("Content iframe received message with no .type:", message); - return; - } - if (type === "displayClip") { - displayClip(message.clip); - } else if (type === "removeDisplayClip") { - lastDisplayClip = null; - removeDisplayClip(); - } else { - console.warn("Content iframe received message with unknown .type:", message); - } - } -); - -let highlightElement; - -function displayClip(clip) { - lastDisplayClip = clip; - let topLeft = null; - let bottomRight = null; - let loc = null; - let pos = { - top: 0, - bottom: 0, - left: 0, - right: 0 - }; - - if (clip.text) { - topLeft = findElement("#" + clip.text.location.selectionStart); - bottomRight = findElement("#" + clip.text.location.selectionEnd); - loc = { - topLeftOffset: {x: 0, y: 0}, - bottomRightOffset: {x: 0, y: 0} - }; - } else { - loc = clip.image.location; - pos = { - top: loc.top, - bottom: loc.bottom, - left: loc.left, - right: loc.right - }; - topLeft = findElement(loc.topLeftElement); - bottomRight = findElement(loc.bottomRightElement); - } - if (topLeft) { - let rect = topLeft.getBoundingClientRect(); - // FIXME: adjust using height/width - pos.top = rect.top + loc.topLeftOffset.y; - pos.left = rect.left + loc.topLeftOffset.x; - } - if (bottomRight) { - let rect = bottomRight.getBoundingClientRect(); - pos.bottom = rect.top + rect.height + loc.bottomRightOffset.y - loc.bottomRightOffset.height; - pos.right = rect.left + rect.width + loc.bottomRightOffset.x - loc.bottomRightOffset.width; - } - let bodyRect = document.body.getBoundingClientRect(); - pos.top -= bodyRect.top; - pos.bottom -= bodyRect.top; - pos.left -= bodyRect.left; - // FIXME: this doesn't seem to do the right thing, but I don't know why: - //pos.right -= bodyRect.left; - createHighlight(pos); - window.parent.postMessage({ - type: "scrollToMiddle", - position: pos - }, SITE_ORIGIN); -} - -function findElement(selector) { - return document.querySelector(selector); -} - -function createHighlight(pos) { - removeDisplayClip(); - highlightElement = document.createElement("div"); - highlightElement.className = "pageshot-clip-highlight"; - highlightElement.style.top = pos.top + "px"; - highlightElement.style.left = pos.left + "px"; - highlightElement.style.height = (pos.bottom - pos.top) + "px"; - highlightElement.style.width = (pos.right - pos.left) + "px"; - document.body.appendChild(highlightElement); -} - -function removeDisplayClip() { - if (highlightElement) { - highlightElement.parentNode.removeChild(highlightElement); - highlightElement = null; - } -} - -// Code snippet from https://developer.mozilla.org/en-US/docs/Web/Events/resize -(function() { - var throttle = function(type, name, obj) { - obj = obj || window; - var running = false; - var func = function() { - if (running) { - return; - } - running = true; - requestAnimationFrame(function() { - obj.dispatchEvent(new CustomEvent(name)); - running = false; - }); - }; - obj.addEventListener(type, func); - }; - /* init - you can init any event */ - throttle("resize", "optimizedResize"); -})(); - -// handle event -window.addEventListener("optimizedResize", function() { - if (lastDisplayClip) { - displayClip(lastDisplayClip); - } -}); From 2c9c64ccabd96657c899972ec502c1f6a6712ff3 Mon Sep 17 00:00:00 2001 From: Ian Bicking Date: Mon, 20 Mar 2017 16:34:01 -0500 Subject: [PATCH 21/40] Rename toolbar-pageshot-button metrics eventLabel to be toolbar-button --- addon/webextension/background/main.js | 2 +- docs/METRICS.md | 7 +++---- 2 files changed, 4 insertions(+), 5 deletions(-) diff --git a/addon/webextension/background/main.js b/addon/webextension/background/main.js index 179d08b503..932fd6b854 100644 --- a/addon/webextension/background/main.js +++ b/addon/webextension/background/main.js @@ -51,7 +51,7 @@ window.main = (function () { toggleSelector(tab) .then(active => { const event = active ? "start-shot" : "cancel-shot"; - sendEvent(event, "toolbar-pageshot-button"); + sendEvent(event, "toolbar-button"); })); } })); diff --git a/docs/METRICS.md b/docs/METRICS.md index 18b5810eef..0f42546fc0 100644 --- a/docs/METRICS.md +++ b/docs/METRICS.md @@ -77,7 +77,7 @@ Each item in these events requires: Event category: maps to the "source": `addon` or `web` Event action: what the event "does", such as `start-shot` (note that Save actually "takes" the shot, the focus should be on what happens as a result of interacting with the control) -Event label: exactly what control invoked the action, such as toolbar-pageshot-button. These are the "locations": +Event label: exactly what control invoked the action, such as toolbar-button. These are the "locations": * `toolbar`: the browser toolbar * `topbar`: the top bar on the page during selection @@ -116,7 +116,7 @@ The primary change was in `server/src/pages/shot/share-buttons.js` 1. ~~Start the browser `addon/open-browser/launch`~~ (removed for launch) 2. ~~Daily ping (attempt roughly every 24 hours) `addon/daily-ping`~~ (removed for launch) -1. [x] Toggle shot button on `addon/start-shot/toolbar-pageshot-button` +1. [x] Toggle shot button on `addon/start-shot/toolbar-button` (previous to 54 launch the label was `toolbar-pageshot-button`) 2. [ ] Use keyboard shortcut to start shot `addon/start-shot/keyboard-shortcut` (accel-alt-control-c) (FIXME: not yet implemented) 3. [x] Use the right-click context menu to start a shot `addon/start-shot/context-menu` 2. [x] Make a selection `addon/make-selection/selection-drag` with `cd2: {px width}, cd1: {px height}` @@ -141,7 +141,6 @@ The primary change was in `server/src/pages/shot/share-buttons.js` 6. [x] Click on "Save visible" `addon/capture-visible/selection-button` 7. [x] Click on "Save Full Page" `addon/capture-full-page/selection-button` 6. ~~Click My Shots button from error panel `addon/goto-myshots/error-panel`~~ -6. [ ] Click shot button while Page Shot is active `addon/aborted-start-shot/toolbar-pageshot-button` (FIXME: todo) 7. [x] Hit Escape (Cancel) `addon/cancel-shot/keyboard-escape` 8. [x] Hit Enter (Save) `addon/save-shot/keyboard-enter` 12. ~~Encounter an error saving the shot `addon/error/save-shot`~~ @@ -154,7 +153,7 @@ The primary change was in `server/src/pages/shot/share-buttons.js` 18. [ ] Hit shot button on any other non-http page `addon/start-shot-non-http/actual-scheme` (note: shooting still continues). Full event is something like `addon/start-shot-non-http/file` (or `about`, `view-source`, `data`) (FIXME: todo) 20. ~~Test pilot was present at install time `addon/test-pilot-installed`~~ 21. ~~Test pilot was not present at install time `addon/test-pilot-not-installed`~~ -99. Toggle shot button off `addon/cancel-shot/toolbar-pageshot-button` +99. Toggle shot button off `addon/cancel-shot/toolbar-button` ##### Internal add-on events From 0716727b011f4415bd54fec7eefea6310313aec2 Mon Sep 17 00:00:00 2001 From: Ian Bicking Date: Mon, 20 Mar 2017 16:35:17 -0500 Subject: [PATCH 22/40] Remove hidden install page that points to now-obsolete version of the add-on --- static/homepage/install.html | 18 ------------------ 1 file changed, 18 deletions(-) delete mode 100644 static/homepage/install.html diff --git a/static/homepage/install.html b/static/homepage/install.html deleted file mode 100644 index 084cfc50ee..0000000000 --- a/static/homepage/install.html +++ /dev/null @@ -1,18 +0,0 @@ - - - - Install Page Shot - - - -
- -

Page Shot

- Install -
- - From 0c780697439b3219a54c15b67cd7da0a8491472e Mon Sep 17 00:00:00 2001 From: Ian Bicking Date: Mon, 20 Mar 2017 16:40:35 -0500 Subject: [PATCH 23/40] Rename goto-pageshot metric to goto-homepage Leave historical references in place --- docs/METRICS.md | 4 ++-- server/src/pages/shot/view.js | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/docs/METRICS.md b/docs/METRICS.md index 0f42546fc0..2d07367a6e 100644 --- a/docs/METRICS.md +++ b/docs/METRICS.md @@ -195,7 +195,7 @@ These are events that an add-on user can encounter on a shot they own 27. [x] Copy with "rich copy", `web/share/rich-copy` 27. [x] Focus link field `web/share/focus-url` 28. [x] Cancel/close share `web/cancel-share` -29. [x] Visit Page Shot link from footer `web/goto-pageshot/footer` +29. [x] Visit Page Shot link from footer `web/goto-homepage/footer` (was eventAction `goto-pageshot` before 54 launch) 30. [x] Click "Copy Image Text" on the context menu `web/copy-image-text/context-menu` 32. [x] Click Feedback/mailto button `start-feedback/footer` 31. [x] Click on clip `web/goto-clip/content` @@ -220,7 +220,7 @@ These are events that an add-on user can encounter on a shot they own 2. [x] Click flag button `web/start-flag/navbar` 3. [x] Click Share (same as for owner, but with `share-non-owner` instead of `share-owner`, and `start-share-non-owner`) 4. [x] Visit original URL `web/goto-original-url/navbar` -5. [x] Click Page Shot link in header `web/goto-pageshot/navbar` +5. [x] Click Page Shot link in header `web/goto-homepage/navbar` (was `goto-pageshot` eventAction before 54 launch) 9. [x] Click on clip (already covered) 10. [x] Click on the "Get it here" (install Page Shot) banner: `web/click-install-banner` 11. [x] Click on the "Get Firefox now" (install Firefox) banner: `web/click-install-firefox`. Also note the link uses `?utm_source=pageshot.net&utm_medium=referral&utm_campaign=pageshot-acquisition` on the link. diff --git a/server/src/pages/shot/view.js b/server/src/pages/shot/view.js index b3c771b402..a37bdd905e 100644 --- a/server/src/pages/shot/view.js +++ b/server/src/pages/shot/view.js @@ -351,7 +351,7 @@ class Body extends React.Component { if (this.props.isOwner) { sendEvent("goto-myshots", "navbar", {useBeacon: true}); } else { - sendEvent("goto-pageshot", "navbar", {useBeacon: true}); + sendEvent("goto-homepage", "navbar", {useBeacon: true}); } // Note: we allow the default action to continue } From 80afe2140e3df7c663a3602e76f7663a9481d80c Mon Sep 17 00:00:00 2001 From: Ian Bicking Date: Mon, 20 Mar 2017 17:46:02 -0500 Subject: [PATCH 24/40] Remove help page that wasn't linked to --- static/homepage/help.html | 39 --------------------------------------- 1 file changed, 39 deletions(-) delete mode 100644 static/homepage/help.html diff --git a/static/homepage/help.html b/static/homepage/help.html deleted file mode 100644 index 1d662ddb9c..0000000000 --- a/static/homepage/help.html +++ /dev/null @@ -1,39 +0,0 @@ - - - - - - - Welcome to Page Shot - - - - - - - - -

- - Page Shot -

-
- Click the - - - button,
- highlight the purple mascot, - then save it! -
-
-
- Click the - - button to get started -
-
-
- Then click and drag your mouse around this guy -
- - From e96b86e5cbb8cf4ed15bd8777252546fdac9494c Mon Sep 17 00:00:00 2001 From: Ian Bicking Date: Mon, 20 Mar 2017 18:10:56 -0500 Subject: [PATCH 25/40] Rename readable/text versions of 'Page Shot' to be 'Firefox Screenshots' or 'Screenshots' --- CHANGELOG.md | 12 +++--- README.md | 8 ++-- addon/install.rdf.template | 2 +- addon/webextension/README.md | 2 +- addon/webextension/background/auth.js | 2 +- addon/webextension/manifest.json.template | 2 +- addon/webextension/selector/uicontrol.js | 2 +- bin/export_mc.py | 4 +- bin/load_test_exercise.py | 2 +- bin/release-version | 2 +- bin/run-addon | 8 ++-- bin/run-server | 6 +-- docs/METRICS.md | 28 +++++++------- docs/acceptance.md | 22 +++++------ docs/deployment.md | 6 +-- docs/error-handling.md | 6 +-- docs/export-to-firefox.md | 2 +- locales/en-US/webextension.properties | 14 +++---- package.json | 2 +- server/src/ab-tests.js | 4 +- server/src/config.js | 2 +- server/src/ga-activation.js | 2 +- server/src/pages/homepage/model.js | 2 +- server/src/pages/homepage/view.js | 6 +-- server/src/pages/leave-page-shot/view.js | 6 +-- server/src/pages/legal/view.js | 46 +++++++++++------------ server/src/pages/metrics/model.js | 4 +- server/src/pages/not-found/view.js | 2 +- server/src/pages/shot/view.js | 6 +-- server/src/pages/shotindex/view.js | 2 +- server/src/server.js | 6 +-- server/src/servershot.js | 2 +- server/views-docs.md | 2 +- static/homepage/install-test-local.html | 6 +-- test/test-ab-test.js | 2 +- test/test.js | 2 +- 36 files changed, 117 insertions(+), 117 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 730bdfbe1f..8f01ac521a 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -6,7 +6,7 @@ * Create A/B test for auto-opening the share panel. Fixes [#2079](https://github.com/mozilla-services/pageshot/issues/2079) [0187d31](https://github.com/mozilla-services/pageshot/commit/0187d31) * create FORCE_AB_TESTS to force-turn-on an A/B test in development. Fixes [#2108](https://github.com/mozilla-services/pageshot/issues/2108) [32df868](https://github.com/mozilla-services/pageshot/commit/32df868) -* Start [#2081](https://github.com/mozilla-services/pageshot/issues/2081), implement an A/B test of badging the Page Shot button until it is first clicked [c4c916b](https://github.com/mozilla-services/pageshot/commit/c4c916b), [319c312](https://github.com/mozilla-services/pageshot/commit/319c312) +* Start [#2081](https://github.com/mozilla-services/pageshot/issues/2081), implement an A/B test of badging the toolbar button until it is first clicked [c4c916b](https://github.com/mozilla-services/pageshot/commit/c4c916b), [319c312](https://github.com/mozilla-services/pageshot/commit/319c312) * Design and implement an A/B testing system. People are put into tests by the server at login time Tests may stick to the shots created when the test is in place, then viewers will be associated with that test. Tests each map to a GA field (cdX for some value of X). Fixes [#2077](https://github.com/mozilla-services/pageshot/issues/2077) [86c8663](https://github.com/mozilla-services/pageshot/commit/86c8663) * Add new database version (13) to save ab_tests in devices table [0a0a095](https://github.com/mozilla-services/pageshot/commit/0a0a095) @@ -68,7 +68,7 @@ * Add pixel dimensions when starting and dragging the selection. Fixes [#1848](https://github.com/mozilla-services/pageshot/issues/1848) [4915115](https://github.com/mozilla-services/pageshot/commit/4915115) * Change to `cursor: move` on the selection box. Fixes [#1768](https://github.com/mozilla-services/pageshot/issues/1768) [c5aa6ae](https://github.com/mozilla-services/pageshot/commit/c5aa6ae) -* Add *Create Page Shot* item in the context menu. Fixes [#1922](https://github.com/mozilla-services/pageshot/issues/1922) [c220524](https://github.com/mozilla-services/pageshot/commit/c220524) +* Add *Create ...* item in the context menu. Fixes [#1922](https://github.com/mozilla-services/pageshot/issues/1922) [c220524](https://github.com/mozilla-services/pageshot/commit/c220524) * Add paste instructions to notification popups. Fixes [#1776](https://github.com/mozilla-services/pageshot/issues/1776) [5659166](https://github.com/mozilla-services/pageshot/commit/5659166) * Render the selection interface in an iframe, so that it doesn't conflict or get affected by any styles in the document itself. Multiple commits: * Iframe sizing, [23dc2b4](https://github.com/mozilla-services/pageshot/commit/23dc2b4) @@ -227,8 +227,8 @@ A version released to improve some operational issues. * You can drag the selection * You can invert the selection when resizing * You can drag out a new selection over the old selection -* In some error conditions Page Shot would become unresponsive on a tab. -* Page Shot authentication could be lost (for instance with a cookie destroying add-on). We now attempt to re-login if we detect the cookies are gone. +* In some error conditions the tool would become unresponsive on a tab. +* Server authentication could be lost (for instance with a cookie destroying add-on). We now attempt to re-login if we detect the cookies are gone. ### Detailed product/UI changes @@ -266,7 +266,7 @@ A version released to improve some operational issues. * dragging in the background when there's already a selection will now create a new selection. Fixes [#1138](https://github.com/mozilla-services/pageshot/issues/1138) [45de849](https://github.com/mozilla-services/pageshot/commit/45de849) * allow moving the selection around. Fixes [#1628](https://github.com/mozilla-services/pageshot/issues/1628) [5faddf5](https://github.com/mozilla-services/pageshot/commit/5faddf5) -* Cleanup Shooter and the worker when the worker gets detached for some unknown reason; may avoid some problems where Page Shot hangs after an error [7793134](https://github.com/mozilla-services/pageshot/commit/7793134) +* Cleanup Shooter and the worker when the worker gets detached for some unknown reason; may avoid some problems where the tool hangs after an error [7793134](https://github.com/mozilla-services/pageshot/commit/7793134) * copy link on save, and put up a popup to notify the user about the copy action. Fixes [#1734](https://github.com/mozilla-services/pageshot/issues/1734) [accfe28](https://github.com/mozilla-services/pageshot/commit/accfe28) * allow view-source URLs. Fixes [#1720](https://github.com/mozilla-services/pageshot/issues/1720) [29efea9](https://github.com/mozilla-services/pageshot/commit/29efea9) @@ -297,7 +297,7 @@ A version released to improve some operational issues. * Get rid of unused controller on legal pages [0565da7](https://github.com/mozilla-services/pageshot/commit/0565da7) * Use template literals [d82dc4d](https://github.com/mozilla-services/pageshot/commit/d82dc4d) * put Raven activation into reactrender pages. Fixes [#1072](https://github.com/mozilla-services/pageshot/issues/1072) [895ca67](https://github.com/mozilla-services/pageshot/commit/895ca67) -* remove 'Leave page shot' link from pages when the +* remove 'Leave ...' link from pages when the user is not authenticated. Fixes [#1578](https://github.com/mozilla-services/pageshot/issues/1578) [62e68ed](https://github.com/mozilla-services/pageshot/commit/62e68ed) * Update all deps to latest. Fixes [#1703](https://github.com/mozilla-services/pageshot/issues/1703) [6a1b6cd](https://github.com/mozilla-services/pageshot/commit/6a1b6cd) * Put something in the logs when someone tries to upload a shot diff --git a/README.md b/README.md index 113fb045a0..2acff98788 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,4 @@ -## Page Shot +## Firefox Screenshots [![CircleCI Build Status](https://circleci.com/gh/mozilla-services/pageshot.svg?style=shield)](https://circleci.com/gh/mozilla-services/pageshot) [![Build Status](https://travis-ci.org/mozilla-services/pageshot.svg)](https://travis-ci.org/mozilla-services/pageshot) @@ -12,7 +12,7 @@ It is made up of both an add-on (using [WebExtensions](https://developer.mozilla Ian has been blogging about the [design, definition, and development process](http://www.ianbicking.org/tag/product-journal.html). -You can find more information about Page Shot at the Mozilla Wiki page: https://wiki.mozilla.org/Firefox/Page_Shot +You can find more information about Firefox Screenshots at the Mozilla Wiki page: https://wiki.mozilla.org/Firefox/Page_Shot ### Installation and Setup @@ -27,11 +27,11 @@ There are two scripts to run the server locally and develop the add-on: - `./bin/run-server` will run the server on `http://localhost:10080` and automatically restart if there are changes. - `./bin/run-addon` will build a few parts of the addon (into `addon/webextension/build/`) and start Firefox with the add-on installed. The add-on will be refreshed automatically as you change files. We recommend you open `about:debugging` to help debug the extension. - - `./bin/run-addon --bootstrap` will run the add-on using the [bootstrap](https://github.com/mozilla-services/pageshot/blob/master/addon/bootstrap.js) wrapper. This is how the add-on is run in Firefox, and provides some additional services, like Telemetry and migration. This does not support reloading, so if you aren't developing things involving the wrapper then you can run without `--bootstrap`. -- `./bin/run-addon --setup-profile` will setup a Firefox profile for your development; this way you can make persistent changes to the profile that you will use just for Page Shot development. (note: this will only look for the `firefox` commmand or Nightly, Developer Edition, Aurora editions on OSX) +- `./bin/run-addon --setup-profile` will setup a Firefox profile for your development; this way you can make persistent changes to the profile that you will use just for Screenshots development. (note: this will only look for the `firefox` commmand or Nightly, Developer Edition, Aurora editions on OSX) **If you want to develop the add-on but not the server** you can run `./bin/run-addon -s https://pageshot.dev.mozaws.net` -By default, Page Shot will connect to a Postgres database on localhost:5432. To change which database and user it connects to set/export the environmental variables: `RDS_USERNAME`, `RDS_PASSWORD`, and `RDS_HOSTNAME` +By default, Screenshots will connect to a Postgres database on localhost:5432. To change which database and user it connects to set/export the environmental variables: `RDS_USERNAME`, `RDS_PASSWORD`, and `RDS_HOSTNAME` The server will automatically setup the tables in your database, and keep them up to date over time (using [pg-patcher](https://github.com/chilts/pg-patcher/)). diff --git a/addon/install.rdf.template b/addon/install.rdf.template index 4b16902276..4d8fdb32d1 100644 --- a/addon/install.rdf.template +++ b/addon/install.rdf.template @@ -3,7 +3,7 @@ xmlns:em="http://www.mozilla.org/2004/em-rdf#"> pageshot@mozilla.org - Page Shot + Firefox Screenshots {ec8030f7-c20a-464f-9b0e-13a3a9e97384} diff --git a/addon/webextension/README.md b/addon/webextension/README.md index dd2780ef4f..59352e76f7 100644 --- a/addon/webextension/README.md +++ b/addon/webextension/README.md @@ -6,7 +6,7 @@ This contains all the files for the WebExtension. Most files are not "built", b - There are three workers/processes: 1. The background page, in `background/` 2. The selector content worker, in `selector/` - 3. The site helper that communicates with the Page Shot website, in `site-helper.js` + 3. The site helper that communicates with the Firefox Screenshots website, in `site-helper.js` - The background process is loaded according to a list in `manifest.json.template` – if there are load order dependencies, they must be manually managed with that list - The selector content worker is loaded with a list in `background/selectorLoader.js`. Again this must be manually maintained. - The site helper worker is loaded via a separate list in `manifest.json.template` diff --git a/addon/webextension/background/auth.js b/addon/webextension/background/auth.js index a4896edaa2..69d86e4915 100644 --- a/addon/webextension/background/auth.js +++ b/addon/webextension/background/auth.js @@ -80,7 +80,7 @@ window.auth = (function () { reject(error); } else { initialized = true; - console.info("Page Shot logged in"); + console.info("Screenshots logged in"); analytics.sendEvent("login"); saveAuthInfo(JSON.parse(req.responseText)); resolve(); diff --git a/addon/webextension/manifest.json.template b/addon/webextension/manifest.json.template index c765e52bd9..503ec7b4b3 100644 --- a/addon/webextension/manifest.json.template +++ b/addon/webextension/manifest.json.template @@ -1,6 +1,6 @@ { "manifest_version": 2, - "name": "Page Shot", + "name": "Firefox Screenshots", "version": "__VERSION__", "description": "__MSG_addonDescription__", "author": "__MSG_addonAuthorsList__", diff --git a/addon/webextension/selector/uicontrol.js b/addon/webextension/selector/uicontrol.js index ae698c5789..951dbf7747 100644 --- a/addon/webextension/selector/uicontrol.js +++ b/addon/webextension/selector/uicontrol.js @@ -362,7 +362,7 @@ window.uicontrol = (function () { ui.PixelDimensions.display(event.pageX, event.pageY, event.pageX, event.pageY); if (event.target.classList && (! event.target.classList.contains("preview-overlay"))) { - // User is hovering over a Page Shot button or control + // User is hovering over a toolbar button or control autoDetectRect = null; ui.HoverBox.hide(); return; diff --git a/bin/export_mc.py b/bin/export_mc.py index 90edce5302..83f7b5d294 100755 --- a/bin/export_mc.py +++ b/bin/export_mc.py @@ -141,7 +141,7 @@ def main(server, mcRepoPath, mcSubDir, mcBranch, mcBaseCommit, commitMessage, if __name__ == "__main__": parser = argparse.ArgumentParser( - description="Pageshot script for managing export to mozilla-central") + description="Screenshots script for managing export to mozilla-central") parser.add_argument("-s", "--server", default="prod", help="[local|dev|stage|prod]: Which server the code should use.") @@ -167,7 +167,7 @@ def main(server, mcRepoPath, mcSubDir, mcBranch, mcBaseCommit, commitMessage, help="Specify to build locally after export.") parser.add_argument("--run-tests", action="store_true", - help="Whether or not to run PageShot tests after the build.") + help="Whether or not to run Screenshots tests after the build.") parser.add_argument("--push-to-try", action="store_true", help="Specify to push the result to the try server.") diff --git a/bin/load_test_exercise.py b/bin/load_test_exercise.py index c2d575a9fb..e426e90fd8 100755 --- a/bin/load_test_exercise.py +++ b/bin/load_test_exercise.py @@ -9,7 +9,7 @@ import random import json -parser = argparse.ArgumentParser(description='Run some tests on a Page Shot server') +parser = argparse.ArgumentParser(description='Run some tests on a Screenshots server') parser.add_argument('url', metavar='URL', type=str, nargs=1, help='URL of the backend to test') diff --git a/bin/release-version b/bin/release-version index f3f05edf5d..7ed9988180 100755 --- a/bin/release-version +++ b/bin/release-version @@ -77,4 +77,4 @@ case "$channel" in exit 2 esac -which growlnotify > /dev/null && growlnotify -m "Page Shot Deploy/container for ${channel} completed" +which growlnotify > /dev/null && growlnotify -m "Screenshots Deploy/container for ${channel} completed" diff --git a/bin/run-addon b/bin/run-addon index f47f86b65b..230a5c9344 100755 --- a/bin/run-addon +++ b/bin/run-addon @@ -111,8 +111,8 @@ if [[ -n "$setup_profile" ]] ; then $open -n --args -new-instance -no-remote -profile "$profile_dir" else echo "Creating profile in $profile_dir running:" - echo " " $open -n --args -new-instance -no-remote -CreateProfile "PageShotTestProfile $profile_dir" - $open -n --args -new-instance -no-remote -CreateProfile "PageShotTestProfile $profile_dir" + echo " " $open -n --args -new-instance -no-remote -CreateProfile "ScreenshotsTestProfile $profile_dir" + $open -n --args -new-instance -no-remote -CreateProfile "ScreenshotsTestProfile $profile_dir" echo "Opening profile running:" echo " " $open -n --args -new-instance -no-remote -profile "$profile_dir" -url http://localhost:10080 $open -n --args -new-instance -no-remote -profile "$profile_dir" -url http://localhost:10080 @@ -149,14 +149,14 @@ run_webext() { run_nodemon echo "Running Firefox. You might want to go to:" echo " about:debugging" - echo "and Debug Page Shot" + echo "and Debug Firefox Screenshots" $webext run --firefox "$binary" $profile_option --source-dir ./addon/webextension/ } run_jpm() { echo "Running Firefox. Reloading with jpm *will not* happen" - echo "If the Page Shot icon doesn't show up go to:" + echo "If the Screenshots icon doesn't show up go to:" echo " Tools > Add-ons > Extensions and look for an error loading the add-on" cd addon $jpm run $bootstrap_profile_option -b "$binary" --binary-args -jsconsole diff --git a/bin/run-server b/bin/run-server index f0b05e4e4f..976ea66966 100755 --- a/bin/run-server +++ b/bin/run-server @@ -15,15 +15,15 @@ fi run () { if [[ -n "$restart" ]] ; then - notify "Page Shot Server build started." + notify "Firefox Screenshots server build started." fi if [ -d build ] ; then # This is to remove empty files that might have resulted from a syntax error: find build/ -size 0 -exec rm {} \; fi - make server || (notify "Page Shot Server build FAILED" ; exit 2) + make server || (notify "Firefox Screenshots server build FAILED" ; exit 2) if [[ -n "$restart" ]] ; then - notify "Page Shot Server build finished." + notify "Firefox Screenshots server build finished." fi node -e 'require("babel-polyfill"); require("./build/server/server");' } diff --git a/docs/METRICS.md b/docs/METRICS.md index 2d07367a6e..b9ad270694 100644 --- a/docs/METRICS.md +++ b/docs/METRICS.md @@ -1,14 +1,14 @@ -## Page Shot Metrics +## Firefox Screenshots Metrics -A summary of the metrics Page Shot will record, and what we're looking for in those metrics. +A summary of the metrics Screenshots will record, and what we're looking for in those metrics. ### Opt-out -The add-on tracks the Telemetry opt-out preference (`toolkit.telemetry.enabled`) each time the user presses the Page Shot button. If this preference is false, or if there is any issue trying to fetch the preference, then no data is sent to the Page Shot server. +The add-on tracks the Telemetry opt-out preference (`toolkit.telemetry.enabled`) each time the user presses the Screenshots button. If this preference is false, or if there is any issue trying to fetch the preference, then no data is sent to the Screenshots server. ### Key Metrics -Key metrics of Page Shot are fairly simple: +Key metrics of Screenshots are fairly simple: #### Do people continue to create shots? @@ -53,19 +53,19 @@ We can look at the share event in GA, and we can look at non-owner visits (`web/ This is primarily a count of `web/visit/owner`. The tool always opens the page once, and will fire `web/visit/owner-first` on that first visit. -#### Do people who view a shot, install Page Shot? +#### Do people who view a shot, install Firefox Screenshots? We will be tracking some events under `goto-pageshot` that would lead people from shot pages to a place where they could load the page. Then we track clicking the install link itself, which GA reporting should be able to connect to the original `goto-pageshot` event. We can't detect how often that install click leads to an actual install. #### Summary -Continuing to create shots indicates overall value to the user. Sharing and revisiting confirm that the value is actually obtained (it's possible to fantasize that you *would* find value in a shot, while never actually realizing that value). Lastly, evidence that people find Page Shot attractive when they see a shot, or that people would refer each other to Page Shot, indicates potential for organic growth. +Continuing to create shots indicates overall value to the user. Sharing and revisiting confirm that the value is actually obtained (it's possible to fantasize that you *would* find value in a shot, while never actually realizing that value). Lastly, evidence that people find Screenshots attractive when they see a shot, or that people would refer each other to Screenshots, indicates potential for organic growth. We do not collect Net Promoter Score. ### Usage Metrics -This information is intended to help us make Page Shot better. +This information is intended to help us make Screenshots better. We record an event stream of interaction with the add-on and website. The events: @@ -137,7 +137,7 @@ The primary change was in `server/src/pages/shot/share-buttons.js` 7. [ ] Cancel because the tab is navigated (such as entering something in the URL bar) `addon/cancel-shot/tab-load` (FIXME: need to track) 8. [ ] Cancel because the tab is reloaded `addon/cancel-shot/tab-reload` (FIXME: need to track) 5. [x] Click My Shots `addon/goto-myshots/selection-button` -6. [x] Go to My Shots by hitting the Page Shot button on a about:newtab page `addon/goto-myshots/about-newtab` +6. [x] Go to My Shots by hitting the Screenshots button on a about:newtab page `addon/goto-myshots/about-newtab` 6. [x] Click on "Save visible" `addon/capture-visible/selection-button` 7. [x] Click on "Save Full Page" `addon/capture-full-page/selection-button` 6. ~~Click My Shots button from error panel `addon/goto-myshots/error-panel`~~ @@ -195,7 +195,7 @@ These are events that an add-on user can encounter on a shot they own 27. [x] Copy with "rich copy", `web/share/rich-copy` 27. [x] Focus link field `web/share/focus-url` 28. [x] Cancel/close share `web/cancel-share` -29. [x] Visit Page Shot link from footer `web/goto-homepage/footer` (was eventAction `goto-pageshot` before 54 launch) +29. [x] Visit Screenshots link from footer `web/goto-homepage/footer` (was eventAction `goto-pageshot` before 54 launch) 30. [x] Click "Copy Image Text" on the context menu `web/copy-image-text/context-menu` 32. [x] Click Feedback/mailto button `start-feedback/footer` 31. [x] Click on clip `web/goto-clip/content` @@ -215,14 +215,14 @@ These are events that an add-on user can encounter on a shot they own #### Non-owner web visit 1. [x] Visit the page, `web/visit/non-owner` -2. [x] Visit an image directly, when the image isn't embedded directly in a Page Shot shot page, `web/visit/direct-view` +2. [x] Visit an image directly, when the image isn't embedded directly in a Screenshots shot page, `web/visit/direct-view` 3. [x] View an image directly, when the image is being shown as part of a Facebook/Twitter style preview (the og:image or twitter:image), `web/visit/direct-view-embedded` 2. [x] Click flag button `web/start-flag/navbar` 3. [x] Click Share (same as for owner, but with `share-non-owner` instead of `share-owner`, and `start-share-non-owner`) 4. [x] Visit original URL `web/goto-original-url/navbar` -5. [x] Click Page Shot link in header `web/goto-homepage/navbar` (was `goto-pageshot` eventAction before 54 launch) +5. [x] Click Screenshots link in header `web/goto-homepage/navbar` (was `goto-pageshot` eventAction before 54 launch) 9. [x] Click on clip (already covered) -10. [x] Click on the "Get it here" (install Page Shot) banner: `web/click-install-banner` +10. [x] Click on the "Get it here" (install Screenshots) banner: `web/click-install-banner` 11. [x] Click on the "Get Firefox now" (install Firefox) banner: `web/click-install-firefox`. Also note the link uses `?utm_source=pageshot.net&utm_medium=referral&utm_campaign=pageshot-acquisition` on the link. #### Server events @@ -238,7 +238,7 @@ These are events that an add-on user can encounter on a shot they own #### General Google Analytics information -This is stuff we get from including ga.js on Page Shot pages. +This is stuff we get from including ga.js on Screenshots pages. 1. Browser type 2. Location @@ -251,7 +251,7 @@ This is stuff we get from including ga.js on Page Shot pages. ### Database Metrics -We have a pretty rich database in Page Shot, and we can do all kinds of queries on the database. These might include: +We have a pretty rich database in Screenshots, and we can do all kinds of queries on the database. These might include: 1. Look at cohorts of individuals, reviewing their shot creation patterns 2. How many people make a couple shots? How many make a lot of shots? diff --git a/docs/acceptance.md b/docs/acceptance.md index 324c097416..f6f4e46fa6 100644 --- a/docs/acceptance.md +++ b/docs/acceptance.md @@ -1,4 +1,4 @@ -# Page Shot UX and Measurements Acceptance Criteria +# Firefox Screenshots UX and Measurements Acceptance Criteria This document is intended to be used as comprehensive list of all changes to UI and metrics required for launch. Issues will be filed from this list and @@ -46,14 +46,14 @@ correlate with issues on a 1:1 basis. - [ ] it should include all current controls with the share panel minimized by default ## Non-Owner Shot Detail Page UI (SERVER) - - [ ] It should have three layout options that promote Page Shot for non-owner views *NEW FEATURE* + - [ ] It should have three layout options that promote Firefox Screenshots for non-owner views *NEW FEATURE* - [ ] Top banner - [ ] Side banner - [ ] Bottom banner - [ ] It should provide context specific messaging for desktop browsers - [ ] It should provide context specific messaging for non-ff mobile browsers - [ ] It should provide context specific messaging for mobile-ff browsers - - [ ] It should include Firefox + Page Shot branding + - [ ] It should include Firefox + Screenshots branding - [ ] It should not have flagging UI in the nav bar - [ ] It should have flagging UI in the footer @@ -61,21 +61,21 @@ correlate with issues on a 1:1 basis. - [ ] It should match the final spec provided by the UX team ## Non-Owner Specific Expired Page UI -- [ ] It should include promotional materials describing the utility of Page Shot and link to the landing page +- [ ] It should include promotional materials describing the utility of Firefox Screenshots and link to the landing page ## Landing Page UI [#2310](https://github.com/mozilla-services/pageshot/issues/2310) - [ ] It should match the final spec provided by the UX team -- [ ] It should describe the value proposition of Page Shot -- [ ] It should specify that Page Shot is currently only available for Firefox on Desktop for non-FF users -- [ ] It should specify that Page Shot is ‘Coming Soon’ for Chrome users +- [ ] It should describe the value proposition of Firefox Screenshots +- [ ] It should specify that Firefox Screenshots is currently only available for Firefox on Desktop for non-FF users +- [ ] It should specify that Firefox Screenshots is ‘Coming Soon’ for Chrome users - [ ] It should specify for users of older versions of Firefox that they simply need to update Firefox to use it - [ ] It should accomodate different messaging based on state of phased roll out - [ ] *STRETCH:* it should let users of Firefox 54 + trigger the add-on onboarding flow from the site ## Onboarding UI [#2307](https://github.com/mozilla-services/pageshot/issues/2307) - [ ] It should match the final spec provided by the UX team -- [ ] It should proceed stepwise to explain the basics of the page shot feature -- [ ] It should initially suggest itself by adding a page shot icon to the tool bar and badging it +- [ ] It should proceed stepwise to explain the basics of the Screenshots feature +- [ ] It should initially suggest itself by adding a Screenshots icon to the tool bar and badging it - [ ] *STRETCH* If a user has not engaged with the badged toolbar icon in three weeks, we should pop a tab or trigger a doorhanger asking the user if they would like to learn about the new feature # Measurements & Dashboards @@ -98,13 +98,13 @@ correlate with issues on a 1:1 basis. ## Dashboards - [ ] It should have a set of dashboards that demonstrably help us to reason about the health and direction of the product -- [ ] It should have dashboards reflecting Page Shot in FF KPIs (Telemetry Derived) +- [ ] It should have dashboards reflecting Screenshots in FF KPIs (Telemetry Derived) - [ ] It should have a dashboard displaying time spent in browser (c/f topline FF goal) - [ ] It should have a dashboard displaying page views in browser (c/f topline FF goal) - [ ] It should have a dashboard displaying browser cohort retention (based on standard engagement metric common to all Telemetry) - [ ] *STRETCH* Confirm exact measures/definitions with *gfritzsche* - [ ] It should have a dashboard displaying browser cohort retention (based on standard engagement metric common to all Telemetry) -- [ ] It should have dashboards reflecting Page Shot Product KPIS (GA + Server Metrics) +- [ ] It should have dashboards reflecting Screenshots Product KPIS (GA + Server Metrics) - [ ] It should have a cohort retention table based on the act of taking a shot (download or upload) - [ ] It should have a dashboard displaying non-owner views and embedded views - [ ] It should have a dashboard displaying download and uploads diff --git a/docs/deployment.md b/docs/deployment.md index 54166877d7..a9c2c25be3 100644 --- a/docs/deployment.md +++ b/docs/deployment.md @@ -1,4 +1,4 @@ -This document details the process we use to deploy Page Shot to our stage and production environments. +This document details the process we use to deploy Firefox Screenshots to our stage and production environments. ## Overview of schedule ## @@ -73,7 +73,7 @@ Any issues should be reported in the deployment bug. If no issues are found, Softvision will note in the bug. -**Page Shot team is still responsible for final approval for push to production.** +**The Screenshots team is still responsible for final approval for push to production.** On the following Monday, during our checkin, Softvision will give us an update on status of stage. @@ -97,7 +97,7 @@ We'll target Wednesday 8AM pacific time for deployment. Softvision will verify production for us, and report any bugs on Wednesday. -Once we have verified production, update the Page Shot GA account with an annotation including sprint information. Example: "1.0.1 release" Oct. 25th. +Once we have verified production, update the Screenshots GA account with an annotation including sprint information. Example: "1.0.1 release" Oct. 25th. Close deployment issue, and give it a `qa:verified` label. diff --git a/docs/error-handling.md b/docs/error-handling.md index be561daf50..118c6314c2 100644 --- a/docs/error-handling.md +++ b/docs/error-handling.md @@ -1,6 +1,6 @@ # Error Handling -In Page Shot we try to capture all unexpected failures for the purpose of reporting (and hopefully for fixing!) +In Screenshots we try to capture all unexpected failures for the purpose of reporting (and hopefully for fixing!) ## Catching @@ -9,9 +9,9 @@ To do this we have to wrap anything that *won't* report the error. That means: * Any callbacks or event listeners * Any promises that aren't returned and where there's not another explicit `.catch()` handler -Not everything has to be wrapped! You can assume that any function you write in Page Shot will normally be called by another Page Shot function, and it's the caller's responsibility to catch an exception. Similarly if you return a Promise, it is the caller's responsibility to catch errors from the Promise. +Not everything has to be wrapped! You can assume that any function you write in Screenshots will normally be called by another Screenshots function, and it's the caller's responsibility to catch an exception. Similarly if you return a Promise, it is the caller's responsibility to catch errors from the Promise. -*At the point* where you pass a Page Shot function to some code that will call the function, but *doesn't* know how to report errors, then you have to wrap that function. Also, if you know a promise won't be returned and will be thrown away after it completes, you must wrap that promise. +*At the point* where you pass a Screenshots function to some code that will call the function, but *doesn't* know how to report errors (such as adding an event listener), then you have to wrap that function. Also, if you know a promise won't be returned and will be thrown away after it completes, you must wrap that promise. Also, if there are recoverable but unexpected errors you can report an error explicitly. diff --git a/docs/export-to-firefox.md b/docs/export-to-firefox.md index 391c8361ae..1b9b3a3ed0 100644 --- a/docs/export-to-firefox.md +++ b/docs/export-to-firefox.md @@ -1,6 +1,6 @@ # Exporting to Firefox -Page Shot is developed in GitHub, but on each release we export into the Firefox +Firefox Screenshots is developed in GitHub, but on each release we export into the Firefox source tree. The process of exporting will checkout the default branch, and then create a new diff --git a/locales/en-US/webextension.properties b/locales/en-US/webextension.properties index c350a77cf7..804ab77927 100644 --- a/locales/en-US/webextension.properties +++ b/locales/en-US/webextension.properties @@ -1,7 +1,7 @@ -addonDescription = Page Shot takes clips and screenshots from pages, and can save a permanent copy of a page. +addonDescription = Firefox Screenshots takes clips and screenshots from pages, and can save a permanent copy of a page. addonAuthorsList = Ian Bicking, Donovan Preston, and Bram Pitoyo toolbarButtonLabel = Take a shot -contextMenuLabel = Create Page Shot +contextMenuLabel = Create screenshot myShotsLink = My Shots screenshotInstructions = Drag or click on the page to select a region. Press ESC to cancel. saveScreenshotSelectedArea = Save @@ -15,14 +15,14 @@ notificationLinkCopiedTitle = Link Copied # modifier key used in the shortcut (do not translate it): for example, Ctrl-V # on Windows systems. notificationLinkCopiedDetails = The link to your shot has been copied to the clipboard. Press {meta_key}-V to paste. -requestErrorTitle = Page Shot is out of order. +requestErrorTitle = Firefox Screenshots is out of order. requestErrorDetails = Your shot was not saved. We apologize for the inconvenience. Try again soon. -connectionErrorTitle = Cannot connect to the Page Shot server. +connectionErrorTitle = Cannot connect to the Firefox Screenshots server. connectionErrorDetails = There may be a problem with the service or with your network connection. loginErrorDetails = Your shot was not saved. There was an error authenticating with the server. loginConnectionErrorDetails = There may be a problem with the service or your network connection. unshootablePageErrorTitle = Page cannot be screenshotted. -unshootablePageErrorDetails = This is not a normal web page, and Page Shot cannot capture screenshots from it. -selfScreenshotErrorTitle = You can’t take a shot of a Page Shot page! -genericErrorTitle = Page Shot went haywire. +unshootablePageErrorDetails = This is not a normal web page, and Firefox cannot capture screenshots from it. +selfScreenshotErrorTitle = You can’t take a shot of a Firefox Screenshots page! +genericErrorTitle = Firefox Screenshots went haywire. genericErrorDetails = Try again or take a shot on another page? diff --git a/package.json b/package.json index 5cf91c9210..5d9e241c94 100644 --- a/package.json +++ b/package.json @@ -1,5 +1,5 @@ { - "name": "pageshot", + "name": "firefox-screenshots", "description": "An experiment in creating better shareable versions of content.", "version": "5.2.0", "author": "Mozilla (https://mozilla.org/)", diff --git a/server/src/ab-tests.js b/server/src/ab-tests.js index 07eefec3b7..15909a9191 100644 --- a/server/src/ab-tests.js +++ b/server/src/ab-tests.js @@ -1,7 +1,7 @@ // Note: these get turned into Test objects: let allTests = { highlightButtonOnInstall: { - description: "Highlight the Page Shot button when Page Shot is installed", + description: "Highlight the toolbar button when extension is installed", gaField: "cd3", version: 1, exclude: ["styleMyShotsButton", "autoOpenSharePanel"], @@ -53,7 +53,7 @@ let allTests = { ] }, highlightButtonOnInstall: { - description: "Highlight the Page Shot button when Page Shot is installed", + description: "Highlight the toolbar button when extension is installed", gaField: "cd5", version: 1, exclude: ["autoOpenSharePanel", "myShotsDisplay"], diff --git a/server/src/config.js b/server/src/config.js index 3337206e04..97db14bea6 100644 --- a/server/src/config.js +++ b/server/src/config.js @@ -8,7 +8,7 @@ envc({booleans: true}); var conf = convict({ port: { - doc: "The Page Shot server port", + doc: "The Screenshots server port", format: "port", default: 10080, env: "PORT", diff --git a/server/src/ga-activation.js b/server/src/ga-activation.js index bc868b853f..190678cae6 100644 --- a/server/src/ga-activation.js +++ b/server/src/ga-activation.js @@ -1,4 +1,4 @@ -/* Code to create the Google Analytics code for a Page Shot page. +/* Code to create the Google Analytics code for a Firefox Screenshots page. Stubs out ga() if no gaId is configured Disables analytics if Do-Not-Track is set Hashes page names diff --git a/server/src/pages/homepage/model.js b/server/src/pages/homepage/model.js index 1b6bcce5dd..eefe60e29c 100644 --- a/server/src/pages/homepage/model.js +++ b/server/src/pages/homepage/model.js @@ -1,6 +1,6 @@ exports.createModel = function (req) { let model = { - title: "Page Shot, a screenshot tool for Firefox", + title: "Firefox Screenshots", showMyShots: !!req.deviceId }; return model; diff --git a/server/src/pages/homepage/view.js b/server/src/pages/homepage/view.js index 7f8e53379b..29ebd99555 100644 --- a/server/src/pages/homepage/view.js +++ b/server/src/pages/homepage/view.js @@ -10,7 +10,7 @@ class Head extends React.Component { - + @@ -47,8 +47,8 @@ class Body extends React.Component {
-

Welcome to Page Shot

- Install Page Shot with Firefox Test Pilot +

Welcome to Firefox Screenshots

+ Install Screenshots with Firefox Test Pilot { myShots }
diff --git a/server/src/pages/leave-page-shot/view.js b/server/src/pages/leave-page-shot/view.js index f194e3ddf1..2e62f07ec8 100644 --- a/server/src/pages/leave-page-shot/view.js +++ b/server/src/pages/leave-page-shot/view.js @@ -28,7 +28,7 @@ class Body extends React.Component {
- This will permanently erase all of your Page Shot data. + This will permanently erase all of your Firefox Screenshots data.