Merge pull request #55 from mikeller/move_throttle_settings_into_pid_tab

Move throttle settings into pid tab
10.3.x-maintenance
borisbstyle 2016-06-28 23:16:00 +02:00 committed by GitHub
commit e8456795dd
7 changed files with 247 additions and 121 deletions

View File

@ -787,6 +787,9 @@
"rcYawCurve": {
"message": "RC Yaw Curve"
},
"throttle": {
"message": "Throttle"
},
"pidTuningButtonSave": {
"message": "Save"
},

View File

@ -44,6 +44,127 @@
border: 1px solid silver;
}
.tab-pid_tuning .curves {
float: left;
margin-right: 10px;
}
.tab-pid_tuning .throttle_curve {
float: right;
width: calc(100% - 2px); /* - ( "virtual" margin) */
margin: 0 0px 0px 0;
border: 1px solid silver;
border-radius: 3px;
background-image: url(../images/paper.jpg);
background-size: 200%;
background-position: center;
}
.tab-pid_tuning .throttle {
float: right;
width: 45%;
}
.tab-pid_tuning .throttle table {
border-collapse: collapse;
width: calc(100% - 2px);
}
.tab-pid_tuning .throttle table, .tab-pid_tuning .throttle table th, .tab-pid_tuning .throttle table td {
padding: 4px;
text-align: left;
padding-left: 6px;
}
.tab-pid_tuning .throttle table th {
background: #828885;
color: white;
border-right: 1px solid silver;
font-weight: normal;
}
.tab-pid_tuning .throttle table th:first-child {
border-top-left-radius: 3px;
}
.tab-pid_tuning .throttle table th:last-child {
border-top-right-radius: 3px;
border-right: 0px;
}
.tab-pid_tuning .throttle table td {
background: #DEDEDE;
border-right: 1px solid silver;
}
.tab-pid_tuning .throttle table td:first-child {
border-bottom-left-radius: 3px;
}
.tab-pid_tuning .throttle {
float: right;
width: 45%;
}
.tab-pid_tuning .throttle table {
border-collapse: collapse;
width: calc(100% - 2px);
}
.tab-pid_tuning .throttle table, .tab-pid_tuning .throttle table th, .tab-pid_tuning .throttle table td {
padding: 4px;
text-align: left;
padding-left: 6px;
}
.tab-pid_tuning .throttle table th {
background: #828885;
color: white;
border-right: 1px solid silver;
font-weight: normal;
}
.tab-pid_tuning .throttle table th:first-child {
border-top-left-radius: 3px;
}
.tab-pid_tuning .throttle table th:last-child {
border-top-right-radius: 3px;
border-right: 0px;
}
.tab-pid_tuning .throttle table td {
background: #DEDEDE;
border-right: 1px solid silver;
}
.tab-pid_tuning .throttle table td:first-child {
border-bottom-left-radius: 3px;
}
.tab-pid_tuning .throttle table td:last-child {
border-bottom-right-radius: 3px;
border-right: 0px;
}
.tab-pid_tuning .throttle table td {
padding: 1px;
}
.tab-pid_tuning .throttle table tr:nth-child(odd) {
background-color: #ececec;
}
.tab-pid_tuning .throttle table input {
width: calc(100% - 8px);
border: 1px solid silver;
border-radius: 3px;
height: 20px;
margin: 3px;
line-height: 20px;
text-align: right;
}
.tab-pid_tuning .tpa th:nth-child(2) {
border-top-left-radius: 3px;
}

View File

@ -242,6 +242,34 @@
</tbody>
</table>
</div>
<div class="spacer_left throttle topspacer">
<table class="cf">
<thead>
<tr>
<th colspan=2 i18n="throttle"></th>
</tr>
</thead>
</tbody>
<tr>
<td colspan=2>
<div class="spacer" style="margin-top: 10px; margin-bottom: 10px;">
<div class="throttle_curve">
<canvas height="120px" style="width: 100%; height: 100%"></canvas>
</div>
</div>
</td>
</tr>
<tr>
<th i18n="receiverThrottleMid"></th>
<th i18n="receiverThrottleExpo"></th>
</tr>
<tr>
<td><input type="number" name="mid" step="0.01" min="0" max="1" /></td>
<td><input type="number" name="expo" step="0.01" min="0" max="1" /></td>
</tr>
</tbody>
</table>
</div>
<div class="spacer_left topspacer">
<table class="tpa cf">
<thead>

