Next → Fourth Step, C, like Controller Second Step, M, like Model ← Prev

Third Step, V, like View

Now let's get our hands dirty and just edit the templates for our to-do list.

Start with editing view/index.xhtml, it is using the default templating of Ramaze, called Ezamar.

The index.xhtml currently contains a default welcome page, remove the contents.

Let's put some things in there, I'll explain the syntax as we go, it's quite simple.

<html>
  <head>
    <title>TodoList</title>
  </head>
  <body>
    <h1>TodoList</h1>
    <ul>
      <?r
        TodoList.each do |title, value|
          status = value[:done] ? 'done' : 'not done'
        ?>
        <li>#{title}: #{status}</li>
      <?r end ?>
    </ul>
  </body>
</html>

I will assume that you are familiar with basic Ruby already, so we will concentrate on the things new here.

<?r ?> defines an area of ruby-code. Later, when the template is transformed into pure Ruby it will be evaluated. We iterate over the TodoList model and pass the title and value into a block. In that block we can just get the values of title and status (which we define based on the value) displayed on the page.

The whole Template would expand to something like this (only showing the interesting part)

<ul>
  <li>Laundry: not done</li>
  <li>Wash dishes: not done</li>
</ul>

That wasn't too bad, huh?

Now, so we can get our instant pleasure of seeing the result of our (hard) work, let's see how to start ramaze.

In the todolist directory run ramaze.

This will start an instance of Ramaze and run your application on it. You can now access it by browsing to http://localhost:7000/

7000 is the default-port Ramaze will run on, to change it you can just run ramaze -p 7070 or similar. Also be sure to look at the output of ramaze –help to see some other options.

Next → Fourth Step, C, like Controller Second Step, M, like Model ← Prev

 
Back to top
tutorials/todolist-3.txt · Last modified: 2008/01/31 00:02 by reacher