Squirrowse/squirrowse.web/Pages/Galery.razor

114 lines
2.6 KiB
Plaintext
Raw Normal View History

2020-06-19 18:39:08 +02:00
@page "/galery"
@using LiteDB
@using squirrowse.core
@using squirrowse.web.Data
@inject IJSRuntime jsrun;
@inject GaleryService galery;
<h3>Galery</h3>
@*<table class="table">
<thead>
<tr>
<th>Tag</th>
<th>Img</th>
</tr>
</thead>
<tbody>
@foreach (var item in _frames.Keys)
{
<tr>
<td>@item</td>
@foreach (var t in _frames.GetValueOrDefault(item))
{
<td>
<img src="@t.ImgSrc"/>
</td>
}
</tr>
}
</tbody>
</table>*@
<table>
<thead>
<tr>
@foreach (var item in _frames.Keys)
{
<th>
<button @onclick="e => _tagsSwitch[item] = !_tagsSwitch.GetValueOrDefault(item)">
@(_tagsSwitch[item] ? $" {item}" : $" {item}")
</button>
</th>
}
</tr>
</thead>
<tbody>
@foreach (var item in _frames.Keys)
{
<tr>
<div class="demo-gallery card card-default border @(_tagsSwitch[item] ? "collapse" : "")">
<ul id="lightgallery" class="list-unstyled row lgalery">
@foreach (var t in _frames.GetValueOrDefault(item))
{
<ul class="col-xs-6 col-sm-4 col-md-3 " data-responsive="@t.ImgSrc" data-src="@t.ImgSrc">
<a href="./galery">
<img class="img-responsive" src="@t.ImgSrc" height="180" width="320"/>
</a>
</ul>
}
</ul>
</div>
</tr>
}
</tbody>
</table>
@code {
private ILiteDatabase repo;
// private GaleryService _galery;
private List<string> _tags;
private readonly Dictionary<string, bool> _tagsSwitch = new Dictionary<string, bool>();
private Dictionary<string, List<Frame>> _frames;
private bool Collapsed = true;
protected override async Task OnInitializedAsync()
{
_tags = await galery.tags();
foreach (var t in _tags)
{
_tagsSwitch.Add(t, true);
}
_frames = await galery.galeryEntireView();
// StateHasChanged();
}
//public async Task Colapse()
//{
// await jsrun.InvokeVoidAsync("colapseD");
//}
protected override async Task OnAfterRenderAsync(bool firstRender)
{
await jsrun.InvokeVoidAsync("galeryJs");
if (firstRender)
{
//_frames = null;
GC.Collect();
}
}
}