Add configuration on story for 5 light fade presets, for #62

This commit is contained in:
Ruben van de Ven 2019-07-03 18:33:31 +02:00
parent 18147c8bad
commit cd87c7a442
4 changed files with 170 additions and 1 deletions

View File

@ -144,6 +144,8 @@ img.icon {
top: 5px;
left: 5px;
white-space: nowrap; }
#story #controls.hidden {
display: none; }
#story svg#graph {
width: 100%;
height: 100%;

View File

@ -74,7 +74,7 @@
</div>
</div>
<div id='story'>
<div id="controls">
<div id="controls" :class="[{'hidden': selectedLang === null}]">
<span id="current_hv">{{selectedId}}</span>
<span id="current_lang"></span>
<div id="btn-save" class="btn">Save</div>

View File

@ -16,6 +16,7 @@ class Panopticon {
selectedId: null,
logbook: "",
logbookId: null,
selectedLang: null,
},
methods: {
time_passed: function( hugvey, property ) {
@ -214,6 +215,8 @@ class Panopticon {
}
}
}
this.hugveys.selectedLang = code;
let req = new XMLHttpRequest();
let graph = this.graph;
req.addEventListener( "load", function( e ) {
@ -1009,6 +1012,167 @@ class Graph {
},
'value': this.configuration.hasOwnProperty('nothing_text') ? this.configuration.nothing_text : "nothing"
})
),
crel('hr'),
crel('h2', 'Light setting #0'),
crel(
'label',
"Light intensity: ",
crel('input', {
'type': 'number',
'min': 0,
'max': 255,
'on': {
'change': function(e){
panopticon.graph.configuration['light0_intensity'] = e.target.value
}
},
'value': this.configuration.hasOwnProperty('light0_intensity') ? this.configuration.light1_intensity : 0
})
),
crel(
'label',
"Fade time: ",
crel('input', {
'type': 'number',
'min': 1,
'max': 5,
'step': .1,
'on': {
'change': function(e){
panopticon.graph.configuration['light0_fade'] = e.target.value
}
},
'value': this.configuration.hasOwnProperty('light0_fade') ? this.configuration.light0_fade: 30
})
),
crel('h2', 'Light setting #1'),
crel(
'label',
"Light intensity: ",
crel('input', {
'type': 'number',
'min': 0,
'max': 255,
'on': {
'change': function(e){
panopticon.graph.configuration['light1_intensity'] = e.target.value
}
},
'value': this.configuration.hasOwnProperty('light1_intensity') ? this.configuration.light1_intensity : 150
})
),
crel(
'label',
"Fade time: ",
crel('input', {
'type': 'number',
'min': 1,
'max': 5,
'step': .1,
'on': {
'change': function(e){
panopticon.graph.configuration['light1_fade'] = e.target.value
}
},
'value': this.configuration.hasOwnProperty('light1_fade') ? this.configuration.light1_fade: 10
})
),
crel('h2', 'Light setting #2'),
crel(
'label',
"Light intensity: ",
crel('input', {
'type': 'number',
'min': 0,
'max': 255,
'on': {
'change': function(e){
panopticon.graph.configuration['light2_intensity'] = e.target.value
}
},
'value': this.configuration.hasOwnProperty('light2_intensity') ? this.configuration.light2_intensity : 75
})
),
crel(
'label',
"Fade time: ",
crel('input', {
'type': 'number',
'min': 1,
'max': 5,
'step': .1,
'on': {
'change': function(e){
panopticon.graph.configuration['light2_fade'] = e.target.value
}
},
'value': this.configuration.hasOwnProperty('light2_fade') ? this.configuration.light2_fade: 10
})
),
crel('h2', 'Light setting #3'),
crel(
'label',
"Light intensity: ",
crel('input', {
'type': 'number',
'min': 0,
'max': 255,
'on': {
'change': function(e){
panopticon.graph.configuration['light3_intensity'] = e.target.value
}
},
'value': this.configuration.hasOwnProperty('light3_intensity') ? this.configuration.light3_intensity : 150
})
),
crel(
'label',
"Fade time: ",
crel('input', {
'type': 'number',
'min': 1,
'max': 5,
'step': .1,
'on': {
'change': function(e){
panopticon.graph.configuration['light3_fade'] = e.target.value
}
},
'value': this.configuration.hasOwnProperty('light3_fade') ? this.configuration.light3_fade: 10
})
),
crel('h2', 'Light setting #4'),
crel(
'label',
"Light intensity: ",
crel('input', {
'type': 'number',
'min': 0,
'max': 255,
'on': {
'change': function(e){
panopticon.graph.configuration['light4_intensity'] = e.target.value
}
},
'value': this.configuration.hasOwnProperty('light4_intensity') ? this.configuration.light4_intensity : 150
})
),
crel(
'label',
"Fade time: ",
crel('input', {
'type': 'number',
'min': 1,
'max': 5,
'step': .1,
'on': {
'change': function(e){
panopticon.graph.configuration['light4_fade'] = e.target.value
}
},
'value': this.configuration.hasOwnProperty('light4_fade') ? this.configuration.light4_fade: 10
})
)
);

View File

@ -239,6 +239,9 @@ img.icon{
top: 5px;
left: 5px;
white-space: nowrap;
&.hidden{
display:none;
}
}
svg#graph{
width: 100%;