dever-product
/
wonderful


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292
							<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
  <title><{$info['name']}> - <{$config['name']}></title>
<link href="css/global.css?v=d4ecd76d" rel="stylesheet"><link href="css/article.css?v=d4ecd76d" rel="stylesheet">
<style>
.emoji {
  width:16px;
}
</style>
</head>

<body>
  <header style="display:none;">
    <a class="back" style="display:none;"></a>
    <{$config['name']}>
  </header>
  <div class="main">
    <h1 class="h1"><{$info['name']}></h1>
    <div class='article-infos'>
      <div class='author'>作者：<{$info['author']['name']}></div>
      <{if(in_array(1, $info['function'])):}>
      <div class='div-nums'>
        <span class='ico-view'></span> <{$info['num_view']}></div>
        <{endif}>
    </div>
    <div class="no-expanded">
      <div class="rich-wrapper">
        <{loop($content):}>
        <{if($v['type'] == 1):}>
        <{if(isset($v['content'])):}>
        <{str_replace(array('width', 'height'), array('widths', 'heights'), $v['content'])}>
        <{endif}>

        <{elseif($v['type'] == 2):}>
          <!--视频-->
        <div class="p-img">
          <div class="poster" id="video_<{$k}>" data-href="<{$v['content']['video']}>">
            <img src="<{$v['content']['pic_cover_169']}>"
              alt="" class="media-cover">
            <div class="ico-video-play"></div>
          </div>
          <div class="video-cont">
            <video class="video-js" id="video_<{$k}>-vdom"></video>
          </div>
          <!--视频/图片标题-->
          <div class="tit"><{$v['content']['name']}></div>
          <!--视频/图片副标题-->
          <div class="tit-mini" style="display:none;">已有 <{$v['content']['num_view']}> 人观看了视频</div>
        </div>

        <{elseif($v['type'] == 3):}>
        <!--直播-->
        <div class="p-img">
          <div class="poster" id="live_<{$k}>" data-href="<{$v['content']['url']}>">
            <img src="<{$v['content']['pic_cover_169']}>"
              alt="" class="media-cover">
            <{if($v['content']['status'] != 1):}>
        <div class="ico-video-play"></div>
        <{endif}>
            <span class="tip">开播时间：<{$v['content']['sdate_time']}></span>
          </div>
          <div class="video-cont">
            <video class="video-js" id="live_<{$k}>-vdom"></video>
          </div>
          <!--视频/图片标题-->
          <div class="tit"><{$v['content']['name']}></div>
        </div>
        <!--直播-->
        <{if($v['content']['status'] == 2):}>
        <div class="live-notice" style="display:none;">
          <div class="online-user"><{$v['content']['num_user']}>人在线</div>
        </div>
        <{elseif($v['content']['status'] == 3):}>
        <div class="live-notice" style="display:none;">
          <div class="watch-user"><{$v['content']['num_view']}> 人观看</div>
        </div>
        <{elseif($v['content']['status'] == 1):}>
        <div class="live-notice" style="display:none;">
              <div class="notice-time">开播时间 <{$v['content']['sdate_time']}></div>
              <a class="app-open" href="<{$app}>">打开JSTYLE精美APP，开启直播提醒</a>
              <!--
              <{if($v['content']['user_act']['note'] == 1):}>
              <a id="live_note_<{$v['content']['id']}>" href="jstyle://live_note?id=<{$k}>&live_id=<{$v['content']['id']}>&live_status=<{$v['content']['status']}>&note=1" class="btn-notice">已设置提醒</a>
              <{else:}>
              <a id="live_note_<{$v['content']['id']}>" href="jstyle://live_note?id=<{$k}>&live_id=<{$v['content']['id']}>&live_status=<{$v['content']['status']}>&note=2" class="btn-notice">提醒我</a>
              <{endif}>
              -->
        </div>
        <{endif}>
        

        <{elseif($v['type'] == 5 && isset($v['cover'])):}>
        <!--音频-->
        <div class="p-voice" id="audio_<{$k}>" data-href="<{$v['content']}>">
          <img src="<{$v['cover']}>"
            alt="" class="mavatar">
          <div class="sound"></div>
        </div>

        <{elseif($v['type'] == 6 && isset($v['cover'])):}>
        <!--视频-->
        <div class="p-img">
          <div class="poster" id="video_<{$k}>" data-href="<{$v['content']}>">
            <img src="<{$v['cover']}>"
              alt="" class="media-cover">
            <div class="ico-video-play"></div>
          </div>
          <div class="video-cont">
            <video class="video-js" id="video_<{$k}>-vdom"></video>
          </div>
          <!--视频/图片标题-->
          <div class="tit"><{$v['name']}></div>
        </div>

        <{elseif($v['type'] == 7):}>
        <!--图片-->
        <div class="p-img">
            <a id="link_<{$k}>" href="<{if (isset($v['link']) && $v['link']):}><{$v['link']}><{else:}>javascript:;<{endif}>">

                <img class="img" src="<{$v['pic_cover']}>" alt="">

            </a>
        </div>

        <{elseif($v['type'] == 8):}>
        <!--动图-->
        <div class="p-img">
            <a id="link_<{$k}>" href="<{if (isset($v['link']) && $v['link']):}><{$v['link']}><{else:}>javascript:;<{endif}>">

                <img class="img" src="<{$v['pic']}>" alt="">

            </a>
        </div>

        <{endif}>

        <{endloop}>


      </div>
      <a class="btn-expand">&nbsp;</a>
    </div>
    <a class="app-open" href="<{$app}>">打开JSTYLE精美APP，查看更多内容</a>
    <{if(isset($comment) && $comment && in_array(2, $info['function'])):}>
    <div class="comments">
      <div class='title'><span>热门评论</span></div>
      <div class="comments-list">
        <{loop($comment):}>
        <div class='comment'>
          <div class='user'>
            <image src="<{isset($v1['avatar']) ? $v1['avatar'] : ""}>"></image>
          </div>
          <div class='info'>
            <div class='username'>
              <span><{$v1['username']}></span>
            </div>
            <div class='date'>
              <span><{$v1['time']}></span>
            </div>
            <div class='p'>
              <span><{if(isset($v1['content'])):}><{$v1['content']}><{endif}></span>
            </div>
          </div>
        </div>
        <{endloop}>
      </div>
    </div>
    <a class="app-open" href="<{$app}>">打开JSTYLE精美APP，查看全部评论</a>
    <{endif}>
    

    <{if(isset($relation) && $relation):}>
    <div class="recommends">
      <div class='title'><span>相关推荐</span></div>
      <div class="recommends-list">
        <{loop($relation):}>
        <div class='article clearfix' style="cursor: pointer;" onclick="getUrl('<{Dever::url('view.get?type=' . $type . '&id=' . $v2['id'], 'h5')}>')">
          <div class='cover'>
            <img class='default' src="<{$v2['pic_cover_169']}>" />
            <div class='ico-play'></div>
          </div>
          <div class='tit'><span>
              <{$v2['name']}>
            </span></div>
          <div class='date'>
            <!-- <span class='type'>{{item.author_name}}</span> -->
            <span class='d'><{$v2['cate_name']}> <{$v2['pdate']}></span>
          </div>
        </div>
        <{endloop}>
      </div>
    </div>
    <{endif}>
  </div>
  <dl class="fixed-app-open">
    <dt>
      <img src="images/logo.png" alt="JSTYLE精美">
      <div>
        <h3>JSTYLE精美</h3>
        <span>我的时尚指南</span>
      </div>
    </dt>
    <dd>
      <a href="<{$app}>">打开APP</a>
    </dd>
  </dl>
