Merge branch 'develop'

src-tauri/nsis/template.nsi

@@ -170,113 +170,6 @@ Function PageLeaveChooseLanguage
     ${EndIf}
 FunctionEnd
 
-; 4-2. Page Download Translate Model Weight
-Var DropListCTranslate2DownloadWeightType
-Var SelectedCTranslate2DownloadWeightType
-Var DialogTranslate
-Page custom PageTranslate PageLeaveTranslate
-Function PageTranslate
-    !insertmacro MUI_HEADER_TEXT "Initial Settings" "Set to use the translation function (can be changed later)."
-    nsDialogs::Create 1018
-    Pop $DialogTranslate
-
-    ${If} $DialogTranslate == error
-        Abort
-    ${EndIf}
-
-    ${NSD_CreateLabel} 0 21u 33% 12u "Select AI Model Size"
-    ${NSD_CreateDropList} 33% 20u 40% 12u ""
-    Pop $DropListCTranslate2DownloadWeightType
-    ${NSD_CB_AddString} $DropListCTranslate2DownloadWeightType "Basic model(418MB)"
-    ${NSD_CB_AddString} $DropListCTranslate2DownloadWeightType "High accuracy model(1.3GB)"
-    ${NSD_CB_SelectString} $DropListCTranslate2DownloadWeightType "Basic model(418MB)"
-    StrCpy $SelectedCTranslate2DownloadWeightType "small"
-    nsDialogs::Show
-FunctionEnd
-
-Function PageLeaveTranslate
-    ${NSD_GetText} $CheckboxCTranslate2DownloadWeight $0
-    ${If} "Basic model(418MB)" == $0
-        StrCpy $SelectedCTranslate2DownloadWeightType "small"
-    ${ElseIf} "High accuracy model(1.3GB)" == $0
-        StrCpy $SelectedCTranslate2DownloadWeightType "large"
-    ${EndIf}
-FunctionEnd
-
-; 4-3. Page Download Transcript Model Weight
-Var DropLListTranscriptEngines
-Var SelectedTranscriptEngine
-Var DropListWhisperDownloadWeightType
-Var SelectedWhisperDownloadWeightType
-Var DialogTranscript
-Page custom PageTranscript PageLeaveTranscript
-Function PageTranscript
-    !insertmacro MUI_HEADER_TEXT "Initial Settings" "Set to use the transcript engine (can be changed later)."
-    nsDialogs::Create 1018
-    Pop $DialogTranscript
-
-    ${If} $DialogTranscript == error
-        Abort
-    ${EndIf}
-
-    ${NSD_CreateLabel} 0 21u 33% 12u "Select Transcript Engine"
-    ${NSD_CreateDropList} 33% 20u 33% 12u ""
-    Pop $DropLListTranscriptEngines
-    ${NSD_CB_AddString} $DropLListTranscriptEngines "Google"
-    ${NSD_CB_AddString} $DropLListTranscriptEngines "Wishper"
-    ${NSD_CB_SelectString} $DropLListTranscriptEngines "Google"
-    ${NSD_CreateLabel} 0 52u 33% 12u "Select AI Model Size"
-    ${NSD_CreateDropList} 33% 50u 40% 12u ""
-    Pop $DropListWhisperDownloadWeightType
-    ${NSD_CB_AddString} $DropListWhisperDownloadWeightType "tiny model(74.5MB)"
-    ${NSD_CB_AddString} $DropListWhisperDownloadWeightType "base model(141MB)"
-    ${NSD_CB_AddString} $DropListWhisperDownloadWeightType "small model(463MB)"
-    ${NSD_CB_AddString} $DropListWhisperDownloadWeightType "medium model(1.42GB)"
-    ${NSD_CB_AddString} $DropListWhisperDownloadWeightType "large-v1 model(2.87GB)"
-    ${NSD_CB_AddString} $DropListWhisperDownloadWeightType "large-v2 model(2.87GB)"
-    ${NSD_CB_AddString} $DropListWhisperDownloadWeightType "large-v3 model(2.87GB)"
-    ${NSD_CB_SelectString} $DropListWhisperDownloadWeightType "base model(141MB)"
-
-    StrCpy $SelectedWhisperDownloadWeightType "base"
-    EnableWindow $DropListWhisperDownloadWeightType 0
-    ${NSD_OnChange} $DropLListTranscriptEngines OnDropListWishperDownloadWeightClick
-    nsDialogs::Show
-FunctionEnd
-
-Function PageLeaveTranscript
-    ${NSD_GetText} $DropLListTranscriptEngines $0
-    ${If} $0 == "Google"
-        StrCpy $SelectedTranscriptEngine "Google"
-    ${Else}
-        StrCpy $SelectedTranscriptEngine "Wishper"
-    ${EndIf}
-    ${NSD_GetText} $DropListWhisperDownloadWeightType $0
-    ${If} "tiny model(74.5MB)" == $0
-        StrCpy $SelectedWhisperDownloadWeightType "tiny"
-    ${ElseIf} "base model(141MB)" == $0
-        StrCpy $SelectedWhisperDownloadWeightType "base"
-    ${ElseIf} "small model(463MB)" == $0
-        StrCpy $SelectedWhisperDownloadWeightType "small"
-    ${ElseIf} "medium model(1.42GB)" == $0
-        StrCpy $SelectedWhisperDownloadWeightType "medium"
-    ${ElseIf} "large-v1 model(2.87GB)" == $0
-        StrCpy $SelectedWhisperDownloadWeightType "large-v1"
-    ${ElseIf} "large-v2 model(2.87GB)" == $0
-        StrCpy $SelectedWhisperDownloadWeightType "large-v2"
-    ${ElseIf} "large-v3 model(2.87GB)" == $0
-        StrCpy $SelectedWhisperDownloadWeightType "large-v3"
-    ${EndIf}
-FunctionEnd
-
-Function OnDropListWishperDownloadWeightClick
-    ${NSD_GetText} $DropLListTranscriptEngines $0
-    ${If} $0 == "Wishper"
-        EnableWindow $DropListWhisperDownloadWeightType 1
-    ${Else}
-        EnableWindow $DropListWhisperDownloadWeightType 0
-    ${EndIf}
-FunctionEnd
-
 !insertmacro MUI_PAGE_COMPONENTS
 
 ; 4-4. Custom page to ask user if he wants to reinstall/uninstall
