2017-11-10 16:58:07 -05:00
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html>
|
|
|
|
|
<head>
|
2017-11-20 20:18:30 -05:00
|
|
|
<title>Reference Test — Pathfinder</title>
|
2017-11-10 16:58:07 -05:00
|
|
|
<meta charset="utf-8">
|
|
|
|
|
{{>partials/header.html}}
|
2017-11-20 20:18:30 -05:00
|
|
|
<script type="text/javascript" src="/js/pathfinder/reference-test.js"></script>
|
2017-11-10 16:58:07 -05:00
|
|
|
</head>
|
2017-11-15 17:36:59 -05:00
|
|
|
<body>
|
|
|
|
|
<div id="pf-outer-container" class="w-100">
|
|
|
|
|
<div class="w-100">
|
|
|
|
|
{{>partials/navbar.html isTool=true}}
|
|
|
|
|
</div>
|
|
|
|
|
<div id="pf-inner-container" class="container-fluid">
|
|
|
|
|
<div class="row">
|
2017-11-20 20:18:30 -05:00
|
|
|
<div id="pf-reference-test-sidebar" class="col p-3">
|
2017-11-15 17:36:59 -05:00
|
|
|
<ul class="nav nav-tabs" role="tablist">
|
|
|
|
|
<li class="nav-item">
|
2017-12-20 21:49:44 -05:00
|
|
|
<a class="nav-link" id="pf-font-test-suite-tab" data-toggle="tab"
|
|
|
|
|
href="#pf-font-test-suite" role="tab"
|
|
|
|
|
aria-controls="pf-font-test-suite" aria-selected="false">
|
|
|
|
|
Font Test Suite
|
|
|
|
|
</a>
|
2017-11-15 17:36:59 -05:00
|
|
|
</li>
|
|
|
|
|
<li class="nav-item">
|
2017-12-20 21:49:44 -05:00
|
|
|
<a class="nav-link" id="pf-svg-test-suite-tab" data-toggle="tab"
|
|
|
|
|
href="#pf-svg-test-suite" role="tab"
|
|
|
|
|
aria-controls="pf-svg-test-suite" aria-selected="false">
|
|
|
|
|
SVG Test Suite
|
|
|
|
|
</a>
|
|
|
|
|
</li>
|
|
|
|
|
<li class="nav-item">
|
|
|
|
|
<a class="nav-link active" id="pf-font-custom-test-tab"
|
|
|
|
|
data-toggle="tab" href="#pf-font-custom-test" role="tab"
|
|
|
|
|
aria-controls="pf-font-custom-test"
|
|
|
|
|
aria-selected="true">
|
|
|
|
|
Custom Font Test
|
|
|
|
|
</a>
|
|
|
|
|
</li>
|
|
|
|
|
<li class="nav-item">
|
|
|
|
|
<a class="nav-link" id="pf-svg-custom-test-tab"
|
|
|
|
|
data-toggle="tab" href="#pf-svg-custom-test" role="tab"
|
|
|
|
|
aria-controls="pf-svg-custom-test">
|
|
|
|
|
Custom SVG Test
|
|
|
|
|
</a>
|
2017-11-15 17:36:59 -05:00
|
|
|
</li>
|
|
|
|
|
</ul>
|
|
|
|
|
<div class="tab-content">
|
2017-12-20 21:49:44 -05:00
|
|
|
<div class="tab-pane pt-3" id="pf-font-test-suite" role="tabpanel"
|
|
|
|
|
aria-labelledby="pf-font-test-suite-tab">
|
|
|
|
|
<button id="pf-run-font-tests-button" class="btn btn-primary m-2">
|
2017-11-15 17:36:59 -05:00
|
|
|
Run Tests
|
|
|
|
|
</button>
|
2017-12-20 21:49:44 -05:00
|
|
|
<table id="pf-font-results-table"
|
|
|
|
|
class="table table-sm table-striped">
|
2017-11-15 17:36:59 -05:00
|
|
|
<thead>
|
|
|
|
|
<tr>
|
|
|
|
|
<th scope="col"></th>
|
|
|
|
|
<th scope="col">Font</th>
|
|
|
|
|
<th scope="col">Char.</th>
|
|
|
|
|
<th scope="col">Size</th>
|
|
|
|
|
<th scope="col">AA</th>
|
|
|
|
|
<th scope="col">Subpixel</th>
|
|
|
|
|
<th scope="col">Reference</th>
|
|
|
|
|
<th scope="col">Expected SSIM</th>
|
|
|
|
|
<th scope="col">Actual SSIM</th>
|
|
|
|
|
</tr>
|
|
|
|
|
</thead>
|
|
|
|
|
<tbody></tbody>
|
|
|
|
|
</table>
|
|
|
|
|
</div>
|
2017-12-20 21:49:44 -05:00
|
|
|
<div class="tab-pane pt-3" id="pf-svg-test-suite" role="tabpanel"
|
|
|
|
|
aria-labelledby="pf-svg-test-suite-tab">
|
|
|
|
|
<button id="pf-run-svg-tests-button" class="btn btn-primary m-2">
|
|
|
|
|
Run Tests
|
|
|
|
|
</button>
|
|
|
|
|
<table id="pf-svg-results-table"
|
|
|
|
|
class="table table-sm table-striped">
|
|
|
|
|
<thead>
|
|
|
|
|
<tr>
|
|
|
|
|
<th scope="col"></th>
|
|
|
|
|
<th scope="col">SVG</th>
|
|
|
|
|
<th scope="col">AA</th>
|
|
|
|
|
<th scope="col">Reference</th>
|
|
|
|
|
<th scope="col">Expected SSIM</th>
|
|
|
|
|
<th scope="col">Actual SSIM</th>
|
|
|
|
|
</tr>
|
|
|
|
|
</thead>
|
|
|
|
|
<tbody></tbody>
|
|
|
|
|
</table>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="tab-pane show active p-3" id="pf-font-custom-test"
|
|
|
|
|
role="tabpanel" aria-labelledby="pf-font-custom-test-tab">
|
|
|
|
|
<form id="pf-font-custom-form">
|
|
|
|
|
<div id="pf-font-select-file-group" class="form-group">
|
2017-11-15 17:36:59 -05:00
|
|
|
<label for="pf-select-file">Font</label>
|
|
|
|
|
<select id="pf-select-file"
|
|
|
|
|
class="form-control custom-select">
|
|
|
|
|
</select>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="form-group">
|
|
|
|
|
<label for="pf-font-size">Font Size</label>
|
|
|
|
|
<div class="input-group">
|
|
|
|
|
<input id="pf-font-size" type="number"
|
|
|
|
|
class="form-control" value="32">
|
|
|
|
|
<div class="input-group-addon">px</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="form-group">
|
|
|
|
|
<label for="pf-character">Character</label>
|
|
|
|
|
<input id="pf-character" type="text" maxlength="1" class="form-control"
|
|
|
|
|
value="B">
|
|
|
|
|
</div>
|
|
|
|
|
<div class="form-group">
|
2017-12-20 21:49:44 -05:00
|
|
|
<label for="pf-font-reference-renderer">
|
|
|
|
|
Reference Renderer
|
|
|
|
|
</label>
|
|
|
|
|
<select id="pf-font-reference-renderer"
|
|
|
|
|
class="form-control custom-select">
|
|
|
|
|
<option value="freetype">FreeType</option>
|
|
|
|
|
<option value="core-graphics">Core Graphics</option>
|
|
|
|
|
</select>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="form-group row justify-content-between">
|
|
|
|
|
{{>partials/switch.html id="pf-subpixel-aa"
|
|
|
|
|
title="Subpixel AA"}}
|
|
|
|
|
</div>
|
|
|
|
|
<div id="pf-aa-level-group" class="form-group">
|
2017-11-15 17:36:59 -05:00
|
|
|
<label for="pf-aa-level-select">Antialiasing</label>
|
|
|
|
|
<select id="pf-aa-level-select"
|
|
|
|
|
class="form-control custom-select">
|
|
|
|
|
<option value="none">None</option>
|
|
|
|
|
<option value="ssaa-4">4×SSAA</option>
|
|
|
|
|
<option value="xcaa" selected>XCAA</option>
|
|
|
|
|
</select>
|
|
|
|
|
</div>
|
2017-12-20 21:49:44 -05:00
|
|
|
<div id="pf-font-ssim-group" class="form-group">
|
|
|
|
|
<label for="pf-font-ssim-label">SSIM</label>
|
|
|
|
|
<div id="pf-font-ssim-label">—</div>
|
|
|
|
|
</div>
|
|
|
|
|
</form>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="tab-pane p-3" id="pf-svg-custom-test"
|
|
|
|
|
role="tabpanel" aria-labelledby="pf-svg-custom-test-tab">
|
|
|
|
|
<form id="pf-svg-custom-form">
|
|
|
|
|
<div id="pf-svg-select-file-group" class="form-group">
|
|
|
|
|
<label for="pf-select-file">SVG</label>
|
2017-11-15 17:36:59 -05:00
|
|
|
</div>
|
|
|
|
|
<div class="form-group">
|
2017-12-20 21:49:44 -05:00
|
|
|
<label for="pf-svg-reference-renderer">
|
2017-11-15 17:36:59 -05:00
|
|
|
Reference Renderer
|
|
|
|
|
</label>
|
2017-12-20 21:49:44 -05:00
|
|
|
<select id="pf-svg-reference-renderer"
|
|
|
|
|
class="form-control custom-select">
|
|
|
|
|
<option value="pixman">Cairo/Pixman</option>
|
2017-11-15 17:36:59 -05:00
|
|
|
</select>
|
|
|
|
|
</div>
|
2017-12-20 21:49:44 -05:00
|
|
|
<div id="pf-svg-ssim-group" class="form-group">
|
|
|
|
|
<label for="pf-svg-ssim-label">SSIM</label>
|
|
|
|
|
<div id="pf-svg-ssim-label">—</div>
|
2017-11-15 17:36:59 -05:00
|
|
|
</div>
|
|
|
|
|
</form>
|
2017-11-10 20:04:59 -05:00
|
|
|
</div>
|
|
|
|
|
</div>
|
2017-11-15 17:36:59 -05:00
|
|
|
</div>
|
2017-11-17 20:29:18 -05:00
|
|
|
<div class="col-auto d-flex flex-column">
|
2017-11-15 17:36:59 -05:00
|
|
|
<div class="row">
|
2017-11-17 20:29:18 -05:00
|
|
|
<canvas id="pf-reference-canvas"
|
|
|
|
|
class="pf-draggable border border-top-0 border-right-0"
|
|
|
|
|
width="250" height="200"></canvas>
|
2017-11-15 17:36:59 -05:00
|
|
|
</div>
|
|
|
|
|
<div class="row">
|
2017-11-17 20:29:18 -05:00
|
|
|
<canvas id="pf-canvas"
|
|
|
|
|
class="pf-draggable pf-no-autoresize border border-top-0 border-right-0"
|
|
|
|
|
width="250" height="200"></canvas>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="row">
|
|
|
|
|
<canvas id="pf-difference-canvas"
|
|
|
|
|
class="pf-draggable border border-top-0 border-right-0"
|
|
|
|
|
width="250" height="200"></canvas>
|
2017-11-15 17:36:59 -05:00
|
|
|
</div>
|
|
|
|
|
</div>
|
2017-11-10 20:04:59 -05:00
|
|
|
</div>
|
|
|
|
|
</div>
|
2017-11-10 16:58:07 -05:00
|
|
|
</div>
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|
