Files
2026-10-29 20:45:09 +07:00

402 lines
24 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
{{template "seoCommon" .}}
{{$siteTitle := "黄果短剧"}}{{if and .playlet .playlet.SeoInfo.WebSiteName}}{{$siteTitle = .playlet.SeoInfo.WebSiteName}}{{else if and .chapter .chapter.SeoInfo.WebSiteName}}{{$siteTitle = .chapter.SeoInfo.WebSiteName}}{{else if .seoInfo.WebSiteName}}{{$siteTitle = .seoInfo.WebSiteName}}{{else if .appConfig.SeoInfo.WebSiteName}}{{$siteTitle = .appConfig.SeoInfo.WebSiteName}}{{end}}
{{$pageTitle := "在线播放"}}
{{if .chapter}}
{{if .chapter.SeoInfo.Title}}{{if .chapter.CurrentEpisode}}{{$pageTitle = printf "%s - 第%d集" .chapter.SeoInfo.Title .chapter.CurrentEpisode}}{{else}}{{$pageTitle = .chapter.SeoInfo.Title}}{{end}}
{{else if .playlet}}{{if .playlet.SeoInfo.Title}}{{if .chapter.CurrentEpisode}}{{$pageTitle = printf "%s - 第%d集" .playlet.SeoInfo.Title .chapter.CurrentEpisode}}{{else}}{{$pageTitle = .playlet.SeoInfo.Title}}{{end}}{{else if .title}}{{$pageTitle = .title}}{{end}}
{{else if .title}}{{$pageTitle = .title}}{{end}}
{{else if .playlet}}{{if .playlet.SeoInfo.Title}}{{$pageTitle = .playlet.SeoInfo.Title}}{{else if .title}}{{$pageTitle = .title}}{{end}}
{{else if .title}}{{$pageTitle = .title}}{{end}}
<title>{{$pageTitle}} - {{$siteTitle}}</title>
<meta name="description" content="{{if .playlet}}{{if .playlet.Desc}}{{.playlet.Desc}}{{else}}正在播放《{{.playlet.Title}}》{{if .chapter}}第{{.chapter.CurrentEpisode}}集{{end}},高清在线观看。{{end}}{{else if .seoInfo.Description}}{{.seoInfo.Description}}{{else}}黄果短剧高清在线播放,流畅观影不错过精彩剧情。{{end}} - 黄果短剧">
<meta name="keywords" content="{{if .playlet}}{{.playlet.Title}}{{range .playlet.ThemeNames}},{{.}}{{end}}{{range .playlet.TagNames}},{{.}}{{end}},在线播放,短剧播放,黄果短剧{{else if .seoInfo.Keywords}}{{joinStrings .seoInfo.Keywords ","}}{{else}}短剧播放,在线观看,黄果短剧{{end}}">
<meta property="og:type" content="video.episode">
<meta property="og:title" content="{{$pageTitle}} - {{$siteTitle}}">
<meta property="og:description" content="{{if .playlet}}{{if .playlet.Desc}}{{.playlet.Desc}}{{else}}正在播放《{{.playlet.Title}}》{{end}}{{else if .seoInfo.Description}}{{.seoInfo.Description}}{{else}}黄果短剧高清在线播放。{{end}}">
{{if .playlet}}{{if .playlet.Cover}}<meta property="og:image" content="{{.playlet.Cover}}">
<meta name="twitter:image" content="{{.playlet.Cover}}">{{end}}{{end}}
<meta name="twitter:title" content="{{$pageTitle}} - {{$siteTitle}}">
<meta name="twitter:description" content="{{if .playlet}}{{if .playlet.Desc}}{{.playlet.Desc}}{{else}}正在播放《{{.playlet.Title}}》{{end}}{{else if .seoInfo.Description}}{{.seoInfo.Description}}{{else}}黄果短剧高清在线播放。{{end}}">
{{if .jsonLD}}
<script type="application/ld+json">{{.jsonLD}}</script>
{{end}}
<link rel="stylesheet" href="/static/css/index.css?v=27">
<link rel="stylesheet" href="/static/css/detail.css?v=32">
<link rel="stylesheet" href="/static/css/play.css?v=30">
<link rel="stylesheet" href="/static/css/dramaTile.css?v=1" />
<link rel="stylesheet" href="/static/common/DPlayer.min.css">
<script defer src="/static/common/hls.min.js"></script>
<script defer src="/static/common/DPlayer.min.js"></script>
</head>
<body class="site-shell is-play-page">
{{template "header" .}}
{{$playlet := .playlet}}
{{$chapter := .chapter}}
{{$playletID := .playletID}}
{{$playletSlug := .playletSlug}}
{{$canWatch := false}}
{{$needUnlock := false}}
{{$needVip := false}}
{{if $chapter}}
{{$canWatch = $chapter.AllowWatch}}
{{$needUnlock = $chapter.NeedUnlock}}
{{$needVip = $chapter.NeedVip}}
{{end}}
{{if or $chapter $playlet}}
<main
class="page-shell play-page"
data-play-page
data-playlet-id="{{$playletID}}"
data-playlet-slug="{{$playletSlug}}"
data-play-title="{{if $playlet}}{{$playlet.Title}}{{end}}"
data-play-cover="{{if $playlet}}{{$playlet.Cover}}{{end}}"
data-play-desc="{{if $playlet}}{{$playlet.Desc}}{{end}}"
data-play-tag="{{if $playlet}}{{themeTagText $playlet.ThemeNames $playlet.TagNames}}{{end}}"
data-play-featured="{{if and $playlet $playlet.IsFeatured}}1{{else}}0{{end}}"
data-play-new="{{if and $playlet $playlet.IsNew}}1{{else}}0{{end}}"
data-play-total-episode="{{if $playlet}}{{$playlet.TotalEpisode}}{{else}}0{{end}}"
data-play-episode="{{if $chapter}}{{$chapter.CurrentEpisode}}{{else}}0{{end}}"
>
<nav class="play-breadcrumb" aria-label="面包屑">
<a class="play-breadcrumb-link" href="/">首页</a>
<span class="play-breadcrumb-sep" aria-hidden="true">›</span>
<a class="play-breadcrumb-link" href="/list/ai-short-play/">短剧</a>
<span class="play-breadcrumb-sep" aria-hidden="true">›</span>
{{if $playletID}}
<a class="play-breadcrumb-link" href="{{detailURL $playletSlug $playletID}}">{{if $playlet}}{{$playlet.Title}}{{else}}短剧{{end}}</a>
{{else}}
<span class="play-breadcrumb-link">{{if $playlet}}{{$playlet.Title}}{{else}}短剧{{end}}</span>
{{end}}
{{if $chapter}}
<span class="play-breadcrumb-sep" aria-hidden="true">›</span>
<span class="play-breadcrumb-current">第{{$chapter.CurrentEpisode}}集</span>
{{end}}
</nav>
<div class="play-layout">
<div class="play-main">
<div class="play-player" data-play-player data-playlet-id="{{$playletID}}"{{if $chapter}} data-chapter-id="{{$chapter.ID}}" data-pay-type="{{$chapter.PayType}}" data-can-watch="{{if $canWatch}}1{{else}}0{{end}}" data-need-unlock="{{if $needUnlock}}1{{else}}0{{end}}" data-need-vip="{{if $needVip}}1{{else}}0{{end}}"{{end}}>
{{if and $chapter $canWatch $chapter.VideoURL}}
<div class="dplayer-video"
data-url="{{$chapter.VideoURL}}"
{{if and $playlet $playlet.Cover}}data-cover="{{$playlet.Cover}}"{{end}}></div>
{{end}}
{{if $playlet}}
<img class="play-player-cover lazy" src="/static/images/placeholder.png?v=2" data-src="{{$playlet.Cover}}" alt="{{$playlet.Title}}" title="{{$playlet.Title}}" data-play-poster />
{{else}}
<img class="play-player-cover" src="/static/images/placeholder.png?v=2" alt="短剧封面" title="短剧封面" data-play-poster />
{{end}}
{{if and $chapter $canWatch $chapter.VideoURL}}
<button class="play-player-center" type="button" aria-label="播放" data-play-poster-play>
<img src="/static/images/figma-play/control-center-play.svg" alt="播放" />
</button>
{{else if and $chapter (not $canWatch)}}
<div class="play-player-locked" data-play-locked-cta>
<p class="play-player-locked-text">本集为APP专享剧集</p>
<button class="play-player-locked-btn" type="button" data-play-download-app>下载APP观看完整剧集</button>
</div>
{{end}}
<div class="play-player-gradient play-player-gradient--top" aria-hidden="true"></div>
<div class="play-player-gradient play-player-gradient--bottom" aria-hidden="true"></div>
<div class="play-h5-top">
<a class="play-h5-back" href="{{if $playletID}}{{detailURL $playletSlug $playletID}}{{else}}/{{end}}" data-nav-back{{if $playletID}} data-nav-fallback="{{detailURL $playletSlug $playletID}}"{{else}} data-nav-fallback="/"{{end}} aria-label="返回">
<img src="/static/images/figma-play/nav-back.svg" alt="返回" />
</a>
<div class="play-h5-ep" data-play-h5-ep>{{if $chapter}}第{{$chapter.CurrentEpisode}}集{{else}}播放{{end}}</div>
<div class="play-h5-speed-wrap" data-play-speed-wrap>
<button class="play-h5-speed" type="button" data-play-speed aria-expanded="false" aria-haspopup="dialog" aria-label="倍速">
<img class="play-h5-speed-icon" src="/static/images/figma-play/nav-speed.svg" alt="倍速" />
<span data-play-speed-label>1.0x</span>
</button>
</div>
<a class="play-h5-feedback" href="/feedback/" aria-label="反馈">
<img src="/static/images/figma-play/nav-feedback.svg" alt="反馈" />
</a>
</div>
<div class="play-h5-side">
<button class="play-h5-side-item" type="button" data-play-comment-open>
<img src="/static/images/comment.svg" alt="评论" />
<span data-play-comment-count>{{if $chapter}}{{$chapter.CountComment}}{{else}}0{{end}}</span>
</button>
<button class="play-h5-side-item" type="button" data-detail-share data-playlet-id="{{$playletID}}">
<img src="/static/images/h5_share.svg" alt="分享" />
<span>分享</span>
</button>
</div>
<div class="play-h5-meta">
<div class="play-h5-meta-title">
<button type="button" data-play-ep-open>
<span>{{if $playlet}}{{$playlet.Title}}{{else}}短剧{{end}}</span>
<img src="/static/images/arrow_right2.svg" alt="下一集" />
</button>
</div>
{{if $playlet}}
{{if $playlet.TagNames}}
<div class="play-h5-meta-tags">
{{range namedTags $playlet.TagIDs $playlet.TagNames $playlet.TagSlugs}}
{{if .URL}}<a class="play-h5-meta-tag" href="{{.URL}}">{{.Name}}</a>{{else}}<span class="play-h5-meta-tag">{{.Name}}</span>{{end}}
{{end}}
</div>
{{end}}
<div class="play-h5-meta-intro">
<p class="play-h5-meta-text" data-play-intro>{{if $playlet.Desc}}{{$playlet.Desc}}{{else}}暂无简介{{end}}</p>
<button class="play-h5-meta-more" type="button" data-play-intro-more hidden>展开</button>
</div>
{{end}}
</div>
<div class="play-h5-next" data-play-next hidden>
<span class="play-h5-next-label">自动播放下一集</span>
<span class="play-h5-next-countdown" data-play-next-countdown>倒计时3s</span>
</div>
</div>
<div class="play-h5-bottom">
<button class="play-h5-ep-picker" type="button" data-play-ep-open>
<span>选集{{if $playlet}}{{if $playlet.TotalEpisode}}·全{{$playlet.TotalEpisode}}集{{end}}·{{updateStatusText $playlet.UpdateStatus}}{{end}}</span>
<img src="/static/images/arrow_up.svg" alt="收起" />
</button>
<button class="play-h5-comment" type="button" data-play-comment-open aria-label="评论">
<img src="/static/images/comment.svg" alt="评论" />
</button>
<button class="play-h5-clear" type="button" data-play-clear aria-label="清屏">
<img src="/static/images/full_screen.svg" alt="清屏" data-play-clear-icon />
</button>
</div>
<section class="play-episodes">
<h2 class="play-episodes-label">选集{{if and $playlet $playlet.TotalEpisode}}<span class="play-episodes-count">全{{$playlet.TotalEpisode}}集 · {{updateStatusText $playlet.UpdateStatus}}</span>{{end}}</h2>
{{with $.episodeRanges}}
<div class="play-ep-ranges" data-play-ep-ranges>
{{range $i, $r := .}}
<button class="play-ep-range{{if eq $i 0}} play-ep-range--active{{end}}" type="button" data-range-start="{{$r.Start}}" data-range-end="{{$r.End}}">{{$r.Label}}</button>
{{end}}
</div>
{{end}}
<div class="play-ep-grid" data-play-ep-grid>
{{range $.chapters}}
{{$active := and $chapter (eq .ID $chapter.ID)}}
{{if .AllowWatch}}
<a class="play-ep{{if $active}} play-ep--active{{end}}" href="{{chapterPlayURL $playletSlug $playletID .ID}}" data-ep="{{.CurrentEpisode}}" data-chapter-id="{{.ID}}" data-play-switch>
<span class="play-ep-num">{{.CurrentEpisode}}</span>
</a>
{{else}}
<a class="play-ep{{if $active}} play-ep--active{{end}}" href="javascript:;" data-ep="{{.CurrentEpisode}}" data-chapter-id="{{.ID}}" data-play-locked aria-label="第{{.CurrentEpisode}}集,下载APP观看">
<span class="play-ep-num">{{.CurrentEpisode}}</span>
<span class="play-ep-lock" aria-hidden="true">APP</span>
</a>
{{end}}
{{else}}
<div class="section-empty">暂无剧集</div>
{{end}}
</div>
</section>
{{template "contentPromo" $}}
<div class="play-info">
<div class="play-info-text">
<div class="play-info-ep" data-play-info-ep>{{if $chapter}}第 {{$chapter.CurrentEpisode}} 集{{else}}—{{end}}</div>
<h1 class="play-info-title">{{if $playlet}}{{$playlet.Title}}{{else}}短剧播放{{end}}</h1>
{{if $playlet}}
{{if $playlet.TagNames}}
<div class="play-info-tags">
{{range namedTags $playlet.TagIDs $playlet.TagNames $playlet.TagSlugs}}
{{if .URL}}<a class="play-info-tag" href="{{.URL}}">{{.Name}}</a>{{else}}<span class="play-info-tag">{{.Name}}</span>{{end}}
{{end}}
</div>
{{end}}
{{end}}
<div class="play-info-sub" data-play-info-sub>
{{if and $playlet $chapter}}{{$playlet.Title}} - 第{{printf "%02d" $chapter.CurrentEpisode}}集{{else if $playlet}}{{$playlet.Title}}{{else}}—{{end}}
</div>
{{if $playlet}}
<div class="play-info-meta">
{{if $playlet.TotalEpisode}}<span>全{{$playlet.TotalEpisode}}集</span>{{end}}
<span>{{playletDateText $playlet.OnlineAt $playlet.MediaCreatedAt $playlet.CreatedAt}} 上线</span>
</div>
<p class="play-info-desc">{{if $playlet.Desc}}{{$playlet.Desc}}{{else}}暂无简介{{end}}</p>
{{end}}
</div>
<div class="play-info-actions">
<button class="detail-action" type="button" data-detail-share data-playlet-id="{{$playletID}}">
<span class="detail-action-icon">
<img src="/static/images/share.svg" alt="分享" />
</span>
<span>分享</span>
</button>
<span class="detail-action-sep"></span>
<a class="detail-action" href="/feedback/">
<span class="detail-action-icon">
<img src="/static/images/feedback.svg" alt="反馈" />
</span>
<span>反馈</span>
</a>
</div>
<a
class="play-download-btn"
href="{{if .appConfig.AppAddr}}{{.appConfig.AppAddr}}{{else}}/download-app/{{end}}"
{{if .appConfig.AppAddr}}target="_blank" rel="sponsored nofollow noopener noreferrer"{{end}}
>下载APP</a>
</div>
{{template "contentOfficialInfo" $}}
{{template "contentAds" $}}
{{if $chapter}}
<section class="detail-comments play-comments"
data-comment-object-id="{{$chapter.ID}}"
data-comment-object-type="11"
data-comment-size="10">
<div class="detail-comments-head">
<h2 class="detail-comments-title" data-comment-title>评论</h2>
<div class="detail-comments-head-gap" aria-hidden="true"></div>
<div class="detail-comments-sort">
<button class="detail-sort-btn detail-sort-btn--active" type="button" data-comment-sort="1">热门</button>
<button class="detail-sort-btn" type="button" data-comment-sort="2">最新</button>
</div>
</div>
<div class="detail-comment-list" data-comment-list>
<div class="section-empty" data-comment-loading>评论加载中…</div>
</div>
<button class="detail-comments-more" type="button" data-comment-more hidden>加载更多</button>
</section>
{{end}}
</div>
<div class="content-column-divider" aria-hidden="true"></div>
<aside class="play-sidebar">
{{if $playlet}}{{template "contentHotSidebar" $playlet}}{{end}}
</aside>
</div>
</main>
<div class="play-h5-sheet-mask" aria-hidden="true"></div>
<div class="play-speed-sheet" data-play-speed-sheet role="dialog" aria-modal="true" aria-label="倍速">
<div class="play-speed-sheet-head">
<button class="play-speed-sheet-collapse" type="button" aria-label="收起" data-play-speed-close>
<img src="/static/images/arrow_down.svg" alt="展开选集" />
</button>
<div class="play-speed-sheet-title">倍速</div>
<div class="play-speed-sheet-spacer" aria-hidden="true"></div>
</div>
<div class="play-speed-sheet-list" data-play-speed-menu role="listbox" aria-label="选择倍速"></div>
</div>
<div class="play-ep-sheet" data-play-ep-sheet role="dialog" aria-modal="true" aria-label="选集">
<div class="play-ep-sheet-handle" aria-hidden="true"></div>
{{if $playlet}}
<div class="play-ep-sheet-drama">
<div class="play-ep-sheet-drama-main">
<img class="play-ep-sheet-cover lazy" src="/static/images/placeholder.png?v=2" data-src="{{$playlet.Cover}}" alt="{{$playlet.Title}}" title="{{$playlet.Title}}" />
<div class="play-ep-sheet-drama-info">
<div class="play-ep-sheet-drama-title">
<span>{{$playlet.Title}}</span>
<button class="play-ep-sheet-drama-close" type="button" aria-label="关闭" data-play-ep-close>
<img src="/static/images/arrow_right2.svg" alt="下一集" />
</button>
</div>
<div class="play-ep-sheet-drama-status">{{updateStatusText $playlet.UpdateStatus}}{{if $playlet.TotalEpisode}} 共{{$playlet.TotalEpisode}}集{{end}}</div>
</div>
</div>
</div>
{{end}}
<div class="play-ep-sheet-tabs">
{{range $i, $r := $.episodeRanges}}
<button class="play-ep-sheet-tab{{if eq $i 0}} play-ep-sheet-tab--active{{end}}" type="button" data-ep-tab="eps" data-range-start="{{$r.Start}}" data-range-end="{{$r.End}}">{{$r.Label}}</button>
{{end}}
{{if and $playlet $playlet.RelatedRecommendData}}
<button class="play-ep-sheet-tab" type="button" data-ep-tab="more">更多好剧</button>
{{end}}
</div>
<div class="play-ep-sheet-panel" data-ep-panel="eps">
<div class="play-ep-sheet-grid">
{{range $.chapters}}
{{$active := and $chapter (eq .ID $chapter.ID)}}
{{if .AllowWatch}}
<a class="play-ep-sheet-item{{if $active}} play-ep-sheet-item--active{{end}}" href="{{chapterPlayURL $playletSlug $playletID .ID}}" data-ep="{{.CurrentEpisode}}" data-chapter-id="{{.ID}}" data-play-switch>
<span class="play-ep-sheet-num">{{.CurrentEpisode}}</span>
</a>
{{else}}
<a class="play-ep-sheet-item{{if $active}} play-ep-sheet-item--active{{end}}" href="javascript:;" data-ep="{{.CurrentEpisode}}" data-chapter-id="{{.ID}}" data-play-locked aria-label="第{{.CurrentEpisode}}集,下载APP观看">
<span class="play-ep-sheet-num">{{.CurrentEpisode}}</span>
<span class="play-ep-sheet-lock" aria-hidden="true">APP</span>
</a>
{{end}}
{{else}}
<div class="section-empty">暂无剧集</div>
{{end}}
</div>
</div>
{{if and $playlet $playlet.RelatedRecommendData}}
<div class="play-ep-sheet-panel play-ep-sheet-panel--more is-hidden" data-ep-panel="more">
<div class="play-ep-more-grid">
{{range $playlet.RelatedRecommendData}}
<a class="play-ep-more-card" href="{{detailURL .Slug .ID}}">
<div class="play-ep-more-cover">
<img class="lazy" src="/static/images/placeholder.png?v=2" data-src="{{coverURL .Cover .Banner}}" alt="{{.Title}}" title="{{.Title}}" />
<div class="play-ep-more-heat">
<img src="/static/images/playing.svg" alt="正在播放" />
<span>{{formatHeat .HeatValue}}</span>
</div>
</div>
<div class="play-ep-more-title">{{.Title}}</div>
{{$tag := themeTagText .ThemeNames .TagNames}}{{$ep := episodeLabel .TotalEpisode}}
<div class="play-ep-more-meta">{{if and $tag $ep}}{{$tag}} · {{$ep}}{{else}}{{or $tag $ep}}{{end}}</div>
</a>
{{end}}
</div>
</div>
{{end}}
</div>
{{if $chapter}}
<div class="play-comment-sheet" data-play-comment-sheet role="dialog" aria-modal="true" aria-label="评论">
<div class="play-comment-sheet-panel">
<div class="play-comment-sheet-head">
<button class="play-comment-sheet-collapse" type="button" aria-label="收起" data-play-comment-close>
<img src="/static/images/arrow_down.svg" alt="展开" />
</button>
<div class="play-comment-sheet-title" data-play-comment-title>评论</div>
<div class="play-comment-sort" role="tablist" aria-label="评论排序">
<button class="play-comment-sort-btn play-comment-sort-btn--active" type="button" data-comment-sort="2">最新</button>
<button class="play-comment-sort-btn" type="button" data-comment-sort="1">最热</button>
</div>
</div>
<section class="detail-comments play-comment-sheet-body" aria-label="评论列表"
data-comment-object-id="{{$chapter.ID}}"
data-comment-object-type="11"
data-comment-size="10"
data-comment-sort-default="2">
<div class="play-comment-sheet-list detail-comment-list" data-comment-list>
<div class="section-empty play-comment-empty" data-comment-loading>评论加载中…</div>
</div>
<button class="detail-comments-more play-comment-sheet-more" type="button" data-comment-more hidden>加载更多</button>
</section>
</div>
</div>
{{end}}
{{else}}
<main class="page-shell play-page">
<h1 class="seo-visually-hidden">短剧播放 - 黄果短剧</h1>
{{template "empty" .}}
</main>
{{end}}
{{template "footer" .}}
<script src="/static/js/pages/detail.js?v=15"></script>
<script src="/static/js/pages/play.js?v=15"></script>
</body>
</html>