mirror of
https://thingvellir.net/git/overte
synced 2025-03-27 23:52:03 +01:00
WIP - adding haze blend out colour
This commit is contained in:
parent
cbaae2c79b
commit
2e2364e03f
2 changed files with 60 additions and 3 deletions
|
@ -567,9 +567,24 @@
|
|||
<div class="color-picker" id="property-zone-haze-blend-in-color"></div>
|
||||
<legend>Haze Blend In Color</legend>
|
||||
<div class="tuple">
|
||||
<div><input type="number" class="red" id="property-zone-haze-blend-in-color-red"><label for="property-zone-haze-blend-in-color-red">Red:</label></div>
|
||||
<div><input type="number" class="green" id="property-zone-haze-blend-in-color-green"><label for="property-zone-haze-blend-in-color-green">Green:</label></div>
|
||||
<div><input type="number" class="blue" id="property-zone-haze-blend-in-color-blue"><label for="property-zone-haze-blend-in-color-blue">Blue:</label></div>
|
||||
<div><input type="number" class="red" id="property-zone-haze-blend-in-color-red" min="0" max="255" step="1">
|
||||
<label for="property-zone-haze-blend-in-color-red">Red:</label></div>
|
||||
<div><input type="number" class="green" id="property-zone-haze-blend-in-color-green" min="0" max="255" step="1">
|
||||
<label for="property-zone-haze-blend-in-color-green">Green:</label></div>
|
||||
<div><input type="number" class="blue" id="property-zone-haze-blend-in-color-blue" min="0" max="255" step="1">
|
||||
<label for="property-zone-haze-blend-in-color-blue">Blue:</label></div>
|
||||
</div>
|
||||
</fieldset>
|
||||
<fieldset class="zone-group zone-section haze-section property rgb fstuple">
|
||||
<div class="color-picker" id="property-zone-haze-blend-out-color"></div>
|
||||
<legend>Haze Blend Out Color</legend>
|
||||
<div class="tuple">
|
||||
<div><input type="number" class="red" id="property-zone-haze-blend-out-color-red" min="0" max="255" step="1">
|
||||
<label for="property-zone-haze-blend-out-color-red">Red:</label></div>
|
||||
<div><input type="number" class="green" id="property-zone-haze-blend-out-color-green" min="0" max="255" step="1">
|
||||
<label for="property-zone-haze-blend-out-color-green">Green:</label></div>
|
||||
<div><input type="number" class="blue" id="property-zone-haze-blend-out-color-blue" min="0" max="255" step="1">
|
||||
<label for="property-zone-haze-blend-out-color-blue">Blue:</label></div>
|
||||
</div>
|
||||
</fieldset>
|
||||
</fieldset>
|
||||
|
|
|
@ -664,6 +664,10 @@ function loaded() {
|
|||
var elZoneHazeBlendInColorRed = document.getElementById("property-zone-haze-blend-in-color-red");
|
||||
var elZoneHazeBlendInColorGreen = document.getElementById("property-zone-haze-blend-in-color-green");
|
||||
var elZoneHazeBlendInColorBlue = document.getElementById("property-zone-haze-blend-in-color-blue");
|
||||
var elZoneHazeBlendOutColor = document.getElementById("property-zone-haze-blend-out-color");
|
||||
var elZoneHazeBlendOutColorRed = document.getElementById("property-zone-haze-blend-out-color-red");
|
||||
var elZoneHazeBlendOutColorGreen = document.getElementById("property-zone-haze-blend-out-color-green");
|
||||
var elZoneHazeBlendOutColorBlue = document.getElementById("property-zone-haze-blend-out-color-blue");
|
||||
var elZoneHazeBackgroundBlend = document.getElementById("property-zone-haze-background-blend");
|
||||
|
||||
var elZoneHazeAltitude = document.getElementById("property-zone-haze-altitude");
|
||||
|
@ -1019,6 +1023,17 @@ function loaded() {
|
|||
elZoneHazeBlendInColorBlue.value = properties.haze.hazeBlendInColor.blue;
|
||||
elZoneHazeBackgroundBlend.value = properties.haze.hazeBackgroundBlend.toFixed(2);
|
||||
|
||||
elZoneHazeBlendOutColor.style.backgroundColor = "rgb(" +
|
||||
properties.haze.hazeBlendOutColor.red + "," +
|
||||
properties.haze.hazeBlendOutColor.green + "," +
|
||||
properties.haze.hazeBlendOutColor.blue + ")";
|
||||
|
||||
elZoneHazeBlendOutColorRed.value = properties.haze.hazeBlendOutColor.red;
|
||||
elZoneHazeBlendOutColorGreen.value = properties.haze.hazeBlendOutColor.green;
|
||||
elZoneHazeBlendOutColorBlue.value = properties.haze.hazeBlendOutColor.blue;
|
||||
|
||||
elZoneHazeBackgroundBlend.value = properties.haze.hazeBackgroundBlend.toFixed(2);
|
||||
|
||||
elZoneHazeAltitude.value = properties.haze.hazeAltitude.toFixed(0);
|
||||
|
||||
elZoneStageLatitude.value = properties.stage.latitude.toFixed(2);
|
||||
|
@ -1418,6 +1433,7 @@ function loaded() {
|
|||
elZoneHazeMode.addEventListener('change', createEmitTextPropertyUpdateFunction('hazeMode'));
|
||||
|
||||
elZoneHazeRange.addEventListener('change', createEmitGroupNumberPropertyUpdateFunction('haze', 'hazeRange'));
|
||||
|
||||
colorPickers.push($('#property-zone-haze-blend-in-color').colpick({
|
||||
colorScheme: 'dark',
|
||||
layout: 'hex',
|
||||
|
@ -1442,6 +1458,32 @@ function loaded() {
|
|||
elZoneHazeBlendInColorRed.addEventListener('change', zoneHazeBlendInColorChangeFunction);
|
||||
elZoneHazeBlendInColorGreen.addEventListener('change', zoneHazeBlendInColorChangeFunction);
|
||||
elZoneHazeBlendInColorBlue.addEventListener('change', zoneHazeBlendInColorChangeFunction);
|
||||
|
||||
colorPickers.push($('#property-zone-haze-blend-out-color').colpick({
|
||||
colorScheme: 'dark',
|
||||
layout: 'hex',
|
||||
color: '000000',
|
||||
onShow: function(colpick) {
|
||||
$('#property-zone-haze-blend-out-color').attr('active', 'true');
|
||||
},
|
||||
onHide: function(colpick) {
|
||||
$('#property-zone-haze-blend-out-color').attr('active', 'false');
|
||||
},
|
||||
onSubmit: function(hsb, hex, rgb, el) {
|
||||
$(el).css('background-color', '#' + hex);
|
||||
$(el).colpickHide();
|
||||
emitColorPropertyUpdate('color', rgb.r, rgb.g, rgb.b, 'hazeBlendOutColor');
|
||||
}
|
||||
}));
|
||||
var zoneHazeBlendOutColorChangeFunction = createEmitGroupColorPropertyUpdateFunction('haze', 'hazeBlendOutColor',
|
||||
elZoneHazeBlendOutColorRed,
|
||||
elZoneHazeBlendOutColorGreen,
|
||||
elZoneHazeBlendOutColorBlue);
|
||||
|
||||
elZoneHazeBlendOutColorRed.addEventListener('change', zoneHazeBlendOutColorChangeFunction);
|
||||
elZoneHazeBlendOutColorGreen.addEventListener('change', zoneHazeBlendOutColorChangeFunction);
|
||||
elZoneHazeBlendOutColorBlue.addEventListener('change', zoneHazeBlendOutColorChangeFunction);
|
||||
|
||||
elZoneHazeBackgroundBlend.addEventListener('change', createEmitGroupNumberPropertyUpdateFunction('haze', 'hazeBackgroundBlend'));
|
||||
|
||||
elZoneHazeAltitude.addEventListener('change', createEmitGroupNumberPropertyUpdateFunction('haze', 'hazeAltitude'));
|
||||
|
|
Loading…
Reference in a new issue