info/BezierInfo-2
1
0
Fork 0
mirror of https://github.com/Pomax/BezierInfo-2.git synced 2025-08-13 12:14:23 +02:00
Code Issues Releases Wiki Activity

some cleanup

Browse Source
This commit is contained in:
Pomax
2017-03-26 11:41:20 -07:00
parent 6d5c31517c
commit 7a8413a697
7 changed files with 40 additions and 154 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
lib/site/basepage.html
View File

@@ -1,28 +0,0 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>{title}</title>
<!-- opengraph information -->
<meta property="og:title" content="A Primer on Bézier Curves">
<meta property="og:type" content="text">
<meta property="og:url" content="http://pomax.github.io/bezierinfo">
<meta property="og:description" content="A detailed explanation of Bézier curves, and how to do the many things that we commonly want to do with them.">
<meta property="og:locale" content="en_GB">
<meta property="og:type" content="article">
<meta property="og:published_time" content="2013-06-13 12:00:00">
<meta property="og:author" content="Mike 'Pomax' Kamermans">
<meta property="og:section" content="Bézier Curves">
<meta property="og:tag" content="Bézier Curves">
<style>
html, body, article { height: 100%; margin: 0; }
body { width: 800px; margin: auto; font-size: 4.25mm!important; }
</style>
</head>
<body>
<article><div id="article">{content}</div></article>
<script src="../lib/site/referrer.js" async></script>
</body>
</html>

38
lib/site/generateSingleSection.js
View File

@@ -1,38 +0,0 @@
var React = require('react');
var sections = require('../../components/sections');
var Page = require('../../components/Page.jsx');
module.exports = function generateSingleSection(name) {
var Type, entry;
var buildComponent = function(name, content, compact, entry) {
return React.createClass({
render: function() {
return <Page name={name} compact={compact} prev={entry-1} next={entry+1}>{content}</Page>;
}
});
};
// The root has no "section content".
if(name===false) {
var notice = (
<p className="single-notice">
This is the one-page-per-section version of the primer, to view
the regular version, please click <a href='..'>here</a>.
</p>
);
return buildComponent('/',notice, true, -1);
}
Object.keys(sections).map((n,idx) => {
if (name!==n) return;
entry = idx;
Type = sections[name];
});
var section = <Type key={name} name={name} number={entry}/>,
content = section,
SingleSection = buildComponent(name, content, true, entry);
return SingleSection;
};

72
lib/site/handlers.js
View File

