From 7fe358bfb11f1cba4ee9237c4ef4b7efc3cfba87 Mon Sep 17 00:00:00 2001
From: hukl <contact@smyck.org>
Date: Thu, 16 Apr 2009 12:14:45 +0200
Subject: added autosave to node edit view. saves every 15 seconds

---
 app/controllers/nodes_controller.rb   |   7 +++++--
 app/views/layouts/admin.html.erb      |   2 +-
 app/views/nodes/_autosave.html.erb    |   6 ++++++
 app/views/nodes/edit.html.erb         |   2 ++
 app/views/nodes/update.js.erb         |   3 +++
 public/images/ajax-loader.gif         | Bin 0 -> 1737 bytes
 public/javascripts/admin_interface.js |  14 +++++++++++++-
 public/stylesheets/admin.css          |  28 ++++++++++++++++++++++++++--
 8 files changed, 56 insertions(+), 6 deletions(-)
 create mode 100644 app/views/nodes/_autosave.html.erb
 create mode 100644 app/views/nodes/update.js.erb
 create mode 100644 public/images/ajax-loader.gif

diff --git a/app/controllers/nodes_controller.rb b/app/controllers/nodes_controller.rb
index 1796090..aba132b 100644
--- a/app/controllers/nodes_controller.rb
+++ b/app/controllers/nodes_controller.rb
@@ -58,8 +58,11 @@ class NodesController < ApplicationController
     @draft = @node.find_or_create_draft current_user
     @draft.tag_list = params[:tag_list]
     if @draft.update_attributes( params[:page] )
-      flash[:notice] = "Draft has been updated"
-      redirect_to edit_node_path(@node)
+      flash[:notice] = "Draft has been saved: #{Time.now}"
+      respond_to do |format|
+        format.html { redirect_to edit_node_path(@node) }
+        format.js
+      end
     else
       render :action => :edit
     end
diff --git a/app/views/layouts/admin.html.erb b/app/views/layouts/admin.html.erb
index 469b18e..1fb9c2b 100644
--- a/app/views/layouts/admin.html.erb
+++ b/app/views/layouts/admin.html.erb
@@ -7,8 +7,8 @@
   
     <title><%= "#{params[:controller]} | #{params[:action]}" %></title>
     <%= stylesheet_link_tag 'admin' %>
-    <%= javascript_include_tag 'tiny_mce/tiny_mce.js' %>
     <%= javascript_include_tag 'jquery-1.3.2.min' %>
+    <%= javascript_include_tag 'tiny_mce/tiny_mce.js' %>
     <%= javascript_include_tag 'admin_interface.js' %>
     
     <script type="text/javascript">
diff --git a/app/views/nodes/_autosave.html.erb b/app/views/nodes/_autosave.html.erb
new file mode 100644
index 0000000..583b374
--- /dev/null
+++ b/app/views/nodes/_autosave.html.erb
@@ -0,0 +1,6 @@
+
+<script type="text/javascript" charset="utf-8">
+  $(document).ready(function() {
+    setInterval('$("#edit_node_<%= @node.id %>").submitWithAjax()', 15000);
+  });
+</script>
\ No newline at end of file
diff --git a/app/views/nodes/edit.html.erb b/app/views/nodes/edit.html.erb
index d8fb8b4..0d0b0d3 100644
--- a/app/views/nodes/edit.html.erb
+++ b/app/views/nodes/edit.html.erb
@@ -5,6 +5,8 @@
   <%= link_to 'Revisions', revision_path(params[:id]) %>  
 <% end %>
 
+<%= render :partial => 'autosave' %>
+
 <div id="page_editor">
 <% form_for(@node) do |f| %>
   <%= f.error_messages %>
diff --git a/app/views/nodes/update.js.erb b/app/views/nodes/update.js.erb
new file mode 100644
index 0000000..be26fab
--- /dev/null
+++ b/app/views/nodes/update.js.erb
@@ -0,0 +1,3 @@
+$("#flash").html(
+  "<span><%= escape_javascript(flash.delete(:notice)) %></span>"
+);
\ No newline at end of file
diff --git a/public/images/ajax-loader.gif b/public/images/ajax-loader.gif
new file mode 100644
index 0000000..148005d
Binary files /dev/null and b/public/images/ajax-loader.gif differ
diff --git a/public/javascripts/admin_interface.js b/public/javascripts/admin_interface.js
index 5b51dfc..12a3ba6 100644
--- a/public/javascripts/admin_interface.js
+++ b/public/javascripts/admin_interface.js
@@ -1,5 +1,5 @@
 $(document).ready(function () {
-  $("#metadata").attr("style", "display: none;")
+  $("#metadata").attr("style", "display: none;");
   
   $("#button").click(function () {
     $("#metadata").slideToggle("slow");
@@ -11,4 +11,16 @@ $(document).ready(function () {
       $("#button").attr("class", "unselected");
     }
   });
+  
+  jQuery.ajaxSetup({ 
+    'beforeSend': function(xhr) {xhr.setRequestHeader("Accept", "text/javascript")}
+  })
+  
+  jQuery.fn.submitWithAjax = function() {
+    $("#flash").append("<img src='/images/ajax-loader.gif' alt='' />");
+    $.post(this.attr("action"), $(this).serialize(), null, "script");
+  };
+  
+  
+  
 });
\ No newline at end of file
diff --git a/public/stylesheets/admin.css b/public/stylesheets/admin.css
index c3030d6..0495f65 100644
--- a/public/stylesheets/admin.css
+++ b/public/stylesheets/admin.css
@@ -23,6 +23,25 @@ th {
   width: 899px;
 }
 
+#flash {
+  height: 12px;
+  line-height: 20px;
+  margin-top: 40px;
+  margin-bottom: 20px;
+  margin-left: 5px;
+}
+
+#flash span {
+  letter-spacing: 1px;
+  margin-right: 10px;
+}
+
+
+#flash img {
+  height: 12px;
+  width: 12px;
+}
+
 /* Pagination */
 
 div.pagination {
@@ -41,7 +60,7 @@ div.pagination span.current, div.pagination a:hover {
 }
 
 #navigation {
-  margin-left: -5px;
+  margin-left: 0px;
   float: left;
 }
 
@@ -104,6 +123,11 @@ table#node_table td {
   padding-left: 0px;
 }
 
+table#node_table .node_id {
+  padding-left: 10px;
+  padding-right: 15px;
+}
+
 table#node_table tr.header:hover {
   background-color: #ffffff;
 }
@@ -218,6 +242,6 @@ td.description {
 }
 
 div#page_editor {
-  margin-top: 40px;
+  margin-top: 0px;
   margin-left: 15px;
 }
\ No newline at end of file
-- 
cgit v1.3