Commit bfcf0618 authored by Jeremy Chan's avatar Jeremy Chan
Browse files

Scroll Period Added

allows for option to change how fast text scrolls
parent 983a53c6
......@@ -85,6 +85,7 @@ type Option struct {
TextVerticalAlign string `json:"textVerticalAlign"`
FontColor string `json:"fontColor"`
FontSize string `json:"fontSize"`
ScrollPeriod string `json:"scrollPeriod"`
LinkURL string `json:"linkURL"`
OkSound string `json:"okSound"`
WarningSound string `json:"warningSound"`
......
......@@ -15,9 +15,15 @@ export function StaticTickerOptions({options, updateOptions}) {
onInput={e => updateOptions({text: e.currentTarget.value})}>
</textarea>
<label for="scroll-period">Scroll Period</label>
<input class="form-control" id="scroll-period" name="scroll-period" type="number" min="1" max="200" value={options.scrollPeriod}
onInput={e => updateOptions({scrollPeriod: e.currentTarget.value})}/>
<label for="font-size">Font Size</label>
<input class="form-control" id="font-size" name="font-size" type="number" min="0" value={options.fontSize}
onInput={e => updateOptions({fontSize: e.currentTarget.value})}/>
<label for="font-color">Font Color <a onClick={e => clearField(e, 'fontColor')}>clear</a></label>
<div class="lefty-righty spacer">
......@@ -48,7 +54,9 @@ export function StaticTicker({options}) {
if(typeof options.fontColor !== 'undefined') {
textStyles += `color: ${options.fontColor}; `;
}
if(typeof options.scrollPeriod !== 'undefined') {
textStyles += `animation: marqueeX ${options.scrollPeriod}s linear infinite;`;
}
return <div class="check-content ticker" style={styles}>
<div class ="scrolling-text" style={textStyles}>{options.text}</div>
......@@ -59,5 +67,6 @@ export const StaticTickerDefaults = {
text: 'sample message',
fontSize: '22',
fontColor: '#ffffff',
backgroundColor: '#007bff'
backgroundColor: '#007bff',
scrollPeriod: '15'
}
\ 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