mirror of
https://github.com/gethinode/hinode.git
synced 2025-10-12 20:43:19 +00:00
Refactor YouTube shortcode
Includes the following changes: - Add support to retrieve the YouTube title from the video metadata - Adjusts autoplay configuration - Improve argument handling
This commit is contained in:
@@ -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.
|
||||
|
@@ -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 -->
|
||||
|
@@ -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:
|
||||
@@ -16,26 +18,53 @@
|
||||
|
||||
{{- $pc := .Page.Site.Config.Privacy.YouTube -}}
|
||||
{{- if not $pc.Disable -}}
|
||||
{{ $error := false }}
|
||||
{{ $error := false }}
|
||||
|
||||
<!-- Validate arguments -->
|
||||
{{ if partial "utilities/IsInvalidArgs.html" (dict "structure" "youtube" "args" .Params) }}
|
||||
{{ errorf "Invalid arguments: %s" .Position -}}
|
||||
{{ $error = true }}
|
||||
{{ end }}
|
||||
<!-- Validate arguments -->
|
||||
{{ if partial "utilities/IsInvalidArgs.html" (dict "structure" "youtube" "args" .Params) }}
|
||||
{{ errorf "Invalid arguments: %s" .Position -}}
|
||||
{{ $error = true }}
|
||||
{{ end }}
|
||||
|
||||
<!-- Initialize arguments -->
|
||||
{{- $id := .Get "id" | default (.Get 0) -}}
|
||||
{{- $class := .Get "class" | default (.Get 1) -}}
|
||||
{{- $title := .Get "title" | default "YouTube Video" }}
|
||||
{{- $autoplay := false }}
|
||||
{{ with .Get "autoplay" }}{{ $autoplay = partial "utilities/CastBool.html" . }}{{ end -}}
|
||||
{{- $host := cond $pc.PrivacyEnhanced "www.youtube-nocookie.com" "www.youtube.com" -}}
|
||||
<!-- Initialize arguments -->
|
||||
{{- $id := "" -}}
|
||||
{{- $class := "" -}}
|
||||
{{- $title := "YouTube Video" }}
|
||||
{{- $autoplay := false }}
|
||||
{{- $autotitle := false }}
|
||||
{{- $host := cond $pc.PrivacyEnhanced "www.youtube-nocookie.com" "www.youtube.com" -}}
|
||||
|
||||
<!-- Main code -->
|
||||
<div class="youtube-embedded {{ $class }}">
|
||||
<iframe src="https://{{ $host }}/embed/{{ $id }}?origin={{ .Site.BaseURL }}{{ if $autoplay }}&autoplay=1{{ end }}"
|
||||
allowfullscreen title="{{ $title }}">
|
||||
{{- 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="{{ $url }}{{ if $autoplay }}&autoplay=1&mute=1{{ end }}"
|
||||
allowfullscreen title="{{ $title }}" {{ if $autoplay }}allow="autoplay"{{ end }}>
|
||||
</iframe>
|
||||
</div>
|
||||
</div>
|
||||
{{ end -}}
|
Reference in New Issue
Block a user