mirror of
https://bitbucket.org/wisemapping/wisemapping-frontend.git
synced 2024-11-21 22:27:56 +01:00
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:
parent
b804403c42
commit
6c1b753f71
1
.gitignore
vendored
1
.gitignore
vendored
@ -49,3 +49,4 @@ Thumbs.db
|
|||||||
*.wmv
|
*.wmv
|
||||||
|
|
||||||
**/build/**/*
|
**/build/**/*
|
||||||
|
.vscode
|
@ -32,7 +32,6 @@
|
|||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@wisemapping/core-js": "^0.0.1",
|
"@wisemapping/core-js": "^0.0.1",
|
||||||
"@wisemapping/web2d": "^0.0.1",
|
"@wisemapping/web2d": "^0.0.1",
|
||||||
"add": "^2.0.6",
|
|
||||||
"jest": "^27.4.3",
|
"jest": "^27.4.3",
|
||||||
"jquery": "^3.6.0",
|
"jquery": "^3.6.0",
|
||||||
"lodash": "^4.17.21"
|
"lodash": "^4.17.21"
|
||||||
|
@ -1,7 +1,9 @@
|
|||||||
|
import { merge } from 'lodash';
|
||||||
|
|
||||||
class Options {
|
class Options {
|
||||||
setOptions(...args) {
|
setOptions(...args) {
|
||||||
this.options = { ...this.options, ...args };
|
const options = merge({}, this.options, ...args);
|
||||||
const { options } = this;
|
this.options = options;
|
||||||
|
|
||||||
if (this.addEvent) {
|
if (this.addEvent) {
|
||||||
for (const option in options) {
|
for (const option in options) {
|
||||||
|
@ -31,8 +31,8 @@ class INodeModel {
|
|||||||
|
|
||||||
/** */
|
/** */
|
||||||
setId(id) {
|
setId(id) {
|
||||||
$assert(Number.isFinite(id));
|
|
||||||
if ($defined(id) && id > INodeModel._uuid) {
|
if ($defined(id) && id > INodeModel._uuid) {
|
||||||
|
$assert(Number.isFinite(id));
|
||||||
INodeModel._uuid = id;
|
INodeModel._uuid = id;
|
||||||
}
|
}
|
||||||
if (!$defined(id)) {
|
if (!$defined(id)) {
|
||||||
|
@ -19,12 +19,19 @@ import $ from 'jquery';
|
|||||||
import { $assert, $defined } from '@wisemapping/core-js';
|
import { $assert, $defined } from '@wisemapping/core-js';
|
||||||
import ToolbarPaneItem from './ToolbarPaneItem';
|
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 {
|
class ColorPalettePanel extends ToolbarPaneItem {
|
||||||
constructor(buttonId, model, baseUrl) {
|
constructor(buttonId, model, baseUrl) {
|
||||||
$assert($defined(baseUrl), 'baseUrl can not be null');
|
$assert($defined(baseUrl), 'baseUrl can not be null');
|
||||||
super(buttonId, model, true);
|
super(buttonId, model, true);
|
||||||
this._baseUrl = baseUrl;
|
this._baseUrl = baseUrl;
|
||||||
super._init();
|
this._panelElem = super._init();
|
||||||
}
|
}
|
||||||
|
|
||||||
_load() {
|
_load() {
|
||||||
@ -88,10 +95,10 @@ class ColorPalettePanel extends ToolbarPaneItem {
|
|||||||
const colorCells = panelElem.find('div[class=palette-colorswatch]');
|
const colorCells = panelElem.find('div[class=palette-colorswatch]');
|
||||||
const model = this.getModel();
|
const model = this.getModel();
|
||||||
let modelValue = model.getValue();
|
let modelValue = model.getValue();
|
||||||
colorCells.forEach((elem) => {
|
colorCells.each((index, elem) => {
|
||||||
const color = $(elem).css('background-color').rgbToHex();
|
const color = rgb2hex($(elem).css('background-color'));
|
||||||
if (modelValue != null && modelValue[0] === 'r') {
|
if (modelValue != null && modelValue[0] === 'r') {
|
||||||
modelValue = modelValue.rgbToHex();
|
modelValue = rgb2hex(modelValue);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (modelValue != null && modelValue.toUpperCase() === color.toUpperCase()) {
|
if (modelValue != null && modelValue.toUpperCase() === color.toUpperCase()) {
|
||||||
|
@ -15,25 +15,27 @@
|
|||||||
* See the License for the specific language governing permissions and
|
* See the License for the specific language governing permissions and
|
||||||
* limitations under the License.
|
* limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
import { merge } from 'lodash';
|
||||||
import Events from '../Events';
|
import Events from '../Events';
|
||||||
|
|
||||||
// const options = {
|
const defaultOptions = {
|
||||||
// animation: true,
|
animation: true,
|
||||||
// html: false,
|
html: false,
|
||||||
// placement: 'right',
|
placement: 'right',
|
||||||
// selector: false,
|
selector: false,
|
||||||
// trigger: 'hover',
|
trigger: 'hover',
|
||||||
// title: '',
|
title: '',
|
||||||
// content: '',
|
content: '',
|
||||||
// delay: 0,
|
delay: 0,
|
||||||
// container: false,
|
container: false,
|
||||||
// destroyOnExit: false,
|
destroyOnExit: false,
|
||||||
// };
|
};
|
||||||
|
|
||||||
class FloatingTip extends Events {
|
class FloatingTip extends Events {
|
||||||
constructor(element, options) {
|
constructor(element, options) {
|
||||||
super(element, options);
|
const opts = { ...defaultOptions, ...options };
|
||||||
this.setOptions(options);
|
super(element, opts);
|
||||||
|
this.setOptions(opts);
|
||||||
this.element = element;
|
this.element = element;
|
||||||
this._createPopover();
|
this._createPopover();
|
||||||
}
|
}
|
||||||
@ -62,8 +64,8 @@ class FloatingTip extends Events {
|
|||||||
}
|
}
|
||||||
|
|
||||||
setOptions(...args) {
|
setOptions(...args) {
|
||||||
this.options = { ...this.options, ...args };
|
const options = merge({}, this.options, ...args);
|
||||||
const { options } = this;
|
this.options = options;
|
||||||
|
|
||||||
if (this.addEvent) {
|
if (this.addEvent) {
|
||||||
for (const option in options) {
|
for (const option in options) {
|
||||||
|
@ -54,9 +54,9 @@ class IconPanel extends ToolbarPaneItem {
|
|||||||
const panel = this;
|
const panel = this;
|
||||||
const model = this.getModel();
|
const model = this.getModel();
|
||||||
img.on('click', ((event) => {
|
img.on('click', ((event) => {
|
||||||
model.setValue($(this).attr('id'));
|
model.setValue($(event.target).attr('id'));
|
||||||
panel.hide();
|
panel.hide();
|
||||||
}).bind(this));
|
}));
|
||||||
|
|
||||||
count += 1;
|
count += 1;
|
||||||
}
|
}
|
||||||
|
@ -16,6 +16,7 @@
|
|||||||
* limitations under the License.
|
* limitations under the License.
|
||||||
*/
|
*/
|
||||||
import $ from 'jquery';
|
import $ from 'jquery';
|
||||||
|
import { $assert, $defined } from '@wisemapping/core-js';
|
||||||
import ToolbarPaneItem from './ToolbarPaneItem';
|
import ToolbarPaneItem from './ToolbarPaneItem';
|
||||||
|
|
||||||
class ListToolbarPanel extends ToolbarPaneItem {
|
class ListToolbarPanel extends ToolbarPaneItem {
|
||||||
@ -39,7 +40,7 @@ class ListToolbarPanel extends ToolbarPaneItem {
|
|||||||
const panelElem = this.getPanelElem();
|
const panelElem = this.getPanelElem();
|
||||||
const menuElems = panelElem.find('div');
|
const menuElems = panelElem.find('div');
|
||||||
const value = this.getModel().getValue();
|
const value = this.getModel().getValue();
|
||||||
menuElems.forEach((elem) => {
|
menuElems.each((index, elem) => {
|
||||||
const elemValue = $defined($(elem).attr('model')) ? $(elem).attr('model') : $(elem).attr('id');
|
const elemValue = $defined($(elem).attr('model')) ? $(elem).attr('model') : $(elem).attr('id');
|
||||||
$assert(elemValue, 'elemValue can not be null');
|
$assert(elemValue, 'elemValue can not be null');
|
||||||
if (elemValue === value) $(elem).attr('class', 'toolbarPanelLinkSelectedLink');
|
if (elemValue === value) $(elem).attr('class', 'toolbarPanelLinkSelectedLink');
|
||||||
|
@ -76,7 +76,7 @@ class ToolbarPaneItem extends ToolbarItem {
|
|||||||
if (!this.isVisible()) {
|
if (!this.isVisible()) {
|
||||||
super.show();
|
super.show();
|
||||||
this._tip.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()) {
|
if (this.isVisible()) {
|
||||||
super.hide();
|
super.hide();
|
||||||
this._tip.hide();
|
this._tip.hide();
|
||||||
this.getButtonElem().className = 'buttonExtOn';
|
this.getButtonElem().get(0).className = 'buttonExtOn';
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user