Thursday, October 25th, 2007

Upgrading to Prototype 1.6: A practical example, RadiantCMS

Category: Examples, Prototype

Mislav Marohnić has taken RadiantCMS and upgraded the Ajax pieces to Prototype 1.6.

He has all of the changes in one place and has detailed all of the changes he made. This is a great way to learn about what is new in Prototype 1.6. Here are a few of the before/afters:

javascript

  1. // before:
  2. this.tab_container = document.getElementsByClassName('tabs', this.element).first();
  3. // after:
  4. this.tab_container = this.element.down('.tabs');
  5.  
  6. // before:
  7. new Insertion.Bottom(
  8.   this.tab_container,
  9.   '<a class="tab" href="javascript:TabControl.controls[\''
  10.   + this.control_id
  11.   + '\'].select(\'' + tab_id + '\');">' + caption + '</a>');
  12.  
  13. // after:
  14. this.tab_container.insert(
  15.   '<a class="tab" href="javascript:TabControl.controls[\'#{id}\'].select(\'#{tab_id}\');">#{caption}</a>'.interpolate({
  16.     id: this.control_id, tab_id: tab_id, caption: caption
  17.   })
  18. );
  19.  
  20. // before:
  21. divs = $$("div.tag-description");
  22. $A(divs).each(function(div){ Element.show(div) });
  23.  
  24. // after:
  25. $$("div.tag-description").invoke('show');
  26.  
  27. // before:
  28. var sibling = row.nextSibling;
  29.  
  30. // after:
  31. var sibling = row.next(); // ignore empty text nodes etc

Read the full article to see a nice explanation for all of the refactorings.

Posted by Dion Almaer at 8:12 am
Comment here

+++--
3.8 rating from 38 votes

Comments Here »

Comments feed TrackBack URI

Leave a comment

You must be logged in to post a comment.