Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Multiple translation issues + RU lang file #386

Merged
merged 8 commits into from
Dec 1, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
15 changes: 10 additions & 5 deletions src/js/core/gui/gui-colors.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,14 +5,15 @@

import config from './../../config.js';
import Helper_class from './../../libs/helpers.js';
import Tools_translate_class from './../../modules/tools/translate.js';

const Helper = new Helper_class();

const sidebarTemplate = `
<div class="ui_flex_group justify_content_space_between stacked">
<div id="selected_color_sample" class="ui_color_sample" title="Current Color Preview"></div>
<div class="ui_button_group">
<button id="toggle_color_picker_section_button" aria-pressed="true" class="ui_icon_button" title="Toggle Color Picker">
<button id="toggle_color_picker_section_button" aria-pressed="true" class="ui_icon_button trn" title="Toggle Color Picker">
<span class="sr_only">Toggle Color Picker</span>
<svg width="1em" height="1em" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<rect width="24" height="24" opacity="0" />
Expand All @@ -23,7 +24,7 @@ const sidebarTemplate = `
<path d="M6.16 11.26a1.5 1.5 0 1 0 2.08.4 1.49 1.49 0 0 0-2.08-.4z" />
</svg>
</button>
<button id="toggle_color_channels_section_button" aria-pressed="true" class="ui_icon_button" title="Toggle Color Channels">
<button id="toggle_color_channels_section_button" aria-pressed="true" class="ui_icon_button trn" title="Toggle Color Channels">
<span class="sr_only">Toggle Color Channels</span>
<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-card-list" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M14.5 3h-13a.5.5 0 0 0-.5.5v9a.5.5 0 0 0 .5.5h13a.5.5 0 0 0 .5-.5v-9a.5.5 0 0 0-.5-.5zm-13-1A1.5 1.5 0 0 0 0 3.5v9A1.5 1.5 0 0 0 1.5 14h13a1.5 1.5 0 0 0 1.5-1.5v-9A1.5 1.5 0 0 0 14.5 2h-13z"/>
Expand All @@ -33,7 +34,7 @@ const sidebarTemplate = `
<circle cx="3.5" cy="10.5" r=".5"/>
</svg>
</button>
<button id="toggle_color_swatches_section_button" aria-pressed="true" class="ui_icon_button" title="Toggle Swatches">
<button id="toggle_color_swatches_section_button" aria-pressed="true" class="ui_icon_button trn" title="Toggle Swatches">
<span class="sr_only">Toggle Swatches</span>
<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-grid-3x2" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M0 3.5A1.5 1.5 0 0 1 1.5 2h13A1.5 1.5 0 0 1 16 3.5v8a1.5 1.5 0 0 1-1.5 1.5h-13A1.5 1.5 0 0 1 0 11.5v-8zM1.5 3a.5.5 0 0 0-.5.5V7h4V3H1.5zM5 8H1v3.5a.5.5 0 0 0 .5.5H5V8zm1 0h4v4H6V8zm4-1H6V3h4v4zm1 1v4h3.5a.5.5 0 0 0 .5-.5V8h-4zm0-1V3h3.5a.5.5 0 0 1 .5.5V7h-4z"/>
Expand Down Expand Up @@ -101,11 +102,11 @@ const dialogTemplate = `
<div class="block_section">
<div class="ui_input_grid stacked">
<div class="ui_input_group">
<label class="label_width_medium">Current</label>
<label class="label_width_medium trn">Current</label>
<div id="dialog_selected_color_sample" class="ui_color_sample"></div>
</div>
<div class="ui_input_group">
<label class="label_width_medium">Previous</label>
<label class="label_width_medium trn">Previous</label>
<div id="dialog_previous_color_sample" class="ui_color_sample"></div>
</div>
</div>
Expand Down Expand Up @@ -177,6 +178,7 @@ class GUI_colors_class {
this.sections = null;
this.inputs = null;
this.Helper = new Helper_class();
this.Tools_translate = new Tools_translate_class();
}

