mirror of
https://bitbucket.org/wisemapping/wisemapping-frontend.git
synced 2024-11-15 11:37:57 +01:00
Fix clean up code.
This commit is contained in:
Paulo Gustavo Veiga
parent
f6deb58be5
commit
726d638fe8
@ -38,258 +38,256 @@ class Menu extends IMenu {
|
|||||||
const widgetsBaseUrl = `${baseUrl}css/widget`;
|
const widgetsBaseUrl = `${baseUrl}css/widget`;
|
||||||
|
|
||||||
// Create panels ...
|
// Create panels ...
|
||||||
|
|
||||||
const designerModel = designer.getModel();
|
const designerModel = designer.getModel();
|
||||||
const fontFamilyModel = {
|
const backTolist = $('#backToList');
|
||||||
getValue() {
|
backTolist.bind('click', (event) => {
|
||||||
const nodes = designerModel.filterSelectedTopics();
|
event.stopPropagation();
|
||||||
let result = null;
|
window.location.href = '/c/maps/';
|
||||||
for (let i = 0; i < nodes.length; i++) {
|
return false;
|
||||||
const fontFamily = nodes[i].getFontFamily();
|
});
|
||||||
if (result != null && result !== fontFamily) {
|
Menu._registerTooltip('backToList', $msg('BACK_TO_MAP_LIST'));
|
||||||
result = null;
|
|
||||||
break;
|
|
||||||
|
if (!readOnly) {
|
||||||
|
const fontFamilyModel = {
|
||||||
|
getValue() {
|
||||||
|
const nodes = designerModel.filterSelectedTopics();
|
||||||
|
let result = null;
|
||||||
|
for (let i = 0; i < nodes.length; i++) {
|
||||||
|
const fontFamily = nodes[i].getFontFamily();
|
||||||
|
if (result != null && result !== fontFamily) {
|
||||||
|
result = null;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
result = fontFamily;
|
||||||
}
|
}
|
||||||
result = fontFamily;
|
return result;
|
||||||
}
|
},
|
||||||
return result;
|
|
||||||
},
|
|
||||||
|
|
||||||
setValue(value: string) {
|
setValue(value: string) {
|
||||||
designer.changeFontFamily(value);
|
designer.changeFontFamily(value);
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
this._toolbarElems.push(new FontFamilyPanel('fontFamily', fontFamilyModel));
|
this._toolbarElems.push(new FontFamilyPanel('fontFamily', fontFamilyModel));
|
||||||
Menu._registerTooltip('fontFamily', $msg('FONT_FAMILY'));
|
Menu._registerTooltip('fontFamily', $msg('FONT_FAMILY'));
|
||||||
|
|
||||||
const fontSizeModel = {
|
const fontSizeModel = {
|
||||||
getValue(): number {
|
getValue(): number {
|
||||||
const nodes = designerModel.filterSelectedTopics();
|
const nodes = designerModel.filterSelectedTopics();
|
||||||
|
|
||||||
let result = null;
|
let result = null;
|
||||||
for (let i = 0; i < nodes.length; i++) {
|
for (let i = 0; i < nodes.length; i++) {
|
||||||
const fontSize = nodes[i].getFontSize();
|
const fontSize = nodes[i].getFontSize();
|
||||||
if (result != null && result !== fontSize) {
|
if (result != null && result !== fontSize) {
|
||||||
result = null;
|
result = null;
|
||||||
break;
|
break;
|
||||||
|
}
|
||||||
|
result = fontSize;
|
||||||
}
|
}
|
||||||
result = fontSize;
|
return result;
|
||||||
}
|
},
|
||||||
return result;
|
setValue(value: number) {
|
||||||
},
|
designer.changeFontSize(value);
|
||||||
setValue(value: number) {
|
},
|
||||||
designer.changeFontSize(value);
|
};
|
||||||
},
|
this._toolbarElems.push(new FontSizePanel('fontSize', fontSizeModel));
|
||||||
};
|
Menu._registerTooltip('fontSize', $msg('FONT_SIZE'));
|
||||||
this._toolbarElems.push(new FontSizePanel('fontSize', fontSizeModel));
|
|
||||||
Menu._registerTooltip('fontSize', $msg('FONT_SIZE'));
|
|
||||||
|
|
||||||
const topicShapeModel = {
|
const topicShapeModel = {
|
||||||
getValue() {
|
getValue() {
|
||||||
const nodes = designerModel.filterSelectedTopics();
|
const nodes = designerModel.filterSelectedTopics();
|
||||||
let result = null;
|
let result = null;
|
||||||
for (let i = 0; i < nodes.length; i++) {
|
for (let i = 0; i < nodes.length; i++) {
|
||||||
const shapeType = nodes[i].getShapeType();
|
const shapeType = nodes[i].getShapeType();
|
||||||
if (result != null && result !== shapeType) {
|
if (result != null && result !== shapeType) {
|
||||||
result = null;
|
result = null;
|
||||||
break;
|
break;
|
||||||
|
}
|
||||||
|
result = shapeType;
|
||||||
}
|
}
|
||||||
result = shapeType;
|
return result;
|
||||||
}
|
},
|
||||||
return result;
|
setValue(value: string) {
|
||||||
},
|
designer.changeTopicShape(value);
|
||||||
setValue(value: string) {
|
},
|
||||||
designer.changeTopicShape(value);
|
};
|
||||||
},
|
this._toolbarElems.push(new TopicShapePanel('topicShape', topicShapeModel));
|
||||||
};
|
Menu._registerTooltip('topicShape', $msg('TOPIC_SHAPE'));
|
||||||
this._toolbarElems.push(new TopicShapePanel('topicShape', topicShapeModel));
|
|
||||||
Menu._registerTooltip('topicShape', $msg('TOPIC_SHAPE'));
|
|
||||||
|
|
||||||
// Create icon panel dialog ...
|
// Create icon panel dialog ...
|
||||||
const topicIconModel = {
|
const topicIconModel = {
|
||||||
getValue() {
|
getValue() {
|
||||||
return null;
|
return null;
|
||||||
},
|
},
|
||||||
setValue(value: string) {
|
setValue(value: string) {
|
||||||
designer.addIconType(value);
|
designer.addIconType(value);
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
this._toolbarElems.push(new IconPanel('topicIcon', topicIconModel));
|
this._toolbarElems.push(new IconPanel('topicIcon', topicIconModel));
|
||||||
Menu._registerTooltip('topicIcon', $msg('TOPIC_ICON'));
|
Menu._registerTooltip('topicIcon', $msg('TOPIC_ICON'));
|
||||||
|
|
||||||
const topicColorModel = {
|
const topicColorModel = {
|
||||||
getValue() {
|
getValue() {
|
||||||
const nodes = designerModel.filterSelectedTopics();
|
const nodes = designerModel.filterSelectedTopics();
|
||||||
let result = null;
|
let result = null;
|
||||||
for (let i = 0; i < nodes.length; i++) {
|
for (let i = 0; i < nodes.length; i++) {
|
||||||
const color = nodes[i].getBackgroundColor();
|
const color = nodes[i].getBackgroundColor();
|
||||||
if (result != null && result !== color) {
|
if (result != null && result !== color) {
|
||||||
result = null;
|
result = null;
|
||||||
break;
|
break;
|
||||||
|
}
|
||||||
|
result = color;
|
||||||
}
|
}
|
||||||
result = color;
|
return result;
|
||||||
}
|
},
|
||||||
return result;
|
setValue(hex: string) {
|
||||||
},
|
designer.changeBackgroundColor(hex);
|
||||||
setValue(hex: string) {
|
},
|
||||||
designer.changeBackgroundColor(hex);
|
};
|
||||||
},
|
this._toolbarElems.push(new ColorPalettePanel('topicColor', topicColorModel, widgetsBaseUrl));
|
||||||
};
|
Menu._registerTooltip('topicColor', $msg('TOPIC_COLOR'));
|
||||||
this._toolbarElems.push(new ColorPalettePanel('topicColor', topicColorModel, widgetsBaseUrl));
|
|
||||||
Menu._registerTooltip('topicColor', $msg('TOPIC_COLOR'));
|
|
||||||
|
|
||||||
const borderColorModel = {
|
const borderColorModel = {
|
||||||
getValue() {
|
getValue() {
|
||||||
const nodes = designerModel.filterSelectedTopics();
|
const nodes = designerModel.filterSelectedTopics();
|
||||||
let result = null;
|
let result = null;
|
||||||
for (let i = 0; i < nodes.length; i++) {
|
for (let i = 0; i < nodes.length; i++) {
|
||||||
const color = nodes[i].getBorderColor();
|
const color = nodes[i].getBorderColor();
|
||||||
if (result != null && result !== color) {
|
if (result != null && result !== color) {
|
||||||
result = null;
|
result = null;
|
||||||
break;
|
break;
|
||||||
|
}
|
||||||
|
result = color;
|
||||||
}
|
}
|
||||||
result = color;
|
return result;
|
||||||
}
|
},
|
||||||
return result;
|
setValue(hex: string) {
|
||||||
},
|
designer.changeBorderColor(hex);
|
||||||
setValue(hex: string) {
|
},
|
||||||
designer.changeBorderColor(hex);
|
};
|
||||||
},
|
this._toolbarElems.push(new ColorPalettePanel('topicBorder', borderColorModel, widgetsBaseUrl));
|
||||||
};
|
Menu._registerTooltip('topicBorder', $msg('TOPIC_BORDER_COLOR'));
|
||||||
this._toolbarElems.push(new ColorPalettePanel('topicBorder', borderColorModel, widgetsBaseUrl));
|
|
||||||
Menu._registerTooltip('topicBorder', $msg('TOPIC_BORDER_COLOR'));
|
|
||||||
|
|
||||||
const fontColorModel = {
|
const fontColorModel = {
|
||||||
getValue() {
|
getValue() {
|
||||||
let result = null;
|
let result = null;
|
||||||
const nodes = designerModel.filterSelectedTopics();
|
const nodes = designerModel.filterSelectedTopics();
|
||||||
for (let i = 0; i < nodes.length; i++) {
|
for (let i = 0; i < nodes.length; i++) {
|
||||||
const color = nodes[i].getFontColor();
|
const color = nodes[i].getFontColor();
|
||||||
if (result != null && result !== color) {
|
if (result != null && result !== color) {
|
||||||
result = null;
|
result = null;
|
||||||
break;
|
break;
|
||||||
|
}
|
||||||
|
result = color;
|
||||||
}
|
}
|
||||||
result = color;
|
return result;
|
||||||
|
},
|
||||||
|
setValue(hex) {
|
||||||
|
designer.changeFontColor(hex);
|
||||||
|
},
|
||||||
|
};
|
||||||
|
this._toolbarElems.push(new ColorPalettePanel('fontColor', fontColorModel, baseUrl));
|
||||||
|
Menu._registerTooltip('fontColor', $msg('FONT_COLOR'));
|
||||||
|
|
||||||
|
const undoButton = this._addButton('undoEdition', false, false, () => {
|
||||||
|
designer.undo();
|
||||||
|
});
|
||||||
|
if (undoButton) {
|
||||||
|
undoButton.disable();
|
||||||
|
}
|
||||||
|
Menu._registerTooltip('undoEdition', $msg('UNDO'), 'meta+Z');
|
||||||
|
|
||||||
|
const redoButton = this._addButton('redoEdition', false, false, () => {
|
||||||
|
designer.redo();
|
||||||
|
});
|
||||||
|
if (redoButton) {
|
||||||
|
redoButton.disable();
|
||||||
|
}
|
||||||
|
Menu._registerTooltip('redoEdition', $msg('REDO'), 'meta+shift+Z');
|
||||||
|
|
||||||
|
if (redoButton && undoButton) {
|
||||||
|
designer.addEvent('modelUpdate', (event) => {
|
||||||
|
if (event.undoSteps > 0) {
|
||||||
|
undoButton.enable();
|
||||||
|
} else {
|
||||||
|
undoButton.disable();
|
||||||
|
}
|
||||||
|
if (event.redoSteps > 0) {
|
||||||
|
redoButton.enable();
|
||||||
|
} else {
|
||||||
|
redoButton.disable();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
this._addButton('addTopic', true, false, () => {
|
||||||
|
designer.createSiblingForSelectedNode();
|
||||||
|
});
|
||||||
|
Menu._registerTooltip('addTopic', $msg('ADD_TOPIC'), 'Enter');
|
||||||
|
|
||||||
|
this._addButton('deleteTopic', true, true, () => {
|
||||||
|
designer.deleteSelectedEntities();
|
||||||
|
});
|
||||||
|
Menu._registerTooltip('deleteTopic', $msg('TOPIC_DELETE'), 'Delete');
|
||||||
|
|
||||||
|
this._addButton('topicLink', true, false, () => {
|
||||||
|
designer.addLink();
|
||||||
|
});
|
||||||
|
Menu._registerTooltip('topicLink', $msg('TOPIC_LINK'));
|
||||||
|
|
||||||
|
this._addButton('topicRelation', true, false, (event) => {
|
||||||
|
designer.showRelPivot(event);
|
||||||
|
});
|
||||||
|
Menu._registerTooltip('topicRelation', $msg('TOPIC_RELATIONSHIP'));
|
||||||
|
|
||||||
|
this._addButton('topicNote', true, false, () => {
|
||||||
|
designer.addNote();
|
||||||
|
});
|
||||||
|
Menu._registerTooltip('topicNote', $msg('TOPIC_NOTE'));
|
||||||
|
|
||||||
|
this._addButton('fontBold', true, false, () => {
|
||||||
|
designer.changeFontWeight();
|
||||||
|
});
|
||||||
|
Menu._registerTooltip('fontBold', $msg('FONT_BOLD'), 'meta+B');
|
||||||
|
|
||||||
|
this._addButton('fontItalic', true, false, () => {
|
||||||
|
designer.changeFontStyle();
|
||||||
|
});
|
||||||
|
Menu._registerTooltip('fontItalic', $msg('FONT_ITALIC'), 'meta+I');
|
||||||
|
|
||||||
|
|
||||||
|
if (saveElem) {
|
||||||
|
this._addButton('save', false, false,
|
||||||
|
() => {
|
||||||
|
this.save(saveElem, designer, true);
|
||||||
|
});
|
||||||
|
Menu._registerTooltip('save', $msg('SAVE'), 'meta+S');
|
||||||
|
|
||||||
|
if (!readOnly) {
|
||||||
|
window.addEventListener('beforeunload', () => {
|
||||||
|
if (this.isSaveRequired()) {
|
||||||
|
this.save(saveElem, designer, false);
|
||||||
|
}
|
||||||
|
this.unlockMap(designer);
|
||||||
|
});
|
||||||
|
|
||||||
|
// Autosave on a fixed period of time ...
|
||||||
|
setInterval(
|
||||||
|
() => {
|
||||||
|
if (this.isSaveRequired()) {
|
||||||
|
this.save(saveElem, designer, false);
|
||||||
|
}
|
||||||
|
}, 10000,
|
||||||
|
);
|
||||||
}
|
}
|
||||||
return result;
|
}
|
||||||
},
|
}
|
||||||
setValue(hex) {
|
|
||||||
designer.changeFontColor(hex);
|
|
||||||
},
|
|
||||||
};
|
|
||||||
this._toolbarElems.push(new ColorPalettePanel('fontColor', fontColorModel, baseUrl));
|
|
||||||
Menu._registerTooltip('fontColor', $msg('FONT_COLOR'));
|
|
||||||
|
|
||||||
Menu._registerTooltip('export', $msg('EXPORT'));
|
Menu._registerTooltip('export', $msg('EXPORT'));
|
||||||
|
|
||||||
Menu._registerTooltip('print', $msg('PRINT'));
|
Menu._registerTooltip('print', $msg('PRINT'));
|
||||||
|
|
||||||
this._addButton('zoom-plus', false, false, () => {
|
|
||||||
designer.zoomIn();
|
|
||||||
});
|
|
||||||
Menu._registerTooltip('zoom-plus', $msg('ZOOM_IN'));
|
|
||||||
|
|
||||||
this._addButton('zoom-minus', false, false, () => {
|
|
||||||
designer.zoomOut();
|
|
||||||
});
|
|
||||||
Menu._registerTooltip('zoom-minus', $msg('ZOOM_OUT'));
|
|
||||||
|
|
||||||
this._addButton('position', false, false, () => {
|
|
||||||
designer.zoomToFit();
|
|
||||||
});
|
|
||||||
Menu._registerTooltip('position', $msg('CENTER_POSITION'));
|
|
||||||
|
|
||||||
const undoButton = this._addButton('undoEdition', false, false, () => {
|
|
||||||
designer.undo();
|
|
||||||
});
|
|
||||||
if (undoButton) {
|
|
||||||
undoButton.disable();
|
|
||||||
}
|
|
||||||
Menu._registerTooltip('undoEdition', $msg('UNDO'), 'meta+Z');
|
|
||||||
|
|
||||||
const redoButton = this._addButton('redoEdition', false, false, () => {
|
|
||||||
designer.redo();
|
|
||||||
});
|
|
||||||
if (redoButton) {
|
|
||||||
redoButton.disable();
|
|
||||||
}
|
|
||||||
Menu._registerTooltip('redoEdition', $msg('REDO'), 'meta+shift+Z');
|
|
||||||
|
|
||||||
if (redoButton && undoButton) {
|
|
||||||
designer.addEvent('modelUpdate', (event) => {
|
|
||||||
if (event.undoSteps > 0) {
|
|
||||||
undoButton.enable();
|
|
||||||
} else {
|
|
||||||
undoButton.disable();
|
|
||||||
}
|
|
||||||
if (event.redoSteps > 0) {
|
|
||||||
redoButton.enable();
|
|
||||||
} else {
|
|
||||||
redoButton.disable();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
this._addButton('addTopic', true, false, () => {
|
|
||||||
designer.createSiblingForSelectedNode();
|
|
||||||
});
|
|
||||||
Menu._registerTooltip('addTopic', $msg('ADD_TOPIC'), 'Enter');
|
|
||||||
|
|
||||||
this._addButton('deleteTopic', true, true, () => {
|
|
||||||
designer.deleteSelectedEntities();
|
|
||||||
});
|
|
||||||
Menu._registerTooltip('deleteTopic', $msg('TOPIC_DELETE'), 'Delete');
|
|
||||||
|
|
||||||
this._addButton('topicLink', true, false, () => {
|
|
||||||
designer.addLink();
|
|
||||||
});
|
|
||||||
Menu._registerTooltip('topicLink', $msg('TOPIC_LINK'));
|
|
||||||
|
|
||||||
this._addButton('topicRelation', true, false, (event) => {
|
|
||||||
designer.showRelPivot(event);
|
|
||||||
});
|
|
||||||
Menu._registerTooltip('topicRelation', $msg('TOPIC_RELATIONSHIP'));
|
|
||||||
|
|
||||||
this._addButton('topicNote', true, false, () => {
|
|
||||||
designer.addNote();
|
|
||||||
});
|
|
||||||
Menu._registerTooltip('topicNote', $msg('TOPIC_NOTE'));
|
|
||||||
|
|
||||||
this._addButton('fontBold', true, false, () => {
|
|
||||||
designer.changeFontWeight();
|
|
||||||
});
|
|
||||||
Menu._registerTooltip('fontBold', $msg('FONT_BOLD'), 'meta+B');
|
|
||||||
|
|
||||||
this._addButton('fontItalic', true, false, () => {
|
|
||||||
designer.changeFontStyle();
|
|
||||||
});
|
|
||||||
Menu._registerTooltip('fontItalic', $msg('FONT_ITALIC'), 'meta+I');
|
|
||||||
|
|
||||||
if (saveElem) {
|
|
||||||
this._addButton('save', false, false,
|
|
||||||
() => {
|
|
||||||
this.save(saveElem, designer, true);
|
|
||||||
});
|
|
||||||
Menu._registerTooltip('save', $msg('SAVE'), 'meta+S');
|
|
||||||
|
|
||||||
if (!readOnly) {
|
|
||||||
window.addEventListener('beforeunload', () => {
|
|
||||||
if (this.isSaveRequired()) {
|
|
||||||
this.save(saveElem, designer, false);
|
|
||||||
}
|
|
||||||
this.unlockMap(designer);
|
|
||||||
});
|
|
||||||
|
|
||||||
// Autosave on a fixed period of time ...
|
|
||||||
setInterval(
|
|
||||||
() => {
|
|
||||||
if (this.isSaveRequired()) {
|
|
||||||
this.save(saveElem, designer, false);
|
|
||||||
}
|
|
||||||
}, 10000,
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const shareElem = $('#shareIt');
|
const shareElem = $('#shareIt');
|
||||||
if (shareElem.length !== 0) {
|
if (shareElem.length !== 0) {
|
||||||
Menu._registerTooltip('shareIt', $msg('COLLABORATE'));
|
Menu._registerTooltip('shareIt', $msg('COLLABORATE'));
|
||||||
@ -316,14 +314,6 @@ class Menu extends IMenu {
|
|||||||
Menu._registerTooltip('keyboardShortcuts', $msg('KEYBOARD_SHOTCUTS'));
|
Menu._registerTooltip('keyboardShortcuts', $msg('KEYBOARD_SHOTCUTS'));
|
||||||
}
|
}
|
||||||
|
|
||||||
const backTolist = $('#backToList');
|
|
||||||
backTolist.bind('click', (event) => {
|
|
||||||
event.stopPropagation();
|
|
||||||
window.location.href = '/c/maps/';
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
Menu._registerTooltip('backToList', $msg('BACK_TO_MAP_LIST'));
|
|
||||||
|
|
||||||
// Account dialog ...
|
// Account dialog ...
|
||||||
const accountSettings = $('#account');
|
const accountSettings = $('#account');
|
||||||
if (accountSettings.length !== 0) {
|
if (accountSettings.length !== 0) {
|
||||||
|
|||||||
@ -55,63 +55,67 @@ export default function Toolbar({
|
|||||||
</ToolbarButton>
|
</ToolbarButton>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
<div id="edit" className="buttonContainer">
|
{(editorMode === 'edition-editor' || editorMode === 'edition-owner' || editorMode === 'showcase') && (
|
||||||
<ToolbarButton id="undoEdition" className="buttonOn">
|
<>
|
||||||
<img src={UndoSvg} />
|
<div id="edit" className="buttonContainer">
|
||||||
</ToolbarButton>
|
<ToolbarButton id="undoEdition" className="buttonOn">
|
||||||
<ToolbarButton id="redoEdition" className="buttonOn">
|
<img src={UndoSvg} />
|
||||||
<img src={RedoSvg} />
|
</ToolbarButton>
|
||||||
</ToolbarButton>
|
<ToolbarButton id="redoEdition" className="buttonOn">
|
||||||
</div>
|
<img src={RedoSvg} />
|
||||||
<div id="nodeStyle" className="buttonContainer">
|
</ToolbarButton>
|
||||||
<ToolbarButton id="addTopic" className="buttonOn">
|
</div>
|
||||||
<img src={TopicAddSvg} />
|
<div id="nodeStyle" className="buttonContainer">
|
||||||
</ToolbarButton>
|
<ToolbarButton id="addTopic" className="buttonOn">
|
||||||
<ToolbarButton id="deleteTopic" className="buttonOn">
|
<img src={TopicAddSvg} />
|
||||||
<img src={TopicDeleteSvg} />
|
</ToolbarButton>
|
||||||
</ToolbarButton>
|
<ToolbarButton id="deleteTopic" className="buttonOn">
|
||||||
<ToolbarButtonExt id="topicBorder" className="buttonExtOn">
|
<img src={TopicDeleteSvg} />
|
||||||
<img src={TopicBorderSvg} />
|
</ToolbarButton>
|
||||||
</ToolbarButtonExt>
|
<ToolbarButtonExt id="topicBorder" className="buttonExtOn">
|
||||||
<ToolbarButtonExt id="topicColor" className="buttonExtOn">
|
<img src={TopicBorderSvg} />
|
||||||
<img src={TopicColorSvg} />
|
</ToolbarButtonExt>
|
||||||
</ToolbarButtonExt>
|
<ToolbarButtonExt id="topicColor" className="buttonExtOn">
|
||||||
<ToolbarButtonExt id="topicShape" className="buttonExtOn">
|
<img src={TopicColorSvg} />
|
||||||
<img src={TopicShapeSvg} />
|
</ToolbarButtonExt>
|
||||||
</ToolbarButtonExt>
|
<ToolbarButtonExt id="topicShape" className="buttonExtOn">
|
||||||
</div>
|
<img src={TopicShapeSvg} />
|
||||||
<div id="font" className="buttonContainer">
|
</ToolbarButtonExt>
|
||||||
<ToolbarButton id="fontFamily" className="buttonOn">
|
</div>
|
||||||
<img src={FontTypeSvg} />
|
<div id="font" className="buttonContainer">
|
||||||
</ToolbarButton>
|
<ToolbarButton id="fontFamily" className="buttonOn">
|
||||||
<ToolbarButtonExt id="fontSize" className="buttonExtOn">
|
<img src={FontTypeSvg} />
|
||||||
<img src={FontSizeSvg} />
|
</ToolbarButton>
|
||||||
</ToolbarButtonExt>
|
<ToolbarButtonExt id="fontSize" className="buttonExtOn">
|
||||||
<ToolbarButton id="fontBold" className="buttonOn">
|
<img src={FontSizeSvg} />
|
||||||
<img src={FontBoldSvg} />
|
</ToolbarButtonExt>
|
||||||
</ToolbarButton>
|
<ToolbarButton id="fontBold" className="buttonOn">
|
||||||
<ToolbarButton id="fontItalic" className="buttonOn">
|
<img src={FontBoldSvg} />
|
||||||
<img src={FontItalicSvg} />
|
</ToolbarButton>
|
||||||
</ToolbarButton>
|
<ToolbarButton id="fontItalic" className="buttonOn">
|
||||||
<ToolbarButtonExt id="fontColor" className="buttonExtOn">
|
<img src={FontItalicSvg} />
|
||||||
<img src={FontColorSvg} />
|
</ToolbarButton>
|
||||||
</ToolbarButtonExt>
|
<ToolbarButtonExt id="fontColor" className="buttonExtOn">
|
||||||
</div>
|
<img src={FontColorSvg} />
|
||||||
<div id="nodeContent" className="buttonContainer">
|
</ToolbarButtonExt>
|
||||||
<ToolbarButtonExt id="topicIcon" className="buttonExtOn">
|
</div>
|
||||||
<img src={TopicIconSvg} />
|
<div id="nodeContent" className="buttonContainer">
|
||||||
</ToolbarButtonExt>
|
<ToolbarButtonExt id="topicIcon" className="buttonExtOn">
|
||||||
<ToolbarButton id="topicNote" className="buttonOn">
|
<img src={TopicIconSvg} />
|
||||||
<img src={TopicNoteSvg} />
|
</ToolbarButtonExt>
|
||||||
</ToolbarButton>
|
<ToolbarButton id="topicNote" className="buttonOn">
|
||||||
<ToolbarButton id="topicLink" className="buttonOn">
|
<img src={TopicNoteSvg} />
|
||||||
<img src={TopicLinkSvg} />
|
</ToolbarButton>
|
||||||
</ToolbarButton>
|
<ToolbarButton id="topicLink" className="buttonOn">
|
||||||
<ToolbarButton id="topicRelation" className="buttonOn">
|
<img src={TopicLinkSvg} />
|
||||||
<img src={TopicRelationSvg} />
|
</ToolbarButton>
|
||||||
</ToolbarButton>
|
<ToolbarButton id="topicRelation" className="buttonOn">
|
||||||
</div>
|
<img src={TopicRelationSvg} />
|
||||||
<div id="separator" className="buttonContainer"></div>
|
</ToolbarButton>
|
||||||
|
</div>
|
||||||
|
<div id="separator" className="buttonContainer"></div>
|
||||||
|
</>
|
||||||
|
)}
|
||||||
<ToolbarRightContainer>
|
<ToolbarRightContainer>
|
||||||
<ToolbarButton
|
<ToolbarButton
|
||||||
id="export"
|
id="export"
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user