146 lines
5.2 KiB
Plaintext
146 lines
5.2 KiB
Plaintext
@page "/"
|
|
@using PoyoLang.Translator
|
|
@inject PoyoLangTranslator Translator
|
|
@inject IJSRuntime JsRuntime
|
|
@inject ISnackbar Snackbar
|
|
|
|
<PageTitle>PoyoLang Translator</PageTitle>
|
|
|
|
<MudText Typo="Typo.h3" GutterBottom="true" Class="mt-5">PoyoLang Translator</MudText>
|
|
<MudText Class="mb-5">Using this website you can freely translate from and to the Poyo language.
|
|
This language only use variations of the word "poyo" (320 of them!) to write sentences using the latin alphabet.
|
|
If you want more information about how this language works and how it is possible to translate to and from it,
|
|
check out the <MudLink href="https://git.ilysix.fr/Eveldee/PoyoLang" Target="_blank">source code</MudLink> of this whole project.</MudText>
|
|
|
|
<MudToggleGroup T="string" @bind-Value="_sourceLanguage" @bind-Value:after="SourceLanguageUpdated"
|
|
SelectionMode="SelectionMode.SingleSelection" Color="Color.Primary" CheckMark="true" FixedContent="true"
|
|
Class="mb-1" Style="max-width: 30em;">
|
|
<MudToggleItem Value="EnglishSourceLanguage" Text="English" />
|
|
<MudToggleItem Value="PoyoSourceLanguage" Text="Poyo" />
|
|
</MudToggleGroup>
|
|
|
|
@* Wide screen display *@
|
|
<MudHidden Breakpoint="Breakpoint.MdAndUp" Invert="true">
|
|
<MudStack Row="true" StretchItems="StretchItems.StartAndEnd" Class=".d-none .d-md-flex">
|
|
<MudStack>
|
|
<MudTextField @bind-Value="_sourceText" @bind-Value:after="UpdateTranslatedText" DebounceInterval="500"
|
|
Variant="Variant.Outlined" Label="Source text" Lines="15" />
|
|
</MudStack>
|
|
|
|
<MudStack Spacing="1" Row="false">
|
|
<MudTooltip Text="Swap languages">
|
|
<MudIconButton Icon="@Icons.Material.Filled.SwapHoriz" Color="Color.Primary" OnClick="SwapArrowClicked"/>
|
|
</MudTooltip>
|
|
|
|
<MudTooltip Text="Copy translation result">
|
|
<MudIconButton Icon="@Icons.Material.Filled.ContentCopy" Color="Color.Primary" OnClick="CopyResultClicked"/>
|
|
</MudTooltip>
|
|
|
|
<MudTooltip Text="Clear source text">
|
|
<MudIconButton Icon="@Icons.Material.Filled.Clear" Color="Color.Error" OnClick="ClearButtonClicked"/>
|
|
</MudTooltip>
|
|
</MudStack>
|
|
|
|
<MudStack>
|
|
<MudTextField @bind-Value="_translatedText" ReadOnly="true"
|
|
Variant="Variant.Outlined" Label="Translation result" Lines="15" />
|
|
</MudStack>
|
|
</MudStack>
|
|
</MudHidden>
|
|
|
|
@* Mobile display *@
|
|
<MudHidden Breakpoint="Breakpoint.MdAndUp">
|
|
<MudStack Row="false" StretchItems="StretchItems.StartAndEnd">
|
|
<MudStack>
|
|
<MudTextField @bind-Value="_sourceText" @bind-Value:after="UpdateTranslatedText" DebounceInterval="500"
|
|
Variant="Variant.Outlined" Label="Source text" Lines="15" />
|
|
</MudStack>
|
|
|
|
<MudStack Spacing="1" Row="true">
|
|
<MudTooltip Text="Swap languages">
|
|
<MudIconButton Icon="@Icons.Material.Filled.SwapHoriz" Color="Color.Primary" OnClick="SwapArrowClicked"/>
|
|
</MudTooltip>
|
|
|
|
<MudTooltip Text="Copy translation result">
|
|
<MudIconButton Icon="@Icons.Material.Filled.ContentCopy" Color="Color.Primary" OnClick="CopyResultClicked"/>
|
|
</MudTooltip>
|
|
|
|
<MudTooltip Text="Clear source text">
|
|
<MudIconButton Icon="@Icons.Material.Filled.Clear" Color="Color.Error" OnClick="ClearButtonClicked"/>
|
|
</MudTooltip>
|
|
</MudStack>
|
|
|
|
<MudStack>
|
|
<MudTextField @bind-Value="_translatedText" ReadOnly="true"
|
|
Variant="Variant.Outlined" Label="Translation result" Lines="15" />
|
|
</MudStack>
|
|
</MudStack>
|
|
</MudHidden>
|
|
|
|
@code {
|
|
|
|
private const string EnglishSourceLanguage = "English";
|
|
private const string PoyoSourceLanguage = "PoyoLang";
|
|
|
|
private string _sourceText = "";
|
|
private string _translatedText = "";
|
|
private string _sourceLanguage = EnglishSourceLanguage;
|
|
|
|
protected override void OnInitialized()
|
|
{
|
|
Snackbar.Configuration.PositionClass = Defaults.Classes.Position.BottomCenter;
|
|
}
|
|
|
|
private void SourceLanguageUpdated()
|
|
{
|
|
UpdateTranslatedText();
|
|
}
|
|
|
|
private void SwapArrowClicked()
|
|
{
|
|
_sourceLanguage = _sourceLanguage switch
|
|
{
|
|
PoyoSourceLanguage => EnglishSourceLanguage,
|
|
_ => PoyoSourceLanguage
|
|
};
|
|
|
|
SwapLanguages();
|
|
}
|
|
|
|
private void SwapLanguages()
|
|
{
|
|
_sourceText = _translatedText;
|
|
|
|
UpdateTranslatedText();
|
|
}
|
|
|
|
private void UpdateTranslatedText()
|
|
{
|
|
string result;
|
|
|
|
if (_sourceLanguage is PoyoSourceLanguage)
|
|
{
|
|
result = Translator.TranslateFromPoyo(_sourceText);
|
|
}
|
|
else
|
|
{
|
|
result = Translator.TranslateToPoyo(_sourceText);
|
|
}
|
|
|
|
_translatedText = result;
|
|
}
|
|
|
|
private async Task CopyResultClicked()
|
|
{
|
|
await JsRuntime.InvokeVoidAsync("navigator.clipboard.writeText", _translatedText);
|
|
|
|
Snackbar.Add("Translation result copied to clipboard!", Severity.Info);
|
|
}
|
|
|
|
private void ClearButtonClicked()
|
|
{
|
|
_sourceText = string.Empty;
|
|
_translatedText = string.Empty;
|
|
}
|
|
|
|
} |