javascript - Use PDF.js based PDF preview viewer to CakePHP 2.x -
im kind of new cakephp , im trying use nice pdf preview found online https://gist.github.com/ichord/9808444
<script src="http://cdnjs.cloudflare.com/ajax/libs/processing.js/1.4.1/processing-api.min.js"></script><html> <!-- created using jsbin.com source can edited via http://jsbin.com/pdfjs-helloworld-v2/8598/edit --> <body> <canvas id="the-canvas" style="border:1px solid black"></canvas> <input id='pdf' type='file'/> <!-- use latest pdf.js build github --> <script type="text/javascript" src="https://rawgithub.com/mozilla/pdf.js/gh-pages/build/pdf.js"></script> <script type="text/javascript"> // // disable workers avoid yet cross-origin issue (workers need url of // script loaded, , dynamically loading cross-origin script // not work) // pdfjs.disableworker = true; // // asynchronous download pdf arraybuffer // var pdf = document.getelementbyid('pdf'); pdf.onchange = function(ev) { if (file = document.getelementbyid('pdf').files[0]) { filereader = new filereader(); filereader.onload = function(ev) { console.log(ev); pdfjs.getdocument(filereader.result).then(function getpdfhelloworld(pdf) { // // fetch first page // console.log(pdf) pdf.getpage(1).then(function getpagehelloworld(page) { var scale = 0.8; var viewport = page.getviewport(scale); // // prepare canvas using pdf page dimensions // var canvas = document.getelementbyid('the-canvas'); var context = canvas.getcontext('2d'); canvas.height = viewport.height; canvas.width = viewport.width; // // render pdf page canvas context // var task = page.render({canvascontext: context, viewport: viewport}) task.promise.then(function(){ console.log(canvas.todataurl('image/jpeg')); }); }); }, function(error){ console.log(error); }); }; filereader.readasarraybuffer(file); } } alert(file.name) </script> <style id="jsbin-css"> </style> <script> </script> </body> </html>
but cant make work cakephp.
it works on sever outside cakephp environment, guess have use plugin cant figure out. uses pdf.js , processing-api.js libraries , think problem loading these libraries.
what want user preview pdf wants upload before he/she uploads it
thank in advance.
regards
i finaly found solution this, added: pdfjs.workersrc = '/js/pdf.worker.js'; before pdfjs.disableworker = true;
now works!
Comments
Post a Comment