balkian/soil
1
0
Fork 0
mirror of https://github.com/gsi-upm/soil synced 2024-11-22 19:22:29 +00:00
Code Issues Releases Wiki Activity

Setting model variables

Browse Source
This commit is contained in:
Tasio Mendez 2018-01-30 19:37:46 +01:00
parent 459b9a771b
commit 7ab75b6b90
5 changed files with 126 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
server.py
View File

@ -99,6 +99,24 @@ class SocketHandler(tornado.websocket.WebSocketHandler):
self.write_message({'type': 'trials',
'data': trials })
settings = []
for key in config['environment_params']:
if type(config['environment_params'][key]) == float:
setting_type = 'number'
elif type(config['environment_params'][key]) == bool:
setting_type = 'boolean'
else:
setting_type = 'undefined'
settings.append({
'label': key,
'type': setting_type,
'value': config['environment_params'][key]
})
self.write_message({'type': 'settings',
'data': settings})
elif msg['type'] == 'get_trial':
if self.application.verbose:
logger.info('Trial {} requested!'.format(msg['data']))
@ -118,7 +136,7 @@ class SocketHandler(tornado.websocket.WebSocketHandler):
self.log_capture_string.seek(0)
finally:
if self.capture_logging:
thread = threading.Timer(0.01, self.update_logging)
thread = threading.Timer(0.001, self.update_logging)
thread.start()
def on_close(self):
@ -139,13 +157,12 @@ class SocketHandler(tornado.websocket.WebSocketHandler):
self.update_logging()
yield self.capture_logging
self.capture_logging = False
self.log_capture_string.close()
self.logger_application.removeHandler(ch)
self.capture_logging = False
return self.capture_logging
class ModularServer(tornado.web.Application):
""" Main visualization application. """

25
templates/css/main.css
View File

@ -221,13 +221,11 @@ hr {
width: 100% !important;
}
.speed-slider .slider,
.link-distance-slider .slider {
.slider {
width: 100% !important;
}
.speed-slider .slider-selection,
.link-distance-slider .slider-selection {
.slider .slider-selection {
background-image: linear-gradient(to bottom,
rgba(36, 110, 162, 0.5) 0%,
rgba(3, 169, 224, 0.5) 100%) !important;
@ -291,3 +289,22 @@ table#link-distance .max {
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
background-color: #555;
}
/** FORMS **/
.checkbox {
margin-left: 10px !important;
}
#wrapper-settings {
padding: 15px !important;
}
#wrapper-settings .btn-group button:focus {
background: initial;
border-color: #ccc;
}
#wrapper-settings .btn-group button {
font-size: xx-small;
padding: 3px 6px;
}

7
templates/index.html
View File

@ -24,6 +24,7 @@
<script type="text/javascript" src="js/visualization.js"></script>
<script type="text/javascript" src="js/timeline.js"></script>
<script type="text/javascript" src="js/socket.js"></script>
<script type="text/javascript" src="js/template.js"></script>
<!-- STYLESHEETS -->
<link rel="stylesheet" type="text/css" href="css/main.css">
@ -110,8 +111,8 @@
<!-- CONSOLE -->
<div class="col-sm-9 console">
Please, update YAML file that define all the parameters of a simulation. <br/>
If you don't know how to write the file, please visit this link:<br/>
Please, upload a YAML file that defines all the parameters of a simulation. <br/>
If you don't know how to write the file, please visit this page:<br/>
http://soilsim.readthedocs.io/en/latest/quickstart.html<br/><br/>
</div>
<!-- //CONSOLE -->
@ -254,7 +255,7 @@
<!-- Wrapper Settings -->
<div class="item">
<div class="container-fluid">
<div class="container-fluid" id="wrapper-settings">

13
templates/js/socket.js
View File

