I have Freemarker templates for generating pdf documents, that can have multiple pages based on variables content. I need generate unique code on each page, the generating logic takes page number as parameter. I have working utils class, callable from template used for dates formatting etc.
Ideally I would like to be able call my utils class like that, with something that would provide current page number on each page (simplified example):
<h1>Utils result: ${utils.generateUniqueNumber(pageNumber)}</h1>
I will probably need to place this code into header/footer, to achieve have it on each page.
Currently I have working page counter in footer defined using css:
<head>
<title>RESEA - Selection Notice OWCMS</title>
<style type="text/css">
.page-counter:before {
content: "Page "counter(page)" of "counter(pages)
}
</style>
</head>
Then used in footer , works as expected.
I'm not sure if actual paging is driven by Freemarker or CSS, so maybe I need to make CSS call my utils function.
Any advise, or relevant study source is welcome!
Related
How can i create empty view ui in vaadin-flow that must be empty header and body.
<html>
<head>
<!-- empty -->
</head>
<body>
<!-- empty -->
</body>
</html>
My created UI has many default tags and scripts inner header and body.
Flow will always generate its own internal metadata, initialization logic and so on into the HTML document. Without those, Flow couldn't work.
Flow is not intended to be used in cases where you care about exactly what is in the HTML. This is the trade off you get by using Flow - you give up some low-level control and instead you gain the ability to control what's shown in the browser using a high-level server-side Java API.
The things that are generated there should still not affect what's shown on the screen. You should thus get a blank screen if you define a view class that doesn't add any visible content, e.g.
#Route("empty")
public class EmptyView extends Div {
}
I've been using Play 2.0 framework for a couple of days now for a proof of concept application at my job. One of the first things I wanted to check out was the custom tag functionality, since it reminded me of HtmlHelpers in ASP.Net MVC. The thing is that I can't seem to make them work and was wondering if I'm misusing the feature or misunderstanding something.
Here's a simple example of what I want to do: I want to be able to use #script("scriptname.js") anywhere in the templates and have that subsitute the entire tags.
Here's what I got so far:
main.scala.html
#(title: String, scripts: Html = Html(""))(content: Html)
#import tags._
<!DOCTYPE html>
<html>
<head>
<!-- this is how I would like to use the helper/tag -->
#script("jquery.js")
#script("jquery-ui.js")
<!-- let views add their own scripts. this part is working OK -->
#scripts
</head>
<body>
#content
</body>
</html>
I created a subdirectory called "tags" under the app/views directory. There I created my script.scala.html tag/helper file:
#(name: String)
<script src="#routes.Assets.at("javascripts/#name")" type="text/javascript"></script>
The problem I'm having is that whenever I use #script() the output includes the #name parameter in it. For example #script("x.js") actually outputs
<script src="assets/javascripts/#name" type="text/javascript"></script>
What am I doing wrong?
For the record, I did read the documentation and search here, but neither of these links have helped me figure this out:
http://www.playframework.org/documentation/2.0.3/JavaTemplateUseCases
How to define a tag with Play 2.0?
#routes.Assets.at(...) evaluates the Scala expression routes.Assets.at(...) and substitutes the result into your output. There is no recursive evaluation that would allow you to have evaluate an expression textually to get that expression, which seems to be what you're expecting.
What you intend to do is achieved using
#routes.Assets.at("javascripts/" + name)
Is this possible? I want to be able to pass java bean data into javascript objects, but I'd really prefer not to muck up my jsp pages with a bunch of inline script tags. I like to keep my javascript separate in external files, but how do you accomplish something like this without using inline js?
<script type="text/javascript">
var variableFromServer = '${someBean.someProperty}';
</script>
You can create a JSON file with all the data and either include it inline or fetch the JSON through Ajax - that way you don't clutter the markup with data. See http://json-taglib.sourceforge.net/ for an example of a JSP-JSON template.
I'm not sure if this is worth it but one alternative will be to set the desired value in an input filed with type="hidden" and get it's in js. But this will also pass this parameter in GET and POST request from the form.
You can either do what you're doing in the snippet (do you consider that "inline JS"?), create a div of JSON with data in it (exposed as a single string) and process it, pass JS files through the JSP process (or use a different templating system for dynamic JS pages), etc.
I'm not a huge fan of processing JS files through JSP; I'll often create an object containing all the info my JS needs in a <script> tag at the bottom of the body before including my real JS. It's kind of lazy, but it's straight-forward.
One option that I've used in the past is to configure the servlet container to run the JSP interpreter on *.js files. How to set this up will depend upon what server you are running.
Note that if you want to access any request attributes this way you will need to set them up as part of the request that fetches the JavaScript file(s) (i.e. you will have to have a servlet in front of your JavaScript...or as an alternative you can use an include directive to bring in the scripts instead of a <script src='...'> tag). Session attributes you can access without needing to have a custom servlet in front of your JavaScript files.
I'm a fan of doing it the simple and easy way, so I'd create a single script element that has a minimal number of JS variables set from Java - ideally a single JS variable that is set to an object with different properties for all the different bits of data you need to pass through. Your Java code basically just outputs JSON that will be interpreted as an object literal in the JS. Immediately after that include any external scripts - because they're included afterwards they can use the variables already created.
You can put the above in the head or at the end of the body. (Or in the middle, but that doesn't really make sense.)
<html>
<head>
</head>
<body>
<!-- actual HTML markup here -->
<script>
var variableFromServer = '${someBean.someProperty}',
objectFromServer = /* jsp to spit out JSON here as appropriate */ ;
</script>
<!-- external files included after the above will be able to access
those variables -->
<script src="external1.js" type="text/javascript"></script>
<script src="external2.js" type="text/javascript"></script>
<script src="etc.js" type="text/javascript"></script>
</body>
</html>
You certainly don't need "a bunch of inline script tags" - even if it doesn't make sense to put all the values in a single object at least create all the variables in a single script element, and then all of your other JS can be in an external file.
(Add namespacing as required.)
My website has a consistant header and footer that I want on all pages.
What is the best way to do this?
The header will have some dynamic data also, based on the current view.
P.S Does freemarker have any sort of master page functionality? Where I can create a base template, then have other templates build upon the base?
Basically I want to design a template that has header and footer + a place holder for the main content area.
THEN, all other pages will inherit the main template (with header + footer), and then inject the action's render output into the templates main content area.
Define a macro like this in an import library:
<#macro page title>
<html><head><title>${title?html}</title></head>
<body>
<!-- header section -->
<#nested/>
<!-- footer section -->
</body></html>
</#macro>
and use the following template for all your pages:
<#import "common.ftl" as c/>
<#c.page title="custom page title">
<!-- custom page content -->
</#c.page>
You can find the spring-specific part in the spring reference and the freemarker part in the freemarker online docs
(It doesn't seem like Freemarker supports master pages, but through recursive use of include you can achieve a high level of code reuse)
Have a look at SiteMesh. I believe you will find it useful.
Do anyone know how to put Google adsense ads inside a GWT web application?
You can put the javascript-code from Adsense in the single HTML page that GWT starts with. This way the advertising will not be displayed in the same area as GTW but above/below the GWT code. For advertising that could be ok.
This example places a baner above the application:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>www.javaoracleblog.com</title>
<script type="text/javascript" language="javascript" src="com.javaoracleblog.aggregator.nocache.js"></script>
</head>
<body>
<script type="text/javascript"..
ADsense code here
</script>
<!-- OPTIONAL: include this if you want history support -->
<iframe src="javascript:''" id="__gwt_historyFrame" tabIndex='-1' style="position:absolute;width:0;height:0;border:0"></iframe>
</body>
</html>
In order to indicate to Google WT that the site of Google adsense can be trusted you need to add a regex matching URL to the -whitelist command line argument.
Note that this will probably not solve the problems desribed in the above "Why I dumped GWT" article.
According to this thread on AdSense:
Short version, you can't use Adsense
via Ajax without breaking the
programme policies/t&c's
Long version...
Ad code passed through an xmlhttp call
is not rendered, it's just treated as
text (hence, responseText). The only
way to execute js code is to use
"responseXML" coupled with the
"exec()" command.
For instance...
If your xml contains something along
the lines of:
This is the
content from the external
file javascript code
goes here
You would assign a variable (called
page_data for instance) using
ajax_obj.responseXML, run the XML
through a parser and run
exec(js variable or line from XML
here);
Not really helpful from an Adsense
standpoint, but that's how it's done.
It's also worth mentioning Why I dumped GWT:
Another problem were my adsense
banners. Since I didn’t have a lot of
content on the page, the banners were
sometimes off topic. An even bigger
problem was that the banners stayed
the same when people searched for
different keywords (since the ajax
refresh didn’t trigger an adsense
refresh). I solved this by doing the
search with a page refresh instead of
an ajax call. The ajax part of the
site was limited to sorting, faceting,
i18n and displaying tips.
You might check out the interview I did with InfoQ. It includes a sample chapter from my book and it happens to be on SEO.
It's not trivial, but I think the solutions in the chapter let GWT work nicely in an environment where SEO is important. The basic solution is to implement something I call 'bootstrapping'. This means that your pages take the info that would normally come across in GWT-RPC requests and serialize them into the page. The GWT widget then loads this information without an RPC request. While your page serializes the info into JavaScript, it's easy to also write a <noscript> to the page that can be used for SEO.
Take a look at the PDF included here: InfoQ GWT it goes into all the detail. The whole sample project is here: google code with source on github.
If you really want AdSense to be kinda "inside" GWT I'd use the Frame widget. Basically the Frame widget generates an <iframe ...> inside your GWT code. First I've thought iframe, UGH! But the <iframe> tag is still part of the HTML5 spec and has been even extended by some attributes that seem to be there for exactly this "sandboxing" purpose. And with corresponding CSS styling you will not have any scrollbars around your <iframe>.
And here is the actual solution:
You should put
<ui:style>
.sponsor {
border: 0em;
width: 20em;
height: 6em;
float: right;
display: inline;
}
</ui:style>
<g:HTMLPanel>
<g:Frame ui:field="sponsor" url="issue/extern/Google-AdSense.html" styleName="{style.sponsor}"/>
</g:HTMLPanel>
into your .ui.xml file and the logic into the corresponding .java file:
#UiField
Frame sponsor;
Also you should put the actual Google AdSense code (the <script> stuff) into a separate HTML file inside GWT's public folder which is - in this case - called Google-AdSense.html and is located inside the extern folder inside the public folder. issue (in the Frame url attribute) is in this case the GWT output folder.
And here is how it looks like: The ad in the upper right corner.
Btw this is also the way to embed the Google Analytics code into GWT.
Here is how I do it. I have a demo and source code here: http://code.google.com/p/gwt-examples/wiki/DemoGwtAdsene
You can use AdSense and GWT together without using frames or other hacks if you take some care in how you create your host pages.
The key is to include your AdSense code in the host page and then to manipulate the dom element containing the ad but to not detach it from the page. So you can reposition the ads into the body of your other gwt code as long as the dom structure is not changed.
If you do detach and reattach the containing dom element then it will appear to work in Chrome and Firefox but IE will show a blank space. I tried initially to move the ads DIV element into a DockLayoutPanel and thought everything was great until I belatedly tested it in IE.
So this is OK:
Element element = Document.get().getElmentById("ad");
element.getStyle().setPosition(ABSOLUTE);
element.getStyle().setTop(20, PX);
But this is not:
myPanel.add(ElementWrapper.wrap(element));
because adding a widget to another widget re-parents it.
This means that you cannot use any of the built-in LayoutPanel stuff to hold your ad div because Layout cannot wrap an existing element (It creates its own DIV in its constructor). You may be able to modify the layout panel stuff so it wraps an element and does not re-parent it... but I have not tried this yet.
I've tested the results in IE6+, Chrome and Firefox. Downside is that you cannot refresh the ads unless you load a new page. But in my case GWT was used to enhance html pages so that was not an issue. In any case... are users more likely to click on a different ad than one they read several times? Not sure it is so vital.
I could do this using DFP Small Business + Async Publisher tag + AdSense integration:
Here is the code:
On of your host page, put your publisher tag, something like:
<head>
<script type="text/javascript" src="http://www.googletagservices.com/tag/js/gpt.js"></script>
<script type="text/javascript">
var slot1 = googletag.defineUnit('/XXXX/ca-pub-YYYYYYYYYYYYYYY/transaction', [468, 60], 'div-gpt-ad-ZZZZZZZ-0').addService(googletag.pubads());
googletag.pubads().enableSingleRequest();
googletag.enableServices();
</script>
...
</head>
I've created a view with uiBinder, with a div with the id specified at the head, like this:
<g:HTMLPanel height="62px" width="100%">
<div id='div-gpt-ad-ZZZZZZZ-0' style='width:470px; height:60px;'>
</div>
</g:HTMLPanel>
On the onLoad() method of the view, you initialize the ad, like this:
#Override
protected void onLoad() {
setupAd();
}
public static native void setupAd() /*-{
$wnd.googletag.cmd.push(function() {$wnd.googletag.display('div-gpt-ad-ZZZZZZZ-0')});
}-*/;
To refresh the ad, just call refresh ad for the slot specified at head:
public static native void refreshAd() /*-{
$wnd.googletag.pubads().refresh([$wnd.slot1]);
}-*/;
That's all!
For more information about the publisher tag, check:
http://support.google.com/dfp_sb/bin/answer.py?hl=en&answer=1649768
Now I'm struggling to know how to make AdSense bot to craw my ajax application. I've implemented the Ajax Crawling scheme:
https://developers.google.com/webmasters/ajax-crawling/docs/getting-started
But I've got the information from AdSense forum that the AdSense bot (Mediapartners-Google) doesn't work with "escaped fragment" Ajax scheme.
Does anybody know if Google plan to make any progress on that?
This limits this approach to serve just interest based ads, since the context based ad serving depends on ajax crawling scheme.
Google's AdSense bot crawls your page to determine what ads to serve. Therefore, you should not put AdSense on pages with mostly dynamic content. It won't work well.
Maybe you should look into other ad programs?