Tag Archives: Computing

What make JavaScript closures work?

javascript, micro tutorial, , , , , , , , , , ,

Closures again

Most of the JavaScript developer don’t even know what a JS closure is and that’s why Crockfrod is so angry. Yes, it’s true, most of the “developers” just copy and paste the code without even know how it works. OK, just in breve the closure is an anonymous function, which thus helps you define a pseudo namespace, as you may know that in a function everything is visible inside it and only there.

function myFunc() {
    var a = 10;
}

The code above makes the variable a to be visible only inside the function. But as you know there must be a function call to make “all this code work”.

myFunc();

However you can make an anonymous function – or a closure, where the function is with no name and is called once the code has been processed. The right syntax is like so:

(function() { var a = 10; })();

Why and how?

The question is: why and how that works? Why this syntax is correct?

Hint

A tiny hint is that you can make the following line working:

var myFunc = function(){ var a = 10; }();

Pay attention to this syntax and the assignment is what makes all this working.

Video sites must use … mp4 and only mp4!

web development, , , , , , , , , , ,

H.264

Yes it may sound strange, but now with the upcoming HTML5 features every browser again is playing its own game. Firefox and Opera support only OGG Theora, Chrome and Safari only MP4 and what about IE .. it doesn’t support anything. Than why should we convert to mp4 with h.264 codec?

Because everybody is playing flash

And that’s again very sad but at least the flash players are playing mp4 with this encoding, which is good because this file will be playable under most of the mobiles. And if you have a large video site to support why don’t you convert to mp4 and play it with a Flash Player and give the opportunity to play mp4 on mobile.

Only one file under the sky

Thus you gain to keep only one file – playable under every device?

YouTube and FLV

Now I wonder why YouTube have both FLV and MP4 formats?

Of course if you’d like to be perfect …

Convert every video to MP4, FLV and OGG, but that means 3 files for every video?!

Does Firefox play mp4 h.264 within the HTML5 video tag?

web development, , , , , , , , , , , , ,

As Firefox has declared it will play only open formats within the HTML5 video tag support. But however is there any way to play video with the mp4 h.264 codec under FF with no plugin support?

That is the question.

jQuery localStorage plugin

javascript, , ,

I’ve decided to wrap the functionality of HTML5 localStorage in a jQuery plugin, with the simple functionality of a lifetime period for every cache. I’m going to post only the pre-release with the idea to clean up the code in the recent future.

(function(jQuery) {

   var supported = true;
   if (typeof localStorage == 'undefined' || typeof JSON == 'undefined')
      supported = false;
   else
      var ls = localStorage;

   this.setItem = function(key, value, lifetime) {
      if (!supported)
         return false;

      ls.setItem(key, JSON.stringify(value));
      var time = new Date();
      ls.setItem('meta_ct_'+key, time.getTime());
      ls.setItem('meta_lt_'+key, lifetime);
   };

   this.getItem = function(key) {
      var time = new Date();
      if (!supported || time.getTime() - ls.getItem('meta_ct_'+key) > ls.getItem('meta_lt_'+key))
         return false;
      return JSON.parse(ls.getItem(key));
   };

   this.removeItem = function(key) {
      return supported && ls.removeItem(key);
   };

   jQuery.localStorage = this;

})(jQuery);

if (!$.localStorage.getItem('test')) {
   $.localStorage.setItem('test', ['stoimen'], 600000);
   alert('dynamic');
} else {
   alert('from cache');
}

Any feedback is welcome! Yet again the code isn’t tested at all.

Storing JavaScript objects in html5 localStorage

javascript, micro tutorial, , , , , , , , , ,

There is a rising new age of HTML5, which comes with very nice features as video tag and localStorage. What localStorage is? In fact we have been waiting for long time to have something that give us the power of storing more and more on the client side. That’s because the net is becoming larger and therefore heavy.

Imagine if you have the possibility to store large JSON returned from an AJAX call on the client. That’s now reality with the localStorage object in HTML5 and it can be accessed with something like this code:

localStorage.setItem(key, value);
alert(localStorage.getItem(key));

Can we store entire objects?

Yes there is a way extending a bit the logic of the code above. The localStorage in fact stores only strings, but what about arrays and objects. You can additionally use JSON global objects and its two methods – stringify and parse:

var a = JSON.stringify({name:'obj'});
alert(JSON.parse(a));

Do browsers support all that?

Of course … not! localStorage is supported by Firefox 3.5+, Chrome 2+, Safari 4+ and MSIE 8+. The solution is not to rely on browser version, but to check for object existence, and than to combine both techniques:

localStorage.setItem('a', JSON.stringify({ name : 'obj' }));
alert(JSON.parse(localStorage.getItem('a')));