most export to pdf functionality re-instated
This commit is contained in:
parent
e8c77fc823
commit
94c324b2e7
17 changed files with 820 additions and 166 deletions
|
@ -2,10 +2,10 @@ export default `
|
|||
<g id="button">
|
||||
<circle
|
||||
cx="0" cy="0" r="3.4"
|
||||
style="stroke:var(--pattern-mark);fill:none;stroke-width:var(--pattern-stroke);"
|
||||
class="mark"
|
||||
/>
|
||||
<circle cx="-1" cy="-1" r="0.5" style="stroke:none;fill:var(--pattern-mark)"/>
|
||||
<circle cx="1" cy="-1" r="0.5" style="stroke:none;fill:var(--pattern-mark)" />
|
||||
<circle cx="1" cy="1" r="0.5" style="stroke:none;fill:var(--pattern-mark)" />
|
||||
<circle cx="-1" cy="1" r="0.5" style="stroke:none;fill:var(--pattern-mark)" />
|
||||
<circle cx="-1" cy="-1" r="0.5" class="no-stroke fill-mark"/>
|
||||
<circle cx="1" cy="-1" r="0.5" class="no-stroke fill-mark" />
|
||||
<circle cx="1" cy="1" r="0.5" class="no-stroke fill-mark" />
|
||||
<circle cx="-1" cy="1" r="0.5" class="no-stroke fill-mark" />
|
||||
</g>`
|
||||
|
|
|
@ -1,19 +1,19 @@
|
|||
export default `
|
||||
<g id="buttonhole">
|
||||
<path
|
||||
style="fill:none;stroke:var(--pattern-mark);stroke-width:var(--pattern-stroke);"
|
||||
class="mark"
|
||||
d="M -1,-5 L 1,-5 L 1,5 L -1,5 z"
|
||||
/>
|
||||
</g>
|
||||
<g id="buttonhole-start">
|
||||
<path
|
||||
style="fill:none;stroke:var(--pattern-mark);stroke-width:var(--pattern-stroke);"
|
||||
class="mark"
|
||||
d="M -1,-10 L 1,-10 L 1,0 L -1,0 z"
|
||||
/>
|
||||
</g>
|
||||
<g id="buttonhole-end">
|
||||
<path
|
||||
style="fill:none;stroke:var(--pattern-mark);stroke-width:var(--pattern-stroke);"
|
||||
class="mark"
|
||||
d="M -1,0 L 1,0 L 1,10 L -1,10 z"
|
||||
/>
|
||||
</g>`
|
||||
|
|
|
@ -1,8 +1,9 @@
|
|||
// FIXME identical arrow paths for dimensions, cutonfold, and grainline
|
||||
export default `
|
||||
<marker orient="auto" refY="0.0" refX="0.0" id="cutonfoldFrom" style="overflow:visible;" >
|
||||
<path class="note fill-note" d="M 0,0 L 12,-4 C 10,-2 10,2 12, 4 z" />
|
||||
<marker orient="auto" refY="4.0" refX="0.0" id="cutonfoldFrom" style="overflow:visible;" markerWidth="12" markerHeight="8">
|
||||
<path class="note fill-note" d="M 0,4 L 12,0 C 10,2 10,6 12,8 z" />
|
||||
</marker>
|
||||
<marker orient="auto" refY="0.0" refX="0.0" id="cutonfoldTo" style="overflow:visible;" >
|
||||
<path class="note fill-note" d="M 0,0 L -12,-4 C -10,-2 -10,2 -12, 4 z" />
|
||||
<marker orient="auto" refY="4.0" refX="12.0" id="cutonfoldTo" style="overflow:visible;" markerWidth="12" markerHeight="8">
|
||||
<path class="note fill-note" d="M 12,4 L 0,0 C 2,2 2,6 0,8 z" />
|
||||
</marker>
|
||||
`;
|
||||
|
|
|
@ -1,4 +1,9 @@
|
|||
// FIXME identical arrow paths for dimensions, cutonfold, and grainline
|
||||
export default `
|
||||
<marker orient="auto" refY="0.0" refX="0.0" id="dimensionFrom" style="overflow:visible;"><path class="mark fill-mark" d="M 0,0 L 12,-4 C 10,-2 10,2 12, 4 z" /></marker>
|
||||
<marker orient="auto" refY="0.0" refX="0.0" id="dimensionTo" style="overflow:visible;" ><path class="mark fill-mark" d="M 0,0 L -12,-4 C -10,-2 -10,2 -12, 4 z" /></marker>
|
||||
<marker orient="auto" refY="4.0" refX="0.0" id="dimensionFrom" style="overflow:visible;" markerWidth="12" markerHeight="8">
|
||||
<path class="mark fill-mark" d="M 0,4 L 12,0 C 10,2 10,6 12,8 z" />
|
||||
</marker>
|
||||
<marker orient="auto" refY="4.0" refX="12.0" id="dimensionTo" style="overflow:visible;" markerWidth="12" markerHeight="8">
|
||||
<path class="mark fill-mark" d="M 12,4 L 0,0 C 2,2 2,6 0,8 z" />
|
||||
</marker>
|
||||
`;
|
||||
|
|
|
@ -1,8 +1,9 @@
|
|||
// FIXME identical arrow paths for dimensions, cutonfold, and grainline
|
||||
export default `
|
||||
<marker orient="auto" refY="0.0" refX="0.0" id="grainlineFrom" style="overflow:visible;" >
|
||||
<path class="note fill-note" d="M 0,0 L 12,-4 C 10,-2 10,2 12, 4 z" />
|
||||
<marker orient="auto" refY="4.0" refX="10.0" id="grainlineFrom" style="overflow:visible;" markerWidth="12" markerHeight="8">
|
||||
<path class="note fill-note" d="M 0,4 L 12,0 C 10,2 10,6 12,8 z" />
|
||||
</marker>
|
||||
<marker orient="auto" refY="0.0" refX="0.0" id="grainlineTo" style="overflow:visible;" >
|
||||
<path class="note fill-note" d="M 0,0 L -12,-4 C -10,-2 -10,2 -12, 4 z" />
|
||||
<marker orient="auto" refY="4.0" refX="2.0" id="grainlineTo" style="overflow:visible;" markerWidth="12" markerHeight="8">
|
||||
<path class="note fill-note" d="M 12,4 L 0,0 C 2,2 2,6 0,8 z" />
|
||||
</marker>
|
||||
`
|
||||
|
|
|
@ -9,12 +9,12 @@ export default {
|
|||
name: pkg.name,
|
||||
version: pkg.version,
|
||||
hooks: {
|
||||
preRender: function (svg) {
|
||||
preRender: function (svg, data = {}) {
|
||||
if (svg.attributes.get('freesewing:plugin-theme') === false) {
|
||||
svg.attributes.set('class', 'freesewing')
|
||||
svg.style += sample
|
||||
svg.style += paperless
|
||||
svg.style += draft(svg.pattern.settings.scale)
|
||||
svg.style += draft(svg.pattern.settings.scale, data.stripped)
|
||||
if (svg.pattern.settings.paperless) {
|
||||
svg.pattern.settings.units === 'imperial'
|
||||
? (svg.defs += gridImperial)
|
||||
|
|
|
@ -1,17 +1,30 @@
|
|||
// FIXME surely this can be extracted from the theme in some way so as to keep things consistent?
|
||||
|
||||
const round = value => Math.round(value * 1e2) / 1e2
|
||||
|
||||
export default (scale) => `
|
||||
/* Reset */
|
||||
svg.freesewing path,
|
||||
svg.freesewing circle,
|
||||
svg.freesewing rect {
|
||||
const colors = {
|
||||
fabric: '#212121',
|
||||
lining: '#10b981',
|
||||
interfacing: '#a3a3a3',
|
||||
canvas: '#d97706',
|
||||
various: '#ef4444',
|
||||
note: '#8b5cf6',
|
||||
mark: '#3b82f6',
|
||||
contrast: '#ec4899'
|
||||
}
|
||||
|
||||
export default (scale, stripped) => `
|
||||
${!stripped ? '/* Reset */' : ''}
|
||||
${!stripped ? 'svg.freesewing ' : ''}path,
|
||||
${!stripped ? 'svg.freesewing ' : ''}circle,
|
||||
${!stripped ? 'svg.freesewing ' : ''}rect {
|
||||
fill: none;
|
||||
stroke: none;
|
||||
}
|
||||
|
||||
/* Defaults */
|
||||
svg.freesewing path,
|
||||
svg.freesewing circle {
|
||||
${!stripped ? '/* Defaults */' : ''}
|
||||
${!stripped ? 'svg.freesewing ' : ''}path,
|
||||
${!stripped ? 'svg.freesewing ' : ''}circle {
|
||||
stroke: #000;
|
||||
stroke-opacity: 1;
|
||||
stroke-width: ${round(0.3*scale)};
|
||||
|
@ -19,111 +32,118 @@ export default (scale) => `
|
|||
stroke-linejoin: round;
|
||||
}
|
||||
|
||||
/* Stroke classes */
|
||||
svg.freesewing .fabric {
|
||||
${!stripped ? '/* Stroke classes */' : ''}
|
||||
${!stripped ? 'svg.freesewing ' : ''}.fabric {
|
||||
stroke-width: ${round(0.6*scale)};
|
||||
stroke: #212121;
|
||||
stroke: ${colors.fabric};
|
||||
}
|
||||
svg.freesewing .lining {
|
||||
${!stripped ? 'svg.freesewing ' : ''}.lining {
|
||||
stroke-width: ${round(0.6*scale)};
|
||||
stroke: #ff5b77;
|
||||
stroke: ${colors.lining};
|
||||
}
|
||||
svg.freesewing .interfacing {
|
||||
${!stripped ? 'svg.freesewing ' : ''}.interfacing {
|
||||
stroke-width: ${round(0.6*scale)};
|
||||
stroke: #64b5f6;
|
||||
stroke: ${colors.interfacing};
|
||||
}
|
||||
svg.freesewing .canvas {
|
||||
${!stripped ? 'svg.freesewing ' : ''}.canvas {
|
||||
stroke-width: ${round(0.6*scale)};
|
||||
stroke: #ff9000;
|
||||
stroke: ${colors.canvas};
|
||||
}
|
||||
svg.freesewing .various {
|
||||
${!stripped ? 'svg.freesewing ' : ''}.various {
|
||||
stroke-width: ${round(0.6*scale)};
|
||||
stroke: #4caf50;
|
||||
stroke: ${colors.various};
|
||||
}
|
||||
svg.freesewing .note {
|
||||
${!stripped ? 'svg.freesewing ' : ''}.note {
|
||||
stroke-width: ${round(0.4*scale)};
|
||||
stroke: #dd60dd;
|
||||
stroke: ${colors.note};
|
||||
}
|
||||
svg.freesewing .mark {
|
||||
${!stripped ? 'svg.freesewing ' : ''}.mark {
|
||||
stroke-width: ${round(0.4*scale)};
|
||||
stroke: blue;
|
||||
stroke: ${colors.mark};
|
||||
}
|
||||
svg.freesewing .contrast {
|
||||
${!stripped ? 'svg.freesewing ' : ''}.contrast {
|
||||
stroke-width: ${round(0.8*scale)};
|
||||
stroke: red;
|
||||
stroke: ${colors.contrast};
|
||||
}
|
||||
svg.freesewing .stroke-xs {
|
||||
|
||||
${!stripped ? 'svg.freesewing ' : ''}.stroke-xs {
|
||||
stroke-width: ${round(0.1*scale)};
|
||||
}
|
||||
svg.freesewing .stroke-sm {
|
||||
${!stripped ? 'svg.freesewing ' : ''}.stroke-sm {
|
||||
stroke-width: ${round(0.2*scale)};
|
||||
}
|
||||
svg.freesewing .stroke-lg {
|
||||
${!stripped ? 'svg.freesewing ' : ''}.stroke-lg {
|
||||
stroke-width: ${round(0.6*scale)};
|
||||
}
|
||||
svg.freesewing .stroke-xl {
|
||||
${!stripped ? 'svg.freesewing ' : ''}.stroke-xl {
|
||||
stroke-width: ${round(1*scale)};
|
||||
}
|
||||
svg.freesewing .stroke-xxl,
|
||||
svg.freesewing .stroke-2xl {
|
||||
${!stripped ? 'svg.freesewing ' : ''}.stroke-xxl,
|
||||
${!stripped ? 'svg.freesewing ' : ''}.stroke-2xl {
|
||||
stroke-width: ${round(2*scale)};
|
||||
}
|
||||
svg.freesewing .stroke-3xl {
|
||||
${!stripped ? 'svg.freesewing ' : ''}.stroke-3xl {
|
||||
stroke-width: ${round(3*scale)};
|
||||
}
|
||||
svg.freesewing .stroke-4xl {
|
||||
${!stripped ? 'svg.freesewing ' : ''}.stroke-4xl {
|
||||
stroke-width: ${round(4*scale)};
|
||||
}
|
||||
|
||||
svg.freesewing .sa {
|
||||
${!stripped ? 'svg.freesewing ' : ''}.sa {
|
||||
stroke-dasharray: 0.4, 0.8;
|
||||
}
|
||||
svg.freesewing .help {
|
||||
${!stripped ? 'svg.freesewing ' : ''}.help {
|
||||
stroke-width: ${round(0.2*scale)};
|
||||
stroke-dasharray: 15, 1.5, 1, 1.5;
|
||||
}
|
||||
svg.freesewing .dotted {
|
||||
${!stripped ? 'svg.freesewing ' : ''}.dotted {
|
||||
stroke-dasharray: 0.4, 0.8;
|
||||
}
|
||||
svg.freesewing .dashed {
|
||||
${!stripped ? 'svg.freesewing ' : ''}.dashed {
|
||||
stroke-dasharray: 1, 1.5;
|
||||
}
|
||||
svg.freesewing .lashed {
|
||||
${!stripped ? 'svg.freesewing ' : ''}.lashed {
|
||||
stroke-dasharray: 6, 6;
|
||||
}
|
||||
svg.freesewing .hidden {
|
||||
${!stripped ? 'svg.freesewing ' : ''}.hidden {
|
||||
stroke: none;
|
||||
fill: none;
|
||||
}
|
||||
|
||||
/* Fill classes */
|
||||
svg.freesewing .fill-fabric {
|
||||
fill: #212121;
|
||||
}
|
||||
svg.freesewing .fill-lining {
|
||||
fill: #ff5b77;
|
||||
}
|
||||
svg.freesewing .fill-interfacing {
|
||||
fill: #64b5f6;
|
||||
}
|
||||
svg.freesewing .fill-canvas {
|
||||
fill: #ff9000;
|
||||
}
|
||||
svg.freesewing .fill-various {
|
||||
fill: #4caf50;
|
||||
}
|
||||
svg.freesewing .fill-note {
|
||||
fill: #dd69dd;
|
||||
}
|
||||
svg.freesewing .fill-mark {
|
||||
fill: blue;
|
||||
}
|
||||
svg.freesewing .fill-contrast {
|
||||
fill: red;
|
||||
${!stripped ? 'svg.freesewing ' : ''}.no-stroke { stroke: none !important; }
|
||||
${!stripped ? 'svg.freesewing ' : ''}.no-fill { fill: none !important; }
|
||||
${!stripped ? 'svg.freesewing ' : ''}.muted {
|
||||
stroke-opacity: 0.15;
|
||||
fill-opacity: 0.15;
|
||||
}
|
||||
|
||||
/* Text */
|
||||
svg.freesewing text {
|
||||
${!stripped ? '/* Fill classes */' : ''}
|
||||
${!stripped ? 'svg.freesewing ' : ''}.fill-fabric {
|
||||
fill: ${colors.fabric};
|
||||
}
|
||||
${!stripped ? 'svg.freesewing ' : ''}.fill-lining {
|
||||
fill: ${colors.lining};
|
||||
}
|
||||
${!stripped ? 'svg.freesewing ' : ''}.fill-interfacing {
|
||||
fill: ${colors.interfacing};
|
||||
}
|
||||
${!stripped ? 'svg.freesewing ' : ''}.fill-canvas {
|
||||
fill: ${colors.canvas};
|
||||
}
|
||||
${!stripped ? 'svg.freesewing ' : ''}.fill-various {
|
||||
fill: ${colors.various};
|
||||
}
|
||||
${!stripped ? 'svg.freesewing ' : ''}.fill-note {
|
||||
fill: ${colors.note};
|
||||
}
|
||||
${!stripped ? 'svg.freesewing ' : ''}.fill-mark {
|
||||
fill: ${colors.mark};
|
||||
}
|
||||
${!stripped ? 'svg.freesewing ' : ''}.fill-contrast {
|
||||
fill: ${colors.contrast};
|
||||
}
|
||||
|
||||
${!stripped ? '/* Text */' : ''}
|
||||
${!stripped ? 'svg.freesewing ' : ''}text {
|
||||
font-size: ${round(5*scale)}px;
|
||||
font-family: -apple-system, system-ui, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue',
|
||||
Arial, sans-serif;
|
||||
|
@ -132,31 +152,39 @@ export default (scale) => `
|
|||
font-weight: 200;
|
||||
dominant-baseline: ideographic;
|
||||
}
|
||||
svg.freesewing .text-xs {
|
||||
${!stripped ? 'svg.freesewing ' : ''}.text-xs {
|
||||
font-size: ${round(3*scale)}px;
|
||||
}
|
||||
svg.freesewing .text-sm {
|
||||
${!stripped ? 'svg.freesewing ' : ''}.text-sm {
|
||||
font-size: ${round(4*scale)}px;
|
||||
}
|
||||
svg.freesewing .text-lg {
|
||||
${!stripped ? 'svg.freesewing ' : ''}.text-lg {
|
||||
font-size: ${round(7*scale)}px;
|
||||
}
|
||||
svg.freesewing .text-xl {
|
||||
${!stripped ? 'svg.freesewing ' : ''}.text-xl {
|
||||
font-size: ${round(9*scale)}px;
|
||||
}
|
||||
svg.freesewing .text-xxl {
|
||||
${!stripped ? 'svg.freesewing ' : ''}.text-xxl {
|
||||
font-size: ${round(12*scale)}px;
|
||||
}
|
||||
${!stripped ? 'svg.freesewing ' : ''}.text-4xl {
|
||||
font-size: ${round(36*scale)}px;
|
||||
}
|
||||
|
||||
svg.freesewing .center {
|
||||
${!stripped ? 'svg.freesewing ' : ''}.center {
|
||||
text-anchor: middle;
|
||||
}
|
||||
svg.freesewing .right {
|
||||
${!stripped ? 'svg.freesewing ' : ''}.baseline-center {
|
||||
alignment-baseline: central;
|
||||
dominant-baseline: central;
|
||||
}
|
||||
|
||||
${!stripped ? 'svg.freesewing ' : ''}.right {
|
||||
text-anchor: end;
|
||||
}
|
||||
|
||||
/* Bartack */
|
||||
svg.freesewing path.bartack {
|
||||
${!stripped ? '/* Bartack */' : ''}
|
||||
${!stripped ? 'svg.freesewing ' : ''}path.bartack {
|
||||
stroke-width: ${round(2*scale)};
|
||||
stroke: #fd7e14;
|
||||
stroke-linecap: butt;
|
||||
|
|
|
@ -92,14 +92,6 @@ export default {
|
|||
.attr('data-text-class', 'fill-current font-bold')
|
||||
.attr('data-text-transform', transform(so.at.shift(-90 - so.rotation, shift * so.scale)))
|
||||
}
|
||||
shift += 6
|
||||
const dateformat = require('dateformat')
|
||||
const now = new Date()
|
||||
this.points[`_${prefix}_exportDate`] = so.at
|
||||
.shift(-90 - so.rotation, shift * so.scale)
|
||||
.attr('data-text', dateformat(now, 'yyyymmdd"T"HHMMo'))
|
||||
.attr('data-text-class', 'text-sm')
|
||||
.attr('data-text-transform', transform(so.at.shift(-90 - so.rotation, shift * so.scale)))
|
||||
},
|
||||
},
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue