-
-
+
diff --git a/index.js b/index.js
new file mode 100644
index 0000000..b4d321c
--- /dev/null
+++ b/index.js
@@ -0,0 +1,127 @@
+custom_scroller_menu(
+ document.scrollingElement,
+ document.getElementById("menubar"),
+ document.getElementById("debug"));
+
+var svg = document.querySelector("#svg"),
+ iframe = document.querySelector("iframe#wikiframe"),
+ cats = document.querySelector("#cats"),
+ cats_contents = document.querySelector("#cats .body"),
+ cats_thumb = document.querySelector("#cats .thumb"),
+ allcatscb = document.querySelector("input#allcats"),
+ historycb = document.querySelector("input#history"),
+ current_title = null,
+ loaded = false,
+ wikibaseurl,
+ wikibasepat;
+
+
+window.addEventListener("resize", resize);
+function resize() {
+ var w = window,
+ d = document,
+ e = d.documentElement,
+ g = d.getElementsByTagName('body')[0],
+ x = w.innerWidth || e.clientWidth || g.clientWidth,
+ y = w.innerHeight|| e.clientHeight|| g.clientHeight;
+ svg.setAttribute("width", x);
+ svg.setAttribute("height", y);
+ //console.log("resize", x, y);
+}
+resize();
+
+// console.log("mediawikiapi", mediawikiapi);
+var symbols = {
+ "Orientations": "symbols.svg#Orientations",
+ "Ateliers pluridisciplinaires": "symbols.svg#Ateliers_pluridisciplinaires",
+ "Cours de soutien à l'orientation": "symbols.svg#Cours_de_soutien_a_l'orientation",
+ "Cours de soutien spécifique": "symbols.svg#Cours_de_soutien_specifique",
+ "Cours techniques": "symbols.svg#Cours_techniques",
+ "Cours théoriques": "symbols.svg#Cours_theoriques",
+ "Enseignants": "symbols.svg#Enseignants",
+ "default": "symbols.svg#Main"
+};
+var map = new wikimap.SimpleMap(symbols);
+
+map.init_svg("#svg");
+async function doload () {
+ console.log("loading map");
+ await map.load_json("sitemap.json");
+ // console.log("loading categories");
+ // await map.load_cats("cats.json", cats_contents);
+ console.log("LOADED!");
+ loaded = true;
+ if (current_title) {
+ map.set_active_title(current_title);
+ }
+}
+
+map.on("page", function (title) {
+ console.log("map.page", title);
+ var url = wiki_title_to_url(title);
+ iframe.src = url;
+})
+// async function doload() {
+// map.set_active_node(startpage.value);
+// }
+
+function strip_fragment (href) {
+ var spos = href.indexOf("#");
+ if (spos >= 0) {
+ return href.substr(0, href.indexOf("#"))
+ }
+ return href;
+}
+function url_to_wiki_title (href) {
+ href = strip_fragment(href);
+ var m = wikibasepat.exec(href);
+ if (m !== null) {
+ return decodeURI(m[1]).replace(/_/g, " ");
+ }
+ console.log("m", m);
+}
+function wiki_title_to_url (title) {
+ return wikibaseurl+encodeURI(title.replace(/ /g, "_"));
+}
+window.addEventListener("DOMContentLoaded", doload);
+function strip_title_from_wiki_url (url) {
+ return url.substr(0, url.lastIndexOf("/")+1);
+}
+iframe.addEventListener("load", function () {
+ var href = strip_fragment(iframe.contentWindow.location.href);
+ if (!wikibaseurl) {
+ wikibaseurl = strip_title_from_wiki_url(href);
+ wikibasepat = new RegExp(wikibaseurl+"(.+)");
+ }
+ console.log("iframe loaded", href);
+ var title = url_to_wiki_title(href);
+ console.log("title", title);
+ if (title) {
+ current_title = title;
+ if (loaded) {
+ map.set_active_title(title);
+ }
+ }
+ // attempt to map url to wiki page title and update the map if it is one
+
+});
+
+cats_thumb.addEventListener("click", function () {
+ cats.classList.toggle("expanded");
+});
+// allcats checkbox
+// match current state & respond to change events
+// console.log("setting checked to", cats.classList.contains("showall"))
+allcatscb.checked = cats.classList.contains("showall");
+allcatscb.addEventListener("change", function () {
+ // console.log("allcats", allcatscb);
+ if (allcatscb.checked) {
+ cats.classList.add("showall")
+ } else {
+ cats.classList.remove("showall")
+ }
+})
+historycb.addEventListener("change", function () {
+ // console.log("history", historycb.checked);
+ map.set_show_history(historycb.checked);
+})
diff --git a/src/wikimapsimple.js b/src/wikimapsimple.js
index 1839e48..a9d87f1 100644
--- a/src/wikimapsimple.js
+++ b/src/wikimapsimple.js
@@ -205,7 +205,6 @@ export class SimpleMap {
console.log("wikimap.set_active_node: page not found", pagename);
}
}
-
if (page === this.active_page) {
// console.log("page is already the active page", page, this.active_page);
return;
diff --git a/style.css b/style.css
index 1b619fc..6cd8e43 100644
--- a/style.css
+++ b/style.css
@@ -73,6 +73,15 @@
}
+
+body {
+ margin: 0;
+ padding: 0;
+ background: #f1f2f3;
+ overflow: hidden;
+}
+
+
.links line {
/*stroke: #aaa;*/
stroke: none;
@@ -110,7 +119,11 @@
fill: aqua;
}
+
+
svg {
+ position: absolute;
+ left: 0; top: 0; right: 0; bottom: 0;
font: 10px sans-serif;
}
@@ -132,7 +145,35 @@ svg g.mouse text {
visibility: visible;
}
+use {
+ fill: #EEE;
+ stroke: black;
+}
+
+.active use {
+ fill: #FFF;
+ stroke: red;
+}
+
+.active text {
+ stroke: black;
+}
+
+.active2 use {
+ fill: #FFF;
+ stroke: red;
+}
+
+.highlight use {
+ fill: #FFF;
+ stroke: orange;
+}
+
+
+/* Categories */
+
#cats {
+ display: none;
position: absolute;
left: 0;
bottom: 0;
@@ -164,19 +205,19 @@ svg g.mouse text {
display: inline;
}
-
#cats .contents {
overflow: auto;
height: 50vh;
min-width: 300px;
}
-#cats .contents .scroll {
-}
+#cats .contents .scroll {}
+
#cats .botright {
position: absolute;
right: 0;
bottom: 0;
}
+
#cats .botright .thumb {
position: absolute;
left: 0;
@@ -207,22 +248,68 @@ svg g.mouse text {
}
-use {
- fill: #EEE;
- stroke: black;
+
+
+#page {
+ position: absolute;
+ left: 0; right: 0; top: 0;
+ height: 160vh;
+ text-align: center;
}
-.active use {
- fill: #FFF;
- stroke: red;
+#page.touched {
+ background: #444;
}
-.active text {
- stroke: black;
+#bottompane {
+ position: absolute;
+ top: 60vh;
+ left: 0; right: 0;
+ height: 100vh;
+ z-index: 2;
}
-.active2 use {
- fill: #FFF;
- stroke: red;
+#bottompane #bottompage {
+ position: absolute;
+ left: 0; right: 0;
+ margin: 0 auto;
+ max-width: 800px;
+ background: white;
+ border: 1px solid #E6E6E6;
+ border-radius: 10px;
+ display: inline-block;
+ width: 100%;
+ height: 100%;
+}
+#bottompane #menubar {
+ height: 48px;
+ width: 100%;
+
+}
+#wikiframediv {
+ position: absolute;
+ left: 0; top: 48px;
+ right: 0; bottom: 0;
+}
+#bottompane iframe {
+ border: none;
+ width: 100%;
+ height: 100%;
+}
+#debug {
+ width: 300px;
+ font-size: 10px;
+ height: 8em;
+ overflow: auto;
+ position: absolute; left: 10px; top: 10px; z-index:23
+}
+
+#searchinput {
+ min-width: 220px;
+ font-family: "combinedregular";
+ font-size: 11px;
+}
+#menubar {
+ text-align: center;
+}
+#menubar img {
+ position: relative;
+ top: 10px;
}
-.highlight use {
- fill: #FFF;
- stroke: orange;
-}
\ No newline at end of file