@@ -1,5 +1,5 @@
module.exports = { window["Bezier Section Handlers"] = {
introduction: { "introduction": {
handler: (function() { return { handler: (function() { return {
drawQuadratic: function(api) { drawQuadratic: function(api) {
var curve = api.getDefaultQuadratic(); var curve = api.getDefaultQuadratic();
@@ -19,7 +19,7 @@ module.exports = {
}; };
}()) }())
}, },
whatis: { "whatis": {
handler: (function() { return { handler: (function() { return {
setup: function(api) { setup: function(api) {
api.setPanelCount(3); api.setPanelCount(3);
@@ -127,7 +127,7 @@ module.exports = {
}; };
}()) }())
}, },
explanation: { "explanation": {
handler: (function() { return { handler: (function() { return {
statics: { statics: {
keyHandlingOptions: { keyHandlingOptions: {
@@ -183,7 +183,7 @@ module.exports = {
}()), }()),
withKeys: true withKeys: true
}, },
control: { "control": {
handler: (function() { return { handler: (function() { return {
drawCubic: function(api) { drawCubic: function(api) {
var curve = api.getDefaultCubic(); var curve = api.getDefaultCubic();
@@ -345,7 +345,7 @@ module.exports = {
}; };
}()) }())
}, },
extended: { "extended": {
handler: (function() { return { handler: (function() { return {
setupQuadratic: function(api) { setupQuadratic: function(api) {
var curve = new api.Bezier(70, 155, 20, 110, 100,75); var curve = new api.Bezier(70, 155, 20, 110, 100,75);
@@ -382,7 +382,7 @@ module.exports = {
}; };
}()) }())
}, },
decasteljau: { "decasteljau": {
handler: (function() { return { handler: (function() { return {
setup: function(api) { setup: function(api) {
var points = [ var points = [
@@ -421,7 +421,7 @@ module.exports = {
}; };
}()) }())
}, },
flattening: { "flattening": {
handler: (function() { return { handler: (function() { return {
statics: { statics: {
keyHandlingOptions: { keyHandlingOptions: {
@@ -487,7 +487,7 @@ module.exports = {
}()), }()),
withKeys: true withKeys: true
}, },
splitting: { "splitting": {
handler: (function() { return { handler: (function() { return {
setupCubic: function(api) { setupCubic: function(api) {
var curve = api.getDefaultCubic(); var curve = api.getDefaultCubic();
@@ -581,7 +581,7 @@ module.exports = {
}; };
}()) }())
}, },
reordering: { "reordering": {
handler: (function() { var Reordering = { handler: (function() { var Reordering = {
statics: { statics: {
// Improve this based on http://www.sirver.net/blog/2011/08/23/degree-reduction-of-bezier-curves/ // Improve this based on http://www.sirver.net/blog/2011/08/23/degree-reduction-of-bezier-curves/
@@ -692,7 +692,7 @@ return Reordering;
}()), }()),
withKeys: true withKeys: true
}, },
pointvectors: { "pointvectors": {
handler: (function() { return { handler: (function() { return {
setupQuadratic: function(api) { setupQuadratic: function(api) {
var curve = api.getDefaultQuadratic(); var curve = api.getDefaultQuadratic();
@@ -727,7 +727,7 @@ return Reordering;
}; };
}()) }())
}, },
components: { "components": {
handler: (function() { return { handler: (function() { return {
setupQuadratic: function(api) { setupQuadratic: function(api) {
var curve = api.getDefaultQuadratic(); var curve = api.getDefaultQuadratic();
@@ -774,7 +774,7 @@ return Reordering;
}; };
}()) }())
}, },
extremities: { "extremities": {
handler: (function() { return { handler: (function() { return {
setupQuadratic: function(api) { setupQuadratic: function(api) {
var curve = api.getDefaultQuadratic(); var curve = api.getDefaultQuadratic();
@@ -830,7 +830,7 @@ return Reordering;
}; };
}()) }())
}, },
boundingbox: { "boundingbox": {
handler: (function() { return { handler: (function() { return {
setupQuadratic: function(api) { setupQuadratic: function(api) {
var curve = api.getDefaultQuadratic(); var curve = api.getDefaultQuadratic();
@@ -857,7 +857,7 @@ return Reordering;
}; };
}()) }())
}, },
aligning: { "aligning": {
handler: (function() { return { handler: (function() { return {
setupQuadratic: function(api) { setupQuadratic: function(api) {
var curve = api.getDefaultQuadratic(); var curve = api.getDefaultQuadratic();
@@ -914,7 +914,7 @@ return Reordering;
}; };
}()) }())
}, },
tightbounds: { "tightbounds": {
handler: (function() { return { handler: (function() { return {
setupQuadratic: function(api) { setupQuadratic: function(api) {
var curve = api.getDefaultQuadratic(); var curve = api.getDefaultQuadratic();
@@ -988,7 +988,7 @@ return Reordering;
}; };
}()) }())
}, },
inflections: { "inflections": {
handler: (function() { return { handler: (function() { return {
setupCubic: function(api) { setupCubic: function(api) {
var curve = new api.Bezier(135,25, 25, 135, 215,75, 215,240); var curve = new api.Bezier(135,25, 25, 135, 215,75, 215,240);
@@ -1008,7 +1008,7 @@ return Reordering;
}; };
}()) }())
}, },
canonical: { "canonical": {
handler: (function() { return { handler: (function() { return {
setup: function(api) { setup: function(api) {
var curve = api.getDefaultCubic(); var curve = api.getDefaultCubic();
@@ -1170,7 +1170,7 @@ return Reordering;
}; };
}()) }())
}, },
arclength: { "arclength": {
handler: (function() { var sin = Math.sin; handler: (function() { var sin = Math.sin;
var tau = Math.PI*2; var tau = Math.PI*2;
@@ -1264,7 +1264,7 @@ return {
}; };
}()) }())
}, },
arclengthapprox: { "arclengthapprox": {
handler: (function() { return { handler: (function() { return {
statics: { statics: {
keyHandlingOptions: { keyHandlingOptions: {
@@ -1326,7 +1326,7 @@ return {
}()), }()),
withKeys: true withKeys: true
}, },
tracing: { "tracing": {
handler: (function() { return { handler: (function() { return {
statics: { statics: {
keyHandlingOptions: { keyHandlingOptions: {
@@ -1456,7 +1456,7 @@ return {
}()), }()),
withKeys: true withKeys: true
}, },
intersections: { "intersections": {
handler: (function() { var min = Math.min, max = Math.max; handler: (function() { var min = Math.min, max = Math.max;
return { return {
@@ -1534,7 +1534,7 @@ return {
}; };
}()) }())
}, },
curveintersection: { "curveintersection": {
handler: (function() { var abs = Math.abs; handler: (function() { var abs = Math.abs;
return { return {
@@ -1654,7 +1654,7 @@ return {
}; };
}()) }())
}, },
abc: { "abc": {
handler: (function() { return { handler: (function() { return {
onClick: function(evt, api) { onClick: function(evt, api) {
api.t = api.curve.on({x: evt.offsetX, y: evt.offsetY},7); api.t = api.curve.on({x: evt.offsetX, y: evt.offsetY},7);
@@ -1779,7 +1779,7 @@ return {
}; };
}()) }())
}, },
moulding: { "moulding": {
handler: (function() { var abs = Math.abs; handler: (function() { var abs = Math.abs;
return { return {
@@ -1981,7 +1981,7 @@ return {
}; };
}()) }())
}, },
pointcurves: { "pointcurves": {
handler: (function() { var abs = Math.abs; handler: (function() { var abs = Math.abs;
return { return {
@@ -2148,7 +2148,7 @@ return {
}; };
}()) }())
}, },
catmullmoulding: { "catmullmoulding": {
handler: (function() { return { handler: (function() { return {
statics: { statics: {
keyHandlingOptions: { keyHandlingOptions: {
@@ -2283,7 +2283,7 @@ return {
}()), }()),
withKeys: true withKeys: true
}, },
polybezier: { "polybezier": {
handler: (function() { var atan2 = Math.atan2, sqrt = Math.sqrt, sin = Math.sin, cos = Math.cos; handler: (function() { var atan2 = Math.atan2, sqrt = Math.sqrt, sin = Math.sin, cos = Math.cos;
return { return {
@@ -2527,7 +2527,7 @@ return {
}; };
}()) }())
}, },
shapes: { "shapes": {
handler: (function() { var modes; handler: (function() { var modes;
return { return {
@@ -2619,7 +2619,7 @@ return {
}; };
}()) }())
}, },
projections: { "projections": {
handler: (function() { return { handler: (function() { return {
setup: function(api) { setup: function(api) {
api.setSize(320,320); api.setSize(320,320);
@@ -2677,7 +2677,7 @@ return {
}; };
}()) }())
}, },
offsetting: { "offsetting": {
handler: (function() { return { handler: (function() { return {
statics: { statics: {
keyHandlingOptions: { keyHandlingOptions: {
@@ -2739,7 +2739,7 @@ return {
}()), }()),
withKeys: true withKeys: true
}, },
graduatedoffset: { "graduatedoffset": {
handler: (function() { return { handler: (function() { return {
statics: { statics: {
keyHandlingOptions: { keyHandlingOptions: {
@@ -2780,7 +2780,7 @@ return {
}()), }()),
withKeys: true withKeys: true
}, },
circles: { "circles": {
handler: (function() { var sin = Math.sin, handler: (function() { var sin = Math.sin,
cos = Math.cos; cos = Math.cos;
@@ -2840,7 +2840,7 @@ return {
}; };
}()) }())
}, },
circles_cubic: { "circles_cubic": {
handler: (function() { var sin = Math.sin, cos = Math.cos, tan = Math.tan; handler: (function() { var sin = Math.sin, cos = Math.cos, tan = Math.tan;
return { return {
@@ -3048,7 +3048,7 @@ return {
}; };
}()) }())
}, },
arcapproximation: { "arcapproximation": {
handler: (function() { var atan2 = Math.atan2, PI = Math.PI, TAU = 2*PI, cos = Math.cos, sin = Math.sin; handler: (function() { var atan2 = Math.atan2, PI = Math.PI, TAU = 2*PI, cos = Math.cos, sin = Math.sin;
return { return {
@@ -3212,7 +3212,7 @@ return {
}()), }()),
withKeys: true withKeys: true
}, },
bsplines: { "bsplines": {
handler: (function() { return { handler: (function() { return {
basicSketch: require('./basic-sketch'), basicSketch: require('./basic-sketch'),
interpolationGraph: require('./interpolation-graph'), interpolationGraph: require('./interpolation-graph'),

18
lib/site/pagewrap.js
View File

@@ -1,18 +0,0 @@
module.exports = function(title, html) {
return [
"<!doctype html>",
"<html>",
"<head>",
"<meta charset='utf-8'>",
"<title>",
title,
"</title>",
"<base href='..'>",
"</head>",
"<body>",
html,
"</body>",
"</html>"
].join('\n');
};

31
lib/site/routemap.js
View File

@@ -1,31 +0,0 @@
var React = require('react');
var ReactRouter = require('react-router');
var Router = ReactRouter.Router;
var Route = ReactRouter.Route;
var Page = require("../../components/Page.jsx");
// get all the sections, and generate <Route> objects for each.
var sections = require("../../components/sections");
var generateSingleSection = require("./generateSingleSection");
var pageIDs = Object.keys(sections);
// Then we generate each page's <Route>
var rootComponent = generateSingleSection(false);
var root = <Route path={'/'} component={rootComponent} key={'/'}/>;
var pages = [root].concat(
pageIDs.map(id => {
<Route path={id} component={generateSingleSection(id)} key={id}/>
})
);
// And finally, the full app's route set, set to use "URL" rather than "hash" navigation.
// var createBrowserHistory = require('history/lib/createBrowserHistory');
// var history = createBrowserHistory();
module.exports = {
sections: sections,
paths: pageIDs,
routes: pages,
rootComponent: rootComponent,
RouteSet: <Router>{pages}</Router>
};

3
package.json
View File

@@ -3,12 +3,13 @@
"version": "2.0.0", "version": "2.0.0",
"description": "pomax.github.io/bezierinfo", "description": "pomax.github.io/bezierinfo",
"scripts": { "scripts": {
"bootstrap": "run-s makeindex localize", "bootstrap": "run-s makeindex makehandlers localize",
"localize": "node tools/make-locales", "localize": "node tools/make-locales",
"prebuild": "node tools/buildmark -- set", "prebuild": "node tools/buildmark -- set",
"build": "run-s bootstrap less build:** default", "build": "run-s bootstrap less build:** default",
"default": "node tools/copy-default-locale", "default": "node tools/copy-default-locale",
"postbuild": "node tools/buildmark -- resolve", "postbuild": "node tools/buildmark -- resolve",
"makehandlers": "node tools/aggregate-js-handlers",
"makeindex": "node tools/form-section-index-files", "makeindex": "node tools/form-section-index-files",
"build:en-GB": "webpack -p", "build:en-GB": "webpack -p",
"build:zh-CN": "cross-env LOCALE=zh-CN webpack -p", "build:zh-CN": "cross-env LOCALE=zh-CN webpack -p",

4
tools/aggregate-js-handlers.js
View File

@@ -21,7 +21,7 @@ Object.keys(index).forEach( section => {
let content = fs.readFileSync(handlerFile).toString(); let content = fs.readFileSync(handlerFile).toString();
content = content.replace("module.exports = ","return "); content = content.replace("module.exports = ","return ");
content = `(function() { ${content} }())`; content = `(function() { ${content} }())`;
let def = ` ${section}: { let def = ` "${section}": {
handler: ${content}`; handler: ${content}`;
if (content.indexOf('keyHandlingOptions') > -1) { def += `,\n withKeys: true`; } if (content.indexOf('keyHandlingOptions') > -1) { def += `,\n withKeys: true`; }
def += `\n }`; def += `\n }`;
@@ -29,5 +29,5 @@ Object.keys(index).forEach( section => {
} }
}); });
var masterFile = `module.exports = {\n${ handlers.join(',\n') }\n};\n`; var masterFile = `window["Bezier Section Handlers"] = {\n${ handlers.join(',\n') }\n};\n`;
fs.writeFileSync(path.join(BASEDIR, "lib/site/handlers.js"), masterFile); fs.writeFileSync(path.join(BASEDIR, "lib/site/handlers.js"), masterFile);