@@ -796,7 +689,7 @@ Function .onInstSuccess
       nsis_tauri_utils::RunAsUser "$INSTDIR\${MAINBINARYNAME}.exe" "$R0"
   run_done:
 
-  StrCpy $1 '{"UI_LANGUAGE": "$SelectedLangage", "SELECTED_TRANSCRIPTION_ENGINE": "$SelectedTranscriptEngine", "CTRANSLATE2_WEIGHT_TYPE": "$SelectedCTranslate2DownloadWeightType", "WHISPER_WEIGHT_TYPE": "$SelectedWhisperDownloadWeightType"}'
+  StrCpy $1 '{"UI_LANGUAGE": "$SelectedLangage"}'
   FileOpen $0 "$INSTDIR\config.json" w
   FileWrite $0 $1
   FileClose $0

src-ui/app/_index_css/root.css

@@ -42,4 +42,9 @@ svg {
 
 p {
     white-space: pre-wrap;
+}
+img {
+    user-select: none;
+    -webkit-user-drag: none;
+    -webkit-user-select: none;
 }

src-ui/app/config_page/setting_section/setting_box/_components/compute_device/ComputeDevice.jsx

@@ -0,0 +1,27 @@
+import styles from "./ComputeDevice.module.scss";
+import { DropdownMenu } from "../dropdown_menu/DropdownMenu";
+import { ActionButton } from "../action_button/ActionButton";
+import HelpSvg from "@images/help.svg?react";
+import { useStore_OpenedQuickSetting } from "@store"
+
+export const ComputeDevice = (props) => {
+    const { updateOpenedQuickSetting } = useStore_OpenedQuickSetting();
+
+    const onClickFunction = () => {
+        updateOpenedQuickSetting("update_software");
+    };
+
+    return (
+        <div className={styles.container}>
+            <DropdownMenu
+                {...props}
+                is_disabled={true}
+            />
+            <ActionButton
+                {...props}
+                IconComponent={HelpSvg}
+                onclickFunction={onClickFunction}
+            />
+        </div>
+    );
+};

src-ui/app/config_page/setting_section/setting_box/_components/compute_device/ComputeDevice.module.scss

@@ -0,0 +1,6 @@
+.container {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    gap: 2rem;
+}

src-ui/app/config_page/setting_section/setting_box/_components/index.js

@@ -1,4 +1,5 @@
 export { ActionButton } from "./action_button/ActionButton";
+export { ComputeDevice } from "./compute_device/ComputeDevice";
 export { DeeplAuthKey, OpenWebpage_DeeplAuthKey } from "./deepl_auth_key/DeeplAuthKey";
 export { DropdownMenu } from "./dropdown_menu/DropdownMenu";
 export { Entry } from "./entry/Entry";

src-ui/app/config_page/setting_section/setting_box/_templates/Templates.jsx

@@ -12,6 +12,7 @@ import {
     OpenWebpage_DeeplAuthKey,
     DeeplAuthKey,
     ActionButton,
+    ComputeDevice,
     WordFilter,
     WordFilterListToggleComponent,
     DownloadModels,
@@ -99,6 +100,10 @@ export const ActionButtonContainer = (props) => (
     <CommonContainer Component={ActionButton} {...props} add_break_point={false}/>
 );
 
+export const ComputeDeviceContainer = (props) => (
+    <CommonContainer Component={ComputeDevice} {...props} />
+);
+
 export const WordFilterContainer = (props) => (
     <div className={styles.word_filter_container}>
         <div className={styles.word_filter_switch_section}>

src-ui/app/config_page/setting_section/setting_box/advanced_settings/AdvancedSettings.jsx

@@ -96,6 +96,7 @@ const OpenConfigFolderContainer = () => {
     );
 };
 
+// Duplicate
 import { useStore_OpenedQuickSetting } from "@store";
 const OpenSwitchComputeDeviceModalContainer = () => {
     const { t } = useTranslation();

src-ui/app/config_page/setting_section/setting_box/transcription/Transcription.jsx

@@ -26,6 +26,7 @@ import {
     DownloadModelsContainer,
     RadioButtonContainer,
     DropdownMenuContainer,
+    ComputeDeviceContainer,
 } from "../_templates/Templates";
 
 import {
@@ -326,6 +327,9 @@ const WhisperWeightType_Box = () => {
     );
 };
 
+
+// Duplicate
+import { useComputeMode } from "@logics_common";
 const WhisperComputeDevice_Box = () => {
     const { t } = useTranslation();
     const { currentSelectedWhisperComputeDevice, setSelectedWhisperComputeDevice } = useSelectedWhisperComputeDevice();
@@ -341,6 +345,19 @@ const WhisperComputeDevice_Box = () => {
     const target_index = findKeyByDeviceValue(currentSelectableWhisperComputeDeviceList.data, currentSelectedWhisperComputeDevice.data);
 
 
+    const { currentComputeMode } = useComputeMode();
+    if (currentComputeMode.data === "cpu") {
+        return (
+            <ComputeDeviceContainer
+                label={t("config_page.transcription.whisper_compute_device.label")}
+                selected_id={target_index}
+                list={list_for_ui}
+                selectFunction={selectFunction}
+                state={currentSelectedWhisperComputeDevice.state}
+            />
+        )
+    }
+
     return (
         <DropdownMenuContainer
             dropdown_id="whisper_compute_device"

src-ui/app/config_page/setting_section/setting_box/translation/Translation.jsx

@@ -15,6 +15,7 @@ import {
     DownloadModelsContainer,
     DeeplAuthKeyContainer,
     DropdownMenuContainer,
+    ComputeDeviceContainer,
 } from "../_templates/Templates";
 
 export const Translation = () => {
@@ -70,6 +71,8 @@ const CTranslate2WeightType_Box = () => {
     );
 };
 
+// Duplicate
+import { useComputeMode } from "@logics_common";
 const CTranslation2ComputeDevice_Box = () => {
     const { t } = useTranslation();
     const { currentSelectedCTranslate2ComputeDevice, setSelectedCTranslate2ComputeDevice } = useSelectedCTranslate2ComputeDevice();
@@ -84,6 +87,20 @@ const CTranslation2ComputeDevice_Box = () => {
 
     const target_index = findKeyByDeviceValue(currentSelectableCTranslate2ComputeDeviceList.data, currentSelectedCTranslate2ComputeDevice.data);
 
+
+    const { currentComputeMode } = useComputeMode();
+    if (currentComputeMode.data === "cpu") {
+        return (
+            <ComputeDeviceContainer
+                label={t("config_page.translation.ctranslate2_compute_device.label")}
+                selected_id={target_index}
+                list={list_for_ui}
+                selectFunction={selectFunction}
+                state={currentSelectedCTranslate2ComputeDevice.state}
+            />
+        )
+    }
+
     return (
         <DropdownMenuContainer
             dropdown_id="ctranslate2_compute_device"

src-ui/app/main_page/main_section/top_bar/right_side_components/RightSideComponents.jsx

@@ -15,10 +15,10 @@ export const RightSideComponents = () => {
             <OpenOverlayQuickSetting />
             <SoftwareUpdateAvailableButton />
             <a
-            className={styles.help_and_info_button}
+                className={styles.help_and_info_button}
-            href="https://mzsoftware.notion.site/VRCT-Documents-be79b7a165f64442ad8f326d86c22246"
+                href="https://docs.google.com/spreadsheets/d/1_L5i-1U6PB1dnaPPTE_5uKMfqOpkLziPyRkiMLi4mqU/edit?usp=sharing"
-            target="_blank"
+                target="_blank"
-            rel="noreferrer"
+                rel="noreferrer"
             >
                 <HelpSvg className={styles.help_svg} />
             </a>

src-ui/app/splash_component/SplashComponent.jsx

@@ -5,6 +5,7 @@ import { DownloadModelsContainer } from "./download_models_container/DownloadMod
 import MegaphoneSvg from "@images/megaphone.svg?react";
 import XMarkSvg from "@images/cancel.svg?react";
 import { appWindow } from "@tauri-apps/api/window";
+import clsx from "clsx";
 
 export const SplashComponent = () => {
     return (
@@ -17,33 +18,60 @@ export const SplashComponent = () => {
     );
 };
 
-const AnnouncementsContainer = () => {
+const SHOW_MEGAPHONE_TIME = 500;
-    const labels = ["VRCT Real-Time Announcements", "VRCTからのお知らせ"];
-    const [currentLabelIndex, setCurrentLabelIndex] = useState(0);
 
+const AnnouncementsContainer = () => {
+    const labels = ["Check the Latest Status", "最新の状況を確認"];
+    const [is_shown, setIsShown] = useState(0);
+    const [currentLabelIndex, setCurrentLabelIndex] = useState(0);
+    const [is_labels_active, setIsLabelsActive] = useState(false);
 
     useEffect(() => {
-        const labelInterval = setInterval(() => {
+        const showTimeout = setTimeout(() => {
-            setCurrentLabelIndex((prevIndex) => (prevIndex + 1) % labels.length);
+            setIsShown(true);
-        }, 6000);
+        }, SHOW_MEGAPHONE_TIME);
-        return () => clearInterval(labelInterval);
+
-    }, [labels.length]);
+        const labelsTimeout = setTimeout(() => {
+            setIsLabelsActive(true);
+        }, SHOW_MEGAPHONE_TIME + 15000);
+
+        let labelInterval;
+        if (is_labels_active) {
+            labelInterval = setInterval(() => {
+                setCurrentLabelIndex((prevIndex) => (prevIndex + 1) % labels.length);
+            }, 4000);
+        }
+
+        return () => {
+            clearTimeout(showTimeout);
+            clearTimeout(labelsTimeout);
+            if (labelInterval) clearInterval(labelInterval);
+        };
+    }, [is_labels_active, labels.length]);
+
 
     return (
         <a
+            className={clsx(styles.announcements_button_wrapper, {
+                [styles.is_shown]: is_shown,
+                [styles.is_labels_active]: is_labels_active,
+            })}
             href="https://docs.google.com/spreadsheets/d/1_L5i-1U6PB1dnaPPTE_5uKMfqOpkLziPyRkiMLi4mqU/edit?usp=sharing"
             target="_blank"
             rel="noreferrer"
         >
             <button className={styles.announcements_button}>
                 <MegaphoneSvg className={styles.announcements_link_svg} />
-                <p className={styles.announcements_label}>{labels[currentLabelIndex]}</p>
+                <p className={styles.announcements_label}>
+                    {labels[currentLabelIndex]}
+                </p>
             </button>
         </a>
     );
 };
 
 
+
 const CloseButtonContainer = () => {
     const close = () => {
         appWindow.close();

src-ui/app/splash_component/SplashComponent.module.scss

@@ -5,31 +5,65 @@
     position: relative;
 }
 
-.announcements_button {
+.announcements_button_wrapper {
     position: absolute;
-    top: 16px;
+    top: 10px;
-    left: 20px;
+    left: 10px;
-    border: 1px solid var(--dark_600_color);
+    opacity: 0;
-    display: flex;
+    transition: opacity 0.3s ease, border 0.3s ease;
-    justify-content: center;
+    padding: 4px 8px;
-    align-items: center;
-    gap: 6px;
-    padding: 6px 8px;
     border-radius: 4px;
+    &.is_shown {
+        opacity: 1;
+    }
+    &.is_labels_active {
+        & .announcements_label {
+            display: block;
+            animation: appear .3s ease;
+        }
+        & .announcements_link_svg {
+            color: var(--dark_basic_text_color);
+        }
+    }
     &:hover {
-        background-color: var(--dark_750_color);
+        background-color: var(--dark_825_color);
+        & .announcements_label {
+            color: var(--dark_basic_text_color);
+        }
+        & .announcements_link_svg {
+            color: var(--primary_300_color);
+        }
     }
     &:active {
         background-color: var(--dark_850_color);
     }
+}
+
+@keyframes appear {
+    0% {
+        opacity: 0;
+    }
+    100% {
+        opacity: 1;
+    }
+}
+.announcements_button {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    gap: 8px;
     transition: all 0.1s ease;
 }
 
 .announcements_label {
     font-size: 12px;
+    color: var(--dark_400_color);
+    display: none;
+    transition: all 0.3s ease;
 }
 .announcements_link_svg {
     width: 20px;
+    color: var(--dark_600_color);
 }