PLUGIN Markdown

Parse link description in Markdown (HTML) before rendering.

      * hard remove of Shaarli's HTML before parsing.
      * Using Parsedown <https://github.com/erusev/parsedown> PHP lib.
      * Includes basic markdown CSS.
      * Style: removed 400px height max limit for shaares.
      * Unit tests.

COPYING

@@ -72,6 +72,10 @@ Files: plugins/wallabag/wallabag.png
 License: MIT License (http://opensource.org/licenses/MIT)
 Copyright: (C) 2015 Nicolas Lœuillet - https://github.com/wallabag/wallabag
 
+Files: plugins/markdown/Parsedown.php
+License: MIT License (http://opensource.org/licenses/MIT)
+Copyright: (C) 2015 Emanuil Rusev - https://github.com/erusev/parsedown
+
 ----------------------------------------------------
 ZLIB/LIBPNG LICENSE
 

application/Utils.php

@@ -43,14 +43,6 @@ function endsWith($haystack, $needle, $case=true)
     return (strcasecmp(substr($haystack, strlen($haystack) - strlen($needle)), $needle) === 0);
 }
 
-/**
- * Same as nl2br(), but escapes < and >
- */
-function nl2br_escaped($html)
-{
-    return str_replace('>', '&gt;', str_replace('<', '&lt;', nl2br($html)));
-}
-
 /**
  * htmlspecialchars wrapper
  */

inc/shaarli.css

@@ -467,7 +467,6 @@ h1 {
     margin-top: 0;
     margin-bottom: 12px;
     font-weight: normal;
-    max-height: 400px;
     overflow: auto;
 }
 

plugins/markdown/README.md

@@ -0,0 +1,51 @@
+## Markdown Shaarli plugin
+
+Convert all your shaares description to HTML formatted Markdown.
+
+Read more about Markdown syntax here.
+
+### Installation
+
+Clone this repository inside your `tpl/plugins/` directory, or download the archive and unpack it there.
+The directory structure should look like:
+
+```
+??? plugins
+    ??? markdown
+        ??? help.html
+        ??? markdown.css
+        ??? markdown.meta
+        ??? markdown.php
+        ??? Parsedown.php
+        ??? README.md
+```
+
+To enable the plugin, add `markdown` to your list of enabled plugins in `data/config.php`
+(`ENABLED_PLUGINS` array).
+
+This should look like:
+
+```
+$GLOBALS['config']['ENABLED_PLUGINS'] = array('qrcode', 'any_other_plugin', 'markdown')
+```
+
+### Known issue
+
+#### Redirector
+
+If you're using a redirector, you *need* to add a space after a link,
+otherwise the rest of the line will be `urlencode`.
+
+```
+[link](http://domain.tld)-->test
+```
+
+Will consider `http://domain.tld)-->test` as URL.
+
+Instead, add an additional space.
+
+```
+[link](http://domain.tld) -->test
+```
+
+> Won't fix because a `)` is a valid part of an URL.

plugins/markdown/help.html

@@ -0,0 +1,5 @@
+<div class="md_help">
+    Description will be rendered with
+    <a href="http://daringfireball.net/projects/markdown/syntax" title="Markdown syntax documentation">
+        Markdown syntax</a>.
+</div>

plugins/markdown/markdown.css

@@ -0,0 +1,137 @@
+/**
+ * Credit to Simon Laroche <https://github.com/simonlc/Markdown-CSS>
+ * whom created the CSS which this file is based on.
+ * License: Unlicense <http://unlicense.org/>
+ */
+
+.markdown p{
+    margin:0.75em 0;
+}
+
+.markdown img{
+    max-width:100%;
+}
+
+.markdown h1, .markdown h2, .markdown h3, .markdown h4, .markdown h5, .markdown h6{
+    font-weight:normal;
+    font-style:normal;
+    line-height:1em;
+    margin:0.75em 0;
+}
+.markdown h4, .markdown h5, .markdown h6{ font-weight: bold; }
+.markdown h1{ font-size:2.5em; }
+.markdown h2{ font-size:2em; }
+.markdown h3{ font-size:1.5em; }
+.markdown h4{ font-size:1.2em; }
+.markdown h5{ font-size:1em; }
+.markdown h6{ font-size:0.9em; }
+
+.markdown blockquote{
+    color:#666666;
+    padding-left: 3em;
+    border-left: 0.5em #EEE solid;
+    margin:0.75em 0;
+}
+.markdown hr { display: block; height: 2px; border: 0; border-top: 1px solid #aaa;border-bottom: 1px solid #eee; margin: 1em 0; padding: 0; }
+.markdown pre, .markdown code, .markdown kbd, .markdown samp {
+    font-family: monospace, 'courier new';
+    font-size: 0.98em;
+}
+.markdown pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
+
+.markdown b, .markdown strong { font-weight: bold; }
+
+.markdown dfn, .markdown em { font-style: italic; }
+
+.markdown ins { background: #ff9; color: #000; text-decoration: none; }
+
+.markdown mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
+
+.markdown sub, .markdown sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
+.markdown sup { top: -0.5em; }
+.markdown sub { bottom: -0.25em; }
+
+.markdown ul, .markdown ol { margin: 1em 0; padding: 0 0 0 2em; }
+.markdown li p:last-child { margin:0 }
+.markdown dd { margin: 0 0 0 2em; }
+
+.markdown img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }
+
+.markdown table { border-collapse: collapse; border-spacing: 0; }
+.markdown td { vertical-align: top; }
+
+@media only screen and (min-width: 480px) {
+    .markdown {font-size:0.9em;}
+}
+
+@media only screen and (min-width: 768px) {
+    .markdown {font-size:1em;}
+}
+
+#linklist .markdown li {
+    padding: 0;
+    border: none;
+    background: none;
+}
+
+#linklist .markdown ul li {
+    list-style: circle;
+}
+
+#linklist .markdown ol li {
+    list-style: decimal;
+}
+
+.markdown table {
+    padding: 0;
+}
+.markdown table tr {
+    border-top: 1px solid #cccccc;
+    background-color: white;
+    margin: 0;
+    padding: 0;
+}
+.markdown table tr:nth-child(2n) {
+    background-color: #f8f8f8;
+}
+.markdown table tr th {
+    font-weight: bold;
+    border: 1px solid #cccccc;
+    text-align: left;
+    margin: 0;
+    padding: 6px 13px;
+}
+.markdown table tr td {
+    border: 1px solid #cccccc;
+    text-align: left;
+    margin: 0;
+    padding: 6px 13px;
+}
+.markdown table tr th :first-child, .markdown  table tr td :first-child {
+    margin-top: 0;
+}
+.markdown table tr th :last-child, table tr td :last-child {
+    margin-bottom: 0;
+}
+
+.md_help {
+    color: white;
+}
+
+/*
+ Remove header links style
+ */
+#pageheader .md_help a {
+    color: lightgray;
+    font-weight: bold;
+    text-decoration: underline;
+
+    background: none;
+    box-shadow: none;
+    padding: 0;
+    margin: 0;
+}
+
+#pageheader .md_help a:hover {
+    color: white;
+}

