Skip to content

Commit 1cdd267

Browse files
Added View PDF sample using URLService.
1 parent ecb0a08 commit 1cdd267

7 files changed

Lines changed: 136 additions & 0 deletions

File tree

samples/KristofferStrube.Blazor.FileSystemAccess.ServerExample/KristofferStrube.Blazor.FileSystemAccess.ServerExample.csproj

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,4 +15,10 @@
1515
<ProjectReference Include="..\..\src\KristofferStrube.Blazor.FileSystemAccess\KristofferStrube.Blazor.FileSystemAccess.csproj" />
1616
</ItemGroup>
1717

18+
<ItemGroup>
19+
<Content Update="Shared\NavMenu.razor">
20+
<ExcludeFromSingleFile>true</ExcludeFromSingleFile>
21+
</Content>
22+
</ItemGroup>
23+
1824
</Project>
Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
@page "/ViewPDF"
2+
3+
@implements IAsyncDisposable
4+
5+
@inject IFileSystemAccessService FileSystemAccessService
6+
@inject IURLService URL
7+
8+
<PageTitle>File System Access - View PDF</PageTitle>
9+
10+
<button @onclick="OpenFilePicker" class="btn btn-primary">Open PDF</button>
11+
<br />
12+
<br />
13+
@if (fileHandle is not null)
14+
{
15+
<iframe style="width:100%;height:calc(100vh - 180px);" src="@pdfURL"></iframe>
16+
}
17+
18+
@code {
19+
private string pdfURL = "";
20+
private FileSystemFileHandle? fileHandle;
21+
22+
private async Task OpenFilePicker()
23+
{
24+
try
25+
{
26+
var options = new OpenFilePickerOptionsStartInWellKnownDirectory()
27+
{
28+
Multiple = false,
29+
StartIn = WellKnownDirectory.Downloads,
30+
Types = new FilePickerAcceptType[] {
31+
new() {
32+
Description = "PDFs",
33+
Accept = new() { { "application/pdf", new string[] { ".pdf" } } }
34+
}
35+
}
36+
};
37+
var fileHandles = await FileSystemAccessService.ShowOpenFilePickerAsync(options);
38+
fileHandle = fileHandles.Single();
39+
}
40+
catch (JSException ex)
41+
{
42+
Console.WriteLine(ex);
43+
}
44+
finally
45+
{
46+
if (fileHandle != null)
47+
{
48+
var file = await fileHandle.GetFileAsync();
49+
pdfURL = await URL.CreateObjectURLAsync(file);
50+
}
51+
}
52+
}
53+
54+
public async ValueTask DisposeAsync()
55+
{
56+
await URL.RevokeObjectURLAsync(pdfURL);
57+
}
58+
}

samples/KristofferStrube.Blazor.FileSystemAccess.ServerExample/Program.cs

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
using KristofferStrube.Blazor.FileAPI;
12
using KristofferStrube.Blazor.FileSystemAccess;
23
using TG.Blazor.IndexedDB;
34

@@ -7,6 +8,7 @@
78
builder.Services.AddRazorPages();
89
builder.Services.AddServerSideBlazor();
910
builder.Services.AddFileSystemAccessService();
11+
builder.Services.AddURLService();
1012

1113
// Adding and configuring IndexedDB used for the IndexedDB sample.
1214
builder.Services.AddIndexedDB(dbStore =>

samples/KristofferStrube.Blazor.FileSystemAccess.ServerExample/Shared/NavMenu.razor

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,11 @@
2424
<span class="oi oi-box" aria-hidden="true"></span> View Zip File
2525
</NavLink>
2626
</div>
27+
<div class="nav-item px-3">
28+
<NavLink class="nav-link" href="ViewPDF">
29+
<span class="oi oi-book aria-hidden="true"></span> View PDF
30+
</NavLink>
31+
</div>
2732
<div class="nav-item px-3">
2833
<NavLink class="nav-link" href="MultipleFiles">
2934
<span class="oi oi-layers" aria-hidden="true"></span> Open Multiple Files
Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
@page "/ViewPDF"
2+
3+
@implements IDisposable
4+
5+
@inject IFileSystemAccessServiceInProcess FileSystemAccessService
6+
@inject IURLServiceInProcess URL
7+
8+
<PageTitle>File System Access - View PDF</PageTitle>
9+
10+
<button @onclick="OpenFilePicker" class="btn btn-primary">Open PDF</button>
11+
<br />
12+
<br />
13+
@if (fileHandle is not null)
14+
{
15+
<iframe style="width:100%;height:calc(100% - 80px);" src="@pdfURL"></iframe>
16+
}
17+
18+
@code {
19+
private string pdfURL = "";
20+
private FileSystemFileHandleInProcess? fileHandle;
21+
22+
private async Task OpenFilePicker()
23+
{
24+
try
25+
{
26+
var options = new OpenFilePickerOptionsStartInWellKnownDirectory()
27+
{
28+
Multiple = false,
29+
StartIn = WellKnownDirectory.Downloads,
30+
Types = new FilePickerAcceptType[] {
31+
new() {
32+
Description = "PDFs",
33+
Accept = new() { { "application/pdf", new string[] { ".pdf" } } }
34+
}
35+
}
36+
};
37+
var fileHandles = await FileSystemAccessService.ShowOpenFilePickerAsync(options);
38+
fileHandle = fileHandles.Single();
39+
}
40+
catch (JSException ex)
41+
{
42+
Console.WriteLine(ex);
43+
}
44+
finally
45+
{
46+
if (fileHandle != null)
47+
{
48+
var file = await fileHandle.GetFileAsync();
49+
pdfURL = URL.CreateObjectURL(file);
50+
}
51+
}
52+
}
53+
54+
public void Dispose()
55+
{
56+
URL.RevokeObjectURL(pdfURL);
57+
}
58+
}

samples/KristofferStrube.Blazor.FileSystemAccess.WasmExample/Program.cs

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
using KristofferStrube.Blazor.FileAPI;
12
using KristofferStrube.Blazor.FileSystemAccess;
23
using KristofferStrube.Blazor.FileSystemAccess.WasmExample;
34
using Microsoft.AspNetCore.Components.Web;
@@ -10,6 +11,7 @@
1011

1112
builder.Services.AddScoped(sp => new HttpClient { BaseAddress = new Uri(builder.HostEnvironment.BaseAddress) });
1213
builder.Services.AddFileSystemAccessServiceInProcess();
14+
builder.Services.AddURLServiceInProcess();
1315

1416
// Adding and configuring IndexedDB used for the IndexedDB sample.
1517
builder.Services.AddIndexedDB(dbStore =>

samples/KristofferStrube.Blazor.FileSystemAccess.WasmExample/Shared/NavMenu.razor

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,11 @@
2424
<span class="oi oi-box" aria-hidden="true"></span> View Zip File
2525
</NavLink>
2626
</div>
27+
<div class="nav-item px-3">
28+
<NavLink class="nav-link" href="ViewPDF">
29+
<span class="oi oi-book aria-hidden="true"></span> View PDF
30+
</NavLink>
31+
</div>
2732
<div class="nav-item px-3">
2833
<NavLink class="nav-link" href="MultipleFiles">
2934
<span class="oi oi-layers" aria-hidden="true"></span> Open Multiple Files

0 commit comments

Comments
 (0)