diff options
| author | bobzel <zzzman@gmail.com> | 2025-03-16 21:15:00 -0400 |
|---|---|---|
| committer | bobzel <zzzman@gmail.com> | 2025-03-16 21:15:00 -0400 |
| commit | 1ffa8a8fb3e16bd5a3338d18782ddda0c2ffca03 (patch) | |
| tree | 14fd95eb1d3ca5f5415e3703c4cbca2d7fe368aa /src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateBackend.tsx | |
| parent | df708c90d8356934d2e3d9123129c761d328c1fe (diff) | |
a lot of code cleanup for doc creators templates
Diffstat (limited to 'src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateBackend.tsx')
| -rw-r--r-- | src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateBackend.tsx | 771 |
1 files changed, 0 insertions, 771 deletions
diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateBackend.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateBackend.tsx deleted file mode 100644 index 2b32d49aa..000000000 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu/TemplateBackend.tsx +++ /dev/null @@ -1,771 +0,0 @@ -import { FieldSettings, ViewType } from "./FieldTypes/Field"; - -export enum TemplateFieldType { - TEXT = 'text', - VISUAL = 'visual', - UNSET = 'unset', -} - -export enum TemplateFieldSize { - TINY = 'tiny', - SMALL = 'small', - MEDIUM = 'medium', - LARGE = 'large', - HUGE = 'huge', -} - -export class TemplateLayouts { - public static get allTemplates(): FieldSettings[] { - return Object.values(TemplateLayouts); - } - - public static BasicSettings: FieldSettings = { - title: 'template_framework', - tl: [0, 0], - br: [400, 700], - viewType: ViewType.FREEFORM, - opts: {} - } - - public static FourField001: FieldSettings = { - title: 'fourfield001', - tl: [0, 0], - br: [416, 700], - viewType: ViewType.FREEFORM, - opts: { - backgroundColor: '#C0B887', - _layout_borderRounding: '.05', - //borderColor: '#6B461F', - //borderWidth: '12', - }, - subfields: [ - { - viewType: ViewType.STATIC, - tl: [-0.95, -1], - br: [0.95, -0.85], - types: [TemplateFieldType.TEXT], - sizes: [TemplateFieldSize.TINY], - description: 'A title field for very short text that contextualizes the content.', - opts: { - backgroundColor: 'transparent', - text_fontColor: '#F1F0E9', - hCentering: 'h-center', - contentBold: true, - }, - }, - { - viewType: ViewType.STATIC, - tl: [-0.87, -0.83], - br: [0.87, 0.2], - types: [TemplateFieldType.TEXT, TemplateFieldType.VISUAL], - sizes: [TemplateFieldSize.MEDIUM, TemplateFieldSize.LARGE, TemplateFieldSize.HUGE], - description: 'The main focus of the template; could be an image, long text, etc.', - opts: { - _layout_borderRounding: '.05', - borderColor: '#8F5B25', - borderWidth: 6, - backgroundColor: '#CECAB9', - }, - }, - { - viewType: ViewType.STATIC, - tl: [-0.8, 0.2], - br: [0.8, 0.3], - types: [TemplateFieldType.TEXT], - sizes: [TemplateFieldSize.TINY, TemplateFieldSize.SMALL], - description: 'A caption for field #2, very short text.', - opts: { - backgroundColor: 'transparent', - hCentering: 'h-center', - text_fontColor: '#F1F0E9', - }, - }, - { - viewType: ViewType.STATIC, - tl: [-0.87, 0.37], - br: [0.87, 0.96], - types: [TemplateFieldType.TEXT, TemplateFieldType.VISUAL], - sizes: [TemplateFieldSize.MEDIUM, TemplateFieldSize.LARGE, TemplateFieldSize.HUGE], - description: 'A medium-sized field for medium/long text.', - opts: { - _layout_borderRounding: '.05', - borderColor: '#8F5B25', - borderWidth: 6, - backgroundColor: '#CECAB9', - }, - }, - ], - }; - - public static FourField002: FieldSettings = { - title: 'fourfield002', - viewType: ViewType.FREEFORM, - tl: [0,0], - br: [425, 778], - opts: { - backgroundColor: '#242425', - }, - subfields: [ - { - viewType: ViewType.STATIC, - tl: [-0.83, -0.95], - br: [0.83, -0.2], - types: [TemplateFieldType.VISUAL, TemplateFieldType.TEXT], - sizes: [TemplateFieldSize.MEDIUM, TemplateFieldSize.LARGE], - description: 'A medium to large-sized field suitable for an image or longer text that should be the main focus.', - opts: { - borderWidth: 8, - borderColor: '#F8E71C', - backgroundColor: '#242425', - text_fontColor: 'white', - }, - }, - { - viewType: ViewType.STATIC, - tl: [-0.65, -0.2], - br: [0.65, -0.02], - types: [TemplateFieldType.TEXT], - sizes: [TemplateFieldSize.TINY], - description: 'A tiny field for just a word or two of plain text.', - opts: { - backgroundColor: 'transparent', - text_fontColor: 'white', - hCentering: 'h-center', - text_transform: 'uppercase', - }, - }, - { - viewType: ViewType.STATIC, - tl: [-0.65, 0], - br: [0.65, 0.18], - types: [TemplateFieldType.TEXT], - sizes: [TemplateFieldSize.TINY], - description: 'A tiny field for just a word or two of plain text.', - opts: { - backgroundColor: 'transparent', - text_fontColor: 'white', - hCentering: 'h-center', - text_transform: 'uppercase', - }, - }, - { - viewType: ViewType.STATIC, - tl: [-0.83, 0.2], - br: [0.83, 0.95], - types: [TemplateFieldType.TEXT], - sizes: [TemplateFieldSize.MEDIUM, TemplateFieldSize.LARGE, TemplateFieldSize.HUGE], - description: 'A medium to large-sized field suitable for longer text that should contextualize field 1.', - opts: { - borderWidth: 8, - borderColor: '#F8E71C', - text_fontColor: 'white', - backgroundColor: '#242425', - }, - }, - { - viewType: ViewType.DEC, - tl: [-0.8, -0.075], - br: [-0.525, 0.075], - opts: { - backgroundColor: '#F8E71C', - _rotation: 45, - }, - }, - { - viewType: ViewType.DEC, - tl: [-0.3075, -0.0245], - br: [-0.2175, 0.0245], - opts: { - backgroundColor: '#F8E71C', - _rotation: 45, - }, - }, - { - viewType: ViewType.DEC, - tl: [-0.045, -0.0245], - br: [0.045, 0.0245], - opts: { - backgroundColor: '#F8E71C', - _rotation: 45, - }, - }, - { - viewType: ViewType.DEC, - tl: [0.2175, -0.0245], - br: [0.3075, 0.0245], - opts: { - backgroundColor: '#F8E71C', - _rotation: 45, - }, - }, - { - viewType: ViewType.DEC, - tl: [0.525, -0.075], - br: [0.8, 0.075], - opts: { - backgroundColor: '#F8E71C', - _rotation: 45, - }, - }, - ], - }; - - // public static FourField003: TemplateDocInfos = { - // title: 'fourfield3', - // width: 477, - // height: 662, - // opts: { - // backgroundColor: '#9E9C95' - // }, - // fields: [{ - // tl: [-.875, -.9], - // br: [.875, .7], - // types: [TemplateFieldType.VISUAL], - // sizes: [TemplateFieldSize.LARGE, TemplateFieldSize.HUGE], - // description: '', - // opts: { - // borderWidth: '15', - // borderColor: '#E0E0DA', - // } - // }, { - // tl: [-.95, .8], - // br: [-.1, .95], - // types: [TemplateFieldType.TEXT], - // sizes: [TemplateFieldSize.TINY, TemplateFieldSize.SMALL], - // description: '', - // opts: { - // backgroundColor: 'transparent', - // color: 'white', - // contentXCentering: 'h-right', - // } - // }, { - // tl: [.1, .8], - // br: [.95, .95], - // types: [TemplateFieldType.TEXT], - // sizes: [TemplateFieldSize.TINY, TemplateFieldSize.SMALL], - // description: '', - // opts: { - // backgroundColor: 'transparent', - // color: 'red', - // fontTransform: 'uppercase', - // contentXCentering: 'h-left' - // } - // }, { - // tl: [0, -.9], - // br: [.85, -.66], - // types: [TemplateFieldType.TEXT, TemplateFieldType.VISUAL], - // sizes: [TemplateFieldSize.MEDIUM, TemplateFieldSize.LARGE, TemplateFieldSize.HUGE], - // description: '', - // opts: { - // backgroundColor: 'transparent', - // contentXCentering: 'h-right' - // } - // }], - // decorations: [{ - // tl: [-.025, .8], - // br: [.025, .95], - // opts: { - // backgroundColor: '#E0E0DA', - // } - // }] - // }; - - public static FourField004: FieldSettings = { - title: 'fourfield04', - viewType: ViewType.FREEFORM, - tl: [0,0], - br: [414,583], - opts: { - backgroundColor: '#6CCAF0', - //borderColor: '#1088C3', - //borderWidth: '10', - }, - subfields: [ - { - viewType: ViewType.STATIC, - tl: [-0.86, -0.92], - br: [-0.075, -0.77], - types: [TemplateFieldType.TEXT], - sizes: [TemplateFieldSize.TINY], - description: 'A tiny field for just a word or two of plain text.', - opts: { - backgroundColor: '#E2B4F5', - borderWidth: 9, - borderColor: '#9222F1', - hCentering: 'h-center', - }, - }, - { - viewType: ViewType.STATIC, - tl: [0.075, -0.92], - br: [0.86, -0.77], - types: [TemplateFieldType.TEXT], - sizes: [TemplateFieldSize.TINY], - description: 'A tiny field for just a word or two of plain text.', - opts: { - backgroundColor: '#F5B4DD', - borderWidth: 9, - borderColor: '#E260F3', - hCentering: 'h-center', - }, - }, - { - viewType: ViewType.STATIC, - tl: [-0.81, -0.64], - br: [0.81, 0.48], - types: [TemplateFieldType.VISUAL], - sizes: [TemplateFieldSize.MEDIUM, TemplateFieldSize.LARGE, TemplateFieldSize.HUGE], - description: 'A large to huge field for visual content that is the main content of the template.', - opts: { - borderWidth: 16, - borderColor: '#A2BD77', - }, - }, - { - viewType: ViewType.STATIC, - tl: [-0.86, 0.6], - br: [0.86, 0.92], - types: [TemplateFieldType.TEXT], - sizes: [TemplateFieldSize.MEDIUM, TemplateFieldSize.LARGE], - description: 'A medium to large field for text that describes the visual content above', - opts: { - borderWidth: 9, - borderColor: '#F0D601', - backgroundColor: '#F3F57D', - }, - }, - { - viewType: ViewType.DEC, - tl: [-0.852, -0.67], - br: [0.852, 0.51], - opts: { - backgroundColor: 'transparent', - borderColor: '#007C0C', - borderWidth: 10, - }, - }, - ], - }; - - public static FourField005: FieldSettings = { - title: 'fourfield05', - viewType: ViewType.FREEFORM, - tl: [0,0], - br: [400,550], - opts: { - backgroundColor: '#95A575', - }, - subfields: [ - { - viewType: ViewType.STATIC, - tl: [-0.9, -.925], - br: [-.075, -.775], - types: [TemplateFieldType.TEXT], - sizes: [TemplateFieldSize.TINY, TemplateFieldSize.SMALL], - description: 'A small text field for a title or word(s) that categorize the rest of the content.', - opts: { - borderColor: '#3B4A2C', - borderWidth: 8, - hCentering: "h-center", - backgroundColor: '#B8DC90', - }, - }, - { - viewType: ViewType.STATIC, - tl: [.075, -.925], - br: [.9, -.775], - types: [TemplateFieldType.TEXT], - sizes: [TemplateFieldSize.TINY, TemplateFieldSize.SMALL], - description: 'A small text field for a title that categorizes the rest of the content.', - opts: { - borderColor: '#3B4A2C', - borderWidth: 8, - hCentering: "h-center", - backgroundColor: '#B8DC90', - }, - }, - { - viewType: ViewType.DEC, - tl: [-.82, -.4], - br: [-.5, -.2], - opts: { - backgroundColor: '#94B058', - borderColor: '#3B4A2C', - borderWidth: 8, - }, - }, - { - viewType: ViewType.STATIC, - tl: [-0.66, -.65], - br: [0.66, .25], - types: [TemplateFieldType.VISUAL], - sizes: [TemplateFieldSize.MEDIUM, TemplateFieldSize.LARGE], - description: 'A medium to large field in the center of the template, for the main visual content.', - opts: { - borderColor: '#3B4A2C', - borderWidth: 8, - backgroundColor: '#B8DC90', - }, - }, - { - viewType: ViewType.STATIC, - tl: [-.875, .425], - br: [0.875, .925], - types: [TemplateFieldType.TEXT], - sizes: [TemplateFieldSize.MEDIUM, TemplateFieldSize.LARGE], - description: 'A medium to large field at the bottom of the template, for the main text content.', - opts: { - borderColor: '#3B4A2C', - borderWidth: 8, - hCentering: "h-center", - backgroundColor: '#B8DC90', - }, - }, - { - viewType: ViewType.DEC, - tl: [-1.1, -.62], - br: [-.9, -.5], - opts: { - backgroundColor: '#7A9D31', - borderColor: '#3B4A2C', - borderWidth: 8, - }, - }, - { - viewType: ViewType.DEC, - tl: [-1.1, 0], - br: [-.9, .15], - opts: { - backgroundColor: '#94B058', - borderColor: '#3B4A2C', - borderWidth: 8, - }, - }, - { - viewType: ViewType.DEC, - tl: [-.93, -.265], - br: [-.715, -.125], - opts: { - backgroundColor: '#728745', - borderColor: '#3B4A2C', - borderWidth: 8, - }, - }, - { - viewType: ViewType.DEC, - tl: [.7, -.45], - br: [.85, -.3], - opts: { - backgroundColor: '#7A9D31', - borderColor: '#3B4A2C', - borderWidth: 8, - }, - }, - { - viewType: ViewType.DEC, - tl: [.8, .03], - br: [1.2, .33], - opts: { - backgroundColor: '#728745', - borderColor: '#3B4A2C', - borderWidth: 8, - }, - }, - { - viewType: ViewType.DEC, - tl: [.875, -.13], - br: [1.2, .12], - opts: { - backgroundColor: '#94B058', - borderColor: '#3B4A2C', - borderWidth: 8, - }, - }, - ] - } - - public static FourFieldCarousel: FieldSettings = { - title: 'title_fourfieldcarousel', - viewType: ViewType.FREEFORM, - tl:[0,0], - br:[500, 600], - opts: { - backgroundColor: '#D7CBAB', - }, - subfields: [ - { - viewType: ViewType.STATIC, - tl: [-0.8, -.9], - br: [0.8, -.5], - types: [TemplateFieldType.TEXT], - sizes: [TemplateFieldSize.TINY, TemplateFieldSize.SMALL], - description: 'A small text field for a title that categorizes the rest of the content.', - opts: { - hCentering: "h-center", - backgroundColor: 'transparent', - text_transform: 'uppercase', - }, - }, - { - viewType: ViewType.CAROUSEL3D, - tl: [-0.9, -.5], - br: [0.9, .25], - opts: { - borderColor: '#847F69', - borderWidth: 8, - backgroundColor: '#C8BA94', - }, - subfields: [ - { - viewType: ViewType.STATIC, - tl: [-.4, -.6], - br: [.4, .6], - types: [TemplateFieldType.VISUAL, TemplateFieldType.TEXT], - sizes: [TemplateFieldSize.MEDIUM, TemplateFieldSize.LARGE, TemplateFieldSize.HUGE], - description: 'A medium to large field for content that will share central focus with other content in the carousel.', - opts: { - //borderColor: 'yellow', - //borderWidth: '8', - }, - }, - { - viewType: ViewType.STATIC, - tl: [-.4, -.6], - br: [.4, .6], - types: [TemplateFieldType.VISUAL, TemplateFieldType.TEXT], - sizes: [TemplateFieldSize.MEDIUM, TemplateFieldSize.LARGE, TemplateFieldSize.HUGE], - description: 'A medium to large field for content that will share central focus with other content in the carousel.', - opts: { - //borderColor: 'black', - //borderWidth: '8', - }, - }, - { - viewType: ViewType.STATIC, - tl: [-.4, -.6], - br: [.4, .6], - types: [TemplateFieldType.VISUAL, TemplateFieldType.TEXT], - sizes: [TemplateFieldSize.MEDIUM, TemplateFieldSize.LARGE, TemplateFieldSize.HUGE], - description: 'A medium to large field for content that will share central focus with other content in the carousel.', - opts: { - //borderColor: 'yellow', - //borderWidth: '8', - }, - }, - ] - }, - { - viewType: ViewType.STATIC, - tl: [-0.9, .35], - br: [0.9, .9], - types: [TemplateFieldType.TEXT], - sizes: [TemplateFieldSize.MEDIUM, TemplateFieldSize.LARGE], - description: 'A medium text field for a description of the content in the carousel.', - opts: { - hCentering: "h-center", - backgroundColor: 'transparent', - }, - }, - ] - } - - - public static ThreeField001: FieldSettings = { - title: 'threefield001', - viewType: ViewType.FREEFORM, - tl: [0,0], - br: [575, 770], - opts: { - backgroundColor: '#DDD3A9', - }, - subfields: [ - { - viewType: ViewType.FREEFORM, - tl: [-0.66, -0.747], - br: [0.66, 0.247], - description: 'A medium to large field for visual content that is the central focus.', - opts: { - borderColor: 'yellow', - borderWidth: 8, - backgroundColor: '#DDD3A9', - _rotation: 45, - }, - subfields: [ - { - viewType: ViewType.STATIC, - tl: [-1.25, -1.25], - br: [1.25, 1.25], - types: [TemplateFieldType.VISUAL], - sizes: [TemplateFieldSize.MEDIUM, TemplateFieldSize.LARGE, TemplateFieldSize.HUGE], - description: 'A medium to large field for visual content that is the central focus.', - opts: { - _rotation: -45, - }, - }, - ] - }, - { - viewType: ViewType.STATIC, - tl: [-0.7, 0.2], - br: [0.7, 0.46], - types: [TemplateFieldType.TEXT], - sizes: [TemplateFieldSize.TINY, TemplateFieldSize.SMALL], - description: 'A very small text field for one to a few words. A good caption for the image.', - opts: { - backgroundColor: 'transparent', - hCentering: 'h-center', - }, - }, - { - viewType: ViewType.STATIC, - tl: [-0.95, 0.5], - br: [0.95, 0.95], - types: [TemplateFieldType.TEXT], - sizes: [TemplateFieldSize.MEDIUM, TemplateFieldSize.LARGE], - description: 'A medium to large text field for a thorough description of the image. ', - opts: { - backgroundColor: 'transparent', - text_fontColor: 'white', - }, - }, - { - viewType: ViewType.FREEFORM, - tl: [0.2, -1.32], - br: [1.8, -0.66], - opts: { - backgroundColor: '#CEB155', - _rotation: 45, - }, - subfields: [ - { - viewType: ViewType.DEC, - tl: [-1, -.7], - br: [1, -.625], - opts: { - backgroundColor: 'yellow', - }, - }, - ] - }, - { - viewType: ViewType.FREEFORM, - tl: [-1.8, -1.32], - br: [-0.2, -0.66], - opts: { - backgroundColor: '#CEB155', - _rotation: 135, - }, - subfields: [ - { - viewType: ViewType.DEC, - tl: [-1, -.7], - br: [1, -.625], - opts: { - backgroundColor: 'yellow', - }, - }, - ] - }, - { - viewType: ViewType.FREEFORM, - tl: [0.33, 0.75], - br: [1.66, 1.25], - opts: { - backgroundColor: '#CEB155', - _rotation: 135, - }, - subfields: [ - { - viewType: ViewType.DEC, - tl: [-1, -.7], - br: [1, -.625], - opts: { - backgroundColor: 'yellow', - }, - }, - ] - }, - { - viewType: ViewType.FREEFORM, - tl: [-1.66, 0.75], - br: [-0.33, 1.25], - opts: { - backgroundColor: '#CEB155', - _rotation: 45, - }, - subfields: [ - { - viewType: ViewType.DEC, - tl: [-1, -.7], - br: [1, -.625], - opts: { - backgroundColor: 'yellow', - }, - }, - ] - }, - ], - }; - - public static ThreeField002: FieldSettings = { - title: 'threefield002', - viewType: ViewType.FREEFORM, - tl: [0,0], - br: [477, 662], - opts: { - backgroundColor: '#9E9C95', - }, - subfields: [ - { - viewType: ViewType.STATIC, - tl: [-0.875, -0.9], - br: [0.875, 0.7], - types: [TemplateFieldType.VISUAL], - sizes: [TemplateFieldSize.MEDIUM, TemplateFieldSize.LARGE, TemplateFieldSize.HUGE], - description: 'A medium to large visual field for the main content of the template', - opts: { - borderWidth: 15, - borderColor: '#E0E0DA', - }, - }, - { - viewType: ViewType.STATIC, - tl: [0.1, 0.775], - br: [0.95, 0.975], - types: [TemplateFieldType.TEXT], - sizes: [TemplateFieldSize.TINY, TemplateFieldSize.SMALL], - description: 'A very small text field for one to a few words. The content should represent a general categorization of the image.', - opts: { - backgroundColor: 'transparent', - text_fontColor: '#AF0D0D', - text_transform: 'uppercase', - contentBold: true, - hCentering: 'h-left', - }, - }, - { - viewType: ViewType.STATIC, - tl: [-0.95, 0.775], - br: [-0.1, 0.975], - types: [TemplateFieldType.TEXT], - sizes: [TemplateFieldSize.TINY, TemplateFieldSize.SMALL], - description: 'A very small text field for one to a few words. The content should contextualize field 2.', - opts: { - backgroundColor: 'transparent', - text_fontColor: 'black', - hCentering: 'h-right', - }, - }, - { - viewType: ViewType.DEC, - tl: [-0.025, 0.8], - br: [0.025, 0.95], - opts: { - backgroundColor: '#E0E0DA', - }, - }, - ], - }; -} - - |
