#98 dialogs i18n translate changes

master
Agriya Dev5 2021-05-19 14:46:40 +05:30
parent 299f271d18
commit e58ea5a155
6 changed files with 51 additions and 38 deletions

View File

@ -111,6 +111,16 @@ class Editor extends EditorStartup {
this.layersPanel = new LayersPanel(this);
this.mainMenu = new MainMenu(this);
window.svgEditor = this;
this.loadComponentAndDialog();
}
/**
* @returns {void}
*/
async loadComponentAndDialog() {
// eslint-disable-next-line no-unsanitized/method
// await import(`./components/index.js`);
// eslint-disable-next-line no-unsanitized/method
await import(`./dialogs/index.js`);
}
/**
*

View File

@ -1,4 +1,6 @@
/* globals svgEditor */
const template = document.createElement('template');
// eslint-disable-next-line no-unsanitized/property
template.innerHTML = `
<style>
.contextMenu {
@ -66,53 +68,53 @@ template.innerHTML = `
<ul id="cmenu_canvas" class="contextMenu">
<li>
<a href="#cut" id="se-cut">
Cut<span class="shortcut">META+X</span>
${svgEditor.i18next.t('tools.cut')}<span class="shortcut">META+X</span>
</a>
</li>
<li>
<a href="#copy" id="se-copy">
Copy<span class="shortcut">META+C</span>
${svgEditor.i18next.t('tools.copy')}<span class="shortcut">META+C</span>
</a>
</li>
<li>
<a href="#paste" id="se-paste">Paste</a>
<a href="#paste" id="se-paste">${svgEditor.i18next.t('tools.paste')}</a>
</li>
<li>
<a href="#paste_in_place" id="se-paste-in-place">Paste in Place</a>
<a href="#paste_in_place" id="se-paste-in-place">${svgEditor.i18next.t('tools.paste_in_place')}</a>
</li>
<li class="separator">
<a href="#delete" id="se-delete">
Delete<span class="shortcut">BACKSPACE</span>
${svgEditor.i18next.t('tools.delete')}<span class="shortcut">BACKSPACE</span>
</a>
</li>
<li class="separator">
<a href="#group" id="se-group">
Group<span class="shortcut">G</span>
${svgEditor.i18next.t('tools.group')}<span class="shortcut">G</span>
</a>
</li>
<li>
<a href="#ungroup" id="se-ungroup">
Ungroup<span class="shortcut">G</span>
${svgEditor.i18next.t('tools.ungroup')}<span class="shortcut">G</span>
</a>
</li>
<li class="separator">
<a href="#move_front" id="se-move-front">
Bring to Front<span class="shortcut">CTRL+SHFT+]</span>
${svgEditor.i18next.t('tools.move_front')}<span class="shortcut">CTRL+SHFT+]</span>
</a>
</li>
<li>
<a href="#move_up" id="se-move-up">
Bring Forward<span class="shortcut">CTRL+]</span>
${svgEditor.i18next.t('tools.move_up')}<span class="shortcut">CTRL+]</span>
</a>
</li>
<li>
<a href="#move_down" id="se-move-down">
Send Backward<span class="shortcut">CTRL+[</span>
${svgEditor.i18next.t('tools.move_down')}<span class="shortcut">CTRL+[</span>
</a>
</li>
<li>
<a href="#move_back" id="se-move-back">
Send to Back<span class="shortcut">CTRL+SHFT+[</span>
${svgEditor.i18next.t('tools.move_back')}<span class="shortcut">CTRL+SHFT+[</span>
</a>
</li>
</ul>

View File

@ -1,4 +1,6 @@
/* globals svgEditor */
const template = document.createElement('template');
// eslint-disable-next-line no-unsanitized/property
template.innerHTML = `
<style>
.contextMenu {
@ -64,10 +66,10 @@ template.innerHTML = `
}
</style>
<ul id="cmenu_layers" class="contextMenu">
<li><a href="#dupe" id="se-dupe">Duplicate Layer...</a></li>
<li><a href="#delete" id="se-layer-delete">Delete Layer</a></li>
<li><a href="#merge_down" id="se-merge-down">Merge Down</a></li>
<li><a href="#merge_all" id="se-merge-all">Merge All</a></li>
<li><a href="#dupe" id="se-dupe">${svgEditor.i18next.t('layers.dupe')}</a></li>
<li><a href="#delete" id="se-layer-delete">${svgEditor.i18next.t('layers.del')}</a></li>
<li><a href="#merge_down" id="se-merge-down">${svgEditor.i18next.t('layers.merge_down')}</a></li>
<li><a href="#merge_all" id="se-merge-all">${svgEditor.i18next.t('layers.merge_all')}</a></li>
</ul>
`;
/**

View File

@ -1,6 +1,6 @@
/* globals svgEditor */
const template = document.createElement('template');
// eslint-disable-next-line no-unsanitized/property
template.innerHTML = `
<style>
:not(:defined) {
@ -150,16 +150,16 @@ template.innerHTML = `
<div id="svg_prefs_container">
<div id="tool_prefs_back" class="toolbar_button">
<button id="tool_prefs_save">
OK
${svgEditor.i18next.t('common.ok')}
</button>
<button id="tool_prefs_cancel">
Cancel
${svgEditor.i18next.t('common.cancel')}
</button>
</div>
<fieldset>
<legend id="svginfo_editor_prefs">Editor Preferences</legend>
<legend id="svginfo_editor_prefs">${svgEditor.i18next.t('config.editor_prefs')}</legend>
<label>
<span id="svginfo_lang">Language:</span>
<span id="svginfo_lang">${svgEditor.i18next.t('config.language')}</span>
<!-- Source: https://en.wikipedia.org/wiki/Language_names -->
<select id="lang_select">
<option id="lang_ar" value="ar">العربية</option>
@ -185,46 +185,46 @@ template.innerHTML = `
</select>
</label>
<label>
<span id="svginfo_icons">Icon size:</span>
<span id="svginfo_icons">${svgEditor.i18next.t('config.icon_size')}</span>
<select id="iconsize">
<option id="icon_small" value="s">Small</option>
<option id="icon_medium" value="m" selected="selected">Medium</option>
<option id="icon_large" value="l">Large</option>
<option id="icon_xlarge" value="xl">Extra Large</option>
<option id="icon_small" value="s">${svgEditor.i18next.t('config.icon_small')}</option>
<option id="icon_medium" value="m" selected="selected">${svgEditor.i18next.t('config.icon_medium')}</option>
<option id="icon_large" value="l">${svgEditor.i18next.t('config.icon_large')}</option>
<option id="icon_xlarge" value="xl">${svgEditor.i18next.t('config.icon_xlarge')}</option>
</select>
</label>
<fieldset id="change_background">
<legend id="svginfo_change_background">Editor Background</legend>
<legend id="svginfo_change_background">${svgEditor.i18next.t('config.background')}</legend>
<div id="bg_blocks"></div>
<label>
<span id="svginfo_bg_url">URL:</span>
<span id="svginfo_bg_url">${svgEditor.i18next.t('common.url')}</span>
<input type="text" id="canvas_bg_url" />
</label>
<p id="svginfo_bg_note">Note: Background will not be saved with image.</p>
<p id="svginfo_bg_note">${svgEditor.i18next.t('config.editor_bg_note')}</p>
</fieldset>
<fieldset id="change_grid">
<legend id="svginfo_grid_settings">Grid</legend>
<legend id="svginfo_grid_settings">${svgEditor.i18next.t('config.grid')}</legend>
<label for="svginfo_snap_onoff">
<span id="svginfo_snap_onoff">Snapping on/off</span>
<span id="svginfo_snap_onoff">${svgEditor.i18next.t('config.snapping_onoff')}</span>
<input type="checkbox" value="snapping_on" id="grid_snapping_on" />
</label>
<label for="grid_snapping_step">
<span id="svginfo_snap_step">Snapping Step-Size:</span>
<span id="svginfo_snap_step">${svgEditor.i18next.t('config.snapping_stepsize')}</span>
<input type="text" id="grid_snapping_step" size="3" value="10" />
</label>
<label>
<span id="svginfo_grid_color">Grid color:</span>
<span id="svginfo_grid_color">${svgEditor.i18next.t('config.grid_color')}</span>
<input type="text" id="grid_color" size="3" value="#000" />
</label>
</fieldset>
<fieldset id="units_rulers">
<legend id="svginfo_units_rulers">Units &amp; Rulers</legend>
<legend id="svginfo_units_rulers">${svgEditor.i18next.t('config.units_and_rulers')}</legend>
<label>
<span id="svginfo_rulers_onoff">Show rulers</span>
<span id="svginfo_rulers_onoff">${svgEditor.i18next.t('config.show_rulers')}</span>
<input id="show_rulers" type="checkbox" value="show_rulers" checked="checked" />
</label>
<label>
<span id="svginfo_unit">Base Unit:</span>
<span id="svginfo_unit">${svgEditor.i18next.t('config.base_unit')}</span>
<select id="base_unit">
<option value="px">Pixels</option>
<option value="cm">Centimeters</option>

View File

@ -1,6 +1,6 @@
/* eslint-disable max-len */
/* globals svgEditor */
import 'elix/define/Dialog.js';
const template = document.createElement('template');
const notification = svgEditor.i18next.t('notification.editorPreferencesMsg');
const prefs_and_content = svgEditor.i18next.t('properties.prefs_and_content');

View File

@ -6,7 +6,6 @@ For default config and extensions (and available options) available to
import './jquery.min.js';
import './components/index.js';
import './dialogs/index.js';
import Editor from './Editor.js';
const svgEditor = new Editor();