Skip to content
This repository has been archived by the owner on Oct 10, 2019. It is now read-only.

Rendering All Pages #12

Open
wants to merge 3 commits into
base: develop
Choose a base branch
from
Open

Rendering All Pages #12

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
3f51cfd
adding .gitignore
Jul 23, 2014
ab284f0
adding the ability to render multiple pages
Jul 23, 2014
60f7cd2
adding containter for multiple canvases to render all pages
Jul 23, 2014
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
32 changes: 32 additions & 0 deletions .gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
# Created by .gitignore support plugin (hsz.mobi)

### JetBrains template
# Covers JetBrains IDEs: IntelliJ, RubyMine, PhpStorm, AppCode, PyCharm

## Directory-based project format
.idea/
# if you remove the above rule, at least ignore user-specific stuff:
# .idea/workspace.xml
# .idea/tasks.xml
# and these sensitive or high-churn files:
# .idea/dataSources.ids
# .idea/dataSources.xml
# .idea/sqlDataSources.xml
# .idea/dynamic.xml

## File-based project format
*.ipr
*.iml
*.iws

## Additional for IntelliJ
out/

# generated by mpeltonen/sbt-idea plugin
.idea_modules/

# generated by JIRA plugin
atlassian-ide-plugin.xml

# generated by Crashlytics plugin (for Android Studio and Intellij)
com_crashlytics_export_strings.xml
314 changes: 168 additions & 146 deletions ng-pdfviewer.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,154 +1,176 @@
/**
* @preserve AngularJS PDF viewer directive using pdf.js.
*
* https://github.com/akrennmair/ng-pdfviewer
* https://github.com/akrennmair/ng-pdfviewer
*
* MIT license
*/

