Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Add support for multilines labels #781

Closed
4 tasks done
Gelio opened this issue Oct 17, 2021 · 2 comments · Fixed by #1087
Closed
4 tasks done

Add support for multilines labels #781

Gelio opened this issue Oct 17, 2021 · 2 comments · Fixed by #1087
Assignees
@lfasani
Labels
difficulty: medium package: diagrams type: enhancement
Milestone
2022.3.0

Comments

@Gelio
Copy link

Gelio commented Oct 17, 2021

  • I have checked that this bug has not yet been reported by someone else
  • I have checked that this bug appears on Chrome
  • I have specified the version :
  • other: 0.4.6
  • I have specified my environment :
  • Ubuntu 20.04 LTS

Screenshots

Sirius Desktop
image

Sirius Web (a long single line label)
image

Steps to reproduce

In the Label Expression for a node, add a newline

image

Expected behavior

The newline makes the rest of the text appear on a new line

Actual behavior

The text appears on a single line. The newline is turned into a space.
@pcdavid
Copy link
Member

pcdavid commented Oct 22, 2021

It looks like Sprotty might support this since 0.8.0 via eclipse-sprotty/sprotty#171
See also eclipse-elk/elk#476. Maybe we'll ask @lredor for his ELK expertise :-)

@sbegaudeau sbegaudeau changed the title Newlines in the label are changed to spaces Add support for multilines labels Jan 19, 2022
@sbegaudeau sbegaudeau added this to the 2022.03.0 milestone Jan 21, 2022
@pcdavid pcdavid pinned this issue Feb 2, 2022
@pcdavid pcdavid unpinned this issue Feb 10, 2022
@pcdavid pcdavid removed their assignment Feb 14, 2022
@lfasani
Copy link
Contributor

lfasani commented Feb 24, 2022 •
edited
Loading

Specification

Model

The model owns somewhere an entity with an attribute of type string. There is currently not the information about if the string is mono or multiline.
So let's consider that or line return is serialized with \n
The end-user '\n' string will be serialized escaped with '\n'

Representation

Every representation of a string attribute should manage the mono or multiline information based on th \n character

Form representation

By default, the form representation represents a string with a textField. But a string could also be represented by a textArea

The textField will display \n with \n and \\n with \\n

The textArea will display \n with a carriage return and \\n with \n

Sprotty

The label will display \n with a carriage return and \\n with \n
Idem when editing the text

As a second step, we could configure a maximum text length for the label display. That means that if the label is longer than the maximum length, a line is cut and returned as many times to comply with the maximum length

backend layout

The ELK and incremental layout should adapt to mange the fact the a label can be displayed on many lines.
The is necessary so that the parent node have the right size and so that the children nodes will not overlap the parent node label

