Refactor YouTube shortcode

Includes the following changes:
 - Add support to retrieve the YouTube title from the video metadata
 - Adjusts autoplay configuration
 - Improve argument handling

data/structures/youtube.yml

@@ -23,4 +23,12 @@ arguments:
     type: bool
     optional: true
     default: false
-    comment: Flag indicating the video should start playing immediately when loaded.
+    comment: >-
+      Flag indicating the video should start playing immediately when loaded, if
+      supported by the browser. The audio will be muted.
+  autotitle:
+    type: bool
+    optional: true
+    default: false
+    comment: >-
+      Trigger to retrieve the title from the video metadata.

exampleSite/content/en/blog/bootstrap-elements.md

@@ -466,3 +466,13 @@ As an example, the following shortcode displays a tooltip for a colored hyperlin
 {{</* tooltip color="primary" title="Tooltip caption" href="#!" */>}}Tooltip{{</* /tooltip */>}} demonstration
 {{< /example >}}
 <!-- markdownlint-enable MD037 -->
+
+## Youtube
+
+As an example, the following shortcode displays a Hugo quickstart guide.
+
+<!-- markdownlint-disable MD037 -->
+{{< example lang="hugo" >}}
+{{</* youtube id="w7Ft2ymGmfc" autoplay=true autotitle=true */>}}
+{{< /example >}}
+<!-- markdownlint-enable MD037 -->

layouts/shortcodes/youtube.html

@@ -7,6 +7,8 @@
     following modifications:
      - Isolated the styles to comply with the Content Security Policy
      - Added validation of shortcode arguments
+     - Added support to retrieve the title from the video metadata
+     - Adjusted autoplay configuration
      - Modified the layout
     
     The original source code is available on:
@@ -25,17 +27,44 @@
     {{ end }}
 
     <!-- Initialize arguments -->
-  {{- $id := .Get "id" | default (.Get 0) -}}
+    {{- $id := "" -}}
-  {{- $class := .Get "class" | default (.Get 1) -}}
+    {{- $class := "" -}}
-  {{- $title := .Get "title" | default "YouTube Video" }}
+    {{- $title := "YouTube Video" }}
     {{- $autoplay := false }}
-  {{ with .Get "autoplay" }}{{ $autoplay = partial "utilities/CastBool.html" . }}{{ end -}}
+    {{- $autotitle := false }}
     {{- $host := cond $pc.PrivacyEnhanced  "www.youtube-nocookie.com" "www.youtube.com" -}}
 
+    {{- if .IsNamedParams }}
+        {{ with .Get "id" }}{{ $id = . }}{{ end }}
+        {{ with .Get "class" }}{{ $class = . }}{{ end }}
+        {{ with .Get "title" }}{{ $title = . }}{{ end }}
+        {{ if isset .Params "autoplay" }}{{ $autoplay = partial "utilities/CastBool.html" (.Get "autoplay") }}{{ end -}}
+        {{ if isset .Params "autotitle" }}{{ $autotitle = partial "utilities/CastBool.html" (.Get "autotitle") }}{{ end -}}
+    {{ else }}
+        {{- $id = .Get 0 -}}
+        {{- $class = .Get 1 -}}
+    {{ end }}
+  
+    {{ $url := printf "https://%s/embed/%s?origin=%s" $host $id .Site.BaseURL }}
+    {{ $api := printf "https://www.youtube.com/oembed?format=json&url=%s" (printf "https://www.youtube.com/watch?v=%s" $id) }}
+
+    {{ if $autotitle }}
+        {{ with resources.GetRemote $api }}
+            {{ with .Err }}
+                {{ errorf "Unable to parse video metadata '%q': %s\n  %s" $api .Position . }}
+            {{ else }}
+                {{ $data := . | transform.Unmarshal }}
+                {{ with $data.title }}{{ $title = . }}{{ end }}
+            {{ end }}
+        {{ else }}
+            {{ errorf "Unable to get video metadata '%q': %s" $api .Position }}
+        {{ end }}
+    {{ end }}
+
     <!-- Main code -->
     <div class="youtube-embedded {{ $class }}">
-    <iframe src="https://{{ $host }}/embed/{{ $id }}?origin={{ .Site.BaseURL }}{{ if $autoplay }}&autoplay=1{{ end }}"
+    <iframe src="{{ $url }}{{ if $autoplay }}&autoplay=1&mute=1{{ end }}"
-      allowfullscreen title="{{ $title }}">
+        allowfullscreen title="{{ $title }}" {{ if $autoplay }}allow="autoplay"{{ end }}>
     </iframe>
     </div>
 {{ end -}}