angular.module('ngPDFViewer', []).
directive('pdfviewer', [ '$parse', function($parse) {
var canvas = null;
var instance_id = null;

return {
restrict: "E",
template: '<canvas></canvas>',
scope: {
onPageLoad: '&',
loadProgress: '&',
src: '@',
id: '='
},
controller: [ '$scope', function($scope) {
$scope.pageNum = 1;
$scope.pdfDoc = null;
$scope.scale = 1.0;

$scope.documentProgress = function(progressData) {
if ($scope.loadProgress) {
$scope.loadProgress({state: "loading", loaded: progressData.loaded, total: progressData.total});
}
};

$scope.loadPDF = function(path) {
console.log('loadPDF ', path);
PDFJS.getDocument(path, null, null, $scope.documentProgress).then(function(_pdfDoc) {
$scope.pdfDoc = _pdfDoc;
$scope.renderPage($scope.pageNum, function(success) {
if ($scope.loadProgress) {
$scope.loadProgress({state: "finished", loaded: 0, total: 0});
}
});
}, function(message, exception) {
console.log("PDF load error: " + message);
if ($scope.loadProgress) {
$scope.loadProgress({state: "error", loaded: 0, total: 0});
}
});
};

$scope.renderPage = function(num, callback) {
console.log('renderPage ', num);
$scope.pdfDoc.getPage(num).then(function(page) {
var viewport = page.getViewport($scope.scale);
var ctx = canvas.getContext('2d');

canvas.height = viewport.height;
canvas.width = viewport.width;

page.render({ canvasContext: ctx, viewport: viewport }).promise.then(
function() {
if (callback) {
callback(true);
}
$scope.$apply(function() {
$scope.onPageLoad({ page: $scope.pageNum, total: $scope.pdfDoc.numPages });
});
},
function() {
if (callback) {
callback(false);
}
console.log('page.render failed');
}
);
});
};

$scope.$on('pdfviewer.nextPage', function(evt, id) {
if (id !== instance_id) {
return;
}

if ($scope.pageNum < $scope.pdfDoc.numPages) {
$scope.pageNum++;
$scope.renderPage($scope.pageNum);
}
});

$scope.$on('pdfviewer.prevPage', function(evt, id) {
if (id !== instance_id) {
return;
}

if ($scope.pageNum > 1) {
$scope.pageNum--;
$scope.renderPage($scope.pageNum);
}
});

$scope.$on('pdfviewer.gotoPage', function(evt, id, page) {
if (id !== instance_id) {
return;
}

if (page >= 1 && page <= $scope.pdfDoc.numPages) {
$scope.pageNum = page;
$scope.renderPage($scope.pageNum);
}
});
} ],
link: function(scope, iElement, iAttr) {
canvas = iElement.find('canvas')[0];
instance_id = iAttr.id;

iAttr.$observe('src', function(v) {
console.log('src attribute changed, new value is', v);
if (v !== undefined && v !== null && v !== '') {
scope.pageNum = 1;
scope.loadPDF(scope.src);
}
});
}
};
}]).
service("PDFViewerService", [ '$rootScope', function($rootScope) {

var svc = { };
svc.nextPage = function() {
$rootScope.$broadcast('pdfviewer.nextPage');
};

svc.prevPage = function() {
$rootScope.$broadcast('pdfviewer.prevPage');
};

svc.Instance = function(id) {
var instance_id = id;

return {
prevPage: function() {
$rootScope.$broadcast('pdfviewer.prevPage', instance_id);
},
nextPage: function() {
$rootScope.$broadcast('pdfviewer.nextPage', instance_id);
},
gotoPage: function(page) {
$rootScope.$broadcast('pdfviewer.gotoPage', instance_id, page);
}
};
};

return svc;
}]);
directive('pdfviewer', [ '$parse', function($parse) {
var div = null;
var instance_id = null;

return {
restrict: "E",
template: '<div></div>',
scope: {
onPageLoad: '&',
loadProgress: '&',
displayAll: '@',
src: '@',
id: '='
},
controller: [ '$scope', function($scope) {
$scope.pageNum = 1;
$scope.pdfDoc = null;
$scope.scale = 1.0;

$scope.documentProgress = function(progressData) {
if ($scope.loadProgress) {
$scope.loadProgress({state: "loading", loaded: progressData.loaded, total: progressData.total});
}
};

$scope.loadPDF = function(path) {
console.log('loadPDF ', path);
PDFJS.getDocument(path, null, null, $scope.documentProgress).then(function(_pdfDoc) {
$scope.pdfDoc = _pdfDoc;
$scope.numPages = $scope.pdfDoc.numPages;
if($scope.displayAll == "true"){
$scope.pdfDoc.getPage($scope.pageNum).then($scope.renderAll)
}else{
$scope.renderPage($scope.pageNum, function(success) {
if ($scope.loadProgress) {
$scope.loadProgress({state: "finished", loaded: 0, total: 0});
}
});
}
}, function(message, exception) {
console.log("PDF load error: " + message);
if ($scope.loadProgress) {
$scope.loadProgress({state: "error", loaded: 0, total: 0});
}
});
};

$scope.renderAll=function(page){
$scope.renderPage($scope.pageNum);
//Move to next page
$scope.pageNum++;
if ( $scope.pdfDoc !== null && $scope.pageNum <= $scope.numPages )
{
$scope.pdfDoc.getPage( $scope.pageNum ).then( $scope.renderAll );
}
};

$scope.renderPage = function(num, callback) {
console.log('renderPage ', num);
$scope.pdfDoc.getPage(num).then(function(page) {
var viewport = page.getViewport($scope.scale);

var canvas = document.createElement("canvas");
canvas.style.display = "block";

var ctx = canvas.getContext('2d');

canvas.height = viewport.height;
canvas.width = viewport.width;

div.appendChild(canvas);

page.render({ canvasContext: ctx, viewport: viewport }).then(
function() {
if (callback) {
callback(true);
}
$scope.$apply(function() {
$scope.onPageLoad({ page: $scope.pageNum, total: $scope.pdfDoc.numPages });
});
},
function() {
if (callback) {
callback(false);
}
console.log('page.render failed');
}
);
});
};

$scope.$on('pdfviewer.nextPage', function(evt, id) {
if (id !== instance_id) {
return;
}

if ($scope.pageNum < $scope.pdfDoc.numPages) {
$scope.pageNum++;
$scope.renderPage($scope.pageNum);
}
});

$scope.$on('pdfviewer.prevPage', function(evt, id) {
if (id !== instance_id) {
return;
}

if ($scope.pageNum > 1) {
$scope.pageNum--;
$scope.renderPage($scope.pageNum);
}
});

$scope.$on('pdfviewer.gotoPage', function(evt, id, page) {
if (id !== instance_id) {
return;
}

if (page >= 1 && page <= $scope.pdfDoc.numPages) {
$scope.pageNum = page;
$scope.renderPage($scope.pageNum);
}
});
} ],
link: function(scope, iElement, iAttr) {
div = iElement.find('div')[0];
instance_id = iAttr.id;

iAttr.$observe('src', function(v) {
console.log('src attribute changed, new value is', v);
if (v !== undefined && v !== null && v !== '') {
scope.pageNum = 1;
scope.loadPDF(scope.src);
}
});
}
};
}]).
service("PDFViewerService", [ '$rootScope', function($rootScope) {

var svc = { };
svc.nextPage = function() {
$rootScope.$broadcast('pdfviewer.nextPage');
};

svc.prevPage = function() {
$rootScope.$broadcast('pdfviewer.prevPage');
};

svc.Instance = function(id) {
var instance_id = id;

return {
prevPage: function() {
$rootScope.$broadcast('pdfviewer.prevPage', instance_id);
},
nextPage: function() {
$rootScope.$broadcast('pdfviewer.nextPage', instance_id);
},
gotoPage: function(page) {
$rootScope.$broadcast('pdfviewer.gotoPage', instance_id, page);
}
};
};

return svc;
}]);