plugins/markdown/markdown.meta

@@ -0,0 +1 @@
+description="Render shaare description with Markdown syntax."

plugins/markdown/markdown.php

@@ -0,0 +1,158 @@
+<?php
+
+/**
+ * Plugin Markdown.
+ *
+ * Shaare's descriptions are parsed with Markdown.
+ */
+
+require_once 'Parsedown.php';
+
+/**
+ * Parse linklist descriptions.
+ *
+ * @param array $data linklist data.
+ *
+ * @return mixed linklist data parsed in markdown (and converted to HTML).
+ */
+function hook_markdown_render_linklist($data)
+{
+    foreach ($data['links'] as &$value) {
+        $value['description'] = process_markdown($value['description']);
+    }
+
+    return $data;
+}
+
+/**
+ * Parse daily descriptions.
+ *
+ * @param array $data daily data.
+ *
+ * @return mixed daily data parsed in markdown (and converted to HTML).
+ */
+function hook_markdown_render_daily($data)
+{
+    // Manipulate columns data
+    foreach ($data['cols'] as &$value) {
+        foreach ($value as &$value2) {
+            $value2['formatedDescription'] = process_markdown($value2['formatedDescription']);
+        }
+    }
+
+    return $data;
+}
+
+/**
+ * When link list is displayed, include markdown CSS.
+ *
+ * @param array $data includes data.
+ *
+ * @return mixed - includes data with markdown CSS file added.
+ */
+function hook_markdown_render_includes($data)
+{
+    if ($data['_PAGE_'] == Router::$PAGE_LINKLIST
+        || $data['_PAGE_'] == Router::$PAGE_DAILY
+        || $data['_PAGE_'] == Router::$PAGE_EDITLINK
+    ) {
+        
+        $data['css_files'][] = PluginManager::$PLUGINS_PATH . '/markdown/markdown.css';
+    }
+
+    return $data;
+}
+
+/**
+ * Hook render_editlink.
+ * Adds an help link to markdown syntax.
+ *
+ * @param array $data data passed to plugin
+ *
+ * @return array altered $data.
+ */
+function hook_markdown_render_editlink($data)
+{
+    // Load help HTML into a string
+    $data['edit_link_plugin'][] = file_get_contents(PluginManager::$PLUGINS_PATH .'/markdown/help.html');
+    return $data;
+}
+
+
+/**
+ * Remove HTML links auto generated by Shaarli core system.
+ * Keeps HREF attributes.
+ *
+ * @param string $description input description text.
+ *
+ * @return string $description without HTML links.
+ */
+function reverse_text2clickable($description)
+{
+    return preg_replace('!<a +href="([^ ]*)">[^ ]+</a>!m', '$1', $description);
+}
+
+/**
+ * Remove <br> tag to let markdown handle it.
+ *
+ * @param string $description input description text.
+ *
+ * @return string $description without <br> tags.
+ */
+function reverse_nl2br($description)
+{
+    return preg_replace('!<br */?>!im', '', $description);
+}
+
+/**
+ * Remove HTML spaces '&nbsp;' auto generated by Shaarli core system.
+ *
+ * @param string $description input description text.
+ *
+ * @return string $description without HTML links.
+ */
+function reverse_space2nbsp($description)
+{
+    return preg_replace('/(^| )&nbsp;/m', '$1 ', $description);
+}
+
+/**
+ * Remove '&gt;' at start of line auto generated by Shaarli core system
+ * to allow markdown blockquotes.
+ *
+ * @param string $description input description text.
+ *
+ * @return string $description without HTML links.
+ */
+function reset_quote_tags($description)
+{
+    return preg_replace('/^( *)&gt; /m', '$1> ', $description);
+}
+
+/**
+ * Render shaare contents through Markdown parser.
+ *   1. Remove HTML generated by Shaarli core.
+ *   2. Generate markdown descriptions.
+ *   3. Wrap description in 'markdown' CSS class.
+ *
+ * @param string $description input description text.
+ *
+ * @return string HTML processed $description.
+ */
+function process_markdown($description)
+{
+    $parsedown = new Parsedown();
+
+    $processedDescription = $description;
+    $processedDescription = reverse_text2clickable($processedDescription);
+    $processedDescription = reverse_nl2br($processedDescription);
+    $processedDescription = reverse_space2nbsp($processedDescription);
+    $processedDescription = reset_quote_tags($processedDescription);
+    $processedDescription = $parsedown
+        ->setMarkupEscaped(false)
+        ->setBreaksEnabled(true)
+        ->text($processedDescription);
+    $processedDescription = '<div class="markdown">'. $processedDescription . '</div>';
+
+    return $processedDescription;
+}

