SigSpec UI

.gitignore

@@ -3,3 +3,10 @@
 /src/**/bin
 /src/New folder
 **/*.user
+
+src/SigSpec.AspNetCore/SigSpecUI/*.js
+src/SigSpec.AspNetCore/SigSpecUI/*.css
+src/SigSpec.AspNetCore/SigSpecUI/*.js.map
+*.sqlite
+.vs/VSWorkspaceState.json
+.vs/SigSpec/v16/.suo

azure-pipelines.yml

@@ -63,6 +63,21 @@ steps:
  AzureBlobStorageConnectionString: $(AzureBlobStorageConnectionString)
  FtpPassword: $(FtpPassword)
 
+- task: Npm@1
+ displayName: 'Install UI Dependencies'
+ inputs:
+ workingDir: "src/SigSpec.UI"
+ verbose: false
+
+- task: Npm@1
+ displayName: 'Build UI'
+ inputs:
+ workingDir: "src/SigSpec.UI"
+ command: custom
+ verbose: false
+ customCommand: run build
+
+
 # Publish artifacts
 - task: CopyFiles@2
  displayName: 'Copy packages'

src/HelloSignalR/ChatHub.cs

@@ -19,7 +19,7 @@ public Task Send(string message)
 
  public Task AddPerson(Person person)
  {
- return Task.CompletedTask;
+ return Clients.All.PersonAdded(person);
  }
 
  public ChannelReader<Event> GetEvents()
@@ -49,5 +49,7 @@ public interface IChatClient
  Task Welcome();
 
  Task Send(string message);
+
+ Task PersonAdded(Person person);
  }
 }

src/SigSpec.AspNetCore/Extensions/SigSpecApplicationBuilderExtensions.cs

@@ -25,18 +25,21 @@ public static IApplicationBuilder UseSigSpec(this IApplicationBuilder app, Actio
  return app;
  }
 
- public static IApplicationBuilder UseSigSpecUi(this IApplicationBuilder app, Action<SigSpecUiSettings> configure = null)
+ public static IApplicationBuilder UseSigSpecUi(this IApplicationBuilder app,
+ Action<SigSpecUiSettings> configure = null)
  {
  var settings = new SigSpecUiSettings();
  configure?.Invoke(settings);
 
- // TODO: Redirect /sigspec to /sigspec/index.html
  // TODO: Inject URLs and document names from registered documents into index.html => and then JS
+ app.UseMiddleware<SigSpecUIIndexMiddleware>($"{settings.Route}/index.html", settings,
+ "SigSpec.AspNetCore.SigSpecUi.index.html");
 
  app.UseFileServer(new FileServerOptions
  {
  RequestPath = new PathString(settings.Route),
- FileProvider = new EmbeddedFileProvider(typeof(SigSpecApplicationBuilderExtensions).GetTypeInfo().Assembly, "SigSpec.AspNetCore.SigSpecUi")
+ FileProvider = new EmbeddedFileProvider(
+ typeof(SigSpecApplicationBuilderExtensions).GetTypeInfo().Assembly, "SigSpec.AspNetCore.SigSpecUi")
  });
 
  return app;

src/SigSpec.AspNetCore/Middlewares/SigSpecUiIndexMiddleware.cs

@@ -0,0 +1,44 @@
+using System;
+using System.Collections.Generic;
+using System.IO;
+using System.Reflection;
+using System.Text;
+using System.Threading.Tasks;
+using Microsoft.AspNetCore.Http;
+
+namespace SigSpec.AspNetCore.Middlewares
+{
+ internal class SigSpecUIIndexMiddleware
+ {
+ private readonly RequestDelegate _nextDelegate;
+ private readonly string _indexPath;
+ private readonly SigSpecUiSettings _settings;
+ private readonly string _resourcePath;
+
+ public SigSpecUIIndexMiddleware(RequestDelegate nextDelegate, string indexPath, SigSpecUiSettings settings, string resourcePath)
+ {
+ _nextDelegate = nextDelegate;
+ _indexPath = indexPath;
+ _settings = settings;
+ _resourcePath = resourcePath;
+ }
+
+ public async Task Invoke(HttpContext context)
+ {
+ if (context.Request.Path.HasValue && string.Equals(context.Request.Path.Value.Trim('/'), _indexPath.Trim('/'), StringComparison.OrdinalIgnoreCase))
+ {
+ var stream = typeof(SigSpecUIIndexMiddleware).GetTypeInfo().Assembly.GetManifestResourceStream(_resourcePath);
+ using (var reader = new StreamReader(stream))
+ {
+ context.Response.Headers["Content-Type"] = "text/html; charset=utf-8";
+ context.Response.StatusCode = 200;
+ await context.Response.WriteAsync(_settings.TransformHtml(await reader.ReadToEndAsync(), context.Request));
+ }
+ }
+ else
+ {
+ await _nextDelegate(context);
+ }
+ }
+ }
+}

src/SigSpec.AspNetCore/SigSpec.AspNetCore.csproj

@@ -14,10 +14,7 @@
  <PackageTags>SignalR Specification CodeGeneration</PackageTags>
  </PropertyGroup>
  <ItemGroup>
- <None Remove="SigSpecUi\index.html" />
- </ItemGroup>
- <ItemGroup>
- <EmbeddedResource Include="SigSpecUi\index.html" />
+ <EmbeddedResource Include="SigSpecUi\**\*" Exclude="bin\**;obj\**;**\*.xproj;packages\**;@(EmbeddedResource)" />
  </ItemGroup>
  <ItemGroup>
  <PackageReference Include="Microsoft.AspNetCore.Mvc.Core" Version="2.2.5" />
@@ -27,4 +24,4 @@
  <ItemGroup>
  <ProjectReference Include="..\SigSpec.Core\SigSpec.Core.csproj" />
  </ItemGroup>
-</Project>
+</Project>

src/SigSpec.AspNetCore/SigSpecSettings.cs

@@ -1,8 +1,11 @@
-namespace SigSpec.AspNetCore.Middlewares
+using Microsoft.AspNetCore.Http;
+
+namespace SigSpec.AspNetCore.Middlewares
 {
  public class SigSpecSettings
  {
  /// <summary>Gets or sets the path to serve the SigSpec document (default: '/sigspec/{documentName}/sigspec.json').</summary>
  public string Path { get; set; } = "/sigspec/{documentName}/sigspec.json";
+
  }
 }

src/SigSpec.AspNetCore/SigSpecUi/index.html

@@ -1,11 +1,25 @@
-<!DOCTYPE html>
-
-<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
-<head>
+<!DOCTYPE html>
+<html lang="en">
+ <head>
  <meta charset="utf-8" />
- <title>Hello World!</title>
-</head>
-<body>
- Hello World!
-</body>
-</html>
+ <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+ <meta name="viewport" content="width=device-width,initial-scale=1.0" />
+ <link rel="icon" href="<%= BASE_URL %>favicon.ico" />
+ <title><%= htmlWebpackPlugin.options.title %></title>
+ </head>
+
+ <body>
+ <noscript>
+ <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
+ </noscript>
+ <script>
+ window.baseURL = "/";
+ </script>
+
+ <div id="app"></div>
+ <script src="./app.js"></script>
+ <script src="./chunk-vendors.js"></script>
+ <link href="./app.css" rel="stylesheet" />
+ <link href="./chunk-vendors.css" rel="stylesheet" />
+ </body>
+</html>

src/SigSpec.AspNetCore/SigSpecUiSettings.cs

@@ -1,7 +1,14 @@
-namespace SigSpec.AspNetCore
+using Microsoft.AspNetCore.Http;
+
+namespace SigSpec.AspNetCore
 {
  public class SigSpecUiSettings
  {
  public string Route { get; set; } = "/sigspec";
+
+ public string TransformHtml(string html, HttpRequest contextRequest)
+ {
+ return html;
+ }
  }
 }

src/SigSpec.UI/.browserslistrc

@@ -0,0 +1,3 @@
+> 1%
+last 2 versions
+not dead

src/SigSpec.UI/.eslintrc.js

@@ -0,0 +1,23 @@
+module.exports = {
+ root: true,
+ env: {
+ node: true,
+ },
+ extends: ['plugin:vue/essential', 'eslint:recommended', '@vue/typescript/recommended'],
+ parserOptions: {
+ ecmaVersion: 2020,
+ },
+ rules: {
+ '@typescript-eslint/no-explicit-any': 'off',
+ 'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
+ 'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
+ },
+ overrides: [
+ {
+ files: ['**/__tests__/*.{j,t}s?(x)', '**/tests/unit/**/*.spec.{j,t}s?(x)'],
+ env: {
+ jest: true,
+ },
+ },
+ ],
+};

src/SigSpec.UI/.gitignore

@@ -0,0 +1,23 @@
+.DS_Store
+node_modules
+/dist
+
+/tests/e2e/videos/
+/tests/e2e/screenshots/
+
+# local env files
+.env.local
+.env.*.local
+
+# Log files
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# Editor directories and files
+.idea
+.vscode
+*.suo
+*.ntvs*
+*.sln
+*.sw?

src/SigSpec.UI/README.md

@@ -0,0 +1,34 @@
+# sigspec-ui
+
+## Project setup
+```
+npm install
+```
+
+### Compiles and hot-reloads for development
+```
+npm run serve
+```
+
+### Compiles and minifies for production
+```
+npm run build
+```
+
+### Run your unit tests
+```
+npm run test:unit
+```
+
+### Run your end-to-end tests
+```
+npm run test:e2e
+```
+
+### Lints and fixes files
+```
+npm run lint
+```
+
+### Customize configuration
+See [Configuration Reference](https://cli.vuejs.org/config/).