Merged in bugfix/editor-toolbar (pull request #10)

Fixes for toolbar actions

* Fixes for toolbar actions
Remove unused dependency "add" (typo?)


Approved-by: Paulo Veiga
This commit is contained in:
Matias Arriola 2021-12-17 17:13:47 +00:00 committed by Paulo Veiga
parent b804403c42
commit 6c1b753f71
9 changed files with 41 additions and 29 deletions

1
.gitignore vendored
View File

@ -49,3 +49,4 @@ Thumbs.db
*.wmv
**/build/**/*
.vscode

View File

@ -32,7 +32,6 @@
"dependencies": {
"@wisemapping/core-js": "^0.0.1",
"@wisemapping/web2d": "^0.0.1",
"add": "^2.0.6",
"jest": "^27.4.3",
"jquery": "^3.6.0",
"lodash": "^4.17.21"

View File

@ -1,7 +1,9 @@
import { merge } from 'lodash';
class Options {
setOptions(...args) {
this.options = { ...this.options, ...args };
const { options } = this;
const options = merge({}, this.options, ...args);
this.options = options;
if (this.addEvent) {
for (const option in options) {

View File

@ -31,8 +31,8 @@ class INodeModel {
/** */
setId(id) {
$assert(Number.isFinite(id));
if ($defined(id) && id > INodeModel._uuid) {
$assert(Number.isFinite(id));
INodeModel._uuid = id;
}
if (!$defined(id)) {

View File

@ -19,12 +19,19 @@ import $ from 'jquery';
import { $assert, $defined } from '@wisemapping/core-js';
import ToolbarPaneItem from './ToolbarPaneItem';
// rgbToHex implementation from https://stackoverflow.com/a/3627747/58128
export const rgb2hex = (rgb) => `#${
rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/)
.slice(1)
.map((n) => parseInt(n, 10)
.toString(16).padStart(2, '0')).join('')}`;
class ColorPalettePanel extends ToolbarPaneItem {
constructor(buttonId, model, baseUrl) {
$assert($defined(baseUrl), 'baseUrl can not be null');
super(buttonId, model, true);
this._baseUrl = baseUrl;
super._init();
this._panelElem = super._init();
}
_load() {
@ -88,10 +95,10 @@ class ColorPalettePanel extends ToolbarPaneItem {
const colorCells = panelElem.find('div[class=palette-colorswatch]');
const model = this.getModel();
let modelValue = model.getValue();
colorCells.forEach((elem) => {
const color = $(elem).css('background-color').rgbToHex();
colorCells.each((index, elem) => {
const color = rgb2hex($(elem).css('background-color'));
if (modelValue != null && modelValue[0] === 'r') {
modelValue = modelValue.rgbToHex();
modelValue = rgb2hex(modelValue);
}
if (modelValue != null && modelValue.toUpperCase() === color.toUpperCase()) {

View File

@ -15,25 +15,27 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { merge } from 'lodash';
import Events from '../Events';
// const options = {
// animation: true,
// html: false,
// placement: 'right',
// selector: false,
// trigger: 'hover',
// title: '',
// content: '',
// delay: 0,
// container: false,
// destroyOnExit: false,
// };
const defaultOptions = {
animation: true,
html: false,
placement: 'right',
selector: false,
trigger: 'hover',
title: '',
content: '',
delay: 0,
container: false,
destroyOnExit: false,
};
class FloatingTip extends Events {
constructor(element, options) {
super(element, options);
this.setOptions(options);
const opts = { ...defaultOptions, ...options };
super(element, opts);
this.setOptions(opts);
this.element = element;
this._createPopover();
}
@ -62,8 +64,8 @@ class FloatingTip extends Events {
}
setOptions(...args) {
this.options = { ...this.options, ...args };
const { options } = this;
const options = merge({}, this.options, ...args);
this.options = options;
if (this.addEvent) {
for (const option in options) {

View File

@ -54,9 +54,9 @@ class IconPanel extends ToolbarPaneItem {
const panel = this;
const model = this.getModel();
img.on('click', ((event) => {
model.setValue($(this).attr('id'));
model.setValue($(event.target).attr('id'));
panel.hide();
}).bind(this));
}));
count += 1;
}

View File

@ -16,6 +16,7 @@
* limitations under the License.
*/
import $ from 'jquery';
import { $assert, $defined } from '@wisemapping/core-js';
import ToolbarPaneItem from './ToolbarPaneItem';
class ListToolbarPanel extends ToolbarPaneItem {
@ -39,7 +40,7 @@ class ListToolbarPanel extends ToolbarPaneItem {
const panelElem = this.getPanelElem();
const menuElems = panelElem.find('div');
const value = this.getModel().getValue();
menuElems.forEach((elem) => {
menuElems.each((index, elem) => {
const elemValue = $defined($(elem).attr('model')) ? $(elem).attr('model') : $(elem).attr('id');
$assert(elemValue, 'elemValue can not be null');
if (elemValue === value) $(elem).attr('class', 'toolbarPanelLinkSelectedLink');

View File

@ -76,7 +76,7 @@ class ToolbarPaneItem extends ToolbarItem {
if (!this.isVisible()) {
super.show();
this._tip.show();
this.getButtonElem().className = 'buttonExtActive';
this.getButtonElem().get(0).className = 'buttonExtActive';
}
}
@ -84,7 +84,7 @@ class ToolbarPaneItem extends ToolbarItem {
if (this.isVisible()) {
super.hide();
this._tip.hide();
this.getButtonElem().className = 'buttonExtOn';
this.getButtonElem().get(0).className = 'buttonExtOn';
}
}