Upload and render company logo SVGs when creating new logo entry.

This commit is contained in:
2019-05-26 21:59:05 +01:00
parent f472e11d23
commit e1e14c3781
5 changed files with 300 additions and 66 deletions

View File

@@ -29,7 +29,10 @@
*******************************************************************************/ *******************************************************************************/
using System; using System;
using System.ComponentModel;
using System.ComponentModel.DataAnnotations; using System.ComponentModel.DataAnnotations;
using System.ComponentModel.DataAnnotations.Schema;
using Microsoft.AspNetCore.Http;
namespace Cicm.Database.Models namespace Cicm.Database.Models
{ {
@@ -41,5 +44,13 @@ namespace Cicm.Database.Models
public Guid Guid { get; set; } public Guid Guid { get; set; }
public virtual Company Company { get; set; } public virtual Company Company { get; set; }
[NotMapped]
[Required(ErrorMessage = "SVG logo required")]
[DisplayName("Upload SVG logo:")]
public IFormFile SvgLogo { get; set; }
[NotMapped]
public string ErrorMessage { get; set; }
} }
} }

View File

@@ -1,12 +1,19 @@
using System;
using System.IO;
using System.Linq; using System.Linq;
using System.Text;
using System.Threading.Tasks; using System.Threading.Tasks;
using System.Xml;
using Cicm.Database.Models; using Cicm.Database.Models;
using cicm_web.Areas.Admin.Models;
using Microsoft.AspNetCore.Authorization; using Microsoft.AspNetCore.Authorization;
using Microsoft.AspNetCore.Hosting; using Microsoft.AspNetCore.Hosting;
using Microsoft.AspNetCore.Mvc; using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.Rendering; using Microsoft.AspNetCore.Mvc.Rendering;
using Microsoft.EntityFrameworkCore; using Microsoft.EntityFrameworkCore;
using Microsoft.EntityFrameworkCore.Query; using Microsoft.EntityFrameworkCore.Query;
using SkiaSharp;
using SKSvg = SkiaSharp.Extended.Svg.SKSvg;
namespace cicm_web.Areas.Admin.Controllers namespace cicm_web.Areas.Admin.Controllers
{ {
@@ -48,29 +55,222 @@ namespace cicm_web.Areas.Admin.Controllers
// GET: CompanyLogos/Create // GET: CompanyLogos/Create
// TODO: Upload // TODO: Upload
// public IActionResult Create() public IActionResult Create()
// { {
// ViewData["CompanyId"] = new SelectList(_context.Companies, "Id", "Name"); ViewData["CompanyId"] =
// return View(); new
// } SelectList(_context.Companies.Select(c => new CompanyViewModel {Name = c.Name, Id = c.Id}).OrderBy(c => c.Name),
"Id", "Name");
return View();
}
// POST: CompanyLogos/Create // POST: CompanyLogos/Create
// To protect from overposting attacks, please enable the specific properties you want to bind to, for // To protect from overposting attacks, please enable the specific properties you want to bind to, for
// more details see http://go.microsoft.com/fwlink/?LinkId=317598. // more details see http://go.microsoft.com/fwlink/?LinkId=317598.
// TODO: Upload // TODO: Upload
// [HttpPost] [HttpPost]
// [ValidateAntiForgeryToken] [ValidateAntiForgeryToken]
// public async Task<IActionResult> Create([Bind("Id,CompanyId,Year,Guid")] CompanyLogo companyLogo) public async Task<IActionResult> Create([Bind("Id,CompanyId,Year,SvgLogo")] CompanyLogo companyLogo)
// { {
// if (ModelState.IsValid) if(!ModelState.IsValid)
// { {
// _context.Add(companyLogo); ViewData["CompanyId"] =
// await _context.SaveChangesAsync(); new
// return RedirectToAction(nameof(Index)); SelectList(_context.Companies.Select(c => new CompanyViewModel {Name = c.Name, Id = c.Id}).OrderBy(c => c.Name),
// } "Id", "Name", companyLogo.CompanyId);
// ViewData["CompanyId"] = new SelectList(_context.Companies, "Id", "Name", companyLogo.CompanyId); return View(companyLogo);
// return View(companyLogo); }
// }
using(MemoryStream svgMs = new MemoryStream())
{
await companyLogo.SvgLogo.CopyToAsync(svgMs);
svgMs.Position = 0;
try
{
StreamReader sr = new StreamReader(svgMs, Encoding.UTF8);
string svgStr = await sr.ReadToEndAsync();
XmlDocument xml = new XmlDocument();
xml.LoadXml(svgStr);
}
catch(XmlException e)
{
companyLogo.SvgLogo = null;
companyLogo.ErrorMessage = "Not a valid SVG file.";
ViewData["CompanyId"] =
new
SelectList(_context.Companies.Select(c => new CompanyViewModel {Name = c.Name, Id = c.Id}).OrderBy(c => c.Name),
"Id", "Name", companyLogo.CompanyId);
return View(companyLogo);
}
svgMs.Position = 0;
companyLogo.Guid = Guid.NewGuid();
string vectorial = Path.Combine(hostingEnvironment.WebRootPath, "assets/logos",
companyLogo.Guid + ".svg");
if(System.IO.File.Exists(vectorial))
{
companyLogo.SvgLogo = null;
companyLogo.ErrorMessage = "GUID clash, please retry and report to the administrator.";
ViewData["CompanyId"] =
new
SelectList(_context.Companies.Select(c => new CompanyViewModel {Name = c.Name, Id = c.Id}).OrderBy(c => c.Name),
"Id", "Name", companyLogo.CompanyId);
return View(companyLogo);
}
FileStream outSvg = new FileStream(vectorial, FileMode.CreateNew);
await svgMs.CopyToAsync(outSvg);
svgMs.Position = 0;
SKSvg svg = null;
try
{
foreach(string format in new[] {"png", "webp"})
{
if(!Directory.Exists(Path.Combine(hostingEnvironment.WebRootPath, "assets/logos", format))) ;
Directory.CreateDirectory(Path.Combine(hostingEnvironment.WebRootPath, "assets/logos", format));
SKEncodedImageFormat skFormat;
switch(format)
{
case "webp":
skFormat = SKEncodedImageFormat.Webp;
break;
default:
skFormat = SKEncodedImageFormat.Png;
break;
}
foreach(int multiplier in new[] {1, 2, 3})
{
if(!Directory.Exists(Path.Combine(hostingEnvironment.WebRootPath, "assets/logos", format,
$"{multiplier}x"))) ;
Directory.CreateDirectory(Path.Combine(hostingEnvironment.WebRootPath, "assets/logos",
format, $"{multiplier}x"));
string rendered = Path.Combine(hostingEnvironment.WebRootPath, "assets/logos", format,
$"{multiplier}x", companyLogo.Guid + $".{format}");
if(System.IO.File.Exists(rendered))
{
companyLogo.SvgLogo = null;
companyLogo.ErrorMessage = "GUID clash, please retry and report to the administrator.";
ViewData["CompanyId"] =
new
SelectList(_context.Companies.Select(c => new CompanyViewModel {Name = c.Name, Id = c.Id}).OrderBy(c => c.Name),
"Id", "Name", companyLogo.CompanyId);
return View(companyLogo);
}
Console.WriteLine("Rendering {0}", rendered);
if(svg == null)
{
svg = new SKSvg();
svg.Load(svgMs);
}
SKRect svgSize = svg.Picture.CullRect;
SKMatrix matrix = SKMatrix.MakeScale(multiplier, multiplier);
SKBitmap bitmap = new SKBitmap((int)(svgSize.Width * multiplier),
(int)(svgSize.Height * multiplier));
SKCanvas canvas = new SKCanvas(bitmap);
canvas.DrawPicture(svg.Picture, ref matrix);
canvas.Flush();
SKImage image = SKImage.FromBitmap(bitmap);
SKData data = image.Encode(skFormat, 100);
FileStream outfs = new FileStream(rendered, FileMode.CreateNew);
data.SaveTo(outfs);
outfs.Close();
svgMs.Position = 0;
}
}
foreach(string format in new[] {"png", "webp"})
{
if(!Directory.Exists(Path.Combine(hostingEnvironment.WebRootPath, "assets/logos/thumbs",
format))) ;
Directory.CreateDirectory(Path.Combine(hostingEnvironment.WebRootPath, "assets/logos/thumbs",
format));
SKEncodedImageFormat skFormat;
switch(format)
{
case "webp":
skFormat = SKEncodedImageFormat.Webp;
break;
default:
skFormat = SKEncodedImageFormat.Png;
break;
}
foreach(int multiplier in new[] {1, 2, 3})
{
if(!Directory.Exists(Path.Combine(hostingEnvironment.WebRootPath, "assets/logos/thumbs",
format, $"{multiplier}x"))) ;
Directory.CreateDirectory(Path.Combine(hostingEnvironment.WebRootPath,
"assets/logos/thumbs", format, $"{multiplier}x"));
string rendered = Path.Combine(hostingEnvironment.WebRootPath, "assets/logos/thumbs",
format, $"{multiplier}x", companyLogo.Guid + $".{format}");
if(System.IO.File.Exists(rendered))
{
companyLogo.SvgLogo = null;
companyLogo.ErrorMessage = "GUID clash, please retry and report to the administrator.";
ViewData["CompanyId"] =
new
SelectList(_context.Companies.Select(c => new CompanyViewModel {Name = c.Name, Id = c.Id}).OrderBy(c => c.Name),
"Id", "Name", companyLogo.CompanyId);
return View(companyLogo);
}
Console.WriteLine("Rendering {0}", rendered);
if(svg == null)
{
svg = new SKSvg();
svg.Load(svgMs);
}
SKRect svgSize = svg.Picture.CullRect;
float svgMax = Math.Max(svgSize.Width, svgSize.Height);
float canvasMin = 32 * multiplier;
float scale = canvasMin / svgMax;
SKMatrix matrix = SKMatrix.MakeScale(scale, scale);
SKBitmap bitmap =
new SKBitmap((int)(svgSize.Width * scale), (int)(svgSize.Height * scale));
SKCanvas canvas = new SKCanvas(bitmap);
canvas.DrawPicture(svg.Picture, ref matrix);
canvas.Flush();
SKImage image = SKImage.FromBitmap(bitmap);
SKData data = image.Encode(skFormat, 100);
FileStream outfs = new FileStream(rendered, FileMode.CreateNew);
data.SaveTo(outfs);
outfs.Close();
svgMs.Position = 0;
}
}
}
catch(IOException e)
{
Console.WriteLine(e);
throw;
}
}
_context.Add(companyLogo);
await _context.SaveChangesAsync();
return RedirectToAction(nameof(Index));
}
// GET: CompanyLogos/Edit/5 // GET: CompanyLogos/Edit/5
public async Task<IActionResult> Edit(int? id) public async Task<IActionResult> Edit(int? id)