render_main_colors(uiType) {
Expand All @@ -190,6 +192,9 @@ class GUI_colors_class {
this.el = document.getElementById('toggle_colors');
this.el.innerHTML = sidebarTemplate;
}
if (config.LANG != 'en') {
this.Tools_translate.translate(config.LANG, this.el);
}
this.init_components();
this.render_ui_deferred = Helper.throttle(this.render_ui_deferred, 50);
}
Expand Down
15 changes: 9 additions & 6 deletions src/js/core/gui/gui-details.js
Original file line number Diff line number Diff line change
Expand Up @@ -15,17 +15,17 @@ var template = `
<div class="row">
<span class="trn label">X</span>
<input type="number" id="detail_x" step="any" />
<button class="extra reset" type="button" id="reset_x" title="Reset">Reset</button>
<button class="extra reset trn" type="button" id="reset_x" title="Reset">Reset</button>
</div>
<div class="row">
<span class="trn label">Y:</span>
<input type="number" id="detail_y" step="any" />
<button class="extra reset" type="button" id="reset_y" title="Reset">Reset</button>
<button class="extra reset trn" type="button" id="reset_y" title="Reset">Reset</button>
</div>
<div class="row">
<span class="trn label">Width:</span>
<input type="number" id="detail_width" step="any" />
<button class="extra reset" type="button" id="reset_size" title="Reset">Reset</button>
<button class="extra reset trn" type="button" id="reset_size" title="Reset">Reset</button>
</div>
<div class="row">
<span class="trn label">Height:</span>
Expand All @@ -35,12 +35,12 @@ var template = `
<div class="row">
<span class="trn label">Rotate:</span>
<input type="number" min="-360" max="360" id="detail_rotate" />
<button class="extra reset" type="button" id="reset_rotate" title="Reset">Reset</button>
<button class="extra reset trn" type="button" id="reset_rotate" title="Reset">Reset</button>
</div>
<div class="row">
<span class="trn label">Opacity:</span>
<input type="number" min="0" max="100" id="detail_opacity" />
<button class="extra reset" type="button" id="reset_opacity" title="Reset">Reset</button>
<button class="extra reset trn" type="button" id="reset_opacity" title="Reset">Reset</button>
</div>
<div class="row">
<span class="trn label">Color:</span>
Expand Down Expand Up @@ -122,11 +122,14 @@ class GUI_details_class {
this.Tools_settings = new Tools_settings_class();
this.Helper = new Helper_class();
this.layer_details_active = false;
this.Tools_translate = new Tools_translate_class();
}

render_main_details() {
document.getElementById('toggle_details').innerHTML = template;

if (config.LANG != 'en') {
this.Tools_translate.translate(config.LANG, document.getElementById('toggle_details'));
}
this.render_details(true);
}

Expand Down
6 changes: 5 additions & 1 deletion src/js/core/gui/gui-information.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ import config from './../../config.js';
import Base_layers_class from './../base-layers.js';
import Tools_settings_class from './../../modules/tools/settings.js';
import Helper_class from './../../libs/helpers.js';
import Tools_translate_class from './../../modules/tools/translate.js';

var template = `
<span class="trn label">Size:</span>
Expand All @@ -30,7 +31,7 @@ class GUI_information_class {
this.Base_layers = new Base_layers_class();
this.Tools_settings = new Tools_settings_class();
this.Helper = new Helper_class();

this.Tools_translate = new Tools_translate_class();
this.last_width = null;
this.last_height = null;
this.units = this.Tools_settings.get_setting('default_units');
Expand All @@ -39,6 +40,9 @@ class GUI_information_class {

render_main_information() {
document.getElementById('toggle_info').innerHTML = template;
if (config.LANG != 'en') {
this.Tools_translate.translate(config.LANG, document.getElementById('toggle_info'));
}
this.set_events();
this.show_size();
}
Expand Down
25 changes: 16 additions & 9 deletions src/js/core/gui/gui-layers.js
Original file line number Diff line number Diff line change
Expand Up @@ -11,14 +11,15 @@ import Layer_rename_class from './../../modules/layer/rename.js';
import Effects_browser_class from './../../modules/effects/browser.js';
import Layer_duplicate_class from './../../modules/layer/duplicate.js';
import Layer_raster_class from './../../modules/layer/raster.js';
import Tools_translate_class from './../../modules/tools/translate.js';

var template = `
<button type="button" class="layer_add" id="insert_layer" title="Insert new layer">+</button>
<button type="button" class="layer_duplicate" id="layer_duplicate" title="Duplicate layer">D</button>
<button type="button" class="layer_raster" id="layer_raster" title="Convert layer to raster">R</button>
<button type="button" class="layer_add trn" id="insert_layer" title="Insert new layer">+</button>
<button type="button" class="layer_duplicate trn" id="layer_duplicate" title="Duplicate layer">D</button>
<button type="button" class="layer_raster trn" id="layer_raster" title="Convert layer to raster">R</button>

