From 4ab87edaa560c1c4193726e87a863bc9abbde86c Mon Sep 17 00:00:00 2001 From: fangxiang Date: Sat, 5 Mar 2022 16:39:22 +0800 Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E8=87=AA=E5=AE=9A=E4=B9=89?= =?UTF-8?q?=E5=88=86=E8=BE=A8=E7=8E=87=EF=BC=8C=E5=A2=9E=E5=8A=A0=E6=9C=AA?= =?UTF-8?q?=E6=B3=A8=E5=86=8C=E7=9B=B8=E5=85=B3=E6=8F=90=E7=A4=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/common/Initializer.ts | 18 ++ src/common/RemoteDataExangeProcesser.ts | 37 ++-- src/components/BackgroundImageDialog.vue | 2 +- src/components/RecoveryDatabaseDialog.vue | 4 +- src/components/SystemSettingDialog.vue | 249 ++++++++++++++-------- src/components/UpgradeDialog.vue | 2 +- src/entities/ApplicationConfigEntity.ts | 1 + src/entities/WSProtocol.ts | 17 +- src/i18n/zh-CN/index.ts | 16 ++ src/pages/Index.vue | 35 +++ src/pages/WallPage.vue | 3 +- src/store/index.ts | 6 +- 12 files changed, 274 insertions(+), 116 deletions(-) diff --git a/src/common/Initializer.ts b/src/common/Initializer.ts index f699b67..37bd0b1 100644 --- a/src/common/Initializer.ts +++ b/src/common/Initializer.ts @@ -162,6 +162,24 @@ export default class Initializer { this.initPollingTree(); this.getCurrentRunningPlan(); this.getWindows(); + + const support_resolutions = await GlobalData.getInstance() + .getCurrentClient() + ?.getSupportResolutions(); + if (support_resolutions) { + this.options.$store.commit( + "setDeviceScreenWidth", + support_resolutions.screen_width + ); + this.options.$store.commit( + "setDeviceScreenHeight", + support_resolutions.screen_height + ); + this.options.$store.commit( + "setDeviceScreenRefreshRate", + support_resolutions.screen_refresh_rate + ); + } } } } diff --git a/src/common/RemoteDataExangeProcesser.ts b/src/common/RemoteDataExangeProcesser.ts index 6a2d5e4..a8e5106 100644 --- a/src/common/RemoteDataExangeProcesser.ts +++ b/src/common/RemoteDataExangeProcesser.ts @@ -48,20 +48,25 @@ export default class RemoteDataExangeProcesser { if (temp) { let global_data = GlobalData.getInstance(); if (global_data && global_data.applicationConfig) { - (GlobalData.getInstance().applicationConfig)[temp.key] = - temp.value; - $store.commit( - "setWallCol", - global_data.applicationConfig.wall_col - ); - $store.commit( - "setWallRow", - global_data.applicationConfig.wall_row - ); - $store.commit( - "setPowerOnPlan", - global_data.applicationConfig.power_on_plan - ); + if (temp.key == "registered") { + global_data.applicationConfig.registered = JSON.parse( + temp.value + ); + } else { + (global_data.applicationConfig)[temp.key] = temp.value; + $store.commit( + "setWallCol", + global_data.applicationConfig.wall_col + ); + $store.commit( + "setWallRow", + global_data.applicationConfig.wall_row + ); + $store.commit( + "setPowerOnPlan", + global_data.applicationConfig.power_on_plan + ); + } } } } @@ -479,14 +484,14 @@ export default class RemoteDataExangeProcesser { notify.data ) as Protocol.DesktopResolutionChangedNotifyEntity; if (temp) { + $store.commit("setDeviceScreenConnectState", true); $store.commit("setDeviceScreenWidth", temp.width); $store.commit("setDeviceScreenHeight", temp.height); $store.commit("setDeviceScreenRefreshRate", temp.refresh_rate); - $store.commit("setDeviceScreenConnectState", true); } } break; - case Protocol.Commands.kDesktopResolutionChangedNotify: + case Protocol.Commands.kDesktopDisconnectNotify: { const temp = JSON.parse( notify.data diff --git a/src/components/BackgroundImageDialog.vue b/src/components/BackgroundImageDialog.vue index 5bf0508..ccb6b71 100644 --- a/src/components/BackgroundImageDialog.vue +++ b/src/components/BackgroundImageDialog.vue @@ -203,7 +203,7 @@ export default defineComponent({ loading.value = true; try { $q.dialog({ - title: "Confirm", + title: $t.t("Confirm"), message: $t.t("use this image to background image") + "?", cancel: true, persistent: true, diff --git a/src/components/RecoveryDatabaseDialog.vue b/src/components/RecoveryDatabaseDialog.vue index c767c68..45a20d2 100644 --- a/src/components/RecoveryDatabaseDialog.vue +++ b/src/components/RecoveryDatabaseDialog.vue @@ -163,7 +163,7 @@ export default defineComponent({ loading.value = true; try { $q.dialog({ - title: "Confirm", + title: $t.t("Confirm"), message: $t.t("use this file to recovery data") + "?", cancel: true, persistent: true, @@ -184,7 +184,7 @@ export default defineComponent({ timeout: 1500, }); $q.dialog({ - title: "Confirm", + title: $t.t("Confirm"), message: $t.t("data changes will take effect after the restart") + "!" + diff --git a/src/components/SystemSettingDialog.vue b/src/components/SystemSettingDialog.vue index 7e5463d..29679f8 100644 --- a/src/components/SystemSettingDialog.vue +++ b/src/components/SystemSettingDialog.vue @@ -256,9 +256,46 @@ - {{ - $t("device resolution") + ":" - }} + + {{ $t("current real resolution") }}: + + + {{ $store.state.device_screen_width }}X + {{ $store.state.device_screen_height }}@{{ + $store.state.device_screen_refresh_rate + }} + + + + {{ + $t( + "depending on the display device, the actual output resolution may differ from the target resolution" + ) + }} + + + + + {{ $t("output type") }}: + + + + + + {{ $t("target resolution") }}: + + {{ $t("target resolution") }}: + + + + + + {{ $t("custom") + }}{{ $t("timing sequence") }}: + + + + {{ $t("device rotate") + ":" @@ -755,8 +837,6 @@ export default defineComponent({ let contrast = ref(0); let hue = ref(0); - let old_resolution: string = ""; - let old_rotate: number = 0; let device_resolution = ref(""); let device_resolution_options: Ref = ref([]); let device_rotate = ref(0); @@ -794,6 +874,17 @@ export default defineComponent({ value: 7, }, ]); + let device_resolution_type = ref("EDID"); + let device_resolution_type_options = ref([ + { label: "EDID", value: "EDID" }, + { label: $t.t("force output") /*+ "(CVT)"*/, value: "CVT" }, + { + label: $t.t("force output") + "(" + $t.t("custom") + ")", + value: "CUSTOM", + }, + ]); + let device_resolution_timing = ref(""); + let output_board_resolution = ref(""); let output_board_resolution_options = ref(["1", "2", "3"]); @@ -860,27 +951,12 @@ export default defineComponent({ )) { device_resolution_options.value.push(item); } - - { - let val = device_resolution_options.value.find( - (element) => - element && - element == support_resolutions.current_device_resolution - ); - if (!val) { - device_resolution_options.value.push( - support_resolutions.current_device_resolution - ); - } - val = device_resolution_options.value.find( - (element) => - element && - element == support_resolutions.current_device_resolution - ); - device_resolution.value = - val ?? device_resolution_options.value[0]; - old_resolution = device_resolution.value; - } + device_resolution_type.value = + support_resolutions.target_resolution.type; + device_resolution.value = + support_resolutions.target_resolution.name; + device_resolution_timing.value = + support_resolutions.target_resolution.timing; } }, 1); @@ -889,7 +965,6 @@ export default defineComponent({ hue.value = parseInt(config.graphics_hue.toString()); device_rotate.value = parseInt(config.device_rotate.toString()); - old_rotate = device_rotate.value; } }; @@ -1020,67 +1095,53 @@ export default defineComponent({ }; const applyGraphics = async () => { - loading.value = true; - const request = new Protocol.SetSystemGraphicsRequestEntity(); - request.brightness = parseInt(brightness.value.toString()); - request.contrast = parseInt(contrast.value.toString()); - request.hue = parseInt(hue.value.toString()); - request.device_resolution = device_resolution.value; - request.rotate = parseInt(device_rotate.value.toString()); + const _apply_graphics = async () => { + loading.value = true; + const request = new Protocol.SetSystemGraphicsRequestEntity(); + request.brightness = parseInt(brightness.value.toString()); + request.contrast = parseInt(contrast.value.toString()); + request.hue = parseInt(hue.value.toString()); + request.target_resolution_type = device_resolution_type.value; + request.device_resolution_name = device_resolution.value; + request.target_resolution_timing = device_resolution_timing.value; + request.rotate = parseInt(device_rotate.value.toString()); - let success = false; - try { - await GlobalData.getInstance() - .getCurrentClient() - ?.setSystemGraphics(request); - await wait_for(1000 * 3); - success = true; - if ( - old_resolution != device_resolution.value || - old_rotate != device_rotate.value - ) { - try { - $q.dialog({ - title: "Confirm", - message: - $t.t( - "major graphics parameters have been changed and need to be restarted to take effect. Restart the system" - ) + "?", - cancel: true, - persistent: true, - }).onOk(async () => { - await GlobalData.getInstance() - .getCurrentClient() - ?.restartDevice(1000 * 3); - $q.notify({ - color: "positive", - icon: "done", - message: - $t.t("restart command send") + - $t.t("success") + - "!" + - $t.t("the system will reboot after the setup is complete") + - "!", - position: "top", - timeout: 2500, - }); - }); - } catch {} - } - } catch {} - $q.notify({ - color: success ? "positive" : "negative", - icon: success ? "done" : "warning", - message: - $t.t("set system graphics") + - (success ? $t.t("success") : $t.t("fail")) + - "!", - position: "top", - timeout: 2500, - }); - old_resolution = device_resolution.value; - old_rotate = device_rotate.value; - loading.value = false; + let success = false; + try { + const response = await GlobalData.getInstance() + .getCurrentClient() + ?.setSystemGraphics(request); + if (response && response.success) { + success = true; + } + } catch {} + $q.notify({ + color: success ? "positive" : "negative", + icon: success ? "done" : "warning", + message: + $t.t("set system graphics") + + (success ? $t.t("success") : $t.t("fail")) + + "!", + position: "top", + timeout: 2500, + }); + loading.value = false; + }; + if (device_resolution_type.value?.toUpperCase() == "CUSTOM") { + $q.dialog({ + title: $t.t("use custom output"), + message: + $t.t("are you sure to use the timing force output") + + "?" + + "\n" + + $t.t("the screen output may be abnormal") + + "!", + cancel: true, + persistent: true, + }).onOk(_apply_graphics); + } else { + _apply_graphics(); + } }; const applyOther = async () => { @@ -1112,7 +1173,7 @@ export default defineComponent({ if (old_output_audio_card != request.output_audio_card) { try { $q.dialog({ - title: "Confirm", + title: $t.t("Confirm"), message: $t.t( "the sound card takes effect only after it is restarted. Restart the system" @@ -1227,6 +1288,9 @@ export default defineComponent({ device_rotate_options, device_resolution, device_resolution_options, + device_resolution_type, + device_resolution_type_options, + device_resolution_timing, output_board_resolution, output_board_resolution_options, output_audio_card, @@ -1287,6 +1351,15 @@ export default defineComponent({ isMacAddress(str: string) { return /([A-Fa-f0-9]{2}:){5}[A-Fa-f0-9]{2}/.test(str); }, + checkResolution(str: string) { + const reg = /([0-9]{1,5})[x|X]([0-9]{1,5}@[0-9]{1,3}$)/; + return ( + reg.test(str) || + $t.t("the resolution format is incorrect,") + + $t.t("for example: ") + + "1920x1080@60" + ); + }, }; }, }); diff --git a/src/components/UpgradeDialog.vue b/src/components/UpgradeDialog.vue index 6cf99ef..61eaf69 100644 --- a/src/components/UpgradeDialog.vue +++ b/src/components/UpgradeDialog.vue @@ -211,7 +211,7 @@ export default defineComponent({ ? uploader_software.value : uploader_rootfs.value; $q.dialog({ - title: "Confirm", + title: $t.t("Confirm"), message: $t.t("use this file to upgrade") + "?", cancel: true, persistent: true, diff --git a/src/entities/ApplicationConfigEntity.ts b/src/entities/ApplicationConfigEntity.ts index 7f87bac..72c0116 100644 --- a/src/entities/ApplicationConfigEntity.ts +++ b/src/entities/ApplicationConfigEntity.ts @@ -25,4 +25,5 @@ export default class ApplicationConfigEntity { output_audio_card: string = ""; application_data_dir: string = ""; runtime_os: string = ""; + registered: boolean = false; } diff --git a/src/entities/WSProtocol.ts b/src/entities/WSProtocol.ts index f4fe34b..3d02544 100644 --- a/src/entities/WSProtocol.ts +++ b/src/entities/WSProtocol.ts @@ -1503,7 +1503,9 @@ export namespace Protocol { contrast: number = 100; hue: number = 100; rotate: number = 0; - device_resolution: string = "3840x2160@60"; + target_resolution_type: string = "EDID"; + device_resolution_name: string = "3840x2160@60"; + target_resolution_timing: string = ""; constructor(rcp_id?: number) { super(); @@ -1513,8 +1515,7 @@ export namespace Protocol { } export class SetSystemGraphicsResponseEntity extends Protocol.PacketEntity { - timestamp = new Date().getMilliseconds(); - + success: boolean = false; constructor() { super(); this.command = Protocol.Commands.kRpcSetSystemGraphics; @@ -1557,10 +1558,18 @@ export namespace Protocol { } } + export class TargetResolutionEntity { + type: string = "EDID"; + name: string = "3840X2160@30"; + timing: string = ""; + } export class GetSupportResolutionsResponseEntity extends Protocol.PacketEntity { device_support_resolutions: Object = {}; current_device_resolution: string = ""; - + screen_width = 0; + screen_height = 0; + screen_refresh_rate = 0; + target_resolution: TargetResolutionEntity = new TargetResolutionEntity(); constructor() { super(); this.command = Protocol.Commands.kRpcGetSupportResolutions; diff --git a/src/i18n/zh-CN/index.ts b/src/i18n/zh-CN/index.ts index e89904c..903d023 100644 --- a/src/i18n/zh-CN/index.ts +++ b/src/i18n/zh-CN/index.ts @@ -350,4 +350,20 @@ export default { SS: "秒", "open window": "开窗", "replace window": "替换窗口", + custom: "自定义", + "force output": "强制输出", + "output type": "输出类型", + "current real resolution": "当前真实分辨率", + "target resolution": "目标分辨率", + "for example: ": "例: ", + "the resolution format is incorrect,": "分辨率格式错误", + "timing sequence": "时序", + "use custom output": "使用自定义时序", + "are you sure to use the timing force output": "确定使用当前时序强制输出吗", + "the screen output may be abnormal": "错误的时序可能导致画面输出异常", + "depending on the display device, the actual output resolution may differ from the target resolution": + "由于显示设备的不同，实际输出分辨率可能与目标分辨率有出入", + or: "或者", + "not registered": "未注册", + register: "注册", }; diff --git a/src/pages/Index.vue b/src/pages/Index.vue index e37bcab..728a488 100644 --- a/src/pages/Index.vue +++ b/src/pages/Index.vue @@ -59,6 +59,41 @@ export default defineComponent({ GlobalData.getInstance().getCurrentClientName() ); + const checkRegistered = () => { + let register: any = + GlobalData.getInstance().applicationConfig?.registered; + try { + register = JSON.parse(register); + } catch { + register = false; + } + if (!register) { + $q.notify({ + color: "negative", + icon: "report_problem", + message: + "" + + $t.t("not registered") + + "!!!" + + "", + position: "center", + actions: [ + { + label: $t.t("register"), + color: "blue", + handler: () => { + // TODO show register dialog + console.log("show register dialog"); + }, + }, + ], + html: true, + timeout: 2500, + }); + } + }; + setInterval(checkRegistered, 5000); + return {}; }, }); diff --git a/src/pages/WallPage.vue b/src/pages/WallPage.vue index 6900df7..829ad14 100644 --- a/src/pages/WallPage.vue +++ b/src/pages/WallPage.vue @@ -255,7 +255,8 @@ export default defineComponent({ wall?.value?.parentElement?.offsetWidth ?? 0 / wall_cols.value; if (wall.value && wall.value.parentElement) { const wv_scaler = - $store.state.device_screen_width / $store.state.device_screen_height; + /*$store.state.device_screen_width / $store.state.device_screen_height*/ 1920 / + 1080; item_height.value = wall.value.parentElement.offsetWidth / wv_scaler / wall_rows.value; } else { diff --git a/src/store/index.ts b/src/store/index.ts index c3abb37..009612a 100644 --- a/src/store/index.ts +++ b/src/store/index.ts @@ -278,9 +278,9 @@ export default store(function (/* { ssrContext } */) { plan_tree: [], wall_col: 1, wall_row: 1, - device_screen_width: 1920, - device_screen_height: 1080, - device_screen_refresh_rate: 60, + device_screen_width: 0, + device_screen_height: 0, + device_screen_refresh_rate: 0, device_screen_connect_state: true, windows: [], windows_sort: [],