From da57e0f89e1dad89e2221f2f232528ef5cbd7ba2 Mon Sep 17 00:00:00 2001 From: Julian Viereck Date: Tue, 11 Sep 2012 09:30:44 -0700 Subject: [PATCH 01/17] Julian's html-search-bar work --- web/viewer.css | 52 ++++- web/viewer.html | 13 +- web/viewer.js | 563 ++++++++++++++++++++++++++++++++++++++++++++++-- 3 files changed, 611 insertions(+), 17 deletions(-) diff --git a/web/viewer.css b/web/viewer.css index 0f615094a..caf3a09f1 100644 --- a/web/viewer.css +++ b/web/viewer.css @@ -245,7 +245,7 @@ html[dir='rtl'] #sidebarContent { 0 1px 1px hsla(0,0%,0%,.1); } -#toolbarViewer { +#toolbarViewer, .findbar { position: relative; height: 32px; background-image: url(images/texture.png), @@ -265,6 +265,32 @@ html[dir='rtl'] #sidebarContent { 0 1px 0 hsla(0,0%,0%,.15), 0 1px 1px hsla(0,0%,0%,.1); } + +.findbar { + top: 40px; + left: 40px; + position: absolute; + z-index: 100; + height: 20px; + + min-width: 16px; + padding: 3px 6px 3px 6px; + margin: 4px 2px 4px 0; + border: 1px solid transparent; + border-radius: 2px; + color: hsl(0,0%,85%); + font-size: 12px; + line-height: 14px; + text-align: left; + -webkit-user-select:none; + -moz-user-select:none; + cursor: default; +} + +.notFound { + background-color: rgb(255, 137, 153); +} + html[dir='ltr'] #toolbarViewerLeft { margin-left: -1px; } @@ -1069,6 +1095,30 @@ canvas { white-space:pre; } +.textLayer .highlight { + margin: -1px; + padding: 1px; + + background-color: rgba(0, 137, 26, 0.2); + border-radius: 4px; +} + +.textLayer .highlight.begin { + border-radius: 4px 0px 0px 4px; +} + +.textLayer .highlight.end { + border-radius: 0px 4px 4px 0px; +} + +.textLayer .highlight.middle { + border-radius: 0px; +} + +.textLayer .highlight.selected { + background-color: rgba(255, 0, 0, 0.2); +} + /* TODO: file FF bug to support ::-moz-selection:window-inactive so we can override the opaque grey background when the window is inactive; see https://bugzilla.mozilla.org/show_bug.cgi?id=706209 */ diff --git a/web/viewer.html b/web/viewer.html index 70cd8cdb0..0ee6313a6 100644 --- a/web/viewer.html +++ b/web/viewer.html @@ -108,9 +108,20 @@ limitations under the License.
+
-
-
@@ -97,12 +97,12 @@ limitations under the License.
- diff --git a/web/viewer.js b/web/viewer.js index aa91f5da0..f7ed8a7aa 100644 --- a/web/viewer.js +++ b/web/viewer.js @@ -211,7 +211,7 @@ var currentPageNumber = 1; var PDFFindController = { startedTextExtraction: false, - // If active, search resulsts will be highlighted. + // If active, find results will be highlighted. active: false, // Stores the text for each page. @@ -244,7 +244,7 @@ var PDFFindController = { }, calcFindMatch: function(pageContent) { - // TODO: Handle the other search options here as well. + // TODO: Handle the other find options here as well. var query = this.state.query; var queryLen = query.length; @@ -274,7 +274,7 @@ var PDFFindController = { function extractPageText(pageIndex) { PDFView.pages[pageIndex].getTextContent().then( function textContentResolved(data) { - // Bulid the search string. + // Build the find string. var bidiTexts = data.bidiTexts; var str = ''; @@ -434,7 +434,7 @@ var PDFFindBar = { initialize: function() { this.bar = document.getElementById('findbar'); - this.toggleButton = document.getElementById('viewSearch'); + this.toggleButton = document.getElementById('viewFind'); this.findField = document.getElementById('findInput'); this.highlightAll = document.getElementById('findHighlightAll'); this.caseSensitive = document.getElementById('findMatchCase'); @@ -1224,39 +1224,39 @@ var PDFView = { return true; }, - search: function pdfViewStartSearch() { - // Limit this function to run every ms. - var SEARCH_TIMEOUT = 250; - var lastSearch = this.lastSearch; + find: function pdfViewStartFind() { + // Limit this function to run every ms. + var FIND_TIMEOUT = 250; + var lastFind = this.lastFind; var now = Date.now(); - if (lastSearch && (now - lastSearch) < SEARCH_TIMEOUT) { - if (!this.searchTimer) { - this.searchTimer = setTimeout(function resumeSearch() { - PDFView.search(); + if (lastFind && (now - lastFind) < FIND_TIMEOUT) { + if (!this.findTimer) { + this.findTimer = setTimeout(function resumeFind() { + PDFView.find(); }, - SEARCH_TIMEOUT - (now - lastSearch) + FIND_TIMEOUT - (now - lastFind) ); } return; } - this.searchTimer = null; - this.lastSearch = now; + this.FindTimer = null; + this.lastFind = now; function bindLink(link, pageNumber) { link.href = '#' + pageNumber; - link.onclick = function searchBindLink() { + link.onclick = function findBindLink() { PDFView.page = pageNumber; return false; }; } - var searchResults = document.getElementById('searchResults'); + var findResults = document.getElementById('findResults'); - var searchTermsInput = document.getElementById('searchTermsInput'); - searchResults.removeAttribute('hidden'); - searchResults.textContent = ''; + var findTermsInput = document.getElementById('findTermsInput'); + findResults.removeAttribute('hidden'); + findResults.textContent = ''; - var terms = searchTermsInput.value; + var terms = findTermsInput.value; if (!terms) return; @@ -1276,17 +1276,17 @@ var PDFView = { var link = document.createElement('a'); bindLink(link, pageNumber); link.textContent = 'Page ' + pageNumber + ': ' + textSample; - searchResults.appendChild(link); + findResults.appendChild(link); pageFound = true; } if (!pageFound) { - searchResults.textContent = ''; + findResults.textContent = ''; var noResults = document.createElement('div'); noResults.classList.add('noResults'); - noResults.textContent = mozL10n.get('search_terms_not_found', null, + noResults.textContent = mozL10n.get('find_terms_not_found', null, '(Not found)'); - searchResults.appendChild(noResults); + findResults.appendChild(noResults); } }, @@ -1331,20 +1331,20 @@ var PDFView = { switchSidebarView: function pdfViewSwitchSidebarView(view) { var thumbsView = document.getElementById('thumbnailView'); var outlineView = document.getElementById('outlineView'); - var searchView = document.getElementById('searchView'); + var findView = document.getElementById('findView'); var thumbsButton = document.getElementById('viewThumbnail'); var outlineButton = document.getElementById('viewOutline'); - var searchButton = document.getElementById('viewSearch'); + var findButton = document.getElementById('viewFind'); switch (view) { case 'thumbs': thumbsButton.classList.add('toggled'); outlineButton.classList.remove('toggled'); - searchButton.classList.remove('toggled'); + findButton.classList.remove('toggled'); thumbsView.classList.remove('hidden'); outlineView.classList.add('hidden'); - searchView.classList.add('hidden'); + findView.classList.add('hidden'); PDFView.renderHighestPriority(); break; @@ -1352,25 +1352,25 @@ var PDFView = { case 'outline': thumbsButton.classList.remove('toggled'); outlineButton.classList.add('toggled'); - searchButton.classList.remove('toggled'); + findButton.classList.remove('toggled'); thumbsView.classList.add('hidden'); outlineView.classList.remove('hidden'); - searchView.classList.add('hidden'); + findView.classList.add('hidden'); if (outlineButton.getAttribute('disabled')) return; break; - case 'search': + case 'find': thumbsButton.classList.remove('toggled'); outlineButton.classList.remove('toggled'); - searchButton.classList.add('toggled'); + findButton.classList.add('toggled'); thumbsView.classList.add('hidden'); outlineView.classList.add('hidden'); - searchView.classList.remove('hidden'); + findView.classList.remove('hidden'); - var searchTermsInput = document.getElementById('searchTermsInput'); - searchTermsInput.focus(); + var findTermsInput = document.getElementById('findTermsInput'); + findTermsInput.focus(); // Start text extraction as soon as the search gets displayed. this.extractText(); break; @@ -1386,7 +1386,7 @@ var PDFView = { self.pages[pageIndex].pdfPage.getTextContent().then( function textContentResolved(textContent) { self.pageText[pageIndex] = textContent.join(''); - self.search(); + self.find(); if ((pageIndex + 1) < self.pages.length) extractPageText(pageIndex + 1); } @@ -2545,8 +2545,8 @@ document.addEventListener('DOMContentLoaded', function webViewerLoad(evt) { //#if !(FIREFOX || MOZCENTRAL) //#else -//if (FirefoxCom.requestSync('searchEnabled')) { -// document.querySelector('#viewSearch').classList.remove('hidden'); +//if (FirefoxCom.requestSync('findEnabled')) { +// document.querySelector('#viewFind').classList.remove('hidden'); //} //#endif @@ -2636,10 +2636,10 @@ document.addEventListener('DOMContentLoaded', function webViewerLoad(evt) { PDFView.download(); }); - document.getElementById('searchTermsInput').addEventListener('keydown', + document.getElementById('findTermsInput').addEventListener('keydown', function(event) { if (event.keyCode == 13) { - PDFView.search(); + PDFView.find(); } }); From 6022476f036b4829a9b91c02ee988f2bf2f94bd2 Mon Sep 17 00:00:00 2001 From: Artur Adib Date: Wed, 26 Sep 2012 12:14:57 -0400 Subject: [PATCH 04/17] add support for case sensitive --- web/viewer.js | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/web/viewer.js b/web/viewer.js index f7ed8a7aa..80c25aafb 100644 --- a/web/viewer.js +++ b/web/viewer.js @@ -247,11 +247,17 @@ var PDFFindController = { // TODO: Handle the other find options here as well. var query = this.state.query; + var caseSensitive = this.state.caseSensitive; var queryLen = query.length; if (queryLen === 0) return []; + if (!caseSensitive) { + pageContent = pageContent.toLowerCase(); + query = query.toLowerCase(); + } + var matches = []; var matchIdx = -queryLen; From 73b96e0e580a6921868b07abeaed476c0d94a392 Mon Sep 17 00:00:00 2001 From: Artur Adib Date: Wed, 26 Sep 2012 14:09:55 -0400 Subject: [PATCH 05/17] bug fix: clear previous highlights --- web/viewer.js | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/web/viewer.js b/web/viewer.js index 80c25aafb..214b272fd 100644 --- a/web/viewer.js +++ b/web/viewer.js @@ -2365,6 +2365,18 @@ var TextLayerBuilder = function textLayerBuilder(textLayerDiv, pageIdx) { return ret; }; + this.clearMatches = function textLayerBuilder_clearMatches() { + var textDivs = this.textDivs; + + // Clear all previous highlights + textDivs.forEach(function(div) { + var spans = div.querySelectorAll('span'); + for (var i = 0, ii = spans.length; i < ii; i++) { + spans[i].className = ''; + } + }); + } + this.renderMatches = function textLayerBuilder_renderMatches(matches) { var bidiTexts = this.textContent.bidiTexts; var textDivs = this.textDivs; @@ -2372,6 +2384,8 @@ var TextLayerBuilder = function textLayerBuilder(textLayerDiv, pageIdx) { var isSelectedPage = this.pageIdx === PDFFindController.selected.pageIdx; var selectedMatchIdx = PDFFindController.selected.matchIdx; + this.clearMatches(); + var infty = { divIdx: -1, offset: undefined From 1ec2e2a1a2ac2260bbde0a5cee32209458dd2f9b Mon Sep 17 00:00:00 2001 From: Artur Adib Date: Wed, 26 Sep 2012 16:38:02 -0400 Subject: [PATCH 06/17] remove old unused code --- web/viewer.css | 36 +-------------- web/viewer.html | 7 --- web/viewer.js | 113 ------------------------------------------------ 3 files changed, 2 insertions(+), 154 deletions(-) diff --git a/web/viewer.css b/web/viewer.css index bf172fe5b..92e7d37f1 100644 --- a/web/viewer.css +++ b/web/viewer.css @@ -870,8 +870,7 @@ a:focus > .thumbnail > .thumbnailSelectionRing, margin-left: 20px; } -.outlineItem > a, -#findResults > a { +.outlineItem > a { text-decoration: none; display: inline-block; min-width: 95%; @@ -887,8 +886,7 @@ a:focus > .thumbnail > .thumbnailSelectionRing, white-space: nowrap; } -.outlineItem > a:hover, -#findResults > a:hover { +.outlineItem > a:hover { background-color: hsla(0,0%,100%,.02); background-image: -moz-linear-gradient(hsla(0,0%,100%,.05), hsla(0,0%,100%,0)); background-clip: padding-box; @@ -923,36 +921,6 @@ a:focus > .thumbnail > .thumbnailSelectionRing, width: 280px; } -#findToolbar { - padding-left: 0px; - right: 0px; - padding-top: 0px; - padding-bottom: 5px; -} - -#findToolbar > input { - margin-left: 4px; - width: 124px; -} - -#findToolbar button { - width: auto; - margin: 0; - padding: 0 6px; - height: 22px; -} - -#findResults { - overflow: auto; - position: absolute; - top: 30px; - bottom: 0px; - left: 0px; - right: 0; - padding: 4px 4px 0; - font-size: smaller; -} - #sidebarControls { position:absolute; width: 180px; diff --git a/web/viewer.html b/web/viewer.html index 836cc554a..a7e9091cc 100644 --- a/web/viewer.html +++ b/web/viewer.html @@ -97,13 +97,6 @@ limitations under the License.
-
diff --git a/web/viewer.js b/web/viewer.js index 214b272fd..bfd7cc972 100644 --- a/web/viewer.js +++ b/web/viewer.js @@ -244,8 +244,6 @@ var PDFFindController = { }, calcFindMatch: function(pageContent) { - // TODO: Handle the other find options here as well. - var query = this.state.query; var caseSensitive = this.state.caseSensitive; var queryLen = query.length; @@ -1230,72 +1228,6 @@ var PDFView = { return true; }, - find: function pdfViewStartFind() { - // Limit this function to run every ms. - var FIND_TIMEOUT = 250; - var lastFind = this.lastFind; - var now = Date.now(); - if (lastFind && (now - lastFind) < FIND_TIMEOUT) { - if (!this.findTimer) { - this.findTimer = setTimeout(function resumeFind() { - PDFView.find(); - }, - FIND_TIMEOUT - (now - lastFind) - ); - } - return; - } - this.FindTimer = null; - this.lastFind = now; - - function bindLink(link, pageNumber) { - link.href = '#' + pageNumber; - link.onclick = function findBindLink() { - PDFView.page = pageNumber; - return false; - }; - } - - var findResults = document.getElementById('findResults'); - - var findTermsInput = document.getElementById('findTermsInput'); - findResults.removeAttribute('hidden'); - findResults.textContent = ''; - - var terms = findTermsInput.value; - - if (!terms) - return; - - // simple search: removing spaces and hyphens, then scanning every - terms = terms.replace(/\s-/g, '').toLowerCase(); - var index = PDFView.pageText; - var pageFound = false; - for (var i = 0, ii = index.length; i < ii; i++) { - var pageText = index[i].replace(/\s-/g, '').toLowerCase(); - var j = pageText.indexOf(terms); - if (j < 0) - continue; - - var pageNumber = i + 1; - var textSample = index[i].substr(j, 50); - var link = document.createElement('a'); - bindLink(link, pageNumber); - link.textContent = 'Page ' + pageNumber + ': ' + textSample; - findResults.appendChild(link); - - pageFound = true; - } - if (!pageFound) { - findResults.textContent = ''; - var noResults = document.createElement('div'); - noResults.classList.add('noResults'); - noResults.textContent = mozL10n.get('find_terms_not_found', null, - '(Not found)'); - findResults.appendChild(noResults); - } - }, - setHash: function pdfViewSetHash(hash) { if (!hash) return; @@ -1337,20 +1269,16 @@ var PDFView = { switchSidebarView: function pdfViewSwitchSidebarView(view) { var thumbsView = document.getElementById('thumbnailView'); var outlineView = document.getElementById('outlineView'); - var findView = document.getElementById('findView'); var thumbsButton = document.getElementById('viewThumbnail'); var outlineButton = document.getElementById('viewOutline'); - var findButton = document.getElementById('viewFind'); switch (view) { case 'thumbs': thumbsButton.classList.add('toggled'); outlineButton.classList.remove('toggled'); - findButton.classList.remove('toggled'); thumbsView.classList.remove('hidden'); outlineView.classList.add('hidden'); - findView.classList.add('hidden'); PDFView.renderHighestPriority(); break; @@ -1358,49 +1286,15 @@ var PDFView = { case 'outline': thumbsButton.classList.remove('toggled'); outlineButton.classList.add('toggled'); - findButton.classList.remove('toggled'); thumbsView.classList.add('hidden'); outlineView.classList.remove('hidden'); - findView.classList.add('hidden'); if (outlineButton.getAttribute('disabled')) return; break; - - case 'find': - thumbsButton.classList.remove('toggled'); - outlineButton.classList.remove('toggled'); - findButton.classList.add('toggled'); - thumbsView.classList.add('hidden'); - outlineView.classList.add('hidden'); - findView.classList.remove('hidden'); - - var findTermsInput = document.getElementById('findTermsInput'); - findTermsInput.focus(); - // Start text extraction as soon as the search gets displayed. - this.extractText(); - break; } }, - extractText: function() { - if (this.startedTextExtraction) - return; - this.startedTextExtraction = true; - var self = this; - function extractPageText(pageIndex) { - self.pages[pageIndex].pdfPage.getTextContent().then( - function textContentResolved(textContent) { - self.pageText[pageIndex] = textContent.join(''); - self.find(); - if ((pageIndex + 1) < self.pages.length) - extractPageText(pageIndex + 1); - } - ); - } - extractPageText(0); - }, - getVisiblePages: function pdfViewGetVisiblePages() { return this.getVisibleElements(this.container, this.pages, true); @@ -2656,13 +2550,6 @@ document.addEventListener('DOMContentLoaded', function webViewerLoad(evt) { PDFView.download(); }); - document.getElementById('findTermsInput').addEventListener('keydown', - function(event) { - if (event.keyCode == 13) { - PDFView.find(); - } - }); - document.getElementById('pageNumber').addEventListener('change', function() { PDFView.page = this.value; From e2a2085f6258e2e11b20b93b50ec131b91f4bb06 Mon Sep 17 00:00:00 2001 From: Artur Adib Date: Wed, 26 Sep 2012 16:47:26 -0400 Subject: [PATCH 07/17] remove find button in MOZCENTRAL --- web/viewer.html | 2 ++ web/viewer.js | 3 +-- 2 files changed, 3 insertions(+), 2 deletions(-) diff --git a/web/viewer.html b/web/viewer.html index a7e9091cc..90124508b 100644 --- a/web/viewer.html +++ b/web/viewer.html @@ -88,9 +88,11 @@ limitations under the License. + +
diff --git a/web/viewer.js b/web/viewer.js index bfd7cc972..18954bca7 100644 --- a/web/viewer.js +++ b/web/viewer.js @@ -446,8 +446,7 @@ var PDFFindBar = { this.findMsgNotFound = document.getElementById('findMsgNotFound'); var self = this; - this.toggleButton.addEventListener('click', - function() { + this.toggleButton.addEventListener('click', function() { self.toggle(); }); From 6090b3edf9e3a3c66db09a9279290e7f4adaa72b Mon Sep 17 00:00:00 2001 From: Artur Adib Date: Thu, 27 Sep 2012 12:21:04 -0400 Subject: [PATCH 08/17] colors closer to FF's, add highlightAll support --- web/viewer.css | 4 ++-- web/viewer.js | 24 ++++++++++++++---------- 2 files changed, 16 insertions(+), 12 deletions(-) diff --git a/web/viewer.css b/web/viewer.css index 92e7d37f1..77d4807dc 100644 --- a/web/viewer.css +++ b/web/viewer.css @@ -1067,7 +1067,7 @@ canvas { margin: -1px; padding: 1px; - background-color: rgba(0, 137, 26, 0.2); + background-color: rgba(180, 0, 170, 0.2); border-radius: 4px; } @@ -1084,7 +1084,7 @@ canvas { } .textLayer .highlight.selected { - background-color: rgba(255, 0, 0, 0.2); + background-color: rgba(0, 100, 0, 0.2); } /* TODO: file FF bug to support ::-moz-selection:window-inactive diff --git a/web/viewer.js b/web/viewer.js index 18954bca7..f55074263 100644 --- a/web/viewer.js +++ b/web/viewer.js @@ -458,22 +458,18 @@ var PDFFindBar = { // next match when the findField is selected. document.getElementById('findPrevious').addEventListener('click', - function() { - self.dispatchEvent('again', true); - }); + function() { self.dispatchEvent('again', true); } + ); - document.getElementById('findNext').addEventListener('click', - function() { + document.getElementById('findNext').addEventListener('click', function() { self.dispatchEvent('again', false); }); - this.highlightAll.addEventListener('click', - function() { + this.highlightAll.addEventListener('click', function() { self.dispatchEvent('highlightallchange'); }); - this.caseSensitive.addEventListener('click', - function() { + this.caseSensitive.addEventListener('click', function() { self.dispatchEvent('casesensitivitychange'); }); }, @@ -2276,6 +2272,7 @@ var TextLayerBuilder = function textLayerBuilder(textLayerDiv, pageIdx) { var prevEnd = null; var isSelectedPage = this.pageIdx === PDFFindController.selected.pageIdx; var selectedMatchIdx = PDFFindController.selected.matchIdx; + var highlightAll = PDFFindController.state.highlightAll; this.clearMatches(); @@ -2323,7 +2320,14 @@ var TextLayerBuilder = function textLayerBuilder(textLayerDiv, pageIdx) { textDivs[divIdx].className = className; } - for (var i = 0; i < matches.length; i++) { + var i0 = selectedMatchIdx, i1 = i0 + 1, i; + + if (highlightAll) { + i0 = 0; + i1 = matches.length; + } + + for (i = i0; i < i1; i++) { var match = matches[i]; var begin = match.begin; var end = match.end; From ecf3dae7764990a0f0e7218541a7609fc61338bc Mon Sep 17 00:00:00 2001 From: Julian Viereck Date: Fri, 28 Sep 2012 15:16:10 +0200 Subject: [PATCH 09/17] Fix clear matches functionality --- web/viewer.js | 24 ++++++++---------------- 1 file changed, 8 insertions(+), 16 deletions(-) diff --git a/web/viewer.js b/web/viewer.js index f55074263..1883333a5 100644 --- a/web/viewer.js +++ b/web/viewer.js @@ -2254,19 +2254,12 @@ var TextLayerBuilder = function textLayerBuilder(textLayerDiv, pageIdx) { return ret; }; - this.clearMatches = function textLayerBuilder_clearMatches() { - var textDivs = this.textDivs; - - // Clear all previous highlights - textDivs.forEach(function(div) { - var spans = div.querySelectorAll('span'); - for (var i = 0, ii = spans.length; i < ii; i++) { - spans[i].className = ''; - } - }); - } - this.renderMatches = function textLayerBuilder_renderMatches(matches) { + // Early exit if there is nothing to render. + if (matches.length === 0) { + return; + } + var bidiTexts = this.textContent.bidiTexts; var textDivs = this.textDivs; var prevEnd = null; @@ -2274,8 +2267,6 @@ var TextLayerBuilder = function textLayerBuilder(textLayerDiv, pageIdx) { var selectedMatchIdx = PDFFindController.selected.matchIdx; var highlightAll = PDFFindController.state.highlightAll; - this.clearMatches(); - var infty = { divIdx: -1, offset: undefined @@ -2377,12 +2368,13 @@ var TextLayerBuilder = function textLayerBuilder(textLayerDiv, pageIdx) { var bidiTexts = this.textContent.bidiTexts; var clearedUntilDivIdx = -1; + // Clear out all current matches. for (var i = 0; i < matches.length; i++) { var match = matches[i]; var begin = Math.max(clearedUntilDivIdx, match.begin.divIdx); for (var n = begin; n <= match.end.divIdx; n++) { - var div = bidiTexts[n].str; - div.textContent = div.textContent; + var div = textDivs[n]; + div.textContent = bidiTexts[n].str; div.className = ''; } clearedUntilDivIdx = match.end.divIdx + 1; From 2a1264a74646eecb1ce5d4b59c5dbaa169a32ede Mon Sep 17 00:00:00 2001 From: Brendan Dahl Date: Fri, 28 Sep 2012 09:03:35 -0700 Subject: [PATCH 10/17] Don't try to highlight anything if the page isn't selected and we aren't highlighting all. --- web/viewer.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/web/viewer.js b/web/viewer.js index 1883333a5..1d743d668 100644 --- a/web/viewer.js +++ b/web/viewer.js @@ -2316,6 +2316,9 @@ var TextLayerBuilder = function textLayerBuilder(textLayerDiv, pageIdx) { if (highlightAll) { i0 = 0; i1 = matches.length; + } else if(!isSelectedPage) { + // Not highlighting all and this isn't the selected page, so do nothing. + return; } for (i = i0; i < i1; i++) { From 38193b1887cbe7f920cc99e728e5281cd76f262c Mon Sep 17 00:00:00 2001 From: Brendan Dahl Date: Fri, 28 Sep 2012 11:18:45 -0700 Subject: [PATCH 11/17] Update the find bar ui status. --- web/viewer.css | 10 ++++++- web/viewer.html | 3 +- web/viewer.js | 76 ++++++++++++++++++++++++++++++++++--------------- 3 files changed, 63 insertions(+), 26 deletions(-) diff --git a/web/viewer.css b/web/viewer.css index 77d4807dc..95b4dc5ab 100644 --- a/web/viewer.css +++ b/web/viewer.css @@ -282,9 +282,17 @@ html[dir='rtl'] #sidebarContent { font-size: 12px; line-height: 14px; text-align: left; + cursor: default; +} + +.findbar label { -webkit-user-select:none; -moz-user-select:none; - cursor: default; +} + +#findMsg { + font-style: italic; + color: #A6B7D0; } .notFound { diff --git a/web/viewer.html b/web/viewer.html index 90124508b..73c4cb87a 100644 --- a/web/viewer.html +++ b/web/viewer.html @@ -112,8 +112,7 @@ limitations under the License. - - +
diff --git a/web/viewer.js b/web/viewer.js index 1d743d668..759133127 100644 --- a/web/viewer.js +++ b/web/viewer.js @@ -34,6 +34,12 @@ var RenderingStates = { PAUSED: 2, FINISHED: 3 }; +var FindStates = { + FIND_FOUND: 0, + FIND_NOTFOUND: 1, + FIND_WRAPPED: 2, + FIND_PENDING: 3 +}; //#if (GENERIC || CHROME) //PDFJS.workerSrc = '../build/pdf.js'; @@ -337,6 +343,12 @@ var PDFFindController = { this.active = true; + if (!this.state.query) { + this.updateUIState(FindStates.FIND_FOUND); + return; + } + this.updateUIState(FindStates.FIND_PENDING); + if (this.dirtyMatch) { // Need to recalculate the matches. this.dirtyMatch = false; @@ -360,16 +372,24 @@ var PDFFindController = { } this.updatePage(i, true); } + if (!firstMatch) { + this.updateUIState(FindStates.FIND_FOUND); + } else { + this.updateUIState(FindStates.FIND_NOTFOUND); + } } else { // If there is NO selection, then there is no match at all -> no sense to // handle previous/next action. - if (this.selected.pageIdx === -1) + if (this.selected.pageIdx === -1) { + this.updateUIState(FindStates.FIND_NOTFOUND); return; + } // Handle findAgain case. var previous = this.state.findPrevious; var sPageIdx = this.selected.pageIdx; var sMatchIdx = this.selected.matchIdx; + var findState = FindStates.FIND_FOUND; if (previous) { // Select previous match. @@ -393,6 +413,9 @@ var PDFFindController = { // If pageIdx stayed the same, select last match on the page. if (this.selected.pageIdx === sPageIdx) { this.selected.matchIdx = pageMatches[sPageIdx].length - 1; + findState = FindStates.FIND_WRAPPED; + } else if (this.selected.pageIdx > sPageIdx) { + findState = FindStates.FIND_WRAPPED; } } } else { @@ -411,18 +434,28 @@ var PDFFindController = { break; } } - // If pageIdx stayed the same, select last match on the page. + + // If pageIdx stayed the same, select first match on the page. if (this.selected.pageIdx === sPageIdx) { this.selected.matchIdx = 0; + findState = FindStates.FIND_WRAPPED; + } else if (this.selected.pageIdx < sPageIdx) { + findState = FindStates.FIND_WRAPPED; } } } + this.updateUIState(findState, previous); this.updatePage(sPageIdx, sPageIdx === this.selected.pageIdx); if (sPageIdx !== this.selected.pageIdx) { this.updatePage(this.selected.pageIdx, true); } } + }, + + updateUIState: function(state, previous) { + // TODO: Update the firefox find bar or update the html findbar. + PDFFindBar.updateUIState(state, previous); } }; @@ -432,18 +465,13 @@ var PDFFindBar = { opened: false, - FIND_FOUND: 0, // Successful find - FIND_NOTFOUND: 1, // Unsuccessful find - FIND_WRAPPED: 2, // Successful find, but wrapped around - initialize: function() { this.bar = document.getElementById('findbar'); this.toggleButton = document.getElementById('viewFind'); this.findField = document.getElementById('findInput'); this.highlightAll = document.getElementById('findHighlightAll'); this.caseSensitive = document.getElementById('findMatchCase'); - this.findMsgWrap = document.getElementById('findMsgWrap'); - this.findMsgNotFound = document.getElementById('findMsgNotFound'); + this.findMsg = document.getElementById('findMsg'); var self = this; this.toggleButton.addEventListener('click', function() { @@ -485,36 +513,38 @@ var PDFFindBar = { return window.dispatchEvent(event); }, - updateUIState: function(aState) { + updateUIState: function(state, previous) { var notFound = false; - var wrapped = false; + var findMsg = ''; + var status = 'pending'; - switch (aState) { - case this.FIND_FOUND: + switch (state) { + case FindStates.FIND_FOUND: break; - case this.FIND_NOTFOUND: + case FindStates.FIND_NOTFOUND: + findMsg = mozL10n.get('find_not_found', null, 'Phrase not found'); notFound = true; break; - case this.FIND_WRAPPED: - wrapped = true; + case FindStates.FIND_WRAPPED: + if (previous) { + findMsg = mozL10n.get('find_wrapped_to_bottom', null, + 'Reached end of page, continued from bottom'); + } else { + findMsg = mozL10n.get('find_wrapped_to_top', null, + 'Reached end of page, continued from top'); + } break; } if (notFound) { this.findField.classList.add('notFound'); - this.findMsgNotFound.classList.remove('hidden'); } else { this.findField.classList.remove('notFound'); - this.findMsgNotFound.classList.add('hidden'); } - if (wrapped) { - this.findMsgWrap.classList.remove('hidden'); - } else { - this.findMsgWrap.classList.add('hidden'); - } + this.findMsg.textContent = findMsg; }, open: function() { @@ -2316,7 +2346,7 @@ var TextLayerBuilder = function textLayerBuilder(textLayerDiv, pageIdx) { if (highlightAll) { i0 = 0; i1 = matches.length; - } else if(!isSelectedPage) { + } else if (!isSelectedPage) { // Not highlighting all and this isn't the selected page, so do nothing. return; } From 53672af0f79c64a88eb4280063e9df7e55f7144a Mon Sep 17 00:00:00 2001 From: Brendan Dahl Date: Fri, 28 Sep 2012 11:43:22 -0700 Subject: [PATCH 12/17] Fix un-highlight when there is no query. --- web/viewer.js | 6 +----- 1 file changed, 1 insertion(+), 5 deletions(-) diff --git a/web/viewer.js b/web/viewer.js index 759133127..4381e6c2f 100644 --- a/web/viewer.js +++ b/web/viewer.js @@ -343,10 +343,6 @@ var PDFFindController = { this.active = true; - if (!this.state.query) { - this.updateUIState(FindStates.FIND_FOUND); - return; - } this.updateUIState(FindStates.FIND_PENDING); if (this.dirtyMatch) { @@ -372,7 +368,7 @@ var PDFFindController = { } this.updatePage(i, true); } - if (!firstMatch) { + if (!firstMatch || !this.state.query) { this.updateUIState(FindStates.FIND_FOUND); } else { this.updateUIState(FindStates.FIND_NOTFOUND); From dd0cb37f38d4ebb22f16198f4051fc29cea33452 Mon Sep 17 00:00:00 2001 From: Brendan Dahl Date: Fri, 28 Sep 2012 12:30:07 -0700 Subject: [PATCH 13/17] Add some door hanger styling for the find bar --- web/viewer.css | 37 +++++++++++++++++++++++++++++++------ web/viewer.html | 14 +++++++------- 2 files changed, 38 insertions(+), 13 deletions(-) diff --git a/web/viewer.css b/web/viewer.css index 95b4dc5ab..30877a6d6 100644 --- a/web/viewer.css +++ b/web/viewer.css @@ -267,17 +267,15 @@ html[dir='rtl'] #sidebarContent { } .findbar { - top: 40px; - left: 40px; + top: 32px; + left: 68px; position: absolute; - z-index: 100; + z-index: 10000; height: 20px; min-width: 16px; padding: 3px 6px 3px 6px; margin: 4px 2px 4px 0; - border: 1px solid transparent; - border-radius: 2px; color: hsl(0,0%,85%); font-size: 12px; line-height: 14px; @@ -290,6 +288,33 @@ html[dir='rtl'] #sidebarContent { -moz-user-select:none; } +.doorHanger { + border: 1px solid hsla(0,0%,0%,.5); + border-radius: 2px; + box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3); +} +.doorHanger:after, .doorHanger:before { + bottom: 100%; + border: solid transparent; + content: " "; + height: 0; + width: 0; + position: absolute; + pointer-events: none; +} +.doorHanger:after { + border-bottom-color: hsla(0,0%,32%,.99); + border-width: 8px; + left: 16px; + margin-left: -8px; +} +.doorHanger:before { + border-bottom-color: hsla(0,0%,0%,.5); + border-width: 9px; + left: 16px; + margin-left: -9px; +} + #findMsg { font-style: italic; color: #A6B7D0; @@ -1317,7 +1342,7 @@ canvas { } @media all and (max-width: 600px) { - #toolbarViewerRight { + #toolbarViewerRight, #findbar, #viewFind { display: none; } } diff --git a/web/viewer.html b/web/viewer.html index 73c4cb87a..e59120471 100644 --- a/web/viewer.html +++ b/web/viewer.html @@ -88,11 +88,6 @@ limitations under the License. - - -
@@ -103,7 +98,7 @@ limitations under the License.
-