Ajax Examples

[참고]http://ajaxpatterns.org/Ajax_Examples

Ajax Examples

From Ajax Patterns

This page is a collection of real-life Ajaxian systems. If you're hunting for smaller examples, I'm building up a collection of toy demos. The idea there is to illustrate one tinny little pattern at a time. In contrast, many of the systems here embody a whole set of Ajax patterns.

The sections, for now, distinguish between real, production, systems and demos/prototypes. Also, the examples are focused around the application rather than the host. So Amazon Diamond Search fits into Search Engines, not E-Commerce, for example.

This page is open for editing - please contribute. Ajax is not just Google Maps, ne? Feel free to add just the demo without any relevant patterns - the main thing is to just get a big list going.

With thanks to FiftyFourEleven, which linked to many examples used for the original patterns. And to Dion and Ben @ Ajaxian, for all the Ajaxian showcases.

Contents [hide] 1 To be categorised 2 Admin (Site/System Administration) 3 Chat 4 Community/Sharing/Social/Folksonomy 5 Collaborative/Office/Wiki 6 Content/Info 7 Data Mining/Visualisation/Visual Modelling 8 Demo/Proof-Of-Concept 9 Development Online 10 E-Commerce/Trading 11 Game/Toy 12 Graphics 13 Mail 14 Mapping (GIS) 15 Programming 16 Productivity/Management 17 Portal 18 Search 19 Terminal

[edit]

To be categorised

Drop any new sites here if uncertain which category.

[edit]

Admin (Site/System Administration)

• WPLicense Overview Cross-Domain Proxy Live Form Progress Indicator

[edit]

Chat

Common Patterns: Periodic Refresh, Explicit Submission

(With thanks to Bact.)

Early/Demo:

• Treehouse Chat
• XHTML live Chat
• Lace Status Area
• chat.app One-Second Spotlight
• JavaScript Draw
• AJAX Chat Tutorial

Production:

• Tag-Board
• QWAD Chat TODO View when demo works

Embedded:

• Blogchat TODO View when people logged on
• Quek Sprite

[edit]

Community/Sharing/Social/Folksonomy

• del.icio.us [1] Suggestion when posting new links.
• Digg Spy Periodic Refresh One-Second Spotlight Cross-Domain Proxy
• Feedmarker Microlink(Results)
• Flickr PopupOutline Selection(Notes) Editable Text
• Ajallerix AJAX, simple, fast Web image gallery
• 3bases social search social search engine using AJAX
• Ajax Portal
• Askeet by symfony digg-like AJAX interactions explained step-by-step, source code available, open source

[edit]

Collaborative/Office/Wiki

• JotSpot Live Form Periodic Refresh
• Tiddlywiki Microlink Richer Plugin(Local file saving) One-Second Spotlight
• Concisus A groupware suite, that uses AJAX techniques to change data with the server. See the project or appointmentcenter applications.
• NumSum spreadsheet Fat Client
• Writely word-processor Fat Client

Demo:

• Instant Edit(Wiki-like)

[edit]

Content/Info

• Gollum Ajax based Wikipedia Browser for the fast and eyefriendly browsing throw the free encyclopedia "Wikipedia". Cross-Domain Proxy
• PressDisplay Multi-Stage Download Popup
• NetFlix Top 100 Popup

[edit]

Data Mining/Visualisation/Visual Modelling

• jsquery AJAX javascript ResultSet with securable JDBC server interface
• Rpad Microlink

[edit]

Demo/Proof-Of-Concept

There should be on a separate page, just keeping them here for convenience right now. Could then add all the bling demo for the various Ajax Frameworks.

• AjaxPatterns Demos Lightweight demos referred to throughout the Ajax Patterns.
• Ajax Login Demo Secure Login
• ZK Demo Various components with server-centric approach.

[edit]

Development Online

Note: This section is for an unusual category of Ajax applications that support software development. If you have a development framework to add, you can introduce it on the Ajax_Frameworks page.

• ThyAPI - An user-interface development set of widgets, allowing the creation of application-like interfaces to run in browser.

• Ajaxed Helps creating Suggestions (auto-complete).

[edit]

E-Commerce/Trading

