miniblog

commit b4bb1631b7f9536216cfae9f3f58af2bbfec6c12
parent 82718454c887fa12dcbaaef81d11409eb5554188
Author: Decay <decay@todayiwilllaunchmyinfantsonintoorbit.com>
Date:   Mon, 21 Dec 2020 18:18:00 -0800

Add support scalable youtube embeds

Adds a new markdown tag !yt[id] that embeds youtube videos directly with
appropriate markup to make them scale appropriately based on the default
templates and CSS.

Diffstat:
M
miniblog.asd
 | 
2
++
A
src/markdown-ext.lisp
 | 
53
+++++++++++++++++++++++++++++++++++++++++++++++++++++
M
src/packages.lisp
 | 
3
+++
M
templates/template.dtl
 | 
15
+++++++++++++++

4 files changed, 73 insertions(+), 0 deletions(-)
diff --git a/miniblog.asd b/miniblog.asd
@@ -17,12 +17,14 @@ into date-structured directories as a normal HTML."
                         "dbd-sqlite3"
                         "sxql"
                         "mito"
+                        "esrap"
                         "3bmd"
                         "local-time"
                         "str"
                         "command-line-arguments")
            :components ((:module "src"
                                  :components ((:file "packages")
+                                              (:file "markdown-ext")
                                               (:file "format")
                                               (:file "edit")
                                               (:file "db")
diff --git a/src/markdown-ext.lisp b/src/markdown-ext.lisp
@@ -0,0 +1,53 @@
+(in-package #:miniblog.markdown-ext)
+
+;;; Extension flags, enable all by default
+(defparameter *youtube-embeds* 1)
+
+;;; Embed youtube videos
+;;; Based on 3bmd-youtube
+;;;
+;;; !yt[id]
+;;; !yt[id|width=100,height=200,allowfullscreen]
+
+(defrule yt-param-value
+    (and "="
+         (+ (and (! "]") (! ",") character)))
+  (:destructure (e v)
+                (declare (ignore e))
+                (text v)))
+
+(defrule yt-param
+    (and (or "|" ",")
+         (+ (and (! "=") (! "]") (! ",") character))
+         (? yt-param-value))
+  (:destructure (delim name value)
+                (declare (ignore delim))
+                (cons (text name) value)))
+
+(define-extension-inline *youtube-embeds* youtube-embed
+    (and "!yt["
+         (* (and (! "]") (! "|") character))
+         (? (+ yt-param))
+         "]")
+  (:destructure (s id params e)
+                (declare (ignore s e))
+                (append
+                 (list :youtube-embed (text id))
+                 params)))
+
+(defmethod print-tagged-element ((tag (eql :youtube-embed)) stream rest)
+  (let ((id (car rest))
+        (params (cdr rest)))
+    (format stream
+            (concatenate
+             'string
+             "<div class=\"yt-container\">"
+             "<iframe src=\"https://www.youtube-nocookie.com/embed/~a\" "
+             "frameborder=\"0\" class=\"yt-video\" "
+             "~{~a~^ ~}"
+             "></iframe>"
+             "</div>")
+            id
+            (mapcar (lambda (x)
+                      (format nil "~a~@[=\"~a\"~]" (car x) (cdr x)))
+                    params))))
diff --git a/src/packages.lisp b/src/packages.lisp
@@ -1,5 +1,8 @@
 (in-package :cl-user)
 
+(defpackage :miniblog.markdown-ext
+  (:use :cl :esrap :3bmd-ext))
+
 (defpackage :miniblog.format
   (:use :cl :local-time)
   (:import-from :str :split)
diff --git a/templates/template.dtl b/templates/template.dtl
@@ -22,6 +22,21 @@
           section#miniblog-main { float: none; width: 100%; }
           nav#miniblog-nav { float: none; width: 100%; }
         }
+
+        /* Youtube embed stuff */
+        .yt-container {
+            position: relative;
+            width: 96%;
+            height: 0;
+            padding-bottom: 56.25%;
+        }
+        .yt-video {
+            position: absolute;
+            top: 0;
+            left: 0;
+            width: 100%;
+            height: 100%;
+        }
       </style>
       <meta name="viewport" content="width=device-width, initial-scale=1.0">
       {% if stylesheet %}