michael/pathfinder
michael
/
pathfinder
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Add SSAA support to the benchmarking tool

This commit is contained in:
Patrick Walton 2017-09-13 21:41:33 -07:00
parent 299bcd685e
commit 0087c1ed50
5 changed files with 48 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
demo/client/css/pathfinder.css
View File

@ -53,6 +53,9 @@ button > svg path {
.pf-pointer-events-none { .pf-pointer-events-none {
pointer-events: none; pointer-events: none;
} }
.pf-pointer-events-auto {
pointer-events: auto;
}
#pf-rendering-options-group { #pf-rendering-options-group {
right: 1em; right: 1em;
} }

16
demo/client/html/benchmark.html.hbs
View File

@ -9,7 +9,21 @@
<body> <body>
{{>partials/navbar.html isTool=true}} {{>partials/navbar.html isTool=true}}
<canvas id="pf-canvas" class="pf-draggable" width="400" height="300"></canvas> <canvas id="pf-canvas" class="pf-draggable" width="400" height="300"></canvas>
<div class="fixed-bottom mb-3 d-flex justify-content-end align-items-end pf-pointer-events-none"> <div id="pf-nonoverlapping-bottom-bar"
class="fixed-bottom mb-3 pt-3 d-flex justify-content-between align-items-end pf-pointer-events-none border border-right-0 border-bottom-0 border-left-0">
<div class="container ml-3 pf-pointer-events-auto">
<div class="row">
<label for="pf-aa-level-select" class="col-form-label">Antialiasing</label>
<div class="col-md-auto">
<select id="pf-aa-level-select" class="form-control custom-select">
<option value="none" selected>None</option>
<option value="ssaa-2">2&times;SSAA</option>
<option value="ssaa-4">4&times;SSAA</option>
<option value="ecaa">ECAA (BROKEN)</option>
</select>
</div>
</div>
</div>
<div id="pf-toolbar"> <div id="pf-toolbar">
<button id="pf-run-benchmark-button" type="button" <button id="pf-run-benchmark-button" type="button"
class="btn btn-primary pf-toolbar-button"> class="btn btn-primary pf-toolbar-button">

25
demo/client/src/benchmark.ts
View File