lfasani added a commit that referenced this issue Mar 4, 2022
@lfasani
[781] Update the way the centered node label position is done
c54871c 
The changes are about the node label center position.
There is in fact no visible change but there are technical changes to
prepare the following commits when we will have a label on many lines:
* the label position given by the server is the horizontal center of the
node instead of the left position of the label
* consequently the LabelView is updated to display the text with
'text-anchor': 'middle' instead of the default 'text-anchor': 'start'

Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
lfasani added a commit that referenced this issue Mar 4, 2022
@lfasani
[781] Use Text area for default form representation
600adf7 
It will allow multiple line edition.
Shift + return in Text area only adds a line return but does not send
the mutation.

Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
lfasani added a commit that referenced this issue Mar 4, 2022
@lfasani
[781] Display the label node with multiple lines
9dad399 
Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
lfasani added a commit that referenced this issue Mar 4, 2022
@lfasani
[781] Adapt the ELK to consider the multiple line
c8395c4 
The ELK label TextBound is set according the line returns contained in
the label text.
This will allow to have the right width of the node and to avoid the
overlap of the label text with the contained nodes.

Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
lfasani added a commit that referenced this issue Mar 4, 2022
@lfasani
[781] Support the multi-line label edition in diagram
8a3c176 
Add a isMultiLine attribute to Label so that it can be seen as a
textArea by sprotty.
Adapt the editing bounds and the edited text font to have always the
same editing area whatever the zoom level.

Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
lfasani added a commit that referenced this issue Mar 4, 2022
@lfasani
[781] Update the way the centered node label position is done
743b33e 
The changes are about the node label center position.
There is in fact no visible change but there are technical changes to
prepare the following commits when we will have a label on many lines:
* the label position given by the server is the horizontal center of the
node instead of the left position of the label
* consequently the LabelView is updated to display the text with
'text-anchor': 'middle' instead of the default 'text-anchor': 'start'

Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
lfasani added a commit that referenced this issue Mar 4, 2022
@lfasani
[781] Use Text area for default form representation
b53624d 
It will allow multiple line edition.
Shift + return in Text area only adds a line return but does not send
the mutation.

Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
lfasani added a commit that referenced this issue Mar 4, 2022
@lfasani
[781] Display the label node with multiple lines
ba557fa 
Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
lfasani added a commit that referenced this issue Mar 4, 2022
@lfasani
[781] Adapt the ELK to consider the multiple line
152edbe 
The ELK label TextBound is set according the line returns contained in
the label text.
This will allow to have the right width of the node and to avoid the
overlap of the label text with the contained nodes.

Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
lfasani added a commit that referenced this issue Mar 4, 2022
@lfasani
[781] Support the multi-line label edition in diagram
7b4879b 
Add a isMultiLine attribute to Label so that it can be seen as a
textArea by sprotty.
Adapt the editing bounds and the edited text font to have always the
same editing area whatever the zoom level.

Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
lfasani added a commit that referenced this issue Mar 4, 2022
@lfasani
[781] Update the tests for multiline label
ef37e1f 
Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
lfasani added a commit that referenced this issue Mar 4, 2022
@lfasani
[781] Update the tests for multiline label
55c90bb 
Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
@sbegaudeau sbegaudeau linked a pull request Mar 7, 2022 that will close this issue
[781] Add support for multiline labels #1087
Merged
16 tasks
lfasani added a commit that referenced this issue Mar 7, 2022
@lfasani
[781] Display the label node with multiple lines
e442a61 
Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
lfasani added a commit that referenced this issue Mar 7, 2022
@lfasani
[781] Adapt the ELK to consider the multiple line
080e067 
The ELK label TextBound is set according the line returns contained in
the label text.
This will allow to have the right width of the node and to avoid the
overlap of the label text with the contained nodes.

Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
lfasani added a commit that referenced this issue Mar 7, 2022
@lfasani
[781] Support the multi-line label edition in diagram
caf75c0 
Add a isMultiLine attribute to Label so that it can be seen as a
textArea by sprotty.
Adapt the editing bounds and the edited text font to have always the
same editing area whatever the zoom level.

Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
lfasani added a commit that referenced this issue Mar 7, 2022
@lfasani
[781] Update the tests for multiline label
3d617ca 
Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
lfasani added a commit that referenced this issue Mar 7, 2022
@lfasani
[781] Adapt svg export to multiline label
69bc5f4 
Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
lfasani added a commit that referenced this issue Mar 7, 2022
@lfasani
[781] Update code according to comment
266caeb 
Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
lfasani added a commit that referenced this issue Mar 7, 2022
@lfasani
[781] Fix incremental layout when there are border nodes
c770bb4 
Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
lfasani added a commit that referenced this issue Mar 8, 2022
@lfasani
[781] Adapt svg export to multiline label
80808d6 
Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
lfasani added a commit that referenced this issue Mar 8, 2022
@lfasani
[781] Update code according to comment
8bc299e 
Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
lfasani added a commit that referenced this issue Mar 8, 2022
@lfasani
[781] Fix incremental layout when there are border nodes
1bd6265 
Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
lfasani added a commit that referenced this issue Mar 8, 2022
@lfasani
[781] Update the way the centered node label position is done
f0174b2 
The changes are about the node label center position.
There is in fact no visible change but there are technical changes to
prepare the following commits when we will have a label on many lines:
* the label position given by the server is the horizontal center of the
node instead of the left position of the label
* consequently the LabelView is updated to display the text with
'text-anchor': 'middle' instead of the default 'text-anchor': 'start'

Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
lfasani added a commit that referenced this issue Mar 8, 2022
@lfasani
[781] Use Text area for default form representation
3ed51c0 
It will allow multiple line edition.
Shift + return in Text area only adds a line return but does not send
the mutation.

Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
lfasani added a commit that referenced this issue Mar 8, 2022
@lfasani
[781] Display the label node with multiple lines
d20a9ac 
Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
lfasani added a commit that referenced this issue Mar 8, 2022
@lfasani
[781] Adapt the ELK to consider the multiple line
42cfc10 
The ELK label TextBound is set according the line returns contained in
the label text.
This will allow to have the right width of the node and to avoid the
overlap of the label text with the contained nodes.

Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
lfasani added a commit that referenced this issue Mar 8, 2022
@lfasani
[781] Support the multi-line label edition in diagram
4053982 
Add a isMultiLine attribute to Label so that it can be seen as a
textArea by sprotty.
Adapt the editing bounds and the edited text font to have always the
same editing area whatever the zoom level.

Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
lfasani added a commit that referenced this issue Mar 8, 2022
@lfasani
[781] Update the tests for multiline label
49212bc 
Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
lfasani added a commit that referenced this issue Mar 8, 2022
@lfasani
[781] Adapt svg export to multiline label
b0a7fcd 
Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
lfasani added a commit that referenced this issue Mar 8, 2022
@lfasani
[781] Update code according to comment
647aafb 
Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
lfasani added a commit that referenced this issue Mar 8, 2022
@lfasani
[781] Fix incremental layout when there are border nodes
ad373c4 
Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
sbegaudeau pushed a commit that referenced this issue Mar 8, 2022
@lfasani @sbegaudeau
[781] Add support for multiline labels
b4ac4ea 
The changes are about the node label center position.
There is in fact no visible change but there are technical changes to
prepare the following commits when we will have a label on many lines:

