Alex Khomenko

Closures in CoffeeScript

Closures in CoffeeScript are implementing very simple:

window.MusicBox =
    module: (->
        modules = {}
        (name) ->
            if modules[name]
                modules[name]
            else
                modules[name] =
                    Views: {}
    )()

https://github.com/jashkenas/coffee-script/issues/43

Save images in local storage as data URI

Last time I created markup I saved decorative images in css as data URI. So all images arrived to client with css and client saw all design at once without need waiting for downloading decorative images.

Now I’m doing the backbone app and I save models in localStorage. So only images are not saved locally. And I’ve got thought about saving non-decorative images in localStorage as data URI. I think it may have reason if you have not much pictures.

Of course limitation is 5MB for all stuff. What do you think?

Remote debug php-application with xdebug

I debug applications for a while with xdebug on local machine. I just set xdebug.remote_enable = 1 in php.ini and that’s all.

Tomorrow I have need to debug application on remote host and I couldn’t do this. So after some investigation I’ve found some solutions for remote debug:

1. Set xdebug.values in .htaccess:
   php_value xdebug.remote_enable on
php_value xdebug.remote_host 209.85.148.99

If you need setup debug env for multiple users:

2. Set xdebug.remote_connect_back=1 in php.ini
   xdebug.remote_connect_back=1
3. Set up dbg proxy. Read more:
   
   • http://xdebug.org/docs/remote, chapter - Multiple Users Debugging
   • http://derickrethans.nl/debugging-with-multiple-users.html
4. Set up ssh tunnel.
   • Enable remote_enable through php.ini or .htaccess
     xdebug.remote_enable=1
   • Open ssh tunnel
     ssh -N -R 9000:localhost:9000 sshusername@remote-server-name.com

Zend Framework, Db Profiler

The simplest and the just awesome way to enable Db Profiler (as we say dump queries) in Zend Framework is just add some params to you configuration file. In my case it is application.ini:

resources.db.adapter = 'pdo_mysql'
resources.db.params.host = 'localhost'
resources.db.params.username = 'username'
resources.db.params.password = 'password'
resources.db.params.dbname = 'database'

resources.db.params.profiler.enabled = true
resources.db.params.profiler.class = "Zend_Db_Profiler_Firebug"


Install FirePHP and after reload you will see something like this:

Kindle Cloud Reader

Couple of weeks ago Amazon release great application for reading books. You will say - “So what? We’ve already had applications for Mac, Win and mobile platforms”.

Yes you are right, it’s just application for reading on the web. It works as offline application, so you can install it as Chrome Application and use even without Internet.

It remembers where you finished reading previous time, shows highlights and can do other things. It has menu like Kindle Reader, so you can choose fonts, size.

It’s great thing also from web-developer point of view.

CSS rules weight

As it usually appeared for me, unexpectedly - weight of attribute in CSS rules is equal to weight of class and values in attribute doesn’t increase weight of rule.

So these rules are equal by their weight:

a.link {
  color: blue;
}

a[rel] {
  color: red;
}

a[rel^=https] {
  color: green;
}

IE, CSS3 selectors, strange behaviour

If css rule has CSS3 selectors, which IE doesn’t understand, it passes them.

Doesn’t work:
tr:nth-child(even),
tr.even {
    background-color: #eee;
}

Work:
tr:nth-child(even) {
    background-color: #eee;
}

tr.even {
    background-color: #eee;
}

WebKit color-stop procent in -webkit-gradient

As I’ve found out I can’t use more than 100% in WebKit implementtation of linear-gradient. So I need 150% in second color-stop -webkit-gradient(linear, left top, left bottom, color-stop(0, red), color-stop(1.5, blue));

WebKit implementation allow to use no more than 100%, but we can avoid this “feature” and use background-size: 1px 150%

In first case I have http://jsfiddle.net/okhomenko/GZP4x/:

#gradient {
    background-image: 
        -webkit-gradient(linear, left top, left bottom, 
                         color-stop(0, red), color-stop(1.5, blue);
}

And get:

And in case http://jsfiddle.net/okhomenko/GZP4x/1/

#gradient {
    height: 50px;
    
    background-image:
        -webkit-gradient(linear, left top, left bottom, 
                         color-stop(0, red), color-stop(1, blue));
    background-size: 1px 150%;
}

So if you want to customize your gradient in WebKit you can use this method. In FF4 everything works fine just like this - background-image: -moz-linear-gradient(top, red, blue 150%), so in some time I think it will work in WebKit