<button type="button" class="layers_arrow" title="Move layer down" id="layer_down">&darr;</button>
<button type="button" class="layers_arrow" title="Move layer up" id="layer_up">&uarr;</button>
<button type="button" class="layers_arrow trn" title="Move layer down" id="layer_down">&darr;</button>
<button type="button" class="layers_arrow trn" title="Move layer up" id="layer_up">&uarr;</button>

<div class="layers_list" id="layers"></div>
`;
Expand All @@ -35,12 +36,15 @@ class GUI_layers_class {
this.Effects_browser = new Effects_browser_class();
this.Layer_duplicate = new Layer_duplicate_class();
this.Layer_raster = new Layer_raster_class();
this.Tools_translate = new Tools_translate_class();
}

render_main_layers() {
document.getElementById('layers_base').innerHTML = template;
if (config.LANG != 'en') {
this.Tools_translate.translate(config.LANG, document.getElementById('layers_base'));
}
this.render_layers();

this.set_events();
}

Expand Down Expand Up @@ -151,10 +155,10 @@ class GUI_layers_class {

html += '<div class="item ' + class_extra + '">';
if (value.visible == true)
html += ' <button class="visibility visible" id="visibility" data-id="' + value.id + '" title="Hide"></button>';
html += ' <button class="visibility visible trn" id="visibility" data-id="' + value.id + '" title="Hide"></button>';
else
html += ' <button class="visibility" id="visibility" data-id="' + value.id + '" title="Show"></button>';
html += ' <button class="delete" id="delete" data-id="' + value.id + '" title="Delete"></button>';
html += ' <button class="visibility trn" id="visibility" data-id="' + value.id + '" title="Show"></button>';
html += ' <button class="delete trn" id="delete" data-id="' + value.id + '" title="Delete"></button>';

if(value.composition === 'source-atop'){
html += ' <button class="arrow_down" data-id="' + value.id + '" ></button>';
Expand Down Expand Up @@ -185,6 +189,9 @@ class GUI_layers_class {

//register
document.getElementById(target_id).innerHTML = html;
if (config.LANG != 'en') {
this.Tools_translate.translate(config.LANG, document.getElementById(target_id));
}
}
}

Expand Down
6 changes: 5 additions & 1 deletion src/js/core/gui/gui-menu.js
Original file line number Diff line number Diff line change
Expand Up @@ -46,8 +46,12 @@ class GUI_menu_class {
document.body.addEventListener('mousedown', (event) => { return this.on_mouse_down_body(event); }, true);
document.body.addEventListener('touchstart', (event) => { return this.on_mouse_down_body(event); }, true);
window.addEventListener('resize', (event) => { return this.on_resize_window(event); }, true);

document.body.classList.add('loaded');

if (config.LANG != 'en') {
this.Tools_translate.translate(config.LANG, this.menuContainer);
}
}

on(eventName, callback) {
Expand Down
9 changes: 6 additions & 3 deletions src/js/core/gui/gui-tools.js
Original file line number Diff line number Diff line change
Expand Up @@ -252,8 +252,9 @@ class GUI_tools_class {
}

var elementTitle = document.createElement('label');
elementTitle.innerHTML = title + ': ';
elementTitle.innerHTML = title + ':';
elementTitle.id = 'attribute_label_' + k;
elementTitle.className = 'trn';

const elementInput = document.createElement('input');
elementInput.type = 'number';
Expand Down Expand Up @@ -293,8 +294,9 @@ class GUI_tools_class {
//select

var elementTitle = document.createElement('label');
elementTitle.innerHTML = title + ': ';
elementTitle.innerHTML = title + ':';
elementTitle.for = k;
elementTitle.className = 'trn';

var selectList = document.createElement("select");
selectList.id = k;
Expand Down Expand Up @@ -340,8 +342,9 @@ class GUI_tools_class {
//color

var elementTitle = document.createElement('label');
elementTitle.innerHTML = title + ': ';
elementTitle.innerHTML = title + ':';
elementTitle.for = k;
elementTitle.className = 'trn';

var colorInput = document.createElement('input');
colorInput.type = 'color';
Expand Down
Loading