--- a/client/js/paper-renderer.js	Tue Nov 13 11:46:39 2012 +0100
+++ b/client/js/paper-renderer.js	Fri Dec 21 16:22:08 2012 +0100
@@ -939,9 +939,7 @@
     this.renkan = _renkan;
     this.$ = Rkns.$(".Rk-Render");
     this.representations = [];
-    this.$.html(this.template({
-        l10n: _renkan.l10n
-    }))
+    this.$.html(this.template(_renkan));
     this.canvas_$ = this.$.find(".Rk-Canvas");
     this.editor_$ = this.$.find(".Rk-Editor");
     this.notif_$ = this.$.find(".Rk-Notifications");
@@ -1058,9 +1056,17 @@
     
     this.addRepresentations("Node", this.renkan.project.get("nodes"));
     this.addRepresentations("Edge", this.renkan.project.get("edges"));
+    this.renkan.project.on("change:title", function() {
+        _this.$.find(".Rk-PadTitle").val(_renkan.project.get("title"));
+    });
+    
+    this.$.find(".Rk-PadTitle").on("keyup input paste", function() {
+        _renkan.project.set({"title": $(this).val()});
+    })
+    
     this.renkan.project.get("users").each(function(_user) {
         _this.addUser(_user);
-    })
+    });
     
     this.renkan.project.on("add:users", function(_user) {
         _this.addUser(_user);
@@ -1078,11 +1084,12 @@
 }
 
 Rkns.Renderer.Scene.prototype.template = Rkns._.template(
-    '<div class="Rk-TopBar"><h3 class="Rk-PadTitle"><%=l10n.untitled_project%></h3>'
+    '<div class="Rk-TopBar"><input type="text" class="Rk-PadTitle" value="<%- project.get("title") || "" %>" placeholder="<%=l10n.untitled_project%>" />'
     + '<div class="Rk-Users"><div class="Rk-CurrentUser"><span class="Rk-CurrentUser-Color"></span><span class="Rk-CurrentUser-Name">&lt;unknown user&gt;</span></div><ul class="Rk-UserList"></ul></div>'
     + '<div class="Rk-TopBar-Separator"></div><div class="Rk-TopBar-Button Rk-FullScreen-Button"><div class="Rk-TopBar-Tooltip"><div class="Rk-TopBar-Tooltip-Tip"></div><div class="Rk-TopBar-Tooltip-Contents"><%=l10n.full_screen%></div></div></div>'
     + '<div class="Rk-TopBar-Separator"></div><div class="Rk-TopBar-Button Rk-AddNode-Button"><div class="Rk-TopBar-Tooltip"><div class="Rk-TopBar-Tooltip-Tip"></div><div class="Rk-TopBar-Tooltip-Contents"><%=l10n.add_node%></div></div></div>'
     + '<div class="Rk-TopBar-Separator"></div><div class="Rk-TopBar-Button Rk-AddEdge-Button"><div class="Rk-TopBar-Tooltip"><div class="Rk-TopBar-Tooltip-Tip"></div><div class="Rk-TopBar-Tooltip-Contents"><%=l10n.add_edge%></div></div></div>'
+    + '<div class="Rk-TopBar-Separator"></div><div class="Rk-TopBar-Button Rk-Save-Button"><div class="Rk-TopBar-Tooltip"><div class="Rk-TopBar-Tooltip-Tip"></div><div class="Rk-TopBar-Tooltip-Contents"><%=l10n.save_project%></div></div></div>'
     + '<div class="Rk-TopBar-Separator"></div></div>'
     + '<canvas class="Rk-Canvas" resize></canvas><div class="Rk-Editor"><div class="Rk-Notifications"></div>'
     + '<div class="Rk-ZoomButtons"><div class="Rk-ZoomIn" title="<%=l10n.zoom_in%>"></div><div class="Rk-ZoomOut" title="<%=l10n.zoom_out%>"></div></div>'
@@ -1132,7 +1139,7 @@
         this.setScale(_scale);
     }
     if (nodes.length === 1) {
-        this.offset = paper.view.center.subtract(new paper.Point([nodes[0].get("position").x, nodes[0].get("position").y]));
+        this.offset = paper.view.center.subtract(new paper.Point([nodes.at(0).get("position").x, nodes.at(0).get("position").y]));
         this.setScale(1);
     }
 }