<script type="text/javascript" src="js/global.js?v=d4ecd76d"></script><script type="text/javascript" src="js/article.js?v=d4ecd76d"></script></body>

<{Dever::render('share', $this->data)}>


<script>

  function getUrl(url)
  {
    location.href= url;
  }
  var playerList = {};

  function stopPlayers(id) {
    for (var key in playerList) {
      if (key !== id) {
        playerList[key].pause()
        $('#' + key + '-vdom').parent('.video-cont').hide();
        $('#' + key).show();
      }
    }
  }

  $('.ico-video-play').click(function () {
    var poster = $(this).closest('.poster');
    var id = poster.hide().attr('id');
    $('#' + id + '-vdom').parent('.video-cont').show();
    var player = $('#' + id + '-vdom')[0];
    player.src = poster.data('href');
    player.load();
    player.play();
    player.addEventListener('play', function () {
        stopPlayers(id)
    },false);
    player.addEventListener('pause', function () {
      $('#' + id + '-vdom').parent('.video-cont').hide();
      $('#' + id).show();
    },false);
    player.addEventListener('ended', function () {
      $('#' + id + '-vdom').parent('.video-cont').hide();
      $('#' + id).show();
      },false);
    playerList[id] = player;
  })
  
  $('.btn-expand').click(function () {
    $('.no-expanded').addClass('expanded')
  })

  $('.p-voice').each(function(){
      var url = $(this).data('href');
      var id = $(this).attr('id');
      var audio = new Audio;
      audio.src = url;
      //audio.play();
      audio.addEventListener('play', function () {
        stopPlayers(id);
        $('#'+ id).find('.sound').addClass('playing');
      },false);
      audio.addEventListener('pause', function () {
        $('#'+ id).find('.sound').removeClass('playing');
      },false);
      audio.addEventListener('ended', function () {
        $('#'+ id).find('.sound').removeClass('playing');
      },false);
      playerList[id] = audio;
    })

    $('.p-voice').click(function () {
      var id = $(this).attr('id');
      if(playerList[id].paused){
        playerList[id].play();
      }else{
        playerList[id].pause();
      }
    })
</script>

<script type="text/javascript" src="script/lib/jquery/jquery.min.js"></script>
<script type="text/javascript" src="js/emoji.js?v=d4ecd76d"></script>

</html>