Activate your free membership today | Log-in

Monday, October 6th, 2008

Mecca: A new social browser

Category: Browsers

Mecca is a new browser by the prolific Todd Ditchendorf of Fluid fame. It is currently in the works, and features:

  • Open Plug-in Architecture
  • Built-in Userscripting
  • Userstyles
  • ÜberView for Plug-in Split Views
  • Global Keyboard Shortcut
  • Single-Window Browsing Mode
  • BrowsaBrowsa Plug-in for Sidebars
  • Session Restore
  • Full-Screen Mode
  • Customizable Shortcuts
  • Integrated Gears-loading (InputManager)
  • Hidden “Closed” Windows
  • Thumbnail Plug-in for CoverFlow
  • TinyURL creation/expansion
  • Automatic Software Updates
  • Custom User-Agent Strings
  • Full WebInspector
  • Custom Window Opacity/Level/Style

It looks very interesting, and I can’t wait to see it!

Posted by Dion Almaer at 6:56 am
1 Comment

++---
2.5 rating from 2 votes

Friday, October 3rd, 2008

iPhone Web Apps running at full screen

Category: Mobile, iPhone

I am so happy that the NDA mess is over! Clancy has written about how you can have your iPhone Web app run in full screen and has a demo app that shows it off:

PLAIN TEXT
HTML:
  1.  
  2. <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" />
  3. <meta name="apple-mobile-web-app-capable" content="yes" />
  4. <meta names="apple-mobile-web-app-status-bar-style" content="black-translucent" />
  5.  

Posted by Dion Almaer at 4:03 pm
9 Comments

+++--
3.3 rating from 13 votes

Vista / OS X Mash-up Created with GWT on PHP

Category: GWT, PHP, Showcase

Here's an interesting link for a Friday. Viktor Zeman on Quality Unit sent us a link to "PostAffiliateXpress", some boring IT application with an interesting interface and an even more intriguing back-end.

