r9459 - in apps/gobi/trunk/code: Comment Page Page/skins

Author: hannes
Date: 2008-12-22 12:40:57 +0100 (Mon, 22 Dec 2008)
New Revision: 9459

Modified:
   apps/gobi/trunk/code/Comment/edit.skin
   apps/gobi/trunk/code/Page/PageActions.js
   apps/gobi/trunk/code/Page/skins/edit.skin
   apps/gobi/trunk/code/Page/skins/javascript.skin
Log:
Apply ajax previews to page edits.

Details at http://dev.helma.org/trac/helma/changeset/9459

Modified: apps/gobi/trunk/code/Comment/edit.skin
===================================================================
--- apps/gobi/trunk/code/Comment/edit.skin	2008-12-22 11:05:21 UTC (rev 9458)
+++ apps/gobi/trunk/code/Comment/edit.skin	2008-12-22 11:40:57 UTC (rev 9459)
@@ -1,4 +1,4 @@
-<form action="" method="post" name="edit" enctype="multipart/form-data">
+<form action="<% this.href action='edit' %>" method="post" name="edit" enctype="multipart/form-data">
 
 <% this.formEditor %>
 
@@ -6,8 +6,12 @@
 <% this.textArea name="body" rows="18" class="horizontalFill" id="commentInput" %></p>
 
 <p>
-  <input type="submit" value="<% msg name='comment_preview' %>" name="preview" />
+  <input type="submit" value="<% msg name='comment_preview' %>" name="preview"
+    onclick="return commentPreview(this.form);"/>
   <input type="submit" value="<% msg name='comment_save' %>" name="save" />
   <a href="<% page.href %>" class="commentLink"><% msg name='cancel' %></a>
 </p>
+<div id="commentPreview"></div>
 </form>
+
+

Modified: apps/gobi/trunk/code/Page/PageActions.js
===================================================================
--- apps/gobi/trunk/code/Page/PageActions.js	2008-12-22 11:05:21 UTC (rev 9458)
+++ apps/gobi/trunk/code/Page/PageActions.js	2008-12-22 11:40:57 UTC (rev 9459)
@@ -280,7 +280,12 @@
             res.data.body = p.renderSkinAsString("body#preview");
             res.data.body += p.renderSkinAsString("edit");
             this.renderSkin("page");
-            return
+            return;
+        } else if (req.data.ajax) {
+            var p = newInstance(this.name, this._prototype);
+            p.readEditForm(false);
+            p.renderSkin("body#preview");
+            return;
         }
     }
     res.data.body = this.renderSkinAsString("edit");

Modified: apps/gobi/trunk/code/Page/skins/edit.skin
===================================================================
--- apps/gobi/trunk/code/Page/skins/edit.skin	2008-12-22 11:05:21 UTC (rev 9458)
+++ apps/gobi/trunk/code/Page/skins/edit.skin	2008-12-22 11:40:57 UTC (rev 9459)
@@ -1,4 +1,4 @@
-<form action="" method="post" name="edit" enctype="multipart/form-data">
+<form action="<% this.href action="edit" %>" method="post" name="edit" enctype="multipart/form-data">
 
 <% this.input name="name" class="name horizontalFill"
               prefix="<p>Name<br />" suffix="</p>" %>
@@ -12,12 +12,12 @@
     <td class="horizontalFill"><input name="gobi_describe" style="width: 100%;"
                value="<% request.gobi_describe %>"/></td></tr></table>
 
-<p> <input type="submit" name="preview"
-          value="<% msg name='preview_button' %>">
-    <input type="submit" name="save"
-          value="<% msg name='edit_button' %>">
-    <a href="<% page.href %>" class="commentLink">
-          <% msg name='cancel' %></a>
+<p>
+  <input type="submit" name="preview" value="<% msg name='preview_button' %>"
+      onclick="return pagePreview(this.form);">
+  <input type="submit" name="save" value="<% msg name='edit_button' %>">
+  <a href="<% page.href %>" class="commentLink"> <% msg name='cancel' %></a>
 
 </p>
+<div id="pagePreview"></div>
 </form>

Modified: apps/gobi/trunk/code/Page/skins/javascript.skin
===================================================================
--- apps/gobi/trunk/code/Page/skins/javascript.skin	2008-12-22 11:05:21 UTC (rev 9458)
+++ apps/gobi/trunk/code/Page/skins/javascript.skin	2008-12-22 11:40:57 UTC (rev 9459)
@@ -164,17 +164,33 @@
   }
 
   function commentPreview(form) {
+      var input = $('#commentInput');
       $('#commentPreview').load(form.action, {
           ajax: true,
-          body: $('#commentInput').val()
+          body: input.val()
       });
       $('html,body').animate({
           scrollTop: $(form).offset().top
       });
-      $('#commentInput').focus();
+      input.focus();
       return false;
   }
-    
+
+  function pagePreview(form) {
+      var input = $(form).find('[name=body]');
+      $('#pagePreview').load(form.action, {
+          ajax: true,
+          name: $(form).find('[name=name]').val(),
+          body: input.val()
+      });
+      $('html,body').animate({
+          scrollTop: $('#pagePreview').offset().top
+      });
+      input.focus();
+      return false;
+  }
+
+
   function buildList(name, link) {
       var safeName = name.replace(/\s/g, "_");
       var value = getElement(name+"_links").value;