Use ES6 templates to reduce duplication in the demo HTML
This commit is contained in:
parent
cd3c1c996c
commit
40c0e9b8c5
|
@ -1,6 +1,7 @@
|
|||
/font-renderer/target
|
||||
/partitioner/target
|
||||
/demo/client/target
|
||||
/demo/client/*.html
|
||||
/demo/client/*.js
|
||||
/demo/client/src/*.js
|
||||
/demo/client/src/*.js.map
|
||||
|
|
|
@ -0,0 +1,5 @@
|
|||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<link rel="stylesheet" href="/css/bootstrap/bootstrap.css">
|
||||
<link rel="stylesheet" href="/css/pathfinder.css">
|
||||
<script type="text/javascript" src="js/jquery/jquery.js"></script>
|
||||
<script type="text/javascript" src="js/bootstrap/bootstrap.js"></script>
|
|
@ -0,0 +1,15 @@
|
|||
<nav class="navbar navbar-toggleable-md navbar-inverse bg-inverse">
|
||||
<a class="navbar-brand" href="#">Pathfinder</a>
|
||||
<div class="collapse navbar-collapse">
|
||||
<ul class="navbar-nav mr-auto">
|
||||
<li class="nav-item dropdown active">
|
||||
<a class="nav-link dropdown-toggle" id="pf-demos-menu" data-toggle="dropdown"
|
||||
ref="/" aria-haspopup="true" aria-expanded="false">Demos</a>
|
||||
<div class="dropdown-menu" aria-labelledby="pf-demos-menu">
|
||||
<a class="dropdown-item" href="/">Text</a>
|
||||
<a class="dropdown-item" href="/svg">SVG</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
|
@ -3,30 +3,11 @@
|
|||
<head>
|
||||
<title>SVG — Pathfinder Demo</title>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<link rel="stylesheet" href="/css/bootstrap/bootstrap.css">
|
||||
<link rel="stylesheet" href="/css/pathfinder.css">
|
||||
<script type="text/javascript" src="js/jquery/jquery.js"></script>
|
||||
<script type="text/javascript" src="js/bootstrap/bootstrap.js"></script>
|
||||
${require('./include/header.html')}
|
||||
<script type="text/javascript" src="js/pathfinder/svg.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<nav class="navbar navbar-toggleable-md navbar-inverse bg-inverse">
|
||||
<a class="navbar-brand" href="#">Pathfinder</a>
|
||||
<div class="collapse navbar-collapse">
|
||||
<ul class="navbar-nav mr-auto">
|
||||
<li class="nav-item dropdown active">
|
||||
<a class="nav-link dropdown-toggle" id="pf-demos-menu"
|
||||
data-toggle="dropdown" ref="/" aria-haspopup="true"
|
||||
aria-expanded="false">Demos</a>
|
||||
<div class="dropdown-menu" aria-labelledby="pf-demos-menu">
|
||||
<a class="dropdown-item" href="/">Text</a>
|
||||
<a class="dropdown-item" href="/svg">SVG</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
${require('./include/navbar.html')}
|
||||
<div class="rounded py-1 px-3" id="pf-fps-label">0 ms</div>
|
||||
<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>
|
||||
|
|
|
@ -3,30 +3,11 @@
|
|||
<head>
|
||||
<title>Text — Pathfinder Demo</title>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<link rel="stylesheet" href="/css/bootstrap/bootstrap.css">
|
||||
<link rel="stylesheet" href="/css/pathfinder.css">
|
||||
<script type="text/javascript" src="js/jquery/jquery.js"></script>
|
||||
<script type="text/javascript" src="js/bootstrap/bootstrap.js"></script>
|
||||
${require('./include/header.html')}
|
||||
<script type="text/javascript" src="js/pathfinder/text.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<nav class="navbar navbar-toggleable-md navbar-inverse bg-inverse">
|
||||
<a class="navbar-brand" href="#">Pathfinder</a>
|
||||
<div class="collapse navbar-collapse">
|
||||
<ul class="navbar-nav mr-auto">
|
||||
<li class="nav-item dropdown active">
|
||||
<a class="nav-link dropdown-toggle" id="pf-demos-menu"
|
||||
data-toggle="dropdown" ref="/" aria-haspopup="true"
|
||||
aria-expanded="false">Demos</a>
|
||||
<div class="dropdown-menu" aria-labelledby="pf-demos-menu">
|
||||
<a class="dropdown-item" href="/">Text</a>
|
||||
<a class="dropdown-item" href="/svg">SVG</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
${require('./include/navbar.html')}
|
||||
<div class="rounded py-1 px-3" id="pf-fps-label">0 ms</div>
|
||||
<canvas id="pf-canvas" width="400" height="300"></canvas>
|
||||
<label class="btn btn-secondary btn-file pf-bottom-control" id="pf-load-font-button-label">
|
||||
|
|
|
@ -16,7 +16,10 @@
|
|||
"@types/opentype.js": "0.0.0",
|
||||
"base64-js": "^1.2.1",
|
||||
"bootstrap": "^4.0.0-alpha.6",
|
||||
"extract-loader": "^1.0.1",
|
||||
"file-loader": "^0.11.2",
|
||||
"gl-matrix": "^2.4.0",
|
||||
"html-loader": "^0.5.1",
|
||||
"lodash": "^4.17.4",
|
||||
"opentype.js": "^0.7.3",
|
||||
"parse-color": "^1.0.0",
|
||||
|
|
|
@ -21,6 +21,8 @@ import {PathfinderView, Timings} from './view';
|
|||
import AppController from './app-controller';
|
||||
import SSAAStrategy from "./ssaa-strategy";
|
||||
|
||||
require('../html/svg.html');
|
||||
|
||||
const parseColor = require('parse-color');
|
||||
|
||||
const SVG_NS: string = "http://www.w3.org/2000/svg";
|
||||
|
|
|
@ -26,6 +26,8 @@ import AppController from './app-controller';
|
|||
import PathfinderBufferTexture from './buffer-texture';
|
||||
import SSAAStrategy from './ssaa-strategy';
|
||||
|
||||
require('../html/text.html');
|
||||
|
||||
const TEXT: string =
|
||||
`’Twas brillig, and the slithy toves
|
||||
Did gyre and gimble in the wabe;
|
||||
|
|
|
@ -1,3 +1,5 @@
|
|||
const ExtractTextPlugin = require('extract-text-webpack-plugin');
|
||||
|
||||
module.exports = {
|
||||
devtool: 'inline-source-map',
|
||||
entry: {
|
||||
|
@ -10,11 +12,40 @@ module.exports = {
|
|||
test: /\.tsx?$/,
|
||||
use: 'ts-loader',
|
||||
exclude: /node_modules/,
|
||||
}
|
||||
},
|
||||
{
|
||||
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: {
|
||||
extensions: [".tsx", ".ts", ".js"],
|
||||
extensions: [".tsx", ".ts", ".html", ".js"],
|
||||
},
|
||||
output: {
|
||||
filename: "[name].js",
|
||||
|
|
|
@ -38,8 +38,8 @@ use std::mem;
|
|||
use std::path::{Path, PathBuf};
|
||||
use std::u32;
|
||||
|
||||
static STATIC_TEXT_DEMO_PATH: &'static str = "../client/html/text.html";
|
||||
static STATIC_SVG_DEMO_PATH: &'static str = "../client/html/svg.html";
|
||||
static STATIC_TEXT_DEMO_PATH: &'static str = "../client/text.html";
|
||||
static STATIC_SVG_DEMO_PATH: &'static str = "../client/svg.html";
|
||||
static STATIC_CSS_BOOTSTRAP_PATH: &'static str = "../client/node_modules/bootstrap/dist/css";
|
||||
static STATIC_CSS_PATHFINDER_PATH: &'static str = "../client/css/pathfinder.css";
|
||||
static STATIC_JS_BOOTSTRAP_PATH: &'static str = "../client/node_modules/bootstrap/dist/js";
|
||||
|
|
Loading…
Reference in New Issue