combat the asset_helper and base_url

[eluser]aioon[/eluser]
Hello people,

as I introduced in "Introduce your self" thread, I have maybe a real cool solution for one real annoying job!

For a few days ago, I started to work with Codeigniter and I love it to work with but today I came across with a problem, which costs me a lot of time...

I am using the routing functionality of ci with a .htaccess file:

http://codeigniter.com/wiki/mod_rewrite/

it works great... until I implements some files, js, css, images... and damn, when I go to <url>/controller/method no of this files was included or implemented to the view... so I began to search for a solution and I found things like:

Code:

<img src='&lt;?=base_url()?&gt;images/your_image.jpg' alt='Your Alt' />
&lt;link rel='stylesheet' href='&lt;?=base_url()?&gt;css/your_style_sheet.css' type='text/css' /&gt;
type='text/javascript' src='&lt;?=base_url()?&gt;javascript/scripts.js'>

or to use helper like:

http://codeigniter.com/wiki/Asset_Helper/
http://shawnmccool.com/2009/11/23/managi...deigniter/

Everything was a solution, but it costs so much time everytime to write base_url etc, and a little bit of performance...

I try to find a better solution in serps, but i didn't... all tutorials and examples use the solutions above...

So here is my solution, to combat the solutions above and to save a lot of time and a little bit of performance...

So what we have todo:

This is our default directory structure:

system
index.php

now we create a new directory in the same directory for e.g. we will call it assets and then we create 3 new diretories in this new directory css, js and images and now we have this directory structure:

system
index.php
assets
|-css
|-js
|-images

so put your image files now in /assets/images and javascript files in /assets/js/ and css files in /assets/css

system
index.php
assets
|-css
|--your_style_sheet.css
|-js
|--jquery.min.js
|-images
|--header.png

ok, and now we take this .htaccess file

http://codeigniter.com/wiki/mod_rewrite/

and we put it in the same directory where assets, system and index.php are!

system
index.php
assets
|-css
|--your_style_sheet.css
|-js
|--jquery.min.js
|-images
|--header.png
.htaccess

fine, and now we edit any view file we like where for e.g this is present:

Code:

<link rel='stylesheet' href='<?=base_url()?>css/your_style_sheet.css' type='text/css' />

so it was the past, today we will do it better! just delete &lt;?=base_url()?&gt;

Code:

<link rel='stylesheet' href='css/your_style_sheet.css' type='text/css' />

and in the code with js and images and then save it!

open now your .htaccess file and put this combat the asset_helper and base_url rewrite line in the top of the file!

#combat the asset_helper and base_url
RewriteRule (css|js|images)/(.*)$ assets/$1/$2 [L]

so your .htaccess file will be like this now:

Code:

<IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteBase /

    #combat the asset_helper and base_url
    RewriteRule (css|js|images)/(.*)$ assets/$1/$2 [L]

    #Removes access to the system folder by users.
    #Additionally this will allow you to create a System.php controller,
    #previously this would not have been possible.
    #'system' can be replaced if you have renamed your system folder.
    RewriteCond %{REQUEST_URI} ^system.*
    RewriteRule ^(.*)$ /index.php?/$1 [L]
    
    #When your application folder isn't in the system folder
    #This snippet prevents user access to the application folder
    #Submitted by: Fabdrol
    #Rename 'application' to your applications folder name.
    RewriteCond %{REQUEST_URI} ^application.*
    RewriteRule ^(.*)$ /index.php?/$1 [L]

    #Checks to see if the user is attempting to access a valid file,
    #such as an image or css document, if this isn't true it sends the
    #request to index.php
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteRule ^(.*)$ index.php?/$1 [L]
</IfModule>

<IfModule !mod_rewrite.c>
    # If we don't have mod_rewrite installed, all 404's
    # can be sent to index.php, and everything works as normal.
    # Submitted by: ElliotHaughin

    ErrorDocument 404 /index.php
</IfModule>

that the combat, we won =)

and now when you visit <url>/controller/method alle the images, js and css files will be implemented and you will get what you want!

thats my solution, how i combat the asset_helper and base_url and how i|we will save a lot of time in the future

how you can see, you can implement any file-type you want! swf, avi etc. etc. if you need for e.g. swf files you have to create a new directory and call it flash in assets directory, after that you have to edit your .htaccess combat line, just add the attribute RewriteRule (css|js|images|flash)/(.*)$ assets/$1/$2 [L][/quote] then you can easy implement it in any view you want!

Code:

<embed src="flash/somefilename.swf" width="550" height="400">

and of course you can use subdirectories without deep limitation

Code:

<embed src="flash/videos/somefilename.swf" width="550" height="400">

how simple is that? hehe =)

So people, I hope I build a real usefull solution and I hope you could understand me what I am trying here to explain My english isn't so good at this moment

Have fun with this solution

Thats my way...

Regards
Alex

[eluser]theprodigy[/eluser]
that's not a bad solution, but I usually just use the .htaccess file you presented with that link, and just prefix all my asset calls with a forward slash:

Code:

<img src='/images/your_image.jpg' alt='Your Alt' />
[removed][removed]
&lt;link rel='stylesheet' href='/css/your_style_sheet.css' type='text/css' /&gt;

That htaccess file tells the server to look for the file first. If it doesn't exist, then send the request to index.php.

The path in the img src tells the server to start looking in the webroot. As long as the path is correct, it will show the image, render the js file, render the css file, etc, etc.

If you want to keep all your assets contained in an "assets" directory, then just modify the src attribute:

Code:

<img src='/assets/images/your_image.jpg' alt='Your Alt' />
[removed][removed]
&lt;link rel='stylesheet' href='/assets/css/your_style_sheet.css' type='text/css' /&gt;

I think this is much easier than having to modify an htaccess file each time I want to add a new asset type (like a flash file, as per your example).

[eluser]aioon[/eluser]
when i do this
&lt;link href="/assets/css/styles.css" rel="stylesheet" type="text/css" /&gt;
and comment this out
#RewriteRule (css|js|images)/(.*)$ assets/$1/$2 [L]

and go to
http://localhost/csubs/

it won't work :/

upd:

could you show your .htaccess file?

[eluser]theprodigy[/eluser]
is csubs a controller name, or a subdirectory that your actual CI installation is in?

[eluser]aioon[/eluser]
a subdirectory that my actual CI installation is in

[eluser]theprodigy[/eluser]
try changing the RewriteBase to /csubs

[eluser]aioon[/eluser]
won't work :/

[eluser]theprodigy[/eluser]
well, it works for me, but I don't have my CI installed in a sub directory.
I guess however you can get it to work, go for it. I'm not exactly up to par with htaccess (hence the reason for using the one posted, and not creating my own).

[eluser]aioon[/eluser]
hehe, but thank you for you opinion, i'll remember the idea with forward slash, when I'll build ci in webroot damn and I thought that I found a perfect solution ^^ but yours is much better, but how it seem doesnt work in a subfolder how ever, thank you

[eluser]theprodigy[/eluser]
well, my solution was actually read from somewhere else on this forum (I can't remember where), so I can't really take credit for it. I, myself, went looking for a solution because I didn't care for the full URL in images, js, css, etc.

If your solution works in both cases (subdirectory as well as root), then maybe your solution is better, since it is more flexible. I typically don't install CI into subdirectories because I don't like messing with htaccess files. I want to be able to copy it from one site to another and just have it work.

But, if your solution works, it works. And like I said, it may be the better one.