Loading...

An introduction to Clamato for Smalltalkers

  1. Floating at the top right is the traditional counter example. Try out the buttons.
  2. Click this button to bring up the Cæsar browser: . You should be looking at the Counter class. Select its renderOn: method.
  3. Note the - before the message pattern. This marks the current method as an instance method. Class methods have a + (Objective-C developers will recognize this convention).
  4. Note that the counter instance variable has a @ prefix. This one’s taken from Ruby.
  5. Let’s extract the incrementing of @counter into a separate method. Replace @counter := @counter + 1 with self increment and hit Save.
  6. Select all in the code pane and add the increment method: 
    - increment
	@counter := @counter + 1.
    Until you add the final period (which is required), there will be a PARSE ERROR message below the code pane. Once you’ve got it right, hit Save. increment should appear in the list of methods on the left.
  7. Make sure that hitting + still works, then experiment with changing it to @counter + 10, etc.
  8. Let’s explore the code a little bit. Go back to the renderOn: method. The Methods menu shows all of the selectors that are sent by this method. Let’s choose onClick:.
  9. Note that the search at the top of the browser has changed to onClick:. This is equivalent to an implementors browser for that selector.
  10. You can see in the methods list above that there is only one implementor of onClick:, which is the JQuery class. Click on JQuery in the class column to see the complete JQuery protocol.
  11. Hit the ← button to go back to our onClick: search. The ← and → buttons work like in a web browser.
  12. You can also click on the JQuery and onClick: that are just above the code pane. Clicking on onClick: will change the search to #onClick:, which is equivalent to a senders browser. You can see that it’s mostly sent from within the Browser class which implements Cæsar.
  13. Add Counter to the search field so that it reads #onClick: Counter. This filters the methods to only be those within the Counter class (in this case, just renderOn:).
  14. Keep playing!