UPD: Externalize strings
This commit is contained in:
50
src/App.vue
50
src/App.vue
@@ -72,7 +72,7 @@ const state = reactive({ count: 12 })
|
|||||||
|
|
||||||
<main>
|
<main>
|
||||||
|
|
||||||
<div class="w-screen select-none ">
|
<div class="select-none ">
|
||||||
<div class="flex">
|
<div class="flex">
|
||||||
<Menubar class="w-full rounded-none bg-zinc-950">
|
<Menubar class="w-full rounded-none bg-zinc-950">
|
||||||
<MenubarMenu>
|
<MenubarMenu>
|
||||||
@@ -520,7 +520,8 @@ const state = reactive({ count: 12 })
|
|||||||
<CommandEmpty>{{ $t('config_options.mapping_configuration.key_mapping.not_found') }}
|
<CommandEmpty>{{ $t('config_options.mapping_configuration.key_mapping.not_found') }}
|
||||||
|
|
||||||
</CommandEmpty>
|
</CommandEmpty>
|
||||||
<CommandInput :placeholder="$t('config_options.mapping_configuration.key_mapping.search_placeholder')" />
|
<CommandInput
|
||||||
|
:placeholder="$t('config_options.mapping_configuration.key_mapping.search_placeholder')" />
|
||||||
<CommandGroup heading="Common">
|
<CommandGroup heading="Common">
|
||||||
<CommandItem value="backspace">
|
<CommandItem value="backspace">
|
||||||
<Squircle color="grey" class="w-4 h-4 mr-2" />
|
<Squircle color="grey" class="w-4 h-4 mr-2" />
|
||||||
@@ -596,7 +597,8 @@ const state = reactive({ count: 12 })
|
|||||||
<GaugeCircle class="h-4 w-4" />
|
<GaugeCircle class="h-4 w-4" />
|
||||||
</div>
|
</div>
|
||||||
<div class="grow">
|
<div class="grow">
|
||||||
<h2 class="text-sm px-2 py-4">{{ $t('config_options.mapping_configuration.knob_mapping.title') }}</h2>
|
<h2 class="text-sm px-2 py-4">{{ $t('config_options.mapping_configuration.knob_mapping.title')
|
||||||
|
}}</h2>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex-none">
|
<div class="flex-none">
|
||||||
<Toggle
|
<Toggle
|
||||||
@@ -699,10 +701,10 @@ const state = reactive({ count: 12 })
|
|||||||
|
|
||||||
<div class="space-y-1 p-6">
|
<div class="space-y-1 p-6">
|
||||||
<h1 class="leading-none text-lg">
|
<h1 class="leading-none text-lg">
|
||||||
Program Settings
|
{{ $t('config_options.program_settings.title') }}
|
||||||
</h1>
|
</h1>
|
||||||
<p class="text-xs text-muted-foreground">
|
<p class="text-xs text-muted-foreground">
|
||||||
Create or tune device haptic response
|
{{ $t('config_options.program_settings.subtitle') }}
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
@@ -714,7 +716,8 @@ const state = reactive({ count: 12 })
|
|||||||
<div class="flex-none">
|
<div class="flex-none">
|
||||||
<Cable class="h-4 w-4" />
|
<Cable class="h-4 w-4" />
|
||||||
</div>
|
</div>
|
||||||
<div clas="flex-initial"><h2 class="text-sm px-2 py-4">Connection Type</h2></div>
|
<div class="flex-initial"><h2 class="text-sm px-2 py-4">
|
||||||
|
{{ $t('config_options.program_settings.connection_type.title') }}</h2></div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<Separator />
|
<Separator />
|
||||||
@@ -724,21 +727,21 @@ const state = reactive({ count: 12 })
|
|||||||
<TabsTrigger value="fd">
|
<TabsTrigger value="fd">
|
||||||
<div class="grid grid-flow-row auto-rows-max justify-items-center ">
|
<div class="grid grid-flow-row auto-rows-max justify-items-center ">
|
||||||
<div class="w-24 size-w mb-2">
|
<div class="w-24 size-w mb-2">
|
||||||
<img src="@/assets/gui-ico/ico-usb-logo.svg" />
|
<img src="@/assets/gui-ico/ico-usb-logo.svg" alt="usb-logo" />
|
||||||
</div>
|
</div>
|
||||||
<span class="text-xs leading-3 text-wrap">
|
<span
|
||||||
USB (Virtual HID)
|
class="text-xs leading-3 text-wrap">{{ $t('config_options.program_settings.connection_type.usb')
|
||||||
</span>
|
}}</span>
|
||||||
</div>
|
</div>
|
||||||
</TabsTrigger>
|
</TabsTrigger>
|
||||||
<TabsTrigger value="cd">
|
<TabsTrigger value="cd">
|
||||||
<div class="grid grid-flow-row auto-rows-max justify-items-center">
|
<div class="grid grid-flow-row auto-rows-max justify-items-center">
|
||||||
<div class="w-24 size-w mb-2">
|
<div class="w-24 size-w mb-2">
|
||||||
<img src="@/assets/gui-ico/ico-midi-logo.svg" />
|
<img src="@/assets/gui-ico/ico-midi-logo.svg" alt="midi-logo" />
|
||||||
</div>
|
</div>
|
||||||
<span class="text-xs leading-3 text-wrap">
|
<span class="text-xs leading-3 text-wrap">
|
||||||
Standalone MIDI I/O
|
{{ $t('config_options.program_settings.connection_type.midi') }}
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
</TabsTrigger>
|
</TabsTrigger>
|
||||||
</TabsList>
|
</TabsList>
|
||||||
@@ -754,7 +757,7 @@ const state = reactive({ count: 12 })
|
|||||||
<Type class="h-4 w-4" />
|
<Type class="h-4 w-4" />
|
||||||
</div>
|
</div>
|
||||||
<div class="grow">
|
<div class="grow">
|
||||||
<h2 class="text-sm px-2 py-4">Profile Properties</h2>
|
<h2 class="text-sm px-2 py-4">{{ $t('config_options.program_settings.profile_properties.title') }}</h2>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
@@ -762,9 +765,9 @@ const state = reactive({ count: 12 })
|
|||||||
<Separator />
|
<Separator />
|
||||||
|
|
||||||
<div class="flex flex-col p-8 py-4">
|
<div class="flex flex-col p-8 py-4">
|
||||||
<span class="text-sm text-muted-foreground font-mono pb-4">Program Name</span>
|
<span class="text-sm text-muted-foreground font-mono pb-4">{{ $t('config_options.program_settings.profile_properties.program_name') }}</span>
|
||||||
<Input
|
<Input
|
||||||
type="text" placeholder="Program Name"
|
type="text" :placeholder="$t('config_options.program_settings.profile_properties.program_name')"
|
||||||
class="text-xl border-0 text-center border-b rounded-none focus-visible:ring-0 focus-visible:border-emerald-500 font-pixelsm uppercase"
|
class="text-xl border-0 text-center border-b rounded-none focus-visible:ring-0 focus-visible:border-emerald-500 font-pixelsm uppercase"
|
||||||
default-value="Oscillator 1" maxlength="20" />
|
default-value="Oscillator 1" maxlength="20" />
|
||||||
|
|
||||||
@@ -772,15 +775,15 @@ const state = reactive({ count: 12 })
|
|||||||
</div>
|
</div>
|
||||||
<Separator />
|
<Separator />
|
||||||
<div class="flex flex-col p-8 py-4">
|
<div class="flex flex-col p-8 py-4">
|
||||||
<span class="text-sm text-muted-foreground font-mono pb-4">Program Description</span>
|
<span class="text-sm text-muted-foreground font-mono pb-4">{{ $t('config_options.program_settings.profile_properties.program_description') }}</span>
|
||||||
<Textarea
|
<Textarea
|
||||||
class="text-lg px-3 bg-inherit text-center focus-visible:outline-none border-b focus-visible:border-emerald-500 resize-none font-pixelsm text-muted-foreground uppercase"
|
class="text-lg px-3 bg-inherit text-center focus-visible:outline-none border-b focus-visible:border-emerald-500 resize-none font-pixelsm text-muted-foreground uppercase"
|
||||||
placeholder="Program Description" default-value="Adjust Korg Oscillator Waveform " rows="2"
|
:placeholder="$t('config_options.program_settings.profile_properties.program_description')" default-value="Adjust Korg Oscillator Waveform " rows="2"
|
||||||
maxlength="50" />
|
maxlength="50" />
|
||||||
<Label for="textarea" class="text-muted-foreground text-right mt-1 text-xs">24/50</Label>
|
<Label for="textarea" class="text-muted-foreground text-right mt-1 text-xs">24/50</Label>
|
||||||
<div class="flex items-center space-x-4 space-y-1">
|
<div class="flex items-center space-x-4 space-y-1">
|
||||||
<Switch id="airplane-mode" default-checked="true" />
|
<Switch id="airplane-mode" default-checked="true" />
|
||||||
<Label for="airplane-mode" class="text-xs text-muted-foreground">Show Description in GUI</Label>
|
<Label for="airplane-mode" class="text-xs text-muted-foreground">{{ $t('config_options.program_settings.profile_properties.show_description') }}</Label>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<Separator />
|
<Separator />
|
||||||
@@ -790,7 +793,7 @@ const state = reactive({ count: 12 })
|
|||||||
<div class="flex-none">
|
<div class="flex-none">
|
||||||
<Replace class="h-4 w-4" />
|
<Replace class="h-4 w-4" />
|
||||||
</div>
|
</div>
|
||||||
<div class="grow"><h2 class="text-sm px-2 py-4">Internal Profile Toggle</h2></div>
|
<div class="grow"><h2 class="text-sm px-2 py-4">{{ $t('config_options.program_settings.internal_profile_toggle.title') }}</h2></div>
|
||||||
<div class="flex-none">
|
<div class="flex-none">
|
||||||
<Toggle
|
<Toggle
|
||||||
class="data-[state=on]:ring-emerald-600 data-[state=on]:ring-1" variant="outline"
|
class="data-[state=on]:ring-emerald-600 data-[state=on]:ring-1" variant="outline"
|
||||||
@@ -802,13 +805,12 @@ const state = reactive({ count: 12 })
|
|||||||
|
|
||||||
</div>
|
</div>
|
||||||
<p class="flex flex-col p-8 py-4 text-muted-foreground text-xs">
|
<p class="flex flex-col p-8 py-4 text-muted-foreground text-xs">
|
||||||
Hardcoded macro that allows you to quickly toggle between stored profiles , comes handy if you
|
{{ $t('config_options.program_settings.internal_profile_toggle.subtitle') }}
|
||||||
want to operate device in Standalone mode.
|
|
||||||
<Separator class="mt-4" />
|
<Separator class="mt-4" />
|
||||||
<span class="space-y-4">Operation: <Badge class="bg-orange-500">SHIFT</Badge> + <Badge
|
<span class="space-y-4">{{ $t('config_options.program_settings.internal_profile_toggle.operation') }}: <Badge class="bg-orange-500">SHIFT</Badge> + <Badge
|
||||||
class="bg-zinc-500">Fn3</Badge> + <Badge>Rotation</Badge></span>
|
class="bg-zinc-500">Fn3</Badge> + <Badge>Rotation</Badge></span>
|
||||||
<Separator class="my-4" />
|
<Separator class="my-4" />
|
||||||
<span>Warning: Overrides software defined macro if combination is the same</span>
|
<span>{{ $t('config_options.program_settings.internal_profile_toggle.warning') }}</span>
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@@ -4,6 +4,11 @@
|
|||||||
},
|
},
|
||||||
"config_options": {
|
"config_options": {
|
||||||
"feedback_designer": {
|
"feedback_designer": {
|
||||||
|
"auditory_response": {
|
||||||
|
"haptic_level": "Auditory Haptic Level",
|
||||||
|
"magnitude": "Auditory Magnitude",
|
||||||
|
"title": "Auditory Response"
|
||||||
|
},
|
||||||
"feedback_type": {
|
"feedback_type": {
|
||||||
"coarse_detents": "Coarse Detents",
|
"coarse_detents": "Coarse Detents",
|
||||||
"fine_detents": "Fine Detents",
|
"fine_detents": "Fine Detents",
|
||||||
@@ -12,19 +17,14 @@
|
|||||||
"viscous_rotation": "Viscous Rotation"
|
"viscous_rotation": "Viscous Rotation"
|
||||||
},
|
},
|
||||||
"haptic_response": {
|
"haptic_response": {
|
||||||
"title": "Haptic Response",
|
|
||||||
"feedback_strength": "Feedback Strength",
|
|
||||||
"bounce_back_strength": "Bounce Back Strength",
|
"bounce_back_strength": "Bounce Back Strength",
|
||||||
"output_ramp_dampening": "Output Ramp Dampening"
|
"feedback_strength": "Feedback Strength",
|
||||||
|
"output_ramp_dampening": "Output Ramp Dampening",
|
||||||
|
"title": "Haptic Response"
|
||||||
},
|
},
|
||||||
"subtitle": "Feedback mode selector and parameter adjustment",
|
"subtitle": "Feedback mode selector and parameter adjustment",
|
||||||
"title": "Feedback Designer",
|
"title": "Feedback Designer",
|
||||||
"total_positions": "Total Positions",
|
"total_positions": "Total Positions"
|
||||||
"auditory_response": {
|
|
||||||
"title": "Auditory Response",
|
|
||||||
"haptic_level": "Auditory Haptic Level",
|
|
||||||
"magnitude": "Auditory Magnitude"
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
"gui_designer": {
|
"gui_designer": {
|
||||||
"subtitle": "Adjust graphic interface parameters",
|
"subtitle": "Adjust graphic interface parameters",
|
||||||
@@ -35,26 +35,43 @@
|
|||||||
"title": "Light Designer"
|
"title": "Light Designer"
|
||||||
},
|
},
|
||||||
"mapping_configuration": {
|
"mapping_configuration": {
|
||||||
"subtitle": "Assign function to Knob and Keys",
|
|
||||||
"title": "Mapping Configuration",
|
|
||||||
"key_mapping": {
|
"key_mapping": {
|
||||||
"title": "Key Mapping",
|
"not_found": "Key or function not found :(",
|
||||||
|
"search_placeholder": "Find Key, Function or Macro...",
|
||||||
"switch": {
|
"switch": {
|
||||||
"a": "Switch A",
|
"a": "Switch A",
|
||||||
"b": "Switch B",
|
"b": "Switch B",
|
||||||
"c": "Switch C",
|
"c": "Switch C",
|
||||||
"d": "Switch D"
|
"d": "Switch D"
|
||||||
},
|
},
|
||||||
"not_found": "Key or function not found :(",
|
"title": "Key Mapping"
|
||||||
"search_placeholder": "Find Key, Function or Macro..."
|
|
||||||
},
|
},
|
||||||
"knob_mapping": {
|
"knob_mapping": {
|
||||||
"title": "Knob Mapping"
|
"title": "Knob Mapping"
|
||||||
}
|
},
|
||||||
|
"subtitle": "Assign function to Knob and Keys",
|
||||||
|
"title": "Mapping Configuration"
|
||||||
},
|
},
|
||||||
"program_settings": {
|
"program_settings": {
|
||||||
|
"connection_type": {
|
||||||
|
"title": "Connection Type",
|
||||||
|
"usb": "USB (Virtual HID)",
|
||||||
|
"midi": "Standalone MIDI I/O"
|
||||||
|
},
|
||||||
"subtitle": "Operation mode and Profile Naming",
|
"subtitle": "Operation mode and Profile Naming",
|
||||||
"title": "Program Settings"
|
"title": "Program Settings",
|
||||||
|
"profile_properties": {
|
||||||
|
"title": "Profile Properties",
|
||||||
|
"program_name": "Program Name",
|
||||||
|
"program_description": "Program Description",
|
||||||
|
"show_description": "Show Description in GUI"
|
||||||
|
},
|
||||||
|
"internal_profile_toggle": {
|
||||||
|
"title": "Internal Profile Toggle",
|
||||||
|
"subtitle": "Hardcoded macro that allows you to quickly toggle between stored profiles , comes handy if you want to operate device in Standalone mode.",
|
||||||
|
"warning": "Warning: Overrides software defined macro if combination is the same",
|
||||||
|
"operation": "Operation"
|
||||||
|
}
|
||||||
},
|
},
|
||||||
"title": "Configuration Options"
|
"title": "Configuration Options"
|
||||||
},
|
},
|
||||||
|
|||||||
Reference in New Issue
Block a user