mirror of
https://bitbucket.org/wisemapping/wisemapping-frontend.git
synced 2024-11-25 07:47:55 +01:00
Migrate messages
This commit is contained in:
Paulo Gustavo Veiga
parent
1110d94dcd
commit
cf8c7eb336
@ -5,9 +5,9 @@
|
||||
"editor.try-welcome-description": {
|
||||
"defaultMessage": "Melden Sie sich an, um kostenlos eine unbegrenzte Anzahl von Mindmaps zu erstellen, zu teilen und zu veröffentlichen."
|
||||
},
|
||||
"editor.try-welcome-mobile": {
|
||||
"defaultMessage": "Diese Edition zeigt einige der Mindmap-Funktionen!"
|
||||
},
|
||||
"editor.try-welcome-mobile": {
|
||||
"defaultMessage": "Diese Edition zeigt einige der Mindmap-Funktionen!"
|
||||
},
|
||||
"editor.try-welcome-description-mobile": {
|
||||
"defaultMessage": "Melden Sie sich an, um kostenlos eine unbegrenzte Anzahl von Mindmaps zu erstellen, zu teilen und zu veröffentlichen. Eingeschränkte Funktionen der Mindmap-Edition werden auf Mobilgeräten unterstützt. Verwenden Sie den Desktop-Browser für vollständige Editorfunktionen."
|
||||
},
|
||||
@ -79,5 +79,74 @@
|
||||
},
|
||||
"note.label": {
|
||||
"defaultMessage": "Notiz"
|
||||
}
|
||||
},
|
||||
"zoom-panel.tooltip-keyboard": {
|
||||
"defaultMessage": "Tastatürkürzel"
|
||||
},
|
||||
"zoom-panel.tooltip-zoom-in": {
|
||||
"defaultMessage": "Hineinzoomen"
|
||||
},
|
||||
"zoom-panel.tooltip-zoom-out": {
|
||||
"defaultMessage": "Rauszoomen"
|
||||
},
|
||||
"zoom-panel.tooltip-zoom-to-fit": {
|
||||
"defaultMessage": "Zoom zu passen"
|
||||
},
|
||||
"editor-panel.tooltip-add-icon": {
|
||||
"defaultMessage":"Symbol hinzufügen"
|
||||
},
|
||||
"editor-panel.tooltip-add-link": {
|
||||
"defaultMessage": "Link hinzufügen"
|
||||
},
|
||||
"editor-panel.tooltip-add-note": {
|
||||
"defaultMessage": "Notiz hinzufügen"
|
||||
},
|
||||
"editor-panel.tooltip-add-relationship": {
|
||||
"defaultMessage": "Beziehung hinzufügen"
|
||||
},
|
||||
"editor-panel.tooltip-add-topic": {
|
||||
"defaultMessage": "Thema hinzufügen"
|
||||
},
|
||||
"editor-panel.tooltip-delete-topic": {
|
||||
"defaultMessage": "Thema löschen"
|
||||
},
|
||||
"editor-panel.tooltip-topic-border-color": {
|
||||
"defaultMessage": "Randfarbe"
|
||||
},
|
||||
"editor-panel.tooltip-topic-fill-color": {
|
||||
"defaultMessage": "Füllfarbe"
|
||||
},
|
||||
"editor-panel.tooltip-topic-font-bigger": {
|
||||
"defaultMessage": "Größer"
|
||||
},
|
||||
"editor-panel.tooltip-topic-font-bold": {
|
||||
"defaultMessage": "Fett gedruckt"
|
||||
},
|
||||
"editor-panel.tooltip-topic-font-color": {
|
||||
"defaultMessage": "Farbe"
|
||||
},
|
||||
"editor-panel.tooltip-topic-font-italic": {
|
||||
"defaultMessage": "Kursiv"
|
||||
},
|
||||
"editor-panel.tooltip-topic-font-smaller": {
|
||||
"defaultMessage": "Kleiner"
|
||||
},
|
||||
"editor-panel.tooltip-topic-font-style": {
|
||||
"defaultMessage": "Schriftstil"
|
||||
},
|
||||
"editor-panel.tooltip-topic-share-ellipse": {
|
||||
"defaultMessage": "Ellipseform"
|
||||
},
|
||||
"editor-panel.tooltip-topic-share-line": {
|
||||
"defaultMessage": "Linienform"
|
||||
},
|
||||
"editor-panel.tooltip-topic-share-rectagle": {
|
||||
"defaultMessage": "Rechteckform"
|
||||
},
|
||||
"editor-panel.tooltip-topic-share-rounded": {
|
||||
"defaultMessage": "Abgerundete Form"
|
||||
},
|
||||
"editor-panel.tooltip-topic-style": {
|
||||
"defaultMessage": "Themenstil"
|
||||
},
|
||||
}
|
||||
@ -47,6 +47,63 @@
|
||||
"appbar.tooltip-undo": {
|
||||
"defaultMessage": "Undo"
|
||||
},
|
||||
"editor-panel.tooltip-add-icon": {
|
||||
"defaultMessage": "Add Icon"
|
||||
},
|
||||
"editor-panel.tooltip-add-link": {
|
||||
"defaultMessage": "Add Link"
|
||||
},
|
||||
"editor-panel.tooltip-add-note": {
|
||||
"defaultMessage": "Add Note"
|
||||
},
|
||||
"editor-panel.tooltip-add-relationship": {
|
||||
"defaultMessage": "Add Relationship"
|
||||
},
|
||||
"editor-panel.tooltip-add-topic": {
|
||||
"defaultMessage": "Add Topic"
|
||||
},
|
||||
"editor-panel.tooltip-delete-topic": {
|
||||
"defaultMessage": "Delete Topic"
|
||||
},
|
||||
"editor-panel.tooltip-topic-border-color": {
|
||||
"defaultMessage": "Border color"
|
||||
},
|
||||
"editor-panel.tooltip-topic-fill-color": {
|
||||
"defaultMessage": "Fill color"
|
||||
},
|
||||
"editor-panel.tooltip-topic-font-bigger": {
|
||||
"defaultMessage": "Bigger"
|
||||
},
|
||||
"editor-panel.tooltip-topic-font-bold": {
|
||||
"defaultMessage": "Bold"
|
||||
},
|
||||
"editor-panel.tooltip-topic-font-color": {
|
||||
"defaultMessage": "Color"
|
||||
},
|
||||
"editor-panel.tooltip-topic-font-italic": {
|
||||
"defaultMessage": "Italic"
|
||||
},
|
||||
"editor-panel.tooltip-topic-font-smaller": {
|
||||
"defaultMessage": "Smaller"
|
||||
},
|
||||
"editor-panel.tooltip-topic-font-style": {
|
||||
"defaultMessage": "Font Style"
|
||||
},
|
||||
"editor-panel.tooltip-topic-share-ellipse": {
|
||||
"defaultMessage": "Ellipse shape"
|
||||
},
|
||||
"editor-panel.tooltip-topic-share-line": {
|
||||
"defaultMessage": "Line shape"
|
||||
},
|
||||
"editor-panel.tooltip-topic-share-rectagle": {
|
||||
"defaultMessage": "Rectagle shape"
|
||||
},
|
||||
"editor-panel.tooltip-topic-share-rounded": {
|
||||
"defaultMessage": "Rounded shape"
|
||||
},
|
||||
"editor-panel.tooltip-topic-style": {
|
||||
"defaultMessage": "Topic Style"
|
||||
},
|
||||
"editor.edit-description-mobile": {
|
||||
"defaultMessage": "Limited mindmap edition capabilities are supported in Mobile devices. Use Desktop browser for full editor capabilities."
|
||||
},
|
||||
@ -73,5 +130,17 @@
|
||||
},
|
||||
"note.label": {
|
||||
"defaultMessage": "Note"
|
||||
},
|
||||
"zoom-panel.tooltip-keyboard": {
|
||||
"defaultMessage": "Keyboard Shortcuts"
|
||||
},
|
||||
"zoom-panel.tooltip-zoom-in": {
|
||||
"defaultMessage": "Zoom In"
|
||||
},
|
||||
"zoom-panel.tooltip-zoom-out": {
|
||||
"defaultMessage": "Zoom Out"
|
||||
},
|
||||
"zoom-panel.tooltip-zoom-to-fit": {
|
||||
"defaultMessage": "Zoom to Fit"
|
||||
}
|
||||
}
|
||||
|
||||
@ -5,9 +5,9 @@
|
||||
"editor.try-welcome-description": {
|
||||
"defaultMessage": "Registrate para comenzar a crear, compartir y publicar una cantidad ilimitada de mapas mentales de forma gratuita."
|
||||
},
|
||||
"editor.try-welcome-mobile": {
|
||||
"defaultMessage": "¡Este espacio de edición muestra algunas de las capacidades de mapas mentales!"
|
||||
},
|
||||
"editor.try-welcome-mobile": {
|
||||
"defaultMessage": "¡Este espacio de edición muestra algunas de las capacidades de mapas mentales!"
|
||||
},
|
||||
"editor.try-welcome-description-mobile": {
|
||||
"defaultMessage": "Registrate para comenzar a crear, compartir y publicar una cantidad ilimitada de mapas mentales de forma gratuita. En dispositivos móbiles las funciones son limitadas. Use la versión de escritorio para tener las funciones completas."
|
||||
},
|
||||
@ -73,5 +73,74 @@
|
||||
},
|
||||
"note.label": {
|
||||
"defaultMessage": "Nota"
|
||||
},
|
||||
"editor-panel.tooltip-add-icon": {
|
||||
"defaultMessage": "Agregar Icono"
|
||||
},
|
||||
"editor-panel.tooltip-add-link": {
|
||||
"defaultMessage": "Ajouter un lien"
|
||||
},
|
||||
"editor-panel.tooltip-add-note": {
|
||||
"defaultMessage": "Ajouter une note"
|
||||
},
|
||||
"editor-panel.tooltip-add-relationship": {
|
||||
"defaultMessage": "Ajouter une relation"
|
||||
},
|
||||
"editor-panel.tooltip-add-topic": {
|
||||
"defaultMessage": "Ajouter le sujet "
|
||||
},
|
||||
"editor-panel.tooltip-delete-topic": {
|
||||
"defaultMessage": "Supprimer le sujet"
|
||||
},
|
||||
"editor-panel.tooltip-topic-border-color": {
|
||||
"defaultMessage": "Couleur de bord"
|
||||
},
|
||||
"editor-panel.tooltip-topic-fill-color": {
|
||||
"defaultMessage": "Couleur de contenu"
|
||||
},
|
||||
"editor-panel.tooltip-topic-font-bigger": {
|
||||
"defaultMessage": "Plus gros"
|
||||
},
|
||||
"editor-panel.tooltip-topic-font-bold": {
|
||||
"defaultMessage": "Caractère gras"
|
||||
},
|
||||
"editor-panel.tooltip-topic-font-color": {
|
||||
"defaultMessage": "Couleur"
|
||||
},
|
||||
"editor-panel.tooltip-topic-font-italic": {
|
||||
"defaultMessage": "Italica"
|
||||
},
|
||||
"editor-panel.tooltip-topic-font-smaller": {
|
||||
"defaultMessage": "Petite"
|
||||
},
|
||||
"editor-panel.tooltip-topic-font-style": {
|
||||
"defaultMessage": "Le style de police"
|
||||
},
|
||||
"editor-panel.tooltip-topic-share-ellipse": {
|
||||
"defaultMessage": "Figure d'ellipse"
|
||||
},
|
||||
"editor-panel.tooltip-topic-share-line": {
|
||||
"defaultMessage": "Forme de ligne"
|
||||
},
|
||||
"editor-panel.tooltip-topic-share-rectagle": {
|
||||
"defaultMessage": "Forme Rectangulaire"
|
||||
},
|
||||
"editor-panel.tooltip-topic-share-rounded": {
|
||||
"defaultMessage": "Forme redonda"
|
||||
},
|
||||
"editor-panel.tooltip-topic-style": {
|
||||
"defaultMessage": "Style de sujet"
|
||||
},
|
||||
"zoom-panel.tooltip-keyboard": {
|
||||
"defaultMessage": "Raccourcis clavier"
|
||||
},
|
||||
"zoom-panel.tooltip-zoom-in": {
|
||||
"defaultMessage": "Agrandir"
|
||||
},
|
||||
"zoom-panel.tooltip-zoom-out": {
|
||||
"defaultMessage": "Dézoomer"
|
||||
},
|
||||
"zoom-panel.tooltip-zoom-to-fit": {
|
||||
"defaultMessage": "Centre"
|
||||
}
|
||||
}
|
||||
@ -73,5 +73,74 @@
|
||||
},
|
||||
"note.label": {
|
||||
"defaultMessage": "Noter"
|
||||
},
|
||||
"editor-panel.tooltip-add-icon": {
|
||||
"defaultMessage": "Agregar Icono"
|
||||
},
|
||||
"editor-panel.tooltip-add-link": {
|
||||
"defaultMessage": "Agregar Enlace"
|
||||
},
|
||||
"editor-panel.tooltip-add-note": {
|
||||
"defaultMessage": "Agregar Nota"
|
||||
},
|
||||
"editor-panel.tooltip-add-relationship": {
|
||||
"defaultMessage": "Agregar Relación"
|
||||
},
|
||||
"editor-panel.tooltip-add-topic": {
|
||||
"defaultMessage": "Agregar Topico"
|
||||
},
|
||||
"editor-panel.tooltip-delete-topic": {
|
||||
"defaultMessage": "Borrar Topico"
|
||||
},
|
||||
"editor-panel.tooltip-topic-border-color": {
|
||||
"defaultMessage": "Color del borde"
|
||||
},
|
||||
"editor-panel.tooltip-topic-fill-color": {
|
||||
"defaultMessage": "Color del cotenido"
|
||||
},
|
||||
"editor-panel.tooltip-topic-font-bigger": {
|
||||
"defaultMessage": "Grande"
|
||||
},
|
||||
"editor-panel.tooltip-topic-font-bold": {
|
||||
"defaultMessage": "Negrita"
|
||||
},
|
||||
"editor-panel.tooltip-topic-font-color": {
|
||||
"defaultMessage": "Color"
|
||||
},
|
||||
"editor-panel.tooltip-topic-font-italic": {
|
||||
"defaultMessage": "Italica"
|
||||
},
|
||||
"editor-panel.tooltip-topic-font-smaller": {
|
||||
"defaultMessage": "Pequeña"
|
||||
},
|
||||
"editor-panel.tooltip-topic-font-style": {
|
||||
"defaultMessage": "Estilo de Fuente"
|
||||
},
|
||||
"editor-panel.tooltip-topic-share-ellipse": {
|
||||
"defaultMessage": "Figura elipse"
|
||||
},
|
||||
"editor-panel.tooltip-topic-share-line": {
|
||||
"defaultMessage": "Figura linea"
|
||||
},
|
||||
"editor-panel.tooltip-topic-share-rectagle": {
|
||||
"defaultMessage": "Figura rectangulo"
|
||||
},
|
||||
"editor-panel.tooltip-topic-share-rounded": {
|
||||
"defaultMessage": "Figura redonda"
|
||||
},
|
||||
"editor-panel.tooltip-topic-style": {
|
||||
"defaultMessage": "Estilo de Topico"
|
||||
},
|
||||
"zoom-panel.tooltip-keyboard": {
|
||||
"defaultMessage": "Keyboard Shortcuts"
|
||||
},
|
||||
"zoom-panel.tooltip-zoom-in": {
|
||||
"defaultMessage": "Acercar"
|
||||
},
|
||||
"zoom-panel.tooltip-zoom-out": {
|
||||
"defaultMessage": "Alejarse"
|
||||
},
|
||||
"zoom-panel.tooltip-zoom-to-fit": {
|
||||
"defaultMessage": "Centrar"
|
||||
}
|
||||
}
|
||||
@ -25,9 +25,6 @@ import SettingsEthernetIcon from '@mui/icons-material/SettingsEthernet';
|
||||
import FormatItalicIcon from '@mui/icons-material/FormatItalic';
|
||||
import NoteOutlinedIcon from '@mui/icons-material/NoteOutlined';
|
||||
import LinkOutlinedIcon from '@mui/icons-material/LinkOutlined';
|
||||
import ZoomOutOutlinedIcon from '@mui/icons-material/ZoomOutOutlined';
|
||||
import ZoomInOutlinedIcon from '@mui/icons-material/ZoomInOutlined';
|
||||
import CenterFocusStrongOutlinedIcon from '@mui/icons-material/CenterFocusStrongOutlined';
|
||||
import SentimentSatisfiedAltIcon from '@mui/icons-material/SentimentSatisfiedAlt';
|
||||
import CircleOutlinedIcon from '@mui/icons-material/CircleOutlined';
|
||||
import SquareOutlinedIcon from '@mui/icons-material/SquareOutlined';
|
||||
@ -35,63 +32,69 @@ import CheckBoxOutlineBlankOutlinedIcon from '@mui/icons-material/CheckBoxOutlin
|
||||
import HorizontalRuleOutlinedIcon from '@mui/icons-material/HorizontalRuleOutlined';
|
||||
import RemoveCircleOutlineIcon from '@mui/icons-material/RemoveCircleOutline';
|
||||
import AddCircleOutlineOutlinedIcon from '@mui/icons-material/AddCircleOutlineOutlined';
|
||||
import Box from '@mui/material/Box';
|
||||
|
||||
import Palette from '@mui/icons-material/Square';
|
||||
import SquareOutlined from '@mui/icons-material/SquareOutlined';
|
||||
import { $msg } from '@wisemapping/mindplot';
|
||||
import ActionConfig from '../../classes/action/action-config';
|
||||
import { SwitchValueDirection } from './ToolbarValueModelBuilder';
|
||||
import NodePropertyValueModelBuilder from '../../classes/model/node-property-builder';
|
||||
import Typography from '@mui/material/Typography';
|
||||
import KeyboardOutlined from '@mui/icons-material/KeyboardOutlined';
|
||||
import ColorPicker from '../action-widget/pane/color-picker';
|
||||
import KeyboardShorcutsHelp from '../action-widget/pane/keyboard-shortcut-help';
|
||||
import TopicLink from '../action-widget/pane/topic-link';
|
||||
import TopicNote from '../action-widget/pane/topic-note';
|
||||
import IconPicker from '../action-widget/pane/icon-picker';
|
||||
import FontFamilySelector from '../action-widget/button/font-family-selector';
|
||||
import Capability from '../../classes/action/capability';
|
||||
import Editor from '../../classes/model/editor';
|
||||
import ActionConfig from '../../../classes/action/action-config';
|
||||
import { SwitchValueDirection } from '../../toolbar/ToolbarValueModelBuilder';
|
||||
import NodePropertyValueModelBuilder from '../../../classes/model/node-property-builder';
|
||||
import ColorPicker from '../../action-widget/pane/color-picker';
|
||||
import TopicLink from '../../action-widget/pane/topic-link';
|
||||
import TopicNote from '../../action-widget/pane/topic-note';
|
||||
import IconPicker from '../../action-widget/pane/icon-picker';
|
||||
import FontFamilySelector from '../../action-widget/button/font-family-selector';
|
||||
import Editor from '../../../classes/model/editor';
|
||||
import { useIntl } from 'react-intl';
|
||||
|
||||
const keyTooltip = (msg: string, key: string): string => {
|
||||
const isMac = window.navigator.platform.toUpperCase().indexOf('MAC') >= 0;
|
||||
return `${msg} (${isMac ? '⌘' : 'Ctrl'} + ${key})`;
|
||||
};
|
||||
|
||||
/**
|
||||
*
|
||||
* @param designer designer to aply changes
|
||||
* @returns configuration for @wisemapping/editor priAppbarmary toolbar
|
||||
*/
|
||||
export function buildEditorPanelConfig(model: Editor): ActionConfig[] {
|
||||
const toolbarValueModelBuilder = new NodePropertyValueModelBuilder(model.getDesigner());
|
||||
|
||||
/**
|
||||
* submenu to manipulate node color and shape
|
||||
*/
|
||||
const intl = useIntl();
|
||||
const colorAndShapeToolbarConfiguration: ActionConfig = {
|
||||
icon: <BrushOutlinedIcon />,
|
||||
|
||||
tooltip: $msg('TOPIC_SHAPE'),
|
||||
tooltip: intl.formatMessage({
|
||||
id: 'editor-panel.tooltip-topic-style',
|
||||
defaultMessage: 'Topic Style',
|
||||
}),
|
||||
options: [
|
||||
{
|
||||
icon: <SquareOutlinedIcon />,
|
||||
tooltip: $msg('TOPIC_SHAPE_RECTANGLE'),
|
||||
tooltip: intl.formatMessage({
|
||||
id: 'editor-panel.tooltip-topic-share-rectagle',
|
||||
defaultMessage: 'Rectagle shape',
|
||||
}),
|
||||
onClick: () => toolbarValueModelBuilder.getTopicShapeModel().setValue('rectagle'),
|
||||
selected: () => toolbarValueModelBuilder.getTopicShapeModel().getValue() === 'rectagle',
|
||||
},
|
||||
{
|
||||
icon: <CheckBoxOutlineBlankOutlinedIcon />,
|
||||
tooltip: $msg('TOPIC_SHAPE_ROUNDED'),
|
||||
tooltip: intl.formatMessage({
|
||||
id: 'editor-panel.tooltip-topic-share-rounded',
|
||||
defaultMessage: 'Rounded shape',
|
||||
}),
|
||||
onClick: () => toolbarValueModelBuilder.getTopicShapeModel().setValue('rounded rectagle'),
|
||||
selected: () =>
|
||||
toolbarValueModelBuilder.getTopicShapeModel().getValue() === 'rounded rectagle',
|
||||
},
|
||||
{
|
||||
icon: <HorizontalRuleOutlinedIcon />,
|
||||
tooltip: $msg('TOPIC_SHAPE_LINE'),
|
||||
tooltip: intl.formatMessage({
|
||||
id: 'editor-panel.tooltip-topic-share-line',
|
||||
defaultMessage: 'Line shape',
|
||||
}),
|
||||
onClick: () => toolbarValueModelBuilder.getTopicShapeModel().setValue('line'),
|
||||
selected: () => toolbarValueModelBuilder.getTopicShapeModel().getValue() === 'line',
|
||||
},
|
||||
{
|
||||
icon: <CircleOutlinedIcon />,
|
||||
tooltip: $msg('TOPIC_SHAPE_ELLIPSE'),
|
||||
tooltip: intl.formatMessage({
|
||||
id: 'editor-panel.tooltip-topic-share-ellipse',
|
||||
defaultMessage: 'Ellipse shape',
|
||||
}),
|
||||
onClick: () => toolbarValueModelBuilder.getTopicShapeModel().setValue('elipse'),
|
||||
selected: () => toolbarValueModelBuilder.getTopicShapeModel().getValue() === 'elipse',
|
||||
},
|
||||
@ -102,7 +105,10 @@ export function buildEditorPanelConfig(model: Editor): ActionConfig[] {
|
||||
htmlColor={toolbarValueModelBuilder.getSelectedTopicColorModel().getValue()}
|
||||
></Palette>
|
||||
),
|
||||
tooltip: $msg('TOPIC_COLOR'),
|
||||
tooltip: intl.formatMessage({
|
||||
id: 'editor-panel.tooltip-topic-fill-color',
|
||||
defaultMessage: 'Fill color',
|
||||
}),
|
||||
options: [
|
||||
{
|
||||
render: (closeModal) => {
|
||||
@ -122,7 +128,10 @@ export function buildEditorPanelConfig(model: Editor): ActionConfig[] {
|
||||
htmlColor={toolbarValueModelBuilder.getColorBorderModel().getValue()}
|
||||
></SquareOutlined>
|
||||
),
|
||||
tooltip: $msg('TOPIC_BORDER_COLOR'),
|
||||
tooltip: intl.formatMessage({
|
||||
id: 'editor-panel.tooltip-topic-border-color',
|
||||
defaultMessage: 'Border color',
|
||||
}),
|
||||
options: [
|
||||
{
|
||||
render: (closeModal) => {
|
||||
@ -145,7 +154,10 @@ export function buildEditorPanelConfig(model: Editor): ActionConfig[] {
|
||||
*/
|
||||
const fontFormatToolbarConfiguration: ActionConfig = {
|
||||
icon: <FontDownloadOutlinedIcon></FontDownloadOutlinedIcon>,
|
||||
tooltip: $msg('FONT_FORMAT'),
|
||||
tooltip: intl.formatMessage({
|
||||
id: 'editor-panel.tooltip-topic-font-style',
|
||||
defaultMessage: 'Font Style',
|
||||
}),
|
||||
options: [
|
||||
{
|
||||
render: () => (
|
||||
@ -155,26 +167,44 @@ export function buildEditorPanelConfig(model: Editor): ActionConfig[] {
|
||||
null,
|
||||
{
|
||||
icon: <TextIncreaseOutlinedIcon></TextIncreaseOutlinedIcon>,
|
||||
tooltip: $msg('FONT_INCREASE'),
|
||||
tooltip: intl.formatMessage({
|
||||
id: 'editor-panel.tooltip-topic-font-bigger',
|
||||
defaultMessage: 'Bigger',
|
||||
}),
|
||||
onClick: () =>
|
||||
toolbarValueModelBuilder.getFontSizeModel().switchValue(SwitchValueDirection.up),
|
||||
},
|
||||
{
|
||||
icon: <TextDecreaseOutlinedIcon></TextDecreaseOutlinedIcon>,
|
||||
tooltip: $msg('FONT_DECREASE'),
|
||||
tooltip: intl.formatMessage({
|
||||
id: 'editor-panel.tooltip-topic-font-smaller',
|
||||
defaultMessage: 'Smaller',
|
||||
}),
|
||||
onClick: () =>
|
||||
toolbarValueModelBuilder.getFontSizeModel().switchValue(SwitchValueDirection.down),
|
||||
},
|
||||
null,
|
||||
{
|
||||
icon: <FormatBoldOutlinedIcon></FormatBoldOutlinedIcon>,
|
||||
tooltip: $msg('FONT_BOLD') + ' (' + $msg('CTRL') + ' + B)',
|
||||
tooltip: keyTooltip(
|
||||
intl.formatMessage({
|
||||
id: 'editor-panel.tooltip-topic-font-bold',
|
||||
defaultMessage: 'Bold',
|
||||
}),
|
||||
'B',
|
||||
),
|
||||
onClick: toolbarValueModelBuilder.fontWeigthModel().switchValue,
|
||||
selected: () => toolbarValueModelBuilder.fontWeigthModel().getValue() === 'bold',
|
||||
},
|
||||
{
|
||||
icon: <FormatItalicIcon />,
|
||||
tooltip: $msg('FONT_ITALIC') + ' (' + $msg('CTRL') + ' + I)',
|
||||
tooltip: keyTooltip(
|
||||
intl.formatMessage({
|
||||
id: 'editor-panel.tooltip-topic-font-italic',
|
||||
defaultMessage: 'Italic',
|
||||
}),
|
||||
'I',
|
||||
),
|
||||
onClick: toolbarValueModelBuilder.getFontStyleModel().switchValue,
|
||||
selected: () => toolbarValueModelBuilder.getFontStyleModel().getValue() === 'italic',
|
||||
},
|
||||
@ -182,7 +212,10 @@ export function buildEditorPanelConfig(model: Editor): ActionConfig[] {
|
||||
icon: () => (
|
||||
<Palette htmlColor={toolbarValueModelBuilder.getFontColorModel().getValue()}></Palette>
|
||||
),
|
||||
tooltip: $msg('FONT_COLOR'),
|
||||
tooltip: intl.formatMessage({
|
||||
id: 'editor-panel.tooltip-topic-font-color',
|
||||
defaultMessage: 'Color',
|
||||
}),
|
||||
options: [
|
||||
{
|
||||
render: (closeModal) => {
|
||||
@ -205,7 +238,10 @@ export function buildEditorPanelConfig(model: Editor): ActionConfig[] {
|
||||
*/
|
||||
const addRelationConfiguration: ActionConfig = {
|
||||
icon: <SettingsEthernetIcon></SettingsEthernetIcon>,
|
||||
tooltip: $msg('TOPIC_RELATIONSHIP'),
|
||||
tooltip: intl.formatMessage({
|
||||
id: 'editor-panel.tooltip-add-relationship',
|
||||
defaultMessage: 'Add Relationship',
|
||||
}),
|
||||
onClick: (e) => {
|
||||
designer.showRelPivot(e);
|
||||
},
|
||||
@ -217,7 +253,10 @@ export function buildEditorPanelConfig(model: Editor): ActionConfig[] {
|
||||
*/
|
||||
const editLinkUrlConfiguration: ActionConfig = {
|
||||
icon: <LinkOutlinedIcon />,
|
||||
tooltip: $msg('TOPIC_LINK'),
|
||||
tooltip: keyTooltip(
|
||||
intl.formatMessage({ id: 'editor-panel.tooltip-add-link', defaultMessage: 'Add Link' }),
|
||||
'L',
|
||||
),
|
||||
useClickToClose: true,
|
||||
options: [
|
||||
{
|
||||
@ -237,7 +276,10 @@ export function buildEditorPanelConfig(model: Editor): ActionConfig[] {
|
||||
*/
|
||||
const editNoteConfiguration: ActionConfig = {
|
||||
icon: <NoteOutlinedIcon />,
|
||||
tooltip: $msg('TOPIC_NOTE'),
|
||||
tooltip: keyTooltip(
|
||||
intl.formatMessage({ id: 'editor-panel.tooltip-add-note', defaultMessage: 'Add Note' }),
|
||||
'K',
|
||||
),
|
||||
useClickToClose: true,
|
||||
options: [
|
||||
{
|
||||
@ -258,7 +300,10 @@ export function buildEditorPanelConfig(model: Editor): ActionConfig[] {
|
||||
*/
|
||||
const editIconConfiguration: ActionConfig = {
|
||||
icon: <SentimentSatisfiedAltIcon />,
|
||||
tooltip: $msg('TOPIC_ICON'),
|
||||
tooltip: intl.formatMessage({
|
||||
id: 'editor-panel.tooltip-add-icon',
|
||||
defaultMessage: 'Add Icon',
|
||||
}),
|
||||
options: [
|
||||
{
|
||||
tooltip: 'Node icon',
|
||||
@ -275,13 +320,19 @@ export function buildEditorPanelConfig(model: Editor): ActionConfig[] {
|
||||
|
||||
const addNodeToolbarConfiguration = {
|
||||
icon: <AddCircleOutlineOutlinedIcon />,
|
||||
tooltip: $msg('TOPIC_ADD'),
|
||||
tooltip:
|
||||
intl.formatMessage({ id: 'editor-panel.tooltip-add-topic', defaultMessage: 'Add Topic' }) +
|
||||
' (Enter)',
|
||||
onClick: () => designer.createSiblingForSelectedNode(),
|
||||
disabled: () => designer.getModel().filterSelectedTopics().length === 0,
|
||||
};
|
||||
const deleteNodeToolbarConfiguration = {
|
||||
icon: <RemoveCircleOutlineIcon />,
|
||||
tooltip: $msg('TOPIC_DELETE'),
|
||||
tooltip:
|
||||
intl.formatMessage({
|
||||
id: 'editor-panel.tooltip-delete-topic',
|
||||
defaultMessage: 'Delete Topic',
|
||||
}) + ' (Delete)',
|
||||
onClick: () => designer.deleteSelectedEntities(),
|
||||
disabled: () => designer.getModel().filterSelectedTopics().length === 0,
|
||||
};
|
||||
@ -296,56 +347,3 @@ export function buildEditorPanelConfig(model: Editor): ActionConfig[] {
|
||||
addRelationConfiguration,
|
||||
];
|
||||
}
|
||||
|
||||
export function buildZoomToolbarConfig(model: Editor, capability: Capability): ActionConfig[] {
|
||||
return [
|
||||
{
|
||||
icon: <CenterFocusStrongOutlinedIcon />,
|
||||
tooltip: $msg('CENTER_POSITION'),
|
||||
onClick: () => {
|
||||
model.getDesigner().zoomToFit();
|
||||
},
|
||||
disabled: () => !model?.isMapLoadded(),
|
||||
},
|
||||
{
|
||||
// zoom value candidate, neds to fixit
|
||||
render: () => (
|
||||
<Box sx={{ p: 0.5 }}>
|
||||
<Typography variant="overline" color="gray">
|
||||
%
|
||||
{!model?.isMapLoadded()
|
||||
? 100
|
||||
: Math.floor((1 / designer.getWorkSpace()?.getZoom()) * 100)}
|
||||
</Typography>
|
||||
</Box>
|
||||
),
|
||||
disabled: () => !model?.isMapLoadded(),
|
||||
},
|
||||
{
|
||||
icon: <ZoomInOutlinedIcon />,
|
||||
tooltip: $msg('ZOOM_IN'),
|
||||
onClick: () => {
|
||||
model.getDesigner().zoomIn();
|
||||
},
|
||||
disabled: () => !model?.isMapLoadded(),
|
||||
},
|
||||
{
|
||||
icon: <ZoomOutOutlinedIcon />,
|
||||
tooltip: $msg('ZOOM_OUT'),
|
||||
onClick: () => {
|
||||
model.getDesigner().zoomOut();
|
||||
},
|
||||
disabled: () => !model?.isMapLoadded(),
|
||||
},
|
||||
{
|
||||
icon: <KeyboardOutlined />,
|
||||
tooltip: $msg('KEYBOARD_SHOTCUTS'),
|
||||
visible: !capability.isHidden('keyboard-shortcuts'),
|
||||
options: [
|
||||
{
|
||||
render: () => <KeyboardShorcutsHelp />,
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
}
|
||||
@ -0,0 +1,39 @@
|
||||
/*
|
||||
* Copyright [2021] [wisemapping]
|
||||
*
|
||||
* Licensed under WiseMapping Public License, Version 1.0 (the "License").
|
||||
* It is basically the Apache License, Version 2.0 (the "License") plus the
|
||||
* "powered by wisemapping" text requirement on every single page;
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the license at
|
||||
*
|
||||
* http://www.wisemapping.org/license
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
import React from 'react';
|
||||
import ActionConfig from '../../../classes/action/action-config';
|
||||
import Capability from '../../../classes/action/capability';
|
||||
import Model from '../../../classes/model/editor';
|
||||
import Toolbar from '../../toolbar';
|
||||
import { buildEditorPanelConfig } from './configBuilder';
|
||||
|
||||
type EditorToolbarProps = {
|
||||
model: Model | undefined;
|
||||
capability: Capability;
|
||||
};
|
||||
|
||||
const EditorToolbar = ({ model, capability }: EditorToolbarProps) => {
|
||||
let config: ActionConfig[] | undefined;
|
||||
|
||||
if (!capability.isHidden('edition-toolbar') && model?.isMapLoadded()) {
|
||||
config = buildEditorPanelConfig(model);
|
||||
}
|
||||
|
||||
return <span>{config ? <Toolbar configurations={config} /> : <></>}</span>;
|
||||
};
|
||||
export default EditorToolbar;
|
||||
117
packages/editor/src/components/app-bar/zoom-panel/index.tsx
Normal file
117
packages/editor/src/components/app-bar/zoom-panel/index.tsx
Normal file
@ -0,0 +1,117 @@
|
||||
/*
|
||||
* Copyright [2021] [wisemapping]
|
||||
*
|
||||
* Licensed under WiseMapping Public License, Version 1.0 (the "License").
|
||||
* It is basically the Apache License, Version 2.0 (the "License") plus the
|
||||
* "powered by wisemapping" text requirement on every single page;
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the license at
|
||||
*
|
||||
* http://www.wisemapping.org/license
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
import KeyboardOutlined from '@mui/icons-material/KeyboardOutlined';
|
||||
import Typography from '@mui/material/Typography';
|
||||
import React from 'react';
|
||||
import { useIntl } from 'react-intl';
|
||||
import ActionConfig from '../../../classes/action/action-config';
|
||||
import Capability from '../../../classes/action/capability';
|
||||
import Editor from '../../../classes/model/editor';
|
||||
import Model from '../../../classes/model/editor';
|
||||
import KeyboardShorcutsHelp from '../../action-widget/pane/keyboard-shortcut-help';
|
||||
import Toolbar from '../../toolbar';
|
||||
import ZoomOutOutlinedIcon from '@mui/icons-material/ZoomOutOutlined';
|
||||
import ZoomInOutlinedIcon from '@mui/icons-material/ZoomInOutlined';
|
||||
import CenterFocusStrongOutlinedIcon from '@mui/icons-material/CenterFocusStrongOutlined';
|
||||
import Box from '@mui/material/Box';
|
||||
|
||||
export function buildZoomToolbarConfig(model: Editor, capability: Capability): ActionConfig[] {
|
||||
const intl = useIntl();
|
||||
|
||||
return [
|
||||
{
|
||||
icon: <CenterFocusStrongOutlinedIcon />,
|
||||
tooltip: intl.formatMessage({
|
||||
id: 'zoom-panel.tooltip-zoom-to-fit',
|
||||
defaultMessage: 'Zoom to Fit',
|
||||
}),
|
||||
onClick: () => {
|
||||
model.getDesigner().zoomToFit();
|
||||
},
|
||||
disabled: () => !model?.isMapLoadded(),
|
||||
},
|
||||
{
|
||||
// zoom value candidate, neds to fixit
|
||||
render: () => (
|
||||
<Box sx={{ p: 0.5 }}>
|
||||
<Typography variant="overline" color="gray">
|
||||
%
|
||||
{!model?.isMapLoadded()
|
||||
? 100
|
||||
: Math.floor((1 / designer.getWorkSpace()?.getZoom()) * 100)}
|
||||
</Typography>
|
||||
</Box>
|
||||
),
|
||||
disabled: () => !model?.isMapLoadded(),
|
||||
},
|
||||
{
|
||||
icon: <ZoomInOutlinedIcon />,
|
||||
tooltip: intl.formatMessage({ id: 'zoom-panel.tooltip-zoom-in', defaultMessage: 'Zoom In' }),
|
||||
onClick: () => {
|
||||
model.getDesigner().zoomIn();
|
||||
},
|
||||
disabled: () => !model?.isMapLoadded(),
|
||||
},
|
||||
{
|
||||
icon: <ZoomOutOutlinedIcon />,
|
||||
tooltip: intl.formatMessage({
|
||||
id: 'zoom-panel.tooltip-zoom-out',
|
||||
defaultMessage: 'Zoom Out',
|
||||
}),
|
||||
onClick: () => {
|
||||
model.getDesigner().zoomOut();
|
||||
},
|
||||
disabled: () => !model?.isMapLoadded(),
|
||||
},
|
||||
{
|
||||
icon: <KeyboardOutlined />,
|
||||
tooltip: intl.formatMessage({
|
||||
id: 'zoom-panel.tooltip-keyboard',
|
||||
defaultMessage: 'Keyboard Shortcuts',
|
||||
}),
|
||||
visible: !capability.isHidden('keyboard-shortcuts'),
|
||||
options: [
|
||||
{
|
||||
render: () => <KeyboardShorcutsHelp />,
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
type ZoomPanelProps = {
|
||||
model: Model | undefined;
|
||||
capability: Capability;
|
||||
};
|
||||
|
||||
const ZoomPanel = ({ model, capability }: ZoomPanelProps) => {
|
||||
const config = buildZoomToolbarConfig(model, capability);
|
||||
return (
|
||||
<Toolbar
|
||||
configurations={config}
|
||||
position={{
|
||||
position: {
|
||||
right: '7px',
|
||||
top: '93%',
|
||||
},
|
||||
vertical: false,
|
||||
}}
|
||||
/>
|
||||
);
|
||||
};
|
||||
export default ZoomPanel;
|
||||
@ -15,10 +15,9 @@
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
import React, { ErrorInfo, useCallback, useEffect, useState } from 'react';
|
||||
import React, { useCallback, useEffect, useState } from 'react';
|
||||
import Popover from '@mui/material/Popover';
|
||||
import Model from '../classes/model/editor';
|
||||
import { buildEditorPanelConfig, buildZoomToolbarConfig } from './toolbar/toolbarConfigBuilder';
|
||||
|
||||
import { IntlProvider } from 'react-intl';
|
||||
import {
|
||||
@ -30,7 +29,6 @@ import {
|
||||
} from '@wisemapping/mindplot';
|
||||
|
||||
import I18nMsg from '../classes/i18n-msg';
|
||||
import Toolbar from './toolbar';
|
||||
import { theme as defaultEditorTheme } from '../theme';
|
||||
import ThemeProvider from '@mui/material/styles/ThemeProvider';
|
||||
import { Theme } from '@mui/material/styles';
|
||||
@ -41,6 +39,8 @@ import AppBar from './app-bar';
|
||||
import Capability from '../classes/action/capability';
|
||||
import { ToolbarActionType } from './toolbar/ToolbarActionType';
|
||||
import MapInfo from '../classes/model/map-info';
|
||||
import EditorToolbar from './app-bar/editor-toolbar';
|
||||
import ZoomPanel from './app-bar/zoom-panel';
|
||||
|
||||
export type EditorOptions = {
|
||||
mode: EditorRenderMode;
|
||||
@ -67,6 +67,8 @@ const Editor = ({
|
||||
accountConfiguration,
|
||||
}: EditorProps) => {
|
||||
const [model, setModel] = useState<Model | undefined>();
|
||||
|
||||
// This is required to redraw in case of chansges in the canvas...
|
||||
const [canvasUpdate, setCanvasUpdate] = useState<number>();
|
||||
const editorTheme: Theme = theme ? theme : defaultEditorTheme;
|
||||
const [popoverOpen, popoverTarget, widgetManager] = DefaultWidgetManager.create();
|
||||
@ -115,20 +117,9 @@ const Editor = ({
|
||||
>
|
||||
{widgetManager.getEditorContent()}
|
||||
</Popover>
|
||||
{!capability.isHidden('edition-toolbar') && model?.isMapLoadded() && (
|
||||
<Toolbar configurations={buildEditorPanelConfig(model)} />
|
||||
)}
|
||||
|
||||
<Toolbar
|
||||
configurations={buildZoomToolbarConfig(model, capability)}
|
||||
position={{
|
||||
position: {
|
||||
right: '7px',
|
||||
top: '93%',
|
||||
},
|
||||
vertical: false,
|
||||
}}
|
||||
/>
|
||||
<EditorToolbar model={model} capability={capability} />
|
||||
<ZoomPanel model={model} capability={capability} />
|
||||
|
||||
<mindplot-component
|
||||
ref={mindplotRef}
|
||||
@ -138,7 +129,6 @@ const Editor = ({
|
||||
/>
|
||||
|
||||
<Notifier id="headerNotifier" />
|
||||
|
||||
<WarningDialog
|
||||
capability={capability}
|
||||
message={mapInfo.isLocked() ? mapInfo.getLockedMessage() : ''}
|
||||
|
||||
@ -1,51 +1,24 @@
|
||||
const EN = {
|
||||
SAVING: 'Saving ...',
|
||||
SAVE_COMPLETE: 'Save Complete',
|
||||
|
||||
ZOOM_IN: 'Zoom In',
|
||||
ZOOM_OUT: 'Zoom Out',
|
||||
TOPIC_SHAPE: 'Topic Shape',
|
||||
TOPIC_ADD: 'Add Topic',
|
||||
TOPIC_DELETE: 'Delete Topic',
|
||||
TOPIC_ICON: 'Add Icon',
|
||||
TOPIC_LINK: 'Add Link',
|
||||
TOPIC_RELATIONSHIP: 'Add Relationship',
|
||||
TOPIC_COLOR: 'Topic Color',
|
||||
TOPIC_BORDER_COLOR: 'Topic Border Color',
|
||||
TOPIC_NOTE: 'Add Note',
|
||||
TOPIC_SHAPE_RECTANGLE: 'Change Topic Shape to Rectangle',
|
||||
TOPIC_SHAPE_ROUNDED: 'Change Topic Shape to Rounded Corners Rectangle',
|
||||
TOPIC_SHAPE_ELLIPSE: 'Change Topic Shape to Ellipse',
|
||||
TOPIC_SHAPE_LINE: 'Change Topic Shape to Line',
|
||||
FONT_FAMILY: 'Font Type',
|
||||
FONT_SIZE: 'Text Size',
|
||||
FONT_BOLD: 'Text Bold',
|
||||
FONT_ITALIC: 'Text Italic',
|
||||
INSERT: 'Insert',
|
||||
ADD_TOPIC: 'Add Topic',
|
||||
LOADING: 'Loading ...',
|
||||
FONT_COLOR: 'Text Color',
|
||||
SAVE_COMPLETE: 'Save completed',
|
||||
ZOOM_IN_ERROR: 'Zoom too high.',
|
||||
ZOOM_ERROR: 'No more zoom can be applied.',
|
||||
ONLY_ONE_TOPIC_MUST_BE_SELECTED: 'Could not create a topic. Only one topic must be selected.',
|
||||
ONE_TOPIC_MUST_BE_SELECTED: 'Could not create a topic. One topic must be selected.',
|
||||
ONLY_ONE_TOPIC_MUST_BE_SELECTED_COLLAPSE: 'Children can not be collapsed. One topic must be selected.',
|
||||
SAVE_COULD_NOT_BE_COMPLETED: 'Save could not be completed, please try again latter.',
|
||||
UNEXPECTED_ERROR_LOADING: "We're sorry, an unexpected error has occurred.\nTry again reloading the editor.If the problem persists, contact us to support@wisemapping.com.",
|
||||
MAIN_TOPIC: 'Main Topic',
|
||||
SUB_TOPIC: 'Sub Topic',
|
||||
ISOLATED_TOPIC: 'Isolated Topic',
|
||||
CENTRAL_TOPIC: 'Central Topic',
|
||||
SHORTCUTS: 'Keyboard Shortcuts',
|
||||
ENTITIES_COULD_NOT_BE_DELETED: 'Could not delete topic or relation. At least one map entity must be selected.',
|
||||
AT_LEAST_ONE_TOPIC_MUST_BE_SELECTED: 'At least one topic must be selected.',
|
||||
CLIPBOARD_IS_EMPTY: 'Nothing to copy. Clipboard is empty.',
|
||||
CENTRAL_TOPIC_CAN_NOT_BE_DELETED: 'Central topic can not be deleted.',
|
||||
RELATIONSHIP_COULD_NOT_BE_CREATED: 'Relationship could not be created. A parent relationship topic must be selected first.',
|
||||
SELECTION_COPIED_TO_CLIPBOARD: 'Topics copied to the clipboard',
|
||||
WRITE_YOUR_TEXT_HERE: 'Write your note here ...',
|
||||
LINK: 'Link',
|
||||
SESSION_EXPIRED: 'Your session has expired, please log-in again.',
|
||||
|
||||
ACTION: 'Action',
|
||||
CREATE_SIBLING_TOPIC: 'Create Sibling Topic',
|
||||
CREATE_CHILD_TOPIC: 'Create Child Topic',
|
||||
@ -74,10 +47,8 @@ const EN = {
|
||||
MOUSE_CLICK: 'Mouse Click',
|
||||
K_DELETE: 'Delete',
|
||||
BACKSPACE: 'Backspace',
|
||||
CENTER_POSITION: 'Zoom To Fit',
|
||||
FONT_FORMAT: 'Font Format',
|
||||
FONT_INCREASE: 'Font Size Increase',
|
||||
FONT_DECREASE: 'Font Size Decrease',
|
||||
TOPIC_NOTE: 'Add Note',
|
||||
TOPIC_LINK: 'Add Link',
|
||||
};
|
||||
|
||||
export default EN;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user