feat(xgplayer/control/[pc.js, mobile.js, replay.js]): add center butt…

…on svg path config 45
bytedance · Aug 17, 2018 · 2b47a5a · 2b47a5a
1 parent 7a8d4b7
commit 2b47a5a
Show file tree

Hide file tree

Showing 5 changed files with 15 additions and 9 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
@@ -44,9 +44,10 @@ let mobile = function () {
  let whitelist = player.config.whitelist
  let pass = whitelistPass(whitelist)
  player.mobilePass = pass
+ let centerBtn = player.config.centerBtn
  let iconPath = {
- pause: 'M576,363L810,512L576,661zM342,214L576,363L576,661L342,810z',
- play: 'M598,214h170v596h-170v-596zM256 810v-596h170v596h-170z'
+ pause: centerBtn.pausePath ? centerBtn.pausePath : 'M576,363L810,512L576,661zM342,214L576,363L576,661L342,810z',
+ play: centerBtn.playPath ? centerBtn.playPath : 'M598,214h170v596h-170v-596zM256 810v-596h170v596h-170z'
  }
 
  let btn = util.createDom('xg-start', `

diff --git a/packages/xgplayer/src/control/pc.js b/packages/xgplayer/src/control/pc.js
@@ -4,9 +4,10 @@ let pc = function () {
  let player = this
  let util = Player.util; let controls = player.controls; let root = player.root
  let clk = 0; let _click_
+ let centerBtn = player.config.centerBtn
  let iconPath = {
- pause: 'M576,363L810,512L576,661zM342,214L576,363L576,661L342,810z',
- play: 'M598,214h170v596h-170v-596zM256 810v-596h170v596h-170z'
+ pause: centerBtn.pausePath ? centerBtn.pausePath : 'M576,363L810,512L576,661zM342,214L576,363L576,661L342,810z',
+ play: centerBtn.playPath ? centerBtn.playPath : 'M598,214h170v596h-170v-596zM256 810v-596h170v596h-170z'
  }
  let btn = util.createDom('xg-start', `
  <svg xmlns="http://www.w3.org/2000/svg" width="1024" height="1024" viewBox="0 0 1024 1024">

diff --git a/packages/xgplayer/src/control/replay.js b/packages/xgplayer/src/control/replay.js
@@ -2,9 +2,13 @@ import Player from '../player'
 
 let replay = function () {
  let player = this; let util = Player.util
+ let centerBtn = player.config.centerBtn
+ let iconPath = {
+ replay: centerBtn.replayPath ? centerBtn.replayPath : `M8.22708362,13.8757234 L11.2677371,12.6472196 C11.7798067,12.4403301 12.3626381,12.6877273 12.5695276,13.1997969 L12.9441342,14.1269807 C13.1510237,14.6390502 12.9036264,15.2218816 12.3915569,15.4287712 L6.8284538,17.6764107 L5.90126995,18.0510173 C5.38920044,18.2579068 4.80636901,18.0105096 4.5994795,17.49844 L1.97723335,11.0081531 C1.77034384,10.4960836 2.0177411,9.91325213 2.52981061,9.70636262 L3.45699446,9.33175602 C3.96906396,9.12486652 4.5518954,9.37226378 4.75878491,9.88433329 L5.67885163,12.1615783 C7.99551726,6.6766934 13.3983951,3 19.5,3 C27.7842712,3 34.5,9.71572875 34.5,18 C34.5,26.2842712 27.7842712,33 19.5,33 C15.4573596,33 11.6658607,31.3912946 8.87004692,28.5831991 C8.28554571,27.9961303 8.28762719,27.0463851 8.87469603,26.4618839 C9.46176488,25.8773827 10.4115101,25.8794641 10.9960113,26.466533 C13.2344327,28.7147875 16.263503,30 19.5,30 C26.127417,30 31.5,24.627417 31.5,18 C31.5,11.372583 26.127417,6 19.5,6 C14.4183772,6 9.94214483,9.18783811 8.22708362,13.8757234 Z`
+ }
  let container = util.createDom('xg-replay', `
  <svg class="xgplayer-replay-svg" xmlns="http://www.w3.org/2000/svg" width="78" height="78" viewbox="0 0 78 78">
- <path d="M8.22708362,13.8757234 L11.2677371,12.6472196 C11.7798067,12.4403301 12.3626381,12.6877273 12.5695276,13.1997969 L12.9441342,14.1269807 C13.1510237,14.6390502 12.9036264,15.2218816 12.3915569,15.4287712 L6.8284538,17.6764107 L5.90126995,18.0510173 C5.38920044,18.2579068 4.80636901,18.0105096 4.5994795,17.49844 L1.97723335,11.0081531 C1.77034384,10.4960836 2.0177411,9.91325213 2.52981061,9.70636262 L3.45699446,9.33175602 C3.96906396,9.12486652 4.5518954,9.37226378 4.75878491,9.88433329 L5.67885163,12.1615783 C7.99551726,6.6766934 13.3983951,3 19.5,3 C27.7842712,3 34.5,9.71572875 34.5,18 C34.5,26.2842712 27.7842712,33 19.5,33 C15.4573596,33 11.6658607,31.3912946 8.87004692,28.5831991 C8.28554571,27.9961303 8.28762719,27.0463851 8.87469603,26.4618839 C9.46176488,25.8773827 10.4115101,25.8794641 10.9960113,26.466533 C13.2344327,28.7147875 16.263503,30 19.5,30 C26.127417,30 31.5,24.627417 31.5,18 C31.5,11.372583 26.127417,6 19.5,6 C14.4183772,6 9.94214483,9.18783811 8.22708362,13.8757234 Z"></path>
+ <path d="${iconPath.replay}"></path>
  </svg>
  <xg-replay-txt class="xgplayer-replay-txt">重播</xg-replay-txt>
  `, {}, 'xgplayer-replay'); let root = player.root