I am trying to make changes to my CSS while editing my web app. Any changes I make to the file are not reflected once I reload the page. I know it is linked to the correct CSS sheet as if I remove it from the directory the page loads plain HTML. Is there a way to make changes to the CSS and have them reflected straight away in the application? The CSS I have already written displays fine, it just does not change "live".
<link rel="stylesheet" type="text/css" href='#routes.Assets.at("stylesheets/main.css")'>
Definitely seems like a cache issue. CSS changes will change live when there is no cache system. Try doing a force reload of the page (ctrl+F5 win, Apple + R mac, F5 linux). You may also need to clear the playframework cache (see here for info on how to do that).
Related
The official sample is in scala here , but my project use java and plain html.
So I don't know how to translate this line
<link rel="stylesheet" href="#routes.Assets.versioned("assets/css/app.css")">
to a plain html file.
Shortly: you can't.
You need to put your raw HTML files in the views folder and change their names from foo.html to foo.scala.html, then you can write simple action which will render proper templates by reflection.
You can use them even if they doesn't contain any arguments.
Having a default Play configuration for routes:
GET /assets/*file controllers.Assets.versioned(path="/public", file: Asset)
If your file resides under following directory:
public
assets
css
app.css
You can translate the link to:
<link rel="stylesheet" href="/assets/assets/css/app.css">
Basically public directory is replaced with assets. Rest stays the same.
Keep in mind, if you amend Assets configuration in routes, your links might become dead.
I want to make the js and css files which are modified are to be downloaded at the client end when a page is accessed. I have these approaches
Manually add the modified timestamp the URL in each page.
I was thinking of writing a scriptlet code in all the jsp pages which will read all the js and css files modified timestamp and append it to the url in the page.
Add the modified timestamp while building the war file using ANT.
I have following questions.
Can any one let me know which would be a better solution of the above approaches? I am open to any other solutions also.
I went through this answer on SO and using it I can get the modified date but how to change the jsp file?
Is there anything similar to this in java?
In this situation better or best solution is took shape according to your exact requirements. I might derive simple questions like; Will your static resources in same server or included in your app in same server etc.. May be some other better ways..
I don't have ant experience so I can't talk about it now , but you can go with java way already.I want to share just idea/s. A filter(looks the .css or .js requests , gets resources and look resource lastmodified date or checksum return as version on response) or custom jsp tag will provide your requirements. Write a custom jsp tag <resource:static path="app.js"/> like that example. So it may look specific file's last modified date, assumed under the same document root, and it can produce <script type="text/javascript" src="app.js?version=8637"> like this result, so this result will bust the cache.
I have one webpage and a file on a server. How to read from file on every page load. I m using jsp. Is there any function available to check page load?
Every page load means that you come to server every time (cache is another story).
So, jsp is loaded from the server every time and here is simple directive to include file to jsp:
<%# include file="foo.html" %>
Keep in mind that server knows only about jsp changes but not about foo.html changes. So, if you change only foo.html server doesn't know about it. That's the reason why this approach is not common. It is used mostly for common templates and parts of all pages (like common footer) even there are other better modern techniques to do so (like CSS).
However, if you still want to use external file which constantly changes just remember that JSP is Java too and you can use whatever you do in Java (except it is not recommended - JSP should be simple viewer in MVC).
So, something like this will work:
<% out.write(Files.readAllBytes("foo.html")); %>
You can use any techniques to read file and write it to the response output.
Addition for your comment:
Text field is regular html. Input to it would be like this:
<input name=abc value="<% out.write(Files.readAllBytes("foo.txt")); %>">
but, again, please consider more modern techniques like DHTML, AJAX, CSS or simple JavaScript.
My assignment is to create a class in java and add tags through comments to make it look just like this http://docs.oracle.com/javase/7/docs/api/. My problem is though that the CSS doesn't stay with the html file. It comes out without the CSS. I've tried doing
<style>href="http://docs.oracle.com/javase/7/docs/api/stylesheet.css"</style>
but I can't get the CSS to stick. What am I doing wrong?
This is the way you link css files in html
<link href="http://docs.oracle.com/javase/7/docs/api/stylesheet.css" rel="stylesheet" type="text/css">
Did you add the lines as ususer2812693 mentioned. Just check whether, the css is file loaded into the browser using firebug. And also the css classes and ID s are correct with html elements' classes and ID s. Or else, first try to download the css file which you refer and, try to call it locally from your html page.
how a browser open a saved html page ? It must have to run html file and other files from hard-disk. But how can a browser find the link of the other small files ? Is a browser change the link of the other small files of html page from url to hard-disk location?
How it can do that? I want to do the same thing in my application. But I could not figure out the process.
Most browsers store attached resources (Style sheets, images, scripts and the like) in a separate folder named after the saved page.
All references to resources are then converted to relative references, like so:
<img src="name_of_saved_folder/image.jpg">
the browser will then look in name_of_saved_folder relative to the saved HTML document's location.
If the HTML file is moved to a different locations, the references will usually no longer work.
Internet Explorer introduced the very interesting concept of an archived HTML format in 1999 that combines all resources in one file, but sadly, this hasn't yet caught on in terms of global, real-world support in all browsers.
Instead of coding this on your own, you may be able to interface with an existing tool like wget that can do all the grabbing for you. For most programming languages, there are probably related questions on Stack Overflow already on how to best store a HTML page and its resources locally.
You just have to use relative URLs, so the browser will load the external files (images, etc) relatively to the location of the HTML page.
So if your HTML page is saved at file:///some/directory/page.html, if you have a <img src="image.png">, the browser will load this image from file:///some/directory/image.png.