diff wiki.js @ 5:06e8c49e9dec

Wikicreole markup is now editable. Also refactored things a bit so that variables have better names, DRY is preserved better.
author Atul Varma <varmaa@toolness.com>
date Sun, 01 Feb 2009 13:33:26 -0800
parents 01313b55ed09
children fb233578283c
line wrap: on
line diff
--- a/wiki.js	Sun Feb 01 13:15:55 2009 -0800
+++ b/wiki.js	Sun Feb 01 13:33:26 2009 -0800
@@ -2,34 +2,42 @@
   eventHandlers: {}
 };
 
-App.eventHandlers.makeEditable = function makeEditable(aEvt) {
+App.eventHandlers.editPart = function editPart(aEvt) {
   if (!aEvt.shiftKey)
     return;
 
   aEvt.preventDefault();
 
-  var item = this;
-  var newItem = $('<textarea class="wikiedit"></textarea>');
-  $(newItem).attr("value", $(item).html());
+  var part = this;
+  var editablePart = $('<textarea class="wiki-edit"></textarea>');
+  $(editablePart).attr("value", $(".creole-markup", part).text());
 
   function setScrollHeight() {
-    var scrollHeight = $(newItem).get(0).scrollHeight;
-    $(newItem).height(scrollHeight);
+    var scrollHeight = $(editablePart).get(0).scrollHeight;
+    $(editablePart).height(scrollHeight);
   }
 
-  $(newItem).blur(
+  $(editablePart).blur(
     function() {
-      var html = $(newItem).attr("value");
-      $(item).html(html);
-      $(item).mousedown(App.eventHandlers.makeEditable);
-      $(newItem).replaceWith(item);
+      var markup = $(editablePart).attr("value");
+      $(editablePart).replaceWith(App.createPart(markup));
     });
 
-  $(newItem).keyup(setScrollHeight);
-  $(item).replaceWith(newItem);
+  $(editablePart).keyup(setScrollHeight);
+  $(part).replaceWith(editablePart);
   setScrollHeight();
 
-  $(newItem).focus();
+  $(editablePart).focus();
+};
+
+App.createPart = function createPart(markup) {
+  var partDiv = $('<div class="part"></div>');
+  var markupDiv = $('<div class="creole-markup"></div>');
+  markupDiv.text(markup);
+  App.creole.parse(partDiv.get(0), markup);
+  partDiv.mousedown(App.eventHandlers.editPart);
+  partDiv.append(markupDiv);
+  return partDiv;
 };
 
 App.processMarkup = function processMarkup(text) {
@@ -37,11 +45,8 @@
   jQuery.each(
     parts,
     function(i) {
-      var part = this;
-      var partDiv = $('<div class="wiki"></div>');
-      App.creole.parse(partDiv.get(0), part);
-      partDiv.mousedown(App.eventHandlers.makeEditable);
-      $("#content").append(partDiv);
+      var partMarkup = this.toString();
+      $("#content").append(App.createPart(partMarkup));
     }
   );
 };