This Git repository includes all of the source code used in creating a tutorial about panels in Sencha Touch.

Each of the links below represents a snapshot of the code at a point in the video (timestamps are in brackets). You'll find instructions below on how to check out each snapshot from this git repository.

• Blank slate (0:55)

##01 Docked Items

• Items and DockedItems (1:12)
• Docked item: default (1:29)
• Docked item: top (1:47)
• 2 Docked items: bottom/right (2:12)
• 2 Docked items: right/bottom (2:28)
• 2 Docked items: bottom/bottom (2:38)

##02 Nesting docked items (golden spiral)

• Panel with dimensions (3:05)
• Nested: right (3:15)
• Nested: right/top (3:37)
• 6*Nested (3:50)
• 6*Nested + bevel (4:16)

##03 Generated golden spiral

• Generated spiral (4:55)

##04 Docked toolbar

• Toolbar (5:25)

Dynamically updated dockedItems list

Link to API documentation for methods:

• addDocked()
• insertDocked()
• removeDocked()

Using this repository to follow the screencast

First, you'll have to clone this repository:

git clone git://github.com/nelstrom/Sencha-Touch-panels-demo.git

Change into the directory:

cd Sencha-Touch-panels-demo

By default, the git clone command will only create the master branch locally. If you want to study the code at each checkpoint, you will have to fetch each of the other branches. You can do so by running the following:

git checkout -b 00_blank_slate origin/00_blank_slate
git checkout -b 01a_docked_items origin/01a_docked_items
git checkout -b 01b_docked_items origin/01b_docked_items
git checkout -b 01c_docked_items origin/01c_docked_items
git checkout -b 01d_docked_items origin/01d_docked_items
git checkout -b 01e_docked_items origin/01e_docked_items
git checkout -b 01f_docked_items origin/01f_docked_items
git checkout -b 02a_nesting_docked_items origin/02a_nesting_docked_items
git checkout -b 02b_nesting_docked_items origin/02b_nesting_docked_items
git checkout -b 02c_nesting_docked_items origin/02c_nesting_docked_items
git checkout -b 02d_nesting_docked_items origin/02d_nesting_docked_items
git checkout -b 02e_nesting_docked_items origin/02e_nesting_docked_items
git checkout -b 03_generated_golden_spiral origin/03_generated_golden_spiral
git checkout -b 04_docked_toolbar origin/04_docked_toolbar

You can review the list of local branches by running:

git branches

And you can switch between branches with the checkout command. For example, to check out the 03_generated_golden_spiral branch, run:

git co 03_generated_golden_spiral