vhall-mini-sdk 0.4.0 → 0.4.3

package/lib/components/player/player.wxml

@@ -8,30 +8,32 @@
 </wxs>
 <view class='vhall-layout-root' style='{{_style}}'>
   <player-main catchtap="onToggleControls" wx:if="{{webinarStatus!=3}}" id='{{id}}' class='vhall-player-root' src='{{videoSrc}}' type='{{type}}' autoplay='{{isWarmVideo ? false : autoplay}}' objectFit='{{objectFit}}' muted='{{mutedFlag}}' mode='{{liveDelayMode}}' pictureInPictureMode='{{pictureInPictureMode}}' poster='{{type=="vod" ? "" : posterUrl}}' controls='{{controls}}' show-progress="{{isWarmVideo ? false : showProgress}}" show-bottom-progress="{{isWarmVideo ? false : showBottomProgress}}" show-center-play-btn="{{!isWarmVideo}}" loop="{{loop}}" initialSeekTime='{{initialSeekTime}}' bindfullscreenchange='onfullscreenchange' bindpictureinpicturechange='onpictureinpicturechange' bindtimeupdate='ontimeupdate' bindplay='onplay' bindpause='onpause' bindended='onended' bindloadedmetadata='onloadedmetadata' binderror='onerror' bindwaiting='onwaiting' bindloadStart='onloadStart' bindreconnecting='onreconnecting'>
-    <block wx:if="{{type=='live'}}">
-      <!-- 纯音频播放蒙层图片 -->
-      <image wx:if='{{showAudioCover}}' class='vhall-player-audio-cover' mode='scaleToFill' src='https://cnstatic01.e.vhall.com/common-static/saas-watch/static/img/video.110b96d1.gif' />
-      <!-- 封面组件 -->
-      <!-- 仅直播使用，点播使用video组件的poster属性 -->
-      <vhall-player-poster wx:if="{{type=='live' && showPoster && tools.canShow(ignores, 'vhall-player-poster')}}" url='{{posterOption.url}}' />
-      <!-- 水印组件 -->
-      <vhall-player-watermark wx:if="{{ showWatermark && tools.canShow(ignores, 'vhall-player-watermark') }}" option="{{watermarkOption}}" />
-      <!-- 跑马灯组件 -->
-      <vhall-player-marquee wx:if="{{ showMarquee && tools.canShow(ignores, 'vhall-player-marquee') }}" option="{{marqueeOption}}" />
-      <!-- 弹幕组件 -->
-      <!-- <vhall-player-danmaku
-        wx:if='{{showDanmaku}}'
-      /> -->
-      <barrage wx:if='{{showBarrage}}' class="barrage" rendering-mode="dom" z-index="3" />
-      <!-- 控制栏组件 -->
-      <vhall-player-controls hiddenFlag="{{controlsHiddenFlag}}" wx:if="{{type=='live' && controls && tools.canShow(ignores, 'vhall-player-controls')}}" verticalMode='{{verticalMode}}' playStatus='{{playStatus}}' paused='{{pausedFlag}}' muted='{{mutedFlag}}' fullscreen='{{fullscreenFlag}}' qualityAlias='{{qualityAlias}}' qualitys='{{qualitys}}' currentQuality='{{currentQuality}}' bindcontrolsPlayPause='handleControlsPlayPause' bindcontrolsReplay='handleControlsReplay' bindcontrolsMute='handleControlsMute' bindcontrolsFullScreen='handleControlsFullScreen' bindcontrolsSetQuality='handleControlsSetQuality' />
-      <!-- 错误提示组件 -->
-      <vhall-player-error wx:if="{{showError && tools.canShow(ignores, 'vhall-player-error')}}" error='{{error}}' binderrorandretry='handleErrorAndRetry' />
-      <!-- loading组件 -->
-      <vhall-player-loading wx:elif="{{type=='live' && showLoading && tools.canShow(ignores, 'vhall-player-loading')}}" />
-      <!-- 直播：在线人数和热度 -->
-      <online-hot wx:if="{{!controlsHiddenFlag}}" fullscreen="{{fullscreenFlag}}" showPerson="{{showPerson}}" personValue="{{personValue}}" showHot="{{showHot}}" hotValue="{{hotValue}}"></online-hot>
-    </block>
+    <view wx:if="{{type=='live'}}" class="cover-view" catchtap="onToggleControls">
+      <block>
+        <!-- 纯音频播放蒙层图片 -->
+        <image wx:if='{{showAudioCover}}' class='vhall-player-audio-cover' mode='scaleToFill' src='https://cnstatic01.e.vhall.com/common-static/saas-watch/static/img/video.110b96d1.gif' />
+        <!-- 封面组件 -->
+        <!-- 仅直播使用，点播使用video组件的poster属性 -->
+        <vhall-player-poster wx:if="{{type=='live' && showPoster && tools.canShow(ignores, 'vhall-player-poster')}}" url='{{posterOption.url}}' />
+        <!-- 水印组件 -->
+        <vhall-player-watermark wx:if="{{ showWatermark && tools.canShow(ignores, 'vhall-player-watermark') }}" option="{{watermarkOption}}" />
+        <!-- 跑马灯组件 -->
+        <vhall-player-marquee wx:if="{{ showMarquee && tools.canShow(ignores, 'vhall-player-marquee') }}" option="{{marqueeOption}}" />
+        <!-- 弹幕组件 -->
+        <!-- <vhall-player-danmaku
+          wx:if='{{showDanmaku}}'
+        /> -->
+        <barrage wx:if='{{showBarrage}}' class="barrage" rendering-mode="dom" z-index="3" />
+        <!-- 控制栏组件 -->
+        <vhall-player-controls hiddenFlag="{{controlsHiddenFlag}}" wx:if="{{type=='live' && controls && tools.canShow(ignores, 'vhall-player-controls')}}" verticalMode='{{verticalMode}}' playStatus='{{playStatus}}' paused='{{pausedFlag}}' muted='{{mutedFlag}}' fullscreen='{{fullscreenFlag}}' qualityAlias='{{qualityAlias}}' qualitys='{{qualitys}}' currentQuality='{{currentQuality}}' bindcontrolsPlayPause='handleControlsPlayPause' bindcontrolsReplay='handleControlsReplay' bindcontrolsMute='handleControlsMute' bindcontrolsFullScreen='handleControlsFullScreen' bindcontrolsSetQuality='handleControlsSetQuality' />
+        <!-- 错误提示组件 -->
+        <vhall-player-error wx:if="{{showError && tools.canShow(ignores, 'vhall-player-error')}}" error='{{error}}' binderrorandretry='handleErrorAndRetry' />
+        <!-- loading组件 -->
+        <vhall-player-loading wx:elif="{{type=='live' && showLoading && tools.canShow(ignores, 'vhall-player-loading')}}" />
+        <!-- 直播：在线人数和热度 -->
+        <online-hot wx:if="{{!controlsHiddenFlag}}" fullscreen="{{fullscreenFlag}}" showPerson="{{showPerson}}" personValue="{{personValue}}" showHot="{{showHot}}" hotValue="{{hotValue}}"></online-hot>
+      </block>
+    </view>
     <block wx:else>
       <!-- 预告||点播||回放：自定义封面（铺满），不使用 video 原生 poster -->
       <vhall-player-poster wx:if="{{showPoster && tools.canShow(ignores, 'vhall-player-poster')}}" url='{{posterUrl}}' />

