endernon/wynnbuilder-forked-for-changes
1
0
Fork 0
forked from morphNon/wynnbuilder-idk
Code Pull requests Activity

change connector logic

Browse source
This commit is contained in:
reschan 2022-06-23 22:00:15 +07:00
parent d68af2f4c4
commit 39bbf45b12
1 changed files with 52 additions and 29 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

81
js/display_atree.js
View file

@ -14,28 +14,36 @@ function construct_AT(elem, tree) {
let node = tree[i]; let node = tree[i];
// create rows if not exist // create rows if not exist
if (document.getElementById("atree-row-" + node.display.row) == null) { let missing_rows = [node.display.row];
for (let j = 0; j <= node.display.row; j++) {
if (document.getElementById("atree-row-" + j) == null) { for (let parent of node.parents) {
let row = document.createElement('div'); missing_rows.push(tree.find(object => {return object.display_name === parent;}).display.row);
row.classList.add("row"); }
row.id = "atree-row-" + j; for (let missing_row of missing_rows) {
//was causing atree rows to be 0 height if (document.getElementById("atree-row-" + missing_row) == null) {
console.log(elem.scrollWidth / 9); for (let j = 0; j <= missing_row; j++) {
row.style.minHeight = elem.scrollWidth / 9 + "px"; if (document.getElementById("atree-row-" + j) == null) {
//row.style.minHeight = elem.getBoundingClientRect().width / 9 + "px"; let row = document.createElement('div');
row.classList.add("row");
row.id = "atree-row-" + j;
//was causing atree rows to be 0 height
console.log(elem.scrollWidth / 9);
row.style.minHeight = elem.scrollWidth / 9 + "px";
//row.style.minHeight = elem.getBoundingClientRect().width / 9 + "px";
for (let k = 0; k < 9; k++) { for (let k = 0; k < 9; k++) {
col = document.createElement('div'); col = document.createElement('div');
col.classList.add('col', 'px-0'); col.classList.add('col', 'px-0');
col.style.minHeight = elem.scrollWidth / 9 + "px"; col.style.minHeight = elem.scrollWidth / 9 + "px";
row.appendChild(col); row.appendChild(col);
};
elem.appendChild(row);
}; };
elem.appendChild(row);
}; };
}; };
}; }
let connector_list = [] let connector_list = []
// create connectors based on parent location // create connectors based on parent location
@ -52,7 +60,7 @@ function construct_AT(elem, tree) {
connector.style.backgroundImage = "url('../media/atree/connect_line.png')"; connector.style.backgroundImage = "url('../media/atree/connect_line.png')";
connector.id = "r" + i + "-c" + node.display.col + "-line" connector.id = "r" + i + "-c" + node.display.col + "-line"
document.getElementById("atree-row-" + i).children[node.display.col].appendChild(connector); document.getElementById("atree-row-" + i).children[node.display.col].appendChild(connector);
resolve_connector(document.getElementById("atree-row-" + i).children[node.display.col]); resolve_connector(document.getElementById("atree-row-" + i).children[node.display.col], node);
} }
// connect left // connect left
for (let i = parent_node.display.col + 1; i < node.display.col; i++) { for (let i = parent_node.display.col + 1; i < node.display.col; i++) {
@ -61,7 +69,7 @@ function construct_AT(elem, tree) {
connector.classList.add("rotate-90"); connector.classList.add("rotate-90");
connector.id = "r" + parent_node.display.row + "-c" + i + "-line" connector.id = "r" + parent_node.display.row + "-c" + i + "-line"
document.getElementById("atree-row-" + parent_node.display.row).children[i].appendChild(connector); document.getElementById("atree-row-" + parent_node.display.row).children[i].appendChild(connector);
resolve_connector(document.getElementById("atree-row-" + parent_node.display.row).children[i]); resolve_connector(document.getElementById("atree-row-" + parent_node.display.row).children[i], node);
} }
// connect right // connect right
@ -71,7 +79,7 @@ function construct_AT(elem, tree) {
connector.classList.add("rotate-90"); connector.classList.add("rotate-90");
connector.id = "r" + parent_node.display.row + "-c" + i + "-line" connector.id = "r" + parent_node.display.row + "-c" + i + "-line"
document.getElementById("atree-row-" + parent_node.display.row).children[i].appendChild(connector); document.getElementById("atree-row-" + parent_node.display.row).children[i].appendChild(connector);
resolve_connector(document.getElementById("atree-row-" + parent_node.display.row).children[i]); resolve_connector(document.getElementById("atree-row-" + parent_node.display.row).children[i], node);
} }
// connect corners // connect corners
@ -81,7 +89,7 @@ function construct_AT(elem, tree) {
connector.classList.add("rotate-180"); connector.classList.add("rotate-180");
connector.id = "r" + parent_node.display.row + "-c" + node.display.col + "-angle" connector.id = "r" + parent_node.display.row + "-c" + node.display.col + "-angle"
document.getElementById("atree-row-" + parent_node.display.row).children[node.display.col].appendChild(connector); document.getElementById("atree-row-" + parent_node.display.row).children[node.display.col].appendChild(connector);
resolve_connector(document.getElementById("atree-row-" + parent_node.display.row).children[node.display.col]); resolve_connector(document.getElementById("atree-row-" + parent_node.display.row).children[node.display.col], node);
} }
if (parent_node.display.col < node.display.col && (parent_node.display.row != node.display.row)) { if (parent_node.display.col < node.display.col && (parent_node.display.row != node.display.row)) {
@ -90,7 +98,7 @@ function construct_AT(elem, tree) {
connector.classList.add("rotate-270"); connector.classList.add("rotate-270");
connector.id = "r" + parent_node.display.row + "-c" + node.display.col + "-angle" connector.id = "r" + parent_node.display.row + "-c" + node.display.col + "-angle"
document.getElementById("atree-row-" + parent_node.display.row).children[node.display.col].appendChild(connector); document.getElementById("atree-row-" + parent_node.display.row).children[node.display.col].appendChild(connector);
resolve_connector(document.getElementById("atree-row-" + parent_node.display.row).children[node.display.col]); resolve_connector(document.getElementById("atree-row-" + parent_node.display.row).children[node.display.col], node);
} }
} }
@ -165,11 +173,12 @@ function construct_AT(elem, tree) {
}; };
// resolve connector conflict // resolve connector conflict
function resolve_connector(elem) { function resolve_connector(elem, node) {
if (elem.children.length < 2) {return false;} if (elem.children.length < 2) {return false;}
let line = 0; let line = 0;
let angle = 0; let angle = 0;
let t = 0 let t = 0;
let c = 0;
for (let child of elem.children) { for (let child of elem.children) {
let type = child.id.split("-")[2] let type = child.id.split("-")[2]
if (type == "line") { if (type == "line") {
@ -178,22 +187,36 @@ function resolve_connector(elem) {
angle += 1; angle += 1;
} else if (type == "t") { } else if (type == "t") {
t += 1; t += 1;
} else if (type == "c") {
c += 1;
} }
} }
let connect_elem = document.createElement("div"); let connect_elem = document.createElement("div");
if ((line == angle) || (angle == 1 && t == 1)) { //if ((line == 1 && angle == 1) || (line == 2 && angle == 2) || (line == 1 && angle == 2) || (angle == 1 && t == 1)) {
// connect_elem.style = "background-image: url('../media/atree/connect_t.png'); background-size: cover; width: 100%; height: 100%;"
// connect_elem.classList.add("rotate-180")
// connect_elem.id = elem.children[0].id.split("-")[0] + "-" + elem.children[0].id.split("-")[1] + "-t"
// elem.replaceChildren(connect_elem);
//}
//if (line > 1 && angle == 0) {
// elem.replaceChildren(elem.children[0])
//}
//if (t == 1 && line == 1) {
// connect_elem.style = "background-image: url('../media/atree/connect_c.png'); background-size: cover; width: 100%; height: 100%;"
// elem.replaceChildren(connect_elem);
//}
if ((line == 1 && angle == 1)) {
connect_elem.style = "background-image: url('../media/atree/connect_t.png'); background-size: cover; width: 100%; height: 100%;" connect_elem.style = "background-image: url('../media/atree/connect_t.png'); background-size: cover; width: 100%; height: 100%;"
connect_elem.classList.add("rotate-180") connect_elem.classList.add("rotate-180")
connect_elem.id = elem.children[0].id.split("-")[0] + "-" + elem.children[0].id.split("-")[1] + "-t" connect_elem.id = elem.children[0].id.split("-")[0] + "-" + elem.children[0].id.split("-")[1] + "-t"
elem.replaceChildren(connect_elem); elem.replaceChildren(connect_elem);
} }
if (line > 1 && angle == 0) { if (node.parents.length == 3 && t == 1) {
elem.replaceChildren(elem.children[0])
}
if (t == 1 && line == 1) {
connect_elem.style = "background-image: url('../media/atree/connect_c.png'); background-size: cover; width: 100%; height: 100%;" connect_elem.style = "background-image: url('../media/atree/connect_c.png'); background-size: cover; width: 100%; height: 100%;"
connect_elem.id = elem.children[0].id.split("-")[0] + "-" + elem.children[0].id.split("-")[1] + "-c"
elem.replaceChildren(connect_elem); elem.replaceChildren(connect_elem);
} }
elem.replaceChildren(elem.children[0])
} }