I have a Java Web Project and I want to have a split test in my application. I want to be able to select different header images according to the passed query string. For instance, if the user retrieves the following url:
http://www.website.com/?header=1
Then I show the image A for the header. If the user retrieves the url like this:
http://www.website.com/?header=2
The I show the image B.
I'm already receiving the 'header' value in my html by expression language variable. The problem is that I set the image url in a CSS file. How can I pass this variable to the CSS file to load the correct image?
PS: I know I can apply the style in the HTML file, but I want to extract all of my styles in the CSS file.
That's not possible unless you use something like LESS.
What you could do is make separate CSS files, use the querystring to determine your needs with Java Web and load the one you need depending on the situation.
include 2 different classes for the different background header images in your css, then apply the different class in coding.
.header1 {
background-image: url(background1.jpg);
}
.header2 {
background-image: url(background2.jpg);
}
If I understood your question correctly, I believe you can do this by applying different CSS class to your header based on what input you gets from header.
You have three basic options:
Switch CSS files based on the query parameter, with one CSS file per header image - you can have these just set the header image, and have the static styles in their own file.
Use something like LESS or SASS.
Write your CSS as a JSP file or dynamically generated via servlet, and change the style dynamically on the server.
Divide your CSS styles into 3 parts:
common.css
header1.css
header2.css
Depending on your headers, you can include either of headerN.css classes. You can solve it also on server side (generating different includes in <head>) or on client side (use javascript to extract the header value and include the proper css dynamically)
Related
If I have a Browser and I call browser.loadURL("view-source:http://www.example.com); it goes straight to Chromium's source viewer. Is there a way to do the same thing with the loadHTML or loadData methods?
Or is there a way to programatically switch it to that view once the page has loaded?
The view-source URL prefix is a specific URI scheme that is handled by Chromium itself. Therefore, this prefix can be used with URLs only.
The general purpose of the loadHTML() and loadData() methods is to load and render the HTML string as a regular web page instead of displaying the source code in the browser. Therefore, there is no straightforward approach to make these methods display the source code instead of rendering the page.
However, you can consider saving the HTML to a temporary file and then load it as shown below:
browser.loadURL("view-source:file:///f:\\data\\contents.html");
I notice that most GXT/GWT applications put the nocache.js file after the body tag. And few seem to put in the include in the header tag. Why is that?
Given the fact that the GWT script tag will be evaluated synchronously (the tag), but fetched asynchronously (the code, into an iframe), I don't see why not put it as the very first thing. Time saved!
Unless, you have some kind of complex logic that cannot have the chance to be properly displayed before the onModuleLoad() call (e.g., images evaluated but still not fetched), much like Steffen Schäfer pointed out. But you can defer you app startup for them though.
For more info, have a look here.
From my point of view there are 2 cases:
If you use GWT to only enhance your page that is generated on the server side then put the <script> at the end. That allows your browser to render the initial content of the page before parsing the JS code.
If you built a single page application that is completely generated by GWT on the client side, there's no content to be initially shown. In that case you can put the <script> to the head.
Be aware that 1. also applies if you implemented a loading animation or placeholder content to be initially shown.
I'm working on some reports on a Java web application. One of the requirements I have is to be able to export the report data as PDF. The reports are made up of several elements, mostly HTML tables and SVG charts courtesy of Highcharts.
Highcharts has a built-in function that exports their graphics to PDF, but I need a document that contains the other HTML data as well, so there's no other choice but to write my own code. Since the Highcharts graphics are created on the client-side, I need to submit their SVG output to the server in order to be able to include the images on the PDF document.
My first, perhaps naive, approach, was to have a form with a hidden input such as:
<form id="fileExport" method="POST" action="servlet/FileExportServlet">
<input type="hidden" id="svgParam" name="svgParam" />
</form>
And then I would set the hidden input's value to the graphic's svg code like this:
$("div#getPDF").live("click", function()
{
//the chart svg data is inside a div with class highcharts-container
//I copy the svg to the hidden input that I will submit
$("#svgParam").val($(".highcharts-container").html());
//submit the form with the hidden input
$("#fileExport").submit();
});
The problem I'm facing, is that apparently the SVG data is too large for the hidden input's value, so when it reaches the server it is truncated. I'm submitting the form in this fashion because I don't wan't to refresh the page in order to have the download start.
I was thinking that perhaps I could encode the SVG element as a Data URI, but I suppose that it wouldn't prevent truncation either, although it would produce a shorter string most of the time.
Does anyone know a way to transfer the SVG data back to the server? (Preferably allowing some other parameters as well)
Thanks
If your form is using the POST action, data will not get truncated.
Having said that, using a text camp to send binary data is unsettling. I would try either:
a) Sending it as a file attachment (but then probably your user would need to set the field value).
b) Sending it directly to your server (for example, using CURL), separately from your HTML
c) At the very least, keep using the hidden field but at least using encode64 with the data.
http://support.xbox.com/en-us/contact-us uses javascript to create some lists. I want to be able to parse these lists for their text. So for the above page I want to return the following:
Billing and Subscriptions
Xbox 360
Xbox LIVE
Kinect
Apps
Games
I was trying to use JSoup for a while before noticing it was generated using javascript. I have no idea how to go about parsing a page for its javascript generated content.
Where do I begin?
You'll want to use an HTML+JavaScript library like Cobra. It'll parse the DOM elements in the HTML as well as apply any DOM changes caused by JavaScript.
you could always import the whole page and then perform a string separator on the page (using return, etc) and look for the string containing the information, then return the string you want and pull pieces out of that string. That is the dirty way of doing it, not sure if there is a clean way to do it.
I don't think that text is generated by javascript... If I disable javascript those options can be found inside the html at this location (a jquery selector just because it was easier to hand-write than figuring out the xpath without javascript enabled :))
'div#ShellNavigationBar ul.NavigationElements li ul li a'
Regardless in direct answer to your query, you'd have to evaluate the javascript within the scope of the document, which I expect would be rather complex in Java. You'd have more luck identifying the javascript file generating the relevant content and just parsing that directly.
AJAX is a very powerful tool so I am struggling with it :-).
Is there any way or API(in java) so that I can get the HTML code which is generated by AJAX?
Generally, AJAX make use of inner HTML code and hence this inner HTML code is missing when I look into the page source of a page.
e.g click here
Just see the section OTHER NEWS. The content is populated by AJAX. When I look into the page source the code is not there.
I need this HTML code through a java program. How can I get it?
To have a Java application use the content received via AJAX, you need to first find the URLs from where the content is getting called from. In case this it would be http://itm2083.com/get_wwo_content.php?featureGroupId=8355&featureDisplayLimit=1&sponsorName=vortalx&wwoDivCounter=5&domainUrlForWWo=http://item2083.com/&featureImgDisplay=FLAG_TRUE&featureGroupImageWidthLimit=200&featureGroupDefaultImageUrl1=http://wwo.itmftp.com/75x75.gif&featureGroupDefaultImageUrl2=http://wwo.itmftp.com/75x75.gif&featureGroupDefaultImageUrl3=http://wwo.itmftp.com/75x75.gif
The featureGroupId= parameter has 5 IDs: 8355, 8359, 8367, 8369, 8429. Use these to pull the content from the Other News box.
The featureDisplayLimit= parameter determines how much content is pulled from the server.
If you want the nice HTML as well, the Java app will have to recreate it, as the HTML rendered on the site is created by JavaScript code.