修改播放器

src/index.html

@@ -14,8 +14,8 @@
     <div class="header">智能共享白板</div>
     <div class="video">
       <div class="title">
-        <p></p>
-        <div id="btn">
+        <p>11111</p>
+        <!-- <div id="btn">
             <label>
                 <input type="radio" name="type" id="adviceRadio2" value="desktopUrl" checked hidden/>
                 <label for="adviceRadio2" class="advice"></label>
@@ -26,7 +26,7 @@
                 <label for="adviceRadio1" class="advice"></label>
                 <span class="radio-name">白板视频</span>
             </label>
-        </div>
+        </div> -->
       </div>
       <div class="big-video" id="bigVideo">
       </div>

src/js/main.js

@@ -13,34 +13,45 @@ $(document).ready(function() {
   const title = JSON.parse(dataList).shareTask.title;
   const shareJoinUserId =  JSON.parse(dataList).shareJoinUser.id;
   $('.title p').html(title)
-  /**
-   * chimeeplayer播放器
-   */
-  // let bigVideo = new ChimeePlayer({
-  //   wrapper: '#bigVideo',  // video dom容器
-  //   src: 'http://live.ai160.com/SCREEN/SCREEN1559033120490640.flv',
-  //   box: 'flv',
-  //   isLive: true,
-  //   autoplay: true,
-  //   muted: false
-  // });
-  // let smallVideo = new ChimeePlayer({
-  //   wrapper: '#smallVideo',  // video dom容器
-  //   src: 'http://live.ai160.com/SCREEN/SCREEN1559033120490640.flv',
-  //   box: 'flv',
-  //   isLive: true,
-  //   autoplay: true,
-  //   muted: true
-  // });
+
+  // new Player({
+	// 	"id": "bigVideo",
+	// 	"url": "//s1.pstatp.com/cdn/expire-1-M/byted-player-videos/1.0.0/xgplayer-demo.mp4",
+	// 	"playsinline": false,
+	// 	"volume": 1,
+  //   "autoplay": true,
+  //   "width": "100%",
+  //   "height": "714",
+  //   "ignores": ['definition', 'i18n', 'play', 'replay', 'progress', 'start', 'time'],
+  //   "closeVideoClick": true,
+  //   "closeVideoTouch": true,
+  //   "keyShortcut": "off",
+  //   "cssFullscreen": true
+  // })
+  // new Player({
+	// 	"id": "smallVideo",
+	// 	"url": "//s1.pstatp.com/cdn/expire-1-M/byted-player-videos/1.0.0/xgplayer-demo.mp4",
+	// 	"playsinline": false,
+	// 	"volume": 0,
+  //   "autoplay": true,
+  //   "width": "100%",
+  //   "height": "714",
+  //   "ignores": ['definition', 'i18n', 'play', 'replay', 'progress', 'start', 'time'],
+  //   "closeVideoClick": true,
+  //   "closeVideoTouch": true,
+  //   "keyShortcut": "off",
+  //   "cssFullscreen": true
+  // })
+
   let bigVideo = new FlvJsPlayer({
 		"id": "bigVideo",
-		"url": desktopUrl,
+		"url": boardUrl,
 		"playsinline": false,
 		"volume": 1,
     "autoplay": true,
     "width": "100%",
     "height": "714",
-    "ignores": ['definition', 'i18n', 'play', 'replay', 'progress', 'start', 'volume'],
+    "ignores": ['definition', 'i18n', 'play', 'replay', 'progress', 'start', 'time'],
     "closeVideoClick": true,
     "closeVideoTouch": true,
     "keyShortcut": "off",
@@ -48,19 +59,19 @@ $(document).ready(function() {
   });
   let smallVideo = new FlvJsPlayer({
 		"id": "smallVideo",
-		"url": boardUrl,
+		"url": desktopUrl,
 		"playsinline": false,
-		"volume": 1,
+		"volume": 0,
     "autoplay": true,
     "width": "100%",
     "height": "714",
-    "ignores": ['definition', 'i18n', 'play', 'replay', 'progress', 'start', 'volume'],
+    "ignores": ['definition', 'i18n', 'play', 'replay', 'progress', 'start', 'time'],
     "closeVideoClick": true,
     "closeVideoTouch": true,
     "keyShortcut": "off",
     "cssFullscreen": true
   });
-  $('#smallVideo').hide();
+  // $('#smallVideo').hide();
   // $('#smallVideo').click(function () {
   //   $('#bigVideo').removeClass('big-video').addClass('small-video');
   //   $('#smallVideo').removeClass('small-video').addClass('big-video');
@@ -73,20 +84,19 @@ $(document).ready(function() {
   //   smallVideo.muted = true;
   //   bigVideo.muted = false;
   // })
-  console.log(smallVideo)
-  $('input:radio').click(function () {
-    // console.log($(this).val())
-    const type = $(this).val();
-    if (type == 'desktopUrl') {
-      $('#bigVideo').show();
-      $('#smallVideo').hide();
-    } else {
-      $('#bigVideo').hide();
-      $('#smallVideo').show();
-    }
-    // player.flvOpts.url = 'http://aldirect.flv.huya.com/huyalive/94525224-2460686034-10568566041753944064-2789274542-10057-A-0-1.flv?wsSecret=a90ccc2ccf9420344d388def9c190893&wsTime=5ced08e1&ratio=500'
-    // console.log(player.config.url)
-  })
+  // $('input:radio').click(function () {
+  //   // console.log($(this).val())
+  //   const type = $(this).val();
+  //   if (type == 'desktopUrl') {
+  //     $('#bigVideo').show();
+  //     $('#smallVideo').hide();
+  //   } else {
+  //     $('#bigVideo').hide();
+  //     $('#smallVideo').show();
+  //   }
+  //   // player.flvOpts.url = 'http://aldirect.flv.huya.com/huyalive/94525224-2460686034-10568566041753944064-2789274542-10057-A-0-1.flv?wsSecret=a90ccc2ccf9420344d388def9c190893&wsTime=5ced08e1&ratio=500'
+  //   // console.log(player.config.url)
+  // })
   // 判断用户是否存在回调
   function shareJoin () {
     setTimeout(function () {

src/style/index.less

@@ -4,6 +4,7 @@
   display: flex;
   flex-direction: column;
   overflow: hidden;
+  background: #ededed;
   .header {
     width: 100%;
     height: 108px;
@@ -16,7 +17,8 @@
     flex: 1;
     width: 100%;
     background: #000;
-    padding: 10px 325px;
+    padding:  10px 0;
+    box-sizing: border-box;
     .title {
       display: flex;
       justify-content: space-between;
@@ -44,9 +46,15 @@
     }
     .big-video,
     .small-video {
-      width: 100%;
+      width: 49%;
       height: 714px;
     }
+    .big-video {
+      float: left;
+    }
+    .small-video {
+      float: right;
+    }
     // .small-video {
     //   position: fixed;
     //   top: 170px;