Opening and printing large files in javascript - javascript

I am trying to open a local pdf file and print it.It works for files upto 5 kb,but it takes time to load for big files within 1000ms and hangs.I want it to be dynamic and need not fix the timeout .
I tried window.onload but it does not work.Also i dont want to add any onload event to the printing page.
Is there a efficient solution
var win=window.open(printUrl);
setTimeout(function() {
win.print();
win.close();
}, 1000);

Found an workaround for this.Have used PDF Javascripts and embedded a Javascript to print the file.This makes sure that the file is only printed once the page has been loaded.
I had used PDFbox to parse PDF contents and added the below:
PDActionJavaScript javascript = new PDActionJavaScript("this.print();");

Today it seems it's not possible to be notified when a PDF file is loaded in your pages.
Events DOMContentLoad and load are not triggered in iframes, embed, object or popup windows when handling PDF files.
However, there's hope for the future, the HTML5 specs says about the embed tag:
Fetching the resource must delay the load event of the element's
document.
But so far, in Chrome 38 and IE11 it's not true yet, the document load event is fired as soon as the HTML is loaded.

Related

Javascript: printing the contents of iframe on page load not working

background: i have a page in my web app with an iframe in it that displays a pdf file.
I require a browser's print preview window to appear as soon as this page in my web app loads. The print preview window will contain the contents of the iframe and print it.
Currently, i bind a function on the iframe's load event as follows:
$('#iframe').load(function () {
$("#iframe").get(0).contentWindow.print();
});
This works fine when i debug locally. However when i upload to server, the print preview screen will not automatically popup. In fact i have to first click on a button or element for it appear. Is there a way around this?
Thanks in advance..
Try this,
window.frames['#iframe'].focus();
window.frames['#iframe'].print();
Numerous methods using either jQuery or plain javascript did not fix the issue. However, after i set a 1 second delay to the print function, it worked!
setTimeout(function () {
$("#iframe").get(0).contentWindow.print();
}, 1000);
I suppose it has something to do with the server. It probably needs extra time to process the pdf in the iframe

Forcing redraw/repaint of a DOM element in firefox after page load

I've looked through similar threads and tried everything that was suggested there to no avail.
I'm trying to replace an image after the page was loaded by changing it's src attribute once I have a new location. I want to replace the image with a local image.
Directly changing the src attribute via img.src = urlString; or using the setAttribute() method sets the src but doesn't redraw the image in the loaded page. I used window.alert(img.src); to check that the src attribute is really changed.
I've used the following code snippet from here to force a redraw.
var n = document.createTextNode(' ');
var disp = img.style.display;
img.appendChild(n);
img.style.display = 'none';
img.style.display = disp;
n.parentNode.removeChild(n);
Nothing seems to work. Is it because the page is loaded or is it because I am using a local file?
The local file is in %AppData%\temp, could this be a permission problem? The browser console doesn't throw any error. I do not want to refresh the entire page since someone could be typing in a form and they're going to lose their data.
Any input would be appreciated. Thanks.
EDIT : A bit of clarification.
I use an extension to inject a script in every window. Once a window loaded a page I send the images to another script for processing, the script then returns an event to the window with a location to a new file. Once the event is caught, a function is called to change the src attribute of a particular image. I've checked everything, the src is changed but the browser doesn't display the new image.
Another edit :
There doesn't seem to be a permission problem since I can access the file from the address bar using file:///pathtofile/. With external urls (e.g. http://) it seems to work even after page load. How can I make it work with local urls?
Firefox does not allow untrusted pages to load data from file:// URIs in any way. That includes loading images from file:// URIs.
To see why, consider what happens if a page does <img src="file:///dev/tty"> on Linux or Mac, for example. Similar issues exist on some Windows versions if you try to read from file:///c:/con and the like...

executing code after download starts

I would like to add an animated loader image, which would appear after the user triggers downloading of an attachment, and disappear after the download actually starts - when the browser starts downloading the file (or displays the download confirmation dialog). The reason for it is that the attachments are quite complex documents generated on the server side, which takes some time and an animated loader would reassure the user that the page is working (and disable the download button until the download starts).
The attachment has properly set Http headers.
Here is what it looks like now:
var link = $("#download-link");
link.click(function () {
link.displayLoader();
$(document).load(link.attr("href"), function () {
link.hideLoader();
});
return false;
});
The main problem is that the load method obviously doesn't do what I would like to achieve. Is there a way to capture the actual start of downloading, triggered by window.location change?
You can do is.
Disable the whole screen until the Download is ready ( the server side processing).
And the user clicks a button download and the user directly downloads the file.
Approaches followed by most of the downloading website.
eg. Mediafire.com
PS: Disable the whole screen mean a System type dialog. disabling other options.
Why don't you show the loader image first?
If I understand correctly now, the problem is that you want the loader image to disappear once the file begins to download, and at present it disappears once the file has finished downloading?
I don't think there's an easy way to do it with jQuery, but if you drop down to using the normal JavaScript XMLHttpRequest object directly, you will get several callbacks at various stages of downloading that you can access through the readyState property.

Automatic printing PDF programmatically in IE6

I would like to be able to print a PDF document automatically when a user clicks on a print button. Currently what the way I am doing it is I render the PDF and save to the server disk and have it appear in an iframe then I tried to print the content of the iframe using javascript:print(). however what is printed is an empty html page.
I am doing this because using the norm HTML print is wrecking the layout of the webpage i am trying to print. so i'm rendering the page to a pdf format to print the webpage. i don't want the users to be able to save the pdf hence i am trying to slient print the pdf page. hence i am loading it in an iframe by changing the src in the code behind and re-rendering the page and then triggering the js script.
function printPDF(){
document.iframe_printArea.focus();
document.iframe_printArea.print();
}
I am wondering if it is possible to print a pdf document loaded in an iframe using print() or whether this is even possible. I have extensively googled on this and have yet to come up with any solutions that works for a web application. Most of the resources are devoted to C# windows app. The platform I am using is .NET C#.
First of all I'm very sorry for whom that have to deal with IE6.
There is an non-standard DOM event developed by Microsoft that fire before print. It's onbeforeprint event (docs). What you can do is hiding everything but the iframe and shrink the iframe to the window size before print. and after print reverse the document to normal statues with onafterprint event.
function window.onbeforeprint()
{
// hide other elements and shrink the iframe
}
function window.onafterprint()
{
// unde what heppened onbeforeprint
}

Determining flash component has loaded

I have an HTML page containing a flash file,
I need to write code in javascript that would execute once the flash file is loaded.
(its actually the code to overide the __flash__removeCallback to solve the famous line:52 bug refer: https://bugs.adobe.com/jira/browse/FP-529)
The actual solution for the bug is doing so on window.onUnload. But this is not possible in my cases since the flash component is in an iframe and the window.onUnload is never fired at all.
For the code to not display an error, i need to track event when the flash file has finished loading on screen.
does any one here have a solution to track down when the flash file has completed loading
OR
Any other solution for the bug that does not involve tracking window.onUnload ?
If you embed the flash file with SWFObject, you can used embedSWF's "callbackFn" parameter which is called when the file is loaded.
Avoid using an iframe. Move the inner html of the iframe to a div element. Then you will probably be able to catch the event.

Categories