ucservice 1.3.5 → 1.3.6

package/dist/ucservice.common.js

@@ -12455,7 +12455,7 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
         windowNums: num
       });
       me._opts.windows = num;
-      me._opts.extra = extra;
+      me._opts.extra = extra; //设置旋转了的视频样式
     },
 
     /**
@@ -13459,7 +13459,13 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
       this.dispatch('screenchange', {
         windowNums: num,
         flag: me._opts.flag
-      });
+      }); //设置旋转视频的样式
+
+      for (let k = 0; k < _li.length(); k++) {
+        let rotateIndex = _li.eq(k).find('button[name=rotateVideo]').attr('rotate-index');
+
+        if (rotateIndex != 0 && rotateIndex != 2) videoRotateSize(_li.eq(k), rotateIndex);
+      }
     },
 
     /**
@@ -13927,11 +13933,106 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
       me._dbClickFullScreen();
     },
 
+    videoRotateSize(li, rotateIndex) {
+      let video = li.querySelector('video');
+      let videoWidth = video.videoWidth;
+      let videoHeight = video.videoHeight;
+      let vWidth = video.offsetWidth;
+      let vHeight = video.offsetHeight;
+      let liWidth = li.offsetWidth;
+      let liHeight = li.offsetHeight;
+
+      if (rotateIndex == 0) {
+        //0
+        $(video).attr('class', 'video-box');
+        $(video).css('height', '');
+        $(video).css('width', 'auto');
+        video.style.position = 'static';
+        video.style.transform = 'none';
+        $(video).css('left', '');
+        $(video).css('top', '');
+      } else if (rotateIndex == 3) {
+        //3
+        $(video).attr('class', 'video-box');
+        video.style.position = 'absolute';
+        video.style.transform = 'rotate(270deg)';
+
+        if (videoWidth / videoHeight > liWidth / liHeight) {
+          //视频横向留白
+          $(video).css('width', liHeight);
+          $(video).css('height', 'auto');
+          $(video).css('left', 'calc(' + liWidth + ' / 2' + ' - ' + liHeight + ' / 2)');
+          $(video).css('top', 'calc(-' + liHeight / 2 + ' / ' + vWidth + ' * ' + vHeight + ' + ' + liHeight + ' / 2)');
+        } else {
+          //视频纵向留白
+          $(video).css('height', liWidth);
+          $(video).css('width', 'auto');
+          $(video).css('left', 'calc(' + liHeight + ' / 2' + ' - ' + liWidth + ' / 2)');
+          $(video).css('top', 'calc(-' + liWidth / 2 + ' / ' + vHeight + ' * ' + vWidth + ' + ' + liWidth + ' / 2)');
+        }
+      } else if (rotateIndex == 2) {
+        //2
+        $(video).attr('class', 'video-box');
+        $(video).css('height', '');
+        $(video).css('width', 'auto');
+        video.style.position = 'static';
+        video.style.transform = 'rotate(180deg)';
+        $(video).css('left', '');
+        $(video).css('top', '');
+      } else if (rotateIndex == 1) {
+        //1
+        $(video).attr('class', 'video-box');
+        video.style.position = 'absolute';
+        video.style.transform = 'rotate(90deg)';
+
+        if (videoWidth / videoHeight > liWidth / liHeight) {
+          //视频横向留白
+          $(video).css('width', liHeight);
+          $(video).css('height', 'auto');
+          $(video).css('left', 'calc(' + liWidth + ' / 2' + ' - ' + liHeight + ' / 2)');
+          $(video).css('top', 'calc(-' + liHeight / 2 + ' / ' + vWidth + ' * ' + vHeight + ' + ' + liHeight + ' / 2)');
+        } else {
+          //视频纵向留白
+          $(video).css('height', liWidth);
+          $(video).css('width', 'auto');
+          $(video).css('left', 'calc(' + liHeight + ' / 2' + ' - ' + liWidth + ' / 2)');
+          $(video).css('top', 'calc(-' + liWidth / 2 + ' / ' + vHeight + ' * ' + vWidth + ' + ' + liWidth + ' / 2)');
+        }
+      }
+    },
+
     /**
      * 初始化按钮点击事件
      */
     _initBtnEvent: function () {
-      let me = this;
+      let me = this; // 设置视频窗可拖拽
+
+      var src = null;
+      $(me.selector + ' li').bind("dragstart", function (ev) {
+        src = $(this);
+      });
+      $(me.selector + ' li').bind("dragover", function (ev) {
+        ev.preventDefault();
+      });
+      $(me.selector + ' li').bind("drop", function (ev) {
+        ev.preventDefault();
+
+        if (src.prop("outerHTML") === $(this).prop("outerHTML")) {
+          return;
+        }
+
+        var target = $(this);
+        var srcIndex = src.index();
+        var targetIndex = target.index();
+
+        if (srcIndex > targetIndex) {
+          src.insertBefore(target);
+          target.insertAfter($(me.selector + ' .video-main li.screen').eq(srcIndex));
+        } else {
+          src.insertAfter(target);
+          target.insertBefore($(me.selector + ' .video-main li.screen').eq(srcIndex));
+        }
+      });
       let videoFlagObj = $('[video-flag="' + me._opts.windowsBeginIndex + '"]'); //锁定视频事件
 
       videoFlagObj.find("button[name='lockVideo']").click(function () {
@@ -13949,6 +14050,13 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
           me.VIDEO_DATA[index].isLockVideo = true;
           $(this).attr('class', 'lock-video-btn');
         }
+      });
+      videoFlagObj.find('button[name=rotateVideo]').click(function () {
+        let rotateIndex = Number($(this).attr("rotate-index"));
+        rotateIndex++;
+        $(this).attr("rotate-index", rotateIndex % 4);
+        let li = $(this).parent().parent()[0];
+        videoRotateSize(li, rotateIndex);
       }); //接收音频事件
 
       videoFlagObj.find("button[name='recvAudio']").click(function () {
@@ -14185,7 +14293,7 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
       for (let i = index; i < index + me._opts.windowsNum; i++) {
         videoHtml += '<li class="screen-' + i + '" index="' + (i - 1) + '"><video class="video-box" id="video-' + i + '" autoplay ></video>' + '<div class="info hide" id="info-' + i + '"></div>' + '<div class="operate-btn">'; //videoHtml +='<button type="button" class="unlock-video-btn hide" name="lockVideo"></button>';
 
-        checkUserMediaAvailable() && (videoHtml += '<button type="button" class="unsend-audio-btn hide" name="sendAudio"></button>');
+        checkUserMediaAvailable() && (videoHtml += '<button type="button" class="rotate-btn hide" name="rotateVideo" rotate-index="0"></button><button type="button" class="unsend-audio-btn hide" name="sendAudio"></button>');
         videoHtml += '<button type="button" class="unrecv-audio-btn hide" name="recvAudio"></button>' + '<button type="button" class="close-btn hide" name="closeVideo"></button>' + '</div>' + '</li>';
       }
 
@@ -28439,7 +28547,9 @@ let location_url_location = {
     requestParam: {
       mapId: '',
       //地图类型
-      layers: '' //设备类型
+      kw: '',
+      //关键字
+      layers: '' //设备类型 可选
 
     },
     responseParam: {