1
0
Fork 0

working reset and export buttons for print layout

This commit is contained in:
Enoch Riese 2023-06-05 16:07:16 -05:00
parent b879e23018
commit 62638902e8
15 changed files with 266 additions and 111 deletions

View file

@ -2,39 +2,36 @@ import Worker from 'web-worker'
import fileSaver from 'file-saver'
import { themePlugin } from '@freesewing/plugin-theme'
import { pluginI18n } from '@freesewing/plugin-i18n'
import { pagesPlugin, fabricPlugin } from '../layout/plugin-layout-part.mjs'
import { pagesPlugin, fabricPlugin } from 'shared/plugins/plugin-layout-part.mjs'
import { pluginAnnotations } from '@freesewing/plugin-annotations'
import { cutLayoutPlugin } from '../layout/cut/plugin-cut-layout.mjs'
import { fabricSettingsOrDefault } from '../layout/cut/index.mjs'
import { useFabricLength } from '../layout/cut/settings.mjs'
import { capitalize, formatMm } from 'shared/utils.mjs'
import {
defaultPrintSettings,
printSettingsPath,
} from 'shared/components/workbench/views/print/config.mjs'
import get from 'lodash.get'
export const ns = ['plugin', 'common']
export const exportTypes = {
exportForPrinting: ['a4', 'a3', 'a2', 'a1', 'a0', 'letter', 'tabloid'],
exportForEditing: ['svg', 'pdf'],
exportAsData: ['json', 'yaml', 'github gist'],
}
export const defaultPdfSettings = {
size: 'a4',
orientation: 'portrait',
margin: 10,
coverPage: true,
cutlist: true,
}
/**
* Instantiate a pattern that uses plugins theme, i18n, and cutlist
* @param {Design} design the design to construct the pattern from
* @param {Object} gist the gist
* @param {Object} overwrite settings to overwrite gist settings with
* @param {Design} Design the design to construct the pattern from
* @param {Object} settings the settings
* @param {Object} overwrite settings to overwrite settings settings with
* @param {string} format the export format this pattern will be prepared for
* @param {function} t the i18n function
* @return {Pattern} a pattern
*/
const themedPattern = (design, gist, overwrite, format, t) => {
const pattern = new design({ ...gist, ...overwrite })
const themedPattern = (Design, settings, overwrite, format, t) => {
const pattern = new Design({ ...settings, ...overwrite })
// add the theme and translation to the pattern
pattern.use(themePlugin, { stripped: format !== 'svg', skipGrid: ['pages'] })
@ -48,28 +45,28 @@ const themedPattern = (design, gist, overwrite, format, t) => {
* Generate svgs of all cutting layouts for the pattern
* @param {Pattern} pattern the pattern to generate cutting layouts for
* @param {Design} design the design constructor for the pattern
* @param {Object} gist the gist
* @param {Object} settings the settings
* @param {string} format the export format this pattern will be prepared for
* @param {function} t the i18n function
* @return {Object} a dictionary of svgs and related translation strings, keyed by fabric
*/
const generateCutLayouts = (pattern, design, gist, format, t) => {
const generateCutLayouts = (pattern, Design, settings, format, t, ui) => {
// get the fabrics from the already drafted base pattern
const fabrics = pattern.setStores[pattern.activeSet].cutlist.getCutFabrics(
pattern.settings[0]
) || ['fabric']
if (!fabrics.length) return
const isImperial = gist.units === 'imperial'
const isImperial = settings.units === 'imperial'
const cutLayouts = {}
// each fabric
fabrics.forEach((f) => {
// get the settings and layout for that fabric
const fabricSettings = fabricSettingsOrDefault(gist, f)
const fabricLayout = get(gist, ['layouts', 'cuttingLayout', f], true)
const fabricSettings = fabricSettingsOrDefault(settings.units, ui, f)
const fabricLayout = get(ui, ['layouts', 'cut', f], true)
// make a new pattern
const fabricPattern = themedPattern(design, gist, { layout: fabricLayout }, format, t)
const fabricPattern = themedPattern(Design, settings, { layout: fabricLayout }, format, t)
// add cut layout plugin and fabric plugin
.use(cutLayoutPlugin(f, fabricSettings.grainDirection))
.use(fabricPlugin({ ...fabricSettings, printStyle: true, setPatternSize: 'width' }))
@ -82,7 +79,7 @@ const generateCutLayouts = (pattern, design, gist, format, t) => {
svg,
title: t('plugin:' + f),
dimensions: t('plugin:fabricSize', {
width: formatMm(fabricSettings.sheetWidth, gist.units, 'notags'),
width: formatMm(fabricSettings.sheetWidth, settings.units, 'notags'),
length: useFabricLength(isImperial, fabricPattern.height, 'notags'),
interpolation: { escapeValue: false },
}),
@ -92,18 +89,28 @@ const generateCutLayouts = (pattern, design, gist, format, t) => {
return cutLayouts
}
/**
* Handle exporting the draft or gist
* Handle exporting the draft or settings
* format: format to export to
* gist: the gist
* design: the pattern constructor for the design to be exported
* settings: the settings
* Design: the pattern constructor for the design to be exported
* t: a translation function to attach to the draft
* app: an app instance
* onComplete: business to perform after a successful export
* onError: business to perform on error
* */
export const handleExport = async (format, gist, design, t, app, onComplete, onError) => {
export const handleExport = async ({
format,
settings,
Design,
design,
t,
startLoading,
stopLoading,
onComplete,
onError,
ui,
}) => {
// start the loading indicator
app.startLoading()
if (typeof startLoading === 'function') startLoading()
// get a worker going
const worker = new Worker(new URL('./export-worker.js', import.meta.url), { type: 'module' })
@ -115,7 +122,7 @@ export const handleExport = async (format, gist, design, t, app, onComplete, onE
// save it out
if (e.data.blob) {
const fileType = exportTypes.exportForPrinting.indexOf(format) === -1 ? format : 'pdf'
fileSaver.saveAs(e.data.blob, `freesewing-${gist.design || 'gist'}.${fileType}`)
fileSaver.saveAs(e.data.blob, `freesewing-${design || 'pattern'}.${fileType}`)
}
// do additional business
onComplete && onComplete(e)
@ -127,37 +134,38 @@ export const handleExport = async (format, gist, design, t, app, onComplete, onE
}
// stop the loader
app.stopLoading()
if (typeof stopLoading === 'function') stopLoading()
})
// pdf settings
const settings = {
...defaultPdfSettings,
...(gist._state.layout?.forPrinting?.page || {}),
const pageSettings = {
...defaultPrintSettings(settings.units),
...get(ui, printSettingsPath, {}),
}
// arguments to pass to the worker
const workerArgs = { format, gist, settings }
const workerArgs = { format, settings, pageSettings }
// data passed to the worker must be JSON serializable, so we can't pass functions or prototypes
// that means if it's not a data export there's more work to do before we can hand off to the worker
if (exportTypes.exportAsData.indexOf(format) === -1) {
gist.embed = false
settings.embed = false
// make a pattern instance for export rendering
const layout = gist.layouts?.printingLayout || gist.layout || true
let pattern = themedPattern(design, gist, { layout }, format, t)
const layout = settings.layout || ui.layouts?.print || true
let pattern = themedPattern(Design, settings, { layout }, format, t)
// a specified size should override the gist one
// a specified size should override the settings one
if (format !== 'pdf') {
settings.size = format
pageSettings.size = format
}
try {
throw new Error('bad bad bad')
// add pages to pdf exports
if (format !== 'svg') {
pattern.use(
pagesPlugin({
...settings,
...pageSettings,
printStyle: true,
renderBlanks: false,
setPatternSize: true,
@ -166,7 +174,7 @@ export const handleExport = async (format, gist, design, t, app, onComplete, onE
// add the strings that are used on the cover page
workerArgs.strings = {
design: capitalize(pattern.designConfig.data.name.replace('@freesewing/', '')),
design: capitalize(design),
tagline: t('common:sloganCome') + '. ' + t('common:sloganStay'),
url: window.location.href,
cuttingLayout: t('plugin:cuttingLayout'),
@ -181,15 +189,15 @@ export const handleExport = async (format, gist, design, t, app, onComplete, onE
workerArgs.pages = pattern.setStores[pattern.activeSet].get('pages')
// add cutting layouts if requested
if (format !== 'svg' && settings.cutlist) {
workerArgs.cutLayouts = generateCutLayouts(pattern, design, gist, format, t)
if (format !== 'svg' && pageSettings.cutlist) {
workerArgs.cutLayouts = generateCutLayouts(pattern, Design, settings, format, t, ui)
}
// post a message to the worker with all needed data
worker.postMessage(workerArgs)
} catch (err) {
console.log(err)
app.stopLoading()
if (typeof stopLoading === 'function') stopLoading()
onError && onError(err)
}
}

View file

@ -7,16 +7,21 @@ import { PdfMaker } from './pdf-maker'
/** when the worker receives data from the page, do the appropriate export */
addEventListener('message', async (e) => {
const { format, gist, svg } = e.data
const { format, settings, svg } = e.data
// handle export by type
try {
if (format === 'json') return exportJson(gist)
if (format === 'yaml') return exportYaml(gist)
if (format === 'github gist') return exportGithubGist(gist)
if (format === 'svg') return exportSvg(svg)
await exportPdf(e.data)
switch (format) {
case 'json':
return exportJson(settings)
case 'yaml':
return exportYaml(settings)
case 'github gist':
return exportGithubGist(settings)
case 'svg':
return exportSvg(svg)
default:
return await exportPdf(e.data)
}
} catch (e) {
postMessage({ success: false, error: e })
close()
@ -37,9 +42,9 @@ const exportBlob = (blobContent, type) => {
postSuccess(blob)
}
const exportJson = (gist) => exportBlob(JSON.stringify(gist, null, 2), 'application/json')
const exportJson = (settings) => exportBlob(JSON.stringify(settings, null, 2), 'application/json')
const exportYaml = (gist) => exportBlob(yaml.dump(gist), 'application/x-yaml')
const exportYaml = (settings) => exportBlob(yaml.dump(settings), 'application/x-yaml')
const exportSvg = (svg) => exportBlob(svg, 'image/svg+xml')

View file

@ -22,7 +22,7 @@ export class PdfMaker {
/** the svg as text to embed in the pdf */
svg
/** the document configuration */
settings
pageSettings
/** the pdfKit instance that is writing the document */
pdf
/** the export buffer to hold pdfKit output */
@ -51,8 +51,8 @@ export class PdfMaker {
pageCount = 0
lineLevel = 50
constructor({ svg, settings, pages, strings, cutLayouts }) {
this.settings = settings
constructor({ svg, pageSettings, pages, strings, cutLayouts }) {
this.pageSettings = pageSettings
this.pagesWithContent = pages.withContent
this.svg = svg
this.strings = strings
@ -60,7 +60,7 @@ export class PdfMaker {
this.initPdf()
this.margin = this.settings.margin * mmToPoints // margin is in mm because it comes from us, so we convert it to points
this.margin = this.pageSettings.margin * mmToPoints // margin is in mm because it comes from us, so we convert it to points
this.pageHeight = this.pdf.page.height - this.margin * 2 // this is in points because it comes from pdfKit
this.pageWidth = this.pdf.page.width - this.margin * 2 // this is in points because it comes from pdfKit
@ -77,8 +77,8 @@ export class PdfMaker {
initPdf() {
// instantiate with the correct size and orientation
this.pdf = new PDFDocument({
size: this.settings.size.toUpperCase(),
layout: this.settings.orientation,
size: this.pageSettings.size.toUpperCase(),
layout: this.pageSettings.orientation,
})
// PdfKit wants to flush the buffer on each new page.
@ -117,7 +117,7 @@ export class PdfMaker {
/** generate the cover page for the pdf */
async generateCoverPage() {
// don't make one if it's not requested
if (!this.settings.coverPage) {
if (!this.pageSettings.coverPage) {
return
}
@ -185,7 +185,7 @@ export class PdfMaker {
/** generate all cutting layout pages */
async generateCutLayoutPages() {
if (!this.settings.cutlist || !this.cutLayouts) return
if (!this.pageSettings.cutlist || !this.cutLayouts) return
for (const fabric in this.cutLayouts) {
this.nextPage()

View file

@ -75,6 +75,7 @@ export const Workbench = ({ design, Design, baseSettings, DynamicDocs, from }) =
ui,
language,
DynamicDocs,
Design,
}
let viewContent = null

View file

@ -1,20 +1,19 @@
import { useTranslation } from 'next-i18next'
import { CutLayoutSettings } from './settings.mjs'
import { Draft } from '../draft/index.mjs'
import { fabricPlugin } from '../plugin-layout-part.mjs'
// import { Draft } from '../draft/index.mjs'
import { fabricPlugin } from 'shared/plugins/plugin-layout-part.mjs'
import { cutLayoutPlugin } from './plugin-cut-layout.mjs'
import { pluginAnnotations } from '@freesewing/plugin-annotations'
import { measurementAsMm } from 'shared/utils.mjs'
import { useEffect } from 'react'
import get from 'lodash.get'
export const fabricSettingsOrDefault = (gist, fabric) => {
const isImperial = gist.units === 'imperial'
const sheetHeight = measurementAsMm(isImperial ? 36 : 100, gist.units)
const gistSettings = get(gist, ['_state', 'layout', 'forCutting', 'fabric', fabric])
const sheetWidth = gistSettings?.sheetWidth || measurementAsMm(isImperial ? 54 : 120, gist.units)
const grainDirection =
gistSettings?.grainDirection === undefined ? 90 : gistSettings.grainDirection
export const fabricSettingsOrDefault = (units, ui, fabric) => {
const isImperial = units === 'imperial'
const sheetHeight = measurementAsMm(isImperial ? 36 : 100, units)
const uiSettings = get(ui, ['cut', 'fabric', fabric], {})
const sheetWidth = uiSettings.sheetWidth || measurementAsMm(isImperial ? 54 : 120, units)
const grainDirection = uiSettings.grainDirection === undefined ? 90 : uiSettings.grainDirection
return { activeFabric: fabric, sheetWidth, grainDirection, sheetHeight }
}
@ -109,7 +108,7 @@ export const CutLayout = (props) => {
))}
</div>
) : null}
<Draft
{/* <Draft
draft={draft}
gist={gist}
updateGist={updateGist}
@ -119,7 +118,7 @@ export const CutLayout = (props) => {
layoutPart="fabric"
layoutType={['cuttingLayout', fabricSettings.activeFabric]}
layoutSetType="forCutting"
/>
/>*/}
</div>
</div>
) : null

View file

@ -1,4 +1,4 @@
import { addToOnly } from '../plugin-layout-part.mjs'
import { addToOnly } from 'shared/plugins/plugin-layout-part.mjs'
import { pluginMirror } from '@freesewing/plugin-mirror'
const prefix = 'mirroredOnFold'

View file

@ -51,7 +51,7 @@ export const useDocsLoader = (DynamicDocs, getDocsPath, language) => {
export const WorkbenchMenu = ({
updateFunc,
ns,
Icon,
Icon = () => null,
name,
config,
control,

View file

@ -12,7 +12,7 @@ export const MovablePattern = ({
renderProps,
patternConfig,
settings,
ui,
showButtons = true,
update,
bgProps = {},
fitImmovable = false,
@ -96,7 +96,7 @@ export const MovablePattern = ({
movable: !immovable.includes(stackName),
layout: layout.stacks[stackName],
updateLayout,
showButtons: get(ui, 'showMovableButtons', true),
showButtons,
}}
/>
)

View file

@ -0,0 +1,59 @@
import { WorkbenchMenu } from 'shared/components/workbench/menus/shared/index.mjs'
import { MenuItem } from 'shared/components/workbench/menus/shared/menu-item.mjs'
import { BoolInput } from 'shared/components/workbench/menus/shared/inputs.mjs'
import { ListValue } from 'shared/components/workbench/menus/shared/values.mjs'
import { useTranslation } from 'next-i18next'
import { ClearIcon, ExportIcon } from 'shared/components/icons.mjs'
const handlers = {
showMovableButtons: (update) => (_path, newVal) => update.ui('showMovableButtons', newVal),
}
export const ns = ['workbench', 'print']
const config = {
showMovableButtons: {
dflt: true,
},
}
const PrintActionItem = ({ name, config, settings, ui, updateFunc, passProps, ...rest }) => {
switch (name) {
case 'showMovableButtons':
return
}
}
export const PrintActions = ({ update, settings, ui, account, exportIt }) => {
// get translation for the menu
const { t } = useTranslation(ns)
const hideButtons = (evt) => {
update.ui('hideMovableButtons', !evt.target.checked)
}
const resetLayout = () => update.ui(['layouts', 'print'])
return (
<div className="mt-2 mb-4">
<div className="flex justify-evenly flex-col lg:flex-row">
<label className="label cursor-pointer">
<span className="label-text text-lg mr-2">{t('showMovableButtons')}</span>
<input
type="checkbox"
className="toggle toggle-primary"
checked={!ui.hideMovableButtons}
onChange={hideButtons}
/>
</label>
<button className="btn btn-primary btn-outline" onClick={resetLayout}>
<ClearIcon />
<span className="ml-2">{t('reset')}</span>
</button>
<button className="btn btn-primary" onClick={exportIt}>
<ExportIcon />
<span className="ml-2">{t('export')}</span>
</button>
</div>
</div>
)
}

View file

@ -1,5 +1,7 @@
import { measurementAsMm } from 'shared/utils.mjs'
export const printSettingsPath = ['print', 'pages']
export const defaultPrintSettings = (units, inMm = true) => {
const margin = units === 'imperial' ? 0.5 : 1
return {
@ -10,7 +12,7 @@ export const defaultPrintSettings = (units, inMm = true) => {
cutlist: true,
}
}
const sizes = ['a4', 'a3', 'a2', 'a1', 'a0', 'letter', 'tabloid']
const sizes = ['a4', 'a3', 'a2', 'a1', 'a0', 'letter', 'legal', 'tabloid']
export const loadPrintConfig = (units) => {
const defaults = defaultPrintSettings(units, false)
const config = {
@ -24,6 +26,14 @@ export const loadPrintConfig = (units) => {
orientation: {
control: 2,
list: ['portrait', 'landscape'],
choiceTitles: {
portrait: 'portrait',
landscape: 'landscape',
},
valueTitles: {
portrait: 'portrait',
landscape: 'landscape',
},
dflt: defaults.orientation,
},
margin: {

View file

@ -1,20 +1,20 @@
import { useEffect, useState } from 'react'
import { useEffect, useState, useContext } from 'react'
import { useTranslation } from 'next-i18next'
// import { PrintLayoutSettings } from './settings.mjs'
// import { Draft } from '../draft/index.mjs'
import { pagesPlugin } from 'shared/plugins/plugin-layout-part.mjs'
// import {
// handleExport,
// defaultPdfSettings,
// } from 'shared/components/workbench/exporting/export-handler.mjs'
// import { Popout } from 'shared/components/popout.mjs'
import {
handleExport,
ns as exportNs,
} from 'shared/components/workbench/exporting/export-handler.mjs'
import get from 'lodash.get'
import { MovablePattern } from 'shared/components/workbench/pattern/movable/index.mjs'
import { PrintMenu, ns as menuNs } from './menu.mjs'
import { defaultPrintSettings } from './config.mjs'
import { defaultPrintSettings, printSettingsPath } from './config.mjs'
import { PrintIcon, RightIcon, ClearIcon, ExportIcon } from 'shared/components/icons.mjs'
import { LoadingContext } from 'shared/context/loading-context.mjs'
import { useToast } from 'shared/hooks/use-toast.mjs'
const viewNs = ['print']
export const ns = [...viewNs]
const viewNs = ['print', ...exportNs]
export const ns = [...viewNs, ...menuNs]
export const PrintView = ({
design,
@ -27,18 +27,20 @@ export const PrintView = ({
language,
account,
DynamicDocs,
Design,
}) => {
const { t } = useTranslation(viewNs)
const [error, setError] = useState(false)
const { t } = useTranslation(ns)
const loading = useContext(LoadingContext)
const toast = useToast()
const defaultSettings = defaultPrintSettings(settings.units)
// add the pages plugin to the draft
const layoutSettings = {
const pageSettings = {
...defaultSettings,
...get(ui, ['print', 'page']),
...get(ui, printSettingsPath, {}),
}
pattern.use(pagesPlugin(layoutSettings))
pattern.use(pagesPlugin(pageSettings))
let renderProps
try {
@ -51,26 +53,52 @@ export const PrintView = ({
const bgProps = { fill: 'none' }
const exportIt = () => {
// setError(false)
// handleExport(
// 'pdf',
// props.gist,
// props.design,
// t,
// props.app,
// () => setError(false),
// () => setError(true)
// )
handleExport({
format: 'pdf',
settings,
design,
t,
Design,
ui,
startLoading: loading.startLoading,
stopLoading: loading.stopLoading,
onComplete: () => {},
onError: (err) => toast.error(err.message),
})
}
let name = design
const pages = pattern.setStores[0].get('pages', {})
const { cols, rows, count } = pages
return (
<div>
<h2 className="capitalize">{t('layoutThing', { thing: name }) + ': ' + t('forPrinting')}</h2>
<div className="flex flex-row">
<div className="w-2/3 shrink-0 grow lg:p-4 sticky top-0">
<div className="flex justify-between">
<h2 className="capitalize">
{t('layoutThing', { thing: name }) + ' ' + t('forPrinting')}
</h2>
<div className="flex flex-row font-bold items-center text-2xl justify-center ">
<PrintIcon />
<span className="ml-2">{count}</span>
<span className="mx-6 opacity-50">|</span>
<RightIcon />
<span className="ml-2">{cols}</span>
<span className="mx-6 opacity-50">|</span>
<div className="rotate-90">
<RightIcon />
</div>
<span className="ml-2">{rows}</span>
</div>
</div>
<MovablePattern
{...{ renderProps, update, immovable: ['pages'], layoutPath: ['layouts', 'print'] }}
{...{
renderProps,
update,
immovable: ['pages'],
layoutPath: ['layouts', 'print'],
showButtons: !ui.hideMovableButtons,
}}
/>
</div>
<div className="w-1/3 shrink grow-0 lg:p-4 max-w-2xl h-screen overflow-scroll">
@ -85,6 +113,7 @@ export const PrintView = ({
language,
account,
DynamicDocs,
exportIt,
}}
/>
</div>

View file

@ -7,10 +7,13 @@ import {
ns as coreMenuNs,
} from 'shared/components/workbench/menus/core-settings/index.mjs'
import { PrintSettings, ns as printMenuNs } from './settings.mjs'
import { PrintActions } from './actions.mjs'
export const ns = [...coreMenuNs, ...designMenuNs, ...printMenuNs]
export const PrintMenu = ({
design,
pattern,
patternConfig,
settings,
ui,
@ -18,7 +21,7 @@ export const PrintMenu = ({
language,
account,
DynamicDocs,
inspector = false,
exportIt,
}) => {
const control = account.control
const menuProps = {
@ -31,9 +34,9 @@ export const PrintMenu = ({
DynamicDocs,
control,
}
return (
<nav className="grow mb-12">
<PrintActions {...menuProps} ui={ui} exportIt={exportIt} />
<PrintSettings {...menuProps} ui={ui} />
<DesignOptions {...menuProps} />
<CoreSettings {...menuProps} />

View file

@ -0,0 +1,41 @@
showMovableButtons: Buttons
printSettings: Print Settings
printSettings.d: These settings control aspects of the page for PDF export and printing
size.t: Paper Size
size.d: Choose a size of paper
a4.t: A4
a4.d: 210 x 297 mm
a3.t: A3
a3.d: 297 × 420 mm
a2.t: A2
a2.d: 420 × 594 mm
a1.t: A1
a1.d: 594 × 841 mm
a0.t: A0
a0.d: 841 × 1189 mm
letter.t: Letter
letter.d: 8.5 x 11 in
legal.t: Legal
legal.d: 8.5 x 14 in
tabloid.t: Tabloid
tabloid.d: 11 x 17 in
cutlist.t: Include Cutting Layouts
cutlist.d: Should images of the suggested cutting layouts for each fabric be included in the exported PDF?
cutlistNo.t: Do not include cutting layouts
cutlistNo.d: Exported PDFs will not include any suggested cutting layouts
cutlistYes.t: Include cutting layouts
cutlistYes.d: Exported PDFs will include a page for each fabric used by the pattern listing how much of the fabric is needed and suggesting a layout for cutting out the appropriate pieces
coverPage.t: Include Cover Page
coverPage.d: Should the exported PDF include a cover page?
coverPageYes.t: Include a cover page
coverPageYes.d: Add a cover page to the exported PDF including information about the pattern and an image of the entire assembled layout
coverPageNo.t: Do not include a cover page
coverPageNo.d: Exported PDFs will skip the cover page
margin.t: Page Margin
margin.d: How much margin should pages of the PDF have? This is useful for making sure that all content is within the margins of your printer. It also controls how much adjacent pages will overlap.
orientation.t: Page Orientation
orientation.d: Which direction should the pages be rotated?
portrait.t: Portrait
portrait.d: Pages will be longer than they are wide
landscape.t: Landscape
landscape.d: Pages will be wider than they are long

View file

@ -2,7 +2,7 @@ import { PrintIcon } from 'shared/components/icons.mjs'
import { WorkbenchMenu } from 'shared/components/workbench/menus/shared/index.mjs'
import { ListInput, BoolInput, MmInput } from 'shared/components/workbench/menus/shared/inputs.mjs'
import { ListValue, BoolValue, MmValue } from 'shared/components/workbench/menus/shared/values.mjs'
import { loadPrintConfig } from './config.mjs'
import { loadPrintConfig, printSettingsPath } from './config.mjs'
import get from 'lodash.get'
const inputs = {
@ -23,18 +23,17 @@ const values = {
export const ns = ['print']
export const settingsPath = ['layout', 'print', 'page']
export const PrintSettings = ({ update, settings, ui, account }) => {
const config = loadPrintConfig(settings.units)
const passProps = { units: settings.units }
const updateFunc = (name, newVal) => update.ui([...settingsPath, name], newVal)
const updateFunc = (name, newVal) => update.ui([...printSettingsPath, name], newVal)
return (
<WorkbenchMenu
{...{
config,
control: account.control,
currentValues: get(ui, settingsPath, {}),
currentValues: get(ui, printSettingsPath, {}),
Icon: PrintIcon,
inputs,
values,

View file

@ -9,6 +9,7 @@ export const sizes = {
a1: [594, 841],
a0: [841, 1188],
letter: [215.9, 279.4],
legal: [215.9, 355.6],
tabloid: [279.4, 431.8],
}