]> sipb.mit.edu Git - ikiwiki.git/blobdiff - doc/todo/mdwn_preview.mdwn
License grant for my code. And note that I'll look at a more advanced version when...
[ikiwiki.git] / doc / todo / mdwn_preview.mdwn
index 733d62c08ae4d6e378a35408425e9e283f82ea3f..6ab8d604bf744b2327b35cd4aeedc8c2ec4b8261 100644 (file)
@@ -4,4 +4,137 @@ is editing. It would be nice if ikiwiki could support this, too. The thing they
 use on StackOverflow is supposed to be free software, so it should be easy to
 add to ikiwiki.
 
+> See [[wikiwyg]]. Note that I do not have a copy of the code for that, or
+> it'd be in ikiwiki already. --[[Joey]] 
+
+>> I just had a brief look at the [[wikiwyg]] page and the link to the plugin was
+>> broken.  The StackOverflow site uses the [WMD](http://wmd-editor.com/) editor,
+>> which seems to be related to the [ShowDown](http://attacklab.net/showdown/)
+>> javascript port of Markdown.  Interestingly, [WMD source](http://wmd.googlecode.com/)
+>> is now available under an MIT license, though it is supposedly undergoing heavy
+>> refactoring.  It looks like there was previous discussion ( [[todo/Add_showdown_GUI_input__47__edit]] )
+>> about a showdown plugin.  Maybe a WMD plugin would be worthwhile.  I might
+>> look into it if I have time on the weekend. -- [[Will]]
+
 [[!tag wishlist]]
+
+>>> Below is a simple plugin/[[patch]] to make use of the WMD editor.  Turns out it isn't hard at all to
+>>> get a basic version going (which doesn't handle directives at all, nor does it swtich itself off when you're
+>>> editing something other than Markdown source).  I've
+>>> removed the done tag so this is visible as a patch. -- [[Will]]
+
+>>>> Hmm, it would be good if it turned off for !mdwn. Although this could
+>>>> be difficult for a new page, since there is a dropdown selector to
+>>>> choose the markup language then. But it should be doable for editing an
+>>>> existing page.
+
+>>>>> I agree.  I'm working on this for for both new pages and existing pages.
+>>>>> It shouldn't be hard once I get WMD going through the javascript API.
+>>>>> At the moment that is inexplicably failing, and I haven't had time to have a good look at why.
+>>>>> I may not get a chance to look at this again for a few weeks.
+
+>>>> Can I get a license statement (ie, GPL-2+) ffrom you for the plugin?
+>>>> --[[Joey]] 
+
+>>>>> Certainly.  You're free to use the code I posted below under the GPL-2+ license.  You'll note
+>>>>> however that I haven't said anything about the WMD code itself.  The WMD web page says:
+
+>>>>>> "I'm refactoring the code, and will be releasing WMD under the MIT license soon. For now you can download the most recent release (wmd-1.0.1.zip) and use it freely."
+
+>>>>> It might be best to contact <support@attacklab.net> to for an explicit license on that if you want to include it.
+>>>>> -- [[Will]]
+
+------
+
+### Instructions:
+
+
+Download the [WMD source](http://wmd-editor.com/downloads/wmd-1.0.1.zip).  In that zip file you'll
+find a few example html files, a readme and `wmd` directory.  Move the `wmd` directory into the
+ikiwiki `underlays` directory.  You should now have an `underlays/wmd/wmd.js` file as well as 
+some other javascript files and an images directory in the same place.
+
+> So, I wonder if I should add a copy of the WMD source to ikiwiki, or rely
+> on the user or distribution providing it. It does not seem to be packaged
+> for Debian yet. --[[Joey]] 
+
+>> This is a good question.  My thought is that it will probably not be packaged any time soon,
+>> so you're better off adding it to IkiWiki.  I'd contact the author of WMD and ask them.  They
+>> may have more insight.  -- [[Will]]
+
+Note that the WMD plugin does **not** handle directives.  For this reason the normal `preview` button
+remains.  Some CSS to clean up the display of the live WMD preview would be good.
+
+> Can you elucidate the CSS comment -- or will it be obvious what you mean
+> when I try it? Is it what's needed for the live preview? --[[Joey]]
+
+>> In the version of the plugin below, a new `div` is added just below the form.  WMD
+>> populates this div with the HTML it generates from the Markdown source.  This is not very
+>> pretty at the moment - it appears in the same place as the preview used to, but with no
+>> header or anything.  Any standard IkiWiki preview will appear below the WMD live preview.
+>> I recommend having a look at <http://wmd-editor.com/examples/splitscreen>
+>> for what a little CSS could achieve.  -- [[Will]]
+
+Install the following patch and plugin file.  Then enable the 'wmd' plugin.
+
+
+    diff --git a/templates/editpage.tmpl b/templates/editpage.tmpl
+    index 4b54db2..b1cf015 100644
+    --- a/templates/editpage.tmpl
+    +++ b/templates/editpage.tmpl
+    @@ -37,6 +37,7 @@ Optional comment about this change:<br />
+     </div>
+     </TMPL_IF>
+     <TMPL_VAR FORM-END>
+    +<TMPL_VAR WMD_PREVIEW>
+     
+     <TMPL_IF NAME="PAGE_PREVIEW">
+     <hr />
+
+-----
+
+    #!/usr/bin/perl
+    package IkiWiki::Plugin::wmd;
+    
+    use warnings;
+    use strict;
+    use IkiWiki 3.00;
+    use POSIX;
+    use Encode;
+    
+    sub import {
+       add_underlay("wmd");
+       hook(type => "getsetup", id => "wmd", call => \&getsetup);
+       hook(type => "formbuilder_setup", id => "wmd", call => \&formbuilder_setup);
+    }
+    
+    sub getsetup () {
+       return
+               plugin => {
+                       safe => 1,
+                       rebuild => 1,
+               },
+    }
+    
+    sub formbuilder_setup (@) {
+       my %params=@_;
+       my $form=$params{form};
+    
+       return if ! defined $form->field("do");
+       
+       return unless (($form->field("do") eq "edit") ||
+                               ($form->field("do") eq "create"));
+    
+       $form->tmpl_param("wmd_preview", "<div class=\"wmd-preview\"></div>\n".include_javascript(undef, 1));
+    }
+    
+    sub include_javascript ($;$) {
+       my $page=shift;
+       my $absolute=shift;
+       
+       return '<script src="'.urlto("wmd.js", $page, $absolute).
+               '" type="text/javascript"></script>'."\n";
+    }
+    
+    1
+