Archive for October, 2006

Some examples of Mootools in action

I spotted this post over at the Mootools forums and thought I’d share. It’s really amazing how much you can get out of this little library. One of the things our new framework does is let us create functionality like this and deploy it so any producer/engineer can use it with relatively little effort.

Tabs

The original author asked me for a moo-conversion, work is in progress. Will refactor still much of the code and add support for Dragging into tabcontent (Dragging over a tab activates it).

http://dev.digitarald.de/tabs.html

Playground Dragging (Reverse Dragging)

Dragging reversed, wonky because onStart and onComplete have this 10ms delay, so in some situations the position is changing.

http://dev.digitarald.de/drag.html

Fly-over-background

Scrolling effect, like the effect in flash used on some nice sites. Scrolling from content to content that is attached to a big background image. Just a performance check ;)

http://dev.digitarald.de/tile.html

Ghost Dragging

Shopping Card dragging? Drag your favorite element and drop a copy of it, like in Rich Client Shopping cards or Item-to-Category. Very basic, added my personal spice with ajax and more checks inside my own rich client project ;)

http://dev.digitarald.de/ghostdrag.html

More to come (Better Lightbox, mooSelectBox, conversion of Floating Windows).

Hello World!

Greetings all,

This is the first official post of this blog open to the public. For those of you who don’t work at CNET, the scoop is that we’ve had this blog up for internal use for most of the year. After a bit of debate we decided that we’re doing things here that might be useful to others and decided to turn this thing on for the outside world.

This blog is mostly maintained and posted to by me - Aaron Newton. I’m a Product Manager at CNET for our “Redball” family of sites: News.com, CNET.com, and Download.com, and my roll here is rather broad, but as far as anyone reading this is concerned, I’m one of our Javascript/Ajax evangelists (yes, I’m stealing that title from Bill Scott).

This blog is focused on clientside technologies, mostly javascript but you’ll find some css and flash stuff here, too. I tend to rip off Ajaxian a lot, reposting here what they’ve posted with my own opinion. This blog is set up to email people when I post (I’m considering using feedburner), so a bunch of our developers subscribe. They don’t always have the time to go dig around on the internets for this stuff, so by reposting it here it goes out to them. If you’d like to get an email when I post, just drop your email address in the form over at the top of the nav.

Expect to see new stuff in the Library and Examples sections later this week.

-a.n.

Mootools and 3rd party widgets

I have several classes that I’ve written for use with Mootools that I’ll be posting about soon. I thought I’d go ahead and point to this great little slider widget over at lenhatanh.pebox:

slider.gif

I know that Valerio over at mootools is planning a plugin repository for things like this, which I think will really help move that framework forward. In the mean time, I’ll probably take things like this and move them into our own global framework after testing them out so that developers here can make use of them.

jQuery Image Gallery: Transitions, thumbnails, reflections

via ajaxian: jQuery Image Gallery: Transitions, thumbnails, reflections

Ramin B. has put together yet another image gallery. This time it is using jQuery as the library, and has a bunch of rich effects such as transitions, reflections, and the use of thumbnails.

It looks pretty close to the Flickr Flash widget.

Check out the Demo Page

jQuery Image Gallery

DOM Helper: IE Inline CSS Editor

via ajaxian: DOM Helper: IE Inline CSS Editor

Rhys Jeremiah created DOM Helper, an inline CSS editor for Internet Explorer: | Read the rest »

IE7: Twice as performant as IE6, but half as slow as FF 1.5

via ajaxian: IE7: Twice as performant as IE6, but half as slow as FF 1.5
Ross Dargahi of Zimbra complained about IE 6 performance. Since IE 7 is here, he decided to retry his tests and see how Microsoft had done:

Microsoft’s IE team has clearly been hard at work on improving their browser’s memory management and JavaScript performance. IE 7 has made some significant leaps forward based on some initial in house testing here at Zimbra. We are in general observing about a 2x performance improvement with IE 7 vs IE 6 when using the Zimbra Web Client (ZWC). | Read the rest »

Scrybe - Online Organiser with true Offline support

via ajaxian, and the video is totally worth the watch.

Scrybe is an on-line organiser that looks too good to be true, and some are dying to try.

Some core features are:

  • Offline Support: Go to “work offline” and it just works? It even synchronizers up when you get online again.
  • Context: It knows the context it is in.
  • Timezones: Easy to change timezones, and create secondary time zones.
  • List Transfer: Copy from excel and paste into the web app.
  • Jump Context: Drop todos onto calendar dates.
  • Thought Pad: Rich editing. Copy and paste directly from web pages.
  • Sync: paper isn’t evil, so support it. | Read the rest »

Dojo 0.4 out

Ajaxian has the scoop:

The Dojo team has fully released version 0.4 which “contains many exciting new features, a whopping 529 bugs closed, and the initial release of the long-awaited documentation tool, with inline API documentation that will continue to improve with follow-on releases. These improvements will make Dojo appealing to entirely new audiences and will bring Ajax applications to a new level of acceptance as a first-class user environment. Some of the highlights include:”

  • dojo.a11y: the foundation for accessibility (a11y), implemented in some of Dojo’s widgets in 0.4 with more to follow in 0.5. Dojo strives to provide keyboard function as well as integration with high-contrast mode and screen readers for the visually impaired.
  • dojo.charting: A charting engine to implement a variety of chart types using vector graphics
  • dojo.gfx: a 2D vector graphics API which renders natively to browsers as SVG or VML
  • dojo.i18n: a follow on to the translation support in 0.3.1, there is now build support for collecting localized resources in a single file as well as support for localized date and time formatting. More formatting types and more localization to come in 0.5.
  • dojo.lfx: major improvements, such as chainable animations
  • dojo.namespaces: support for extensible widget namespaces and an automatic widget manifest loading feature.
  • dojo.widget: new widgets like Clock, FilteringTable, ProgressBar, plus enhancements to Editor2 and the AccordionContainer. Also localization of some widgets, such as DatePicker.
  • AOL’s contribution of a linker for Javascript, not yet integrated into the build.

The roadmap has also been updated, showing 0.4.1, 0.5 and beyond.

Detecting IE7+ in javascript

via ajaxian:

Abe Fettig knows that we need to start detecting the difference between IE6- and IE7+, because a lot of the hacks that we were using for IE are no longer needed.

He didn’t want to grok the user agent, as that is very brittle, so he came up with:

if (typeof document.body.style.maxHeight != “undefined”) {
// IE 7, mozilla, safari, opera 9
} else {
// IE6, older browsers
}

Any other thoughts?

| Read the rest »

Bill Scott on Designing a Component

Bill Scott has a great article on designing a component that is worth a read. He talks about his rules of thumb when building something that should be reusable (and nearly everything should):

  • Make the component specific in purpose, yet flexible in use.
  • Avoid the do-everything component. Instead make it do the main thing well. But make it pragmatic by keeping it flexible.

  • Separate the concerns of interface, interaction, and content.
  • Avoid hard-coding visual style, give flexibility in the interaction model and provide flexible ways to manage data content. Keep these three areas independent to allow them to be customized separately.

  • Document the interface and use the component before releasing it.
  • You know the experience. You think you have a great idea. Then when you go to explain it to another person you immediately see the holes in your logic. Documentation provides a way to explain your interface; writing demos allow you to exercise the component to test its ease of use and flexibility.

There’s a lot more detail and examples in the full article.

This kind of thinking has had a big influence on my work on CNET’s global framework and stumbling across this article just recently made me refocus my thoughts on the topic.

a.n.

Categories

Archives

Links and whatnot