Trying to gather thoughts and code coherently.

Added client-side architecture model.
Playing with UI code.

www/js/ts.js

@@ -35,7 +35,11 @@ $(document).ready(function(){
      *  - join_date
      */
     TS.UserModel = Backbone.Model.extend({
+        url: function() { return '/ts_api/users/' + this.get('id'); },
 
+        initialize: function(attrs, options) {
+            _.bind(this, 'url');
+        }
     });
 
     TS.EntryList = Backbone.Collection.extend({
@@ -84,7 +88,7 @@ $(document).ready(function(){
         events: {
             "dblclick div.mark"         : "editMark",
             "dblclick div.timestamp"    : "editTimestamp",
-            "keypress .mark-input"      : "updateOnEnter"
+            "keypress .mark-input"      : "updateOnEnter",
             "keypress .timestamp-input" : "updateOnEnter"
         },
 
@@ -181,7 +185,7 @@ $(document).ready(function(){
             $(this.el).addClass('edit-desc');
             this.$('.timeline-desc-input').focus();
             return this;
-        };
+        },
 
         close: function() {
             this.model.save({
@@ -195,40 +199,9 @@ $(document).ready(function(){
         }
     });
 
-    TS.TimelineListView = Backbone.View.extend({
-
-        el: $("#timeline .drop-menu-items"),
-
-        events: {
-            'click #timeline .drop-menu-items a':   'selectTimeline'
-        },
-
-        initialize: function() {
-            _.bindAll(this, 'addOne', 'render');
-            this.collection.bind('add', this.addOne);
-            this.collection.bind('refresh', this.refresh);
-            this.collection.view = this;
-        },
-
-        addOne: function(timeline) {
-            $(this.el).append(ich.timelineLink(timeline.toJSON()));
-        },
-
-        render: function() {
-            $(this.el).empty();
-            this.collection.each(this.addOne);
-            return this;
-        },
-
-        selectTimeline: function() {
-            // note that this refers to the element that initiated this event
-            // TODO
-        }
-    });
-
     TS.UserView = Backbone.View.extend({
         
-        el: $("user"),
+        el: $("#user"),
 
         model: TS.UserModel,
 
@@ -245,7 +218,7 @@ $(document).ready(function(){
 
         render: function() {
             this.$('.fullname').text(this.model.get('name'));
-            this.$('.username').text(this.model.get('id'));
+            this.$('.username').text(" - " + this.model.get('id'));
             return this;
         },
 
@@ -266,6 +239,37 @@ $(document).ready(function(){
         }
     });
 
+    TS.AppView = Backbone.View.extend({
+
+        el: $("body"),
+
+        events: {
+            'click #timeline .drop-menu-items a': 'selectTimeline',
+            'keypress #new-entry-input'         : 'newTimestamp',
+        },
+
+        initialize: function() {
+            _.bindAll(this, 'render');
+        },
+
+        renderTimelineList: function() {
+            var tlUL = this.$('#timeline ul.drop-menu-items');
+            //var curTimeline = 
+            //var remTimelines = TS.user.timelines.filter(function(timeline)
+        }
+    });
+
+    // wire the login dialog using jQuery UI
+    $("#login-dialog").dialog({
+        autoOpen: false,
+        height: 400,
+        width: 400,
+        modal: true,
+        buttons: { Login: function(){login()} }
+    });
+
+    $('#login-dialog').dialog('open');
+
 })
 
 function login() {
@@ -296,35 +300,15 @@ function login() {
 
             // create the user model
             TS.user = new TS.UserModel({
-                id: name.val();,
+                id: name.val(),
                 name: '' });
 
-            // create the user view
-            new TS.UserView({model: TS.user});
-
             // fetch the initial user data from the server
             TS.user.fetch();
 
-            // create the user's timelines
-            TS.timelineList = new TS.TimelineList([], {user: TS.user});
+            // create the user view
+            new TS.UserView({model: TS.user});
+            TS.user.view.render();
 
-            // create the timeline list view
-            new TS.TimelineListView({collection: TS.timelineList});
-            TS.timelineList.fetch();
-
-            // load the current timeline
-            TS.currentTimeline = TS.timelineList.at(0);
-
-            // create the timeline view
-            new TS.TimelineView({model: TS.currentTimeline});
-
-            // render the timeline view
-            TS.currentTimeline.view.render();
-
-            // load the entries for this timeline
-            TS.entryList = new TS.EntryList([], {timeline: TS.currentTimeline});
-
-            // create the new entry list view
-            new TS.EntryListView
         }});
 }