web/query/templates/edit.html

   1 <!DOCTYPE html>
   2 <html>
   3   <head>
   4     <title>{{ blog.title }}</title>
   5     <link rel="stylesheet" href="{{ assets }}/style/screen.css" type="text/css">
   6   </head>
   7   <body>
   8     {{>header}}
   9     <div id="tagcloud"></div>
  10     <div id="content">
  11     <!-- form to create a post -->
  12     <form id="new-post" action="new.html" method="post">
  13       <h1>{{pageTitle}}</h1>
  14         <p><label>Title</label>
  15           <input type="text" size="50" name="title" value="{{title}}"></p>
  16       <p><label for="body">Body</label>
  17       <textarea name="body" rows="28" cols="80">{{body}}</textarea></p>
  18       <p>
  19         <label for="tags">Click tags to add them. (split by ',')</label>
  20         <input size="50" type="text" name="tags" value="{{tags}}">
  21       </p>
  22       <p>
  23         <input id="preview" type="button" value="Preview"/>
  24         <input type="submit" value="Save &rarr;"/>
  25         <span id="saved" style="display:none;">Saved</span>
  26         </p>
  27     </form>
  28     <a target="_new" href="http://warpedvisions.org/projects/markdown-cheat-sheet/">Markdown help</a>
  29       <div id="show-preview"></div>
  30     </div>
  31   </body>
  32   {{>scripts}}
  33   <script src="../../script/jquery.scrollTo.js"></script>
  34   <script type="text/javascript" charset="utf-8">
  35     $.couch.app(function(app) {
  36       var path = app.require("vendor/couchapp/lib/path").init(app.req);
  37       var postForm, blog = app.require("lib/blog");
  38
  39       // extend the tagcloud so that clicks add tags to the current post
  40       var tagcloud = $.extend(true, {}, this.ddoc.evently.tagcloud, {
  41         _init : {
  42           selectors : {
  43             a : {
  44               click : function() {
  45                 var tag = $(this).text();
  46                 var tags = $("input[name=tags]").val();
  47                 if (tags) tags = tags+", ";
  48                 $("input[name=tags]").val(tags + tag);
  49                 return false;
  50               }
  51             }
  52           }
  53         }
  54       });
  55       $("#tagcloud").evently(tagcloud, this);
  56       var postDoc = {{{doc}}};
  57
  58       $('label[for=body]').append(' <em>with '+(postDoc.format||'html')+'</em>');
  59       $("form#new-post").submit(function() {
  60         postDoc.author = $$("#account").userCtx.name;
  61         postDoc.body = $("textarea[name=body]").val();
  62         postDoc.title = $("input[name=title]").val();
  63         var dtags = [], tags = $("input[name=tags]").val().split(",");
  64         for(var i in tags) {
  65           dtags.push($.trim(tags[i]));
  66         }
  67         postDoc.tags = dtags;
  68         if (!postDoc.created_at) {
  69           postDoc.created_at = new Date();
  70         }
  71         if (!postDoc._id) {
  72           postDoc._id = blog.slugifyString(postDoc.title);
  73         }
  74         app.db.saveDoc(postDoc, {
  75           success : function(resp) {
  76             $("#saved").text("Saved _rev: "+resp.rev).fadeIn(500).fadeOut(6000);
  77             $('h1').html('Editing <a href="'+path.show('post',resp.id)+'">'+resp.id+'</a> by '+postDoc.author);
  78           }
  79         });
  80         return false;
  81       });
  82
  83       if (postDoc._id) {
  84         $('#preview').before('<input type="button" id="delete" value="Delete Post"/> ');
  85         $("#delete").click(function() {
  86           app.db.deleteDoc(postDoc, {
  87             success : function(resp) {
  88               $("h1").text("Deleted "+resp.id);
  89               $('form#new-post input').attr('disabled', true);
  90             }
  91           });
  92           return false;
  93         });
  94       }
  95
  96       $("#preview").click(function() {
  97         var markdown = app.require("vendor/couchapp/lib/markdown");
  98         var html = markdown.encode($("textarea[name=body]").val());
  99         $('#show-preview').html(html);
 100         $('body').scrollTo('#show-preview', {duration: 500});
 101       });
 102     });
 103   </script>
 104 </html>