1
0
mirror of https://github.com/kalmarek/SmallHyperbolic synced 2024-07-27 21:10:31 +02:00
SmallHyperbolic/docs/morphisms/js/morphisms.js
Marek Kaluba e2278a2961
fix: make math foreignObject larger
Chrome returns different height of BoundingRect than Firefox
2022-02-24 02:36:49 +01:00

72 lines
2.0 KiB
JavaScript

const morphisms_url = new URL("https://raw.githubusercontent.com/kalmarek/SmallHyperbolic/master/data/triangle_groups_morphisms.json")
async function fetch_json(url) {
try {
let response = await fetch(url);
let json = await response.json();
return json;
} catch (err) {
console.log("Error while fetching json:" + err);
}
};
async function place_svg(svg) {
d3.select("div.canvas")
.append("div")
.attr("class", "container-fluid")
.attr("class", "svg-container")
.node()
.appendChild(svg.node())
;
};
async function add_search() {
let input_grp = d3.select("div.canvas")
.append("div")
.classed("search-field", true)
.append("div")
.classed("container", true)
;
let input = input_grp.insert("input")
.attr("class", "form-control")
.attr("list", "datalistOptions")
.attr("id", "groupSearch")
.attr("placeholder", "Type to search...")
;
input_grp.insert("datalist")
.attr("id", "datalistOptions")
;
input_grp.insert("div")
.classed("form-text", true)
.text("Or click to highlight descendants")
;
}
async function switch_katex(toggle=true) {
let math_objects = document.getElementsByClassName("math");
for (let elt of math_objects) {
await toggleKaTeX(elt, toggle);
let fObj = elt.parentElement;
let rect = elt.getElementsByClassName("math-tex")[0].getBoundingClientRect();
fObj.setAttribute("width", rect.width+8);
fObj.setAttribute("height", rect.height+8);
}
};
add_search()
fetch_json(morphisms_url)
// .then(async (data) => { console.log(data); return data;})
.then(async (data) => {
return create_svg(data, window.innerWidth, window.innerHeight);
})
// .then(async (data) => { console.log(data); return data; })
.then(place_svg)
.then(switch_katex)
// .then(add_search)
;