The UI combines a Vista-like "Start" menu along with an OS X-like dock (using everyone's favorite fish-eye widget). It also has a built-in widget system that leverages Google Widgets. Overall, it's a pretty nice implementation of a desktop and windowing in Ajax.

The framework itself is "GwtPHP" which attempts to take all the advantages of GWT and deploy them to PHP backends in an attempt to solve the problem of limited Java-friendly hosting services. Unfortunately, the framework isn't available for use until sometime in early November.

Dual-License

The developers intend to use the familiar "free for hobbyists, pay up for commercial use" licensing model (what their licensing page calls a "what for what" model).

Give some feedback

Viktor says that they are quite keen to get feedback from folks on the project, so interested folks should get in touch, let them know what you think about the licensing model, and perhaps get early access, etc.

Posted by Ben Galbraith at 10:51 am
6 Comments

+++--
3.3 rating from 32 votes

Thinking about the difference between frameworks

Category: JavaScript, Library

I got to meet Aaron Newton at The Ajax Experience, and he is a thinker. He was really taking in the various talks, and interactions, and you could tell that he was trying to work out various angles on the frameworks. What makes them different? What makes them popular? Where are they going?

He wrote a really nice post on some of these thoughts that goes into detail on different patterns for JavaScript programing. The meme at the show was definitely "the frameworks all do the same thing, just with a different looking API" which makes it even harder to put your finger on differences sometimes. Aaron does a good job.

John Resig himself gave a talk comparing the frameworks. Considering that he is Mr. jQuery, I thought he was very unbiased and had some good thoughts:

Posted by Dion Almaer at 10:20 am
33 Comments

+++--
3.5 rating from 46 votes

Practical Functional JavaScript

Category: JavaScript, The Ajax Experience

Oliver Steele gave a great talk at The Ajax Experience this week on Practical Functional JavaScript.

For his talk, he ended up creating a samples application where you can run the code directly, very similar to what John Resig did in Learn JavaScript.

The samples take you through JavaScript world, stopping for:

Posted by Dion Almaer at 10:11 am
Comment here

+++--
3.2 rating from 9 votes

Life: The game in Canvas

Category: Canvas, Games

Kyle McGregor took a look at the JavaScript games for Life out there and decided to write a Canvas version that ends up being a lot snappier. The entire game is pretty small:

PLAIN TEXT
JAVASCRIPT:
  1.  
  2. var counterface = 0;
  3. var oInstance;
  4. var Game = Class.create();
  5.  
  6. Game.prototype = {
  7.         'working': false,
  8.         'map': '',
  9.         'interval_id': '',
  10.     'initialize': function()
  11.     {
  12.  
  13.                 //generate map
  14.                 var startmap = [];
  15.                
  16.                 for(var y = 0; y <90; y++)
  17.                 {
  18.                         var row = [];
  19.                        
  20.                         for(var x = 0; x <90; x++)
  21.                         {
  22.                                 var state = Math.random();
  23.                                 state = (state> 0.8)? 1:0;
  24.                                 row[x] = state;
  25.                         }
  26.                        
  27.                         startmap[y] = row;
  28.                 }
  29.  
  30.                 this.map = startmap;
  31.                
  32.                 oInstance=this;
  33.                 this.interval_id = setInterval(function(){oInstance.loop()}, 100);
  34.     },
  35.     'loop': function()
  36.     {
  37.                 if (document.getElementById('frame').getContext)
  38.                 {
  39.                         // drawing code here
  40.                         if(this.working == false)
  41.                         {
  42.                                 this.working = true;
  43.                                 this.draw();
  44.                                 this.step();
  45.                                 this.working = false;
  46.                         }
  47.                 }
  48.                 else
  49.                 {
  50.                         // canvas-unsupported code here
  51.                         alert('Your Browser does not support the canvas tag. try again  in firefox 1.5+ or Opera 9+');
  52.                 }
  53.     },
  54.         'draw': function()
  55.         {
  56.                 var ctx = document.getElementById('frame').getContext('2d');
  57.                 ctx.save();
  58.                 ctx.clearRect(0,0,450,450);
  59.             ctx.fillStyle = "rgb(0,0,0)";
  60.  
  61.                 for(var y = 0; y <90; y++)
  62.                 {
  63.                         for(var x = 0; x <90; x++)
  64.                         {
  65.                                 if(this.map[y][x] == 1)
  66.                                 {
  67.                                         ctx.fillRect (x*5, y*5, 5, 5);
  68.                                 }
  69.                         }
  70.                 }
  71.  
  72.                 ctx.restore();
  73.                 ctx.fill();
  74.         },
  75.         'step': function()
  76.         {
  77.                 var output = '';
  78.                 supercount = 0;
  79.                
  80.                 var tempmap = [];
  81.  
  82.                 for(var y = 0; y <90; y++)//work around for arrays passing by reference.
  83.                 {
  84.                         var row = [];
  85.                        
  86.                         for(var x = 0; x <90; x++)
  87.                         {
  88.                                 row[x] = this.map[y][x];
  89.                         }
  90.                        
  91.                         tempmap[y] = row;
  92.                 }
  93.                                
  94.                 for(var y = 0; y <90; y++)
  95.                 {
  96.                         for(var x = 0; x <90; x++)
  97.                         {
  98.                                 var countme = this.getNeighborCount(y,x);
  99.                                
  100.                                 if ( this.map[y][x] == 0 ) // dead cell 
  101.                                 { 
  102.                                         if ( countme == 3 ) 
  103.                                         { 
  104.                                                 tempmap[y][x] = 1; 
  105.                                         } 
  106.                                 } 
  107.                                 else
  108.                                 { 
  109.                                         if ( ( countme == 2 ) || ( countme == 3) ) 
  110.                                         { 
  111.                                                 tempmap[y][x] = 1; 
  112.                                         } 
  113.                                         else 
  114.                                         { 
  115.                                                 tempmap[y][x] = 0 ; 
  116.                                         } 
  117.                                 } 
  118.                         }              
  119.                 }       
  120.                 counterface++;
  121.                 this.map = tempmap;
  122.         },
  123.         'getNeighborCount': function(starty,startx)
  124.         {
  125.                 var count = 0;
  126.                
  127.                 for(var y = starty-1; y <= starty+1; y++)
  128.                 {
  129.                         for(var x = startx-1; x <= startx+1; x++)
  130.                         {
  131.                                 if(y>= 0 && y <90 && x>= 0 && x <90)
  132.                                 {
  133.                                         if(startx != x || starty != y)
  134.                                         {
  135.                                                 if(this.map[y][x] == 1)
  136.                                                 {
  137.                                                         count++;
  138.                                                 }
  139.                                         }
  140.                                 }
  141.                         }
  142.                 }
  143.                
  144.                 return count;
  145.         }
  146. }
  147.  

Posted by Dion Almaer at 10:07 am
3 Comments

+++--
3.3 rating from 12 votes

Thursday, October 2nd, 2008

New Netflix Developer APIs

Netflix has a long history of presenting at the Ajax experience, starting with Sean Kane giving talks on their use of Ajax and their approach to usability to this year's presentation when Bill Scott revealed Netflix's new Ajax developer APIs.

If these APIs were just about allowing developers to manage rental queues, it would be of limited interest. Instead, the APIs are quite broad and include features like:

# Performing searches of movies, TV series, cast members, and directors
# Retrieving catalog titles, including details about the title such as name, box art, director, cast, etc.
# Determining the subscriber's relationship to a specific title, e.g, in queue, saved, available on DVD, etc.
# Managing and displaying queues for users
# Providing conveniences such as auto-completion of partial search terms typed by a user.
# Displaying a user's ratings and reviews.
# Including functional Add and Play buttons in your web application.

Since IMDB lacks an API (and the community-provided APIs seem to be in various stages of disrepair -- note that the site linked to in this story is now down), this fully-supported offering from Netflix seems quite interesting indeed. Check out their blog post announcing the features and their new developer portal.

Posted by Ben Galbraith at 11:17 am
Comment here

+++--
3.7 rating from 7 votes

Symfony Firebug Extension: Firesymfony

Category: Debugging, PHP

Alvaro Videla just wrote in to tell us about Firesymfony, a Firebug extension that provides an alternative to Symfony's built-in web debug toolbar.

sometimes the toolbar position makes impossible to use some features of the layout of our website, like a link menu on the top right corner. It also happens that while we display a small popup with the resize functionality disabled it’s turns hard to access all the data displayed by the toolbar.

The solution I’ve came up with is to move all the data from the toolbar to Firebug, actually, to port the symfony web debug toolbar as a Firebug extension. This will remove the toolbar from the page html and will show it in a convenient place that almost every web developer is used to.

Taking advantage from the cool new features of symfony 1.2 I started a project to develop a symfony plugin to send the data to the Firebug extension. The later has been smartly called FireSymfony.

Alvaro has another blog post that talks more about the first release.

Posted by Ben Galbraith at 10:58 am
5 Comments

++++-
4.6 rating from 7 votes

YUI 2.6.0 Released: Carousels, Paginators, and lots of examples

Category: Yahoo!

Nate Koechley has announced YUI 2.6.0 final:

2.6.0 introduces a new Carousel Control, offers the Paginator Control for general use (it was previously bundled with DataTable), includes more than 450 total fixes, enhancements and optimizations, graduates eight components out of “beta,” and now ships with more than 290 functional