Improve syntax highlighting of code

Squashed commit of the following:

commit eb55e94ed89a1b8ccd1db10a36efd28d8896f316
Author: Jonny Barnes <jonny@jonnybarnes.uk>
Date:   Thu Jan 24 18:45:00 2019 +0000

    Remove un-needed use statments, fix tests now we have 2 articles

commit f1c12c1b43d071fe0484407a9692ee4184542437
Author: Jonny Barnes <jonny@jonnybarnes.uk>
Date:   Wed Jan 23 19:39:56 2019 +0000

    Remove prism files

commit 3a1d12d9181600f661593c662dbc18d152413b28
Author: Jonny Barnes <jonny@jonnybarnes.uk>
Date:   Wed Jan 23 19:39:24 2019 +0000

    Use the new css file in the search page

commit 119b6b5163c217a15770004a45b07bacdfb766f0
Author: Jonny Barnes <jonny@jonnybarnes.uk>
Date:   Wed Jan 23 19:36:14 2019 +0000

    Recompress assets

commit afae245d0211dd31fcc131cecb0fab4084895612
Author: Jonny Barnes <jonny@jonnybarnes.uk>
Date:   Sun Jan 20 19:33:56 2019 +0000

    Style codeblocks in articles as well

commit 53be0a2023755c2f16ba1560d88f9c66675b581d
Author: Jonny Barnes <jonny@jonnybarnes.uk>
Date:   Sun Jan 20 19:23:25 2019 +0000

    Styled codeblocks are now on the notes pages

commit 818add06f349874501cc44baf332dc63dfdcfab1
Author: Jonny Barnes <jonny@jonnybarnes.uk>
Date:   Sun Jan 20 19:08:56 2019 +0000

    Install spatie’s commonmark highlighter, use it for notes

commit fb69d98b2bd3bb56540854fe16200c027e5ef6b2
Author: Jonny Barnes <jonny@jonnybarnes.uk>
Date:   Sun Jan 20 18:54:27 2019 +0000

    Remove links to prism code in the notes pages

commit dc89fcd4711b25e8407be9b25b58cd4cd1e9980e
Author: Jonny Barnes <jonny@jonnybarnes.uk>
Date:   Sun Jan 20 18:54:11 2019 +0000

    Add a note to the seeder which has a code block

app/Models/Article.php

@@ -4,11 +4,16 @@ declare(strict_types=1);
 
 namespace App\Models;
 
+use League\CommonMark\Environment;
 use Illuminate\Database\Eloquent\Model;
 use Illuminate\Database\Eloquent\Builder;
 use Cviebrock\EloquentSluggable\Sluggable;
 use League\CommonMark\CommonMarkConverter;
 use Illuminate\Database\Eloquent\SoftDeletes;
