all commits from server
This commit is contained in:
Michael Murtaugh
BIN
img/downarrows.png
Normal file
BIN
img/downarrows.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.4 KiB |
BIN
img/hamburger.png
Normal file
BIN
img/hamburger.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 223 B |
BIN
img/search.png
Normal file
BIN
img/search.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 637 B |
BIN
img/uparrows.png
Normal file
BIN
img/uparrows.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
73
index.frame.html
Normal file
73
index.frame.html
Normal file
@@ -0,0 +1,73 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title></title>
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<link rel="stylesheet" type="text/css" href="style.css">
|
||||||
|
<style>
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
#page {
|
||||||
|
position: absolute;
|
||||||
|
left: 0; right: 0; top: 0;
|
||||||
|
height: 160vh;
|
||||||
|
text-align: center;
|
||||||
|
background: gray;
|
||||||
|
}
|
||||||
|
#page.touched {
|
||||||
|
background: #444;
|
||||||
|
}
|
||||||
|
#bottompane {
|
||||||
|
position: absolute;
|
||||||
|
top: 60vh;
|
||||||
|
left: 0; right: 0;
|
||||||
|
height: 100vh;
|
||||||
|
z-index: 2;
|
||||||
|
}
|
||||||
|
#bottompane iframe {
|
||||||
|
border: none;
|
||||||
|
width: 100%;
|
||||||
|
max-width: 800px;
|
||||||
|
height: 100%;
|
||||||
|
background: white;
|
||||||
|
}
|
||||||
|
#debug {
|
||||||
|
font-size: 10px;
|
||||||
|
height: 8em;
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
#cats {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
iframe#svg {
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="page">
|
||||||
|
<iframe id="svg" src="map.html"></iframe>
|
||||||
|
<div id="bottompane">
|
||||||
|
<iframe id="wikiframe" src="/mw"></iframe>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="cats" class="expanded">
|
||||||
|
<div class="ocontents">
|
||||||
|
<div class="contents">
|
||||||
|
<div class="head">Liste des catégories</div>
|
||||||
|
<div class="body"></div>
|
||||||
|
<div class="foot"><input id="allcats" type="checkbox"><label for="allcats">Afficher tous</label></div>
|
||||||
|
<hr>
|
||||||
|
<div class="history"><input id="history" type="checkbox"><label for="history">Histoire</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="botright"><div class="thumb"></div></div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
<script src="custom_scroller_iframe.js"></script>
|
||||||
|
<script>
|
||||||
|
custom_scroller_iframe(document.scrollingElement, document.getElementById("wikiframe"));
|
||||||
|
</script>
|
||||||
|
</html>
|
||||||
140
map.html
Normal file
140
map.html
Normal file
@@ -0,0 +1,140 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title></title>
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<link rel="stylesheet" type="text/css" href="style.css">
|
||||||
|
<style>
|
||||||
|
svg {
|
||||||
|
position: absolute;
|
||||||
|
left: 0; top: 0;
|
||||||
|
border: 1px solid aqua;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="page">
|
||||||
|
<svg id="svg" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"></svg>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
<script type="text/javascript" src="dist/wikimaptotal.js"></script>
|
||||||
|
<script>
|
||||||
|
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;
|
||||||
|
|
||||||
|
|
||||||
|
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");
|
||||||
|
return;
|
||||||
|
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);
|
||||||
|
// }
|
||||||
|
var URLPAT = new RegExp("http://wiki.erg.be/mw/index.php/(.+)");
|
||||||
|
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 = URLPAT.exec(href);
|
||||||
|
if (m !== null) {
|
||||||
|
return decodeURI(m[1]).replace(/_/g, " ");
|
||||||
|
}
|
||||||
|
console.log("m", m);
|
||||||
|
}
|
||||||
|
function wiki_title_to_url (title) {
|
||||||
|
return "http://wiki.erg.be/mw/index.php/"+encodeURI(title.replace(/ /g, "_"));
|
||||||
|
}
|
||||||
|
window.addEventListener("DOMContentLoaded", doload);
|
||||||
|
</script>
|
||||||
|
<noscript>
|
||||||
|
iframe.addEventListener("load", function () {
|
||||||
|
var href = strip_fragment(iframe.contentWindow.location.href);
|
||||||
|
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);
|
||||||
|
})
|
||||||
|
</noscript>
|
||||||
|
</html>
|
||||||
116
test/index.html
Normal file
116
test/index.html
Normal file
@@ -0,0 +1,116 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>wikiframe test 3</title>
|
||||||
|
<meta name="viewport" content="width=device-width">
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<style type="text/css">
|
||||||
|
body {
|
||||||
|
overflow: hidden;
|
||||||
|
background: pink;
|
||||||
|
}
|
||||||
|
#map {
|
||||||
|
position: absolute;
|
||||||
|
left: 0; top: 0;
|
||||||
|
bottom: 40vh; right: 0;
|
||||||
|
z-index: 0;
|
||||||
|
background: black;
|
||||||
|
}
|
||||||
|
#map #radio {
|
||||||
|
position: absolute;
|
||||||
|
left: 10px;
|
||||||
|
bottom: 10px;
|
||||||
|
width: 360px;
|
||||||
|
height: 60px;
|
||||||
|
}
|
||||||
|
#map a {
|
||||||
|
position: relative;
|
||||||
|
left: 200px;
|
||||||
|
top: 200px;
|
||||||
|
}
|
||||||
|
#pagediv {
|
||||||
|
position: absolute;
|
||||||
|
left: 0; top: 0;
|
||||||
|
bottom: 0; right: 0;
|
||||||
|
z-index: 0;
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
#page {
|
||||||
|
position: absolute;
|
||||||
|
left: 0; right: 0;
|
||||||
|
top: 60vh;
|
||||||
|
height: 100vh;
|
||||||
|
}
|
||||||
|
#page iframe {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
border: none;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="pagediv">
|
||||||
|
<div id="map"><a href="#">map</a>
|
||||||
|
|
||||||
|
<div id="radio"><iframe width="100%" height="60" src="https://www.mixcloud.com/widget/iframe/?hide_cover=1&mini=1&feed=%2FErgote_Radio%2Fmagma-reclaim-the-climax-publication-exposition-documentation%2F" frameborder="0" ></iframe></div>
|
||||||
|
</div>
|
||||||
|
<div id="page">
|
||||||
|
<iframe src="/mw"></iframe>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
<script>
|
||||||
|
(function () {
|
||||||
|
|
||||||
|
var pagediv = document.querySelector("#pagediv"),
|
||||||
|
page = document.querySelector("#page"),
|
||||||
|
iframe = document.querySelector("iframe"),
|
||||||
|
scroll_elt = pagediv;
|
||||||
|
|
||||||
|
pagediv.scrollTop = 0;
|
||||||
|
|
||||||
|
pagediv.addEventListener("scroll", function () {
|
||||||
|
var sh = pagediv.scrollHeight,
|
||||||
|
sp = pagediv.scrollTop;
|
||||||
|
console.log("scroll", sp, sh);
|
||||||
|
if (pagediv.scrollHeight - pagediv.scrollTop === pagediv.clientHeight) {
|
||||||
|
console.log("END OF SCROLL");
|
||||||
|
set_scroll_elt(iframe);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
function set_scroll_elt (elt) {
|
||||||
|
if (scroll_elt === elt) { return; }
|
||||||
|
scroll_elt = elt;
|
||||||
|
if (scroll_elt === pagediv) {
|
||||||
|
pagediv.scrollTop = pagediv.scrollHeight - pagediv.clientHeight - 10;
|
||||||
|
pagediv.style.overflow = "auto";
|
||||||
|
iframe.contentWindow.document.body.style.overflow = "hidden";
|
||||||
|
} else {
|
||||||
|
pagediv.style.overflow = "hidden";
|
||||||
|
iframe.contentWindow.document.body.style.overflow = "auto";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
iframe.addEventListener("load", function () {
|
||||||
|
// var ifh = iframe.contentWindow.document.body.scrollHeight;
|
||||||
|
var ifbody = iframe.contentWindow.document.body;
|
||||||
|
var sd = iframe.contentDocument.scrollingElement
|
||||||
|
console.log("scrolling element", sd);
|
||||||
|
ifbody.style.overflow = "hidden";
|
||||||
|
iframe.contentWindow.addEventListener("scroll", function () {
|
||||||
|
var stm = sd.scrollHeight - sd.clientHeight;
|
||||||
|
console.log("pagescroll", sd.scrollTop, stm);
|
||||||
|
if (sd.scrollTop == 0) {
|
||||||
|
set_scroll_elt(pagediv);
|
||||||
|
}
|
||||||
|
})
|
||||||
|
// console.log("load", ifh);
|
||||||
|
// page.style.height = ifh+"px";
|
||||||
|
});
|
||||||
|
|
||||||
|
})
|
||||||
|
|
||||||
|
</script>
|
||||||
|
</html>
|
||||||
43
test/index2.html
Normal file
43
test/index2.html
Normal file
@@ -0,0 +1,43 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>mobile map test</title>
|
||||||
|
<meta name="viewport" content="width=device-width">
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<style type="text/css">
|
||||||
|
#content {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;top: 0;
|
||||||
|
bottom: 0; right: 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
border: 5px solid gray;
|
||||||
|
}
|
||||||
|
#page {
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
bottom: 0;
|
||||||
|
background: gray;
|
||||||
|
|
||||||
|
}
|
||||||
|
#page .expand {
|
||||||
|
position: absolute;
|
||||||
|
right: 5%;
|
||||||
|
top: 5%;
|
||||||
|
font-size: 32px;
|
||||||
|
color: white;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="content">
|
||||||
|
<div id="search">header/search bar</div>
|
||||||
|
<div id="map">map</div>
|
||||||
|
<div id="page">
|
||||||
|
<h2>This is a compact page</h2>
|
||||||
|
<p>Swipe up to read more. Using <a href="https://css-tricks.com/simple-swipe-with-vanilla-javascript/">this site</a> for simple swipe inspiration. Also <a href="https://css-tricks.com/snippets/html/responsive-meta-tag/">meta tags</a>.</p>
|
||||||
|
<div class="expand">↑</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
43
test/index3.html
Normal file
43
test/index3.html
Normal file
@@ -0,0 +1,43 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>wikiframe test</title>
|
||||||
|
<meta name="viewport" content="width=device-width">
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<style type="text/css">
|
||||||
|
body {
|
||||||
|
overflow: hidden;
|
||||||
|
background: pink;
|
||||||
|
}
|
||||||
|
#content {
|
||||||
|
position: absolute;
|
||||||
|
left: 0; top: 0;
|
||||||
|
bottom: 0; right: 0;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
#map {
|
||||||
|
position: absolute;
|
||||||
|
left: 0; top: 0;
|
||||||
|
bottom: 0; right: 0;
|
||||||
|
z-index: 0;
|
||||||
|
}
|
||||||
|
#map a {
|
||||||
|
position: relative;
|
||||||
|
left: 200px;
|
||||||
|
top: 200px;
|
||||||
|
}
|
||||||
|
#content iframe {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="map"><a href="#">map</a></div>
|
||||||
|
<div id="content">
|
||||||
|
<iframe src="/mw"></iframe>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
57
test/index4.html
Normal file
57
test/index4.html
Normal file
@@ -0,0 +1,57 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>wikiframe test 3</title>
|
||||||
|
<meta name="viewport" content="width=device-width">
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<style type="text/css">
|
||||||
|
body {
|
||||||
|
overflow: auto;
|
||||||
|
background: pink;
|
||||||
|
}
|
||||||
|
#map {
|
||||||
|
position: absolute;
|
||||||
|
left: 0; top: 0;
|
||||||
|
bottom: 0; right: 0;
|
||||||
|
z-index: 0;
|
||||||
|
}
|
||||||
|
#map a {
|
||||||
|
position: relative;
|
||||||
|
left: 200px;
|
||||||
|
top: 200px;
|
||||||
|
}
|
||||||
|
#page {
|
||||||
|
position: absolute;
|
||||||
|
left: 0; right: 0;
|
||||||
|
top: 60vh;
|
||||||
|
height: 40vh;
|
||||||
|
}
|
||||||
|
#page iframe {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="map"><a href="#">map</a></div>
|
||||||
|
<div id="page">
|
||||||
|
<iframe src="/mw"></iframe>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
<script>
|
||||||
|
var page = document.querySelector("#page"),
|
||||||
|
iframe = document.querySelector("iframe");
|
||||||
|
|
||||||
|
iframe.addEventListener("load", function () {
|
||||||
|
var ifh = iframe.contentWindow.document.body.scrollHeight;
|
||||||
|
console.log("load", ifh);
|
||||||
|
page.style.height = ifh+"px";
|
||||||
|
});
|
||||||
|
window.addEventListener("resize", function () {
|
||||||
|
var ifh = iframe.contentWindow.document.body.scrollHeight;
|
||||||
|
console.log("load", ifh);
|
||||||
|
page.style.height = ifh+"px";
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
</html>
|
||||||
44
test/index5.html
Normal file
44
test/index5.html
Normal file
@@ -0,0 +1,44 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>wikiframe test 3</title>
|
||||||
|
<meta name="viewport" content="width=device-width">
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<style type="text/css">
|
||||||
|
body {
|
||||||
|
overflow: auto;
|
||||||
|
background: pink;
|
||||||
|
}
|
||||||
|
#map {
|
||||||
|
position: absolute;
|
||||||
|
left: 0; top: 0;
|
||||||
|
bottom: 0; right: 0;
|
||||||
|
z-index: 0;
|
||||||
|
}
|
||||||
|
#map a {
|
||||||
|
position: relative;
|
||||||
|
left: 200px;
|
||||||
|
top: 200px;
|
||||||
|
}
|
||||||
|
#page {
|
||||||
|
position: absolute;
|
||||||
|
left: 0; right: 0;
|
||||||
|
top: 60vh;
|
||||||
|
height: 100vh;
|
||||||
|
}
|
||||||
|
#page iframe {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="map"><a href="#">map</a></div>
|
||||||
|
<div id="page">
|
||||||
|
<iframe src="/mw"></iframe>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
<script>
|
||||||
|
</script>
|
||||||
|
</html>
|
||||||
Reference in New Issue
Block a user