Skip to content

Commit

Permalink
Merge pull request #33 from zegLine/main
Browse files Browse the repository at this point in the history 
Fixed hard reference to url localhost
  • Loading branch information
@zegLine
zegLine authored Feb 15, 2024
2 parents 20ee8be + c6b92fe commit 9a7d903
Show file tree
Hide file tree
Showing 3 changed files with 73 additions and 33 deletions.
9 changes: 5 additions & 4 deletions src/main/resources/static/js/apiInteractions.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,8 @@ export function doCreate() {
msgText: msgText,
dialogNodeText: dialogNodeText,
};
const serverURL = 'http://localhost:8080/api/dialognode/createChild';
const serverURL = '../api/dialognode/createChild';


console.log('Request Details:', {
method: 'POST',
Expand Down Expand Up @@ -72,14 +73,14 @@ export function doModify() {

console.log('Request Details:', {
method: 'POST',
url: 'http://localhost:8080/api/dialognode/modify',
url: '../api/dialognode/modify',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify(data),
});

fetch('http://localhost:8080/api/dialognode/modify', {
fetch('../api/dialognode/modify', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
Expand Down Expand Up @@ -110,7 +111,7 @@ export function doDelete() {
dialogNodeId: nodeId
};

fetch('http://localhost:8080/api/dialognode/delete', {
fetch('../api/dialognode/delete', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
Expand Down
29 changes: 14 additions & 15 deletions src/main/resources/static/js/databaseMap.js
View file
Original file line number Diff line number Diff line change
@@ -1,21 +1,20 @@
import { visualizeTree } from './treeManipulation.js';

export function fetchAndVisualizeTree() {
fetch('/api/dialognode/get')
.then(response => response.json())
.then(treeData => {
console.log(treeData);
if (!treeData) {
throw new Error('No tree data');
}
export async function fetchAndVisualizeTree() {
try {
const response = await fetch('/api/dialognode/get');
const treeData = await response.json();
console.log(treeData);
if (!treeData) {
throw new Error('No tree data');
}

d3.select("#database-map").selectAll("*").remove();
d3.select("#database-map").selectAll("*").remove();

visualizeTree(treeData[0]);
})
.catch(error => {
console.error('Error fetching tree data:', error);
});
return visualizeTree(treeData[0]);
} catch (error) {
console.error('Error fetching tree data:', error);
}
}

fetchAndVisualizeTree();
fetchAndVisualizeTree();
68 changes: 54 additions & 14 deletions src/main/resources/static/js/treeManipulation.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ var nodeToModify = null;
var isModifying = false;



export function setInitialDepths(root, depthIncrement) {
if (root.children) {
root.children.forEach(function (child) {
Expand Down Expand Up @@ -47,7 +48,7 @@ export function diagonal(s, d) {

export function updateMap() {

fetch('http://localhost:8080/api/dialognode/get', {
fetch('../api/dialognode/get', {
method: 'GET',
headers: {
'Content-Type': 'application/json',
Expand All @@ -62,6 +63,7 @@ export function updateMap() {
});
}


export function visualizeTree(treeData) {

const rectWidth = 200;
Expand Down Expand Up @@ -91,7 +93,7 @@ export function visualizeTree(treeData) {
.attr("transform", "translate(" + margin.left + "," + margin.top + ")");

var zoom = d3.zoom()
.scaleExtent([0.1, 10])
.scaleExtent([0.7, 100])
.on("zoom", function (event) {
svg.attr("transform", event.transform);
});
Expand All @@ -107,17 +109,13 @@ export function visualizeTree(treeData) {
});

d3.select('body').on('click', function (event) {

if (!d3.select(event.target).classed('node-selected') && !d3.select(event.target).classed('context-menu')) {
d3.selectAll('.node-selected').classed('node-selected', false);
d3.selectAll('.node-modifying').classed('node-modifying', false);
d3.select('#context-menu').style('display', 'none');
}

});

d3.select('svg').on('contextmenu', function (event) {
event.preventDefault();
});
}

export function update(svg, root, treemap, rectWidth, rectHeight, rectRoundness, i, depthSize, margin) {
Expand All @@ -128,6 +126,45 @@ export function update(svg, root, treemap, rectWidth, rectHeight, rectRoundness,
.attr("class", "tooltip")
.style("opacity", 0);

d3.select('body').on('contextmenu', function (event) {
event.preventDefault();

if (isModifying) {
isModifying = false;
nodeToModify = null;
d3.selectAll('.node-modifying').classed('node-modifying', false);
d3.selectAll('.node').classed('node-hover-enabled', false);
}
if (!d3.select(event.target).classed('node')) {
d3.selectAll('.node-modifying').classed('node-modifying', false);
}
var contextMenuNode = d3.select('#context-menu').node();
if (!d3.select(event.target).classed('node') && !(contextMenuNode.contains(event.target) || contextMenuNode === event.target)) {
d3.select('#context-menu').style('display', 'none');
}
});

d3.select('body').on('click', function (event) {
if (!d3.select(event.target).classed('node-selected') && !d3.select(event.target).classed('context-menu')) {
d3.selectAll('.node-selected').classed('node-selected', false);
d3.selectAll('.node-modifying').classed('node-modifying', false);
d3.select('#context-menu').style('display', 'none');
}
});

d3.select('body').on('mousemove', function(event) {

if (!d3.select(event.target).classed('node')) {
tooltip.transition()
.duration(500)
.style("opacity", 0);
}
});

window.addEventListener('beforeunload', function() {
tooltip.style("opacity", 0);
});

var treeData = treemap(root);
var nodes = treeData.descendants();
var links = treeData.descendants().slice(1);
Expand Down Expand Up @@ -229,10 +266,12 @@ export function update(svg, root, treemap, rectWidth, rectHeight, rectRoundness,
})

.on('mouseover', function (event, d) {

tooltip.transition()
.duration(200)
.style("opacity", .9);

var contextMenu = d3.select('#context-menu');
if (contextMenu.style('display') === 'none') {
tooltip.transition()
.duration(200)
.style("opacity", .9);

tooltip.html(function () {
var tooltipText = 'ID: ' + d.data.id;
Expand All @@ -248,8 +287,9 @@ export function update(svg, root, treemap, rectWidth, rectHeight, rectRoundness,

return tooltipText;
})
.style("left", (event.pageX) + "px")
.style("top", (event.pageY - 28) + "px");
.style("left", (event.pageX + rectWidth) + "px")
.style("top", (event.pageY - rectHeight - 28) + "px");
}
})

.on('mouseout', function () {
Expand Down Expand Up @@ -349,4 +389,4 @@ export function update(svg, root, treemap, rectWidth, rectHeight, rectRoundness,
d.x0 = d.x;
d.y0 = d.y;
});
}
}

0 comments on commit 9a7d903

Please sign in to comment.