0

I'm trying to use Stacey CMS in conjunction with retina.js for my small portfolio site. Stacey tells all images inside a project folder to be added to the page. At the same time I'd like to serve @2x hi-dpi images. If I include these in the same folder, Stacey will add both the regular image.png and image@2x.png to the page, which I want to avoid.

To solve this, I want to rewrite all images ending with @2x to have the root /retina inside the same project folder. This folder is dynamic, ie. there are many different project folders, so I would like to have one rewrite rule to work for all.

I've gotten to this point with some help from a fellow stack overflow user:

RewriteRule ^(.*)@2x(.*)$ /Retina/$1@2x$2 [L]

This however, does not refer to a subfolder of the original project folder. How do I go about referring to the correct folder?

Edit: Alternatively there may be other ways to solve this issue? Changing retina.js retina image path

Community
  • 1
  • 1
Simon
  • 103
  • 2
  • can you please explain a bit more, not sure i got it – Lupin Feb 15 '15 at 18:58
  • @Lupin: Stacey looks for images in `/project-name`. I want to have the standard dpi images in this folder, but `@2x` images inside `/project-name/retina`. Retina.js (http://retinajs.com/) however, wants `@2x` images to be in the same folder as the standard dpi images (`/project-name`). To go work my way around this, using a rewrite rule in .htaccess was suggested. I want that rule to say "hey, `@2x` images are in a subfolder of the standard dpi images, but go ahead and do you work, retina.js!" :) – Simon Feb 15 '15 at 19:05

1 Answers1

0

I think that the problem you encounter is do to an endless redirect loop. as your rule

RewriteRule ^(.*)@2x(.*)$ /Retina/$1@2x$2 [L]

Will try to redirect the call for the retina image uri like /image@2x.jpg but also again and again for the new url's /retina/image@2x.jpg as your rule only checks if the requested uri has the @2x string in it.

Try adding another condition to the rule that will prevent the rule to be processed for images that are in the retina folder

RewriteCond %{REQUEST_URI} !Retina
RewriteRule ^(.*)@2x(.*)$ /Retina/$1@2x$2 [L]

If the Retina folder is actually inside another folder and you have multiple Retina folders, meaning that when you call site.com/project1/image.png the retina version is in site.com/project1/retina/image@2x.png then you should try this:

RewriteCond %{REQUEST_URI} !Retina
RewriteRule ^(.*)/(.*)@2x(.*)$ /$1/Retina/$2@2x$3 [L]

in the Retina folders are inside the sub-folders, the first rewrite rule we used will have both the folder name & the image name in the variable $1, so what we should do is just break the folder name & the image name into two separate variables

Lupin
  • 1,225
  • 11
  • 17
  • Tried this but it did not seem to work. But you get the problem, right? Bare with me here, as I'm no developer. So in each of these subfolders (http://cl.ly/Znnc) there is a folder called Retina. I want retina.js, when it looks for @2x images to go one folder deeper, to the Retina folder within the project folder. Is this doable with this rewrite rule? Would this be easier done directly within retina.js like I asked for here? http://stackoverflow.com/questions/28528249/changing-retina-js-retina-image-path – Simon Feb 15 '15 at 22:02
  • it's doable for sure, if it's easier than manipulating retina.js - cant say as did not work with it. i though the retina folder is one general for them all, but now i see its not. so, lets say we have an image called 1.jpg that is in the cues folder, the 1@2x.jpg is actually in /cues/retina folder? – Lupin Feb 15 '15 at 23:22
  • That is correct, `1@2x.jpg` is in /cues/retina. This sounded like it would work, but alas! it did not. It may be Stacey that doesn't work well with retina.js. Perhaps after the fact that Stacey has composed a page, retina.js looks for the `@2x` in the wrong place. I ended up with just using compressed `@2x` jpg's for all the images and scaling it down. Filesize is lower than the previous png anyway. But thank you very much for the help! – Simon Feb 16 '15 at 09:33
  • @Simon, i dont see how the 2 is related - do you have a working demo, or maybe you can share the full directory tree with all inner folders – Lupin Feb 16 '15 at 12:13