View File

@ -174,6 +174,9 @@ TABS.pid_tuning.initialize = function (callback) {
$('.pid_tuning input[name="rc_yaw_expo"]').val(RC_tuning.RC_YAW_EXPO.toFixed(2));
$('.pid_tuning input[name="rc_rate_yaw"]').val(SPECIAL_PARAMETERS.RC_RATE_YAW.toFixed(2));
$('.throttle input[name="mid"]').val(RC_tuning.throttle_MID.toFixed(2));
$('.throttle input[name="expo"]').val(RC_tuning.throttle_EXPO.toFixed(2));
$('.tpa input[name="tpa"]').val(RC_tuning.dynamic_THR_PID.toFixed(2));
$('.tpa input[name="tpa-breakpoint"]').val(RC_tuning.dynamic_THR_breakpoint);
@ -254,6 +257,9 @@ TABS.pid_tuning.initialize = function (callback) {
RC_tuning.RC_YAW_EXPO = parseFloat($('.pid_tuning input[name="rc_yaw_expo"]').val());
SPECIAL_PARAMETERS.RC_RATE_YAW = parseFloat($('.pid_tuning input[name="rc_rate_yaw"]').val());
RC_tuning.throttle_MID = parseFloat($('.throttle input[name="mid"]').val());
RC_tuning.throttle_EXPO = parseFloat($('.throttle input[name="expo"]').val())
RC_tuning.dynamic_THR_PID = parseFloat($('.tpa input[name="tpa"]').val());
RC_tuning.dynamic_THR_breakpoint = parseInt($('.tpa input[name="tpa-breakpoint"]').val());
FILTER_CONFIG.gyro_soft_lpf_hz = parseInt($('.pid_filter .gyro').val());
@ -404,14 +410,57 @@ TABS.pid_tuning.initialize = function (callback) {
rcCurveElement = $('.pitch_roll_curve canvas').get(0),
rcYawCurveElement = $('.yaw_curve canvas').get(0);
var rateElementYaw = 1;
if (CONFIG.flightControllerIdentifier == "BTFL" && semver.gte(CONFIG.flightControllerVersion, "2.8.1")) {
rateElementYaw = $('.pid_tuning input[name="rc_rate_yaw"]');
}
var rateElementYaw = 1;
if (CONFIG.flightControllerIdentifier == "BTFL" && semver.gte(CONFIG.flightControllerVersion, "2.8.1")) {
rateElementYaw = $('.pid_tuning input[name="rc_rate_yaw"]');
}
drawRateCurve(rateElement, sRateElementRoll, expoElement, rcCurveElement);
//drawRateCurve(rateElement, sRateElementPitch, expoElement, rcCurveElement); // Add Pitch Curve
drawRateCurve(rateElementYaw, sRateElementYaw, yawExpoElement, rcYawCurveElement);
drawRateCurve(rateElement, sRateElementRoll, expoElement, rcCurveElement);
//drawRateCurve(rateElement, sRateElementPitch, expoElement, rcCurveElement); // Add Pitch Curve
drawRateCurve(rateElementYaw, sRateElementYaw, yawExpoElement, rcYawCurveElement);
}, 0);
}).trigger('input');
$('.throttle input').on('input change', function () {
setTimeout(function () { // let global validation trigger and adjust the values firs
var throttleMidE = $('.throttle input[name="mid"]'),
throttleExpoE = $('.throttle input[name="expo"]'),
mid = parseFloat(throttleMidE.val()),
expo = parseFloat(throttleExpoE.val()),
throttleCurve = $('.throttle .throttle_curve canvas').get(0),
context = throttleCurve.getContext("2d");
// local validation to deal with input event
if (mid >= parseFloat(throttleMidE.prop('min')) &&
mid <= parseFloat(throttleMidE.prop('max')) &&
expo >= parseFloat(throttleExpoE.prop('min')) &&
expo <= parseFloat(throttleExpoE.prop('max'))) {
// continue
} else {
return;
}
var canvasHeight = throttleCurve.height;
var canvasWidth = throttleCurve.width;
// math magic by englishman
var midx = canvasWidth * mid,
midxl = midx * 0.5,
midxr = (((canvasWidth - midx) * 0.5) + midx),
midy = canvasHeight - (midx * (canvasHeight / canvasWidth)),
midyl = canvasHeight - ((canvasHeight - midy) * 0.5 *(expo + 1)),
midyr = (midy / 2) * (expo + 1);
// draw
context.clearRect(0, 0, canvasWidth, canvasHeight);
context.beginPath();
context.moveTo(0, canvasHeight);
context.quadraticCurveTo(midxl, midyl, midx, midy);
context.moveTo(midx, midy);
context.quadraticCurveTo(midxr, midyr, canvasWidth, 0);
context.lineWidth = 2;
context.strokeStyle = '#ffbb00';
context.stroke();
}, 0);
}).trigger('input');

