guzijian / wvp-GB28181-pro · Commits

Commit 62f5b3dfdd6352a9ecf1f87c600cacd48da04693

Authored by 648540858
Committed by GitHub
2 parents 0b6b72ae 5c1a5f79

Merge pull request #452 from hotcoffie/wvp-28181-2.0 

优化播放器尺寸调节逻辑：
Inline Side-by-side
Showing 1 changed file with 10 additions and 3 deletions
web_src/src/components/common/jessibuca.vue
  View file @62f5b3d
1 1 <template>
2   - <div id="container" ref="containerId" @dblclick="fullscreenSwich" style="width: 100%">
  2 + <div id="container" ref="containerId" @dblclick="fullscreenSwich" style="background-color: #eee;margin:0 auto;">
3 3 <div class="buttons-box" id="buttonsBox">
4 4 <div class="buttons-box-left">
5 5 <i v-if="!playing" class="iconfont icon-play jessibuca-btn" @click="playBtnClick"></i>
... ... @@ -72,9 +72,16 @@ export default {
72 72 methods: {
73 73 updatePlayerDomSize() {
74 74 let dom = document.getElementById('container');
75   - const width = dom.parentNode.clientWidth
  75 + let width = dom.parentNode.clientWidth
  76 + let height = (9 / 16) * width
  77 + const clientHeight = Math.min(document.body.clientHeight, document.documentElement.clientHeight)
  78 + if (height > clientHeight) {
  79 + height = clientHeight
  80 + width = (16 / 9) * height
  81 + }
  82 +
76 83 dom.style.width = width + 'px';
77   - dom.style.height = (9 / 16) * width + "px";
  84 + dom.style.height = height + "px";
78 85 },
79 86 create() {
80 87 let options = {};
... ...