+ if (!file.readPromise) {
+ file.readPromise = new Promise(function (resolve, reject) {
+ var reader = new FileReader();
+ reader.onload = function () { resolve(reader.result); };
+ reader.onerror = function (err) { reject(err); };
+ reader.readAsArrayBuffer(file.blob);
+ });
+ }
+
+ return file.readPromise;
+ }
+
+ var uint8ToBase64 = (function () {
+ // Code from https://github.com/beatgammit/base64-js/
+ // License: MIT
+ var lookup = [];
+
+ var code = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/';
+ for (var i = 0, len = code.length; i < len; ++i) {
+ lookup[i] = code[i];
+ }
+
+ function tripletToBase64(num) {
+ return lookup[num >> 18 & 0x3F] +
+ lookup[num >> 12 & 0x3F] +
+ lookup[num >> 6 & 0x3F] +
+ lookup[num & 0x3F];
+ }
+
+ function encodeChunk(uint8, start, end) {
+ var tmp;
+ var output = [];
+ for (var i = start; i < end; i += 3) {
+ tmp =
+ ((uint8[i] << 16) & 0xFF0000) +
+ ((uint8[i + 1] << 8) & 0xFF00) +
+ (uint8[i + 2] & 0xFF);
+ output.push(tripletToBase64(tmp));
+ }
+ return output.join('');
+ }
+
+ return function fromByteArray(uint8) {
+ var tmp;
+ var len = uint8.length;
+ var extraBytes = len % 3; // if we have 1 byte left, pad 2 bytes
+ var parts = [];
+ var maxChunkLength = 16383; // must be multiple of 3
+
+ // go through the array every three bytes, we'll deal with trailing stuff later
+ for (var i = 0, len2 = len - extraBytes; i < len2; i += maxChunkLength) {
+ parts.push(encodeChunk(
+ uint8, i, (i + maxChunkLength) > len2 ? len2 : (i + maxChunkLength)
+ ));
+ }
+
+ // pad the end with zeros, but make sure to not forget the extra bytes
+ if (extraBytes === 1) {
+ tmp = uint8[len - 1];
+ parts.push(
+ lookup[tmp >> 2] +
+ lookup[(tmp << 4) & 0x3F] +
+ '=='
+ );
+ } else if (extraBytes === 2) {
+ tmp = (uint8[len - 2] << 8) + uint8[len - 1];
+ parts.push(
+ lookup[tmp >> 10] +
+ lookup[(tmp >> 4) & 0x3F] +
+ lookup[(tmp << 2) & 0x3F] +
+ '='
+ );
+ }
+
+ return parts.join('');
+ };
+ })();
+})();
diff --git a/Directory.Build.props b/Directory.Build.props
new file mode 100644
index 0000000..9339681
--- /dev/null
+++ b/Directory.Build.props
@@ -0,0 +1,6 @@
+
+
+ 3.0.0-preview9.19424.4
+ 3.0.0-preview9.19424.4
+
+
diff --git a/samples/Sample.Core/App.razor b/samples/Sample.Core/App.razor
new file mode 100644
index 0000000..2b4564e
--- /dev/null
+++ b/samples/Sample.Core/App.razor
@@ -0,0 +1,17 @@
+
+
+
+
+
+
+
+ Sorry, there's nothing here.
+
+
+
diff --git a/samples/Sample.Core/Pages/DragDropViewer.razor b/samples/Sample.Core/Pages/DragDropViewer.razor
new file mode 100644
index 0000000..d4c731d
--- /dev/null
+++ b/samples/Sample.Core/Pages/DragDropViewer.razor
@@ -0,0 +1,50 @@
+@page "/dragdrop-viewer"
+
+Drag/drop file viewer
+
+Shows how you can present a custom UI instead of the native file input.
+
+
+
+ @status
+
+
+@if (fileName != null)
+{
+ @fileName
+ @fileTextContents
+}
+
+@code {
+ const string DefaultStatus = "Drop a text file here to view it, or click to choose a file";
+ const int MaxFileSize = 5 * 1024 * 1024; // 5MB
+ string status = DefaultStatus;
+
+ string fileName;
+ string fileTextContents;
+
+ async Task ViewFile(IFileListEntry[] files)
+ {
+ var file = files.FirstOrDefault();
+ if (file == null)
+ {
+ return;
+ }
+ else if (file.Size > MaxFileSize)
+ {
+ status = $"That's too big. Max size: {MaxFileSize} bytes.";
+ }
+ else
+ {
+ status = "Loading...";
+
+ using (var reader = new StreamReader(file.Data))
+ {
+ fileTextContents = await reader.ReadToEndAsync();
+ fileName = file.Name;
+ }
+
+ status = DefaultStatus;
+ }
+ }
+}
diff --git a/samples/Sample.Core/Pages/MultiFile.razor b/samples/Sample.Core/Pages/MultiFile.razor
new file mode 100644
index 0000000..085aecd
--- /dev/null
+++ b/samples/Sample.Core/Pages/MultiFile.razor
@@ -0,0 +1,57 @@
+@page "/multi"
+
+Multiple files
+
+A multi-file picker that displays information about selection and shows progress as each one is loaded.
+
+
+
+@if (selectedFiles != null)
+{
+ foreach (var file in selectedFiles)
+ {
+ var isLoading = file.Data.Position > 0;
+
+
+
+
+
@file.Name
+ Size: @file.Size bytes;
+ Last modified: @file.LastModified.ToShortDateString();
+ Type: @file.Type
+
+
+
+
+
Native upload
+
+
+ This sample does not use InputFile. Instead, it's a plain HTML
+ <input type="file">, so you can compare the user experience.
+
+
+
diff --git a/samples/Sample.Core/Pages/SingleFile.razor b/samples/Sample.Core/Pages/SingleFile.razor
new file mode 100644
index 0000000..b06b2bc
--- /dev/null
+++ b/samples/Sample.Core/Pages/SingleFile.razor
@@ -0,0 +1,27 @@
+@page "/"
+
+Single file
+
+A single file input that uploads automatically on file selection
+
+
+
+@status
+
+@code {
+ string status;
+
+ async Task HandleSelection(IFileListEntry[] files)
+ {
+ var file = files.FirstOrDefault();
+ if (file != null)
+ {
+ // Just load into .NET memory to show it can be done
+ // Alternatively it could be saved to disk, or parsed in memory, or similar
+ var ms = new MemoryStream();
+ await file.Data.CopyToAsync(ms);
+
+ status = $"Finished loading {file.Size} bytes from {file.Name}";
+ }
+ }
+}
diff --git a/samples/Sample.Core/Sample.Core.csproj b/samples/Sample.Core/Sample.Core.csproj
new file mode 100644
index 0000000..2eff083
--- /dev/null
+++ b/samples/Sample.Core/Sample.Core.csproj
@@ -0,0 +1,17 @@
+
+
+
+ netstandard2.0
+ 3.0
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/samples/Sample.Core/_Imports.razor b/samples/Sample.Core/_Imports.razor
new file mode 100644
index 0000000..407272a
--- /dev/null
+++ b/samples/Sample.Core/_Imports.razor
@@ -0,0 +1,5 @@
+@using Microsoft.AspNetCore.Components
+@using Microsoft.AspNetCore.Components.Routing
+@using Microsoft.AspNetCore.Components.Web
+@using BlazorInputFile
+@using System.IO
diff --git a/samples/Sample.Core/wwwroot/sample-styles.css b/samples/Sample.Core/wwwroot/sample-styles.css
new file mode 100644
index 0000000..572315c
--- /dev/null
+++ b/samples/Sample.Core/wwwroot/sample-styles.css
@@ -0,0 +1,108 @@
+body {
+ font-family: sans-serif;
+ margin: 0;
+}
+
+main, nav {
+ padding: 1.25rem 2rem;
+}
+
+h1, h2, h3, h4, h5 {
+ margin-top: 1rem;
+}
+
+nav {
+ background-color: #c9c9c9;
+ display: flex;
+ align-items: center;
+ color: #3d3d3d;
+ box-shadow: 0 0 3px;
+}
+
+ nav a {
+ text-decoration: none;
+ background-color: #eeeeee;
+ color: black;
+ padding: 0.3rem 1rem;
+ display: inline-block;
+ box-shadow: 0 0 3px rgba(0,0,0,0.4);
+ }
+
+ nav a:first-of-type {
+ margin-left: 0.6rem;
+ border-top-left-radius: 5px;
+ border-bottom-left-radius: 5px;
+ }
+
+ nav a:last-of-type {
+ border-top-right-radius: 5px;
+ border-bottom-right-radius: 5px;
+ }
+
+ nav a:hover {
+ background-color: white;
+ }
+
+ nav a.active, nav a.active:hover {
+ background-color: #3069f6;
+ color: white;
+ }
+
+.file-row {
+ background-color: #e4e4e4;
+ padding: 1rem 1.5rem;
+ margin-top: 1rem;
+ border-radius: 0.6rem;
+ color: #555;
+ display: flex;
+ align-items: center;
+}
+
+ .file-row h2 {
+ margin: 0.3rem 0 0.6rem 0;
+ font-weight: bold;
+ color: black;
+ font-size: 1.1rem;
+ }
+
+ .file-row > div {
+ flex-grow: 1;
+ }
+
+ .file-row button {
+ padding: 0.5rem 1rem;
+ }
+
+.drag-drop-zone {
+ border: 3px dashed #e68710;
+ padding: 3rem;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ background-color: #eee;
+ box-shadow: inset 0 0 8px rgba(0,0,0,0.2);
+ color: #aeaeae;
+ font-size: 1.5rem;
+ cursor: pointer;
+ margin: 1.5rem 0 2rem 0;
+ position: relative;
+}
+
+ .drag-drop-zone:hover {
+ background-color: #f5f5f5;
+ }
+
+ .drag-drop-zone input[type=file] {
+ position: absolute;
+ width: 100%;
+ height: 100%;
+ opacity: 0;
+ cursor: pointer;
+ }
+
+pre {
+ background-color: #f0f0f0;
+ overflow: auto;
+ padding: 1rem;
+ height: 10rem;
+}
diff --git a/samples/Sample.Server/Pages/_Host.cshtml b/samples/Sample.Server/Pages/_Host.cshtml
new file mode 100644
index 0000000..f078700
--- /dev/null
+++ b/samples/Sample.Server/Pages/_Host.cshtml
@@ -0,0 +1,19 @@
+@page "/"
+@namespace Sample.Core
+@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
+
+
+
+
+
+
+ Sample.Server
+
+
+
+
+ @(await Html.RenderComponentAsync(RenderMode.ServerPrerendered))
+
+
+
+
diff --git a/samples/Sample.Server/Program.cs b/samples/Sample.Server/Program.cs
new file mode 100644
index 0000000..e3e09e2
--- /dev/null
+++ b/samples/Sample.Server/Program.cs
@@ -0,0 +1,28 @@
+using System;
+using System.Collections.Generic;
+using System.IO;
+using System.Linq;
+using System.Threading.Tasks;
+using Microsoft.AspNetCore;
+using Microsoft.AspNetCore.Hosting;
+using Microsoft.Extensions.Configuration;
+using Microsoft.Extensions.Hosting;
+using Microsoft.Extensions.Logging;
+
+namespace Sample.Server
+{
+ public class Program
+ {
+ public static void Main(string[] args)
+ {
+ CreateHostBuilder(args).Build().Run();
+ }
+
+ public static IHostBuilder CreateHostBuilder(string[] args) =>
+ Host.CreateDefaultBuilder(args)
+ .ConfigureWebHostDefaults(webBuilder =>
+ {
+ webBuilder.UseStartup();
+ });
+ }
+}
diff --git a/samples/Sample.Server/Properties/launchSettings.json b/samples/Sample.Server/Properties/launchSettings.json
new file mode 100644
index 0000000..0967e78
--- /dev/null
+++ b/samples/Sample.Server/Properties/launchSettings.json
@@ -0,0 +1,27 @@
+{
+ "iisSettings": {
+ "windowsAuthentication": false,
+ "anonymousAuthentication": true,
+ "iisExpress": {
+ "applicationUrl": "http://localhost:1744",
+ "sslPort": 44371
+ }
+ },
+ "profiles": {
+ "IIS Express": {
+ "commandName": "IISExpress",
+ "launchBrowser": true,
+ "environmentVariables": {
+ "ASPNETCORE_ENVIRONMENT": "Development"
+ }
+ },
+ "Sample.Server": {
+ "commandName": "Project",
+ "launchBrowser": true,
+ "applicationUrl": "https://localhost:5001;http://localhost:5000",
+ "environmentVariables": {
+ "ASPNETCORE_ENVIRONMENT": "Development"
+ }
+ }
+ }
+}
diff --git a/samples/Sample.Server/Sample.Server.csproj b/samples/Sample.Server/Sample.Server.csproj
new file mode 100644
index 0000000..0808c05
--- /dev/null
+++ b/samples/Sample.Server/Sample.Server.csproj
@@ -0,0 +1,11 @@
+
+
+
+ netcoreapp3.0
+
+
+
+
+
+
+
diff --git a/samples/Sample.Server/Startup.cs b/samples/Sample.Server/Startup.cs
new file mode 100644
index 0000000..08fdb76
--- /dev/null
+++ b/samples/Sample.Server/Startup.cs
@@ -0,0 +1,69 @@
+using System;
+using System.Collections.Generic;
+using System.IO;
+using System.Linq;
+using System.Threading.Tasks;
+using Microsoft.AspNetCore.Builder;
+using Microsoft.AspNetCore.Components;
+using Microsoft.AspNetCore.Hosting;
+using Microsoft.AspNetCore.Http;
+using Microsoft.AspNetCore.HttpsPolicy;
+using Microsoft.Extensions.Configuration;
+using Microsoft.Extensions.DependencyInjection;
+using Microsoft.Extensions.Hosting;
+
+namespace Sample.Server
+{
+ public class Startup
+ {
+ public Startup(IConfiguration configuration)
+ {
+ Configuration = configuration;
+ }
+
+ public IConfiguration Configuration { get; }
+
+ // This method gets called by the runtime. Use this method to add services to the container.
+ // For more information on how to configure your application, visit https://go.microsoft.com/fwlink/?LinkID=398940
+ public void ConfigureServices(IServiceCollection services)
+ {
+ services.AddRazorPages();
+ services.AddServerSideBlazor();
+ }
+
+ // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
+ public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
+ {
+ if (env.IsDevelopment())
+ {
+ app.UseDeveloperExceptionPage();
+ }
+ else
+ {
+ app.UseExceptionHandler("/Error");
+ // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
+ app.UseHsts();
+ }
+
+ app.UseHttpsRedirection();
+ app.UseStaticFiles();
+
+ app.UseRouting();
+
+ app.UseEndpoints(endpoints =>
+ {
+ endpoints.MapPost("/native-upload", async ctx =>
+ {
+ var start = DateTime.Now;
+ var ms = new MemoryStream();
+ await ctx.Request.Body.CopyToAsync(ms);
+ var end = DateTime.Now;
+ await ctx.Response.WriteAsync($"Received {ms.Position} bytes in {(end - start).TotalMilliseconds} ms");
+ });
+
+ endpoints.MapBlazorHub();
+ endpoints.MapFallbackToPage("/_Host");
+ });
+ }
+ }
+}
diff --git a/samples/Sample.Server/appsettings.Development.json b/samples/Sample.Server/appsettings.Development.json
new file mode 100644
index 0000000..e203e94
--- /dev/null
+++ b/samples/Sample.Server/appsettings.Development.json
@@ -0,0 +1,9 @@
+{
+ "Logging": {
+ "LogLevel": {
+ "Default": "Debug",
+ "System": "Information",
+ "Microsoft": "Information"
+ }
+ }
+}
diff --git a/samples/Sample.Server/appsettings.json b/samples/Sample.Server/appsettings.json
new file mode 100644
index 0000000..d9d9a9b
--- /dev/null
+++ b/samples/Sample.Server/appsettings.json
@@ -0,0 +1,10 @@
+{
+ "Logging": {
+ "LogLevel": {
+ "Default": "Information",
+ "Microsoft": "Warning",
+ "Microsoft.Hosting.Lifetime": "Information"
+ }
+ },
+ "AllowedHosts": "*"
+}
diff --git a/samples/Sample.Server/wwwroot/favicon.ico b/samples/Sample.Server/wwwroot/favicon.ico
new file mode 100644
index 0000000..a3a7999
Binary files /dev/null and b/samples/Sample.Server/wwwroot/favicon.ico differ
diff --git a/samples/Sample.WebAssembly/Program.cs b/samples/Sample.WebAssembly/Program.cs
new file mode 100644
index 0000000..75bdf6b
--- /dev/null
+++ b/samples/Sample.WebAssembly/Program.cs
@@ -0,0 +1,16 @@
+using Microsoft.AspNetCore.Blazor.Hosting;
+
+namespace Sample.WebAssembly
+{
+ public class Program
+ {
+ public static void Main(string[] args)
+ {
+ CreateHostBuilder(args).Build().Run();
+ }
+
+ public static IWebAssemblyHostBuilder CreateHostBuilder(string[] args) =>
+ BlazorWebAssemblyHost.CreateDefaultBuilder()
+ .UseBlazorStartup();
+ }
+}
diff --git a/samples/Sample.WebAssembly/Properties/launchSettings.json b/samples/Sample.WebAssembly/Properties/launchSettings.json
new file mode 100644
index 0000000..ae10aae
--- /dev/null
+++ b/samples/Sample.WebAssembly/Properties/launchSettings.json
@@ -0,0 +1,27 @@
+{
+ "iisSettings": {
+ "windowsAuthentication": false,
+ "anonymousAuthentication": true,
+ "iisExpress": {
+ "applicationUrl": "http://localhost:59360/",
+ "sslPort": 0
+ }
+ },
+ "profiles": {
+ "IIS Express": {
+ "commandName": "IISExpress",
+ "launchBrowser": true,
+ "environmentVariables": {
+ "ASPNETCORE_ENVIRONMENT": "Development"
+ }
+ },
+ "Sample.WebAssembly": {
+ "commandName": "Project",
+ "launchBrowser": true,
+ "environmentVariables": {
+ "ASPNETCORE_ENVIRONMENT": "Development"
+ },
+ "applicationUrl": "http://localhost:59361/"
+ }
+ }
+}
\ No newline at end of file
diff --git a/samples/Sample.WebAssembly/Sample.WebAssembly.csproj b/samples/Sample.WebAssembly/Sample.WebAssembly.csproj
new file mode 100644
index 0000000..e1f5dd8
--- /dev/null
+++ b/samples/Sample.WebAssembly/Sample.WebAssembly.csproj
@@ -0,0 +1,32 @@
+
+
+
+ netstandard2.0
+ Exe
+ 7.3
+ 3.0
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ <_BlazorInputFile_FilesToCopy Include="..\..\BlazorInputFile\wwwroot\**" />
+ <_SampleCore_FilesToCopy Include="..\Sample.Core\wwwroot\**" />
+
+
+
+
+
+
diff --git a/samples/Sample.WebAssembly/Startup.cs b/samples/Sample.WebAssembly/Startup.cs
new file mode 100644
index 0000000..325de9d
--- /dev/null
+++ b/samples/Sample.WebAssembly/Startup.cs
@@ -0,0 +1,18 @@
+using Microsoft.AspNetCore.Components.Builder;
+using Microsoft.Extensions.DependencyInjection;
+using Sample.Core;
+
+namespace Sample.WebAssembly
+{
+ public class Startup
+ {
+ public void ConfigureServices(IServiceCollection services)
+ {
+ }
+
+ public void Configure(IComponentsApplicationBuilder app)
+ {
+ app.AddComponent("app");
+ }
+ }
+}
diff --git a/samples/Sample.WebAssembly/_Imports.razor b/samples/Sample.WebAssembly/_Imports.razor
new file mode 100644
index 0000000..1e2af3d
--- /dev/null
+++ b/samples/Sample.WebAssembly/_Imports.razor
@@ -0,0 +1,7 @@
+@using System.Net.Http
+@using Microsoft.AspNetCore.Components.Forms
+@using Microsoft.AspNetCore.Components.Routing
+@using Microsoft.AspNetCore.Components.Web
+@using Microsoft.JSInterop
+@using Sample.WebAssembly
+@using BlazorInputFile
diff --git a/samples/Sample.WebAssembly/wwwroot/index.html b/samples/Sample.WebAssembly/wwwroot/index.html
new file mode 100644
index 0000000..b39152b
--- /dev/null
+++ b/samples/Sample.WebAssembly/wwwroot/index.html
@@ -0,0 +1,16 @@
+
+
+
+
+
+ Sample.WebAssembly
+
+
+
+
+ Loading...
+
+
+
+
+