EllisLab text mark
Advanced Search
2 of 14
2
   
Carabiner 1.4: Asset Management Library
Posted: 22 June 2009 01:04 PM   [ # 21 ]   [ Rating: 0 ]
Avatar
Joined: 2007-04-27
173 posts

hi

i tried to use u’r lib but i have some problems

i use ci on windows using wamp

so i have c:\wamp\www as web folder

i made a alias so now my app is installed like this

c:\wamp\app\ with url http://localhost/app/ 

and it works ok

i took out the application folder from system
and moved system out of app folder and changed in index.php $system_folder = “../system”;

so now i have

c:\wamp\system
c:\wamp\app\application
c:\wamp\app\cache
c:\wamp\app\js
c:\wamp\app\css

in my .htaccess i have

Options +FollowSymLinks
Options 
-Indexes
DirectoryIndex index
.php
RewriteEngine on
RewriteBase 
/app/
RewriteCond $!^(index\.php|imagini|css|js|cache|robots\.txt|favicon\.ico)
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond 
%{REQUEST_FILENAME} !-d
RewriteRule 
^(.*)$ index.php?/$1 [L,QSA] 

in carabiner conf i have folders defined like this $config[‘cache_dir’] = ‘cache/’;

when i load a js it tries to write it to C:\wamp\cache\ but it should be c:\wamp\app\cache\

any sugestion ?

 
Posted: 22 June 2009 03:26 PM   [ # 22 ]   [ Rating: 0 ]
Joined: 2009-03-14
14 posts

I think I have Amazon S3/CDN integration with Caribinner working pretty well now. Here are the steps I took:

1. Add an S3 library to your application/libraries folder. I used the one available here: http://undesigned.org.za/2007/10/22/amazon-s3-php-class and then customized it so that it pulled the variables from my config file. The only thing I changed in the S3.php file (which is the one to add to application/libraries) was the __construct on line 57 so that it looked like this:

public function __construct($accessKey null$secretKey null$useSSL true) {
      
//Start Customizations
      
$this->CI get_instance();
    
$accessKey $this->CI->config->item('key_id');
    
$secretKey $this->CI->config->item('secret_key');
    
//End Customizations
        
if ($accessKey !== null && $secretKey !== null)
            
self::setAuth($accessKey$secretKey);
        
self::$useSSL $useSSL;
    

2. Next, update the carabiner config file with the following variables

$config['key_id''XXXXXXXX'//Your Amazon key_id
$config['secret_key''XXXXX'//Your Amazon secret_key
$config['cdn_bucket''yourcdnbucket'//The bucket that will act as your CDN
$config['use_cdn'TRUE//Enabling the CDN functions in carabiner
$config['cdn_url''http://cdn.example.com/'//The URL used to access your CDN 

3. Finally, modify the carabiner library in two spots:
The _cache function should look like this:

private function _cache($filename$file_data)
    
{

        $filepath 
$this->cache_path $filename;
        
$success file_put_contents$filepath$file_data );

        if(
$success) : 
            
log_message('debug''Carabiner: Cache file '.$filename.' was written to '.$this->cache_path);
      
      if(
$this->CI->config->item('use_cdn') == TRUE)
      
{
        
//If it's a production environment, move the file to the Amazon S3 CDN bucket
        
if($this->dev == FALSE)
        
{
          $this
->CI->load->library('S3');
          
$this->CI->s3->putObjectFile($filepath$this->CI->config->item('cdn_bucket')$this->cache_dir.$filenameS3::ACL_PUBLIC_READ);
        
}
      }

      
            
return TRUE;
        else : 
            
log_message('error''Carabiner: There was an error writing cache file '.$filename.' to '.$this->cache_path);
            return 
FALSE;
        endif;
    

The _tag function should look like this:

private function _tag($flag$ref$cache FALSE$media 'screen')
    
{

        
switch($flag){
        
            
case 'css':
                
                
$dir = ( $this->isURL($ref) ) ? '' : ( ($cache) ? $this->cache_uri $this->style_uri );
        
        if(
$this->CI->config->item('use_cdn') === TRUE && $this->dev == FALSE)
        
{
          $dir 
$this->CI->config->item('cdn_url').$this->cache_dir;
        
}
                
                
return '<link type="text/css" rel="stylesheet" href="'.$dir.$ref.'" media="'.$media.'" />'."\r\n";
            
            break;

            case 
'js':
                
                
$dir = ( $this->isURL($ref) ) ? '' : ( ($cache) ? $this->cache_uri $this->script_uri );
                
        if(
$this->CI->config->item('use_cdn') === TRUE && $this->dev == FALSE)
        
{
          $dir 
$this->CI->config->item('cdn_url').$this->cache_dir;
        
}
        
                
return '[removed]CI->config->item('charset').'">[removed]'."\r\n";
            
            break;
        
        }
    
    } 

That should be it. Now when you are in a production environment, anytime a new cache file is created it will automatically be loaded into Amazon S3, which can act as a CDN. Then, on the site, the files use the CDN domain instead of the normal domain. Let me know if you have suggestions on how to improve this.

 
Posted: 24 June 2009 10:59 AM   [ # 23 ]   [ Rating: 0 ]
Avatar
Joined: 2007-04-27
173 posts

solved my problem i modified the lib changed dirname(FCPATH) to just FCPATH

 
Posted: 25 June 2009 09:31 AM   [ # 24 ]   [ Rating: 0 ]
Avatar
Joined: 2009-01-21
109 posts

@quasiperfect I’m glad you got it to work.

@topherdan1 That looks like a really solid solution!  There are a few things you could change to make the code a little simpler:

First, you can just do

if($this->use_cdn && !$this->dev

instead of

if($this->CI->config->item('use_cdn') === TRUE && $this->dev == FALSE

That’s because the config function is lazy, and will drink up whatever items are in the config file (or array) and make them class variables. That also applies to anyplace you use this syntax:

$this->CI->config->item(''

The only other thing I would do is adjust the logging in the cache function, so it looks something like this:

private function _cache($filename$file_data)
    
{
        $filepath 
$this->cache_path $filename;
        
$success file_put_contents$filepath$file_data );

        if(
$success) :
            
log_message('debug''Carabiner: Cache file '.$filename.' was written to '.$this->cache_path);
      
            if(
$this->use_cdn == TRUE && $this->dev == FALSE):

                
$this->CI->load->library('S3');
                
$cdn $this->CI->s3->putObjectFile($filepath$this->cdn_bucket$this->cache_dir.$filenameS3::ACL_PUBLIC_READ);
                
                if(
$cdn){
                    log_message
('debug''Carabiner: Cache file '.$filename.' was written to the CDN bucket '.$this->cdn_bucket);
                    return 
TRUE;
                
}else{
                    log_message
('error''Carabiner: There was an error writing cache file '.$filename.' to  the CDN bucket '.$this->cdn_bucket);
                    return 
FALSE;
                
}
    
            
endif;
      
            return 
TRUE;
        else :
            
log_message('error''Carabiner: There was an error writing cache file '.$filename.' to '.$this->cache_path);
            return 
FALSE;
        endif;
    

These are all minor things, though.

 Signature 

Do you use CSS or JavaScript? Carabiner makes your life easier.  I promise.

CI-Disqus makes playing with the Disqus API a snap.

 
Posted: 26 June 2009 12:44 AM   [ # 25 ]   [ Rating: 0 ]
Avatar
Joined: 2008-07-07
93 posts

Just want to say great job on this lib. I’ve been toying around with building a library with the same basic functionality but this is working great for me so far (it’s been an hour raspberry )

I only have 2 comments :

1) integration with tinyMCE seems sticky, i got it to work finally but i have it linking to the tiny_mce.js separately. I might be doing something else wrong, but i’ll have to look in further.

2) if you could, allow for a return value on the display function, ie

$script_tag $this->carabiner->display('js'TRUE);  // return as string
$this->head->add_line($script_tag); 

i build my page head through output buffering so the echo doesn’t matter, but i think its more CI-view-esque to have that option.

thx again!

CC

 
Posted: 26 June 2009 01:12 PM   [ # 26 ]   [ Rating: 0 ]
Avatar
Joined: 2009-01-21
109 posts

Thanks!  I’m glad it’s working for you.

1) I’ve had issues with other Rich Text Editors as well.  Flagging the file(s) to not be combined (or minified, frankly) should solve the problem.  Of course, this is less than ideal, but there’s sufficient complexity in those tools that I’ve been willing to accept the trade-off between my time trying to troubleshoot and the extra few kb and http request.

2) That’s an interesting idea.  I’ll keep it mind. In the short term, output buffering is the perfect solution.

 Signature 

Do you use CSS or JavaScript? Carabiner makes your life easier.  I promise.

CI-Disqus makes playing with the Disqus API a snap.

 
Posted: 04 July 2009 08:48 AM   [ # 27 ]   [ Rating: 0 ]
Avatar
Joined: 2007-04-27
173 posts

+1 for “if you could, allow for a return value on the display function”

 
Posted: 14 July 2009 02:21 AM   [ # 28 ]   [ Rating: 0 ]
Avatar
Joined: 2008-05-04
166 posts

Hi Tony,

Great application and extension of these different libraries in such an efficient manner. I have gotten the library to work but I am wondering how one would go about dynamically adding a js file to the head of site, based on the controller/method being called?

I tried exploring the new “groups” feature but this only seemed to add my new js file at the top of the other js files. In turn this seemed to break my site?

 Signature 

Reality Knights - Have more fun

 
Posted: 14 July 2009 02:35 AM   [ # 29 ]   [ Rating: 0 ]
Avatar
Joined: 2009-01-21
109 posts

@dnyce I’m glad you like it.

Adding scripts to the head of your site is as easy as calling

$this->carabiner->display(); 

in your view.

If that doesn’t help, feel free to provide some code examples of what you’re trying to do.  You can post it here, or message me directly.

Good Luck!

 Signature 

Do you use CSS or JavaScript? Carabiner makes your life easier.  I promise.

CI-Disqus makes playing with the Disqus API a snap.

 
Posted: 14 July 2009 02:49 AM   [ # 30 ]   [ Rating: 0 ]
Avatar
Joined: 2008-05-04
166 posts

No,

Actually the issue I was having was with the dynamic calling of files within a group, but once I played with it some more, I managed to resolve the issue on my own.

Great Library again!

:D

 Signature 

Reality Knights - Have more fun

 
Posted: 14 July 2009 02:58 AM   [ # 31 ]   [ Rating: 0 ]
Avatar
Joined: 2009-01-21
109 posts

Awesome! Thanks for the kind words.

 Signature 

Do you use CSS or JavaScript? Carabiner makes your life easier.  I promise.

CI-Disqus makes playing with the Disqus API a snap.

 
Posted: 14 July 2009 10:25 AM   [ # 32 ]   [ Rating: 0 ]
Avatar
Joined: 2009-07-14
7 posts

Just noticed Carabiner and my first impressions are really good.
I have one question that i have been trying to find an answer to though…

Is there any way have assets used on every/most pages autoload or to declare groups of assets somewhere for easy access, without going into my controls?
I would like to keep as much of the design separate from logic as possible.

Thanks
/Kim

 Signature 

Developer | WonderBrand AB

Wickell.se | Forrst

 
Posted: 14 July 2009 01:25 PM   [ # 33 ]   [ Rating: 0 ]
Avatar
Joined: 2008-05-04
166 posts
Kwickell - 14 July 2009 02:25 PM

Just noticed Carabiner and my first impressions are really good.
I have one question that i have been trying to find an answer to though…

Is there any way have assets used on every/most pages autoload or to declare groups of assets somewhere for easy access, without going into my controls?
I would like to keep as much of the design separate from logic as possible.

Thanks
/Kim

Hi Kim,

I was having this exact same issue! I wanted an easy way to package up all the necessary css and js files that the site uses on the whole, but then also make use of some dynamic/on-the-fly scripts through out my site. Carabiner definitely handles this nicely with the groups feature.

Go the the carabiner.php file found in your config folder. look for the groups section.

The syntax you will need to use will look something like this:

//For Javascript
$config['groups']['site_js'= array('js' => array(array('js_filename.js')));

// For CSS
$config['groups']['site_css'= array('css' => array(array('css_filename.css'))); 

You could then reference these global groups wherever you need it with:

$this->carabiner->display('site_js');
$this->carabiner->display('site_css'); 
 Signature 

Reality Knights - Have more fun

 
Posted: 14 July 2009 01:53 PM   [ # 34 ]   [ Rating: 0 ]
Avatar
Joined: 2009-01-21
109 posts

@dnyce You beat me to the reply.  @Kwickell I’m glad you like it.  @dnyce’s answer is exactly what I was going to recommend. The other option would be to define groups/assets in a parent controller, like in a MY_controller class, but the config file option is the best.

Good luck!

 Signature 

Do you use CSS or JavaScript? Carabiner makes your life easier.  I promise.

CI-Disqus makes playing with the Disqus API a snap.

 
Posted: 22 July 2009 08:00 PM   [ # 35 ]   [ Rating: 0 ]
Joined: 2009-07-14
3 posts

Hi there, thanks for the amazing library. I think it’s excellent smile

(I am new at CI, so bear with me if I say something stupid.)

Your library looks for all of the css files in a css folder, so if you want to load a css file that is outside of your style_uri, then you are in bad luck.

Script folder: /assets/css
Want to include: /assets/js/asdf/asdf.css (the css is part of a js framework, so it’s better if that css stays in that folder)

I got around this problem by changing how the $dir variable is created.

private function _tag($flag$ref$cache FALSE$media 'screen')
    
{

        
switch($flag){
        
            
case 'css':
                
// Detect '/' at the beginning
                
(strpos($ref'/') === 0) ? ($dir = ( $this->isURL($ref) ) ? '' : ( ($cache) ? $this->cache_uri $this->style_uri )) : $dir '';
                
                return 
'<link type="text/css" rel="stylesheet" href="'.$dir.$ref.'" media="'.$media.'" />'."\r\n";
            
            break;

            case 
'js':
                
// Detect '/' at the beginning
                
(strpos($ref'/') === 0) ? ($dir = ( $this->isURL($ref) ) ? '' : ( ($cache) ? $this->cache_uri $this->script_uri )) : $dir '';
                
                return 
'[removed]CI->config->item('charset').'">[removed]'."\r\n";
            
            break;
        
        }
    
    } 

You see, my addition looks for ‘/’ at the beginning of the path. If it finds it, then it won’t append the style_uri. That way, if I want to include a that css, I would just type in

$this->carabiner->css('/assets/js/asdf/asdf.css'); 

I think that addition gives the developers more flexibility and gives this library 1 more feature.

Then again, I could be way off since I am just starting out with CI.

What do you think? And btw, that change works with including javascript files that are not in script_uri folder.

I hope that you can incorporate my changes in the next version.
Thanks.

 
2 of 14
2