View File

@@ -1,41 +1,65 @@
@* @model Cicm.Database.Models.CompanyLogo *@ @model Cicm.Database.Models.CompanyLogo
@* *@ @{
@* @{ *@ ViewData["Title"] = "Create";
@* ViewData["Title"] = "Create"; *@ }
@* } *@ <h1>Create</h1>
@* *@ <h4>Company logo</h4>
@* <h1>Create</h1> *@ <hr />
@* *@ <div class="row">
@* <h4>Company logo</h4> *@ <div class="col-md-4">
@* <hr /> *@ <form asp-action="Create"
@* <div class="row"> *@ enctype="multipart/form-data">
@* <div class="col-md-4"> *@ <div asp-validation-summary="ModelOnly"
@* <form asp-action="Create"> *@ class="text-danger">
@* <div asp-validation-summary="ModelOnly" class="text-danger"></div> *@ </div>
@* <div class="form-group"> *@ <div class="form-group">
@* <label asp-for="CompanyId" class="control-label"></label> *@ <label asp-for="Company"
@* <select asp-for="CompanyId" class ="form-control" asp-items="ViewBag.CompanyId"></select> *@ class="control-label">
@* </div> *@ </label>
@* <div class="form-group"> *@ <select asp-for="CompanyId"
@* <label asp-for="Year" class="control-label"></label> *@ class="form-control"
@* <input asp-for="Year" class="form-control" /> *@ asp-items="ViewBag.CompanyId">
@* <span asp-validation-for="Year" class="text-danger"></span> *@ </select>
@* </div> *@ </div>
@* <div class="form-group"> *@ <div class="form-group">
@* <label asp-for="Guid" class="control-label"></label> *@ <label asp-for="Year"
@* <input asp-for="Guid" class="form-control" /> *@ class="control-label">
@* <span asp-validation-for="Guid" class="text-danger"></span> *@ </label>
@* </div> *@ <input asp-for="Year"
@* <div class="form-group"> *@ class="form-control" />
@* <input class="btn btn-primary" *@ <span asp-validation-for="Year"
@* type="submit" *@ class="text-danger">
@* value="Create" /> *@ </span>
@* <a asp-action="Index" *@ </div>
@* class="btn btn-secondary"> *@ <div class="form-group">
@* Back to List *@ <div class="col-md-10">
@* </a> *@ <label asp-for="SvgLogo"
@* </div> *@ class="control-label">
@* </form> *@ </label>
@* </div> *@ <input asp-for="SvgLogo"
@* </div> *@ class="form-control" />
@* *@ <span asp-validation-for="SvgLogo"
class="text-danger">
</span>
@if(Model?.ErrorMessage != null)
{
<span class="text-danger">@Model.ErrorMessage</span>
}
</div>
</div>
<div class="form-group">
<input class="btn btn-primary"
type="submit"
value="Create" />
<a asp-action="Index"
class="btn btn-secondary">
Back to List
</a>
</div>
</form>
</div>
</div>
@section Scripts {
@{ await Html.RenderPartialAsync("_ValidationScriptsPartial"); }
}

View File

@@ -8,9 +8,8 @@
<h1>Company logos</h1> <h1>Company logos</h1>
<p> <p>
<a aria-disabled="True" <a asp-action="Create"
asp-action="Create" class="btn btn-primary">
class="btn btn-primary disabled">
Create New Create New
</a> </a>
</p> </p>

View File

@@ -2,7 +2,7 @@
<Project Sdk="Microsoft.NET.Sdk.Web"> <Project Sdk="Microsoft.NET.Sdk.Web">
<PropertyGroup> <PropertyGroup>
<TargetFramework>netcoreapp2.2</TargetFramework> <TargetFramework>netcoreapp2.2</TargetFramework>
<Version>3.0.99.558</Version> <Version>3.0.99.574</Version>
<Company>Canary Islands Computer Museum</Company> <Company>Canary Islands Computer Museum</Company>
<Copyright>Copyright © 2003-2018 Natalia Portillo</Copyright> <Copyright>Copyright © 2003-2018 Natalia Portillo</Copyright>
<Product>Canary Islands Computer Museum Website</Product> <Product>Canary Islands Computer Museum Website</Product>