Skip to content

Commit b6d0bad

Browse files
qrohlfqrohlf
committed
trip dependencies, replace microbundle with rollup
1 parent a6c0683 commit b6d0bad

16 files changed

+622
-8055
lines changed

‎.travis.yml‎

Lines changed: 0 additions & 17 deletions
This file was deleted.

‎LICENSE‎

Lines changed: 1 addition & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,3 @@
1-
Trianglify is copyright Quinn Rohlf and licensed under version 3 of
2-
the GNU General Public License (GPLv3). If you choose to distribute it
3-
or a modified version of it, you need to include the modified source
4-
code and attribution to the original author (Quinn Rohlf) as well as a
5-
copy of this license file.
6-
7-
Thanks!
8-
-Quinn
9-
101
GNU GENERAL PUBLIC LICENSE
112
Version 3, 29 June 2007
123

@@ -627,4 +618,4 @@ an absolute waiver of all civil liability in connection with the
627618
Program, unless a warranty or assumption of liability accompanies a
628619
copy of the Program in return for a fee.
629620

630-
END OF TERMS AND CONDITIONS
621+
END OF TERMS AND CONDITIONS

‎bower.json‎

Lines changed: 0 additions & 21 deletions
This file was deleted.

‎examples/basic-web-example.html‎

Lines changed: 15 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -24,20 +24,29 @@
2424
<!-- This is the standalone build of Trianglify. It's easy to drop in to a
2525
project without any need for bundlers or dependency management, but in most
2626
modern web projects you will probably want to use the NPM module instead -->
27-
<script src="../dist/trianglify.bundle.umd.js"></script>
27+
<script src="../dist/trianglify.bundle.debug.js"></script>
2828
<script>
2929
const pattern = trianglify({
30+
cellSize: 50,
3031
width: window.innerWidth * .8,
3132
height: (window.innerHeight - 4 * 30) / 4
3233
})
33-
document.body.appendChild(pattern.toSVG(null, {coordinateDecimals: -1}))
34-
document.body.appendChild(pattern.toCanvas())
3534

36-
// stroke-only
37-
pattern.opts.fill = false
38-
pattern.opts.strokeWidth = 1
35+
// Render to SVG
3936
document.body.appendChild(pattern.toSVG())
37+
// Render to Canvas
4038
document.body.appendChild(pattern.toCanvas())
39+
40+
// stroke-only
41+
const strokeOnly = trianglify({
42+
cellSize: 75,
43+
width: window.innerWidth * .8,
44+
height: (window.innerHeight - 4 * 30) / 4,
45+
fill: false,
46+
strokeWidth: 1
47+
})
48+
document.body.appendChild(strokeOnly.toSVG())
49+
document.body.appendChild(strokeOnly.toCanvas())
4150
</script>
4251
</body>
4352
</html>

‎examples/color-function-example.html‎

Lines changed: 86 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,86 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8">
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
6+
<meta name="viewport" content="width=device-width, initial-scale=1">
7+
<title>Trianglify Basic Example</title>
8+
<style>
9+
html, body {
10+
margin: 0 0;
11+
padding: 0 0;
12+
text-align: center;
13+
background: #000;
14+
font-family: system-ui;
15+
}
16+
17+
h1 {
18+
font-size: 18px;
19+
}
20+
21+
.demo {
22+
background: #FFF;
23+
display: inline-block;
24+
padding: 20px;
25+
margin: 20px;
26+
}
27+
</style>
28+
</head>
29+
<body>
30+
<!-- This is the standalone build of Trianglify. It's easy to drop in to a
31+
project without any need for bundlers or dependency management, but in most
32+
modern web projects you will probably want to use the NPM module instead -->
33+
<script src="../dist/trianglify.bundle.umd.js"></script>
34+
<script>
35+
36+
const JITTER_FACTOR = 0.2
37+
38+
39+
// utility for building up HTML trees
40+
const h = (tagName, attrs = {}, children = []) => {
41+
const elem = document.createElement(tagName)
42+
attrs && Object.keys(attrs).forEach(
43+
k => attrs[k] !== undefined && elem.setAttribute(k, attrs[k])
44+
)
45+
children && children.forEach(c => elem.appendChild(c))
46+
return elem
47+
}
48+
49+
const addToPage = (pattern, description) => {
50+
document.body.appendChild(h('div', {'class': 'demo'}, [
51+
pattern.toCanvas(),
52+
h('h1', null, [document.createTextNode(description)])
53+
]
54+
))
55+
}
56+
57+
const seed = Math.random()
58+
59+
// Example 1: you can use the built-in color functions to customize the
60+
// color rendering of Trianglify. Here, we use the 'sparkle' color
61+
// function to apply a 10% jitter to the normal color gradients, which
62+
// will yield a glitter-like effect.
63+
const sparkle = trianglify({
64+
seed,
65+
width: 400,
66+
height: 300,
67+
cellSize: 15,
68+
colorFunction: trianglify.colorFunctions.sparkle(0.2)
69+
})
70+
addToPage(sparkle, 'trianglify.colorFunctions.sparkle(0.2)')
71+
72+
// Example 2: you can use the interpolateLinear color function to
73+
// customize how much the x or y gradient dominates the image.
74+
// Higher values for the bias will result in a more pronounced x-gradient,
75+
// while lower values will results in a more pronounced y-gradient
76+
const interpolate = trianglify({
77+
seed,
78+
width: 400,
79+
height: 300,
80+
cellSize: 15,
81+
colorFunction: trianglify.colorFunctions.interpolateLinear(0.1)
82+
})
83+
addToPage(interpolate, 'trianglify.colorFunctions.interpolateLinear(0.1)')
84+
</script>
85+
</body>
86+
</html>

‎examples/save-as-svg.js‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
// Basic command-line example
2+
// Usage: node save-as-svg.js
3+
var fs = require('fs')
4+
var trianglify = require('../dist/trianglify.js')
5+
6+
// Generate a pattern and render to an SVG node tree
7+
const svg = trianglify({
8+
width: 1920,
9+
height: 1080,
10+
cellSize: Math.random()*200 + 40,
11+
xColors: 'random',
12+
variance: Math.random(),
13+
}).toSVG()
14+
15+
// Save the string to a file
16+
fs.writeFileSync('trianglify.svg', svg.toString())

‎gulpfile.js‎

Lines changed: 0 additions & 70 deletions
This file was deleted.

0 commit comments

Comments
 (0)