Commit 0aa1403c authored by StreatCodes's avatar StreatCodes
Browse files

Set good defaults for elements where appropriate

parent f46fa8f9
......@@ -5,10 +5,10 @@ import { useEffect, useReducer, useState } from 'preact/hooks';
import * as meerkat from './meerkat'
import { routeParam, removeParam, TagEditor } from './util';
import { CheckCard, CheckCardOptions } from './elements/card';
import { CheckSVG, CheckSVGOptions } from './elements/svg';
import { CheckSVG, CheckSVGOptions, CheckSVGDefaults } from './elements/svg';
import { CheckImage, CheckImageOptions } from './elements/image';
import { StaticText, StaticTextOptions } from './statics/text';
import { StaticSVG, StaticSVGOptions } from './statics/svg';
import { StaticText, StaticTextOptions, StaticTextDefaults } from './statics/text';
import { StaticSVG, StaticSVGOptions, StaticSVGDefaults } from './statics/svg';
import { StaticImage, StaticImageOptions } from './statics/image';
//Manage dashboard state
......@@ -347,6 +347,23 @@ export function ElementSettings({selectedElement, updateElement, updateTags}) {
updateElement({...selectedElement, options: newOptions})
}
//sets good default values for each visial type when they're selected
const updateType = e => {
const newType = e.currentTarget.value
let defaults = {};
switch(newType) {
case 'check-svg': defaults = CheckSVGDefaults; break;
case 'static-text': defaults = StaticTextDefaults; break;
case 'static-svg': defaults = StaticSVGDefaults; break;
}
updateElement({
...selectedElement,
type: newType,
options: Object.assign(selectedElement.options, defaults)
});
}
let ElementOptions = null;
if(selectedElement.type === 'check-card') { ElementOptions = <CheckCardOptions updateOptions={updateElementOptions} options={selectedElement.options} /> }
if(selectedElement.type === 'check-svg') { ElementOptions = <CheckSVGOptions updateOptions={updateElementOptions} options={selectedElement.options}/> }
......@@ -369,8 +386,7 @@ export function ElementSettings({selectedElement, updateElement, updateTags}) {
onInput={e => updateElement({...selectedElement, title: e.currentTarget.value})} />
<label>Visual Type</label>
<select name="item-type" value={selectedElement.type}
onInput={e => updateElement({...selectedElement, type: e.currentTarget.value})}>
<select name="item-type" value={selectedElement.type} onInput={updateType}>
<option value="check-card">Icinga Card</option>
<option value="check-svg">Icinga SVG</option>
<option value="check-image">Icinga Image</option>
......
......@@ -114,4 +114,15 @@ export function CheckSVG({options}) {
<use xlinkHref={`/res/svgs/feather-sprite.svg#${svgName}`}/>
</svg>
</div>
}
export const CheckSVGDefaults = {
okSvg: 'check-circle',
okStrokeColor: '#44bb77',
warningSvg: 'alert-triangle',
warningStrokeColor: '#aa44ff',
unknownSvg: 'help-circle',
unknownStrokeColor: '#ffaa44',
criticalSvg: 'alert-octagon',
criticalStrokeColor: '#ff5566',
}
\ No newline at end of file
......@@ -40,4 +40,10 @@ export function StaticSVG({options}) {
<use xlinkHref={`/res/svgs/feather-sprite.svg#${options.svg}`}/>
</svg>
</div>
}
export const StaticSVGDefaults = {
svg: 'cloud',
strokeColor: '#00b6ff',
strokeWidth: '1'
}
\ No newline at end of file
......@@ -71,4 +71,13 @@ export function StaticText({options}) {
return <div class="check-content text" style={styles}>
{options.text}
</div>
}
export const StaticTextDefaults = {
text: 'sample message',
fontSize: '22',
fontColor: '#ffffff',
textAlign: 'center',
textVerticalAlign: 'center',
backgroundColor: '#ff5400'
}
\ No newline at end of file
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment