We are creating a Tapestry 5 webapp with an external designer creating and maintaining the css-files of the application.
We would like him to be able to make changes to the css-files without the need to change the webapp, prefarably in the configurable path in the filesystem.
So what would the best way to do this with Tapestry 5?
There is a JIRA for the ability to use a filesystem asset. Someone has posted patches that should let you do it but it hasn't made it into a release yet. If you do that, you could use #IncludeStyleSheet(value={"file:path_to_css_file"}) in your layout template.
An alternate way would be to stream it using a method like this one. The last paragraph suggests that you can include a streamed response in your template so in this case you could do <link rel="stylesheet" type="text/css" href="${externalStylesheet}"/>. Then create a streamed response that reads the stylesheet from a known path on the server. Or you could store it in a blob in the database and stream from there - that way you could also create a page to let the designer upload new versions.
Related
I created a .js and .css file from a project and added them to a github release
https://github.com/natearn/react-vim-tips/releases
I then attempted to add the code directly to a webpage using an external script and stylesheet (linking directly to the files in the release).
<script type="text/javascript" src="https://github.com/natearn/react-vim-tips/releases/download/1.0.0/VimTips.js"></script>
<link rel="stylesheet" type="text/css" href="https://github.com/natearn/react-vim-tips/releases/download/1.0.0/VimTips.css">
For context, the script creates a global function which renders a react component, which I execute elsewhere on the page.
The network requests for the files succeed after a redirect (so 302 then 200), the javascript loads and runs, but the css rules do not get added to the page.
When I copy the stylesheet and fetch it locally, it works. So I believe the problem is in the mechanism of delivery from the CDN.
Can someone tell me what might be happening here, and how I can fix it?
Remember that GitHub repos are different from web hosting services. You are correct that the issue is related to how the .css file is being served (or rather, in your case, not being served at all). There are a few options:
1) Create a gh-pages branch and reference your stylesheet from there i.e. https://natearn.github.io/react-vim-tips/stylesheets/VimTips.css. This should actually serve your CSS properly.
2) Use RawGit to generate a proper CDN link to your VimTips.css file. I gave this a shot and have a working example at this Stackblitz: https://stackblitz.com/edit/react-bcjjdo?file=index.js. Here's the CDN link I used: https://cdn.rawgit.com/natearn/react-vim-tips/32b5ee66/stylesheets/VimTips.css
The crucial point is that either of these strategies will serve your CSS with the correct Content-Type headers, enabling them to actually load as CSS in your page. Referencing the link to downloads from your release simply prompts a download of the binary data for your CSS file, which will not work. Hope this helps you out!
Use the raw version of the file from your repo,
I have this css file from an old Hello World repo,
using https://github.com/mcarpenterjr/Hello_World/blob/master/style.css you get the file in the repository.
Using https://raw.githubusercontent.com/mcarpenterjr/Hello_World/master/style.css
you get the raw file, which is what you're looking for. To get this simply click the raw button to the upper right of the file contents on a file's page from the repo.
I suppose you could also swap https://github.com for https://raw.githubusercontent.com and drop blob from the address.
Just use this -> https://rawgit.com/
Works flawlessly.
We're accessing a 3rd-party iFrame (dialog) in our web app. This is loaded by javascript and served via the 3rd-party's server. If we provide them with a link to a custom CSS file we can change the appearance of the dialog.
How, in the Rails pipeline, can we create this file and then provide the 3rd-party with a URL that will, hopefully, respect (read: use) our CDN?
Does the file belong in vendor/assets/stylesheets/? I'm pretty sure that becomes part of asset pipeline as well...
Thoughts?
I developed a website, which can be used by different customers. As a result, we want to give different CSS styles and images to individual customers.
What we want is to manage CSS and images separately, so we won't need to deploy the site again just because we added some new CSS or images. As the site is under MVC, when accessing URLs such as:
www.mysite.com/customerA/myPage
www.mysite.com/customerB/myPage
we can find the customer id and find the right CSS and image to return.
The problem is that we want to bundle CSS, when the CSS or images are bundled, two issues will occur:
How the bundle detect underlying CSS file change? Is it possible?
Some users may already visited the URL and cached the bundled CSS, how can we disable the cached CSS, so it will get the new version?
The .NET bundling strategy is very intelligent in solving both of your issues. Once you create a bundle - example below:
bundles.Add(new StyleBundle("~/Content/css").Include(
"~/Content/bootstrap.css",
"~/Content/site.css"));
And render this bundle out on your website, the output looks something like this:
<link href="/Content/css?v=xUfHQEnjwMk9UEexrvHPdvPxJduGrgz0bbI5qy5BGHY1" rel="stylesheet"/>
Notice the ?v=bigTextstring. Anytime a file in your bundle changes, the bundling framework will change the bigTextString after the ?v=. So, for your first question, yes, it will automatically detect file changes. You can get more information about how all of that process works if you visit this SO question. For your second question, the ?v= parameter, when changed, signals the client's browser that this is a different file than you had, you need to download it again.
Tommy has a great answer. I just wanted to elaborate on a few points.
First, as long as the bundle itself hasn't changed (added/removed scripts/styles or changed the location of those files), then you can freely update the files themselves without republishing the whole site. The bundler runs at runtime and looks at the last modified timestamp of the included files. If any of the files has changed, a new bundle will be generated with an updated cache-busting querystring param.
However, since the actual bundle configuration is code-based, if you add/remove items from the bundle or change the location of the file(s), such that you have to update the bundle configuration in BundleConfig.cs then you must republish, or at least also update the project DLL. This is because the code compiled within that DLL has changed.
As part of static file caching in my application, I am using the clientCache> feature supported by IIS7.5. But I would like to invalidate the client side files while performing new deployments, to ensure that the stale files are removed.
cacheControlMaxAge seems to be absolute. I want to invalidate the files one time (during deployment) and then they should be cached. Is there any way recommended?
Depends which files you are trying to invalidate. One solution could be to generate some sort of fingerprint and append it as a querystring to your files. For example:
<link rel="stylesheet" href="mystyle.css?fp=hash_generated_from_file" >
When you change file you should recreate the hash and append it to the file. Mads Kristensen wrote an article Cache busting in ASP.NET which would be the answer to your question. Instead of copying-pasting his article you might want to see how he does this.
I've some image file in my Local Network and I want to display them in the DataTable in JSF. I'm using JSF2.0 and Tomahawk 1.1.13. Below is the JSF code.
<t:dataTable newspaperColumns="3" value="#{startupBean.colorList}" newspaperOrientation="horizontal" var="colorBO">
<f:facet name="spacer">
<f:verbatim></f:verbatim>
</f:facet>
<h:column>
<h:graphicImage id="colors" alt="jsf-sun" url="#{colorBO.color_url}">
</h:graphicImage>
</h:column>
</t:dataTable>
I'm giving the path of the file as "\\root\sub\sub\xxx.jpg" in my backing bean. But when the JSF page renders, it displays a default icon. When I right click on the icon and check the properties, the below is what I get.
http://localhost:8080/projname//root/sub/sub/xxx.jpg
I tries using both backslash and forward slash in the path name. No change in the output though. I dont' know how the http part gets into the file path. I'm missing something for sure.
You're making a conceptual mistake here. It's the webbrowser who has to download the image separately by a valid and reachable URL once it encounters a <img> element, it's not the webserver who has to somehow magically embed the image from the local disk file system within the HTML page which is returned to the webbrowser.
You need to make the image available by a valid and reachable URL, so that the webbrowser can download it. A local disk file system path is surely not a valid and reachable URL. Even more, it would be a huge security hole if a server machine's local disk file system contents was automagically fully exposed into the world wide web.
One of the simplest ways of solving this problem is just placing the image in the public webcontent (there where your JSF files also are), so that it's available in the web.
Another way is to configure the server to publish the folder into the web so that it's available by a specific URL as well. It's unclear which server you're using, so here's just a Tomcat example:
<Context docBase="/root/sub/sub" path="/images" />
This way the image is available by http://localhost:8080/images/xxx.jpg and then this <h:graphicImage> approach should work:
<h:graphicImage src="/images/xxx.jpg" />
See also:
Load images from outside of webapps / webcontext / deploy folder using <h:graphicImage> or <img> tag
Simplest way to serve static data from outside the application server in a Java web application