在全屏状态下的播放详情页仍会显示退出播放详情页按钮
parent
e302f53d5c
commit
e51f640371
|
@ -7,6 +7,7 @@
|
|||
### 优化
|
||||
|
||||
- 优化播放详情页背景显示,现在有背景图片的主题可以在播放详情页显示它的图片了
|
||||
- 在全屏状态下的播放详情页仍会显示退出播放详情页按钮,同时在其旁边添加退出全屏按钮
|
||||
|
||||
### 修复
|
||||
|
||||
|
|
|
@ -53,6 +53,7 @@
|
|||
"download__runing": "Downloading",
|
||||
"download__status": "Status",
|
||||
"export": "Export",
|
||||
"fullscreen_exit": "Exit Full Screen",
|
||||
"history_clear": "Clear History",
|
||||
"history_remove": "Right click to remove this entry",
|
||||
"history_search": "History Searches",
|
||||
|
|
|
@ -53,6 +53,7 @@
|
|||
"download__runing": "正在下载",
|
||||
"download__status": "状态",
|
||||
"export": "导出",
|
||||
"fullscreen_exit": "退出全屏",
|
||||
"history_clear": "清空搜索历史",
|
||||
"history_remove": "右击移除该历史",
|
||||
"history_search": "历史搜索",
|
||||
|
|
|
@ -53,6 +53,7 @@
|
|||
"download__runing": "正在下載",
|
||||
"download__status": "狀態",
|
||||
"export": "導出",
|
||||
"fullscreen_exit": "退出全屏",
|
||||
"history_clear": "清空搜索歷史",
|
||||
"history_remove": "右擊移除該歷史",
|
||||
"history_search": "歷史搜索",
|
||||
|
|
|
@ -0,0 +1,3 @@
|
|||
<svg style="width:24px;height:24px" viewBox="0 0 24 24">
|
||||
<path fill="currentColor" d="M14,14H19V16H16V19H14V14M5,14H10V19H8V16H5V14M8,5H10V10H5V8H8V5M19,8V10H14V5H16V8H19Z" />
|
||||
</svg>
|
After Width: | Height: | Size: 187 B |
|
@ -1,6 +1,6 @@
|
|||
<template lang="pug">
|
||||
transition(enter-active-class="animated lightSpeedIn" leave-active-class="animated slideOutDown" @after-enter="handleAfterEnter" @after-leave="handleAfterLeave")
|
||||
div(:class="[$style.container, , { [$style.fullscreen]: isFullscreen }]" @contextmenu="handleContextMenu" v-if="isShowPlayerDetail")
|
||||
div(:class="[$style.container, { [$style.fullscreen]: isFullscreen }]" @contextmenu="handleContextMenu" v-if="isShowPlayerDetail")
|
||||
div(:class="$style.bg")
|
||||
//- div(:class="$style.bg" :style="bgStyle")
|
||||
//- div(:class="$style.bg2")
|
||||
|
@ -9,6 +9,9 @@ transition(enter-active-class="animated lightSpeedIn" leave-active-class="animat
|
|||
button(type="button" :class="$style.hide" :aria-label="$t('player__hide_detail_tip')" @click="hide")
|
||||
svg(:class="$style.controBtnIcon" version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' width='80%' viewBox='0 0 30.727 30.727' space='preserve')
|
||||
use(xlink:href='#icon-window-hide')
|
||||
button(type="button" :class="$style.fullscreenExit" :aria-label="$t('fullscreen_exit')" @click="fullscreenExit")
|
||||
svg(:class="$style.controBtnIcon" version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' width='100%')
|
||||
use(xlink:href='#icon-fullscreen-exit')
|
||||
button(type="button" :class="$style.min" :aria-label="$t('min')" @click="min")
|
||||
svg(:class="$style.controBtnIcon" version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' width='100%' viewBox='0 0 24 24' space='preserve')
|
||||
use(xlink:href='#icon-window-minimize')
|
||||
|
@ -22,6 +25,9 @@ transition(enter-active-class="animated lightSpeedIn" leave-active-class="animat
|
|||
button(type="button" :class="$style.hide" :aria-label="$t('player__hide_detail_tip')" @click="hide")
|
||||
svg(:class="$style.controBtnIcon" version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='35%' viewBox='0 0 30.727 30.727' space='preserve')
|
||||
use(xlink:href='#icon-window-hide')
|
||||
button(type="button" :class="$style.fullscreenExit" :aria-label="$t('fullscreen_exit')" @click="fullscreenExit")
|
||||
svg(:class="$style.controBtnIcon" version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='60%')
|
||||
use(xlink:href='#icon-fullscreen-exit')
|
||||
button(type="button" :class="$style.min" :aria-label="$t('min')" @click="min")
|
||||
svg(:class="$style.controBtnIcon" version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='60%' viewBox='0 0 24 24' space='preserve')
|
||||
use(xlink:href='#icon-window-minimize-2')
|
||||
|
@ -30,7 +36,6 @@ transition(enter-active-class="animated lightSpeedIn" leave-active-class="animat
|
|||
button(type="button" :class="$style.close" :aria-label="$t('close')" @click="close")
|
||||
svg(:class="$style.controBtnIcon" version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='60%' viewBox='0 0 24 24' space='preserve')
|
||||
use(xlink:href='#icon-window-close-2')
|
||||
|
||||
div(:class="[$style.main, {[$style.showComment]: isShowPlayComment}]")
|
||||
div.left(:class="$style.left")
|
||||
//- div(:class="$style.info")
|
||||
|
@ -120,6 +125,9 @@ export default {
|
|||
handleAfterLeave,
|
||||
visibled,
|
||||
isFullscreen,
|
||||
fullscreenExit() {
|
||||
window.eventHub.emit(eventBaseName.fullscreenToggle, false)
|
||||
},
|
||||
min() {
|
||||
window.eventHub.emit(eventBaseName.min)
|
||||
},
|
||||
|
@ -167,9 +175,15 @@ export default {
|
|||
&.fullscreen {
|
||||
.header {
|
||||
-webkit-app-region: no-drag;
|
||||
> * {
|
||||
align-self: flex-start;
|
||||
.controBtn {
|
||||
.close, .min {
|
||||
display: none;
|
||||
}
|
||||
.fullscreenExit {
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -214,6 +228,23 @@ export default {
|
|||
top: 0;
|
||||
display: flex;
|
||||
-webkit-app-region: no-drag;
|
||||
|
||||
button {
|
||||
display: flex;
|
||||
position: relative;
|
||||
background: none;
|
||||
border: none;
|
||||
outline: none;
|
||||
padding: 1px;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.fullscreenExit {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
&.controlBtnLeft {
|
||||
|
@ -230,19 +261,10 @@ export default {
|
|||
}
|
||||
|
||||
button {
|
||||
position: relative;
|
||||
width: @control-btn-width;
|
||||
height: @control-btn-width;
|
||||
background: none;
|
||||
border: none;
|
||||
outline: none;
|
||||
padding: 1px;
|
||||
cursor: pointer;
|
||||
border-radius: 50%;
|
||||
color: @color-theme_2;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
+ button {
|
||||
margin-right: (@control-btn-width / 2);
|
||||
}
|
||||
|
@ -250,7 +272,7 @@ export default {
|
|||
&.hide {
|
||||
background-color: @color-hideBtn;
|
||||
}
|
||||
&.min {
|
||||
&.min, &.fullscreenExit {
|
||||
background-color: @color-minBtn;
|
||||
}
|
||||
&.max {
|
||||
|
@ -272,24 +294,14 @@ export default {
|
|||
.controBtn {
|
||||
right: 0;
|
||||
button {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
position: relative;
|
||||
width: 46px;
|
||||
height: 30px;
|
||||
background: none;
|
||||
border: none;
|
||||
outline: none;
|
||||
padding: 1px;
|
||||
cursor: pointer;
|
||||
color: @color-theme;
|
||||
transition: background-color 0.2s ease-in-out;
|
||||
|
||||
&:hover {
|
||||
&.hide, &.min, &.max {
|
||||
background-color: @color-btn-hover;
|
||||
}
|
||||
|
||||
&.close {
|
||||
background-color: @color-closeBtn;
|
||||
}
|
||||
|
@ -407,7 +419,7 @@ each(@themes, {
|
|||
&.hide {
|
||||
background-color: ~'@{color-@{value}-hideBtn}';
|
||||
}
|
||||
&.min {
|
||||
&.min, &.fullscreenExit {
|
||||
background-color: ~'@{color-@{value}-minBtn}';
|
||||
}
|
||||
&.max {
|
||||
|
@ -424,9 +436,8 @@ each(@themes, {
|
|||
button {
|
||||
color: ~'@{color-@{value}-theme_2-font-label}';
|
||||
&:hover {
|
||||
&.hide, &.min, &.max {
|
||||
background-color: ~'@{color-@{value}-btn-hover}';
|
||||
}
|
||||
|
||||
&.close {
|
||||
background-color: ~'@{color-@{value}-closeBtn}';
|
||||
}
|
||||
|
|
|
@ -28,8 +28,11 @@ const handle_open_devtools = event => {
|
|||
rendererSend(NAMES.mainWindow.open_dev_tools)
|
||||
}
|
||||
const handle_fullscreen = event => {
|
||||
if (event.event.repeat) return
|
||||
rendererInvoke(NAMES.mainWindow.fullscreen, !isFullscreen.value).then(fullscreen => {
|
||||
let fullscreen = !isFullscreen.value
|
||||
if (typeof event == 'boolean') {
|
||||
fullscreen = event
|
||||
} else if (event.event.repeat) return
|
||||
rendererInvoke(NAMES.mainWindow.fullscreen, fullscreen).then(fullscreen => {
|
||||
isFullscreen.value = fullscreen
|
||||
})
|
||||
}
|
||||
|
@ -75,6 +78,7 @@ export default ({
|
|||
window.eventHub.on('key_escape_down', handle_key_esc_down)
|
||||
window.eventHub.on('key_mod+f12_down', handle_open_devtools)
|
||||
window.eventHub.on('key_f11_down', handle_fullscreen)
|
||||
window.eventHub.on(eventBaseName.fullscreenToggle, handle_fullscreen)
|
||||
document.body.addEventListener('click', handleBodyClick, true)
|
||||
|
||||
if (isProd && !window.dt && !isLinux) {
|
||||
|
@ -89,6 +93,7 @@ export default ({
|
|||
window.eventHub.off('key_escape_down', handle_key_esc_down)
|
||||
window.eventHub.off('key_mod+f12_down', handle_open_devtools)
|
||||
window.eventHub.off('key_f11_down', handle_fullscreen)
|
||||
window.eventHub.off(eventBaseName.fullscreenToggle, handle_fullscreen)
|
||||
document.body.removeEventListener('click', handleBodyClick)
|
||||
window.eventHub.emit(eventBaseName.unbindKey)
|
||||
rSetConfig()
|
||||
|
|
|
@ -10,6 +10,7 @@ const names = {
|
|||
min: 'min',
|
||||
max: 'max',
|
||||
close: 'close',
|
||||
fullscreenToggle: 'fullscreenToggle',
|
||||
set_config: 'set_config',
|
||||
set_hot_key_config: 'set_hot_key_config',
|
||||
},
|
||||
|
|
Loading…
Reference in New Issue