• Internet Bargain Center Ajax-based eBay category selection
• BetFair Drilldown Menu Live Form Lazy Registration
• Rapha Microlink(Shopping Cart)
• JackBe
• If Images Stock Photography Price calculator for Rights Managed photos
• Ajax Catalogue Ajax-based Catalogue Demo
• Amazon Catalogue Tree Amazon Catalogue Tree
• tradeOver Online free trading simulation

[edit]

Game/Toy

• DHTML Lemmings That's just wrong.
• DHTML arcade/action games An extensive collection that demonstrate the power of DHTML
• Dunstan Orchard's Blog Live Search Periodic Refresh (Cartoon banner reflects current weather in UK) Virtual Workspace / Zooming and Panning (pan the banner)
• Football Pick 'Em Drag-And-Drop Highlight Progress Indicator
• Harry Potter Magical Diary Embedded Text Event Scheduling
• Magnetic Poetry Periodic Refresh Rich CSS Drag-And-Drop
• Super Maryo World Honto! That's just wrong, Japanese-style.
• "The Fonz" text adventure Rich CSS Explicit Submission

[edit]

Graphics

• Colr: Playing with colours
• Coloir: Ajax Slideshow One-Second Spotlight

[edit]

Mail

• GMail Microlink Highlighting Selection Popup("Loading...")
• Oddpost Rich CSS
• Roundcube Rich CSS Drag and Drop Folders Simple view refresh

[edit]

Mapping (GIS)

Common Patterns: Virtual Workspace, Semantic Events(Sometimes), Popup

Primary Maps:

• A9 Maps Sprite(thumbtacks)
• Google Maps Overview Sprite
• search.ch - Swiss Map

Mashup Maps:

• Housing Maps - Craigslist - Google Maps Sprite
• Google Maps Mashup Blog Sprite
• UK Traffic Sprite

[edit]

Programming

• HTML Form Assembler Live Form

[edit]

Productivity/Management

• 24SevenOffice web-based ERP/CRM solution. Live Search Suggestion Drag-And-Drop Periodic Refresh Sort-And-Filter Drilldown Menu
• Kiko Drag-And-Drop
• Calendar Editable Text
• 37Signals Backpack One-Second Spotlight Microlink
• 37Signals Base Camp
• 37Signals Ta-Da List
• Tudu Lists J2EE Open Source project
• FormAssembly's Time Tracker
• Remember The Milk Todo List
• Planzo Drag-And-Drop
• Calendar Hub
• I-ToDo by Mawisoft Todo List
• theList Flexible Bug-tracker. Source code available PHP/mySQL

[edit]

Portal

Common pattern: Portlet

• Backbase Demo Drag-And-Drop Sort-And-Filter Drilldown Menu
• Claude Hussenet's Portal Cross-Domain Proxy Periodic Refresh
• FeedTV Ajax based Feed Reader
• Google Portal Drag-And-Drop
• Google News Microlink
• JavaRSS Analysis Cross-Domain Proxy
• [2] Drag-And-Drop Rich CSS Embedded Text Lazy Registration Popup(Calendar+Hints
• Netvibes

[edit]

Search

Common patterns: Submission Throttling or Explicit Submission

• ListSomething.com Live Search for Classifieds
• A9 Microlink(Results, Column "Try It!") Highlighting Selection(In Column Add/Remove)
• Amazon Diamond Search Live Search Microlink("Learn") Slider
• Band News Search Microlink
• Delta Vacations Search Sort-And-Filter
• DG Suggest Search Suggestion
• Eniro Swedish phone directory. Results expand on click.
• Hotel Meta-Search Cross-Domain Proxy Slider Live Form
• Interactive Domain Search Live Search
• Kayak Multi-Stage Download Progress Indicator Suggestion Slider Cross-Domain Proxy
• Ripped Tickets Live Search
• HoverSearch Popup
• TalkDigger Feed meta-search. Multi-Stage Download Cross-Domain Proxy
• Yahoo Mindset Slider
• Zuggest Live Search Suggestion

[edit]

Terminal

Common patterns: Rich CSS, Explicit Submission Fat client

Demo:

• AnyTerm Rich CSS XMLHttpRequest Call
• Web shell
• JS/UIX Unix Shell Even implements Vi!

Retrieved from "http://www.ajaxpatterns.org/Ajax_Examples"