= The Image Concept =
== The image as a persistant world ==
'''Video'''
[[Toggle(begin)]]
[[Video(src=attachment:Image-Introduction.m4v,poster=attachment:Image-Introduction-1.png)]]
[[Toggle(end)]]

'''Preview'''

[[Image(Image-Introduction-2.png, 300)]][[Image(Image-Introduction-3.png, 300)]]

'''Description'''

The image is your working environment. All your modifications are stored with its state. This video shows how you open your image how you can go back to the state before opening.

== Basic Elements of the Image ==
'''Video'''
[[Toggle(begin)]]
[[Video(src=attachment:Image-Navigating.m4v,poster=attachment:Image-Navigating-1.png)]]
[[Toggle(end)]]

'''Preview'''

[[Image(Image-Navigating-2.png, 300)]]

'''Description'''

In this video we take a tour around the basic UI elements and menus of the image.

== Halos to access morphs ==
'''Video'''
[[Toggle(begin)]]
[[Video(src=attachment:Image-Halos.m4v,poster=attachment:Image-Halos-1.png)]]
[[Toggle(end)]]

'''Preview'''

[[Image(Image-Halos-2.png, 300)]]

'''Description'''

Halos provide an instant access to graphical elements of the image. This video shows functions they provide.

== How to update your Image ==
'''Video'''
[[Toggle(begin)]]
[[Video(src=attachment:Image-Updating.m4v,poster=attachment:Image-Updating-1.png)]]
[[Toggle(end)]]

'''Preview'''



'''Description'''

---

== How to modify settings and change your browser ==
'''Video'''
[[Toggle(begin)]]
[[Video(src=attachment:Image-BrowserAndSetting.m4v,poster=attachment:Image-BrowserAndSetting-1.png)]]
[[Toggle(end)]]

'''Preview'''

[[Image(Image-BrowserAndSetting-2.png, 300)]][[Image(Image-BrowserAndSetting-3.png, 300)]]

'''Description'''

The image has a menu for editing all your preferences. Additionally you can change your standard browser by using a browser menu.

== Organise your work with projects ==
'''Video'''
[[Toggle(begin)]]
[[Video(src=attachment:Image-Projects.m4v,poster=attachment:Image-Projects-1.png)]]
[[Toggle(end)]]

'''Preview'''

[[Image(Image-Projects-2.png, 300)]]

'''Description'''

Projects are a nice way to organise different workplaces in one image. They can also be useful for prototyping.


= Things you can do with the browser =
== Basic usage of the class browser ==
'''Video'''
[[Toggle(begin)]]
[[Video(src=attachment:Browser-ClassBrowser.m4v,poster=attachment:Browser-ClassBrowser-1.png)]]
[[Toggle(end)]]

'''Preview'''

[[Image(Browser-ClassBrowser-2.png, 300)]]

'''Description'''

The class browser is the tool to access and edit source code in the image. It is your main working environment.

== How to access and edit methods ==
'''Video'''
[[Toggle(begin)]]
[[Video(src=attachment:Browser-MethodsInBrowser.m4v,poster=attachment:Browser-MethodsInBrowser-1.png)]]
[[Toggle(end)]]

'''Preview'''

[[Image(Browser-MethodsInBrowser-2.png, 300)]]

'''Description'''

---

== Advanced Browsing Techniques ==
'''Video'''
[[Toggle(begin)]]
[[Video(src=attachment:Browser-AdvancedBrowsing.m4v,poster=attachment:Browser-AdvancedBrowsing-1.png)]]
[[Toggle(end)]]

'''Preview'''

[[Image(Browser-AdvancedBrowsing-2.png, 300)]]

'''Description'''

In this screencast we show how you can browse the hierachy, inheritance, senders and implementors of methods.

== Modifying class variables and auto generate accessor methods ==
'''Video'''
[[Toggle(begin)]]
[[Video(src=attachment:Browser-ClassStateSetterGetters.m4v,poster=attachment:Browser-ClassStateSetterGetters-1.png)]]
[[Toggle(end)]]

'''Preview'''

[[Image(Browser-ClassStateSetterGetters-2.png, 300)]]

'''Description'''

You can also modify the class definitions. Furthermore the browser provides a nice function for generating accessor methods for all your instance variables.


= Exploring - Everything is observable =
== Workspace and Transcript ==
'''Video'''
[[Toggle(begin)]]
[[Video(src=attachment:Exploring-TranscriptWorkspace.m4v,poster=attachment:Exploring-TranscriptWorkspace-1.png)]]
[[Toggle(end)]]

'''Preview'''

[[Image(Exploring-TranscriptWorkspace-2.png, 300)]]

'''Description'''


== Object Explorer and Inspector ==
'''Video'''
[[Toggle(begin)]]
[[Video(src=attachment:Exploring-ObjectExplorerInspector.m4v,poster=attachment:Exploring-ObjectExplorerInspector-1.png)]]
[[Toggle(end)]]

'''Preview'''

[[Image(Exploring-ObjectExplorerInspector-2.png, 300)]]

'''Description'''


= Debugging and dealing with image failures =
== How to debug with the Squeak debugger ==
'''Video'''
[[Toggle(begin)]]
[[Video(src=attachment:Debug-Debugger.m4v,poster=attachment:Debug-Debugger-1.png)]]
[[Toggle(end)]]

'''Preview'''

[[Image(Debug-Debugger-2.png, 300)]]

'''Description'''

This video shows how to set breakpoints and demonstrates most of the debugger features.

== Help! i have executed an infinite loop... How to stop the image. ==
'''Video'''
[[Toggle(begin)]]
[[Video(src=attachment:Debug-StopProcessing.m4v,poster=attachment:Debug-StopProcessing-1.png)]]
[[Toggle(end)]]

'''Preview'''



'''Description'''


= Versioning your work with Monticello =
== Configuring Repositories and Packages ==
'''Video'''
[[Toggle(begin)]]
[[Video(src=attachment:Monticello-Introduction.m4v,poster=attachment:Monticello-Introduction-1.png)]]
[[Toggle(end)]]

'''Preview'''

[[Image(Monticello-Introduction-2.png, 300)]][[Image(Monticello-Introduction-3.png, 300)]]

'''Description'''


== View Diffs and Changes ==
'''Video'''
[[Toggle(begin)]]
[[Video(src=attachment:Monticello-DiffingAndChanges.m4v,poster=attachment:Monticello-DiffingAndChanges-1.png)]]
[[Toggle(end)]]

'''Preview'''

[[Image(Monticello-DiffingAndChanges-2.png, 300)]]

'''Description'''


== How to resolve conflicts ==
'''Video'''
[[Toggle(begin)]]
[[Video(src=attachment:Monticello-ResolvingConflicts.m4v,poster=attachment:Monticello-ResolvingConflicts-1.png)]]
[[Toggle(end)]]

'''Preview'''

[[Image(Monticello-ResolvingConflicts-2.png, 300)]]

'''Description'''