wiki.erg.be/map
1
0
Fork 0
Code Issues 4 Pull Requests Packages Projects Releases Wiki Activity

special/recentfiles

Browse Source
This commit is contained in:
Michael Murtaugh
2019-07-22 15:35:19 +02:00
parent 7e379b97c9
commit 004d262004
20 changed files with 1511 additions and 186 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/legend.json
View File

@@ -11,7 +11,7 @@
},
{
"key" : "Cours de soutien à l'orientation",
"symbol" : "symbols.svg#Cours_de_soutien_a_l'orientation",
"symbol" : "symbols.svg#Cours_de_soutien_a_l_orientation",
"icon" : "img/Cours_de_soutien_a_lorientation.png"
},
{
@@ -34,6 +34,11 @@
"symbol" : "symbols.svg#Enseignants",
"icon" : "img/Enseignants.png"
},
{
"key" : "Actualités",
"symbol" : "symbols.svg#Actualites",
"icon" : "img/Actualites.png"
},
{
"key" : "default",
"symbol" : "symbols.svg#Main",

86
src/wikimap.js
View File

@@ -14,7 +14,8 @@ export class Map {
constructor (opts) {
var width = 600,
height = 600;
this.width = width;
this.height = height;
this.zoom_level = opts.zoom || 1.5;
this.apiurl = opts.apiurl;
this.categorylabel = opts.categorylabel || "Category";
@@ -89,10 +90,31 @@ export class Map {
})
cat.append("span").attr("class", "count").html(d => d.tcount)
var set_active_url_from_window = () => {
var title = this.wiki.unescapeTitle(window.location.hash.substring(1)),
page = this.wiki.get_page_by_title(title),
url = page.url();
console.log("wikimap init", page.title, url);
this.set_active_url(url);
};
this.loaded = true;
if (this.active_url) {
if (window.location.hash) {
set_active_url_from_window();
} else if (this.active_url) {
this.set_active_url(this.active_url);
}
window.addEventListener("hashchange", e => {
console.log("hashchange");
set_active_url_from_window()
});
/*
window.addEventListener("popstate", e => {
// console.log("popstate", e);
console.log("popstate: " + document.location + ", state: " + JSON.stringify(e.state));
})
*/
}
on (message, callback, context) {
@@ -124,10 +146,20 @@ export class Map {
.attr("class", "links");
this.nodesg = this.content.append("g")
.attr("class", "nodes");
// DEBUGGING
this.svg.on("click", x => {
// console.log("svg click", event.target);
if (event.target == this.svg.node()) {
console.log("(debug) BACKGROUND CLICK", this.active_page.x, this.active_page.y);
this.centerOnItem(this.active_page);
}
})
}
dragstarted (d) {
// if (!event.active) this.simulation.alphaTarget(0.3).restart();
if (!event.active) this.simulation.alphaTarget(0.3).restart();
// this.simulation.restart();
d.fx = d.x;
d.fy = d.y;
}
@@ -138,7 +170,7 @@ export class Map {
}
dragended(d) {
// if (!event.active) this.simulation.alphaTarget(0);
if (!event.active) this.simulation.alphaTarget(0);
d.fx = null;
d.fy = null;
}
@@ -167,11 +199,16 @@ export class Map {
return ret;
}
// function called on iframe load
async set_active_url (url) {
this.active_url = url;
console.log("wikimap.set_active_url", url);
this.active_url = url;
if (this.loaded) {
var page = this.wiki.get_page(this.active_url);
if (page) {
// console.log("calling replaceState", page.title);
window.history.replaceState (null, null, "#"+this.wiki.escapeTitle(page.title));
// window.location.hash = this.wiki.escapeTitle(page.title);
this.set_active_page(page);
} else {
console.log("wikimap: set_active_url: NO PAGE FOR", url);
@@ -223,9 +260,12 @@ export class Map {
// console.log("page is already the active page", page, this.active_page);
return;
}
// window.location.hash = this.wiki.escapeTitle(page.title);
// window.history.pushState ({pagetitle: page.title}, page.title, "/m/"+this.wiki.escapeTitle(page.title));
// cleanup old
if (this.active_page) {
this.active_page.fx = undefined;
this.active_page.fy = undefined;
this.active_page.active = false;
// deactivate linked links/nodes
this.linked_nodes_set_active(this.active_page, false);
@@ -266,10 +306,10 @@ export class Map {
// LOAD/ENSURE PAGE LINKS
var links_out = await page.get_links();
links_out = links_out.filter(p => (!p.redirect && p.ns == 0));
console.log("links_out", links_out);
// console.log("links_out", links_out);
var links_in = await page.get_linkshere();
links_in = links_in.filter(p => (!p.redirect && p.ns == 0));
console.log("links_in", links_in);
// console.log("links_in", links_in);
links_out.forEach(p => {
this.ensure_link(page, p).wiki = true;
});
@@ -280,12 +320,19 @@ export class Map {
}
this.active_page = page;
// console.log("fixing active page", this.active_page);
if (this.active_page.x === undefined) {
this.active_page.x = this.width/2;
this.active_page.y = this.height/2;
}
this.active_page.fx = this.active_page.x;
this.active_page.fy = this.active_page.y;
this.active_page.active = true;
this.linked_nodes_set_active(this.active_page, true);
setTimeout(() => {
this.centerOnItem(page, 1000);
}, 1000);
//setTimeout(() => {
this.centerOnItem(page, 1000);
//}, 1000);
this.events.emit("page", this.active_page);
var data = {nodes: this.get_nodes(), links: values(this.all_links_by_key)};
@@ -342,7 +389,7 @@ export class Map {
}
update_graph (graph) {
console.log("UPDATE GRAPH", graph.nodes.length, graph.links.length);
// console.log("UPDATE GRAPH", graph.nodes.length, graph.links.length);
var link = this.linksg.selectAll("line")
.data(graph.links, d => { return this.link_key(d.source.title, d.target.title) });
var link_enter = link.enter()
@@ -375,11 +422,15 @@ export class Map {
})
.on("mouseover", function (d) {
// console.log("mouseover", this);
// d.mouse = true;
select(this).classed("mouse", true);
// that.update_nodes();
})
.on("mouseout", function (d) {
// console.log("mouseout", this);
// d.mouse = false;
select(this).classed("mouse", false);
// that.update_nodes();
})
.call(drag()
.on("start", this.dragstarted.bind(this))
@@ -450,13 +501,14 @@ export class Map {
update_nodes () {
var nodes = this.nodesg.selectAll("g.page");
// console.log("update_nodes", nodes.size());
nodes.classed("mouse", d=>d.mouse);
nodes.classed("active", d=>d.active);
nodes.classed("active2", d=>d.active2);
nodes.classed("highlight", d=>d.highlight);
nodes.sort((a, b) => {
// console.log("sort", a, b);
var x = a.active ? 10 : (a.active2 ? 5 : 0),
y = b.active ? 10 : (b.active2 ? 5 : 0);
var x = a.mouse ? 10 : (a.active ? 8 : (a.active2 ? 5 : 0)),
y = b.mouse ? 10 : (b.active ? 8 : (b.active2 ? 5 : 0));
return x - y;
});
var links = this.linksg.selectAll("line");
@@ -488,10 +540,13 @@ export class Map {
centerOnItem(item, duration) {
var bounds = this.svg.node().getBoundingClientRect();
var curt = zoomTransform(this.rect.node());
console.log("centerOnItem", this.zoom_level, "item", item);
// console.log("centerOnItem", this.zoom_level, "item", item);
var zoom_level = this.zoom_level ? this.zoom_level : curt.k;
var ITEM_SIZE = 36;
if (item && item.x !== undefined) {
this.zoom.translateTo(duration ? this.rect.transition().duration(duration) : this.rect, item.x, item.y);
// this.zoom.translateTo(this.rect, item.x, item.y);
/*
var transform = function () {
return zoomIdentity
.translate(bounds.width / 2, bounds.height / 2)
@@ -503,6 +558,7 @@ export class Map {
} else {
this.rect.call(this.zoom.transform, transform);
}
*/
} else {
console.log("NO ITEM");
var transform = function () {