We Keep Coding

js to determine if iframe contains images

I am working on an application that allows users to enroll in my program. My problem is that at the end of enrollment I generate a PDF for them to look over and accept the terms and e-sign. Sometimes the PDF server fails to stream and when that happens the iFrame just contains the alt text for the images. Is there a way to look into the iFrame and see if the images of the PDF are there or the alt text is there. That way I can keep them from proceeding and display an error message.
One Jsp looks like this
<c:forEach items="${images}" var="src">
<img src="${src}" alt="Image" />
</c:forEach>
This Jsp calls a generate function which makes the pdf and turns them into images which then saves them to a remote server. The controller then returns the first jsp as the view which should populate the iFrame.
<div id="image">
<img id="loading" src="/blah/resources/images/loading.gif" />
<iframe style="width: 775px; height: 600px; display: none"
src="blah/blah/pdf/generateImages?product=<c:out value="${fn:toLowerCase(enrollmentConversation.product.textKey)}" />&state=<c:out value="${stateCodeAbbreviation}" />&pdfGuid=<c:out value="${pdfGUIDForLookup}" />&sizeType=775/p2"
id="pdfIframe"
onLoad="jQuery('#pdfIframe').show();
jQuery('#loading').hide();
jQuery('.hideWhileWaiting').show();">
</iframe>
</div>
So is there a way to look at the iFrame and say does this contain the images or does it contain alt text="Images"?

Your iFrame can be another application which is cross-domain (or same application on same domain).
When you create pdf and converts them in to images, I suggest you to write SUCCESS/FAILURE entry in database.
Then from your calling application, using AJAX database call, you can easily figure out whether pdf->image was generated successfully or not.

iText - the PDF is not good

I have the following HTML:
<div align='center' style='height:50px'>
<H1>A Simple Sample Web Page</H1>
<IMG SRC='http://sheldonbrown.com/images/scb_eagle_contact.jpeg'>
<H4>By Sheldon Brown</H4>
<H2>Demonstrating a few HTML features</H2>
</div>
HTML is really a very simple language. '
<P>
'command, which will insert a blank line.If you would like to make a link or
bookmark to this page, the URL is:
<BR>
http://sheldonbrown.com/web_sample1.html
</center>
But the image appears behind the text instead of below!
What's wrong?
if iText cannot handle it - which library is better?
This is my code:
// step 1
Document document = new Document();
// step 2
PdfWriter.getInstance(document, new FileOutputStream("C:\\hello-world.pdf"));
document.open();
String content = "<div align='center' style='height:50px'><H1>A Simple Sample Web Page</H1><IMG SRC='http://sheldonbrown.com/images/scb_eagle_contact.jpeg'><H4>By Sheldon Brown</H4><H2>Demonstrating a few HTML features</H2></div>HTML is really a very simple language. '<P>' command, which will insert a blank line.If you would like to make a link or bookmark to this page, the URL is:<BR> http://sheldonbrown.com/web_sample1.html</center>";
// use the snippet for the PDF document
List<Element> objects = HTMLWorker.parseToList(new StringReader(content), null);
for (Element element : objects)
document.add(element);
document.close();

Do you have any css applied to this HTML? Have you achieved to view this HTML in any other way with a browser (which) ? It renders like you describe here: http://jsfiddle.net/TjUSJ/.
Maybe you want to remove the height styling property on that <div>? It seems like it renders on the middle, but it is actually rendernig at 50px from the top. See this other fiddle, without height styling: http://jsfiddle.net/TjUSJ/1/
Also, remember that the <center> tag is deprecated

The problem was that I was using an old version.
I switched to the last one - 5.1.2 and it works!

Hide/Show button for HTML email

I am generating an HTML email using a java program and need a Hide/Show button for some queries,
What would be an ideal approach for this?, shd i call a javascript from java program to do the same?.
I have a javascript module to do the show/hide feature but not sure how to integrate this to a java program.
Thanks..

Javascript is completely independent from any server-side framework or language, such as Java.
If you want to show or hide an HTML element on a page, try the following JS code:
document.getElementById("id").style.display = 'none';
And then, when you generate the HTML email using Java, include the queries you want to hide in a <div> with a specified ID.

Add a class to your generated html tags and use css to control the visibility and other styling.
<style type='text/css'>
.hid {display: none;}
</stle>
<div class='query1 hid'>...</div>
<div class='query2'>...</div>
<div class='query1 hid'>...</div>
Then update your javascript to manipulate the class attribute.
//in jQuery...
$("btn1").click(function() {
$(".query2").addClass("hid");
$(".query1").removeClass("hid");
});

GWT - easiest way to do a simple loading screen until file is loaded