@ -15,11 +15,13 @@ import { AppController, DemoAppController } from "./app-controller";
import {PathfinderMeshData} from "./meshes"; import {PathfinderMeshData} from "./meshes";
import { BUILTIN_FONT_URI, GlyphStorage, PathfinderGlyph, TextFrame, TextRun, ExpandedMeshData } from "./text"; import { BUILTIN_FONT_URI, GlyphStorage, PathfinderGlyph, TextFrame, TextRun, ExpandedMeshData } from "./text";
import { assert, unwrapNull, PathfinderError } from "./utils"; import { assert, unwrapNull, PathfinderError } from "./utils";
import { PathfinderDemoView, Timings } from "./view"; import { PathfinderDemoView, Timings, MonochromePathfinderView } from "./view";
import { ShaderMap, ShaderProgramSource } from "./shader-loader"; import { ShaderMap, ShaderProgramSource } from "./shader-loader";
import { AntialiasingStrategy, AntialiasingStrategyName, NoAAStrategy } from "./aa-strategy"; import { AntialiasingStrategy, AntialiasingStrategyName, NoAAStrategy } from "./aa-strategy";
import SSAAStrategy from './ssaa-strategy'; import SSAAStrategy from './ssaa-strategy';
import { OrthographicCamera } from './camera'; import { OrthographicCamera } from './camera';
import { ECAAStrategy, ECAAMonochromeStrategy } from './ecaa-strategy';
import PathfinderBufferTexture from './buffer-texture';
const STRING: string = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789"; const STRING: string = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
@ -33,6 +35,7 @@ const MAX_FONT_SIZE: number = 200;
const ANTIALIASING_STRATEGIES: AntialiasingStrategyTable = { const ANTIALIASING_STRATEGIES: AntialiasingStrategyTable = {
none: NoAAStrategy, none: NoAAStrategy,
ssaa: SSAAStrategy, ssaa: SSAAStrategy,
ecaa: ECAAMonochromeStrategy,
}; };
interface ElapsedTime { interface ElapsedTime {
@ -43,6 +46,7 @@ interface ElapsedTime {
interface AntialiasingStrategyTable { interface AntialiasingStrategyTable {
none: typeof NoAAStrategy; none: typeof NoAAStrategy;
ssaa: typeof SSAAStrategy; ssaa: typeof SSAAStrategy;
ecaa: typeof ECAAStrategy;
} }
class BenchmarkAppController extends DemoAppController<BenchmarkTestView> { class BenchmarkAppController extends DemoAppController<BenchmarkTestView> {
@ -73,6 +77,7 @@ class BenchmarkAppController extends DemoAppController<BenchmarkTestView> {
this.view.then(view => { this.view.then(view => {
view.uploadPathColors(1); view.uploadPathColors(1);
view.uploadPathTransforms(1); view.uploadPathTransforms(1);
view.uploadHints();
view.attachMeshes([expandedMeshes.meshes]); view.attachMeshes([expandedMeshes.meshes]);
}) })
}) })
@ -122,7 +127,7 @@ class BenchmarkAppController extends DemoAppController<BenchmarkTestView> {
textRun: TextRun<BenchmarkGlyph> | null; textRun: TextRun<BenchmarkGlyph> | null;
} }
class BenchmarkTestView extends PathfinderDemoView { class BenchmarkTestView extends MonochromePathfinderView {
constructor(appController: BenchmarkAppController, constructor(appController: BenchmarkAppController,
commonShaderSource: string, commonShaderSource: string,
shaderSources: ShaderMap<ShaderProgramSource>) { shaderSources: ShaderMap<ShaderProgramSource>) {
@ -139,9 +144,7 @@ class BenchmarkTestView extends PathfinderDemoView {
aaLevel: number, aaLevel: number,
subpixelAA: boolean): subpixelAA: boolean):
AntialiasingStrategy { AntialiasingStrategy {
if (aaType !== 'ecaa') return new (ANTIALIASING_STRATEGIES[aaType])(aaLevel, subpixelAA);
return new (ANTIALIASING_STRATEGIES[aaType])(aaLevel, subpixelAA);
throw new PathfinderError("Unsupported antialiasing type!");
} }
protected compositeIfNecessary(): void {} protected compositeIfNecessary(): void {}
@ -186,6 +189,15 @@ class BenchmarkTestView extends PathfinderDemoView {
} }
} }
uploadHints(): void {
const glyphCount = unwrapNull(this.appController.textRun).glyphs.length;
const pathHints = new Float32Array((glyphCount + 1) * 4);
const pathHintsBufferTexture = new PathfinderBufferTexture(this.gl, 'uPathHints');
pathHintsBufferTexture.upload(this.gl, pathHints);
this.pathHintsBufferTexture = pathHintsBufferTexture;
}
destFramebuffer: WebGLFramebuffer | null = null; destFramebuffer: WebGLFramebuffer | null = null;
get destAllocatedSize(): glmatrix.vec2 { get destAllocatedSize(): glmatrix.vec2 {
@ -234,6 +246,9 @@ class BenchmarkTestView extends PathfinderDemoView {
private _pixelsPerEm: number = 32.0; private _pixelsPerEm: number = 32.0;
readonly bgColor: glmatrix.vec4 = glmatrix.vec4.clone([1.0, 1.0, 1.0, 1.0]);
readonly fgColor: glmatrix.vec4 = glmatrix.vec4.clone([0.0, 0.0, 0.0, 1.0]);
protected directCurveProgramName: keyof ShaderMap<void> = 'directCurve'; protected directCurveProgramName: keyof ShaderMap<void> = 'directCurve';
protected directInteriorProgramName: keyof ShaderMap<void> = 'directInterior'; protected directInteriorProgramName: keyof ShaderMap<void> = 'directInterior';

9
demo/client/src/text-demo.ts
View File

@ -535,13 +535,8 @@ class TextDemoView extends MonochromePathfinderView {
0); 0);
} }
get bgColor(): glmatrix.vec4 { readonly bgColor: glmatrix.vec4 = glmatrix.vec4.fromValues(1.0, 1.0, 1.0, 1.0);
return glmatrix.vec4.fromValues(1.0, 1.0, 1.0, 1.0); readonly fgColor: glmatrix.vec4 = glmatrix.vec4.fromValues(0.0, 0.0, 0.0, 1.0);
}
get fgColor(): glmatrix.vec4 {
return glmatrix.vec4.fromValues(0.0, 0.0, 0.0, 1.0);
}
get destFramebuffer(): WebGLFramebuffer { get destFramebuffer(): WebGLFramebuffer {
return this.atlasFramebuffer; return this.atlasFramebuffer;

10
demo/client/src/view.ts
View File

@ -63,8 +63,14 @@ export abstract class PathfinderView {
private resizeToFit(initialSize: boolean) { private resizeToFit(initialSize: boolean) {
const width = window.innerWidth; const width = window.innerWidth;
const height = window.scrollY + window.innerHeight -
this.canvas.getBoundingClientRect().top; let height = window.scrollY + window.innerHeight - this.canvas.getBoundingClientRect().top;
const nonoverlappingBottomBar = document.getElementById('pf-nonoverlapping-bottom-bar');
if (nonoverlappingBottomBar != null) {
const rect = nonoverlappingBottomBar.getBoundingClientRect();
height -= window.innerHeight - rect.top;
}
const devicePixelRatio = window.devicePixelRatio; const devicePixelRatio = window.devicePixelRatio;
const canvasSize = new Float32Array([width, height]) as glmatrix.vec2; const canvasSize = new Float32Array([width, height]) as glmatrix.vec2;