+use League\CommonMark\Block\Element\FencedCode;
+use League\CommonMark\Block\Element\IndentedCode;
+use Spatie\CommonMarkHighlighter\FencedCodeRenderer;
+use Spatie\CommonMarkHighlighter\IndentedCodeRenderer;
 
 class Article extends Model
 {
@@ -57,15 +62,12 @@ class Article extends Model
      */
     public function getHtmlAttribute(): string
     {
-        $markdown = new CommonMarkConverter();
+        $environment = Environment::createCommonMarkEnvironment();
-        $html = $markdown->convertToHtml($this->main);
+        $environment->addBlockRenderer(FencedCode::class, new FencedCodeRenderer());
-        // changes <pre><code>[lang] ~> <pre><code data-language="lang">
+        $environment->addBlockRenderer(IndentedCode::class, new IndentedCodeRenderer());
-        $match = '/<pre><code>\[(.*)\]\n/';
+        $commonMarkConverter = new CommonMarkConverter([], $environment);
-        $replace = '<pre><code class="language-$1">';
-        $text = preg_replace($match, $replace, $html);
-        $default = preg_replace('/<pre><code>/', '<pre><code class="language-markdown">', $text);
 
-        return $default;
+        return $commonMarkConverter->convertToHtml($this->main);
     }
 
     /**

app/Models/Note.php

@@ -9,17 +9,19 @@ use Twitter;
 use Normalizer;
 use GuzzleHttp\Client;
 use Laravel\Scout\Searchable;
-use League\CommonMark\Converter;
-use League\CommonMark\DocParser;
 use Jonnybarnes\IndieWeb\Numbers;
 use League\CommonMark\Environment;
-use League\CommonMark\HtmlRenderer;
 use Illuminate\Database\Eloquent\Model;
 use Jonnybarnes\EmojiA11y\EmojiModifier;
 use Illuminate\Database\Eloquent\Builder;
+use League\CommonMark\CommonMarkConverter;
 use App\Exceptions\TwitterContentException;
 use Illuminate\Database\Eloquent\SoftDeletes;
+use League\CommonMark\Block\Element\FencedCode;
+use League\CommonMark\Block\Element\IndentedCode;
 use Jonnybarnes\CommonmarkLinkify\LinkifyExtension;
+use Spatie\CommonMarkHighlighter\FencedCodeRenderer;
+use Spatie\CommonMarkHighlighter\IndentedCodeRenderer;
 
 class Note extends Model
 {
@@ -513,7 +515,9 @@ class Note extends Model
     {
         $environment = Environment::createCommonMarkEnvironment();
         $environment->addExtension(new LinkifyExtension());
-        $converter = new Converter(new DocParser($environment), new HtmlRenderer($environment));
+        $environment->addBlockRenderer(FencedCode::class, new FencedCodeRenderer());
+        $environment->addBlockRenderer(IndentedCode::class, new IndentedCodeRenderer());
+        $converter = new CommonMarkConverter([], $environment);
 
         return $converter->convertToHtml($note);
     }

composer.json

@@ -30,6 +30,7 @@
         "ramsey/uuid": "^3.5",
         "sensiolabs/security-checker": "^5.0",
         "spatie/browsershot": "~3.0",
+        "spatie/commonmark-highlighter": "^1.0",
         "thujohn/twitter": "~2.0"
     },
     "require-dev": {

composer.lock

@@ -4,7 +4,7 @@
         "Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
         "This file is @generated automatically"
     ],
-    "content-hash": "20507240812c8f4034c9b81c6860f088",
+    "content-hash": "e64d4d2f1552ebf50112a6122f6ee690",
     "packages": [
         {
             "name": "aws/aws-sdk-php",
@@ -3813,6 +3813,65 @@
             ],
             "time": "2018-07-19T23:38:55+00:00"
         },
+        {
+            "name": "scrivo/highlight.php",
+            "version": "v9.13.1.1",
+            "source": {
+                "type": "git",
+                "url": "https://github.com/scrivo/highlight.php.git",
+                "reference": "93834559fa181b6f34a3f639eaab5f9a9856ec99"
+            },
+            "dist": {
+                "type": "zip",
+                "url": "https://api.github.com/repos/scrivo/highlight.php/zipball/93834559fa181b6f34a3f639eaab5f9a9856ec99",
+                "reference": "93834559fa181b6f34a3f639eaab5f9a9856ec99",
+                "shasum": ""
+            },
+            "require": {
+                "ext-json": "*",
+                "ext-mbstring": "*"
+            },
+            "require-dev": {
+                "phpunit/phpunit": "^4.8|^5.7",
+                "symfony/finder": "^2.8"
+            },
+            "type": "library",
+            "autoload": {
+                "psr-0": {
+                    "Highlight\\": ""
+                }
+            },
+            "notification-url": "https://packagist.org/downloads/",
+            "license": [
+                "BSD-3-Clause"
+            ],
+            "authors": [
+                {
+                    "name": "Geert Bergman",
+                    "homepage": "http://www.scrivo.org/",
+                    "role": "Project Author"
+                },
+                {
+                    "name": "Vladimir Jimenez",
+                    "homepage": "https://allejo.io",
+                    "role": "Contributor"
+                },
+                {
+                    "name": "Martin Folkers",
+                    "homepage": "https://twobrain.io",
+                    "role": "Contributor"
+                }
+            ],
+            "description": "Server side syntax highlighter that supports 185 languages. It's a PHP port of highlight.js",
+            "keywords": [
+                "code",
+                "highlight",
+                "highlight.js",
+                "highlight.php",
+                "syntax"
+            ],
+            "time": "2019-01-15T05:54:20+00:00"
+        },
         {
             "name": "sensiolabs/security-checker",
             "version": "v5.0.3",
@@ -3915,6 +3974,56 @@
             ],
             "time": "2019-01-10T09:13:44+00:00"
         },
+        {
+            "name": "spatie/commonmark-highlighter",
+            "version": "1.0.1",
+            "source": {
+                "type": "git",
+                "url": "https://github.com/spatie/commonmark-highlighter.git",
+                "reference": "cab33e2d2a87011a4f44db71ceed2a89f692f930"
+            },
+            "dist": {
+                "type": "zip",
+                "url": "https://api.github.com/repos/spatie/commonmark-highlighter/zipball/cab33e2d2a87011a4f44db71ceed2a89f692f930",
+                "reference": "cab33e2d2a87011a4f44db71ceed2a89f692f930",
+                "shasum": ""
+            },
+            "require": {
+                "league/commonmark": "^0.18.0",
+                "php": "^7.1",
+                "scrivo/highlight.php": "v9.13.1.1"
+            },
+            "require-dev": {
+                "larapack/dd": "^1.0",
+                "phpunit/phpunit": "^7.0",
+                "spatie/phpunit-snapshot-assertions": "^1.3"
+            },
+            "type": "library",
+            "autoload": {
+                "psr-4": {
+                    "Spatie\\CommonMarkHighlighter\\": "src"
+                }
+            },
+            "notification-url": "https://packagist.org/downloads/",
+            "license": [
+                "MIT"
+            ],
+            "authors": [
+                {
+                    "name": "Sebastian De Deyne",
+                    "email": "sebastian@spatie.be",
+                    "homepage": "https://spatie.be",
+                    "role": "Developer"
+                }
+            ],
+            "description": "Highlight your markdown code blocks with league/commonmark",
+            "homepage": "https://github.com/spatie/commonmark-highlighter",
+            "keywords": [
+                "commonmark-highlighter",
+                "spatie"
+            ],
+            "time": "2019-01-16T15:37:34+00:00"
+        },
         {
             "name": "spatie/image",
             "version": "1.5.3",

database/seeds/ArticlesTableSeeder.php

@@ -17,5 +17,30 @@ class ArticlesTableSeeder extends Seeder
             'main' => 'This is *my* new blog. It uses `Markdown`.',
             'published' => 1,
         ]);
+
+        $articleWithCode = <<<EOF
+I wrote some code.
+
+I liked writing this:
+
+```php
+<?php
+
+declare(strict_types=1);
+
+class Foo
+{
+    public function __construct()
+    {
+        echo 'Foo class constructed';
+    }
+}
+```
+EOF;
+        Article::create([
+            'title' => 'Some code I did',
+            'main' => $articleWithCode,
+            'published' => 1,
+        ]);
     }
 }

database/seeds/NotesTableSeeder.php

@@ -108,5 +108,16 @@ class NotesTableSeeder extends Seeder
         $noteCapitalHashtag = Note::create([
             'note' => 'A #TwoWord hashtag',
         ]);
+        sleep(1);
+        $noteWithCodeContent = <<<EOF
+A note with some code:
+```php
+<?php
+
+echo 'Hello World';
+EOF;
+        $noteWithCode = Note::create([
+            'note' => $noteWithCodeContent,
+        ]);
     }
 }

public/assets/css/app.css.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../resources/assets/sass/_border-box.scss","../../../resources/assets/sass/_base-font.scss","../../../resources/assets/sass/_header.scss","../../../resources/assets/sass/_variables.scss","../../../resources/assets/sass/_main.scss","../../../resources/assets/sass/_hovercard.scss","../../../resources/assets/sass/_notes.scss","../../../resources/assets/sass/_pagination.scss","../../../resources/assets/sass/_contacts-page.scss","../../../resources/assets/sass/_projects.scss","../../../resources/assets/sass/_footer.scss","../../../resources/assets/sass/_admin-form.scss","../../../resources/assets/sass/_form.scss","../../../resources/assets/sass/_likes.scss","../../../resources/assets/sass/_bridgy-links.scss","../../../resources/assets/sass/_emoji.scss","../../../resources/assets/sass/_mapbox.scss","../../../resources/assets/sass/_colors.scss","../../../resources/assets/sass/_styles.scss","../../../resources/assets/sass/_tags.scss"],"names":[],"mappings":"AAKA,KACI,qBAAsB,CACzB,qBAKG,kBAAmB,CACtB,KCVG,eACA,gCAAiC,CACpC,gBAGG,oBAAqB,CACxB,WCNG,aACA,cACA,mBACA,WACA,eCJgB,CDKnB,cAGG,eACA,cAAe,CAClB,eAGG,cAAe,CAClB,KEdG,aACA,sBACA,oBACA,gBACA,cACA,iBACA,cAAe,CAClB,WAIG,gBAAiB,CACpB,aCZG,iBAAkB,CACrB,qBAGG,iBAAkB,CACrB,2BAGG,WAAY,CACf,WAGG,kBACA,mBACA,8BACA,qBACA,iBACA,YACA,WACA,UACA,WACA,uBACA,kBACA,mCACA,YAAa,CAChB,8BAGG,YAAa,CAChB,0BAGG,WACA,WAAY,CACf,sBAGG,YAAa,CCnCjB,MACI,aACA,sBACA,cAAe,CAClB,UAGG,eACA,eAAgB,CACnB,eAGG,aACA,mBACA,6BAA8B,CACjC,MAGG,WACA,UAAW,CACd,YCtBG,aACA,mBACA,6BACA,eACA,oBAAqB,CACxB,cCLG,eACA,aACA,2BACA,8BACA,eAAgB,CACnB,kBAGG,WACA,WAAY,CACf,UCVG,cAAe,CAClB,gBCDG,gBACA,cACA,gBAAiB,CACpB,OAGG,gBACA,cACA,aACA,sBACA,kBAAmB,CACtB,YCXG,gBACA,kBAAmB,CACtB,MCFG,aACA,qBAAsB,CACzB,UAGG,aACA,qBAAsB,CACzB,aAGG,kBAAmB,CACtB,WCXG,eAAgB,CACnB,qDCAG,YAAa,CAChB,2BCAG,iBAAkB,CACrB,gFAIG,kBACA,cACA,UACA,aACA,OACA,cACA,qBACA,yBACA,oBACA,oCACA,yBACA,kCACA,WACA,cACA,0CAAkC,AAAlC,iCAAkC,CACrC,2BAGG,KACI,aACA,6BACA,wCACA,0BACA,qBAAkC,CAGtC,GACI,aACA,kCACA,yBACA,WACA,mCAAgD,CAAA,CAIxD,AApBC,mBAGG,KACI,aACA,6BACA,wCACA,0BACA,qBAAkC,CAGtC,GACI,aACA,kCACA,yBACA,WACA,mCAAgD,CAAA,CAIxD,aACI,kCACI,kCAAmC,CACtC,CC9CL,KACI,YAAa,CAChB,oBAGG,kBAAmB,CACtB,QAGG,y4HACA,wBACA,WACA,WAAY,CACf,UAGG,kBACA,MACA,OACA,iBACA,cAAe,CAClB,gBAGG,gBACA,gBAAiB,CACpB,KCzBG,gCACA,kBAAmB,CACtB,WAGG,8BACA,kBAAmB,CACtB,YAIG,iBAAkB,CACrB,KCZG,kCAEA,yBACA,4BAAoB,AAApB,mBAAoB,CACvB,KAGG,oBAAqB,CACxB,aAGG,oBAAqB,CACxB,MCVG,SACA,gBACA,SAAU,CACb,SAGG,WACA,oBAAqB,CACxB,kBAIG,wBACA,0BACA,mBACA,qBACA,cACA,mBACA,sBACA,kBACA,qBACA,qBACA,qBAAsB,CACzB,YAGG,0BACA,uCACA,oCACA,oCACA,WACA,kBACA,QACA,KAAM,CACT,WAGG,4BACA,kBAAmB,CACtB,kBAGG,4BAA6B,CAChC","file":"app.css"}
+{"version":3,"sources":["../../../resources/assets/sass/_border-box.scss","../../../resources/assets/sass/_base-font.scss","../../../resources/assets/sass/_header.scss","../../../resources/assets/sass/_variables.scss","../../../resources/assets/sass/_main.scss","../../../resources/assets/sass/_articles.scss","../../../resources/assets/sass/_hovercard.scss","../../../resources/assets/sass/_notes.scss","../../../resources/assets/sass/_pagination.scss","../../../resources/assets/sass/_contacts-page.scss","../../../resources/assets/sass/_projects.scss","../../../resources/assets/sass/_footer.scss","../../../resources/assets/sass/_admin-form.scss","../../../resources/assets/sass/_form.scss","../../../resources/assets/sass/_likes.scss","../../../resources/assets/sass/_bridgy-links.scss","../../../resources/assets/sass/_emoji.scss","../../../resources/assets/sass/_mapbox.scss","../../../resources/assets/sass/_colors.scss","../../../resources/assets/sass/_styles.scss","../../../resources/assets/sass/_tags.scss"],"names":[],"mappings":"AAKA,KACI,qBAAsB,CACzB,qBAKG,kBAAmB,CACtB,KCVG,eACA,gCAAiC,CACpC,gBAGG,oBAAqB,CACxB,WCNG,aACA,cACA,mBACA,WACA,eCJgB,CDKnB,cAGG,eACA,cAAe,CAClB,eAGG,cAAe,CAClB,KEdG,aACA,sBACA,oBACA,gBACA,cACA,iBACA,cAAe,CAClB,WAIG,gBAAiB,CACpB,kBCZG,oBACA,iBAAkB,CACrB,aCFG,iBAAkB,CACrB,qBAGG,iBAAkB,CACrB,2BAGG,WAAY,CACf,WAGG,kBACA,mBACA,8BACA,qBACA,iBACA,YACA,WACA,UACA,WACA,uBACA,kBACA,mCACA,YAAa,CAChB,8BAGG,YAAa,CAChB,0BAGG,WACA,WAAY,CACf,sBAGG,YAAa,CCnCjB,MACI,aACA,sBACA,cAAe,CAClB,UAGG,eACA,eAAgB,CACnB,eAGG,aACA,mBACA,6BAA8B,CACjC,MAGG,WACA,UAAW,CACd,eAGG,oBACA,iBAAkB,CACrB,YC3BG,aACA,mBACA,6BACA,eACA,oBAAqB,CACxB,cCLG,eACA,aACA,2BACA,8BACA,eAAgB,CACnB,kBAGG,WACA,WAAY,CACf,UCVG,cAAe,CAClB,gBCDG,gBACA,cACA,gBAAiB,CACpB,OAGG,gBACA,cACA,aACA,sBACA,kBAAmB,CACtB,YCXG,gBACA,kBAAmB,CACtB,MCFG,aACA,qBAAsB,CACzB,UAGG,aACA,qBAAsB,CACzB,aAGG,kBAAmB,CACtB,WCXG,eAAgB,CACnB,qDCAG,YAAa,CAChB,2BCAG,iBAAkB,CACrB,gFAIG,kBACA,cACA,UACA,aACA,OACA,cACA,qBACA,yBACA,oBACA,oCACA,yBACA,kCACA,WACA,cACA,0CAAkC,AAAlC,iCAAkC,CACrC,2BAGG,KACI,aACA,+BACA,wCACA,0BACA,qBAAkC,CAGtC,GACI,aACA,kCACA,yBACA,WACA,mCAAgD,CAAA,CAIxD,AApBC,mBAGG,KACI,aACA,+BACA,wCACA,0BACA,qBAAkC,CAGtC,GACI,aACA,kCACA,yBACA,WACA,mCAAgD,CAAA,CAIxD,aACI,kCACI,kCAAmC,CACtC,CC9CL,KACI,YAAa,CAChB,oBAGG,kBAAmB,CACtB,QAGG,y4HACA,wBACA,WACA,WAAY,CACf,UAGG,kBACA,MACA,OACA,iBACA,cAAe,CAClB,gBAGG,gBACA,gBAAiB,CACpB,KCzBG,gCACA,kBAAmB,CACtB,WAGG,8BACA,kBAAmB,CACtB,YAIG,iBAAkB,CACrB,KCZG,kCAEA,yBACA,4BAAoB,AAApB,mBAAoB,CACvB,KAGG,oBAAqB,CACxB,aAGG,oBAAqB,CACxB,MCVG,SACA,gBACA,SAAU,CACb,SAGG,WACA,oBAAqB,CACxB,kBAIG,wBACA,0BACA,mBACA,qBACA,cACA,mBACA,sBACA,kBACA,qBACA,qBACA,qBAAsB,CACzB,YAGG,0BACA,uCACA,oCACA,oCACA,WACA,kBACA,QACA,KAAM,CACT,WAGG,4BACA,kBAAmB,CACtB,kBAGG,4BAA6B,CAChC","file":"app.css"}