@ -9,7 +9,7 @@ ws.onopen = function() {
// Receive data from server
ws.onmessage = function(message) {
console.log('Message received!');
//console.log('Message received!');
var msg = JSON.parse(message.data);
@ -30,6 +30,11 @@ ws.onmessage = function(message) {
});
break;
case 'settings':
//console.log(msg['data']);
initGUI(msg['data']);
break;
case 'error':
console.log(msg['error']);
_socket.error(msg['error']);
@ -37,9 +42,9 @@ ws.onmessage = function(message) {
break;
case 'log':
console.log(msg['logging'])
$('.console').append(msg['logger'] + ': ' + msg['logging'] + '<br/>');
$('.console').animate({ scrollTop: $(window).height() }, 'slow');
$('.console').append('$ ' + msg['logger'] + ': ' + msg['logging'] + '<br/>');
$('.console').animate({ scrollTop: $('.console')[0].scrollHeight }, 'slow');
break;
default:
console.log('Unexpected message!')

72
templates/js/template.js Normal file
View File

@ -0,0 +1,72 @@
// Add model parameters that can be edited prior to a model run
var initGUI = function(model_params) {
var onSubmitCallback = function(param_name, value) {
// SEND SOCKET REQUEST
};
var addBooleanInput = function(name, value) {
var checked = (value) ? 'checked' : 'value';
var wrapper = $('<div>').attr('class', 'col-sm-4').height('110px');
var input_group = $('<div>').attr('class', 'input-group').appendTo(wrapper);
var label = $('<label>').attr('for', name).attr('class', 'checkbox').appendTo(input_group);
var input = $('<input>') .attr('class', 'form-check-input').attr('id', name).attr('type', 'checkbox').attr(checked, checked).appendTo(label);
input.after(name);
$('#wrapper-settings').append(wrapper);
};
var addSliderInput = function(name, value) {
var wrapper = $('<div>').attr('class', 'col-sm-4').height('110px');
var label = $('<div>').width('100%').text(name).css('text-align', 'center').css('font-weight', 'bolder').appendTo(wrapper);
var input = $('<input>').attr('id', name).attr('type', 'text').attr('data-slider-min', '0.001').attr('data-slider-max', '1').attr('data-slider-step', '0.001').attr('data-slider-value', value).attr('data-slider-tooltip', 'hide').css('padding', '0 10px').appendTo(wrapper);
var span = $('<div>').attr('id', name + '_value').text('Current value: ').width('100%').css('padding-top', '10px').appendTo(wrapper);
var current_value = $('<span>').attr('id', name + '_number').text(value).appendTo(span);
var button_group = $('<div>').attr('class', 'btn-group').attr('role', 'group').css('position', 'absolute').css('right', '15px').appendTo(span);
var button_down = $('<button>').attr('type', 'button').attr('class', 'btn btn-default btn-default-down').appendTo(button_group);
var button_up = $('<button>').attr('type', 'button').attr('class', 'btn btn-default btn-default-down').appendTo(button_group);
$('<span>').attr('class', 'glyphicon glyphicon-chevron-down').attr('aria-hidden', 'true').appendTo(button_down);
$('<span>').attr('class', 'glyphicon glyphicon-chevron-up').attr('aria-hidden', 'true').appendTo(button_up);
$('#wrapper-settings').append(wrapper);
input.slider().on('change', function(slideEvt) {
current_value.text(slideEvt.value.newValue);
});
button_down.click(function() {
input.slider('setValue', input.slider('getValue') - 0.001);
current_value.text(input.slider('getValue'));
});
button_up.click(function() {
input.slider('setValue', input.slider('getValue') + 0.001);
current_value.text(input.slider('getValue'));
})
};
var addTextBox = function(param, obj) {
var well = $('<div class="well">' + obj.value + '</div>')[0];
sidebar.append(well);
};
for (var option in model_params) {
var type = typeof(model_params[option]);
var param_str = String(option);
switch (model_params[option]['type']) {
case "boolean":
addBooleanInput(model_params[option]['label'], model_params[option]['value']);
break;
case "number":
addSliderInput(model_params[option]['label'], model_params[option]['value']);
break;
case "object":
addParamInput(param_str, model_params[option]); // catch-all for params that use Option class
break;
}
}
};