101 lines
3.4 KiB
HTML
101 lines
3.4 KiB
HTML
<article class="{$TpStyle.dom_prefix}-p2-shell">
|
||
|
||
{// 全宽播放器 }
|
||
<section class="{$TpStyle.dom_prefix}-p2-screen">
|
||
<div id="dplayer" class="{$TpStyle.dom_prefix}-p2-dp"></div>
|
||
</section>
|
||
|
||
{// 基本信息 }
|
||
<section class="{$TpStyle.dom_prefix}-p2-info">
|
||
<h1>{$arrVideo.v_name}</h1>
|
||
<p class="{$TpStyle.dom_prefix}-p2-meta">
|
||
<span>{$arrVideo.v_category}</span>
|
||
<span>{$arrVideo.v_area}</span>
|
||
<span>{$arrVideo.v_year}</span>
|
||
</p>
|
||
<p class="{$TpStyle.dom_prefix}-p2-actors">
|
||
主演：{$arrVideo.v_actor}
|
||
</p>
|
||
</section>
|
||
|
||
{// 播放线路（深色 chip） }
|
||
<nav class="{$TpStyle.dom_prefix}-p2-lines">
|
||
<?php $lineIndex=0; ?>
|
||
{foreach $arrVideo.v_play_url as $strPlayGroupName=>$arrPlayUrlType}
|
||
<?php $lineIndex++; ?>
|
||
<button type="button"
|
||
class="{$TpStyle.dom_prefix}-p2-linechip {eq name='$lineIndex' value='1'}active{/eq}"
|
||
onclick="p2SwitchLine('{$strPlayGroupName}', this)">
|
||
{$strPlayGroupName}
|
||
</button>
|
||
{/foreach}
|
||
</nav>
|
||
|
||
{// 集数列表：深色块 }
|
||
<section class="{$TpStyle.dom_prefix}-p2-epswrap">
|
||
|
||
<?php $lineIndex=0; ?>
|
||
{foreach $arrVideo.v_play_url as $strPlayGroupName=>$arrPlayUrlType}
|
||
<?php $lineIndex++; ?>
|
||
<div class="{$TpStyle.dom_prefix}-p2-epbox {eq name='$lineIndex' value='1'}active{/eq}"
|
||
id="p2-ep-{$strPlayGroupName}">
|
||
<?php $epIndex=0; ?>
|
||
{volist name='$arrPlayUrlType' id='arrPlayUrl'}
|
||
<?php $epIndex++; ?>
|
||
<a href='{site:vpurl
|
||
v_id="$arrVideo.v_id"
|
||
v_py="$arrVideo.v_name_en"
|
||
play_type="$strPlayGroupName"
|
||
play_index="$epIndex"
|
||
/}'
|
||
class="{$TpStyle.dom_prefix}-p2-epbtn {if $epIndex == $Request.route.intPlayIndex}active{/if}"
|
||
m3u8="{$arrPlayUrl.url}">
|
||
{$arrPlayUrl.name}
|
||
</a>
|
||
{/volist}
|
||
</div>
|
||
{/foreach}
|
||
|
||
</section>
|
||
|
||
{// 剧情简介 }
|
||
<section class="{$TpStyle.dom_prefix}-p2-desc">
|
||
<h2>剧情简介</h2>
|
||
<p>{$arrVideo.v_description|raw}</p>
|
||
</section>
|
||
|
||
{// 猜你喜欢 }
|
||
<section class="{$TpStyle.dom_prefix}-p2-rel">
|
||
<h3>猜你喜欢</h3>
|
||
|
||
<div class="{$TpStyle.dom_prefix}-p2-relgrid">
|
||
{video:list count="10"
|
||
v_category_en="$arrVideo.v_category_en"
|
||
sort_type="news"
|
||
d_key="rk" d_val="Video" cache_life="3600"}
|
||
|
||
<a href="/detail/{$Video.v_id}.html" class="{$TpStyle.dom_prefix}-p2-card">
|
||
<img loading="lazy"
|
||
src="{site:cfg code='PUBLIC_COVER_DOMAIN' encode='false'/}{$Video.v_pic}">
|
||
<p>{$Video.v_name}</p>
|
||
</a>
|
||
|
||
{/video:list}
|
||
</div>
|
||
</section>
|
||
|
||
</article>
|
||
|
||
<script>
|
||
function p2SwitchLine(name, btn){
|
||
document.querySelectorAll('.{$TpStyle.dom_prefix}-p2-epbox')
|
||
.forEach(function(el){ el.classList.remove('active'); });
|
||
var box = document.getElementById('p2-ep-'+name);
|
||
if(box) box.classList.add('active');
|
||
|
||
document.querySelectorAll('.{$TpStyle.dom_prefix}-p2-linechip')
|
||
.forEach(function(el){ el.classList.remove('active'); });
|
||
btn.classList.add('active');
|
||
}
|
||
</script>
|