zcy
/
maxGraph
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refactor!: remove helpers function processing string style (#173) 

Helper functions involving "style in the string form" have been removed
from `styleUtils`. Styles are defined using the `CellStateStyle` and it
is no longer necessary to process strings.

Removed functions
  - addStylename
  - getStylename
  - getStylenames
  - indexOfStylename
  - removeStylename
  - removeAllStylenames
  - setStyle

**BREAKING CHANGES**: some `styleUtils` functions have been removed.
development
Thomas Bouffard 2023-01-17 12:18:33 +01:00 committed by GitHub
parent 6fc05a3876
commit 5ecfda6b2b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 15 additions and 199 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
CHANGELOG.md
View File

@ -2,7 +2,9 @@
## UNRELEASED
N/A
**Breaking Changes**:
- helper functions involving _style in the string form_ have been removed from `styleUtils`. Styles are defined using the `CellStateStyle` and it is no longer necessary to process strings
## 0.1.0

161
packages/core/src/util/styleUtils.ts
View File

@ -315,118 +315,6 @@ export const convertPoint = (container: HTMLElement, x: number, y: number) => {
return new Point(x - offset.x, y - offset.y);
};
/**
* Returns the stylename in a style of the form [(stylename|key=value);] or
* an empty string if the given style does not contain a stylename.
*
* @param style String of the form [(stylename|key=value);].
*/
export const getStylename = (style: string) => {
const pairs = style.split(';');
const stylename = pairs[0];
if (stylename.indexOf('=') < 0) {
return stylename;
}
return '';
};
/**
* Returns the stylenames in a style of the form [(stylename|key=value);]
* or an empty array if the given style does not contain any stylenames.
*
* @param style String of the form [(stylename|key=value);].
*/
export const getStylenames = (style: string) => {
const result = [];
const pairs = style.split(';');
for (let i = 0; i < pairs.length; i += 1) {
if (pairs[i].indexOf('=') < 0) {
result.push(pairs[i]);
}
}
return result;
};
/**
* Returns the index of the given stylename in the given style. This
* returns -1 if the given stylename does not occur (as a stylename) in the
* given style, otherwise it returns the index of the first character.
*/
export const indexOfStylename = (style: string, stylename: string) => {
const tokens = style.split(';');
let pos = 0;
for (let i = 0; i < tokens.length; i += 1) {
if (tokens[i] == stylename) {
return pos;
}
pos += tokens[i].length + 1;
}
return -1;
};
/**
* Adds the specified stylename to the given style if it does not already
* contain the stylename.
*/
export const addStylename = (style: string, stylename: string) => {
if (indexOfStylename(style, stylename) < 0) {
if (style == null) {
style = '';
} else if (style.length > 0 && style.charAt(style.length - 1) != ';') {
style += ';';
}
style += stylename;
}
return style;
};
/**
* Removes all occurrences of the specified stylename in the given style
* and returns the updated style. Trailing semicolons are not preserved.
*/
export const removeStylename = (style: string, stylename: string) => {
const result = [];
const tokens = style.split(';');
for (let i = 0; i < tokens.length; i += 1) {
if (tokens[i] != stylename) {
result.push(tokens[i]);
}
}
return result.join(';');
};
/**
* Removes all stylenames from the given style and returns the updated
* style.
*/
export const removeAllStylenames = (style: string) => {
const result = [];
const tokens = style.split(';');
for (let i = 0; i < tokens.length; i += 1) {
// Keeps the key, value assignments
if (tokens[i].indexOf('=') >= 0) {
result.push(tokens[i]);
}
}
return result.join(';');
};
/**
* Assigns the value for the given key in the styles of the given cells, or
* removes the key from the styles if the value is null.
@ -461,55 +349,6 @@ export const setCellStyles = (
}
};
/**
* Adds or removes the given key, value pair to the style and returns the
* new style. If value is null or zero length then the key is removed from
* the style. This is for cell styles, not for CSS styles.
*
* @param style String of the form [(stylename|key=value);].
* @param key Key of the style to be changed.
* @param value New value for the given key.
*/
export const setStyle = (style: string | null, key: string, value: any) => {
const isValue =
value != null && (typeof value.length === 'undefined' || value.length > 0);
if (style == null || style.length == 0) {
if (isValue) {
style = `${key}=${value};`;
}
} else if (style.substring(0, key.length + 1) == `${key}=`) {
const next = style.indexOf(';');
if (isValue) {
style = `${key}=${value}${next < 0 ? ';' : style.substring(next)}`;
} else {
style = next < 0 || next == style.length - 1 ? '' : style.substring(next + 1);
}
} else {
const index = style.indexOf(`;${key}=`);
if (index < 0) {
if (isValue) {
const sep = style.charAt(style.length - 1) == ';' ? '' : ';';
style = `${style + sep + key}=${value};`;
}
} else {
const next = style.indexOf(';', index + 1);
if (isValue) {
style = `${style.substring(0, index + 1) + key}=${value}${
next < 0 ? ';' : style.substring(next)
}`;
} else {
style = style.substring(0, index) + (next < 0 ? ';' : style.substring(next));
}
}
}
return style;
};
/**
* Sets or toggles the flag bit for the given key in the cell's styles.
* If value is null then the flag is toggled.

49
packages/core/src/view/style/Stylesheet.ts
View File

@ -31,53 +31,28 @@ import Codec from '../../serialization/Codec';
import type { CellStateStyle, CellStyle } from '../../types';
/**
* @class Stylesheet
* Defines the appearance of the cells in a graph. See {@link putCellStyle} for an example
* of creating a new cell style.
*
* Defines the appearance of the cells in a graph. See {@link putCellStyle} for an
* example of creating a new cell style. It is recommended to use objects, not
* arrays for holding cell styles. Existing styles can be cloned using
* {@link clone} and turned into a string for debugging using
* {@link toString}.
* Existing styles can be cloned using {@link clone} and turned into a string for debugging
* using {@link toString}.
*
* ### Default Styles
*
* The stylesheet contains two built-in styles, which are used if no style is
* defined for a cell:
* The stylesheet contains two built-in styles, which are used if no style is defined for
* a cell:
*
* - defaultVertex Default style for vertices
* - defaultEdge Default style for edges
* - `defaultVertex`: default style for vertices
* - `defaultEdge`: default style for edges
*
* ### Example
*
* ```javascript
* var vertexStyle = stylesheet.getDefaultVertexStyle();
* vertexStyle.rounded = true;
* var edgeStyle = stylesheet.getDefaultEdgeStyle();
* edgeStyle.edge = mxEdgeStyle.EntityRelation;
* const defaultVertexStyle = stylesheet.getDefaultVertexStyle();
* defaultVertexStyle.rounded = true;
* const defaultEdgeStyle = stylesheet.getDefaultEdgeStyle();
* defaultEdgeStyle.edgeStyle = EdgeStyle.EntityRelation;
* ```
*
* Modifies the built-in default styles.
*
* To avoid the default style for a cell, add a leading semicolon
* to the style definition, eg.
*
* ```javascript
* ;shadow=1
* ```
*
* ### Removing keys
*
* For removing a key in a cell style of the form [stylename;|key=value;] the
* special value none can be used, eg. highlight;fillColor=none
*
* See also the helper methods in mxUtils to modify strings of this format,
* namely {@link setStyle}, {@link indexOfStylename},
* {@link addStylename}, {@link removeStylename},
* {@link removeAllStylenames} and {@link setStyleFlag}.
*
* Constructor: mxStylesheet
*
* Constructs a new stylesheet and assigns default styles.
*/
export class Stylesheet {
constructor() {