diff --git a/publish/changeLog.md b/publish/changeLog.md
index b61d5f2d..5888f269 100644
--- a/publish/changeLog.md
+++ b/publish/changeLog.md
@@ -7,6 +7,7 @@
### 优化
- 优化播放详情页背景显示,现在有背景图片的主题可以在播放详情页显示它的图片了
+- 在全屏状态下的播放详情页仍会显示退出播放详情页按钮,同时在其旁边添加退出全屏按钮
### 修复
diff --git a/src/lang/en-us.json b/src/lang/en-us.json
index 63a800bc..1fdce610 100644
--- a/src/lang/en-us.json
+++ b/src/lang/en-us.json
@@ -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",
diff --git a/src/lang/zh-cn.json b/src/lang/zh-cn.json
index 37daa6b6..f5241d1d 100644
--- a/src/lang/zh-cn.json
+++ b/src/lang/zh-cn.json
@@ -53,6 +53,7 @@
"download__runing": "正在下载",
"download__status": "状态",
"export": "导出",
+ "fullscreen_exit": "退出全屏",
"history_clear": "清空搜索历史",
"history_remove": "右击移除该历史",
"history_search": "历史搜索",
diff --git a/src/lang/zh-tw.json b/src/lang/zh-tw.json
index dc8ac77b..d1781ce9 100644
--- a/src/lang/zh-tw.json
+++ b/src/lang/zh-tw.json
@@ -53,6 +53,7 @@
"download__runing": "正在下載",
"download__status": "狀態",
"export": "導出",
+ "fullscreen_exit": "退出全屏",
"history_clear": "清空搜索歷史",
"history_remove": "右擊移除該歷史",
"history_search": "歷史搜索",
diff --git a/src/renderer/assets/svgs/fullscreen-exit.svg b/src/renderer/assets/svgs/fullscreen-exit.svg
new file mode 100644
index 00000000..1f443d9b
--- /dev/null
+++ b/src/renderer/assets/svgs/fullscreen-exit.svg
@@ -0,0 +1,3 @@
+
diff --git a/src/renderer/components/core/PlayDetail/index.vue b/src/renderer/components/core/PlayDetail/index.vue
index f709017b..1449558d 100644
--- a/src/renderer/components/core/PlayDetail/index.vue
+++ b/src/renderer/components/core/PlayDetail/index.vue
@@ -1,6 +1,6 @@
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,8 +175,14 @@ export default {
&.fullscreen {
.header {
-webkit-app-region: no-drag;
- > * {
- display: none;
+ 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;
- }
+ 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}';
- }
+ background-color: ~'@{color-@{value}-btn-hover}';
+
&.close {
background-color: ~'@{color-@{value}-closeBtn}';
}
diff --git a/src/renderer/core/useApp/useEventListener.js b/src/renderer/core/useApp/useEventListener.js
index f8fa6383..3f661d85 100644
--- a/src/renderer/core/useApp/useEventListener.js
+++ b/src/renderer/core/useApp/useEventListener.js
@@ -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()
diff --git a/src/renderer/event/names.js b/src/renderer/event/names.js
index 5867f105..7a705631 100644
--- a/src/renderer/event/names.js
+++ b/src/renderer/event/names.js
@@ -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',
},