xiuga

pages/binge/binge.js

@@ -91,7 +91,7 @@ Page({
     if (isEdit) {
       this.onDelItem(data);
     } else {
-			if (systemInfo.platform == 'android') {
+      if (systemInfo.platform == 'android' || systemInfo.platform == 'Android') {
         my.navigateTo({
           url: `/pages/videoAndroid/videoAndroid?sid=${data.id}`,
         });

pages/history/history.js

@@ -29,7 +29,7 @@ Page({
   toGetVideo(event) {
     const data = event.target.dataset.item;
     const systemInfo = this.data.systemInfo;
-		if (systemInfo.platform == 'android') {
+    if (systemInfo.platform == 'android' || systemInfo.platform == 'Android') {
       my.navigateTo({
         url: `/pages/videoAndroid/videoAndroid?sid=${data.sid}&id=${data.chapterid || ""}`,
       });

pages/index/index.js

@@ -74,7 +74,7 @@ Page({
 
   navgetHistory() {
     const systemInfo = this.data.systemInfo;
-    if (systemInfo.platform == 'android') {
+    if (systemInfo.platform == 'android' || systemInfo.platform == 'Android') {
       my.navigateTo({
         url: `/pages/videoAndroid/videoAndroid?sid=${this.history.sid}&id=${this.history.id || ""
           }`,
@@ -98,7 +98,7 @@ Page({
     const data = event.target.dataset.item;
 
     const systemInfo = this.data.systemInfo;
-    if (systemInfo.platform == 'android') {
+    if (systemInfo.platform == 'android' || systemInfo.platform == 'Android') {
       my.navigateTo({
         url: `/pages/videoAndroid/videoAndroid?sid=${data.id}`,
       });

pages/videoAndroid/videoAndroid.acss

@@ -47,17 +47,62 @@ page {
   position: relative;
 }
 
-.swiper_video_box{
+._video_controls_warp {
   position: absolute;
-  top: 0;
   left: 0;
-  right: 0;
   bottom: 0;
+  display: flex;
+  align-items: center;
+  width: 100%;
+  height: 100rpx;
+  padding: 0 40rpx;
+  /* background-color: rgba(0, 0, 0, 0.3); */
+  background: linear-gradient(to top, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0));
+  z-index: 3;
+}
+
+._video_controls_currentTime {
+  color: #fff;
+  font-size: 36rpx;
+}
+
+._video_controls_videoDuration {
+  color: #fff;
+  font-size: 36rpx;
+}
+
+._video_controls_slider {
+  flex: 1;
+  flex-shrink: 0;
+  padding: 0 20rpx;
+  margin-top: -8rpx;
+}
+
+.video_status_warp {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 120rpx;
+  height: 120rpx;
+  border-radius: 50%;
+  border: 2rpx solid #fff;
+  background-color: rgba(0, 0, 0, 0.3);
+  transform: translate(-50%,-50%);
+  z-index: 3;
+}
+
+.video_status_icon {
+  width: 40rpx;
+  height: 40rpx;
+}
+
+.v_s_img {
+  display: block;
   width: 100%;
   height: 100%;
-  z-index: 1;
-  /* pointer-events:none; */
-  will-change: transform;
 }
 
 .swiper_video_box_android {

pages/videoAndroid/videoAndroid.axml

@@ -5,18 +5,53 @@
       <block a:for={{batchAllList}}>
         <swiper-item key="swiper_item_{{index}}" class="swiper_item">
           <view class="swiper_item_warp">
-            <!-- 播放 -->
+            <!-- 播放 catchTouchEnd="videoPlayTouchEnd"-->
-            <view class="_video_pay_warp">
+            <view class="_video_pay_warp" catchTap="videoPlayControl"  >
               <!--<view class="swiper_item" style="background:pink"></view> -->
               <!--<block a:if={{videoInfoObj.chackpay == 1  && swiperOrder == item.order}}> -->
               <block a:if={{videoInfoObj.chackpay == 1}}>
                 <block a:if={{videoInfoObj.order == item.order}}>
-                  <video class="swiper_video_box" src={{videoInfoObj.video_url}} autoplay={{(videoInfoObj.chackpay == 1  && videoInfoObj.order == item.order && pageHideFlag) ? true: false }} 
+                  <!-- poster={{posterCover}} -->
-                    poster={{posterCover}} onError="videoErrorFn" objectFit="contain" show-mute-btn={{false}} onEnded="videoEndedFn" 
+                  <video class="swiper_video_box_android" id="myVideo_{{item.order}}" src={{videoInfoObj.video_url}} autoplay={{(videoInfoObj.chackpay == 1  && videoInfoObj.order == item.order && pageHideFlag) ? true: false }} 
-                    ></video>
+                     onError="videoErrorFn" objectFit="contain" show-mute-btn={{false}} onEnded="videoEndedFn" 
-                    <!-- onTimeUpdate="onTimeUpdate" controls={{false}} -->
+                    onTimeUpdate="onTimeUpdate" data-item={{item}} controls={{false}} />
+                  
+                  <block a:if={{videoStatus == 2 || videoStatus == 3}}>
+                    
+                    <block a:if={{videoStatus == 2}}>
+                      <view class="video_status_warp" catchTap="videoPlayPause" data-item={{item}}>
+                        <view class="video_status_icon">
+                          <image mode="scaleToFill" class="v_s_img" src="{{imageBasUrl}}/iamge/android_suspend_icon.png" />
+                        </view>
+                      </view>
                     </block>
                     
+                    <block a:if={{videoStatus == 3}}>
+                      <view class="video_status_warp" catchTap="videoPlayPlay" data-item={{item}}>
+                        <view class="video_status_icon">
+                          <image mode="scaleToFill" class="v_s_img" src="{{imageBasUrl}}/iamge/android_play_icon.png" />
+                        </view>
+                      </view>
+                    </block>
+                    <!-- catchTouchStart="onTouchStartControls" -->
+                    <view class="_video_controls_warp"  catchTouchStart="onTouchStartControls" catchTouchEnd="onTouchEndControls">
+                      <view class="_video_controls_currentTime">
+                        <text>{{currentTime}}</text>
+                      </view>
+                      <view class="_video_controls_slider">
+                        <slider value={{sliderValue}} min="0" max={{sliderMax}} handle-size={{16}} onChange="videoSliderChange" data-item={{item}} />
+                      </view>
+                      <view class="_video_controls_videoDuration">
+                        <text>{{videoDuration}}</text>
+                      </view>
+                    </view>
+                    
+                  </block>
+                  
+                </block>
+                
+                
+                
                 <block a:else>
                   <view class="_video_pay_bg_cover">
                     <image mode="scaleToFill" src={{posterCover}} class="_video_pay_bg_cover_img" />

pages/videoAndroid/videoAndroid.js

@@ -26,7 +26,13 @@ Page({
     batchAllOrder: 0,
     batchAllList: [],
     isThrottle: null,
-    pageHideFlag: true
+    pageHideFlag: true,
+    videoStatus: 1,
+    videoControlTimer: null,
+    videoDuration: '0.00',
+    currentTime: '0.00',
+    sliderMax: 100,
+    sliderValue: 0
   },
   //  获取其它信息
   isOtherFn() {
@@ -141,7 +147,6 @@ Page({
       }
       const isBatchlist = await httpRequest(paramenter);
       const selectOrderInfo = this.handelOrder(isBatchlist);
-      console.log(selectOrderInfo, "selectOrderInfo")
 
       this.setData({
         swiperOrder: videoInfoObj.order,
@@ -225,6 +230,8 @@ Page({
     const sid = this.data.sid;
     //   const swiperList = this.data.swiperList;
     const id = videoInfoObj.nextid;
+    const videoControlTimer = this.data.videoControlTimer;
+    clearTimeout(videoControlTimer);
     //  const current = videoInfoObj.order;
     const paramVideo = {
       path: '/videoread',
@@ -246,13 +253,112 @@ Page({
         changeCuurent: resData.order - 1,
         videoInfoObj: resData,
         orderList: ols,
+        videoStatus: 1
         // swiperOrder: resData.order
       })
     })
   },
 
-  onTimeUpdate(ed) {
+  onTimeUpdate(ev) {
-    console.log(ed, "=========")
+    // console.log(ev, "=========")
+    const videoDuration = ev.detail.videoDuration;
+    const currentTime = ev.detail.currentTime;
+    const videoDuration_m = parseInt(videoDuration / 60 % 60);
+    const videoDuration_s = parseInt(videoDuration % 60);
+    const currentTime_m = parseInt(currentTime / 60 % 60);
+    const currentTime_s = parseInt(currentTime % 60);
+    const vtime_m = videoDuration_m < 10 ? `0${videoDuration_m}` : videoDuration_m;
+    const vtime_s = videoDuration_s < 10 ? `0${videoDuration_s}` : videoDuration_s;
+    const ctime_m = currentTime_m < 10 ? `0${currentTime_m}` : currentTime_m;
+    const ctime_s = currentTime_s < 10 ? `0${currentTime_s}` : currentTime_s;
+    if (videoDuration != undefined && currentTime != undefined) {
+      this.setData({
+        videoDuration: `${vtime_m}:${vtime_s}`,
+        currentTime: `${ctime_m}:${ctime_s}`,
+        sliderMax: parseInt(videoDuration),
+        sliderValue: parseInt(currentTime)
+      })
+    }
+
+  },
+
+  videoPlayControl() {
+
+    const videoControlTimer = setTimeout(() => {
+      const videoStatus = this.data.videoStatus;
+      if (videoStatus == 2) {
+        this.setData({
+          videoStatus: 1
+        })
+      }
+    }, 3000)
+
+    this.setData({
+      videoStatus: 2,
+      videoControlTimer
+    })
+  },
+
+  onTouchEndControls() {
+    const videoControlTimer = setTimeout(() => {
+      const videoStatus = this.data.videoStatus;
+      if (videoStatus == 2) {
+        this.setData({
+          videoStatus: 1
+        })
+      }
+    }, 3000);
+
+    this.setData({
+      videoControlTimer
+    })
+  },
+
+  onTouchStartControls() {
+    const videoControlTimer = this.data.videoControlTimer;
+    clearTimeout(videoControlTimer);
+  },
+
+  videoSliderChange(ev) {
+    const sliderValue = ev.detail.value;
+    const item = ev.currentTarget.dataset.item;
+    const videoContext = my.createVideoContext(`myVideo_${item.order}`);
+    videoContext.seek(sliderValue);
+    this.setData({
+      sliderValue
+    })
+  },
+
+  videoPlayPause(ev) {
+    const item = ev.currentTarget.dataset.item;
+    const videoControlTimer = this.data.videoControlTimer;
+    const videoContext = my.createVideoContext(`myVideo_${item.order}`);
+    videoContext.pause();
+    clearTimeout(videoControlTimer);
+    this.setData({
+      videoStatus: 3
+    })
+  },
+
+  videoPlayPlay(ev) {
+    const item = ev.currentTarget.dataset.item;
+    const videoContext = my.createVideoContext(`myVideo_${item.order}`);
+    videoContext.play();
+
+    const videoControlTimer = setTimeout(() => {
+      const videoStatus = this.data.videoStatus;
+      if (videoStatus == 2) {
+        this.setData({
+          videoStatus: 1
+        })
+      }
+    }, 3000);
+
+    this.setData({
+      videoStatus: 2,
+      videoControlTimer
+    })
+
   },
 
   //显示 选择集数
@@ -280,9 +386,13 @@ Page({
 
   handleOrderCurrent(ev) {
     const item = ev.target.dataset.item;
+    // const videoInfoObj = this.data.videoInfoObj;
     // const orderList = this.data.orderList;
     // const batchAllOrder = this.data.batchAllOrder;
     const batchAllList = this.data.batchAllList;
+    // if(videoInfoObj.order == item.order) {
+
+    // }
     if (item.order != 1) {
       const nextVideoObj = batchAllList[item.order - 2];
       if (nextVideoObj.isvip == 1) {
@@ -295,6 +405,8 @@ Page({
     }
     // const current = item.order - 1;
     const sid = this.data.sid;
+    const videoControlTimer = this.data.videoControlTimer;
+    clearTimeout(videoControlTimer);
     // const swiperList = this.data.swiperList;
     const paramVideo = {
       path: '/videoread',
@@ -318,6 +430,7 @@ Page({
         orderList: ols,
         swiperCurrent: resData.order - 1,
         changeCuurent: resData.order - 1,
+        videoStatus: 1
       })
     })
   },
@@ -344,6 +457,7 @@ Page({
       } else {
         id = videoInfoObj.lastid;
       }
+
       const paramVideo = {
         path: '/videoread',
         method: 'POST',
@@ -352,7 +466,8 @@ Page({
           id: id
         }
       }
-
+      const videoControlTimer = this.data.videoControlTimer;
+      clearTimeout(videoControlTimer);
       httpRequest(paramVideo).then(res => {
         // swiperList.map()
         const resData = res.data[0]
@@ -364,10 +479,12 @@ Page({
           changeCuurent: current,
           videoInfoObj: resData,
           orderList: ols,
-          swiperOrder: resData.order
+          swiperOrder: resData.order,
+          videoStatus: 1
         })
       })
     }, 300, { trailing: false });
+
     this.setData({
       isThrottle: isThrottle,
       pageHideFlag: true