Merge pull request #623 from DanNixon/osd_timer_config_formatting

Improve formatting of OSD timer configuration
10.3.x-maintenance
Michael Keller 2017-08-18 03:35:35 +12:00 committed by GitHub
commit 61f3978233
3 changed files with 41 additions and 16 deletions

View File

@ -2458,12 +2458,21 @@
"message": "Value of timer 2 at time of disarming" "message": "Value of timer 2 at time of disarming"
}, },
"osdTimerSource": {
"message": "Source:"
},
"osdTimerSourceTooltip": { "osdTimerSourceTooltip": {
"message": "Select the timer source, this controls the duration/event that the timer measures" "message": "Select the timer source, this controls the duration/event that the timer measures"
}, },
"osdTimerPrecision": {
"message": "Precision:"
},
"osdTimerPrecisionTooltip": { "osdTimerPrecisionTooltip": {
"message": "Select the timer precision, this controls to what precision the time is reported in" "message": "Select the timer precision, this controls to what precision the time is reported in"
}, },
"osdTimerAlarm": {
"message": "Alarm:"
},
"osdTimerAlarmTooltip": { "osdTimerAlarmTooltip": {
"message": "Select the timer alarm threshold in minutes, when the time exceeds this value the OSD element will blink, setting this to 0 disables the alarm" "message": "Select the timer alarm threshold in minutes, when the time exceeds this value the OSD element will blink, setting this to 0 disables the alarm"
}, },

View File

@ -450,10 +450,14 @@ button {
.timer-option { .timer-option {
float: none !important; float: none !important;
padding: 2px; padding: 2px;
margin-left: 10px;
display: inline !important; display: inline !important;
} }
.timers-container label {
margin-left: 15px !important;
margin-right: 5px !important;
}
@media only screen and (max-width: 1055px) , only screen and (max-device-width: 1055px) { @media only screen and (max-width: 1055px) , only screen and (max-device-width: 1055px) {
.tab-osd .content_wrapper { .tab-osd .content_wrapper {
height: calc(100% - 30px); height: calc(100% - 30px);

View File

@ -1164,49 +1164,61 @@ TABS.osd.initialize = function (callback) {
$timerConfig.append('<span>' + (tim.index + 1) + '</span>'); $timerConfig.append('<span>' + (tim.index + 1) + '</span>');
// Source // Source
var src = $('<select class="timer-option osd_tip" id="' + tim.index + '"></select>'); var sourceSpan = $('<span class="osd_tip"></span>');
src.attr('title', chrome.i18n.getMessage('osdTimerSourceTooltip')); sourceSpan.attr('title', chrome.i18n.getMessage('osdTimerSourceTooltip'));
sourceSpan.append('<label for="timerSource_' + tim.index + '" class="char-label">' + chrome.i18n.getMessage('osdTimerSource') + '</label>');
var src = $('<select class="timer-option" id="timerSource_' + tim.index + '"></select>');
OSD.constants.TIMER_TYPES.forEach(function(e, i) { OSD.constants.TIMER_TYPES.forEach(function(e, i) {
src.append('<option value="' + i + '">' + e + '</option>'); src.append('<option value="' + i + '">' + e + '</option>');
}); });
src[0].selectedIndex = tim.src; src[0].selectedIndex = tim.src;
src.blur(function(e) { src.blur(function(e) {
OSD.data.timers[$(this)[0].id].src = $(this)[0].selectedIndex; var idx = $(this)[0].id.split("_")[1];
MSP.promise(MSPCodes.MSP_SET_OSD_CONFIG, OSD.msp.encodeTimer(OSD.data.timers[$(this)[0].id])) OSD.data.timers[idx].src = $(this)[0].selectedIndex;
MSP.promise(MSPCodes.MSP_SET_OSD_CONFIG, OSD.msp.encodeTimer(OSD.data.timers[idx]))
.then(function() { .then(function() {
updateOsdView(); updateOsdView();
}); });
}); });
$timerConfig.append(src); sourceSpan.append(src);
$timerConfig.append(sourceSpan);
// Precision // Precision
var precision = $('<select class="timer-option osd_tip" id="' + tim.index + '"></select>'); var precisionSpan = $('<span class="osd_tip"></span>');
precision.attr('title', chrome.i18n.getMessage('osdTimerPrecisionTooltip')); precisionSpan.attr('title', chrome.i18n.getMessage('osdTimerPrecisionTooltip'));
precisionSpan.append('<label for="timerPrec_' + tim.index + '" class="char-label">' + chrome.i18n.getMessage('osdTimerPrecision') + '</label>');
var precision = $('<select class="timer-option osd_tip" id="timerPrec_' + tim.index + '"></select>');
OSD.constants.TIMER_PRECISION.forEach(function(e, i) { OSD.constants.TIMER_PRECISION.forEach(function(e, i) {
precision.append('<option value="' + i + '">' + e + '</option>'); precision.append('<option value="' + i + '">' + e + '</option>');
}); });
precision[0].selectedIndex = tim.precision; precision[0].selectedIndex = tim.precision;
precision.blur(function(e) { precision.blur(function(e) {
OSD.data.timers[$(this)[0].id].precision = $(this)[0].selectedIndex; var idx = $(this)[0].id.split("_")[1];
MSP.promise(MSPCodes.MSP_SET_OSD_CONFIG, OSD.msp.encodeTimer(OSD.data.timers[$(this)[0].id])) OSD.data.timers[idx].precision = $(this)[0].selectedIndex;
MSP.promise(MSPCodes.MSP_SET_OSD_CONFIG, OSD.msp.encodeTimer(OSD.data.timers[idx]))
.then(function() { .then(function() {
updateOsdView(); updateOsdView();
}); });
}); });
$timerConfig.append(precision); precisionSpan.append(precision);
$timerConfig.append(precisionSpan);
// Alarm // Alarm
var alarm = $('<input class="timer-option osd_tip" name="alarm" type="number" min=0 id="' + tim.index + '"/>'); var alarmSpan = $('<span class="osd_tip"></span>');
alarm.attr('title', chrome.i18n.getMessage('osdTimerAlarmTooltip')); alarmSpan.attr('title', chrome.i18n.getMessage('osdTimerAlarmTooltip'));
alarmSpan.append('<label for="timerAlarm_' + tim.index + '" class="char-label">' + chrome.i18n.getMessage('osdTimerAlarm') + '</label>');
var alarm = $('<input class="timer-option osd_tip" name="alarm" type="number" min=0 id="timerAlarm_' + tim.index + '"/>');
alarm[0].value = tim.alarm; alarm[0].value = tim.alarm;
alarm.blur(function(e) { alarm.blur(function(e) {
OSD.data.timers[$(this)[0].id].alarm = $(this)[0].value; var idx = $(this)[0].id.split("_")[1];
MSP.promise(MSPCodes.MSP_SET_OSD_CONFIG, OSD.msp.encodeTimer(OSD.data.timers[$(this)[0].id])) OSD.data.timers[idx].alarm = $(this)[0].value;
MSP.promise(MSPCodes.MSP_SET_OSD_CONFIG, OSD.msp.encodeTimer(OSD.data.timers[idx]))
.then(function() { .then(function() {
updateOsdView(); updateOsdView();
}); });
}); });
$timerConfig.append(alarm); alarmSpan.append(alarm);
$timerConfig.append(alarmSpan);
$timers.append($timerConfig); $timers.append($timerConfig);
} }