diff --git a/README.md b/README.md index 763ace9..9a555a5 100644 --- a/README.md +++ b/README.md @@ -11,3 +11,8 @@ ## Addon's "API" TODO!! + + +## A word about the current page update + +There are some limitation ATM on how the current page is updated. The "scroll" need to be placed on the `.pdfViewerContainer`. For an example on how to do it, check the dummy app's [style sheet](https://github.com/smith-carson/ember-pdf-js/blob/master/tests/dummy/app/styles/app.css) diff --git a/addon/components/pdf-js-toolbar.js b/addon/components/pdf-js-toolbar.js index cd9788a..d7da83a 100644 --- a/addon/components/pdf-js-toolbar.js +++ b/addon/components/pdf-js-toolbar.js @@ -1,7 +1,9 @@ import Ember from 'ember' import layout from '../templates/components/pdf-js-toolbar' -const { Component } = Ember +const { + Component +} = Ember export default Component.extend({ layout, @@ -11,6 +13,8 @@ export default Component.extend({ caseSensitive: false, highlightAll: true, phraseSearch: false, + page: undefined, + pageTotal: undefined, actions: { search () { diff --git a/addon/components/pdf-js.js b/addon/components/pdf-js.js index 56db70a..fafc4f8 100644 --- a/addon/components/pdf-js.js +++ b/addon/components/pdf-js.js @@ -13,7 +13,8 @@ const { Component, computed: { reads }, inject: { service: injectService }, - observer + observer, + run } = Ember export default Component.extend({ @@ -33,17 +34,19 @@ export default Component.extend({ pdfHistory: undefined, pdfViewer: undefined, pdfFindController: undefined, - pdfPage: 0, + pdfPage: undefined, + pdfTotalPages: undefined, // components toolbarComponent: 'pdf-js-toolbar', // initialization didInsertElement () { + let [container] = this.element.getElementsByClassName('pdfViewerContainer') let pdfLinkService = new PDFLinkService() this.set('pdfLinkService', pdfLinkService) let pdfViewer = new PDFViewer({ - container: this.element.getElementsByClassName('pdfViewerContainer')[0], + container, linkService: pdfLinkService }) this.set('pdfViewer', pdfViewer) @@ -52,11 +55,22 @@ export default Component.extend({ linkService: pdfLinkService }) this.set('pdfHistory', pdfHistory) + pdfLinkService.setHistory(pdfHistory) let pdfFindController = new PDFFindController({ pdfViewer }) this.set('pdfFindController', pdfFindController) pdfViewer.setFindController(pdfFindController) + pdfViewer.currentScaleValue = 'page-fit' + + // setup the event listening to synchronise with pdf.js' modifications + let self = this + pdfViewer.eventBus.on('pagechange', function (evt) { + let page = evt.pageNumber + run(function () { + self.set('pdfPage', page) + }) + }) if (this.get('pdf')) { this.send('load') @@ -86,6 +100,8 @@ export default Component.extend({ linkService.setDocument(pdfDocument) let history = this.get('pdfHistory') history.initialize(pdfDocument.fingerprint) + this.set('pdfTotalPages', linkService.pagesCount) + this.set('pdfPage', linkService.page) }) this.set('loadingTask', loadingTask) diff --git a/addon/templates/components/pdf-js-toolbar.hbs b/addon/templates/components/pdf-js-toolbar.hbs index 03ea4ff..e8655e1 100644 --- a/addon/templates/components/pdf-js-toolbar.hbs +++ b/addon/templates/components/pdf-js-toolbar.hbs @@ -1,7 +1,7 @@ - - {{one-way-input searchTerms update=(action 'updateSearchTerm')}} @@ -18,3 +18,4 @@ {{one-way-checkbox highlightAll update=(action 'updateHighlightAll')}} highlightAll + diff --git a/addon/templates/components/pdf-js.hbs b/addon/templates/components/pdf-js.hbs index f9b4eaf..ab3e59b 100644 --- a/addon/templates/components/pdf-js.hbs +++ b/addon/templates/components/pdf-js.hbs @@ -1,8 +1,10 @@ + {{component toolbarComponent changePage=(action 'changePage') search=(action 'search') zoom=(action 'zoom') page=pdfPage + pageTotal=pdfTotalPages class="ember-pdf-js toolbar" }}
diff --git a/package.json b/package.json index fe44367..a797a37 100644 --- a/package.json +++ b/package.json @@ -18,9 +18,9 @@ "author": "leojpod", "license": "MIT", "devDependencies": { + "broccoli-asset-rev": "^2.4.5", "broccoli-funnel": "^1.0.9", "broccoli-merge-trees": "^1.1.5", - "broccoli-asset-rev": "^2.4.5", "ember-ajax": "^2.4.1", "ember-browserify": "1.1.13", "ember-cli": "2.9.1", @@ -54,7 +54,8 @@ "dependencies": { "ember-cli-babel": "^5.1.7", "ember-cli-htmlbars": "1.1.0", - "ember-one-way-controls": "1.1.2" + "ember-one-way-controls": "1.1.2", + "ember-truth-helpers": "1.2.0" }, "ember-addon": { "configPath": "tests/dummy/config" diff --git a/tests/dummy/app/styles/app.css b/tests/dummy/app/styles/app.css index eabc42b..f084e10 100644 --- a/tests/dummy/app/styles/app.css +++ b/tests/dummy/app/styles/app.css @@ -2,4 +2,16 @@ position: fixed; top: 0; z-index: 100; + background: solid white; +} +.ember-pdf-js.viewer .pdfViewerContainer{ + position: absolute; + top:0; + bottom: 0; + overflow-y: auto; + left: 0; + right: 0; +} +body, html { + overflow: hidden; } diff --git a/tests/dummy/app/templates/application.hbs b/tests/dummy/app/templates/application.hbs index 56bc0a0..e1f2226 100644 --- a/tests/dummy/app/templates/application.hbs +++ b/tests/dummy/app/templates/application.hbs @@ -1,2 +1,2 @@ -{{#pdf-js pdf="/compressed.tracemonkey-pldi-09.pdf"}} +{{#pdf-js pdf="/compressed.tracemonkey-pldi-09.pdf" class='ember-pdf-js viewer'}} {{/pdf-js}}