-
Notifications
You must be signed in to change notification settings - Fork 6
/
episode.liquid
130 lines (129 loc) · 6.41 KB
/
episode.liquid
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta
name="viewport"
content="width=device-width,initial-scale=1,shrink-to-fit=no,user-scalable=no,viewport-fit=cover"
/>
<meta property="og:type" content="website" />
<meta property="og:title" content="{{ item.title }}——牛油果烤面包（Avocado Toast）出品" />
<meta property="og:description" content="{{ item.contentSnippet | strip_newlines }}" />
<meta property="og:url" content="https://avocadotoast.live/episodes/{{ item.itunes.episode }}/" />
<meta property="og:image" content="https://avocadotoast.live{{ item.itunes.images.map['image/jpeg'][1280] }}" />
<meta property="og:image:width" content="1280" />
<meta property="og:image:height" content="1280" />
<meta property="fb:pages" content="319695031499949" />
<meta name="twitter:card" content="player" />
<meta name="twitter:site" content="@avocado___toast" />
<meta name="twitter:title" content="{{ item.title }}——牛油果烤面包（Avocado Toast）出品" />
<meta name="twitter:description" content="{{ item.contentSnippet | strip_newlines }}" />
<meta name="twitter:image" content="https://avocadotoast.live{{ item.itunes.image }}" />
<meta name="twitter:player" content="https://avocadotoast.live/episodes/{{ item.itunes.episode }}/player/" />
<meta name="twitter:player:width" content="480" />
<meta name="twitter:player:height" content="480" />
<title>{{ item.title }}——牛油果烤面包（Avocado Toast）出品</title>
<link rel="stylesheet" href="/css/bootstrap.min.css" crossorigin="anonymous" />
<link rel="stylesheet" href="/css/site.css" crossorigin="anonymous" />
<link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/images/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/images/favicon-16x16.png">
<link rel="icon" href="/favicon.ico" />
<link rel="canonical" href="https://avocadotoast.live/episodes/{{ item.itunes.episode }}/" />
<link rel="alternate" type="application/rss+xml" href="https://avocadotoast.typlog.io/episodes/feed.xml">
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-161595329-1', {
custom_map: {
'dimension1': 'episode',
'dimension2': 'platform',
'dimension3': 'variation'
},
variation: '{{ environment.BRANCH || environment.NODE_ENV }}',
episode: '{{ item.itunes.episode }}'
});
</script>
{% include image_error_script %}
</head>
<body>
{% include navigation_bar %}
<div class="container mt-3">
<div class="row">
<div class="col-md-4 mb-3">
<div class="img-thumbnail">
<div class="square">
<picture>
{% for type in item.itunes.images.array %}
<source
type="{{ type.type }}"
srcset="{% for size in type.sizes %}{{ size.image }} {{ size.size }}w{% if forloop.last != true %}, {% endif %}{% endfor %}"
sizes="(min-width: 1200px) 340px, (min-width: 992px) 280px, (min-width: 768px) 200px, (min-width: 768px) 500px, calc(100vw - 40px)"
/>
{% endfor %}
<img
class="img-fluid square-image-item"
src="{{ item.itunes.images.map['image/jpeg'][480] }}"
alt="cover art"
/>
</picture>
<div class="fixed-bottom position-absolute p-2">
<audio class="w-100 audio-bar" controls preload>
{% for enclosure in item.enclosures %}
<source src="{{ enclosure.url}}" data-platform="{{ enclosure.platform }}" />
{% endfor %}
</audio>
</div>
</div>
</div>
</div>
<div class="col-md-8">
<h1 class="episode-title">{{ item.title }}</h1>
<div class="text-muted">
<span data-date="{{ item.pubDate }}">{{ item.pubDate | date: '%Y 年 %m 月 %d 日' }}</span>发布
</div>
<div class="sticky-buttons sticky-top bg-white pt-2 pb-1 mb-1">
<div class="btn-group share-button-group d-none">
<button type="button" class="btn btn-primary share-button">
分享
</button>
<button type="button" id="shareDropdown" class="btn btn-primary dropdown-toggle dropdown-toggle-split" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<span class="sr-only">开闭下拉菜单</span>
</button>
<div class="dropdown-menu" aria-labelledby="shareDropdown">
<a class="dropdown-item share-timestamp-button" href="#">分享当前播放时间点</a>
</div>
</div>
<div class="btn-group">
<button type="button" id="subscriptionDropdown" class="btn btn-primary dropdown-toggle subscribe-button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
去播客平台收听和订阅
</button>
{% include subscription_links %}
</div>
</div>
<div class="summary">{{ item.itunes.summary }}</div>
</div>
</div>
<hr class="mb-4" />
<div class="row justify-content-center">
<h2 class="mb-3">往期节目</h2>
</div>
{% include episode_list, episode: item.itunes.episode %}
</div>
{% if environment.NODE_ENV == 'development' %}
<script>
console.log({{ item | stringify }});
console.log({{ page | stringify }});
</script>
{% endif %}
<script src="/js/jquery-3.4.1.slim.min.js" crossorigin="anonymous"></script>
<script src="/js/popper.min.js" crossorigin="anonymous"></script>
<script src="/js/bootstrap.min.js" crossorigin="anonymous"></script>
<script src="/js/moment.min.js" crossorigin="anonymous"></script>
<script src="/js/zh-cn.min.js" crossorigin="anonymous"></script>
<script src="/js/site.js" crossorigin="anonymous"></script>
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-161595329-1"></script>
{% include facebook_pixel %}
</body>
</html>