From 1d3dc06ebefa05cb2bbfbc9d9a4747b2b013c679 Mon Sep 17 00:00:00 2001
From: boanzhu <bz2818@ic.ac.uk>
Date: Sun, 26 Feb 2023 21:11:46 +0000
Subject: [PATCH] Fix Problem: now cardinality ratio appear on the top or
bottom of the link
---
frontend/src/demo/index.js | 85 ++++++++------------------------------
1 file changed, 17 insertions(+), 68 deletions(-)
diff --git a/frontend/src/demo/index.js b/frontend/src/demo/index.js
index f657890..ac69641 100644
--- a/frontend/src/demo/index.js
+++ b/frontend/src/demo/index.js
@@ -86,17 +86,6 @@ const paper = new dia.Paper({
defaultConnectionPoint: { name: 'boundary' }
});
-// const newShape = new MyShape({
-// size: { width: 100, height: 100 },
-// position: { x: 50, y: 50 },
-// attrs: {
-// label: { text: 'My Shape' }
-// },
-// level: 3,
-// ports: { items: [{ id: 'in1', group: 'in' }, { group: 'out', id: 'out1' }] }
-// });
-// graph.addCell(newShape);
-
const paperScroller = new ui.PaperScroller({
paper,
autoResizePaper: true,
@@ -186,8 +175,6 @@ const MyShape = dia.Element.define('myApp.MyShape', {
const StrongEntity = dia.Element.define('myApp.StrongEntity', {
- // type: 'erd.WeakEntity',
- // size: { width: 90, height: 360 },
attrs: {
body: {
width: '100',
@@ -221,10 +208,6 @@ const StrongEntity = dia.Element.define('myApp.StrongEntity', {
}]
});
-// StrongEntity.on('change:position', function(StrongEntity, position) {
-// alert('element1 moved to ' + position.x + ',' + position.y);
-// });
-
// paper.on('StrongEntity:delete', function(elementView, evt) {
// // Stop any further actions with the element view e.g. dragging
// evt.stopPropagation();
@@ -336,11 +319,11 @@ graph.on('add', function(cell) {
// },
// }, setTimeout(this, 1000))
} else if (cell.attributes.type == 'standard.Link') {
- console.log("gggggggggggg", cell);
- console.log(cell.attributes.target);
+ // console.log("gggggggggggg", cell);
+ // console.log(cell.attributes.target);
console.log("Link");
if (cell.attributes.target.id == undefined) {
- console.log("trueeeeee");
+ console.log("This shoud be an attribute");
} else {
console.log("The target is an element");
}
@@ -508,23 +491,11 @@ const WeakEntity = dia.Element.define('myApp.WeakEntity', {
// `
});
-
-// paper.on('WeakEntity:changeLabel', function(elementView, evt) {
-// // evt.stopPropagation();
-// let new_weak_entity_name = window.prompt("Please enter the name of the new strong entity:", "");
-// elementView.model.attributes.attrs.label.text = new_weak_entity_name;
-// elementView.render();
-// });
-
paper.on('myApp.WeakEntity:pointerclick', function(elementView, evt) {
evt.stopPropagation();
console.log("clicked");
});
-// StrongEntity.on('change:position', function(StrongEntity, position) {
-// alert('element1 moved to ' + position.x + ',' + position.y);
-// });
-
const relationship = dia.Element.define('myApp.Relationship', {
attrs: {
body: {
@@ -558,32 +529,6 @@ const relationship = dia.Element.define('myApp.Relationship', {
`
})
-// StrongEntity.attrs({width: 100, height: 50});
-
-// const weakEntity = dia.Element.define('myApp.StrongEntity', {
-// attrs: {
-// body: {
-// width: 'calc(w)',
-// height: 'calc(h)',
-// strokeWidth: 2,
-// stroke: '#000000',
-// fill: '#FFFFFF'
-// },
-// label: {
-// x: 'calc(w/2)',
-// y: 'calc(h/2)',
-// textAnchor: 'middle',
-// textVerticalAnchor: 'middle',
-// fontSize: 14,
-// fill: '#333333'
-// },
-// root: {
-// magnet: false // Disable the possibility to connect the body of our shape. Only ports can be connected.
-// }
-// },
-// });
-
-
// Stencil
// -------
@@ -817,11 +762,11 @@ paper.on('element:pointerclick link:pointerclick', (elementView, evt) => {
'data-tooltip-position-selector': '.joint-inspector'
}
},
- distance: 0.66,
- offset: {
- x: -40,
- y: 80
- }
+ // distance: 0.66,
+ // offset: {
+ // x: -40,
+ // y: 80
+ // }
},
}
@@ -972,6 +917,7 @@ paper.on('element:pointerclick link:pointerclick', (elementView, evt) => {
type: 'color-palette',
options: options.colorPaletteReset,
label: 'Fill',
+ defaultValue: '#f6f6f6',
index: 3
},
stroke: {
@@ -1350,9 +1296,6 @@ graph.on('change add remove', (cell) => {
if (cell.attributes.type == 'standard.Link') {
if (cell.attributes.target.id == undefined) {
-
- console.log("kkkkkkkkkkkkk", cell);
-
if (cell.attributes.labels) {
// Need to check the relative position of the new attribute
@@ -1429,11 +1372,17 @@ graph.on('change add remove', (cell) => {
};
}
console.log("points");
- cells = graph.getCells();
- console.log("cells: ", cells);
+ // cells = graph.getCells();
+ // console.log("cells: ", cells);
cell.attributes.attrs.line.targetMarker.d = 'M 0, 0 m -7, 0 a 7,7 0 1,0 14,0 a 7,7 0 1,0 -14,0';
// let new_strong_entity_name = window.prompt("Please enter the name of the new strong entity:", "");
} else {
+
+ if (cell.attributes.labels) {
+ cell.attributes.labels[0].position = {
+ offset: -10
+ };
+ }
console.log("element");
// cell.attributes.attrs.line.targetMarker.d = 'M 10 -5 0 0 10 5 Z';
cell.attributes.attrs.line.targetMarker.d = 'M 0 0 0 0';
--
GitLab