Render pdf in view with cakephp - cakephp

My problem is that I want to render a pdf inside a CakePhP view.
So I have a view with some html/php and at the end of the page I want to render some pdfs (I don't want to link pdf, really need to render them on the same page).
If you have any idea on how to do it that would be great :)
Thank you.

You cannot mix HTML and PDF and expect the browser to display it correctly, that won't work. You'll either have to convert the PDF to HTML, or display the PDF in an iframe.
For the latter to work you usually need to send a Content-Disposition of type inline, and of course it requires a browser that either supports PDF natively, or has an appropriate plugin installed.
Here's some basic example code. In the view:
<p>Some html</p>
<iframe width='123' height='456' src='/path/view_pdf'></iframe>
And then in the linked controller action respond with inline PDF data, which is pretty easy in Cake 2.x:
public function view_pdf()
{
$this->response->file('/path/to/the/file.pdf');
$this->response->header('Content-Disposition', 'inline');
return $this->response;
}
For more information check the Cookbook.

Related

Serving dynamically generated files from GitHub Pages

I'm a few months into web development so I apologize if I misunderstood anything.
What I did
I created a react-random-shapes package that would draw out random shapes as a React component. You can see an example here on my site or in the project page. Each time you refresh the page you'd get a new image. (Note: these pages use React.)
What I want to do next
The result I'm aiming for is to create an API (GET-only) on GitHub Pages that would return the dynamically generated svg file (so you can do something like
<img src="https://github.com/artt/react-random-shapes/blob?size=300&fill=red">
which would return a random blob for anyone who's interested in using. Alternatively, this API could return the svg path so the user could do whatever they want with it (e.g. animation).
The problem I have
Right now I know how to output an html page with the svg file, but not quite sure how to return just the svg (or json, etc.) part of it.
Thanks!
I am trying to do the same thing. I think your best bet would be to use a webserver on another platform like Heroku or, another good option, Replit.

save html page in pdf format in angularJS

I want to have a save page button on my site to allow users to just download the page that they are on.
is there like an ng-save that i can use or something?
As you've tagged PDF, I'm assuming that you're looking to save the page in a PDF format. If so, you might want to take a look at PhantomJS, which has an option to save as PDF:
http://phantomjs.org/screen-capture.html

Display ms word file in html using angular

How can I display Microsoft Word file in HTML page using either Angular or JavaScript. Please suggest any libraries which provide this functionality.
No browsers currently have the code necessary to render Word
Documents, and as far as I know, there are no client-side libraries
that currently exist for rendering them either
However, if you only need to display the Word Document, but don't need
to edit it, you can use Google Documents' Viewer via an to
display a remotely hosted .doc/.docx.
<iframe src="http://docs.google.com/gview?url=http://remote.url.tld/path/to/document.doc&embedded=true"></iframe>
Example:
jsfidle
However, if you'd rather have native support, in most, if not all browsers, I'd recommend resaving the .doc/.docx as a PDF file Those can also be independently rendered using PDF.js by Mozilla.
Edit:
Huge thanks to fatbotdesigns for posting the Microsoft Office 365 viewer in the comments.
<iframe src='https://view.officeapps.live.com/op/embed.aspx?src=http://remote.url.tld/path/to/document.doc' width='1366px' height='623px' frameborder='0'>This is an embedded <a target='_blank' href='http://office.com'>Microsoft Office</a> document, powered by <a target='_blank' href='http://office.com/webapps'>Office Online</a>.</iframe>
Live Examples:
Google Docs Viewer
Microsoft Office Viewer
So what I found from my research is you can not display a word file using java script or angular, it only opens up a dialog box to download the file.
Here are some links backing my conclusion.
display doc file in HTML link1
display doc file in HTML link2
As an alternate what you can do is convert word file to HTML and preview it in browser. Mammoth.JS is the best option for this.

Creating a loading page for a website

I am currently working on a website and during the loading of the entire page, the page is "jumping" so that I would like to know how I can create an entire ,let's say black screen, where something is displayed during the time the page loads.
That seems quite easy but I was wondering because I have separate files for the header, the footer and the content on how to coordinate all of them, and still have a nice code.
I am working with angularJS. I read a lot about : $viewContentLoaded and also tried ng-cloak, but if any of you has an awesome solution to keep simple, it would be great :)
Thanks
I would say that one approach you can take is use some sort of templating engine for your HTML files (like Jade for example). In this way, you can keep all the code nicely separated in multiple files and using a task runner like Gulp or Grunt you can compile your HTML files before serving the page.
The important difference here is the fact that you won't have to load all the page parts (header, footer and so on) using AJAX requests. Instead, they will already be rendered in your HTML page allowing you to create a nice loader using ng-cloak on your content part.

Creating the view as PDF in sencha touch

My requirement is after user taps createPDF button,to generate current view as PDF. Using
console.log(this.getMain().getActiveItem().renderElement.dom.innerHTML);
i can able to get entire HTML element. Now i stuck to generate my view as PDF. Any suggestion
You should google pdf viewer.
For example, if you wanted to view the PDF at the URL http://research.google.com/archive/bigtable-osdi06.pdf ,
you would use the URL: http://docs.google.com/viewer?url=http%3A%2F%2Fresearch.google.com%2Farchive%2Fbigtable-osdi06.pdf
then use HTML object tag and pass the url to "data" attribute. Attached this as html in your view.
Thanks
You have two options if you are working in a browser, (if you are working in mobile devices you should working with inAppBrowser cordova plugin)
1º With the mozilla-pdf library: http://mozilla.github.io/pdf.js/
2º With the pdfObject library: http://pdfobject.com/instructions.php
Both libraries are very complete to work with the browser but the mobile devices are other mistake...

Resources