- Bookmarks Sidebar
- Email Folders
- Message/ToDo List
- Groups/Trello
- List
- Website Navigation
Bookmarks Sidebar
<tree>
<ti>Bookmarks Toolbar
<ti>Apps
<ti>Gmail</ti>
<ti>Trello</ti>
<ti>MDN</ti>
<ti>Twitter</ti>
</ti>
<ti>Mozilla
<ti>.org</ti>
<ti>developer</ti>
<ti>mozillians.org</ti>
<ti>browserID</ti>
<ti>bugzilla</ti>
</ti>
</ti>
<ti>Bookmarks Menu
<ti>Feature Pages
<ti>UX/ToDo</ti>
<ti>Features/Desktop</ti>
<ti>Silent Update</ti>
</ti>
<ti>Bugs
<ti>Bug 630792 - Add a close button and small toolbar to Tab View</ti>
<ti>Bug 596017 - Combine the Panorama button and the List Tabs button</ti>
<ti>Bug 587873 - App tabs should be the same in each window</ti>
</ti>
</ti>
</tree>Bookmarks Toolbar
Apps
Gmail
Trello
MDN
Twitter
Mozilla
.org
developer
mozillians.org
browserID
bugzilla
Bookmarks Menu
Feature Pages
UX/ToDo
Features/Desktop
Silent Update
Bugs
Bug 630792 - Add a close button and small toolbar to Tab View
Bug 596017 - Combine the Panorama button and the List Tabs button
Bug 587873 - App tabs should be the same in each window
Email Sidebar
<tree>
<header>
<ti>Folder</ti>
<ti>Unread</ti>
</header>
<group>
<ti>Inbox</ti>
<ti>5</ti>
<group>
<ti>Child</ti>
<ti>2</ti>
</group>
<group>
<ti>Other</ti>
<ti>3</ti>
</group>
</group>
<group>
<ti>Junk</ti>
<ti>3</ti>
</group>
<group>
<ti>All Mail</ti>
<ti>26</ti>
</group>
</tree>Folder Unread
----------------------
Inbox 5
Child 2
Other 1
Junk 3
All Mail 26
<tree>
<group>
<header>To Do</header>
<ti>Write out use cases
<ti>Groups (Logical)</ti>
<ti>Website Navigation</ti>
<ti>Email Folder Sidebar</ti>
<ti>Simple List</ti>
<ti>Bookmarks Sidebar</ti>
<ti>Message/Todo List</ti>
</ti>
<ti>Does jQuery have a tree view?</ti>
</group>
<group>
<header>Doing</header>
</group>
<group>
<header>Done</header>
<ti>Look at the XUL <treeview> element.</ti>
</group>
</tree>|------------ To Do ------------| |---- Doing ----|
| Write out use cases | | |
| - Groups (Logical) | | |
| - Website Navigation | |---------------|
| - Email Folder Sidebar |
| - Simple List |
| - Bookmarks Sidebar |
| - Message/Todo List |
| |
| Does jQuery have a tree view? |
|-------------------------------|
|---------------- Done -----------------|
| Look at the XUL `<treeview>` element. |
|---------------------------------------|
<tree>
<ti>Item 1</ti>
<ti>Item 2</ti>
<ti>Item 3</ti>
<ti>Item 4</ti>
</tree>Item 1
Item 2
Item 3
Item 4
<tree>
<header>
<ti>From</ti>
<ti>Subject</ti>
<ti>Date</ti>
<ti>*</ti>
<ti>!</ti>
</header>
<group>
<ti>Kyle</ti>
<ti>Hi!</ti>
<ti>Today</ti>
<ti>*</ti>
<ti></ti>
<group>
<ti>Kyle</ti>
<ti>Test</ti>
<ti>Yesterday</ti>
<ti>°</ti>
<ti></ti>
<group>
<ti>Kyle</ti>
<ti>Child</ti>
<ti>10/11/2011</ti>
<ti>°</ti>
<ti></ti>
</group>
</group>
</group>
<group>
<ti>Mike</ti>
<ti>Hmm...</ti>
<ti>Today</ti>
<ti>*</ti>
<ti>!</ti>
</group>
</tree>| From ^ | Subject | Date | * | ! |
-----------------------------------------------------
| Kyle | Hi! | Today | * | |
| > Kyle | Test | Yesterday | ° | |
| > > Kyle | Child | 10/11/2011 | ° | |
| Mike | Hmm... | Today | * | ! |
<tree>
<ti>Topics
<ti>Web</ti>
<ti>Mobile</ti>
<ti>Add-ons</ti>
<ti>Mozilla</ti>
</ti>
<ti>Docs
<ti>HTML
<ti>DOM</ti>
<ti>Video</ti>
<ti>Audio</ti>
<ti>SVG</ti>
<ti>WebGL</ti>
</ti>
<ti>HTML5
<ti>WebSockets</ti>
<ti>Offline Cache</ti>
<ti>Local Storage</ti>
<ti>IndexedDB</ti>
<ti>File API</ti>
</ti>
<ti>CSS
<ti>Gradients</ti>
<ti>Transforms</ti>
<ti>Transitions</ti>
<ti>Animations</ti>
<ti>Media Queries</ti>
</ti>
<ti>JavaScript
<ti>AJAX</ti>
<ti>Canvas</ti>
<ti>Geolocation</ti>
<ti>Drag & Drop</ti>
<ti>Web Workers</ti>
</ti>
</ti>
<ti>Demos</ti>
<ti>Learning</ti>
<ti>Community
<ti>Events</ti>
<ti>Discussions</ti>
<ti>Promote</ti>
</ti>
</tree>--------------------------------------------------------
| DevMo | Topics | Docs | Demos | Learning | Community |
--------| ^^^^^^ |-------------------------------------
| Web |
| Mobile |
| Add-ons |
| Mozilla |
-----------
--------------------------------------------------------
| DevMo | Topics | Docs | Demos | Learning | Community |
-----------------| ^^^^ |-------------------------------------------------
| *HTML* | *HTML5 | *CSS* | *JavaScript* |
| DOM | WebSockets | Gradients | AJAX |
| Video | Offline Cache | Transforms | Canvas |
| Audio | Local Storage | Transitions | Geolocation |
| SVG | IndexedDB | Animations | Drag & Drop |
| WebGL | File API | Media Queries | Web Workers |
---------------------------------------------------------
-----------------------------------------------------------
| DevMo | Topics | Docs | Demos | Learning | Community |
--------------------------------------------| ^^^^^^^^^ |
| Events |
| Discussions |
| Promote |
---------------
- Use
<row> or <group> elements?
- Use
<item> or <ti> element?
