Created
May 2, 2018 04:45
-
-
Save mattbasta/c6647114c0cf546cc123235ceede0471 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const fs = require("fs"); | |
const inquirer = require("inquirer"); | |
async function main() { | |
console.log("Ready"); | |
const answers = await inquirer.prompt([ | |
{ | |
type: "input", | |
filter: parseFloat, | |
name: "width", | |
message: "How wide are the stripes?" | |
}, | |
{ | |
type: "input", | |
filter: parseFloat, | |
name: "height", | |
message: "How long are the stripes?" | |
}, | |
{ | |
type: "input", | |
filter: parseFloat, | |
name: "variance", | |
message: "Maximum opacity variance column to column (as percent decimal)?" | |
}, | |
{ | |
type: "input", | |
filter: parseFloat, | |
name: "verticalVariance", | |
message: "Maximum opacity variance stripe to stripe (as percent decimal)?" | |
}, | |
{ | |
type: "input", | |
filter: parseFloat, | |
name: "initial", | |
message: "What's the initial opacity (as percent decimal)?" | |
}, | |
{ | |
type: "input", | |
filter: parseFloat, | |
name: "stripesPerColumn", | |
message: "How many stripes are in a column?" | |
}, | |
{ | |
type: "input", | |
filter: parseFloat, | |
name: "columnCount", | |
message: "How many columns?" | |
} | |
]); | |
const halfWidth = answers.width / 2; | |
const halfHeight = answers.height / 2; | |
const output = fs.createWriteStream("slants.svg"); | |
const startOffset = -1 * halfWidth * answers.stripesPerColumn; | |
const totalHeight = answers.stripesPerColumn * halfHeight; | |
const totalWidth = startOffset + answers.width * answers.columnCount; | |
output.write( | |
`<svg height="${totalHeight}" width="${totalWidth}" xmlns="http://www.w3.org/2000/svg">` | |
); | |
output.write('<g stroke="none" fill="red">'); | |
function drawStripe(xOffset, yOffset, opacity) { | |
if (xOffset + answers.width < 0 || xOffset >= totalWidth) { | |
return; | |
} | |
output.write( | |
`<path d="M${xOffset} ${totalHeight - yOffset}l${halfWidth} ${-1 * | |
halfHeight}l${halfWidth} ${halfHeight}l${-1 * | |
halfWidth} ${halfHeight}" opacity="${opacity}" />` | |
); | |
} | |
function drawColumn(xOffset) { | |
const initialOpacity = | |
answers.initial + (Math.random() - 0.5 * 2) * answers.variance; | |
const opacityStep = initialOpacity / answers.stripesPerColumn; | |
for (let i = 0; i < answers.stripesPerColumn; i++) { | |
const baseOpacity = initialOpacity - opacityStep * i; | |
const stripeOpacity = | |
(Math.random() - 0.5) * 2 * answers.verticalVariance; | |
drawStripe( | |
xOffset + i * halfWidth, | |
i * halfHeight, | |
baseOpacity + stripeOpacity | |
); | |
} | |
} | |
let start = startOffset; | |
for (let i = 0; i < answers.columnCount; i++) { | |
drawColumn(start); | |
start += answers.width; | |
} | |
output.write("</g>"); | |
output.end("</svg>"); | |
} | |
main(); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment