Adweb Opentopic AJAX

Speechmaker: 0556151 DVillaPPTmaker: 06302010071 Ruby

Loading…

E x t J S

• Brief Introduction• Applications• Structures & Contents• Samples• Pros and Cons• Q & A

Outline

Adweb Opentopic – Ajax - ExtJS

• Brief Introduction• Applications• Structures & Contents• Samples• Pros and Cons• Q & A

Outline

Adweb Opentopic – Ajax - ExtJS

• A Javascript Library for RIA

Adweb Opentopic – Ajax - ExtJS

Brief Introduction notion

• 2006 Jack Slocum extended Yahoo!User Interface(YUI) as YUI-Ext

• 2007 Apr 1st, version 1.0 officially published

• So far latest established - v2.2 to be established – v3.0

Adweb Opentopic – Ajax - ExtJS

Brief Introduction history

• 100% javascript - supported by most browsers• Open Source• OOP

• Integrated with…

Adobe AIR

Google Gears

Google MapsAdweb Opentopic – Ajax - ExtJS

Brief Introduction characteristic

• Other data handling/events/css control…

• Brief Introduction• Applications• Structures & Contents• Samples• Pros and Cons• Q & A

Outline

Adweb Opentopic – Ajax - ExtJS

Adweb Opentopic – Ajax - ExtJS

Application http://10.132.140.71:4230/homework/students.xml

• Brief Introduction• Applications• Structures & Contents• Samples• Pros and Cons• Q & A

Outline

Adweb Opentopic – Ajax - ExtJS

Adweb Opentopic – Ajax - ExtJS

Structure & Content hiberarchy

ContainerLayout• AbsoluteLayout• Accordian• AnchorLayout• BorderLayout

• CardLayout• ColumnLayout• FitLayout• FormLayout• TableLayout

Panel• TabPanel • Tip• Window

• FieldSet• FormPanel• GridPanel• TreePanel

Adweb Opentopic – Ajax - ExtJS

Structure & Content UI

Window• MessageBox• Window

TreePanel• TreeNode AsyncTreeNode• TreeLoader• TreeNodeUI• SelectionModel

Adweb Opentopic – Ajax - ExtJS

Structure & Content UI

Form• GridPanel EditorGridPanel PropertyGrid• GridView GroupView• ColumnModel• SelectionModel

Adweb Opentopic – Ajax - ExtJS

Structure & Content UI

FormPanel• Field• Checkbox• ComboBox• DateField• Hidden• HtmlEditor• NumberField• Radio• TextArea• TextField• TimeField• TriggerField

Adweb Opentopic – Ajax - ExtJS

Structure & Content UI

Template• XTemplate

DataView

Data• DataStore• DataReader• Proxy• Record

Adweb Opentopic – Ajax - ExtJS

Structure & Content UI

Tool• Ajax

• DomHelper

DomQuery

• LoadMask

• QuickTips

• CSS

• Json

• Format

• DelayedTask

Fx• Highlight• Frame• fadeIn fadeOut• slideIn• slideOut• Easing• switchOff

• Puff• Scale• sequenceFx• Shift• Ghost• Pause• syncFx

stopFx • Others Menu/Toolbar…

Adweb Opentopic – Ajax - ExtJS

Structure & Content UI

OOP Implements• Extend extend a parent class to get a child class

• Apply / ApplyIf copy attributes of one class to another

• Override override some methods in some classes

Adweb Opentopic – Ajax - ExtJS

Structure & Content UI

• Brief Introduction• Applications• Structures & Contents• Samples• Pros and Cons• Q & A

Outline

Adweb Opentopic – Ajax - ExtJS

http://extjs.com/deploy/dev/examples/samples.html

Adweb Opentopic – Ajax - ExtJS

Samples

• Brief Introduction• Applications• Structures & Contents• Samples• Pros and Cons• Q & A

Outline

Adweb Opentopic – Ajax - ExtJS

• Compare with… jQuery, Mootools, Dojo…

Adweb Opentopic – Ajax - ExtJS

Pros and Cons chart in 2007

Pros• Strong UI & good performance• Speed• OOP/module good expansibility• Complete Documents• …

Cons• Complexity• Heavy frame (includes plenty of UI)• …

Adweb Opentopic – Ajax - ExtJS

Pros and Cons

^-^

T-T> <

• Brief Introduction• Applications• Structures & Contents• Samples• Pros and Cons• Q & A

Outline

Adweb Opentopic – Ajax - ExtJS

?Adweb Opentopic – Ajax - ExtJS

Q & A

Though DEADLINE is never over, Happiness should NEVER be lost.

+u to all. ^-^

Adweb Opentopic – Ajax - ExtJS

Thanks at the end