Switch from ES6 interpolation to Handlebars and add a simple landing page
This commit is contained in:
parent
d6767219ff
commit
e448ba7b30
|
@ -3,11 +3,11 @@
|
||||||
<head>
|
<head>
|
||||||
<title>3D — Pathfinder Demo</title>
|
<title>3D — Pathfinder Demo</title>
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8">
|
||||||
${require('./include/header.html')}
|
{{>partials/header.html}}
|
||||||
<script type="text/javascript" src="/js/pathfinder/3d-demo.js"></script>
|
<script type="text/javascript" src="/js/pathfinder/3d-demo.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
${require('./include/navbar.html')}
|
{{>partials/navbar.html isDemo=true}}
|
||||||
<canvas id="pf-canvas" width="400" height="300"></canvas>
|
<canvas id="pf-canvas" width="400" height="300"></canvas>
|
||||||
<div class="fixed-bottom mb-3 d-flex justify-content-between align-items-end">
|
<div class="fixed-bottom mb-3 d-flex justify-content-between align-items-end">
|
||||||
<div class="ml-3">
|
<div class="ml-3">
|
||||||
|
@ -33,7 +33,7 @@
|
||||||
</div>
|
</div>
|
||||||
<button id="pf-settings-button" type="button" class="btn btn-outline-secondary"
|
<button id="pf-settings-button" type="button" class="btn btn-outline-secondary"
|
||||||
aria-expanded="false" aria-controls="#pf-settings">
|
aria-expanded="false" aria-controls="#pf-settings">
|
||||||
${require('octicons/build/svg/gear.svg')}
|
{{octicon "gear"}}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<div class="rounded py-1 px-3 mr-3" id="pf-fps-label">0 ms</div>
|
<div class="rounded py-1 px-3 mr-3" id="pf-fps-label">0 ms</div>
|
|
@ -0,0 +1,24 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>Pathfinder</title>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
{{>partials/header.html}}
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
{{>partials/navbar.html}}
|
||||||
|
<main id="content" class="mt-5 mb-5">
|
||||||
|
<div class="container">
|
||||||
|
<div class="flex-column">
|
||||||
|
<div class="text-center">
|
||||||
|
<h1>Pathfinder</h1>
|
||||||
|
<p class="lead">
|
||||||
|
A fast, high-quality, open source text and vector graphics renderer for
|
||||||
|
GPUs.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
</body>
|
||||||
|
</html>
|
|
@ -1,16 +1,19 @@
|
||||||
<nav class="navbar navbar-expand-sm navbar-dark bg-dark">
|
<nav class="navbar navbar-expand-sm navbar-dark bg-dark">
|
||||||
<a class="navbar-brand" href="#">Pathfinder</a>
|
<a class="navbar-brand" href="/">Pathfinder</a>
|
||||||
<div class="collapse navbar-collapse">
|
<div class="collapse navbar-collapse">
|
||||||
<ul class="navbar-nav mr-auto">
|
<ul class="navbar-nav mr-auto">
|
||||||
<li class="nav-item dropdown active">
|
<li class="nav-item dropdown {{#if isDemo}}active{{/if}}">
|
||||||
<a class="nav-link dropdown-toggle" id="pf-demos-menu" data-toggle="dropdown"
|
<a class="nav-link dropdown-toggle" id="pf-demos-menu" data-toggle="dropdown"
|
||||||
ref="/" aria-haspopup="true" aria-expanded="false">Demos</a>
|
ref="/" aria-haspopup="true" aria-expanded="false">Demos</a>
|
||||||
<div class="dropdown-menu" aria-labelledby="pf-demos-menu">
|
<div class="dropdown-menu" aria-labelledby="pf-demos-menu">
|
||||||
<a class="dropdown-item" href="/">Text</a>
|
<a class="dropdown-item" href="/demo/text">Text</a>
|
||||||
<a class="dropdown-item" href="/demo/svg">SVG</a>
|
<a class="dropdown-item" href="/demo/svg">SVG</a>
|
||||||
<a class="dropdown-item" href="/demo/3d">3D</a>
|
<a class="dropdown-item" href="/demo/3d">3D</a>
|
||||||
</div>
|
</div>
|
||||||
</li>
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="https://github.com/pcwalton/pathfinder">Code</a>
|
||||||
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</nav>
|
|
@ -3,11 +3,11 @@
|
||||||
<head>
|
<head>
|
||||||
<title>SVG — Pathfinder Demo</title>
|
<title>SVG — Pathfinder Demo</title>
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8">
|
||||||
${require('./include/header.html')}
|
{{>partials/header.html}}
|
||||||
<script type="text/javascript" src="/js/pathfinder/svg-demo.js"></script>
|
<script type="text/javascript" src="/js/pathfinder/svg-demo.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
${require('./include/navbar.html')}
|
{{>partials/navbar.html isDemo=true}}
|
||||||
<canvas id="pf-canvas" width="400" height="300"></canvas>
|
<canvas id="pf-canvas" width="400" height="300"></canvas>
|
||||||
<svg id="pf-svg" xmlns="http://www.w3.org/2000/svg" width="400" height="300"></svg>
|
<svg id="pf-svg" xmlns="http://www.w3.org/2000/svg" width="400" height="300"></svg>
|
||||||
<div class="fixed-bottom mb-3 d-flex justify-content-between align-items-end">
|
<div class="fixed-bottom mb-3 d-flex justify-content-between align-items-end">
|
||||||
|
@ -42,7 +42,7 @@
|
||||||
</div>
|
</div>
|
||||||
<button id="pf-settings-button" type="button" class="btn btn-outline-secondary"
|
<button id="pf-settings-button" type="button" class="btn btn-outline-secondary"
|
||||||
aria-expanded="false" aria-controls="#pf-settings">
|
aria-expanded="false" aria-controls="#pf-settings">
|
||||||
${require('octicons/build/svg/gear.svg')}
|
{{octicon "gear"}}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<div class="rounded py-1 px-3 mr-3" id="pf-fps-label">0 ms</div>
|
<div class="rounded py-1 px-3 mr-3" id="pf-fps-label">0 ms</div>
|
|
@ -3,11 +3,11 @@
|
||||||
<head>
|
<head>
|
||||||
<title>Text — Pathfinder Demo</title>
|
<title>Text — Pathfinder Demo</title>
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8">
|
||||||
${require('./include/header.html')}
|
{{>partials/header.html}}
|
||||||
<script type="text/javascript" src="/js/pathfinder/text-demo.js"></script>
|
<script type="text/javascript" src="/js/pathfinder/text-demo.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
${require('./include/navbar.html')}
|
{{>partials/navbar.html isDemo=true}}
|
||||||
<canvas id="pf-canvas" width="400" height="300"></canvas>
|
<canvas id="pf-canvas" width="400" height="300"></canvas>
|
||||||
<div class="fixed-bottom mb-3 d-flex justify-content-between align-items-end">
|
<div class="fixed-bottom mb-3 d-flex justify-content-between align-items-end">
|
||||||
<div class="ml-3">
|
<div class="ml-3">
|
||||||
|
@ -43,7 +43,7 @@
|
||||||
</div>
|
</div>
|
||||||
<button id="pf-settings-button" type="button" class="btn btn-outline-secondary"
|
<button id="pf-settings-button" type="button" class="btn btn-outline-secondary"
|
||||||
aria-expanded="false" aria-controls="#pf-settings">
|
aria-expanded="false" aria-controls="#pf-settings">
|
||||||
${require('octicons/build/svg/gear.svg')}
|
{{octicon "gear"}}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<div class="rounded py-1 px-3 mr-3" id="pf-fps-label">0 ms</div>
|
<div class="rounded py-1 px-3 mr-3" id="pf-fps-label">0 ms</div>
|
|
@ -16,9 +16,10 @@
|
||||||
"@types/opentype.js": "0.0.0",
|
"@types/opentype.js": "0.0.0",
|
||||||
"base64-js": "^1.2.1",
|
"base64-js": "^1.2.1",
|
||||||
"bootstrap": "^4.0.0-beta",
|
"bootstrap": "^4.0.0-beta",
|
||||||
"extract-loader": "^1.0.1",
|
|
||||||
"file-loader": "^0.11.2",
|
|
||||||
"gl-matrix": "^2.4.0",
|
"gl-matrix": "^2.4.0",
|
||||||
|
"handlebars": "^4.0.10",
|
||||||
|
"handlebars-loader": "^1.5.0",
|
||||||
|
"handlebars-webpack-plugin": "^1.2.0",
|
||||||
"html-loader": "^0.5.1",
|
"html-loader": "^0.5.1",
|
||||||
"jquery": "^3.2.1",
|
"jquery": "^3.2.1",
|
||||||
"lodash": "^4.17.4",
|
"lodash": "^4.17.4",
|
||||||
|
@ -27,7 +28,6 @@
|
||||||
"parse-color": "^1.0.0",
|
"parse-color": "^1.0.0",
|
||||||
"path-data-polyfill.js": "^1.0.2",
|
"path-data-polyfill.js": "^1.0.2",
|
||||||
"popper.js": "^1.12.5",
|
"popper.js": "^1.12.5",
|
||||||
"svg-inline-loader": "^0.8.0",
|
|
||||||
"ts-loader": "^2.3.2",
|
"ts-loader": "^2.3.2",
|
||||||
"typescript": "^2.4.2",
|
"typescript": "^2.4.2",
|
||||||
"webpack": "^3.4.1"
|
"webpack": "^3.4.1"
|
||||||
|
|
|
@ -7,5 +7,3 @@
|
||||||
// <LICENSE-MIT or http://opensource.org/licenses/MIT>, at your
|
// <LICENSE-MIT or http://opensource.org/licenses/MIT>, at your
|
||||||
// option. This file may not be copied, modified, or distributed
|
// option. This file may not be copied, modified, or distributed
|
||||||
// except according to those terms.
|
// except according to those terms.
|
||||||
|
|
||||||
require('../html/3d-demo.html');
|
|
||||||
|
|
|
@ -21,8 +21,6 @@ import {PathfinderView, Timings} from './view';
|
||||||
import AppController from './app-controller';
|
import AppController from './app-controller';
|
||||||
import SSAAStrategy from "./ssaa-strategy";
|
import SSAAStrategy from "./ssaa-strategy";
|
||||||
|
|
||||||
require('../html/svg-demo.html');
|
|
||||||
|
|
||||||
const parseColor = require('parse-color');
|
const parseColor = require('parse-color');
|
||||||
|
|
||||||
const SVG_NS: string = "http://www.w3.org/2000/svg";
|
const SVG_NS: string = "http://www.w3.org/2000/svg";
|
||||||
|
|
|
@ -26,8 +26,6 @@ import AppController from './app-controller';
|
||||||
import PathfinderBufferTexture from './buffer-texture';
|
import PathfinderBufferTexture from './buffer-texture';
|
||||||
import SSAAStrategy from './ssaa-strategy';
|
import SSAAStrategy from './ssaa-strategy';
|
||||||
|
|
||||||
require('../html/text-demo.html');
|
|
||||||
|
|
||||||
const TEXT: string =
|
const TEXT: string =
|
||||||
`’Twas brillig, and the slithy toves
|
`’Twas brillig, and the slithy toves
|
||||||
Did gyre and gimble in the wabe;
|
Did gyre and gimble in the wabe;
|
||||||
|
|
|
@ -1,3 +1,7 @@
|
||||||
|
const Handlebars = require('handlebars');
|
||||||
|
const HandlebarsPlugin = require('handlebars-webpack-plugin');
|
||||||
|
const fs = require('fs');
|
||||||
|
|
||||||
module.exports = {
|
module.exports = {
|
||||||
devtool: 'inline-source-map',
|
devtool: 'inline-source-map',
|
||||||
entry: {
|
entry: {
|
||||||
|
@ -8,43 +12,10 @@ module.exports = {
|
||||||
module: {
|
module: {
|
||||||
rules: [
|
rules: [
|
||||||
{
|
{
|
||||||
test: /\.tsx?$/,
|
test: /src\/[a-zA-Z0-9_-]+\.tsx?$/,
|
||||||
use: 'ts-loader',
|
use: 'ts-loader',
|
||||||
exclude: /node_modules/,
|
exclude: /node_modules/,
|
||||||
},
|
},
|
||||||
{
|
|
||||||
test: /\.svg?$/,
|
|
||||||
use: 'svg-inline-loader',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
test: /html\/[a-zA-Z0-9_-]+\.html$/,
|
|
||||||
use: [
|
|
||||||
{
|
|
||||||
loader: 'file-loader',
|
|
||||||
options: {
|
|
||||||
name: "[name].html",
|
|
||||||
},
|
|
||||||
},
|
|
||||||
'extract-loader',
|
|
||||||
{
|
|
||||||
loader: 'html-loader',
|
|
||||||
options: {
|
|
||||||
interpolate: true,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
test: /html\/include\/[a-zA-Z0-9_-]+\.html$/,
|
|
||||||
use: [
|
|
||||||
{
|
|
||||||
loader: 'html-loader',
|
|
||||||
options: {
|
|
||||||
interpolate: true,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
resolve: {
|
resolve: {
|
||||||
|
@ -54,4 +25,17 @@ module.exports = {
|
||||||
filename: "[name].js",
|
filename: "[name].js",
|
||||||
path: __dirname,
|
path: __dirname,
|
||||||
},
|
},
|
||||||
|
plugins: [
|
||||||
|
new HandlebarsPlugin({
|
||||||
|
entry: "html/*.hbs",
|
||||||
|
output: "./[name]",
|
||||||
|
partials: ["html/partials/*.hbs"],
|
||||||
|
helpers: {
|
||||||
|
octicon: function(iconName) {
|
||||||
|
const svg = fs.readFileSync(`node_modules/octicons/build/svg/${iconName}.svg`);
|
||||||
|
return new Handlebars.SafeString(svg);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
})
|
||||||
|
]
|
||||||
}
|
}
|
||||||
|
|
|
@ -38,6 +38,7 @@ use std::mem;
|
||||||
use std::path::{Path, PathBuf};
|
use std::path::{Path, PathBuf};
|
||||||
use std::u32;
|
use std::u32;
|
||||||
|
|
||||||
|
static STATIC_INDEX_PATH: &'static str = "../client/index.html";
|
||||||
static STATIC_TEXT_DEMO_PATH: &'static str = "../client/text-demo.html";
|
static STATIC_TEXT_DEMO_PATH: &'static str = "../client/text-demo.html";
|
||||||
static STATIC_SVG_DEMO_PATH: &'static str = "../client/svg-demo.html";
|
static STATIC_SVG_DEMO_PATH: &'static str = "../client/svg-demo.html";
|
||||||
static STATIC_3D_DEMO_PATH: &'static str = "../client/3d-demo.html";
|
static STATIC_3D_DEMO_PATH: &'static str = "../client/3d-demo.html";
|
||||||
|
@ -513,6 +514,10 @@ fn partition_svg_paths(request: Json<PartitionSvgPathsRequest>)
|
||||||
|
|
||||||
// Static files
|
// Static files
|
||||||
#[get("/")]
|
#[get("/")]
|
||||||
|
fn static_index() -> io::Result<NamedFile> {
|
||||||
|
NamedFile::open(STATIC_INDEX_PATH)
|
||||||
|
}
|
||||||
|
#[get("/demo/text")]
|
||||||
fn static_demo_text() -> io::Result<NamedFile> {
|
fn static_demo_text() -> io::Result<NamedFile> {
|
||||||
NamedFile::open(STATIC_TEXT_DEMO_PATH)
|
NamedFile::open(STATIC_TEXT_DEMO_PATH)
|
||||||
}
|
}
|
||||||
|
@ -597,6 +602,7 @@ fn main() {
|
||||||
rocket::ignite().mount("/", routes![
|
rocket::ignite().mount("/", routes![
|
||||||
partition_font,
|
partition_font,
|
||||||
partition_svg_paths,
|
partition_svg_paths,
|
||||||
|
static_index,
|
||||||
static_demo_text,
|
static_demo_text,
|
||||||
static_demo_svg,
|
static_demo_svg,
|
||||||
static_demo_3d,
|
static_demo_3d,
|
||||||
|
|
Loading…
Reference in New Issue