It seems that prior to GWT 1.5, element.toString() did the right thing. When I moved to GWT 1.5.3, I had to switch to using "DOM.toString( elem );"
jay On Apr 3, 11:53 am, HommeDeJava <[email protected]> wrote: > Greetings folks, > > I have an application developed in GWT and I would like to print tall > GWT widgets (i.e. taller than one page). > I found a method that works with Safari and Chrome browsers but it > didn't work with FireFox. > Maybe, it's related to the fact that Safari and Chrome are based on > the Webkit html rendering technology while Firefox is based on Gecko. > > Anyway, I have tried to find a new approach. > > So, I have just tested the Print class from Andre Freller (the latest > version) in order to print GWT widgets. > > http://groups.google.com.my/group/Google-Web-Toolkit/browse_thread/th... > > I don't know why but in all my tests trying to print any widget (even > a short one) result in printing a frustratng (toString()) type of > message like [object HTMLDivElement] or [object] > > Many people seems to succeed using this code, so I'm wondering what I > could missed... > > So, I'm posting on the GWT Google Group, maybe someone else has > encountered the same problem and found a solution. > > I've done my test using Windows XP, GWT 1.5.3 and FireFox 3.0.8, > Chrome, IE 7 and Safari 3 > > So below, you will find the code have wrote to benchmark along with > the printing class > > Thanks fo any help you can provide > > Claude Coulombe > OpenSyllabus project > Montreal > > --------------------------------------------------------------------------- > ----------------- > the PrintTest.html file > --------------------------------------------------------------------------- > ----------------- > > <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> > <html> > <head> > <meta http-equiv="content-type" content="text/html; > charset=UTF-8"> > <!-- --> > <!-- Any title is fine --> > <!-- --> > <title>PrintTest</title> > > <!-- --> > <!-- This script loads your compiled module. --> > <!-- If you add any GWT meta tags, they must --> > <!-- be added before this line. --> > <!-- --> > <script type="text/javascript" language="javascript" > src="br.com.freller.tool.PrintTest.nocache.js"></script> > </head> > > <!-- --> > <!-- The body can have arbitrary html, or --> > <!-- you can leave the body empty if you want --> > <!-- to create a completely dynamic UI. --> > <!-- --> > <body> > > <!-- Test Andre Freller Printing Class --> > <iframe id="__printingFrame" style="width:0;height:0;border:0"></ > iframe> > <div id="printPageButton"></div> > <div id="printWidgetButton"></div> > <div id="printDOMByIdButton"></div> > <div id="printStyleWidgetButton"></div> > <div id="tallWidget"></div> > > </body> > </html> > > --------------------------------------------------------------------------- > ----------------- > the PaperPrintTest.css file > --------------------------------------------------------------------------- > ----------------- > > body { > float:none; > position:relative; > background-color: white; > overflow: visible; > > } > > .TallWidgetStyle { > background-color: #C3D9FF; > padding: 2px; > margin: 2px; > font-size: 10px; > font-weight: normal;} > > .TallWidgetPaperStyle { > float:none; > position:relative; > background-color: white; > overflow: visible; > font-weight: bold; > > } > > --------------------------------------------------------------------------- > ----------------- > the PrintTest.gwt.xml file > --------------------------------------------------------------------------- > ----------------- > <module> > > <!-- Inherit the core Web Toolkit stuff. > --> > <inherits name='com.google.gwt.user.User'/> > > <!-- Inherit the default GWT style sheet. You can change > --> > <!-- the theme of your GWT application by uncommenting > --> > <!-- any one of the following lines. > --> > <inherits name='com.google.gwt.user.theme.standard.Standard'/> > <!-- <inherits name='com.google.gwt.user.theme.chrome.Chrome'/> > --> > <!-- <inherits name='com.google.gwt.user.theme.dark.Dark'/> > --> > > <!-- Other module inherits > --> > > <!-- Specify the app entry point class. > --> > <entry-point class='br.com.freller.tool.client.PrintTest'/> > > <!-- Specify the application specific style sheet. > --> > <stylesheet src='PaperPrintTest.css' /> > > </module> > --------------------------------------------------------------------------- > ----------------- > the Print.java file (the Printing class from Andre Freller) > --------------------------------------------------------------------------- > ----------------- > > package br.com.freller.tool.client; > > /** > * <pre> > * Generic printing class > * can be used to print the Window it self, DOM.Elements, UIObjects > (Widgets) and plain HTML > * package br.com.freller.tool.client; > * Usage: > * You must insert this iframe in your host page: > * <iframe id="__printingFrame" style="width:0;height: > 0;border:0"></iframe> > * > * Window: > * Print.it(); > * > * Objects/HTML: > * Print.it(RootPanel.get("myId")); > * Print.it(DOM.getElementById("myId")); > * Print.it("Just <b>Print.it()</b>!"); > * > * Objects/HTML using styles: > * Print.it("<link rel='StyleSheet' type='text/css' > media='paper' href='/paperStyle.css'>", RootPanel.get('myId')); > * Print.it("<style type='text/css' > media='paper'> .newPage { page-break-after: always; } </style>", "Hi<p > class='newPage'></p>By"); > * </pre> > */ > > import com.google.gwt.user.client.Command; > import com.google.gwt.user.client.DeferredCommand; > import com.google.gwt.user.client.Element; > import com.google.gwt.user.client.Window; > import com.google.gwt.user.client.ui.UIObject; > > public class Print { > > public static native void it() /*-{ > $wnd.print(); > $wnd.alert("I am printing a page."); > }-*/; > > public static native void buildFrame(String html) /*-{ > var frame = $doc.getElementById('__printingFrame'); > if (!frame) { > $wnd.alert("Error: Can't find printing frame."); > return; > } > var doc = frame.contentWindow.document; > doc.open(); > doc.write(html); > doc.close(); > $wnd.alert("I have build a printing frame."); > }-*/; > > public static native void printFrame() /*-{ > var frame = $doc.getElementById('__printingFrame'); > frame = frame.contentWindow; > frame.focus(); > frame.print(); > $wnd.alert("I am printing the frame."); > }-*/; > > public static class PrintFrame implements Command { > public void execute() { > printFrame(); > } > } > > public static PrintFrame printFrameCommmand = new PrintFrame(); > > public static void it(String html) { > try { > buildFrame(html); > DeferredCommand.addCommand(printFrameCommmand); > } catch (Throwable exc) { > Window.alert(exc.getMessage()); > } > } > > public static void it(UIObject obj) { > it("", obj.getElement().toString()); > } > > public static void it(Element element) { > it("", element.toString()); > } > > public static void it(String style, String it) { > it("<html><head>"+style+"</head>\n<body>"+it+"</body></html>"); > } > > public static void it(String style, UIObject obj) { > it(style, obj.getElement().toString()); > } > > public static void it(String style, Element element) { > it(style, element.toString()); > } > > } > > Greetings folks, > > I have an application developed in GWT and I would like to print tall > GWT widgets (i.e. taller than one page). > I found a method that works with Safari and Chrome browsers but it > didn't work with FireFox. > Maybe, it's related to the fact that Safari and Chrome are based on > the Webkit html rendering technology while Firefox is based on Gecko. > > Anyway, I have tried to find a new approach. > > So, I have just tested the Print class from Andre Freller (the latest > version) in order to print GWT widgets. > > http://groups.google.com.my/group/Google-Web-Toolkit/browse_thread/th... > > I don't know why but in all my tests trying to print any widget (even > a short one) result in printing a frustratng (toString()) type of > message like [object HTMLDivElement] or [object] > > Many people seems to succeed using this code, so I'm wondering what I > could missed... > > So, I'm posting on the GWT Google Group, maybe someone else has > encountered the same problem and found a solution. > > I've done my test using Windows XP, GWT 1.5.3 and FireFox 3.0.8, > Chrome, IE 7 and Safari 3 > > So below, you will find the code have wrote to benchmark along with > the printing class > > Thanks fo any help you can provide > > Claude Coulombe > OpenSyllabus project > Montreal > > --------------------------------------------------------------------------- > ----------------- > the PrintTest.html file > --------------------------------------------------------------------------- > ----------------- > > <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> > <html> > <head> > <meta http-equiv="content-type" content="text/html; > charset=UTF-8"> > <!-- --> > <!-- Any title is fine --> > <!-- --> > <title>PrintTest</title> > > <!-- --> > <!-- This script loads your compiled module. --> > <!-- If you add any GWT meta tags, they must --> > <!-- be added before this line. --> > <!-- --> > <script type="text/javascript" language="javascript" > src="br.com.freller.tool.PrintTest.nocache.js"></script> > </head> > > <!-- --> > <!-- The body can have arbitrary html, or --> > <!-- you can leave the body empty if you want --> > <!-- to create a completely dynamic UI. --> > <!-- --> > <body> > > <!-- Test Andre Freller Printing Class --> > <iframe id="__printingFrame" style="width:0;height:0;border:0"></ > iframe> > <div id="printPageButton"></div> > <div id="printWidgetButton"></div> > <div id="printDOMByIdButton"></div> > <div id="printStyleWidgetButton"></div> > <div id="tallWidget"></div> > > </body> > </html> > > --------------------------------------------------------------------------- > ----------------- > the PaperPrintTest.css file > --------------------------------------------------------------------------- > ----------------- > > body { > float:none; > position:relative; > background-color: white; > overflow: visible; > > } > > .TallWidgetStyle { > background-color: #C3D9FF; > padding: 2px; > margin: 2px; > font-size: 10px; > font-weight: normal;} > > .TallWidgetPaperStyle { > float:none; > position:relative; > background-color: white; > overflow: visible; > font-weight: bold; > > } > > --------------------------------------------------------------------------- > ----------------- > the PrintTest.gwt.xml file > --------------------------------------------------------------------------- > ----------------- > <module> > > <!-- Inherit the core Web Toolkit stuff. > --> > <inherits name='com.google.gwt.user.User'/> > > <!-- Inherit the default GWT style sheet. You can change > --> > <!-- the theme of your GWT application by uncommenting > --> > <!-- any one of the following lines. > --> > <inherits name='com.google.gwt.user.theme.standard.Standard'/> > <!-- <inherits name='com.google.gwt.user.theme.chrome.Chrome'/> > --> > <!-- <inherits name='com.google.gwt.user.theme.dark.Dark'/> > --> > > <!-- Other module inherits > --> > > <!-- Specify the app entry point class. > --> > <entry-point class='br.com.freller.tool.client.PrintTest'/> > > <!-- Specify the application specific style sheet. > --> > <stylesheet src='PaperPrintTest.css' /> > > </module> > --------------------------------------------------------------------------- > ----------------- > the PrintTest.java file (my testing class) > --------------------------------------------------------------------------- > ----------------- > > package br.com.freller.tool.client; > > import br.com.freller.tool.client.Print; > > import com.google.gwt.core.client.EntryPoint; > import com.google.gwt.user.client.DOM; > import com.google.gwt.user.client.ui.Button; > import com.google.gwt.user.client.ui.ClickListener; > import com.google.gwt.user.client.ui.Composite; > import com.google.gwt.user.client.ui.HasHorizontalAlignment; > import com.google.gwt.user.client.ui.Label; > import com.google.gwt.user.client.ui.RootPanel; > import com.google.gwt.user.client.ui.TextArea; > import com.google.gwt.user.client.ui.VerticalPanel; > import com.google.gwt.user.client.ui.Widget; > > /** > * Entry point classes define <code>onModuleLoad()</code>. > */ > public class PrintTest implements EntryPoint { > > private static class TallWidget extends Composite { > > public TallWidget() { > super(); > VerticalPanel container = new VerticalPanel(); > container.setHorizontalAlignment > (HasHorizontalAlignment.ALIGN_CENTER); > container.add(new Label("Andre Freller Class Printing Test")); > TextArea textContainer = new TextArea(); > textContainer.setHeight("10000px"); > String veryLongText = > "Lorem ipsum dolor sit amet, consectetur adipiscing elit. > Phasellus laoreet sollicitudin leo. " + > "Suspendisse erat enim, lacinia et, aliquet ut, dictum sit amet, > nisl. Integer fermentum dolor " + > "sed augue. Nam suscipit, felis eu consequat rutrum, urna lorem > pellentesque velit, ut sollicitudin " + > "ante neque in felis. Suspendisse pharetra, tellus eget malesuada > dignissim, lectus velit feugiat " + > "augue, facilisis convallis ante felis id urna. Ut non sem. Fusce > vestibulum auctor enim. Donec " + > "vestibulum dui eu nulla. Sed nibh. Integer feugiat pharetra > urna. Integer tempus tellus condimentum " + > "risus. Maecenas viverra nunc eget massa. Nullam libero felis, > vestibulum id, sollicitudin eu, congue " + > "vitae, lorem. Nullam urna arcu, faucibus at, condimentum eu, > semper quis, erat. Vivamus ultrices nunc " + > "vitae lorem. Duis vehicula mauris quis libero. Integer elit. > Proin id justo. Donec eget ipsum." + > " copy and paste as many times as needed the above paragraph "; > textContainer.setText(veryLongText); > container.add(textContainer); > container.setBorderWidth(2); > initWidget(container); > this.addStyleName("TallWidgetStyle"); > } > } > > public void onModuleLoad() { > final TallWidget myWidget = new TallWidget(); > > RootPanel.get("tallWidget").add(myWidget); > > Button printPageButton = new Button("Print Page"); > printPageButton.addClickListener(new ClickListener() { > public void onClick(Widget sender) { > myWidget.addStyleName("TallWidgetPaperStyle"); > Print.it(); > myWidget.removeStyleName("TallWidgetPaperStyle"); > } > }); > RootPanel.get("printPageButton").add(printPageButton); > > Button printWidgetButton = new Button("Print TallWidget"); > printWidgetButton.addClickListener(new ClickListener() { > public void onClick(Widget sender) { > myWidget.addStyleName("TallWidgetPaperStyle"); > Print.it(RootPanel.get("tallWidget")); > myWidget.removeStyleName("TallWidgetPaperStyle"); > } > }); > RootPanel.get("printWidgetButton").add(printWidgetButton); > > Button printDOMByIdButton = new Button("Print DOM TallWidget"); > printDOMByIdButton.addClickListener(new ClickListener() { > public void onClick(Widget sender) { > myWidget.addStyleName("TallWidgetPaperStyle"); > Print.it(DOM.getElementById("tallWidget")); > myWidget.removeStyleName("TallWidgetPaperStyle"); > } > }); > RootPanel.get("printDOMByIdButton").add(printDOMByIdButton); > > Button printStyleWidgetButton = new Button("Print TallWidget with > Style"); > printStyleWidgetButton.addClickListener(new ClickListener() { > public void onClick(Widget sender) { > myWidget.addStyleName("TallWidgetPaperStyle"); > Print.it("<link rel=StyleSheet type=text/css media=paper > href=PaperPrintTest.css>",RootPanel.get("tallWidget")); > myWidget.removeStyleName("TallWidgetPaperStyle"); > } > }); > RootPanel.get("printStyleWidgetButton").add > (printStyleWidgetButton); > } > > > > } --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Google Web Toolkit" group. To post to this group, send email to [email protected] To unsubscribe from this group, send email to [email protected] For more options, visit this group at http://groups.google.com/group/Google-Web-Toolkit?hl=en -~----------~----~----~----~------~----~------~--~---