View File

@ -144,16 +144,27 @@
.tab-receiver .tunings {
float: right;
width: 45%;
position: relative;
margin: 0px 0px 20px 0;
width: 100%
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
background-color: #DEDEDE;
}
.tab-receiver .tunings .head {
height: 15px;
padding: 4px;
text-align: left;
padding-left: 6px;
font-weight: normal;
background: #828885;
color: white;
border-top-left-radius: 3px;
border-right: 1px solid silver;
}
.tab-receiver .tunings table {
border-collapse: collapse;
width: calc(100% - 2px);
}
.tab-receiver .tunings .throttle {
margin-bottom: 10px;
}
.tab-receiver .tunings table, .tab-receiver .tunings table th, .tab-receiver .tunings table td {
@ -210,7 +221,6 @@
text-align: right;
}
.tab-receiver .rssi_channel_wrapper {
float: right;
margin: 0px 0px 20px 0;

View File

@ -32,44 +32,25 @@
</select>
</div>
</div>
<div class="gui_box grey" style="float: right;">
<div class="spacer" style="margin-top: 10px; margin-bottom: 10px;">
<div class="cf_column curves" style="width: calc(55% - 10px); min-width: 200px;">
<div class="throttle_curve">
<canvas width="200" height="117"></canvas>
</div>
</div>
<div class="fc_column half tunings">
<table class="throttle">
<tr>
<th i18n="receiverThrottleMid"></th>
<th i18n="receiverThrottleExpo"></th>
</tr>
<tr>
<td><input type="number" name="mid" step="0.01" min="0" max="1" /></td>
<td><input type="number" name="expo" step="0.01" min="0" max="1" /></td>
</tr>
</table>
<table class="deadband">
<tr>
<th i18n="receiverDeadband"></th>
<th i18n="receiverYawDeadband"></th>
</tr>
<tr>
<td>
<div class="cf_tip" i18n_title="receiverHelpDeadband">
<input type="number" name="deadband" step="1" min="0" max="32" />
</div>
</td>
<td>
<div class="cf_tip" i18n_title="receiverHelpYawDeadband">
<input type="number" name="yaw_deadband" step="1" min="0" max="100" />
</div>
</td>
</tr>
</table>
</div>
</div>
<div class="gui_box tunings grey" style="float: right;">
<table class="deadband" width="100%">
<tr>
<th i18n="receiverDeadband"></th>
<th i18n="receiverYawDeadband"></th>
</tr>
<tr>
<td>
<div class="cf_tip" i18n_title="receiverHelpDeadband">
<input type="number" name="deadband" step="1" min="0" max="32" />
</div>
</td>
<td>
<div class="cf_tip" i18n_title="receiverHelpYawDeadband">
<input type="number" name="yaw_deadband" step="1" min="0" max="100" />
</div>
</td>
</tr>
</table>
</div>
</div>
<div class="clear-both"></div>

View File

@ -11,10 +11,6 @@ TABS.receiver.initialize = function (callback) {
GUI.active_tab = 'receiver';
}
function get_misc_data() {
MSP.send_message(MSP_codes.MSP_MISC, false, false, get_rc_data);
}
function get_rc_data() {
MSP.send_message(MSP_codes.MSP_RC, false, false, get_rc_map);
}
@ -41,16 +37,12 @@ TABS.receiver.initialize = function (callback) {
$('#content').load("./tabs/receiver.html", process_html);
}
MSP.send_message(MSP_codes.MSP_RC_TUNING, false, false, get_misc_data);
MSP.send_message(MSP_codes.MSP_MISC, false, false, get_rc_data);
function process_html() {
// translate to user-selected language
localize();
// fill in data from RC_tuning
$('.tunings .throttle input[name="mid"]').val(RC_tuning.throttle_MID.toFixed(2));
$('.tunings .throttle input[name="expo"]').val(RC_tuning.throttle_EXPO.toFixed(2));
chrome.storage.local.get('rx_refresh_rate', function (result) {
if (result.rx_refresh_rate) {
$('select[name="rx_refresh_rate"]').val(result.rx_refresh_rate).change();
@ -199,65 +191,11 @@ TABS.receiver.initialize = function (callback) {
var rateHeight = TABS.receiver.rateChartHeight;
// UI Hooks
// curves
$('.tunings .throttle input').on('input change', function () {
setTimeout(function () { // let global validation trigger and adjust the values first
var throttleMidE = $('.tunings .throttle input[name="mid"]'),
throttleExpoE = $('.tunings .throttle input[name="expo"]'),
mid = parseFloat(throttleMidE.val()),
expo = parseFloat(throttleExpoE.val()),
throttle_curve = $('.throttle_curve canvas').get(0),
context = throttle_curve.getContext("2d");
// local validation to deal with input event
if (mid >= parseFloat(throttleMidE.prop('min')) &&
mid <= parseFloat(throttleMidE.prop('max')) &&
expo >= parseFloat(throttleExpoE.prop('min')) &&
expo <= parseFloat(throttleExpoE.prop('max'))) {
// continue
} else {
return;
}
// math magic by englishman
var midx = 200 * mid,
midxl = midx * 0.5,
midxr = (((200 - midx) * 0.5) + midx),
midy = rateHeight - (midx * (rateHeight / 200)),
midyl = rateHeight - ((rateHeight - midy) * 0.5 *(expo + 1)),
midyr = (midy / 2) * (expo + 1);
// draw
context.clearRect(0, 0, 200, rateHeight);
context.beginPath();
context.moveTo(0, rateHeight);
context.quadraticCurveTo(midxl, midyl, midx, midy);
context.moveTo(midx, midy);
context.quadraticCurveTo(midxr, midyr, 200, 0);
context.lineWidth = 2;
context.strokeStyle = '#ffbb00';
context.stroke();
}, 0);
}).trigger('input');
$('a.refresh').click(function () {
MSP.send_message(MSP_codes.MSP_RC_TUNING, false, false, function () {
GUI.log(chrome.i18n.getMessage('receiverDataRefreshed'));
// fill in data from RC_tuning
$('.tunings .throttle input[name="mid"]').val(RC_tuning.throttle_MID.toFixed(2));
$('.tunings .throttle input[name="expo"]').val(RC_tuning.throttle_EXPO.toFixed(2));
// update visual representation
$('.tunings .throttle input').change();
});
// Todo: refresh data here
});
$('a.update').click(function () {
// catch RC_tuning changes
RC_tuning.throttle_MID = parseFloat($('.tunings .throttle input[name="mid"]').val());
RC_tuning.throttle_EXPO = parseFloat($('.tunings .throttle input[name="expo"]').val());
if (semver.gte(CONFIG.apiVersion, "1.15.0")) {
RC_deadband.yaw_deadband = parseInt($('.deadband input[name="yaw_deadband"]').val());
RC_deadband.deadband = parseInt($('.deadband input[name="deadband"]').val());
@ -274,10 +212,6 @@ TABS.receiver.initialize = function (callback) {
// catch rssi aux
MISC.rssi_channel = parseInt($('select[name="rssi_channel"]').val());
function save_rc_map() {
MSP.send_message(MSP_codes.MSP_SET_RX_MAP, MSP.crunch(MSP_codes.MSP_SET_RX_MAP), false, save_misc);
}
function save_misc() {
MSP.send_message(MSP_codes.MSP_SET_MISC, MSP.crunch(MSP_codes.MSP_SET_MISC), false, save_rc_configs);
}
@ -297,7 +231,7 @@ TABS.receiver.initialize = function (callback) {
});
}
MSP.send_message(MSP_codes.MSP_SET_RC_TUNING, MSP.crunch(MSP_codes.MSP_SET_RC_TUNING), false, save_rc_map);
MSP.send_message(MSP_codes.MSP_SET_RX_MAP, MSP.crunch(MSP_codes.MSP_SET_RX_MAP), false, save_misc);
});
$("a.sticks").click(function() {