* the label position given by the server is the horizontal center of the
node instead of the left position of the label
* consequently the LabelView is updated to display the text with
'text-anchor': 'middle' instead of the default 'text-anchor': 'start'

The default form description will now use a text area for default form
representation. It will allow multiple line edition. Shift + return in
a text area only adds a line return but does not send the mutation.

Adapt the ELK to consider the multiple line. The ELK label TextBound is
set according the line returns contained in the label text.
This will allow to have the right width of the node and to avoid the
overlap of the label text with the contained nodes.

Add a isMultiLine attribute to Label so that it can be seen as a text area
by sprotty. Adapt the editing bounds and the edited text font to have always
the same editing area whatever the zoom level.

Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
sbegaudeau pushed a commit that referenced this issue Mar 8, 2022
@lfasani @sbegaudeau
[781] Add support for multiline labels
34f6823 
The changes are about the node label center position.
There is in fact no visible change but there are technical changes to
prepare the following commits when we will have a label on many lines:

* the label position given by the server is the horizontal center of the
node instead of the left position of the label
* consequently the LabelView is updated to display the text with
'text-anchor': 'middle' instead of the default 'text-anchor': 'start'

The default form description will now use a text area for default form
representation. It will allow multiple line edition. Shift + return in
a text area only adds a line return but does not send the mutation.

Adapt the ELK to consider the multiple line. The ELK label TextBound is
set according the line returns contained in the label text.
This will allow to have the right width of the node and to avoid the
overlap of the label text with the contained nodes.

Add a isMultiLine attribute to Label so that it can be seen as a text area
by sprotty. Adapt the editing bounds and the edited text font to have always
the same editing area whatever the zoom level.

Bug: #781
Signed-off-by: Laurent Fasani <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@lfasani lfasani

Labels
difficulty: medium package: diagrams type: enhancement
Projects
None yet
Milestone
2022.3.0
Development

Successfully merging a pull request may close this issue.

[781] Add support for multiline labels eclipse-sirius/sirius-web
4 participants
@pcdavid @sbegaudeau @Gelio @lfasani