fix(xgplayer/[control/mobile.js,pc.js,progress.js style/player.scss])…

…: fix playbackrate and definiti
bytedance · Jul 27, 2018 · de26dbc · de26dbc
1 parent f934040
commit de26dbc
Show file tree

Hide file tree

Showing 6 changed files with 28 additions and 12 deletions.
diff --git a/packages/xgplayer/browser/index.js b/packages/xgplayer/browser/index.js
diff --git a/packages/xgplayer/dist/index.js b/packages/xgplayer/dist/index.js
diff --git a/packages/xgplayer/src/control/mobile.js b/packages/xgplayer/src/control/mobile.js
@@ -69,7 +69,12 @@ let mobile = function () {
  enter.querySelector('.xgplayer-enter-tips').style.display = 'block'
  player.start()
  if (pass) {
- enterLogo.src = util.getBgImage(logo)
+ if (player.config.enterLogo) {
+ enterLogo.src = player.config.enterLogo;
+ logo.style.backgroundImage = `url("${player.config.enterLogo}")`
+ } else {
+ enterLogo.src = util.getBgImage(logo);
+ }
  player.video.addEventListener('touchstart', (e) => {
  e.preventDefault()
  player.emit('focus')

diff --git a/packages/xgplayer/src/control/pc.js b/packages/xgplayer/src/control/pc.js
@@ -21,7 +21,13 @@ let pc = function () {
  enterLogo.onload = () => {
  enter.querySelector('.xgplayer-enter-tips').style.display = 'block'
  }
- enterLogo.src = util.getBgImage(logo);
+ if (player.config.enterLogo) {
+ enterLogo.src = player.config.enterLogo;
+ logo.style.backgroundImage = `url("${player.config.enterLogo}")`
+ } else {
+ enterLogo.src = util.getBgImage(logo);
+ }
+
  ['click', 'touchstart'].forEach(item => {
  btn.addEventListener(item, function (e) {
  e.preventDefault()

diff --git a/packages/xgplayer/src/control/progress.js b/packages/xgplayer/src/control/progress.js
@@ -112,7 +112,7 @@ let progress = function () {
  }, false)
 
  player.on('timeupdate', function () {
- if (!containerWidth) {
+ if (!containerWidth && container) {
  containerWidth = container.getBoundingClientRect().width
  }
  progress.style.width = `${player.currentTime * 100 / player.duration}%`

diff --git a/packages/xgplayer/src/style/player.scss b/packages/xgplayer/src/style/player.scss
@@ -342,6 +342,8 @@
  display: none;
  cursor: pointer;
  margin-left: 10px;
+ margin-top: 8px;
+ margin-bottom: 12px;
  .xgplayer-tips{
  margin-left: -20px;
  }
@@ -365,7 +367,7 @@
  background: $definitionUlBgColor;
  border-radius: 1px;
  position: absolute;
- bottom: 50px;
+ bottom: 30px;
  left: 0;
  text-align: center;
  white-space: nowrap;
@@ -396,13 +398,13 @@
  text-align: center;
  font-family: PingFangSC-Regular;
  font-size: 13px;
- line-height: 40px;
+ line-height: 20px;
+ height: 20px;
  color: $definitionNameColor;
  em{
  width: 60px;
  height: 20px;
  line-height: 20px;
- padding: 1px 0px;
  background: $definitionNameBgColor;
  border-radius: 10px;
  display:inline-block;
@@ -421,17 +423,20 @@
  display: block;
  cursor: pointer;
  margin-left: 10px;
+ margin-top: 8px;
+ margin-bottom: 12px;
+ height: 20px;
  .name {
  text-align: center;
  font-family: PingFangSC-Regular;
  font-size: 13px;
- line-height: 40px;
+ line-height: 20px;
+ height: 20px;
  color: $definitionNameColor;
  span{
  width: 40px;
  height: 20px;
  line-height: 20px;
- padding: 1px 10px;
  background: $definitionNameBgColor;
  border-radius: 10px;
  display:inline-block;