Fixed website using new project
This commit is contained in:
BOT Alex
parent
7bac6e3e16
commit
7aa40c171b
237 changed files with 934 additions and 89 deletions
17
LearningChineseFixed/Pages/Counter.razor
Normal file
17
LearningChineseFixed/Pages/Counter.razor
Normal file
|
|
@ -0,0 +1,17 @@
|
|||
@page "/counter"
|
||||
|
||||
<PageTitle>Counter</PageTitle>
|
||||
|
||||
<MudText Typo="Typo.h3" GutterBottom="true">Counter</MudText>
|
||||
<MudText Class="mb-4">Current count: @currentCount</MudText>
|
||||
<MudButton Color="Color.Primary" Variant="Variant.Filled" @onclick="IncrementCount">Click me</MudButton>
|
||||
|
||||
|
||||
@code {
|
||||
private int currentCount = 0;
|
||||
|
||||
private void IncrementCount()
|
||||
{
|
||||
currentCount++;
|
||||
}
|
||||
}
|
||||
52
LearningChineseFixed/Pages/FetchData.razor
Normal file
52
LearningChineseFixed/Pages/FetchData.razor
Normal file
|
|
@ -0,0 +1,52 @@
|
|||
@page "/fetchdata"
|
||||
@inject HttpClient Http
|
||||
@using LearningChineseFixed;
|
||||
|
||||
<PageTitle>Weather forecast</PageTitle>
|
||||
|
||||
<MudText Typo="Typo.h3" GutterBottom="true">Weather forecast</MudText>
|
||||
<MudText Class="mb-8">This component demonstrates fetching data from the server.</MudText>
|
||||
@if (forecasts == null)
|
||||
{
|
||||
<MudProgressCircular Color="Color.Default" Indeterminate="true" />
|
||||
}
|
||||
else
|
||||
{
|
||||
<MudTable Items="forecasts" Hover="true" SortLabel="Sort By" Elevation="0">
|
||||
<HeaderContent>
|
||||
<MudTh><MudTableSortLabel InitialDirection="SortDirection.Ascending" SortBy="new Func<WeatherForecast, object>(x=>x.Date)">Date</MudTableSortLabel></MudTh>
|
||||
<MudTh><MudTableSortLabel SortBy="new Func<WeatherForecast, object>(x=>x.TemperatureC)">Temp. (C)</MudTableSortLabel></MudTh>
|
||||
<MudTh><MudTableSortLabel SortBy="new Func<WeatherForecast, object>(x=>x.TemperatureF)">Temp. (F)</MudTableSortLabel></MudTh>
|
||||
<MudTh><MudTableSortLabel SortBy="new Func<WeatherForecast, object>(x=>x.Summary!)">Summary</MudTableSortLabel></MudTh>
|
||||
</HeaderContent>
|
||||
<RowTemplate>
|
||||
<MudTd DataLabel="Date">@context.Date</MudTd>
|
||||
<MudTd DataLabel="Temp. (C)">@context.TemperatureC</MudTd>
|
||||
<MudTd DataLabel="Temp. (F)">@context.TemperatureF</MudTd>
|
||||
<MudTd DataLabel="Summary">@context.Summary</MudTd>
|
||||
</RowTemplate>
|
||||
<PagerContent>
|
||||
<MudTablePager PageSizeOptions="new int[]{50, 100}" />
|
||||
</PagerContent>
|
||||
</MudTable>
|
||||
}
|
||||
|
||||
|
||||
@code {
|
||||
private WeatherForecast[]? forecasts;
|
||||
|
||||
protected override async Task OnInitializedAsync()
|
||||
{
|
||||
forecasts = await Http.GetFromJsonAsync<WeatherForecast[]>("sample-data/weather.json");
|
||||
}
|
||||
public class WeatherForecast
|
||||
{
|
||||
public DateTime Date { get; set; }
|
||||
|
||||
public int TemperatureC { get; set; }
|
||||
|
||||
public string? Summary { get; set; }
|
||||
|
||||
public int TemperatureF => 32 + (int)(TemperatureC / 0.5556);
|
||||
}
|
||||
}
|
||||
59
LearningChineseFixed/Pages/Index.razor
Normal file
59
LearningChineseFixed/Pages/Index.razor
Normal file
|
|
@ -0,0 +1,59 @@
|
|||
@page "/"
|
||||
@inject NavigationManager navigator
|
||||
@inject HttpClient httpClient
|
||||
@inject Blazored.LocalStorage.ILocalStorageService localStorage
|
||||
|
||||
<PageTitle>Index</PageTitle>
|
||||
|
||||
<MudContainer Class="align-center justify-center d-flex">
|
||||
<MudContainer Style="width: 400px">
|
||||
<MudSelect Class="pt-12" @bind-Value=selectedChunk TextChanged="SelectedChunk" select T=int Label="Chunk" Variant="Variant.Filled" AnchorOrigin="Origin.BottomCenter">
|
||||
@for (int i = 0; i < numOfChunks; i++)
|
||||
{
|
||||
<MudSelectItem T="int" Value="@i" />
|
||||
}
|
||||
</MudSelect>
|
||||
<MudContainer Class="justify-center d-flex pb-16 pt-4">
|
||||
<MudButton Variant="Variant.Filled" OnClick=StartLearning Color="Color.Primary">Start learning!</MudButton>
|
||||
</MudContainer>
|
||||
|
||||
|
||||
<MudContainer Class="justify-center d-flex">
|
||||
@if (Charecters != null)
|
||||
{
|
||||
<MudPaper Class="overflow-scroll rounded-0" Style="height: 60vh;" Elevation="1">
|
||||
<MudDataGrid FixedHeader=true Items="@Charecters">
|
||||
<Columns>
|
||||
<PropertyColumn Property="x => x.charcter" Title="CChar" />
|
||||
<PropertyColumn Property="x => x.pinyin" Title="Pinyin" />
|
||||
</Columns>
|
||||
</MudDataGrid>
|
||||
</MudPaper>
|
||||
}
|
||||
</MudContainer>
|
||||
</MudContainer>
|
||||
</MudContainer>
|
||||
|
||||
@code{
|
||||
int numOfChunks = 100; //Exclusive index 0
|
||||
int selectedChunk = 0;
|
||||
|
||||
protected override void OnInitialized()
|
||||
{
|
||||
SelectedChunk();
|
||||
StateHasChanged();
|
||||
}
|
||||
|
||||
async void StartLearning()
|
||||
{
|
||||
await localStorage.SetItemAsync("SelectedChunk", selectedChunk);
|
||||
navigator.NavigateTo("/Learn");
|
||||
}
|
||||
|
||||
CChar[]? Charecters;
|
||||
async void SelectedChunk()
|
||||
{
|
||||
Charecters = await httpClient.GetFromJsonAsync<CChar[]>($"Data/Normalized_chunk_{selectedChunk.ToString("000")}.json");
|
||||
StateHasChanged();
|
||||
}
|
||||
}
|
||||
193
LearningChineseFixed/Pages/Learn.razor
Normal file
193
LearningChineseFixed/Pages/Learn.razor
Normal file
|
|
@ -0,0 +1,193 @@
|
|||
@page "/Learn"
|
||||
@using System.Text;
|
||||
@using LearningChineseSimplified.ExtensionMethods;
|
||||
|
||||
@inject NavigationManager navigator
|
||||
@inject Blazored.LocalStorage.ILocalStorageService localStorage
|
||||
@inject HttpClient httpClient
|
||||
@inject ISnackbar Snackbar
|
||||
|
||||
|
||||
<style>
|
||||
.LargeCharecter{
|
||||
width: 0;
|
||||
height: 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 125px;
|
||||
}
|
||||
|
||||
.PinyinButtons{
|
||||
width: 125px;
|
||||
font-size: 20px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<MudContainer Class="justify-center d-flex ma-0" Style="height: 100%;">
|
||||
<MudStack Class="d-flex">
|
||||
<MudStack Row=true Class="pt-2 d-flex justify-center">
|
||||
<MudButton Color="Color.Default" OnClick="RemoveCCharFromSelection" Variant="Variant.Outlined">Skip</MudButton>
|
||||
</MudStack>
|
||||
<MudContainer>
|
||||
<MudPaper Class="pa-16 ma-2 rounded-xl mud-dark" Elevation="1">
|
||||
<MudContainer Style="width: 100px; height: 100px" Class="pa-8 ma-4 d-flex justify-center align-center">
|
||||
@if (!Answers.Any(x => x == null))
|
||||
{
|
||||
<p class="LargeCharecter">@GetDisplayChar()</p>
|
||||
}
|
||||
</MudContainer>
|
||||
</MudPaper>
|
||||
</MudContainer>
|
||||
<MudContainer Class="pa-8 pt-10 justify-center align-center d-flex"
|
||||
Style="max-width:300px">
|
||||
<MudGrid Spacing="10" Class="align-center justify-center d-flex">
|
||||
@if (!Answers.Any(x=>x == null))
|
||||
{
|
||||
@for (int i = 0; i < Answers.Length; i++)
|
||||
{
|
||||
int buttonIndex = i;
|
||||
<MudButton Class="PinyinButtons ma-3"
|
||||
Variant="Variant.Outlined"
|
||||
@onclick="() => SelectButton(buttonIndex)"
|
||||
Color="@(Answers[buttonIndex].isSelected ? Color.Primary : Color.Default)">
|
||||
<MudText>
|
||||
@Answers[buttonIndex].cchar.pinyin.ToTitleCase()
|
||||
</MudText>
|
||||
</MudButton>
|
||||
}
|
||||
}
|
||||
</MudGrid>
|
||||
</MudContainer>
|
||||
<MudSpacer/>
|
||||
<MudContainer Class="pb-8 justify-center align-center d-flex">
|
||||
@if (!Answers.Any(x => x == null))
|
||||
{
|
||||
<MudButton Disabled="@(!(Answers.Any(x=>x.isSelected)))" OnClick="Submit" Class="px-8 py-3" Variant="Variant.Filled" Size="Size.Large" Color="Color.Success" Style="font-size: 20px;"> Submit</MudButton>
|
||||
}
|
||||
</MudContainer>
|
||||
</MudStack>
|
||||
</MudContainer>
|
||||
|
||||
<MudOverlay @bind-Visible="ShowOverlay" DarkBackground="true" AutoClose="true" />
|
||||
|
||||
@code {
|
||||
public bool ShowOverlay = false;
|
||||
|
||||
public Answer[] Answers = new Answer[4];
|
||||
public void SelectButton(int selectedIndex)
|
||||
{
|
||||
for (int i = 0; i < Answers.Length; i++)
|
||||
{
|
||||
Answers[i].isSelected = (i == selectedIndex);
|
||||
}
|
||||
}
|
||||
|
||||
private CChar[]? _charecters;
|
||||
public CChar[]? Charecters
|
||||
{
|
||||
get
|
||||
{
|
||||
if (_charecters == null) throw new Exception("Loaded dataset empty?");
|
||||
|
||||
return _charecters;
|
||||
}
|
||||
set { _charecters = value; }
|
||||
}
|
||||
|
||||
public List<CChar>? DontSkipTheseCChar;
|
||||
|
||||
private async Task<string> GetFileContentsAsync(string filePath)
|
||||
{
|
||||
var fileResponse = await httpClient.GetByteArrayAsync(filePath);
|
||||
return Encoding.UTF8.GetString(fileResponse);
|
||||
}
|
||||
|
||||
protected override async Task OnInitializedAsync()
|
||||
{
|
||||
int selectedChunk = await localStorage.GetItemAsync<int>("SelectedChunk");
|
||||
|
||||
//Charecters = await httpClient.GetFromJsonAsync<CChar[]>("Data/NormalizedDataset.json");
|
||||
Charecters = await httpClient.GetFromJsonAsync<CChar[]>($"Data/Normalized_chunk_{selectedChunk.ToString("000")}.json");
|
||||
|
||||
DontSkipTheseCChar = Charecters.ToList();
|
||||
|
||||
GenerateQuestion();
|
||||
}
|
||||
|
||||
void GenerateQuestion()
|
||||
{
|
||||
if (DontSkipTheseCChar.Count < 3) throw new Exception("Finished this chunk of CChars");
|
||||
|
||||
int correctIndex = Random.Shared.Next(0, Answers.Length);
|
||||
|
||||
for (int i = 0; i < Answers.Length; i++)
|
||||
{
|
||||
bool isCorrect = i == correctIndex;
|
||||
Answers[i] = new Answer(DontSkipTheseCChar[Random.Shared.Next(0, DontSkipTheseCChar.Count)], isCorrect);
|
||||
}
|
||||
}
|
||||
|
||||
async void Submit()
|
||||
{
|
||||
bool isCorrect = Answers.Any(x => x.isCorrect && x.isSelected);
|
||||
CChar correctCChar = GetCorrectCChar();
|
||||
|
||||
if (isCorrect)
|
||||
{
|
||||
Snackbar.Add($"<b>Definition:</b> {correctCChar.definition}", Severity.Success, config => { config.VisibleStateDuration = 1000; });
|
||||
}
|
||||
else
|
||||
{
|
||||
Snackbar.Add(
|
||||
@<div>
|
||||
<h3>Incorrect!</h3>
|
||||
<ul>
|
||||
<li>Correct answer: @correctCChar.pinyin.ToTitleCase()</li>
|
||||
<li>Meaning: @correctCChar.definition</li>
|
||||
</ul>
|
||||
</div>
|
||||
, Severity.Error);
|
||||
}
|
||||
|
||||
GenerateQuestion();
|
||||
}
|
||||
|
||||
public class Answer
|
||||
{
|
||||
public Answer()
|
||||
{
|
||||
}
|
||||
|
||||
public Answer(CChar cchar, bool isCorrect)
|
||||
{
|
||||
this.cchar = cchar;
|
||||
this.isCorrect = isCorrect;
|
||||
}
|
||||
|
||||
public CChar cchar { get; set; }
|
||||
public bool isCorrect { get; set; } = false;
|
||||
public bool isSelected { get; set; } = false;
|
||||
}
|
||||
|
||||
public char GetDisplayChar()
|
||||
{
|
||||
char? cc = GetCorrectCChar().charcter;
|
||||
if (cc == null) return ' ';
|
||||
else return (char)cc;
|
||||
}
|
||||
|
||||
public CChar GetCorrectCChar()
|
||||
{
|
||||
CChar cchar = Answers.FirstOrDefault(x => x.isCorrect)?.cchar;
|
||||
return cchar;
|
||||
}
|
||||
|
||||
public void RemoveCCharFromSelection()
|
||||
{
|
||||
CChar correctChar = GetCorrectCChar();
|
||||
DontSkipTheseCChar.Remove(correctChar);
|
||||
Console.WriteLine("Remaining CChars: " + DontSkipTheseCChar);
|
||||
GenerateQuestion();
|
||||
}
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue