Posts Tagged: javascript


8
May 10

jquery multiple dates highlighting

emirplicanic.com wrote a cleaner and easier way to highlight multiple dates in jQueryUI datepicker. I previously settled with eyecon.ro’s datepicker plugin.


26
Apr 10

underscore.js

Underscore.jsmade my server side javascript coding easier. I don’t need to write my own buggy implementation of map-filter-reduce routine anymore.


26
Apr 10

node-stomp: STOMP client for NodeJS

I wanted to teach myself NodeJS so I wrote a library/module called node-stomp that talks to a STOMP server. That was a fun experience.


31
Aug 09

jqtouch

trying out jQTouch again. i remembered when i first got my iphone 3G, i tried to write a better webapp version of my favorite bus schedule app for iphone. i was torn between iUI and jQTouch. being a jQuery fanboy, choosing jQTouch was a no brainer. the animation wasn’t as smooth as a native app but it’s easier to work with. the project? like most of my toys, it’s in limbo.


14
Aug 09

giving YUI some love

working with YUI wasn’t as bad as i thought. managed to survived without the jQuery or prototype magic. somebody should write a book on it – or somebody already did. the sheer size of the docs and the API can overwhelm those trying to evaluate the framework.


13
Aug 09

ruby-like syntax for javascript array functions

At work, we recently decided to use YUI (Yahoo UI) to generate our user interface. YUI is great. It got almost all the widgets we need. Tabs, tree, carousel... As a result, we have consistent look all throughout. We dump the javascript framework that came with Ruby on Rails and use YUI instead.

Now, here's the problem. If you've use prototype or jQuery, you must be used to using the utility functions these frameworks provide. I go big on jQuery's each function for iterating through arrays and array-like object. Unfortunately, YUI - in version 2.x, at least - does not provide these array functions.

In a course of an hour, I wrote a handy set of functions to get me through. It could've been easier if I just include jQuery since the noConflict function makes it work with any js framework but then I got a mandate to focus on YUI.

JavaScript:
  1. Array.each = function(a, fn){
  2.     for(var i=0; i <a.length; i++){
  3.         fn(a[i]);
  4.     }
  5. };
  6.  
  7. Array.prototype.each = function(fn){
  8.     Array.each(this,fn);
  9. };
  10.  
  11. Array.collect = function(a, fn){
  12.     var new_array = new Array();
  13.     a.each(function(e){
  14.         new_array.push(fn(e));
  15.     });
  16.     return new_array;
  17. };
  18.  
  19. Array.prototype.collect = function(fn){
  20.     return Array.collect(this, fn);
  21. };
  22.  
  23. Array.inject = function(a, init, fn){
  24.     a.each(function(e){
  25.         init = fn(init, e)
  26.     });
  27.     return init;
  28. };
  29.  
  30. Array.prototype.inject = function(init, fn){
  31.     return Array.inject(this, init, fn);
  32. };
  33.  
  34. Array.detect = function(a, fn){
  35.     for(var i=0; i <a.length; i++){
  36.         if(fn(a[i])){
  37.             return a[i];
  38.         }
  39.     }
  40. };
  41.  
  42. Array.prototype.detect = function(fn){
  43.     return Array.detect(this, fn);
  44. };
  45.  
  46. Array.select = function(a, fn){
  47.     var new_array = new Array();
  48.     a.each(function(e){
  49.         if(fn(e)){
  50.             new_array.push(e);
  51.         }
  52.     });
  53.     return new_array;
  54. };
  55.  
  56. Array.prototype.select = function(fn){
  57.     return Array.select(this, fn);
  58. };
  59.  
  60. Array.reject = function(a, fn){
  61.     return a.select(function(e){
  62.         return (!fn(e));   
  63.     });
  64. };
  65.  
  66. Array.prototype.reject = function(fn){
  67.     return Array.reject(this,fn);
  68. };
  69.  
  70. Array.reduce = Array.inject;
  71. Array.prototype.reduce = Array.prototype.inject;
  72. Array.map = Array.collect;
  73. Array.prototype.map = Array.prototype.collect;

Use it like:

JavaScript:
  1. >>> var a = [1,2,3,4];
  2. >>> a.reduce(0, function(x,y){ return (x+y); });
  3. >>> 10

Basically, almost all functions are built on top of Array.each so I'm not sure how fast it'll go.

Happy hacking.


21
Sep 07

jQuery UI

jQuery released jQuery UI last week. Currently playing with the demos. They look promising.


23
Nov 06

Prototype Modal CSS Window

Just discovered this amazing javascript library for modal CSS window over at http://prototype-window.xilinus.com. Too bad, I've hacked Lightbox Gone Wild from Particletree to fit our current project.


6
Sep 06

What’s New in My Toolbox: Scriptaculous

Not very much a fan of javascript. At first I do everything. Then came moo.fx. It's great. Unfortunately, my current project needs more feature/functionality that moo.fx cannot offer. Actually, I can make moo.fx do them. I just don't have the time. I need a library that I can readily use.

No sweat. Scriptaculous has them. I know. Am a bit late on this AJAX/Javascript revolution of sort. I believe it's better late than never.

There are tons of effects scriptaculous have that I can only dream of. One nifty effect I'm stoked at is the inline/inplaceeditor. A div that automagically turns into a textbox and allows realtime editing is cool. Best of all, I don't have to write tons of code. It's done in a line or two.

Paired with CodeIgniter, I'm writing webapps faster that before. Yeah, I never enjoyed writing app from scratch until now. That explains the lack of post here for days.

Scriptaculous is going to be a mainstay in my toolbox. So what's in my toolbox at present?

  • Code Igniter - My PHP framework of choice. Lean and mean.
  • Scriptaculous - A very easy to work with Ajax/javascript effects library.
  • MySQL - Need to say more?
  • PostgreSQL - Rock solid open source RDBMS. Database driven app development is faster with it.
  • Kate Editor - My editor of choice in Linux. It's ability to open multiple remote files makes development faster.
  • VIM - For writing snippets of code before putting them in project codes. Oh, I write tests first.

There are others but those listed are what I use on a daily basis.


30
Aug 06

moo.fx

Lightweights are in. If functional javascript is what you want, moo.fx is all you need.