16mm
/
bellows-generator
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Optionally show a key explaining the folding directions. 

Show correct colored dash lines for folds
This commit is contained in:
mmcw-dev 2017-12-27 18:11:50 -05:00
parent d2e3c5a5b4
commit 86e705c2de
3 changed files with 51 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
docs/index.html
View File

@ -101,6 +101,10 @@ input{
<label for="align">Adjust Alignment</label>
<input name="align" type="number" value="0" min="0" />
</div>
<div>
<label for="key">Show Key</label>
<input name="key" type="checkbox" checked />
</div>
</div>
</form>
<div>
@ -108,8 +112,8 @@ input{
<button id="download" onclick="download();">Download</button>
</div>
<img id="img" />
<!--<script src="../src/bellows.js"> </script>-->
<script src="https://rawgit.com/sixteenmillimeter/bellows/master/src/bellows.js">
<script src="../src/bellows.js"> </script>
</script>
<script>
'use script'
@ -140,6 +144,7 @@ input{
const maxLength = Math.round($('maxLength').value * MM);
const key = $('key').checked
const align = Math.round($('align').value);
let parts = Math.round($('parts').value);
@ -165,7 +170,8 @@ input{
maxLength : maxLength,
parts : parts,
align : align
align : align,
key : key
}
);
document.getElementById('img').setAttribute('src', B);

2
package.json
View File

@ -8,7 +8,7 @@
},
"devDependencies": {},
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
"test": "node ./example"
},
"repository": {
"type": "git",

65
src/bellows.js
View File

@ -8,6 +8,8 @@
const IN = 25.4
const BLACK = '0,0,0,1.0'
const RED = '255,0,0,1.0'
const BLUE = '0,0,255,1.0'
let browser = (typeof module === 'undefined')
let createCanvas
@ -110,6 +112,8 @@ function bellows (options = {}) {
let centerX = Math.round(pageW / 2)
let centerY = Math.round(pageH / 2)
let key = (typeof options.key !== 'undefined' && options.key === false) ? false : true
let fold = (frontOW - frontIW) / 2
let folds = Math.floor(maxLength / fold)
let length = folds * fold
@ -117,10 +121,6 @@ function bellows (options = {}) {
let angleW
let angleH
//console.dir(options)
if (!browser) {
canvas = createCanvas(pageW, pageH)
} else {
@ -136,13 +136,10 @@ function bellows (options = {}) {
ctx.fillStyle = 'rgba(255, 255, 255, 1.0)'
ctx.fillRect(0, 0, pageW, pageH)
//key
ctx.font = '15px Arial';
//text config
ctx.fillStyle='rgba(0,0,0,1.0)'
ctx.font = '24px Arial';
ctx.textAlign= 'start';
ctx.fillText('Cut lines' ,150, 60);
line(ctx, BLACK, [IN * dpi, IN * dpi], [(2 * IN) * dpi, IN * dpi])
function sideW (side) {
const frontOffset = Math.round((backOW - frontOW) / 2)
@ -179,7 +176,7 @@ function bellows (options = {}) {
t = 0
}
//fold out
dash(ctx, '255,0,0,1.0', dpi, [foldIN + t, Y + (i * fold)], [foldIN + backIW - t, Y + (i * fold)])
dash(ctx, BLUE, dpi, [foldIN + t, Y + (i * fold)], [foldIN + backIW - t, Y + (i * fold)])
} else {
if (backOW !== frontOW) {
t = taper(backOW, frontOW, length, i * fold)
@ -187,7 +184,7 @@ function bellows (options = {}) {
t = 0
}
//fold in
dash(ctx, '0,0,255,1.0', dpi, [foldOUT + t, Y + (i * fold)], [foldOUT + backOW - t, Y + (i * fold)])
dash(ctx, RED, dpi, [foldOUT + t, Y + (i * fold)], [foldOUT + backOW - t, Y + (i * fold)])
}
}
@ -201,7 +198,7 @@ function bellows (options = {}) {
t = 0
t2 = 0
}
dash(ctx, '255,0,0,1.0', dpi, [foldIN + t, Y + i * fold ], [foldIN - ((backOW - backIW) / 2) + t2, (Y + (i + 1) * fold) ])
dash(ctx, BLUE, dpi, [foldIN + t, Y + i * fold ], [foldIN - ((backOW - backIW) / 2) + t2, (Y + (i + 1) * fold) ])
} else {
if (backIW !== frontIW) {
t = taper(backIW, frontIW, length, i * fold)
@ -210,7 +207,7 @@ function bellows (options = {}) {
t = 0
t2 = 0
}
dash(ctx, '255,0,0,1.0', dpi, [foldOUT + t, Y + i * fold ], [foldIN + t2, (Y + (i + 1) * fold) ])
dash(ctx, BLUE, dpi, [foldOUT + t, Y + i * fold ], [foldIN + t2, (Y + (i + 1) * fold) ])
}
//
}
@ -224,7 +221,7 @@ function bellows (options = {}) {
t = 0
t2 = 0
}
dash(ctx, '255,0,0,1.0', dpi, [foldIN + backIW - t, Y + i * fold ], [foldOUT + backOW - t2, (Y + (i + 1) * fold) ])
dash(ctx, BLUE, dpi, [foldIN + backIW - t, Y + i * fold ], [foldOUT + backOW - t2, (Y + (i + 1) * fold) ])
} else {
if (backIW !== frontIW) {
t = taper(backIW, frontIW, length, i * fold)
@ -233,7 +230,7 @@ function bellows (options = {}) {
t = 0
t2 = 0
}
dash(ctx, '255,0,0,1.0', dpi, [foldOUT + backOW - t, Y + i * fold ], [foldIN + backIW - t2, (Y + (i + 1) * fold) ])
dash(ctx, BLUE, dpi, [foldOUT + backOW - t, Y + i * fold ], [foldIN + backIW - t2, (Y + (i + 1) * fold) ])
}
//
}
@ -274,7 +271,7 @@ function bellows (options = {}) {
t = 0
}
//fold out
dash(ctx, '255,0,0,1.0', dpi, [foldIN + t, Y + (i * fold)], [foldIN + backIH - t, Y + (i * fold)])
dash(ctx, BLUE, dpi, [foldIN + t, Y + (i * fold)], [foldIN + backIH - t, Y + (i * fold)])
} else {
if (backOH !== frontOH) {
t = taper(backOH, frontOH, length, i * fold)
@ -282,7 +279,7 @@ function bellows (options = {}) {
t = 0
}
//fold in
dash(ctx, '0,0,255,1.0', dpi, [foldOUT + t, Y + (i * fold)], [foldOUT + backOH - t, Y + (i * fold)])
dash(ctx, RED, dpi, [foldOUT + t, Y + (i * fold)], [foldOUT + backOH - t, Y + (i * fold)])
}
}
@ -296,7 +293,7 @@ function bellows (options = {}) {
t = 0
t2 = 0
}
dash(ctx, '255,0,0,1.0', dpi, [foldIN + t, Y + i * fold ], [foldIN - ((backOH - backIH) / 2) + t2, (Y + (i + 1) * fold) ])
dash(ctx, BLUE, dpi, [foldIN + t, Y + i * fold ], [foldIN - ((backOH - backIH) / 2) + t2, (Y + (i + 1) * fold) ])
} else {
if (backIH !== frontIH) {
t = taper(backIH, frontIH, length, i * fold)
@ -305,7 +302,7 @@ function bellows (options = {}) {
t = 0
t2 = 0
}
dash(ctx, '255,0,0,1.0', dpi, [foldOUT + t, Y + i * fold ], [foldIN + t2, (Y + (i + 1) * fold) ])
dash(ctx, BLUE, dpi, [foldOUT + t, Y + i * fold ], [foldIN + t2, (Y + (i + 1) * fold) ])
}
//
}
@ -319,7 +316,7 @@ function bellows (options = {}) {
t = 0
t2 = 0
}
dash(ctx, '255,0,0,1.0', dpi, [foldIN + backIH - t, Y + i * fold ], [foldOUT + backOH - t2, (Y + (i + 1) * fold) ])
dash(ctx, BLUE, dpi, [foldIN + backIH - t, Y + i * fold ], [foldOUT + backOH - t2, (Y + (i + 1) * fold) ])
} else {
if (backIH !== frontIH) {
t = taper(backIH, frontIH, length, i * fold)
@ -328,15 +325,35 @@ function bellows (options = {}) {
t = 0
t2 = 0
}
dash(ctx, '255,0,0,1.0', dpi, [foldOUT + backOH - t, Y + i * fold ], [foldIN + backIH - t2, (Y + (i + 1) * fold) ])
dash(ctx, BLUE, dpi, [foldOUT + backOH - t, Y + i * fold ], [foldIN + backIH - t2, (Y + (i + 1) * fold) ])
}
}
}
function overlap () {
function overlap (side) {
const frontOffset = Math.round((backOW - frontOW) / 2)
const X = -backOW / 2
const Y = -length / 2
let foldIN = X + ((backOW - backIW) / 2) //inside
let foldOUT = X //outside
let t
let t2
}
if (key) {
//key
ctx.fillText('Cut lines', dpi / 2, dpi / 2);
line(ctx, BLACK, [dpi / 2, (dpi / 2) + 10], [dpi, (dpi / 2) + 10]);
ctx.fillText('Fold away', dpi / 2, (dpi / 2) + (dpi / 6));
dash(ctx, BLUE, dpi, [dpi / 2, (dpi / 2) + (dpi / 6) + 10], [dpi, (dpi / 2) + (dpi / 6) + 10]);
ctx.fillText('Fold toward', dpi / 2, (dpi / 2) + (dpi / 3));
dash(ctx, RED, dpi, [dpi / 2, (dpi / 2) + (dpi / 3) + 10], [dpi, (dpi / 2) + (dpi / 3) + 10]);
}
ctx.translate(centerX, centerY)
angleW = Math.atan( (backOW - frontOW) / length) // / (Math.PI / 180)
angleH = Math.atan( (backOH - frontOH) / length)
@ -348,7 +365,7 @@ function bellows (options = {}) {
sideW(1)
if (parts === 4) {
ctx.translate(backOH - backIH, 0)
ctx.translate(backOH - backIH + (0.2 * backOW), 0)
}
ctx.translate((backOW / 2) + (backOH / 2) - (((backOW - frontIW) + (backOH - frontIH)) / 4), align)