package/lib/components/player/player.wxss

@@ -1 +1 @@
-.vhall-layout-root{height:100%;transition:width .3s ease-in-out,height .3s ease-in-out;width:100%}.webinar_not_live{align-items:center;background-color:rgba(0,0,0,.9);bottom:0;color:#fff;display:flex;font-size:14px;height:100%;justify-content:center;left:0;position:relative;right:0;top:0}.webinar_not_live .cover_img{height:100%;position:absolute;width:100%;z-index:1}.webinar_not_live .webinar_status{align-items:center;background-color:rgba(0,0,0,.6);bottom:0;display:flex;flex-direction:column;justify-content:center;left:0;position:absolute;right:0;text-align:center;top:0;z-index:2}.webinar_not_live .webinar_status .status-img{display:block;margin-left:-10px;width:140rpx}.webinar_not_live .webinar_status .status-text{display:block;font-size:1rem;padding-top:10px}.vhall-player-audio-cover{height:100%;left:0;position:absolute;top:0;width:100%}.vod-poster-play{align-items:center;background:rgba(0,0,0,.45);border-radius:50%;display:flex;height:140rpx;justify-content:center;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:140rpx;z-index:3}.vod-poster-play .play-triangle{border-color:transparent transparent transparent #fff;border-style:solid;border-width:30rpx 0 30rpx 48rpx;height:0;margin-left:12rpx;width:0}
+.vhall-layout-root{transition:width .3s ease-in-out,height .3s ease-in-out}.cover-view,.vhall-layout-root{height:100%;width:100%}.webinar_not_live{align-items:center;background-color:rgba(0,0,0,.9);bottom:0;color:#fff;display:flex;font-size:14px;height:100%;justify-content:center;left:0;position:relative;right:0;top:0}.webinar_not_live .cover_img{height:100%;position:absolute;width:100%;z-index:1}.webinar_not_live .webinar_status{align-items:center;background-color:rgba(0,0,0,.6);bottom:0;display:flex;flex-direction:column;justify-content:center;left:0;position:absolute;right:0;text-align:center;top:0;z-index:2}.webinar_not_live .webinar_status .status-img{display:block;margin-left:-10px;width:140rpx}.webinar_not_live .webinar_status .status-text{display:block;font-size:1rem;padding-top:10px}.vhall-player-audio-cover{height:100%;left:0;position:absolute;top:0;width:100%}.vod-poster-play{align-items:center;background:rgba(0,0,0,.45);border-radius:50%;display:flex;height:140rpx;justify-content:center;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:140rpx;z-index:3}.vod-poster-play .play-triangle{border-color:transparent transparent transparent #fff;border-style:solid;border-width:30rpx 0 30rpx 48rpx;height:0;margin-left:12rpx;width:0}