tests/plugins/PluginMarkdownTest.php

@@ -0,0 +1,112 @@
+<?php
+
+/**
+ * PluginMarkdownTest.php
+ */
+
+require_once 'application/Utils.php';
+require_once 'plugins/markdown/markdown.php';
+
+/**
+ * Class PlugQrcodeTest
+ * Unit test for the QR-Code plugin
+ */
+class PluginMarkdownTest extends PHPUnit_Framework_TestCase
+{
+    /**
+     * Reset plugin path
+     */
+    function setUp()
+    {
+        PluginManager::$PLUGINS_PATH = 'plugins';
+    }
+
+    /**
+     * Test render_linklist hook.
+     * Only check that there is basic markdown rendering.
+     */
+    function testMarkdownLinklist()
+    {
+        $markdown = '# My title' . PHP_EOL . 'Very interesting content.';
+        $data = array(
+            'links' => array(
+                0 => array(
+                    'description' => $markdown,
+                ),
+            ),
+        );
+
+        $data = hook_markdown_render_linklist($data);
+        $this->assertNotFalse(strpos($data['links'][0]['description'], '<h1>'));
+        $this->assertNotFalse(strpos($data['links'][0]['description'], '<p>'));
+    }
+
+    /**
+     * Test render_daily hook.
+     * Only check that there is basic markdown rendering.
+     */
+    function testMarkdownDaily()
+    {
+        $markdown = '# My title' . PHP_EOL . 'Very interesting content.';
+        $data = array(
+            // Columns data
+            'cols' => array(
+                // First, second, third.
+                0 => array(
+                    // nth link
+                    0 => array(
+                        'formatedDescription' => $markdown,
+                    ),
+                ),
+            ),
+        );
+
+        $data = hook_markdown_render_daily($data);
+        $this->assertNotFalse(strpos($data['cols'][0][0]['formatedDescription'], '<h1>'));
+        $this->assertNotFalse(strpos($data['cols'][0][0]['formatedDescription'], '<p>'));
+    }
+
+    /**
+     * Test reverse_text2clickable().
+     */
+    function testReverseText2clickable()
+    {
+        $text = 'stuff http://hello.there/is=someone#here otherstuff';
+        $clickableText = text2clickable($text, '');
+        $reversedText = reverse_text2clickable($clickableText);
+        $this->assertEquals($text, $reversedText);
+    }
+
+    /**
+     * Test reverse_nl2br().
+     */
+    function testReverseNl2br()
+    {
+        $text = 'stuff' . PHP_EOL . 'otherstuff';
+        $processedText = nl2br($text);
+        $reversedText = reverse_nl2br($processedText);
+        $this->assertEquals($text, $reversedText);
+    }
+
+    /**
+     * Test reverse_space2nbsp().
+     */
+    function testReverseSpace2nbsp()
+    {
+        $text = ' stuff' . PHP_EOL . '  otherstuff  and another';
+        $processedText = space2nbsp($text);
+        $reversedText = reverse_space2nbsp($processedText);
+        $this->assertEquals($text, $reversedText);
+    }
+
+    /**
+     * Test reset_quote_tags()
+     */
+    function testResetQuoteTags()
+    {
+        $text = '> quote1'. PHP_EOL . ' > quote2 ' . PHP_EOL . 'noquote';
+        $processedText = escape($text);
+        $reversedText = reset_quote_tags($processedText);
+        $this->assertEquals($text, $reversedText);
+    }
+}