Add a select font preview in OSD
Miguel Angel Mulero Martinez
parent
3b1ed981d7
commit
451e4d6bb8
|
|
@ -3594,7 +3594,11 @@
|
|||
},
|
||||
"osdSetupPreviewSelectProfileTitle": {
|
||||
"message": "Preview for",
|
||||
"description": "Label of the selector for the OSD Profile in the preview"
|
||||
"description": "Label of the selector for the OSD Profile in the preview. KEEP IT SHORT!!!"
|
||||
},
|
||||
"osdSetupPreviewForTitle": {
|
||||
"message": "Changing here the profile or the font will NOT change the profile or the font in the flight controller, only affects the preview window. If you want to change it, you must use the '$t(osdSetupSelectedProfileTitle.message)' option or the '$t(osdSetupFontManager.message)' button respectively.",
|
||||
"description": "Help content for the OSD profile and font PREVIEW"
|
||||
},
|
||||
"osdSetupSelectedProfileTitle": {
|
||||
"message": "Active OSD Profile",
|
||||
|
|
@ -3608,6 +3612,10 @@
|
|||
"message": "OSD Profile {{profileNumber}}",
|
||||
"description": "Content of the selector for the OSD Profile in the preview"
|
||||
},
|
||||
"osdSetupPreviewSelectFontElement": {
|
||||
"message": "Font {{fontName}}",
|
||||
"description": "Content of the selector for the OSD Font in the preview"
|
||||
},
|
||||
"osdSetupPreviewTitleTip": {
|
||||
"message": "Show or hide the logo in the preview window. This will not change any settings on the flight controller."
|
||||
},
|
||||
|
|
@ -3641,6 +3649,10 @@
|
|||
"osdSetupFontPresetsSelector": {
|
||||
"message": "Select Font Presets:"
|
||||
},
|
||||
"osdSetupFontPresetsSelectorCustomOption": {
|
||||
"message": "User supplied font",
|
||||
"description": "Option to show as selected when the user selects a custom local font"
|
||||
},
|
||||
"osdSetupFontPresetsSelectorOr": {
|
||||
"message": "or"
|
||||
},
|
||||
|
|
|
|||
|
|
@ -302,6 +302,23 @@
|
|||
position: relative;
|
||||
}
|
||||
|
||||
.tab-osd .preview .gui_box_titlebar label {
|
||||
max-width: 100px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
vertical-align: bottom;
|
||||
}
|
||||
|
||||
.tab-osd .preview .gui_box_titlebar select {
|
||||
max-width: 100px;
|
||||
border-radius: 2px;
|
||||
font-size: 11px;
|
||||
font-weight: normal;
|
||||
font-family: 'open_sansregular', 'Segoe UI', Tahoma, sans-serif;
|
||||
}
|
||||
|
||||
.tab-osd .preview .gui_box_bottombar {
|
||||
text-align: center;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2166,6 +2166,37 @@ TABS.osd.initialize = function (callback) {
|
|||
// Select the current OSD profile
|
||||
osdProfileActive_e.val(OSD.data.osd_profiles.selected);
|
||||
|
||||
// Populate the fonts selector preview
|
||||
let osdFontSelector_e = $('.osdfont-selector');
|
||||
let osdFontPresetsSelector_e = $('.fontpresets');
|
||||
if (osdFontSelector_e.children().length == 0) {
|
||||
|
||||
// Custom font selected by the user
|
||||
var option = $('<option>', {
|
||||
text: i18n.getMessage("osdSetupFontPresetsSelectorCustomOption"),
|
||||
value: -1,
|
||||
"disabled": "disabled",
|
||||
"style":"display: none;",
|
||||
});
|
||||
osdFontSelector_e.append($(option));
|
||||
|
||||
// Standard fonts
|
||||
OSD.constants.FONT_TYPES.forEach(function (e, i) {
|
||||
let optionText = i18n.getMessage('osdSetupPreviewSelectFontElement', {fontName : e.name});
|
||||
osdFontSelector_e.append(new Option(optionText, e.file));
|
||||
});
|
||||
|
||||
osdFontSelector_e.change(function() {
|
||||
// Change the font selected in the Font Manager, in this way it is easier to flash if the user likes it
|
||||
osdFontPresetsSelector_e.val(this.value).change();
|
||||
});
|
||||
}
|
||||
|
||||
// Select the same element than the Font Manager window
|
||||
osdFontSelector_e.val(osdFontPresetsSelector_e.val() != null ? osdFontPresetsSelector_e.val() : -1);
|
||||
// Hide custom if not used
|
||||
$('.osdfont-selector option[value=-1]').toggle(osdFontSelector_e.val() == -1);
|
||||
|
||||
// display fields on/off and position
|
||||
var $displayFields = $('#element-fields').empty();
|
||||
var enabledCount = 0;
|
||||
|
|
@ -2433,6 +2464,7 @@ TABS.osd.initialize = function (callback) {
|
|||
FONT.preview(fontPreviewElement);
|
||||
LogoManager.drawPreview();
|
||||
updateOsdView();
|
||||
$('.fontpresets option[value=-1]').hide();
|
||||
});
|
||||
});
|
||||
// load the first font when we change tabs
|
||||
|
|
@ -2445,6 +2477,8 @@ TABS.osd.initialize = function (callback) {
|
|||
LogoManager.drawPreview();
|
||||
updateOsdView();
|
||||
$('.font-manager-version-info').text(i18n.getMessage('osdDescribeFontVersionCUSTOM'));
|
||||
$('.fontpresets option[value=-1]').show();
|
||||
$('.fontpresets').val(-1);
|
||||
}).catch(error => console.error(error));
|
||||
});
|
||||
|
||||
|
|
|
|||
|
|
@ -37,11 +37,14 @@
|
|||
|
||||
<div class="gui_box_titlebar image">
|
||||
<div class="spacer_box_title">
|
||||
<span>
|
||||
<span i18n_title="osdSetupPreviewForTitle">
|
||||
<label id="osdprofile-selector-label" i18n="osdSetupPreviewSelectProfileTitle"/>
|
||||
<select class="osdprofile-selector">
|
||||
<!-- Populated at runtime -->
|
||||
</select>
|
||||
<select class="osdfont-selector">
|
||||
<!-- Populated at runtime -->
|
||||
</select>
|
||||
</span>
|
||||
<span class="preview-logo cf_tip" i18n_title="osdSetupPreviewTitleTip"></span>
|
||||
</div>
|
||||
|
|
@ -152,7 +155,10 @@
|
|||
<div class="content_wrapper font-preview"></div>
|
||||
<div class="fontpresets_wrapper">
|
||||
<label id="font-selector-label" i18n="osdSetupFontPresetsSelector"></label>
|
||||
<select class="fontpresets"></select>
|
||||
<select class="fontpresets">
|
||||
<option value="-1" disabled i18n="osdSetupFontPresetsSelectorCustomOption" />
|
||||
<!-- Other values populated at runtime -->
|
||||
</select>
|
||||
<span id="font-selector-span" i18n="osdSetupFontPresetsSelectorOr"> Or </span>
|
||||
</div>
|
||||
<!-- Boot logo setup -->
|
||||
|
|
|
|||
Loading…
Reference in New Issue