Web Info & Tutorials

September 29th, 2006

INTRODUCING THE AJAXIAN.COM LINKEDIN COMMUNITY PROGRAM

We are excited to announce the Ajaxian.com LinkedIn Community program. Every day we get numerous requests from companies to find candidates, from candidates looking for new opportunities, community members asking us who would be right person to talk about one thing or another, request for introductions, etc.

Meanwhile, we have never gotten around put in place a user community for Ajaxian. There’s no registration, no monthly updates, just good old RSS and your comments on the site.

We are therefore suggesting that you participate with us in an experiment that we think we’ll all benefit from – the Ajaxian.com LinkedIn Community program.

Here’s how it works: you simply sign up in LinkedIn.com, a very popular social networking site, and “connect” to the user named “Ajaxian.com Community” by sending an invitation to linkedin@ajaxian.com. And we will of course accept all invitations from community members.

The benefit to you is that community members will be able to “search through” the Ajaxian.com network and find other members with like interests / jobs / candidates / etc, without compromising any personal information. They will also be able to publish job openings and résumés visible to the Ajaxian community (again using LinkedIn features). And we will forward requests for introduction, job applications, etc. This is an additional way for us to connect better and get closer, besides posting comments on the site, which you can still do as usual. Ben and Dion will be manning the Ajaxian.com user. Also, since many of you are already on LinkedIn, we’re hoping it is trivial to do this.

September 29th, 2006

VALOONY - AJAX ENABLED COMPARISON SHOPPING

The German comparison shopping site Valoony has launched three new Ajax enabled comparison shopping mini apps: one for digital cameras, another for perfume, and — my favorite — one for wine.

valoony.jpg

The interface allows you to adjust various numerical parameters using sliders, select brands, types and specific stores, and enter search terms, etc., all of which cause the right hand content panel to update via XHR. On Joe Walker’s 4 States of Ajax Adoption, I’d say this is state #2 — Progressive Enhancement. The interface still uses IFrames and more traditional pre-Ajax techniques. Also, you can easily get into a confused application state by using the browser’s back button instead of the “Zurueck” button in the page.

From a user experience perspective, I’m not sure this particular use of Ajax improves my shopping experience or is something that couldn’t have been done before with Javascript and IFrames. Then again, I don’t know what the old shopping experience was like, so this may be a vast improvement. It’s certainly much better than my last frustrated fumblings on CNet. Also, I got an excellent deal on a 1996 Brunello. ;-)

September 29th, 2006

ARCHITECTING CSS

CSS is pretty bicentric to Ajax, and super Ajax projects ofttimes hit a aggregation of CSS to care with, so it’s worthwhile asking how to reassert every of it. Garrett Dimon’s Architecting CSS is a beatific ordered of advice for structuring your CSS files (from July, 2005; unearthed on Digg).

The article identifies threesome structure to care your stylesheets:

  • Archetype-Based A stylesheet for apiece collection of page, e.g. homepage stylesheet, article stylesheet, etc.
  • Page Element/Section-Based A stylesheet for apiece collection of tender section, e.g. brick stylesheet, sidebar stylesheet.
  • Tag-Based Similar to the preceding approach, but supported around tags, e.g. modify stylesheet, plateau stylesheet.

Other topics include:

  • Including stylesheets with @include
  • Deciding how such to rely on selectors (Redundancy vs Dependency)
  • Use of comments
  • Use of !important
  • Alphabetizing attributes to secure you don’t block any
September 29th, 2006

IN-BROWSER WIREFRAME PROTOTYPING WITH FRAMETASTIC

Christian Romney was sick of doing wireframesin powerpoint and photoshop, so he created a quick and dirty in browser wireframe tool called Frametastic, which uses Prototype and Script.aculo.us under the covers.

Now, before you think this is some uber-cool web development tool, let me give you the caveats:

  • It’s currently Firefox only for reasons I’ve just plain not bothered to figure out (I’m sure it’s something trivial)
  • It keeps state only during the lifespan of the page - refresh, close window, or navigate away and all your work is lost (eventually, I’ll add a dead-simple Ajax call that persists the stored wireframes to the server)
  • It has some small UI bugs like when you name a box, the label keeps focus instead of the box itself

Having said all that, I find it to be extremely useful in my daily work because I don’t require anything more sohpisticated. I’m a big fan of lightweight tools and lightweight processes - I’d call them agile, but don’t want to incur Steve Yegge’s wrath ;). Feel free to download the code and improve it - I’m releasing under the terms of the MIT License - just please be kind and share your improvements with me. Oh yeah, here’s the obligatory demo. Enjoy!

If you’re wondering how to get started, just click and drag a box in the whitespace…

Frametastic

September 29th, 2006

THE DANGERS OF CROSS-DOMAIN AJAX WITH FLASH

In this blog entry, Chris Shiflett takes another look at some of the dangers that can come up with cross-site Ajax via a Flash object embedded in the page. He mentions a previous discussion where Chris points out the filename-specific nature (crossdomain.xml) of this example.

Julien (author of the example) replied in the affirmative that this was the case and Chris, amazed that this was the case, gives an example of how it could be exploited (including a test performed on Flickr). He continues on, talking about pulling in others more experienced with Flash to make sure this problem was true. They find it is and even went to far as to create a simulation of the Myspace worm to show its potential for abuse.

Chris also recommends:

If you have a public API and want to allow cross-domain Ajax requests with Flash, be sure to use a separate domain. If the user interface and API operate in the same domain, there’s almost no limit to what an attacker can do.

September 29th, 2006