When clicking a button, my GWT application returns a PDF file embedded in an HTML page which looks something like:
<html><head></head>
<body marginwidth="0" marginheight="0" bgcolor="rgb(38,38,38)">
<embed width="100%" height="100%" name="plugin"
src="http://myserver/?cmd=getMyPdf" type="application/pdf">
</body>
</html>
Problem is it can take a while for the server to create this PDF file, so what I want is a waiting screen with a loading animation which can have the PDF file download in the background, and then when the file is done, display the page as described above.
One obvious way would be to display a loading page, send an asynchronous command to the server and then once the onSucceed method is called, call the page as normal. Downside is I'd have to add some server-side logic for making the PDF creation work in the background...
Is there any way to do this client-side with the GWT API?

Did you see this stackoverflow question Detect when browser receives file download? Basically the answer given is that you set a cookie in the return response and wait on the client side for this cookie to be set. This can be done easily with GWT as it has a Scheduler (for the repeated timer check) and easy access to Cookies. You still need to make some server changes, but you don't have to create a background process.

I don't have the full answer, but the following code works for me in Safari, and maybe you can modify it, to make it work with other browsers, too (?):
<html><head>
<script type="text/javascript">
function showPdf() {
document.getElementById("loading").style.visibility = "hidden";
document.getElementById("pdf").style.visibility = "visible";
}
</script>
</head>
<body marginwidth="0" marginheight="0" bgcolor="rgb(38,38,38)">
<div id="loading"
style="position: absolute; background-color: white;">Loading...</div>
<iframe id="pdf" width="100%" height="100%" name="plugin"
src="http://myserver/?cmd=getMyPdf" onload="javascript:showPdf();"
style="visibility: hidden;"></iframe>
</body>
</html>
This is pure JavaScript - but could certainly be done with GWT, too. Note, that I'm using an iframe instead of embed, because embed doesn't really support the onload method (and embed is not a standard HTML element, as far as I remember).
The reason, why this may not be the full answer, is that Chrome fires the onload event as soon as the PDF starts downloading (but after the PDF generation on the server side has finished). I'm not sure, if this is what you want?

Javascript working in firefox but not IE or chrome

I am using gwt with google maps api and i have a set of tabbed infowindows. in one of them i want to have a recent tweets script running. it works fine in firefox, but it comes up as blank in ie and chrome. heres the HTML that im putting in the tab:
HTML recentTweets = new HTML(
"<body>"+
"<div style='color: #ffffff; background-color: #010101'>"+
"<script type='text/javascript' src='http://twitter.com/javascripts/blogger.js'></script>"+
"<script type='text/javascript' src='http://twitter.com/statuses/user_timeline/stephenathome.json?callback=twitterCallback2&count=3'></script>"+
"</div>"+
"</body>");
does anyone understand why this may be happening? thanks!

To add to what Javier Badia wrote, your best chance of making web pages that work in all popular browsers is to (1) use validators to make sure that your HTML and CSS adhere to standards, and (2) Understand which bits of the standard make certain browsers cranky.
There are many validators. I favor Marc Gueury's HTML Validator plugin for Firefox because it validates every page brought up without you having to ask it to. In the lower right corner of the browser window it puts a green checkbox or a red X right where it'll catch your eye. Having it "always on" makes it pretty much painless. Also, it validates offline, so there's no need to submit your page to an external server. Depending upon your needs, there may be other HTML validators that will suit you as well or better.
I won't recommend a CSS validator because I haven't found the good one yet.

That HTML is, forgive me, horrible. You have quotes in the wrong places (for example in the style attribute of the div), have body inside a table inside a tr inside a td (it should be the other way around). It's highly probable that Firefox manages to do something with it, but other rendering engines give up and display nothing. The HTML should look like this:
<body>
<div style="color: #ffffff; background-color: #010101">
<script type="text/javascript" src="http://twitter.com/javascripts/blogger.js"></script>
<script type="text/javascrip\" src="http://twitter.com/statuses/user_timeline/Stephenathome.json?callback=twitterCallback2&count=5"></script>
</div>
</body>
Which translated to Java is:
HTML recentTweets = new HTML(
"<body>"+
"<div style='color: #ffffff; background-color: #010101'>"+
"<script type='text/javascript' src='http://twitter.com/javascripts/blogger.js'></script>"+
"<script type='text/javascript' src='http://twitter.com/statuses/user_timeline/Stephenathome.json?callback=twitterCallback2&count=5'></script>"+
"</div>"+
"</body>");

If this is part of a GWT project is it happening locally? If so the problem is most likely just due to restrictions on local files place the project on a remote web server and it should work fine.