#631 web component i18n implement new approach
agriyadev5
parent
a542ddd151
commit
704588889d
|
|
@ -120,7 +120,7 @@ class MainMenu {
|
|||
this.editor.configObj.curConfig.snappingStep = gridsnappingstep;
|
||||
this.editor.configObj.curConfig.gridColor = gridcolor;
|
||||
this.editor.configObj.curConfig.showRulers = showrulers;
|
||||
$id('rulers').style.display = (this.editor.configObj.curConfig.showRulers) ? 'block' : 'none';
|
||||
// $id("rulers").style.display = (this.editor.configObj.curConfig.showRulers) ? 'block' : 'none';
|
||||
if (this.editor.configObj.curConfig.showRulers) {
|
||||
this.editor.rulers.updateRulers();
|
||||
}
|
||||
|
|
@ -278,16 +278,15 @@ class MainMenu {
|
|||
init() {
|
||||
// add Top panel
|
||||
const template = document.createElement("template");
|
||||
const { i18next } = this.editor;
|
||||
const { imgPath } = this.editor.configObj.curConfig;
|
||||
// eslint-disable-next-line no-unsanitized/property
|
||||
template.innerHTML = `
|
||||
<se-menu id="main_button" label="SVG-Edit" src="${imgPath}/logo.svg" alt="logo">
|
||||
<se-menu-item id="tool_import" label="${i18next.t('tools.import_doc')}" src="${imgPath}/importImg.svg"></se-menu-item>
|
||||
<se-menu-item id="tool_export" label="${i18next.t('tools.export_img')}" src="${imgPath}/export.svg"></se-menu-item>
|
||||
<se-menu-item id="tool_docprops" label="${i18next.t('tools.docprops')}" shortcut="D" src="${imgPath}/docprop.svg"></se-menu-item>
|
||||
<se-menu-item id="tool_editor_prefs" label="${i18next.t('config.editor_prefs')}" src="${imgPath}/editPref.svg"></se-menu-item>
|
||||
<se-menu-item id="tool_editor_homepage" label="${i18next.t('tools.editor_homepage')}" src="${imgPath}/logo.svg"></se-menu-item>
|
||||
<se-menu-item id="tool_import" label="tools.import_doc" src="${imgPath}/importImg.svg"></se-menu-item>
|
||||
<se-menu-item id="tool_export" label="tools.export_img" src="${imgPath}/export.svg"></se-menu-item>
|
||||
<se-menu-item id="tool_docprops" label="tools.docprops" shortcut="D" src="${imgPath}/docprop.svg"></se-menu-item>
|
||||
<se-menu-item id="tool_editor_prefs" label="config.editor_prefs" src="${imgPath}/editPref.svg"></se-menu-item>
|
||||
<se-menu-item id="tool_editor_homepage" label="tools.editor_homepage" src="${imgPath}/logo.svg"></se-menu-item>
|
||||
</se-menu>
|
||||
`;
|
||||
$id('tools_top').prepend(template.content.cloneNode(true));
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import 'elix/define/Menu.js';
|
||||
import 'elix/define/MenuItem.js';
|
||||
|
||||
import { t } from '../locale.js';
|
||||
const template = document.createElement('template');
|
||||
template.innerHTML = `
|
||||
<style>
|
||||
|
|
@ -54,7 +54,7 @@ export class SeMenuItem extends HTMLElement {
|
|||
break;
|
||||
case 'label':
|
||||
shortcut = this.getAttribute('shortcut');
|
||||
this.$label.textContent = `${newValue} ${shortcut ? `(${shortcut})` : ''}`;
|
||||
this.$label.textContent = `${t(newValue)} ${shortcut ? `(${shortcut})` : ''}`;
|
||||
break;
|
||||
default:
|
||||
// eslint-disable-next-line no-console
|
||||
|
|
|
|||
|
|
@ -522,8 +522,9 @@ export default {
|
|||
callback() {
|
||||
// Add the button and its handler(s)
|
||||
const buttonTemplate = document.createElement("template");
|
||||
const key = name + `:buttons.0.title`;
|
||||
buttonTemplate.innerHTML = `
|
||||
<se-menu-item id="tool_imagelib" label="Image library" src="${imgPath}/library.svg"></se-menu-item>
|
||||
<se-menu-item id="tool_imagelib" label="${key}" src="${imgPath}/library.svg"></se-menu-item>
|
||||
`;
|
||||
insertAfter($id('tool_export'), buttonTemplate.content.cloneNode(true));
|
||||
$id('tool_imagelib').addEventListener("click", () => {
|
||||
|
|
|
|||
|
|
@ -162,13 +162,13 @@ export default {
|
|||
callback() {
|
||||
// eslint-disable-next-line no-unsanitized/property
|
||||
const buttonTemplate = `
|
||||
<se-menu-item id="tool_clear" label="${svgEditor.i18next.t('opensave.new_doc')}" shortcut="N" src="${imgPath}/new.svg"></se-menu-item>`;
|
||||
<se-menu-item id="tool_clear" label="opensave.new_doc" shortcut="N" src="${imgPath}/new.svg"></se-menu-item>`;
|
||||
svgCanvas.insertChildAtIndex($id('main_button'), buttonTemplate, 0);
|
||||
const openButtonTemplate = `<se-menu-item id="tool_open" label="${svgEditor.i18next.t('opensave.open_image_doc')}" src="${imgPath}/open.svg"></se-menu-item>`;
|
||||
const openButtonTemplate = `<se-menu-item id="tool_open" label="opensave.open_image_doc" src="${imgPath}/open.svg"></se-menu-item>`;
|
||||
svgCanvas.insertChildAtIndex($id('main_button'), openButtonTemplate, 1);
|
||||
const saveButtonTemplate = `<se-menu-item id="tool_save" label="${svgEditor.i18next.t('opensave.save_doc')}" shortcut="S" src="${imgPath}/saveImg.svg"></se-menu-item>`;
|
||||
const saveButtonTemplate = `<se-menu-item id="tool_save" label="opensave.save_doc" shortcut="S" src="${imgPath}/saveImg.svg"></se-menu-item>`;
|
||||
svgCanvas.insertChildAtIndex($id('main_button'), saveButtonTemplate, 2);
|
||||
const saveAsButtonTemplate = `<se-menu-item id="tool_save_as" label="${svgEditor.i18next.t('opensave.save_as_doc')}" src="${imgPath}/saveImg.svg"></se-menu-item>`;
|
||||
const saveAsButtonTemplate = `<se-menu-item id="tool_save_as" label="opensave.save_as_doc" src="${imgPath}/saveImg.svg"></se-menu-item>`;
|
||||
svgCanvas.insertChildAtIndex($id('main_button'), saveAsButtonTemplate, 3);
|
||||
// handler
|
||||
$id("tool_clear").addEventListener("click", clickClear.bind(this));
|
||||
|
|
|
|||
|
|
@ -86,3 +86,7 @@ export const putLocale = async function (givenParam, goodLangs) {
|
|||
console.info(`Lang: ${i18next.t('lang')}`);
|
||||
return { langParam, i18next };
|
||||
};
|
||||
|
||||
export const t = function (key) {
|
||||
return i18next.t(key);
|
||||
};
|
||||
|
|
@ -72,8 +72,8 @@ export default {
|
|||
text_contents: 'Change text contents',
|
||||
font_family: 'Change Font Family',
|
||||
font_size: 'Change Font Size',
|
||||
bold: 'Bold Text [B]',
|
||||
italic: 'Italic Text [I]',
|
||||
bold: 'Bold Text',
|
||||
italic: 'Italic Text',
|
||||
text_anchor_start: 'Align the text in start',
|
||||
text_anchor_middle: 'Align the text in middle',
|
||||
text_anchor_end: 'Align the text in end',
|
||||
|
|
@ -129,21 +129,21 @@ export default {
|
|||
mode_path: 'Path Tool',
|
||||
mode_text: 'Text Tool',
|
||||
mode_image: 'Image Tool',
|
||||
mode_zoom: 'Zoom Tool [Ctrl+Up/Down]',
|
||||
mode_zoom: 'Zoom Tool',
|
||||
no_embed: 'NOTE: This image cannot be embedded. It will depend on this path to be displayed',
|
||||
undo: 'Undo [Z]',
|
||||
redo: 'Redo [Y]',
|
||||
undo: 'Undo',
|
||||
redo: 'Redo',
|
||||
tool_source: 'Edit Source',
|
||||
wireframe_mode: 'Wireframe Mode',
|
||||
clone: 'Duplicate Element(s) [D]',
|
||||
clone: 'Duplicate Element(s)',
|
||||
del: 'Delete Element(s)',
|
||||
group_elements: 'Group Elements [G]',
|
||||
group_elements: 'Group Elements',
|
||||
make_link: 'Make (hyper)link',
|
||||
set_link_url: 'Set link URL (leave empty to remove)',
|
||||
to_path: 'Convert to Path',
|
||||
reorient_path: 'Reorient path',
|
||||
ungroup: 'Ungroup Elements',
|
||||
docprops: 'Document Properties [D]',
|
||||
docprops: 'Document Properties',
|
||||
editor_homepage: 'SVG-Edit Home Page',
|
||||
move_bottom: 'Send to Back',
|
||||
move_top: 'Bring to Front',
|
||||
|
|
|
|||
Loading…
Reference in New Issue