export const DISPLAY_W = 1280; export const DISPLAY_H = 800; export const MAX_SCREENS = 8; export const WIDGET_TYPES = { LABEL: 0, BUTTON: 1, LED: 2, ICON: 3, TABVIEW: 4, TABPAGE: 5, POWERFLOW: 6, POWERNODE: 7, POWERLINK: 8, CHART: 9, CLOCK: 10, ROOMCARD: 11 }; export const ICON_POSITIONS = { LEFT: 0, RIGHT: 1, TOP: 2, BOTTOM: 3 }; export const BUTTON_ACTIONS = { KNX: 0, JUMP: 1, BACK: 2 }; export const TEXT_ALIGNS = { LEFT: 0, CENTER: 1, RIGHT: 2 }; export const TYPE_KEYS = { 0: 'label', 1: 'button', 2: 'led', 3: 'icon', 4: 'tabview', 5: 'tabpage', 6: 'powerflow', 7: 'powernode', 8: 'powerlink', 9: 'chart', 10: 'clock', 11: 'roomcard' }; export const TYPE_LABELS = { label: 'Label', button: 'Button', led: 'LED', icon: 'Icon', tabview: 'Tabs', tabpage: 'Seite', powerflow: 'Power Flow', powernode: 'Power Node', powerlink: 'Power Link', chart: 'Chart', clock: 'Uhr (Analog)', roomcard: 'Room Card' }; export const textSources = { 0: 'Statisch', 1: 'KNX Temperatur', 2: 'KNX Schalter', 3: 'KNX Prozent', 4: 'KNX Text', 5: 'KNX Leistung (DPT 14.056)', 6: 'KNX Energie (DPT 13.013)', 7: 'KNX Dezimalfaktor (DPT 5.005)', 8: 'KNX Uhrzeit (DPT 10.001)', 9: 'KNX Datum (DPT 11.001)', 10: 'KNX Datum & Uhrzeit (DPT 19.001)', 11: 'System Uhrzeit', 12: 'System Datum', 13: 'System Datum & Uhrzeit' }; export const textSourceGroups = [ { label: 'Statisch', values: [0] }, { label: 'System', values: [11, 12, 13] }, { label: 'DPT 1.x', values: [2] }, { label: 'DPT 5.x', values: [3, 7] }, { label: 'DPT 9.x', values: [1] }, { label: 'DPT 10.x', values: [8] }, { label: 'DPT 11.x', values: [9] }, { label: 'DPT 13.x', values: [6] }, { label: 'DPT 14.x', values: [5] }, { label: 'DPT 16.x', values: [4] }, { label: 'DPT 19.x', values: [10] } ]; export const sourceOptions = { label: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13], button: [0], led: [0, 2], icon: [0, 2], powernode: [0, 1, 2, 3, 4, 5, 6, 7], powerlink: [0, 1, 3, 5, 6, 7], chart: [1, 3, 5, 6, 7], clock: [11], roomcard: [0, 1, 3, 5, 6, 7] // Temperature sources }; export const chartPeriods = [ { value: 0, label: '1h' }, { value: 1, label: '3h' }, { value: 2, label: '5h' }, { value: 3, label: '12h' }, { value: 4, label: '24h' }, { value: 5, label: '1 Monat' } ]; export const SUBBUTTON_POSITIONS = { TOP: 0, TOP_RIGHT: 1, RIGHT: 2, BOTTOM_RIGHT: 3, BOTTOM: 4, BOTTOM_LEFT: 5, LEFT: 6, TOP_LEFT: 7 }; export const SUBBUTTON_POSITION_LABELS = { 0: 'Oben', 1: 'Oben rechts', 2: 'Rechts', 3: 'Unten rechts', 4: 'Unten', 5: 'Unten links', 6: 'Links', 7: 'Oben links' }; export const SUBBUTTON_ACTIONS = { TOGGLE_KNX: 0, NAVIGATE: 1 }; export const ICON_DEFAULTS = { iconCodepoint: 0, iconPosition: 0, iconSize: 1, iconGap: 8 }; export const fontSizes = [14, 18, 22, 28, 36, 48]; export const defaultFormats = { 1: '%.1f °C', 2: '%s', 3: '%d %%', 4: '%s', 5: '%.1f W', 6: '%.0f kWh', 7: '%d', 8: '%02d:%02d:%02d', 9: '%02d.%02d.%04d', 10: '%02d.%02d.%04d %02d:%02d:%02d', 11: '%02d:%02d:%02d', 12: '%02d.%02d.%04d', 13: '%02d.%02d.%04d %02d:%02d:%02d' }; export const WIDGET_DEFAULTS = { label: { w: 160, h: 40, text: 'Neues Label', textSrc: 0, fontSize: 1, textAlign: TEXT_ALIGNS.LEFT, textColor: '#FFFFFF', bgColor: '#0E1217', bgOpacity: 0, radius: 6, shadow: { enabled: false, x: 2, y: 2, blur: 8, spread: 0, color: '#000000' }, isToggle: false, knxAddrWrite: 0, knxAddr: 0, action: BUTTON_ACTIONS.KNX, targetScreen: 0, iconCodepoint: 0, iconPosition: 0, iconSize: 1, iconGap: 8 }, button: { w: 130, h: 52, text: 'Button', textSrc: 0, fontSize: 1, textAlign: TEXT_ALIGNS.CENTER, isContainer: true, textColor: '#FFFFFF', bgColor: '#2E7DD1', bgOpacity: 255, radius: 10, shadow: { enabled: true, x: 2, y: 3, blur: 10, spread: 0, color: '#000000' }, isToggle: false, knxAddrWrite: 0, knxAddr: 0, action: BUTTON_ACTIONS.KNX, targetScreen: 0, iconCodepoint: 0, iconPosition: 0, iconSize: 1, iconGap: 8 }, led: { w: 60, h: 60, text: '', textSrc: 0, fontSize: 1, textAlign: TEXT_ALIGNS.CENTER, textColor: '#FFFFFF', bgColor: '#F6C177', bgOpacity: 255, radius: 30, shadow: { enabled: true, x: 0, y: 0, blur: 18, spread: 0, color: '#F6C177' }, isToggle: false, knxAddrWrite: 0, knxAddr: 0, action: BUTTON_ACTIONS.KNX, targetScreen: 0, iconCodepoint: 0, iconPosition: 0, iconSize: 1, iconGap: 8 }, icon: { w: 48, h: 48, text: '', textSrc: 0, fontSize: 3, textAlign: TEXT_ALIGNS.CENTER, textColor: '#FFFFFF', bgColor: '#0E1217', bgOpacity: 0, radius: 0, shadow: { enabled: false, x: 0, y: 0, blur: 0, spread: 0, color: '#000000' }, isToggle: false, knxAddrWrite: 0, knxAddr: 0, action: BUTTON_ACTIONS.KNX, targetScreen: 0, iconCodepoint: 0xe88a, iconPosition: 0, iconSize: 3, iconGap: 8 }, tabview: { w: 400, h: 300, text: '', textSrc: 0, fontSize: 1, textAlign: TEXT_ALIGNS.CENTER, textColor: '#FFFFFF', bgColor: '#2a3543', bgOpacity: 255, radius: 8, shadow: { enabled: false }, isToggle: false, knxAddrWrite: 0, knxAddr: 0, action: 0, targetScreen: 0, iconCodepoint: 0, iconPosition: 0, // 0=Top, 1=Bottom, 2=Left, 3=Right iconSize: 5, // Used for Tab Height (x10) -> 50px iconGap: 0 }, tabpage: { w: 0, // Ignored h: 0, // Ignored text: 'Tab', textSrc: 0, fontSize: 1, textAlign: TEXT_ALIGNS.CENTER, textColor: '#FFFFFF', bgColor: '#1A1A2E', bgOpacity: 0, // Transparent by default radius: 0, shadow: { enabled: false }, isToggle: false, knxAddrWrite: 0, knxAddr: 0, action: 0, targetScreen: 0, iconCodepoint: 0, iconPosition: 0, iconSize: 1, iconGap: 0 }, powerflow: { w: 720, h: 460, text: 'Power Flow Card', textSrc: 0, fontSize: 1, textAlign: TEXT_ALIGNS.LEFT, textColor: '#1f2a33', bgColor: '#ffffff', bgOpacity: 255, radius: 18, shadow: { enabled: true, x: 0, y: 8, blur: 22, spread: 0, color: '#1b28351f' }, isToggle: false, knxAddrWrite: 0, knxAddr: 0, action: 0, targetScreen: 0, iconCodepoint: 0, iconPosition: 0, iconSize: 1, iconGap: 0 }, powernode: { w: 120, h: 120, text: 'Knoten\n0 W', textSrc: 0, fontSize: 2, textAlign: TEXT_ALIGNS.CENTER, textColor: '#223447', bgColor: '#4fb06d', bgOpacity: 255, radius: 60, shadow: { enabled: false, x: 0, y: 0, blur: 12, spread: 0, color: '#4fb06d' }, isToggle: false, knxAddrWrite: 0, knxAddr: 0, action: 0, targetScreen: 0, iconCodepoint: 0, iconPosition: 0, iconSize: 1, iconGap: 8, // Secondary value (left) textSrc2: 0, text2: '', knxAddr2: 0, // Tertiary value (right) textSrc3: 0, text3: '', knxAddr3: 0, // Conditions conditions: [] }, powerlink: { w: 3, h: 0, text: '', textSrc: 0, fontSize: 0, textAlign: TEXT_ALIGNS.CENTER, textColor: '#2b3b4b', bgColor: '#6fa7d8', bgOpacity: 220, radius: 0, shadow: { enabled: false, x: 0, y: 0, blur: 0, spread: 0, color: '#000000' }, isToggle: false, knxAddrWrite: 0, knxAddr: 0, action: 0, targetScreen: 0, iconCodepoint: 0, iconPosition: 0, iconSize: 0, iconGap: 6 }, chart: { w: 360, h: 220, text: 'Chart', textSrc: 0, fontSize: 1, textAlign: TEXT_ALIGNS.LEFT, textColor: '#E7EDF3', bgColor: '#16202c', bgOpacity: 255, radius: 12, shadow: { enabled: false, x: 0, y: 0, blur: 0, spread: 0, color: '#000000' }, isToggle: false, knxAddrWrite: 0, knxAddr: 0, action: 0, targetScreen: 0, iconCodepoint: 0, iconPosition: 0, iconSize: 1, iconGap: 0, chart: { period: 0, series: [ { knxAddr: 0, textSrc: 1, color: '#EF6351' } ] } }, clock: { w: 200, h: 200, text: '', textSrc: 11, // System Time fontSize: 1, textAlign: TEXT_ALIGNS.CENTER, textColor: '#FFFFFF', bgColor: '#16202c', bgOpacity: 255, radius: 100, // Circular default shadow: { enabled: false, x: 0, y: 0, blur: 0, spread: 0, color: '#000000' }, isToggle: false, knxAddrWrite: 0, knxAddr: 0, action: 0, targetScreen: 0, iconCodepoint: 0, iconPosition: 0, iconSize: 1, iconGap: 0 }, roomcard: { w: 200, h: 200, text: 'Wohnzimmer\n%.1f °C', textSrc: 1, // Temperature fontSize: 2, textAlign: TEXT_ALIGNS.CENTER, textColor: '#223447', bgColor: '#FFFFFF', bgOpacity: 255, radius: 100, shadow: { enabled: true, x: 0, y: 4, blur: 12, spread: 0, color: '#00000022' }, isToggle: false, knxAddrWrite: 0, knxAddr: 0, action: BUTTON_ACTIONS.JUMP, targetScreen: 0, iconCodepoint: 0xe88a, // Home icon iconPosition: 0, iconSize: 3, iconGap: 8, subButtonSize: 40, // Sub-button size in pixels subButtonDistance: 80, // Distance from center in pixels subButtons: [] } };