GOOGLE READER FRESH LOOK

The initial Google Reader launched to desegrated reviews. Google has learnt from whatever of the critisism and has launched a new beta that has some changes:

  • Expanded analyse and itemize view
  • Simplified distribution functionality
  • Improved read-state management
  • Infinite scrolling
  • Unread counts
  • Mark every as read
  • and a clump more…

The itemize analyse stands out, as it shows how Google Reader could merge with GMail in the forthcoming (Yahoo! Mail has desegrated RSS already). This makes significance to me, as what is the disagreement between the two? Subscribing to an RSS take is pretty kindred to subscribing to a transmitting list.

Google Reader

Coverage:

September 28th, 2006

AJAX EXPERIENCE UPDATE: MORE SESSIONS, KEYNOTE AND SCHOLARSHIP PROGRAM

We’ve got a few quick updates on the upcoming Ajax Experience conference next month.

More Sessions

When we launched the event, we planned on five tracks of ten sessions each. However, due to a large number of speaker applicants and some last minute big-name additions, we expanded to six tracks. The show now has sixty 90-minute technical sessions, including two sessions by Google (GWT by the GWT team lead and a cross-site scripting talk by the Google Maps team) and of course, a lot of other good stuff. We’re going to be updating the session agenda on the conference site this week, so keep an eye out (we’ll probably post a quick note here, too).

Mozilla Keynote

We’ve got a lot of really great keynote news that we’re not quite set to announce yet, but we can say that Brendan Eich (inventor of JavaScript, etc.) from Mozilla will be back at the show to give a keynote. In the Spring, he spoke on JavaScript 2. This time around, he’ll be speaking on the future of the web.

Scholarship Program

We recognize that there are many in the community without corporate backers who simply can’t afford to attend a show like ours. We’re starting an experiment with this show: a small scholarship program.

Here’s how it works. If you want to attend but work for a shoe-string start-up, are an independent, are a starving student, or are otherwise unable to come up with the funds, send us an email (ajaxians at this domain name) with the subject “TAE Scholarship.” Tell us your story (we may get in touch with you to verify some of what you tell us).

We plan on accepting five applicants; please send your email no later than October 6 (next friday).

Note that in addition to this scholarship, we also offer an educational discount for passes to the show (contact our show’s organizer, Jay Zimmerman, for details on this — jzimmerman at nofluffjuststuff dot com).

If this program works out well, we may expand it for future shows. Let us know what you think!

September 28th, 2006

TRANSCORNERS: BECAUSE YOU ARE OBSESSED WITH ROUNDED CORNERS

People really are obsessed with rounded corners aren't they? If we had a simple way to express them in CSS, maybe then we would be writting JS libraries and CSS hacks to give us spikey corners or something :)

Well, the latest kid on the block is Transcorners, which is a mootools based rounded corners system.

Examples

JAVASCRIPT:
  1.  
  2. $('content').makeRounded('bottom left', {radius: 100});
  3.  
  4.  
  5. //round all corners with 30
  6. $('example1').makeRounded({radius: 30});
  7. we also have background:transparent; and border:1px solid #fff; in CSS on this.
  8.  
  9. //round top left corner with grey border and 20 pixel radius
  10. $('example3').makeRounded('top left', {borderColor: '#777', radius: 20});
  11.  

transcorners

September 28th, 2006

COMET WITH PHP

Manuel Lemos has cursive a post about
the info and challenges of an AJAX COMET feat in PHP
.

The article describes an move utilised to compel highly susceptible AJAX applications using the COMET approach, and how it crapper be implemented in PHP.

It also discusses how protocol densification and chunking change AJAX salutation delays, as substantially aspects that haw impact the pick between Athapascan 1.3.x with mod_gzip versus Athapascan 2.x with mod_deflate for AJAX COMET applications.

Community Question: Are some of the PHPers discover there doing COMET? If so, do you hit anything to add most the experience?

September 27th, 2006

SELENIUM 0.8 RELEASE

Version 0.8 of the web application functional testing tool Selenium has been released.

Jeff Xiong explaing the new features:

  • A "multiWindow" option which places the application-under-test in a  separate window, allowing testing of "frame-busting" apps. In the past Selenium didn’t deal with the applications-under-test (AUT) which use frames very well, because it put the AUT in an embeded frame instead of stand-alone window. That was one of the largest problems preventing people from using Selenium. In 0.8, we provided an option to put the AUT in a stand-alone window, so that we can deal with all kinds of AUT actions that previously might have broken Selenium (e.g. change location of "window.parent" or "window.top"). This is the most important improvement in this new version.
  •  More reliable page-load detection for popup windows. There’s a bug makes firefox cannot detect "children" windows’ page-load status. That means with the combination of older version of Selenium and firefox, there may be some unpredicatable test failures. In this new version we provided a firefox plugin, which enhances firefox and makes the test more reliable.
  • New cookie-management actions. The past versions cannot deal with cookies. Users had to set up cookie environment in AUT by themselves to test cookie-related functionalities like "login". 0.8 provided cookie-handling actions like "createCookie", "deleteCookie" and "storeCookie", so that users can setup and teardown cookie environment in test cases.
  • Run-speed slider and "Pause" button which replace the old Run/Walk/Step radio-buttons.  In past versions we provided only 2 different speed
    options: fast "Run" and slow "Walk". In 0.8 we provided a slider to control the speed. Users can choose any speed between "very fast" and "very slow", allowing them to observe the tests in action.

Jeff has a nice article on Testing Ajax applications with Selenium over at InfoQ.