flag images not found

[magicboo]

I follow the standard process to add the plugin successfully to a brand new project. But when I start the project, error message appear:

...... ERROR resource.ResourceMeta - Resource not found: /images/flags/pt.png ERROR resource.ResourceMeta - Resource not found: /images/flags/ru.png ERROR resource.ResourceMeta - Resource not found: /images/flags/sv.png

And I can't find any "flags" directory in my project's \web-app\images

[Update] It's my fault... I am using GGTS's "Run as > Run on server" to run my Grails project and it seems not combine plugin content in packaged war. So images are lost. When I changed to use "run-app" to run my project, the images were shown correctly. But....glyphicons are not! Still figure out the problem.

[pbb6w7]

A) images (flags) not working in war mode: see issue "In war the URI to static images in plugins lacks the static URI prefix #78" You can always drop the images under your images directory under web-app then simply update the _language.gsp that was created by the kickstart plugin under views/_menu to use something like this:

<img class="" src="${resource(dir: 'images/flags',file: lang.toString()+'.png')}" />

I have not tried this with a war deployment but in theory it should work. There is one more thing - there is no icon for the english language so if your locale is en_US for example you will not see the image. Several fixes exist - what I did is a simply copied the gb.png and duplicated it as en.png

B) Glyph-icons do not work with the resources plug in 1.2.6, but they do work with 1.2.1 however it has been found that 1.2.1 presents a security risk. To use 1.2.6 you can use this hack: copy the 4 glyph-icons files under web-app/css/fonts then in your main.css file (or whatever css file you happen to be including in your project drop the following lines:

@font-face {
font-family: 'Glyphicons Halflings';
src: url('fonts/glyphicons-halflings-regular.eot');
src: url('fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded- opentype'), 
     url('fonts/glyphicons-halflings-regular.woff') format('woff'), 
     url('fonts/glyphicons-halflings-regular.ttf') format('truetype'), 
     url('fonts/glyphicons-halflings-regular.svg#glyphicons-halflingsregular') format('svg');
} 

This will make the glyphs work with the 1.2.6 resources plugin. (hehe - although what we are doing this way is kind of circumventing the resources plug in - i.e. we are not using the plug in to include the resources) Please note that the css above provides a url in the form of "fonts/**" what is assumed is that the base directory is /css under your web-app folder.

Disclaimer: These are in no way the only or the best solutions - they simply worked for me.

[magicboo]

Hi, thanks for your information.

I am trying to follow your steps to solve Glyph-icons issue as below:

1. Because this plugin's layout (kickstart) doesn't use main.css, so I put your @font-face css in an isolated css file "fix-glyphicons.css"
2. I define a module that depends on bootstrap & bootstrap_utils glyphicons { dependsOn 'bootstrap, bootstrap_utils' resource url:'css/fix-glyphicons.css' }
3. Add <r:require modules="glyphicons"/> to plugin's layout page "kickstart.gsp"
4. Start server and make sure my css is rendered AFTER bootstrap css (I think that my @font-face will override plugin's @font-face definition, but it's not)
5. See my glyphicons-halflings files transferred in browser's console but still also see net::ERR_UNK that try to get glyphicons-halflings files from resource:/bootstrap....
6. The icons are still missing.....help...

[Update] I want to modify plugin's original content that cause resource issue in bundle-bundle_bootstrap_head.css. But I only find bootstrap.css that contains: @font-face { font-family: 'Glyphicons Halflings'; src: url('../fonts/glyphicons-halflings-regular.eot'); src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') ...... } Wired....so where is the problematic code? @font-face { font-family: 'Glyphicons Halflings'; src: url('resource:/bootstrap/dist/fonts/glyphicons-halflings-regular.eot'); src: url('resource:/bootstrap/dist/fonts/glyphicons-halflings-regular.eot?#iefix')......

[pbb6w7]

Hi, I am no expert here but based on the info above it sounds like you are doing all the right things. 1) I don't think you will be able to get rid of the net::ERR_UNK because the plugin is wired to look for them in a specific place but as we see in your browser console, the files that you put in under css/fonts did get loaded (assuming you are following the example I gave). 2) Its probably the way you have defined the resource dependencies with depends on (my best guess here) - instead of using the depends on could you simply define your fix css file as a stand alone resource and include it with the in the kickstart.gsp after the bootstrap resources? You might need to toy with it a bit as I seem to remember I ran into a scenarios where the setup did the exact opposite of what I was expecting - i.e. it loaded them in reverse so the override actually went the other way around.

3) This I think is generated by the CCSRewrite function of the resources plug in. It does not work because there is no directory under the web-app folder that has /css/resource:/bootstrap/.... remember that the src url here assumes to prefix a 'css/'

@font-face {
 font-family: 'Glyphicons Halflings';
 src: url('resource:/bootstrap/dist/fonts/glyphicons-halflings-regular.eot');
 src: url('resource:/bootstrap/dist/fonts/glyphicons-halflings-regular.eot?#iefix')......

4) you see this because it assumes you will wash it down the resources plugin and the ../ be substituted by the real path that will be /css/static/fonts (something down those lines)

@font-face {
font-family: 'Glyphicons Halflings';
src: url('../fonts/glyphicons-halflings-regular.eot');
src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') ......
}

Either way this is an issue with the resources plugin rather than the Kickstart plugin.

Also if you have security defined make sure you include something like this in your Config.groovy

grails.plugin.springsecurity.controllerAnnotations.staticRules = [
        ..................
    '/**/css/**':                     ['permitAll'],
       ..................
]   

[magicboo]

No matter use defined module that depends on bootstrap & utils or use it standalone

The only thing I make sure is fix-glyphicons appear in rendered source after : <link href="/x/static/bundle-bundle_bootstrap_head.css" type="text/css" rel="stylesheet" media="screen, projection" /> <link href="/x/static/bundle-bundle_bootstrap_utils_head.css" type="text/css" rel="stylesheet" media="screen, projection" /> <link href="/x/static/css/fix-glyphicons.css" type="text/css" rel="stylesheet" media="screen, projection" />

[piperpilot]

Did anyone come up with a good fix for this?

UPDATE...I found this:

http://stackoverflow.com/questions/22623584/urls-within-css-files-broken-with-grails-resources-plugin-1-2-7

Changing the includes line in config.groovy to add bootstrap fixed it:

grails.resources.adhoc.includes = ['/images/', '/css/', '/js/', '/plugins/', '/bootstrap/**']