changement vers nouveau fichier css custom

.gitignore

@@ -1,3 +1,6 @@
 package-lock.json
 venv/
 node_modules/
+*~
+*.swp
+*.swo

LICENSE

@@ -0,0 +1,170 @@
+Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International
+
+ Creative Commons Corporation (“Creative Commons”) is not a law firm and does not provide legal services or legal advice. Distribution of Creative Commons public licenses does not create a lawyer-client or other relationship. Creative Commons makes its licenses and related information available on an “as-is” basis. Creative Commons gives no warranties regarding its licenses, any material licensed under their terms and conditions, or any related information. Creative Commons disclaims all liability for damages resulting from their use to the fullest extent possible.
+
+Using Creative Commons Public Licenses
+
+Creative Commons public licenses provide a standard set of terms and conditions that creators and other rights holders may use to share original works of authorship and other material subject to copyright and certain other rights specified in the public license below. The following considerations are for informational purposes only, are not exhaustive, and do not form part of our licenses.
+
+Considerations for licensors: Our public licenses are intended for use by those authorized to give the public permission to use material in ways otherwise restricted by copyright and certain other rights. Our licenses are irrevocable. Licensors should read and understand the terms and conditions of the license they choose before applying it. Licensors should also secure all rights necessary before applying our licenses so that the public can reuse the material as expected. Licensors should clearly mark any material not subject to the license. This includes other CC-licensed material, or material used under an exception or limitation to copyright. More considerations for licensors.
+
+Considerations for the public: By using one of our public licenses, a licensor grants the public permission to use the licensed material under specified terms and conditions. If the licensor’s permission is not necessary for any reason–for example, because of any applicable exception or limitation to copyright–then that use is not regulated by the license. Our licenses grant only permissions under copyright and certain other rights that a licensor has authority to grant. Use of the licensed material may still be restricted for other reasons, including because others have copyright or other rights in the material. A licensor may make special requests, such as asking that all changes be marked or described. Although not required by our licenses, you are encouraged to respect those requests where reasonable. More considerations for the public.
+
+Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International Public License
+
+By exercising the Licensed Rights (defined below), You accept and agree to be bound by the terms and conditions of this Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International Public License ("Public License"). To the extent this Public License may be interpreted as a contract, You are granted the Licensed Rights in consideration of Your acceptance of these terms and conditions, and the Licensor grants You such rights in consideration of benefits the Licensor receives from making the Licensed Material available under these terms and conditions.
+
+Section 1 – Definitions.
+
+     a.	Adapted Material means material subject to Copyright and Similar Rights that is derived from or based upon the Licensed Material and in which the Licensed Material is translated, altered, arranged, transformed, or otherwise modified in a manner requiring permission under the Copyright and Similar Rights held by the Licensor. For purposes of this Public License, where the Licensed Material is a musical work, performance, or sound recording, Adapted Material is always produced where the Licensed Material is synched in timed relation with a moving image.
+
+     b.	Adapter's License means the license You apply to Your Copyright and Similar Rights in Your contributions to Adapted Material in accordance with the terms and conditions of this Public License.
+
+     c.	BY-NC-SA Compatible License means a license listed at creativecommons.org/compatiblelicenses, approved by Creative Commons as essentially the equivalent of this Public License.
+
+     d.	Copyright and Similar Rights means copyright and/or similar rights closely related to copyright including, without limitation, performance, broadcast, sound recording, and Sui Generis Database Rights, without regard to how the rights are labeled or categorized. For purposes of this Public License, the rights specified in Section 2(b)(1)-(2) are not Copyright and Similar Rights.
+
+     e.	Effective Technological Measures means those measures that, in the absence of proper authority, may not be circumvented under laws fulfilling obligations under Article 11 of the WIPO Copyright Treaty adopted on December 20, 1996, and/or similar international agreements.
+
+     f.	Exceptions and Limitations means fair use, fair dealing, and/or any other exception or limitation to Copyright and Similar Rights that applies to Your use of the Licensed Material.
+
+     g.	License Elements means the license attributes listed in the name of a Creative Commons Public License. The License Elements of this Public License are Attribution, NonCommercial, and ShareAlike.
+
+     h.	Licensed Material means the artistic or literary work, database, or other material to which the Licensor applied this Public License.
+
+     i.	Licensed Rights means the rights granted to You subject to the terms and conditions of this Public License, which are limited to all Copyright and Similar Rights that apply to Your use of the Licensed Material and that the Licensor has authority to license.
+
+     j.	Licensor means the individual(s) or entity(ies) granting rights under this Public License.
+
+     k.	NonCommercial means not primarily intended for or directed towards commercial advantage or monetary compensation. For purposes of this Public License, the exchange of the Licensed Material for other material subject to Copyright and Similar Rights by digital file-sharing or similar means is NonCommercial provided there is no payment of monetary compensation in connection with the exchange.
+
+     l.	Share means to provide material to the public by any means or process that requires permission under the Licensed Rights, such as reproduction, public display, public performance, distribution, dissemination, communication, or importation, and to make material available to the public including in ways that members of the public may access the material from a place and at a time individually chosen by them.
+
+     m.	Sui Generis Database Rights means rights other than copyright resulting from Directive 96/9/EC of the European Parliament and of the Council of 11 March 1996 on the legal protection of databases, as amended and/or succeeded, as well as other essentially equivalent rights anywhere in the world.
+
+     n.	You means the individual or entity exercising the Licensed Rights under this Public License. Your has a corresponding meaning.
+
+Section 2 – Scope.
+
+     a.	License grant.
+
+          1. Subject to the terms and conditions of this Public License, the Licensor hereby grants You a worldwide, royalty-free, non-sublicensable, non-exclusive, irrevocable license to exercise the Licensed Rights in the Licensed Material to:
+
+               A. reproduce and Share the Licensed Material, in whole or in part, for NonCommercial purposes only; and
+
+               B. produce, reproduce, and Share Adapted Material for NonCommercial purposes only.
+
+          2. Exceptions and Limitations. For the avoidance of doubt, where Exceptions and Limitations apply to Your use, this Public License does not apply, and You do not need to comply with its terms and conditions.
+
+          3. Term. The term of this Public License is specified in Section 6(a).
+
+          4. Media and formats; technical modifications allowed. The Licensor authorizes You to exercise the Licensed Rights in all media and formats whether now known or hereafter created, and to make technical modifications necessary to do so. The Licensor waives and/or agrees not to assert any right or authority to forbid You from making technical modifications necessary to exercise the Licensed Rights, including technical modifications necessary to circumvent Effective Technological Measures. For purposes of this Public License, simply making modifications authorized by this Section 2(a)(4) never produces Adapted Material.
+
+          5. Downstream recipients.
+
+               A. Offer from the Licensor – Licensed Material. Every recipient of the Licensed Material automatically receives an offer from the Licensor to exercise the Licensed Rights under the terms and conditions of this Public License.
+
+               B. Additional offer from the Licensor – Adapted Material. Every recipient of Adapted Material from You automatically receives an offer from the Licensor to exercise the Licensed Rights in the Adapted Material under the conditions of the Adapter’s License You apply.
+
+               C. No downstream restrictions. You may not offer or impose any additional or different terms or conditions on, or apply any Effective Technological Measures to, the Licensed Material if doing so restricts exercise of the Licensed Rights by any recipient of the Licensed Material.
+
+          6. No endorsement. Nothing in this Public License constitutes or may be construed as permission to assert or imply that You are, or that Your use of the Licensed Material is, connected with, or sponsored, endorsed, or granted official status by, the Licensor or others designated to receive attribution as provided in Section 3(a)(1)(A)(i).
+
+     b.	Other rights.
+
+          1. Moral rights, such as the right of integrity, are not licensed under this Public License, nor are publicity, privacy, and/or other similar personality rights; however, to the extent possible, the Licensor waives and/or agrees not to assert any such rights held by the Licensor to the limited extent necessary to allow You to exercise the Licensed Rights, but not otherwise.
+
+          2. Patent and trademark rights are not licensed under this Public License.
+
+          3. To the extent possible, the Licensor waives any right to collect royalties from You for the exercise of the Licensed Rights, whether directly or through a collecting society under any voluntary or waivable statutory or compulsory licensing scheme. In all other cases the Licensor expressly reserves any right to collect such royalties, including when the Licensed Material is used other than for NonCommercial purposes.
+
+Section 3 – License Conditions.
+
+Your exercise of the Licensed Rights is expressly made subject to the following conditions.
+
+     a.	Attribution.
+
+          1. If You Share the Licensed Material (including in modified form), You must:
+
+               A. retain the following if it is supplied by the Licensor with the Licensed Material:
+
+                    i.	identification of the creator(s) of the Licensed Material and any others designated to receive attribution, in any reasonable manner requested by the Licensor (including by pseudonym if designated);
+
+                    ii.	a copyright notice;
+
+                    iii. a notice that refers to this Public License;
+
+                    iv.	a notice that refers to the disclaimer of warranties;
+
+                    v.	a URI or hyperlink to the Licensed Material to the extent reasonably practicable;
+
+               B. indicate if You modified the Licensed Material and retain an indication of any previous modifications; and
+
+               C. indicate the Licensed Material is licensed under this Public License, and include the text of, or the URI or hyperlink to, this Public License.
+
+          2. You may satisfy the conditions in Section 3(a)(1) in any reasonable manner based on the medium, means, and context in which You Share the Licensed Material. For example, it may be reasonable to satisfy the conditions by providing a URI or hyperlink to a resource that includes the required information.
+
+          3. If requested by the Licensor, You must remove any of the information required by Section 3(a)(1)(A) to the extent reasonably practicable.
+
+     b.	ShareAlike.In addition to the conditions in Section 3(a), if You Share Adapted Material You produce, the following conditions also apply.
+
+          1. The Adapter’s License You apply must be a Creative Commons license with the same License Elements, this version or later, or a BY-NC-SA Compatible License.
+
+          2. You must include the text of, or the URI or hyperlink to, the Adapter's License You apply. You may satisfy this condition in any reasonable manner based on the medium, means, and context in which You Share Adapted Material.
+
+          3. You may not offer or impose any additional or different terms or conditions on, or apply any Effective Technological Measures to, Adapted Material that restrict exercise of the rights granted under the Adapter's License You apply.
+
+Section 4 – Sui Generis Database Rights.
+
+Where the Licensed Rights include Sui Generis Database Rights that apply to Your use of the Licensed Material:
+
+     a.	for the avoidance of doubt, Section 2(a)(1) grants You the right to extract, reuse, reproduce, and Share all or a substantial portion of the contents of the database for NonCommercial purposes only;
+
+     b.	if You include all or a substantial portion of the database contents in a database in which You have Sui Generis Database Rights, then the database in which You have Sui Generis Database Rights (but not its individual contents) is Adapted Material, including for purposes of Section 3(b); and
+
+     c.	You must comply with the conditions in Section 3(a) if You Share all or a substantial portion of the contents of the database.
+For the avoidance of doubt, this Section 4 supplements and does not replace Your obligations under this Public License where the Licensed Rights include other Copyright and Similar Rights.
+
+Section 5 – Disclaimer of Warranties and Limitation of Liability.
+
+     a.	Unless otherwise separately undertaken by the Licensor, to the extent possible, the Licensor offers the Licensed Material as-is and as-available, and makes no representations or warranties of any kind concerning the Licensed Material, whether express, implied, statutory, or other. This includes, without limitation, warranties of title, merchantability, fitness for a particular purpose, non-infringement, absence of latent or other defects, accuracy, or the presence or absence of errors, whether or not known or discoverable. Where disclaimers of warranties are not allowed in full or in part, this disclaimer may not apply to You.
+
+     b.	To the extent possible, in no event will the Licensor be liable to You on any legal theory (including, without limitation, negligence) or otherwise for any direct, special, indirect, incidental, consequential, punitive, exemplary, or other losses, costs, expenses, or damages arising out of this Public License or use of the Licensed Material, even if the Licensor has been advised of the possibility of such losses, costs, expenses, or damages. Where a limitation of liability is not allowed in full or in part, this limitation may not apply to You.
+
+     c.	The disclaimer of warranties and limitation of liability provided above shall be interpreted in a manner that, to the extent possible, most closely approximates an absolute disclaimer and waiver of all liability.
+
+Section 6 – Term and Termination.
+
+     a.	This Public License applies for the term of the Copyright and Similar Rights licensed here. However, if You fail to comply with this Public License, then Your rights under this Public License terminate automatically.
+
+     b.	Where Your right to use the Licensed Material has terminated under Section 6(a), it reinstates:
+
+          1.	automatically as of the date the violation is cured, provided it is cured within 30 days of Your discovery of the violation; or
+
+          2.	upon express reinstatement by the Licensor.
+
+     For the avoidance of doubt, this Section 6(b) does not affect any right the Licensor may have to seek remedies for Your violations of this Public License.
+
+     c.	For the avoidance of doubt, the Licensor may also offer the Licensed Material under separate terms or conditions or stop distributing the Licensed Material at any time; however, doing so will not terminate this Public License.
+
+     d.	Sections 1, 5, 6, 7, and 8 survive termination of this Public License.
+
+Section 7 – Other Terms and Conditions.
+
+     a.	The Licensor shall not be bound by any additional or different terms or conditions communicated by You unless expressly agreed.
+
+     b.	Any arrangements, understandings, or agreements regarding the Licensed Material not stated herein are separate from and independent of the terms and conditions of this Public License.
+
+Section 8 – Interpretation.
+
+     a.	For the avoidance of doubt, this Public License does not, and shall not be interpreted to, reduce, limit, restrict, or impose conditions on any use of the Licensed Material that could lawfully be made without permission under this Public License.
+
+     b.	To the extent possible, if any provision of this Public License is deemed unenforceable, it shall be automatically reformed to the minimum extent necessary to make it enforceable. If the provision cannot be reformed, it shall be severed from this Public License without affecting the enforceability of the remaining terms and conditions.
+
+     c.	No term or condition of this Public License will be waived and no failure to comply consented to unless expressly agreed to by the Licensor.
+
+     d.	Nothing in this Public License constitutes or may be interpreted as a limitation upon, or waiver of, any privileges and immunities that apply to the Licensor or You, including from the legal processes of any jurisdiction or authority.
+
+Creative Commons is not a party to its public licenses. Notwithstanding, Creative Commons may elect to apply one of its public licenses to material it publishes and in those instances will be considered the “Licensor.” Except for the limited purpose of indicating that material is shared under a Creative Commons public license or as otherwise permitted by the Creative Commons policies published at creativecommons.org/policies, Creative Commons does not authorize the use of the trademark “Creative Commons” or any other trademark or logo of Creative Commons without its prior written consent including, without limitation, in connection with any unauthorized modifications to any of its public licenses or any other arrangements, understandings, or agreements concerning use of licensed material. For the avoidance of doubt, this paragraph does not form part of the public licenses.
+
+Creative Commons may be contacted at creativecommons.org.

README.md

@@ -1,9 +1,12 @@
 
+# map
 
+La carte intéractive du site de l'erg. Dévellopper en jquery, utilisant leaflet.
 
 Development
 ===============
 
 To rebuild the javascript, you need to use node + rollup.
-
+```
     npm install
+```

dist/index.00.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 app.Map(symbols);
+
+map.init_svg("#svg");
+async function doload () {
+    console.log("loading map");
+    await map.load_json("data/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);
+})

dist/index.js

@@ -1,21 +1,18 @@
-// custom_scroller_menu(
-//     document.scrollingElement,
-//     document.getElementById("menubar"),
-//     document.getElementById("debug"));
 
 var svg = document.querySelector("#svg"),
-    page = document.querySelector("#page"),
     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;
-
+    map = new app.Map({
+        apiurl: "/mw/api.php",
+        symbols: "src/legend.json",
+        svg: "#svg",
+        categorylabel: "Catégorie",
+        categorydiv: "#cats .body",
+	// permet de controler le niveau de zoom de la carte
+        zoom: 3,
+    }),
+    zoom_in = document.querySelector(".leaflet-control-zoom-in"),
+    zoom_out = document.querySelector(".leaflet-control-zoom-out"),
+    cats = document.querySelector("#cats");
 
 window.addEventListener("resize", resize);
 function resize() {
@@ -33,102 +30,83 @@ function resize() {
     svg.setAttribute("width", page.clientWidth);
     svg.setAttribute("height", page.clientHeight);
 
+    // Checks if narrow device
+    if (x>600){ g.querySelector("#cats").classList.add("expanded")}
 }
-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 app.Map(symbols);
-
-map.init_svg("#svg");
 async function doload () {
-    console.log("loading map");
-    await map.load_json("data/sitemap.json");
-    // console.log("loading categories");
-    // await map.load_cats("data/cats.json", cats_contents);
-    await map.load_legend("src/legend.json", cats_contents);
-    console.log("LOADED!");
-    loaded = true;
-    if (current_title) {
-        map.set_active_title(current_title);
-    }
-}
+    resize();
+    console.log("map.init");
+    await map.init();
+    console.log("map.init: done");
 
-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, "_"));
+    map.on("page", function (page) {
+        // console.log("map.page", page.title);
+        var url = page.url();
+        if (iframe.src !== url) {
+            // console.log("setting iframe src to", url);
+            iframe.src = url;
+        }
+    })
+    zoom_in.addEventListener("click", (e) => {
+        map.zoom_in();
+    })
+    zoom_out.addEventListener("click", (e) => {
+        map.zoom_out();
+    })
 }
 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
-
+    map.set_active_url(iframe.contentWindow.location.href);
 });
 
-cats_thumb.addEventListener("click", function () {
+cats.addEventListener("click", e => {
     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")            
+
+var specialselect = document.querySelector("select#special"),
+    // specialselectdiv = document.getElementById("specialselectdiv"),
+    specialiframediv = document.getElementById("specialiframediv"),
+    specialiframe = null,
+    specialsrc = null,
+    specialclosediv = document.getElementById("specialclosediv"),
+    specialclosebutton = document.getElementById("specialclosebutton");
+
+function set_special (v) {
+    if (specialsrc !== v) {
+        specialsrc = v;
+        specialselect.value = v;
+        if (specialsrc !== "") {
+            if (specialiframe == null) {
+        //  <iframe id="specialframe" name="specialframe" src="/m/special/recentfiles/recentfiles.html"></iframe>
+                specialiframe = document.createElement('iframe');
+                specialiframediv.appendChild(specialiframe);
+            }
+            // console.log("specialiframe.src", specialiframe.src)
+            if (specialiframe.getAttribute("src") != specialsrc) {
+                console.log("setAttribute iframe src", specialsrc);
+                specialiframe.setAttribute("src", specialsrc);
+            }
+            specialiframediv.style.display = "block";
+            specialclosediv.style.display = "block";
+        } else {
+            // show map
+            // if (specialiframe) {
+            //     specialiframe.src = "";
+            //     specialiframediv.removeChild(specialiframe);
+            //     specialiframe = null;
+            // }
+            specialiframediv.style.display = "none";
+            specialclosediv.style.display = "none";
+        }
     }
-})
-historycb.addEventListener("change", function () {
-    // console.log("history", historycb.checked);
-    map.set_show_history(historycb.checked);
-})
+}
+set_special(specialselect.value);
+specialclosebutton.addEventListener("click", function (e) {
+    e.preventDefault();
+    set_special("");
+});
+specialselect.addEventListener("input", function (e) {
+    console.log("specialselect", specialselect.value);
+    set_special(specialselect.value);
+});

img/symbols.orig.svg

@@ -0,0 +1,198 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="210mm"
+   height="297mm"
+   viewBox="0 0 210 297"
+   version="1.1"
+   id="svg8"
+   inkscape:version="0.92.1 r15371"
+   sodipodi:docname="symbols.svg">
+  <defs
+     id="defs2" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="2.8284271"
+     inkscape:cx="216.47094"
+     inkscape:cy="1066.4499"
+     inkscape:document-units="mm"
+     inkscape:current-layer="layer1"
+     showgrid="false"
+     inkscape:window-width="1366"
+     inkscape:window-height="704"
+     inkscape:window-x="0"
+     inkscape:window-y="27"
+     inkscape:window-maximized="1" />
+  <metadata
+     id="metadata5">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <g
+       id="g4669"
+       inkscape:export-xdpi="101.24"
+       inkscape:export-ydpi="101.24">
+      <g
+         style="stroke:#606060;stroke-opacity:1"
+         transform="matrix(0.42450461,0,0,0.42450461,19.61278,7.9970163)"
+         id="g4600">
+        <path
+           style="fill:none;stroke:#606060;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+           d="m 78.937409,12.378389 h 12.06565"
+           id="path4572"
+           inkscape:connector-curvature="0" />
+        <path
+           style="fill:none;stroke:#606060;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+           d="m 78.937409,15.438998 h 12.06565"
+           id="path4572-6"
+           inkscape:connector-curvature="0" />
+        <path
+           style="fill:none;stroke:#606060;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+           d="m 78.859443,18.646139 h 12.06565"
+           id="path4572-2"
+           inkscape:connector-curvature="0" />
+      </g>
+      <rect
+         y="10.81856"
+         x="51.903004"
+         height="7.5269685"
+         width="7.5269685"
+         id="rect4602"
+         style="fill:none;fill-opacity:1;stroke:none;stroke-width:0.1;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+    </g>
+    <g
+       id="g4676"
+       inkscape:export-xdpi="101.24"
+       inkscape:export-ydpi="101.24">
+      <g
+         inkscape:transform-center-y="-1.5700831"
+         inkscape:transform-center-x="-1.6012813"
+         inkscape:export-ydpi="71.145638"
+         inkscape:export-xdpi="71.145638"
+         transform="matrix(0.43229192,0,0,0.43229192,17.802805,7.5991505)"
+         id="g4513-7">
+        <path
+           style="fill:none;stroke:#606060;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+           d="m 98.928194,14.954166 6.198716,-3.578827 5.9449,3.432289"
+           id="path4487-5"
+           inkscape:connector-curvature="0"
+           inkscape:export-xdpi="71.145638"
+           inkscape:export-ydpi="71.145638" />
+        <path
+           style="fill:none;stroke:#606060;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+           d="m 98.928194,18.014776 6.198716,-3.578828 5.9449,3.432289"
+           id="path4487-3-3"
+           inkscape:connector-curvature="0"
+           inkscape:export-xdpi="71.145638"
+           inkscape:export-ydpi="71.145638" />
+        <path
+           style="fill:none;stroke:#606060;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+           d="m 98.928194,21.075378 6.198716,-3.578827 5.9449,3.432289"
+           id="path4487-6-5"
+           inkscape:connector-curvature="0"
+           inkscape:export-xdpi="71.145638"
+           inkscape:export-ydpi="71.145638" />
+      </g>
+      <rect
+         y="10.81856"
+         x="59.429974"
+         height="7.5269685"
+         width="7.5269685"
+         id="rect4602-9"
+         style="fill:none;fill-opacity:1;stroke:none;stroke-width:0.1;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+    </g>
+    <g
+       id="g4689"
+       inkscape:export-xdpi="101.24"
+       inkscape:export-ydpi="101.24">
+      <g
+         transform="matrix(0.41838874,0,0,0.41838874,27.098315,8.7927188)"
+         id="g4547">
+        <circle
+           style="fill:none;fill-opacity:1;stroke:#606060;stroke-width:0.77449554;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+           id="path4539"
+           cx="121.70833"
+           cy="13.366666"
+           r="4.6106687" />
+        <path
+           style="fill:none;stroke:#606060;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+           d="m 124.78814,16.46054 2.66602,2.478925"
+           id="path4541"
+           inkscape:connector-curvature="0"
+           sodipodi:nodetypes="cc" />
+      </g>
+      <rect
+         y="10.81856"
+         x="74.48391"
+         height="7.5269685"
+         width="7.5269685"
+         id="rect4602-1-2"
+         style="fill:none;fill-opacity:1;stroke:none;stroke-width:0.1;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+    </g>
+    <g
+       id="g4683"
+       inkscape:export-xdpi="101.24"
+       inkscape:export-ydpi="101.24">
+      <rect
+         y="10.81856"
+         x="66.95694"
+         height="7.5269685"
+         width="7.5269685"
+         id="rect4602-1"
+         style="fill:none;fill-opacity:1;stroke:none;stroke-width:0.1;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+      <g
+         inkscape:transform-center-y="1.5700833"
+         inkscape:transform-center-x="1.6012835"
+         inkscape:export-ydpi="71.145638"
+         inkscape:export-xdpi="71.145638"
+         transform="matrix(-0.43229191,0,0,-0.43229191,116.11108,21.564937)"
+         id="g4513-7-7">
+        <path
+           style="fill:none;stroke:#606060;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+           d="m 98.928194,14.954166 6.198716,-3.578827 5.9449,3.432289"
+           id="path4487-5-0"
+           inkscape:connector-curvature="0"
+           inkscape:export-xdpi="71.145638"
+           inkscape:export-ydpi="71.145638" />
+        <path
+           style="fill:none;stroke:#606060;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+           d="m 98.928194,18.014776 6.198716,-3.578828 5.9449,3.432289"
+           id="path4487-3-3-9"
+           inkscape:connector-curvature="0"
+           inkscape:export-xdpi="71.145638"
+           inkscape:export-ydpi="71.145638" />
+        <path
+           style="fill:none;stroke:#606060;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+           d="m 98.928194,21.075378 6.198716,-3.578827 5.9449,3.432289"
+           id="path4487-6-5-3"
+           inkscape:connector-curvature="0"
+           inkscape:export-xdpi="71.145638"
+           inkscape:export-ydpi="71.145638" />
+      </g>
+    </g>
+  </g>
+</svg>

img/symbols.svg

@@ -2,22 +2,23 @@
 <!-- Created with Inkscape (http://www.inkscape.org/) -->
 
 <svg
-   xmlns:dc="http://purl.org/dc/elements/1.1/"
-   xmlns:cc="http://creativecommons.org/ns#"
-   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
-   xmlns:svg="http://www.w3.org/2000/svg"
-   xmlns="http://www.w3.org/2000/svg"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   width="210mm"
-   height="297mm"
-   viewBox="0 0 210 297"
+   width="32.387501mm"
+   height="32.356251mm"
+   viewBox="0 0 32.3875 32.356251"
    version="1.1"
-   id="svg8"
-   inkscape:version="0.92.1 r15371"
-   sodipodi:docname="symbols.svg">
+   id="svg5507"
+   inkscape:version="1.2.1 (9c6d41e410, 2022-07-14, custom)"
+   sodipodi:docname="symbols.svg"
+   enable-background="new"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:dc="http://purl.org/dc/elements/1.1/">
   <defs
-     id="defs2" />
+     id="defs5501" />
   <sodipodi:namedview
      id="base"
      pagecolor="#ffffff"
@@ -25,174 +26,264 @@
      borderopacity="1.0"
      inkscape:pageopacity="0.0"
      inkscape:pageshadow="2"
-     inkscape:zoom="2.8284271"
-     inkscape:cx="216.47094"
-     inkscape:cy="1066.4499"
+     inkscape:zoom="2.968516"
+     inkscape:cx="16.674999"
+     inkscape:cy="41.434845"
      inkscape:document-units="mm"
-     inkscape:current-layer="layer1"
+     inkscape:current-layer="layer2"
      showgrid="false"
-     inkscape:window-width="1366"
-     inkscape:window-height="704"
-     inkscape:window-x="0"
-     inkscape:window-y="27"
-     inkscape:window-maximized="1" />
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:window-width="1362"
+     inkscape:window-height="718"
+     inkscape:window-x="2"
+     inkscape:window-y="48"
+     inkscape:window-maximized="1"
+     inkscape:snap-bbox="true"
+     inkscape:bbox-paths="true"
+     inkscape:bbox-nodes="true"
+     inkscape:snap-bbox-midpoints="true"
+     inkscape:snap-bbox-edge-midpoints="true"
+     inkscape:snap-intersection-paths="true"
+     inkscape:object-paths="true"
+     inkscape:snap-midpoints="true"
+     inkscape:snap-smooth-nodes="true"
+     inkscape:snap-center="true"
+     inkscape:snap-object-midpoints="true"
+     showguides="false"
+     inkscape:guide-bbox="true"
+     inkscape:showpageshadow="0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1">
+    <sodipodi:guide
+       position="1.2695302,37.647915"
+       orientation="0,1"
+       id="guide994"
+       inkscape:locked="false" />
+    <sodipodi:guide
+       position="4.0424514,24.568452"
+       orientation="0,1"
+       id="guide996"
+       inkscape:locked="false" />
+  </sodipodi:namedview>
   <metadata
-     id="metadata5">
+     id="metadata5504">
     <rdf:RDF>
       <cc:Work
          rdf:about="">
         <dc:format>image/svg+xml</dc:format>
         <dc:type
            rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
-        <dc:title></dc:title>
+        <dc:title />
       </cc:Work>
     </rdf:RDF>
   </metadata>
   <g
-     inkscape:label="Layer 1"
      inkscape:groupmode="layer"
-     id="layer1">
+     id="layer2"
+     inkscape:label="Main"
+     style="display:inline">
+    <path
+       id="Main"
+       d="m 0.00702812,-2.920128 c -0.40161335,0 -0.78453276,0.088375 -1.13252892,0.2355662 -0.3479978,0.1471904 -0.660957,0.3619688 -0.9241446,0.6251563 -0.2631876,0.2631876 -0.4779659,0.576147 -0.6251569,0.9241442 -0.1471898,0.34799704 -0.2265059,0.73091595 -0.2265059,1.1325292 0,0.4016138 0.079315,0.7754723 0.2265059,1.1234696 0.147191,0.3479971 0.3619693,0.6700169 0.6251569,0.9332041 0.2631876,0.2631876 0.5761468,0.4689057 0.9241446,0.6160961 0.34799616,0.1471907 0.73091557,0.2355662 1.13252892,0.2355662 0.40161346,0 0.78453263,-0.088375 1.13252898,-0.2355662 C 1.487555,2.5228473 1.800514,2.3171292 2.0637016,2.0539416 2.3268892,1.7907544 2.5416675,1.4687346 2.6888586,1.1207375 2.8360483,0.7727402 2.9153647,0.3988817 2.9153647,-0.0027321 c 0,-0.40161325 -0.079316,-0.78453216 -0.2265061,-1.1325292 C 2.5416675,-1.4832585 2.3268892,-1.7962179 2.0637016,-2.0594055 1.800514,-2.322593 1.487555,-2.5373714 1.1395571,-2.6845618 0.79156075,-2.8317522 0.40864158,-2.920128 0.00702812,-2.920128 Z"
+       style="display:inline;fill:#000000;fill-opacity:1;stroke:#000000;stroke-width:0.927768;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.996154;marker-start:none"
+       inkscape:connector-curvature="0"
+       inkscape:label="#path6386-5-5" />
+  </g>
+  <g
+     inkscape:label="Orientations"
+     inkscape:groupmode="layer"
+     id="layer1"
+     style="display:none">
     <g
-       id="g4669"
-       inkscape:export-xdpi="101.24"
-       inkscape:export-ydpi="101.24">
-      <g
-         style="stroke:#606060;stroke-opacity:1"
-         transform="matrix(0.42450461,0,0,0.42450461,19.61278,7.9970163)"
-         id="g4600">
-        <path
-           style="fill:none;stroke:#606060;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
-           d="m 78.937409,12.378389 h 12.06565"
-           id="path4572"
-           inkscape:connector-curvature="0" />
-        <path
-           style="fill:none;stroke:#606060;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
-           d="m 78.937409,15.438998 h 12.06565"
-           id="path4572-6"
-           inkscape:connector-curvature="0" />
-        <path
-           style="fill:none;stroke:#606060;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
-           d="m 78.859443,18.646139 h 12.06565"
-           id="path4572-2"
-           inkscape:connector-curvature="0" />
-      </g>
-      <rect
-         y="10.81856"
-         x="51.903004"
-         height="7.5269685"
-         width="7.5269685"
-         id="rect4602"
-         style="fill:none;fill-opacity:1;stroke:none;stroke-width:0.1;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
+       id="Orientations"
+       style="fill:none;fill-opacity:1;stroke:#000000;stroke-opacity:0.99615389"
+       transform="matrix(0.40423298,0,0,0.40423298,35.516699,-0.22522322)">
+      <path
+         id="Orientations-0"
+         d="m -87.8577,-14.01912 c -8.05454,0 -14.59375,6.50796 -14.59375,14.5625 0,8.05454 6.53921,14.59375 14.59375,14.59375 8.05454,0 14.59375,-6.53921 14.59375,-14.59375 0,-8.05454 -6.53921,-14.5625 -14.59375,-14.5625 z"
+         style="fill:none;fill-opacity:1;stroke:#000000;stroke-width:3.19999981;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.99615389;marker-start:none"
+         inkscape:connector-curvature="0" />
+      <path
+         id="path6386"
+         d="m -87.7327,-7.2465492 c -1.058962,0 -2.068631,0.2330264 -2.986219,0.6211335 -0.917588,0.3881071 -1.742789,0.9544279 -2.436754,1.6483926 -0.693965,0.6939647 -1.260285,1.5191664 -1.648393,2.4367544 -0.388107,0.917588 -0.597243,1.92725673 -0.597243,2.98621857 0,1.05896183 0.209136,2.04474083 0.597243,2.96232883 0.388108,0.917588 0.954428,1.7666794 1.648393,2.4606441 0.693965,0.6939647 1.519166,1.2363958 2.436754,1.6245029 0.917588,0.3881071 1.927257,0.6211335 2.986219,0.6211335 1.058962,0 2.068631,-0.2330264 2.986219,-0.6211335 0.917588,-0.3881071 1.742789,-0.9305382 2.436754,-1.6245029 0.693965,-0.6939647 1.260285,-1.5430561 1.648393,-2.4606441 0.388107,-0.917588 0.597243,-1.903367 0.597243,-2.96232883 0,-1.05896184 -0.209136,-2.06863057 -0.597243,-2.98621857 -0.388108,-0.917588 -0.954428,-1.7427897 -1.648393,-2.4367544 -0.693965,-0.6939647 -1.519166,-1.2602855 -2.436754,-1.6483926 -0.917588,-0.3881071 -1.927257,-0.6211335 -2.986219,-0.6211335 z"
+         style="fill:none;fill-opacity:1;stroke:#000000;stroke-width:2.44631028;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.99615389;marker-start:none"
+         inkscape:connector-curvature="0" />
     </g>
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer3"
+     inkscape:label="Ateliers_pluridisciplinaires"
+     style="display:none">
     <g
-       id="g4676"
-       inkscape:export-xdpi="101.24"
-       inkscape:export-ydpi="101.24">
+       transform="matrix(0.65256016,0,0,0.65256016,58.839197,-28.341992)"
+       id="Ateliers_pluridisciplinaires"
+       style="fill:none;stroke:#000000">
+      <circle
+         r="19.208878"
+         cy="40.264759"
+         cx="116.73087"
+         transform="matrix(0.36441483,0,0,0.36441483,-132.69908,28.796006)"
+         id="path6780"
+         style="fill:none;fill-opacity:1;stroke:#000000;stroke-width:16.4647522;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;marker-start:none" />
       <g
-         inkscape:transform-center-y="-1.5700831"
-         inkscape:transform-center-x="-1.6012813"
-         inkscape:export-ydpi="71.145638"
-         inkscape:export-xdpi="71.145638"
-         transform="matrix(0.43229192,0,0,0.43229192,17.802805,7.5991505)"
-         id="g4513-7">
+         id="g8172"
+         transform="matrix(2.1333332,0,0,-2.1333332,13.499857,367.42774)"
+         style="fill:none;fill-opacity:0.99615389;stroke:#000000;stroke-opacity:0.98846154">
         <path
-           style="fill:none;stroke:#606060;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
-           d="m 98.928194,14.954166 6.198716,-3.578827 5.9449,3.432289"
-           id="path4487-5"
-           inkscape:connector-curvature="0"
-           inkscape:export-xdpi="71.145638"
-           inkscape:export-ydpi="71.145638" />
-        <path
-           style="fill:none;stroke:#606060;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
-           d="m 98.928194,18.014776 6.198716,-3.578828 5.9449,3.432289"
-           id="path4487-3-3"
-           inkscape:connector-curvature="0"
-           inkscape:export-xdpi="71.145638"
-           inkscape:export-ydpi="71.145638" />
-        <path
-           style="fill:none;stroke:#606060;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
-           d="m 98.928194,21.075378 6.198716,-3.578827 5.9449,3.432289"
-           id="path4487-6-5"
-           inkscape:connector-curvature="0"
-           inkscape:export-xdpi="71.145638"
-           inkscape:export-ydpi="71.145638" />
-      </g>
-      <rect
-         y="10.81856"
-         x="59.429974"
-         height="7.5269685"
-         width="7.5269685"
-         id="rect4602-9"
-         style="fill:none;fill-opacity:1;stroke:none;stroke-width:0.1;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
-    </g>
-    <g
-       id="g4689"
-       inkscape:export-xdpi="101.24"
-       inkscape:export-ydpi="101.24">
-      <g
-         transform="matrix(0.41838874,0,0,0.41838874,27.098315,8.7927188)"
-         id="g4547">
-        <circle
-           style="fill:none;fill-opacity:1;stroke:#606060;stroke-width:0.77449554;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
-           id="path4539"
-           cx="121.70833"
-           cy="13.366666"
-           r="4.6106687" />
-        <path
-           style="fill:none;stroke:#606060;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
-           d="m 124.78814,16.46054 2.66602,2.478925"
-           id="path4541"
-           inkscape:connector-curvature="0"
-           sodipodi:nodetypes="cc" />
-      </g>
-      <rect
-         y="10.81856"
-         x="74.48391"
-         height="7.5269685"
-         width="7.5269685"
-         id="rect4602-1-2"
-         style="fill:none;fill-opacity:1;stroke:none;stroke-width:0.1;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
-    </g>
-    <g
-       id="g4683"
-       inkscape:export-xdpi="101.24"
-       inkscape:export-ydpi="101.24">
-      <rect
-         y="10.81856"
-         x="66.95694"
-         height="7.5269685"
-         width="7.5269685"
-         id="rect4602-1"
-         style="fill:none;fill-opacity:1;stroke:none;stroke-width:0.1;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" />
-      <g
-         inkscape:transform-center-y="1.5700833"
-         inkscape:transform-center-x="1.6012835"
-         inkscape:export-ydpi="71.145638"
-         inkscape:export-xdpi="71.145638"
-         transform="matrix(-0.43229191,0,0,-0.43229191,116.11108,21.564937)"
-         id="g4513-7-7">
-        <path
-           style="fill:none;stroke:#606060;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
-           d="m 98.928194,14.954166 6.198716,-3.578827 5.9449,3.432289"
-           id="path4487-5-0"
-           inkscape:connector-curvature="0"
-           inkscape:export-xdpi="71.145638"
-           inkscape:export-ydpi="71.145638" />
-        <path
-           style="fill:none;stroke:#606060;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
-           d="m 98.928194,18.014776 6.198716,-3.578828 5.9449,3.432289"
-           id="path4487-3-3-9"
-           inkscape:connector-curvature="0"
-           inkscape:export-xdpi="71.145638"
-           inkscape:export-ydpi="71.145638" />
-        <path
-           style="fill:none;stroke:#606060;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
-           d="m 98.928194,21.075378 6.198716,-3.578827 5.9449,3.432289"
-           id="path4487-6-5-3"
-           inkscape:connector-curvature="0"
-           inkscape:export-xdpi="71.145638"
-           inkscape:export-ydpi="71.145638" />
+           transform="matrix(0.05856667,0,0,-0.05856667,-55.427399,154.21379)"
+           style="fill:none;fill-opacity:0.99615389;stroke:#000000;stroke-width:0;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.98846154;marker-start:none"
+           d="M 135.93975,40.264759 A 19.208878,19.208878 0 0 1 116.73087,59.473637 19.208878,19.208878 0 0 1 97.521996,40.264759 19.208878,19.208878 0 0 1 116.73087,21.055882 19.208878,19.208878 0 0 1 135.93975,40.264759 Z"
+           id="path8174"
+           inkscape:connector-curvature="0" />
       </g>
     </g>
   </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer4"
+     inkscape:label="Cours_de_soutien_a_l_orientation"
+     style="display:none">
+    <g
+       id="Cours_de_soutien_a_l_orientation"
+       style="display:inline;fill:none;fill-opacity:1;stroke:#000000;stroke-opacity:0.99615389"
+       transform="matrix(0.40423297,0,0,0.40423297,35.552134,-0.25339243)"
+       inkscape:label="#Cours_de_soutien_a_l'orientation">
+      <path
+         id="Orientations-0-7"
+         d="m -87.940348,-13.895148 c -8.05454,0 -14.593742,6.5079588 -14.593742,14.56249871 0,8.05454009 6.539202,14.59375129 14.593742,14.59375129 8.05454,0 14.59375,-6.5392112 14.59375,-14.59375129 0,-8.05453991 -6.53921,-14.56249871 -14.59375,-14.56249871 z"
+         style="fill:none;fill-opacity:1;stroke:#000000;stroke-width:3.19999981;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.99615389;marker-start:none"
+         inkscape:connector-curvature="0" />
+      <path
+         id="path6386-5"
+         d="m -87.815348,-5.0851598 c -0.778051,0 -1.519886,0.1712117 -2.194064,0.4563657 -0.674181,0.285154 -1.280481,0.7012471 -1.790358,1.2111239 -0.509877,0.509877 -0.92597,1.1161775 -1.211125,1.7903572 -0.285153,0.67417963 -0.438813,1.41601363 -0.438813,2.19406488 0,0.77805152 0.15366,1.50233312 0.438813,2.17651272 0.285155,0.6741797 0.701248,1.2980328 1.211125,1.8079096 0.509877,0.5098769 1.116177,0.9084175 1.790358,1.1935714 0.674178,0.2851541 1.416013,0.4563658 2.194064,0.4563658 0.778051,0 1.519886,-0.1712117 2.194064,-0.4563658 0.674181,-0.2851539 1.280481,-0.6836945 1.790358,-1.1935714 0.509877,-0.5098768 0.92597,-1.1337299 1.211125,-1.8079096 0.285153,-0.6741796 0.438813,-1.3984612 0.438813,-2.17651272 0,-0.77805125 -0.15366,-1.51988525 -0.438813,-2.19406488 -0.285155,-0.6741797 -0.701248,-1.2804802 -1.211125,-1.7903572 -0.509877,-0.5098768 -1.116177,-0.9259699 -1.790358,-1.2111239 -0.674178,-0.285154 -1.416013,-0.4563657 -2.194064,-0.4563657 z"
+         style="fill:none;fill-opacity:1;stroke:#000000;stroke-width:1.79737806;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.99615389;marker-start:none"
+         inkscape:connector-curvature="0" />
+    </g>
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer5"
+     inkscape:label="Cours_de_soutien_specifique"
+     style="display:none">
+    <g
+       id="Cours_de_soutien_specifique"
+       style="fill:none;fill-opacity:0.99615389;stroke:#000000;stroke-opacity:0.99615389"
+       transform="matrix(0.40361541,0,0,0.40361541,36.375644,34.076526)">
+      <path
+         transform="translate(-446.2952,-500.01912)"
+         id="path6358"
+         d="m 356.1875,401.09375 c -8.05454,0 -14.59375,6.53921 -14.59375,14.59375 0,8.05454 6.53921,14.5625 14.59375,14.5625 8.05454,0 14.5625,-6.50796 14.5625,-14.5625 0,-8.05454 -6.50796,-14.59375 -14.5625,-14.59375 z"
+         style="fill:none;fill-opacity:0.99615389;stroke:#000000;stroke-width:3.19999981;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.99615389;marker-start:none"
+         inkscape:connector-curvature="0" />
+      <path
+         transform="translate(-446.2952,-500.01912)"
+         id="path6329"
+         d="m 356.3125,413.9375 c -0.44744,0 -0.86303,0.17553 -1.15625,0.46875 -0.29322,0.29322 -0.46875,0.70881 -0.46875,1.15625 0,0.44744 0.17553,0.83178 0.46875,1.125 0.29322,0.29322 0.70881,0.46875 1.15625,0.46875 0.44744,0 0.83178,-0.17553 1.125,-0.46875 0.29322,-0.29322 0.46875,-0.67756 0.46875,-1.125 0,-0.44744 -0.17553,-0.86303 -0.46875,-1.15625 -0.29322,-0.29322 -0.67756,-0.46875 -1.125,-0.46875 z"
+         style="fill:none;fill-opacity:0.99615389;stroke:#000000;stroke-width:3.19999981;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.99615389;marker-start:none"
+         inkscape:connector-curvature="0" />
+      <path
+         transform="translate(-446.2952,-500.01912)"
+         id="path6327"
+         d="m 356.3125,413.9375 c 0.44744,0 0.83178,0.17553 1.125,0.46875 0.29322,0.29322 0.46875,0.70881 0.46875,1.15625 0,0.44744 -0.17553,0.83178 -0.46875,1.125 -0.29322,0.29322 -0.67756,0.46875 -1.125,0.46875 -0.44744,0 -0.86303,-0.17553 -1.15625,-0.46875 -0.29322,-0.29322 -0.46875,-0.67756 -0.46875,-1.125 0,-0.44744 0.17553,-0.86303 0.46875,-1.15625 0.29322,-0.29322 0.70881,-0.46875 1.15625,-0.46875 z"
+         style="fill:none;fill-opacity:0.99615389;stroke:#000000;stroke-width:3.19999981;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.99615389;marker-start:none"
+         inkscape:connector-curvature="0" />
+      <path
+         transform="translate(-446.2952,-500.01912)"
+         id="path6324"
+         d="m 356.3125,413.9375 c -0.44744,0 -0.86303,0.17553 -1.15625,0.46875 -0.29322,0.29322 -0.46875,0.70881 -0.46875,1.15625 0,0.44744 0.17553,0.83178 0.46875,1.125 0.29322,0.29322 0.70881,0.46875 1.15625,0.46875 0.44744,0 0.83178,-0.17553 1.125,-0.46875 0.29322,-0.29322 0.46875,-0.67756 0.46875,-1.125 0,-0.44744 -0.17553,-0.86303 -0.46875,-1.15625 -0.29322,-0.29322 -0.67756,-0.46875 -1.125,-0.46875 z"
+         style="fill:none;fill-opacity:0.99615389;stroke:#000000;stroke-width:3.19999981;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.99615389;marker-start:none"
+         inkscape:connector-curvature="0" />
+    </g>
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer6"
+     inkscape:label="Cours_techniques"
+     style="display:none">
+    <g
+       id="Cours_techniques"
+       transform="matrix(0.41014612,0,0,-0.41014612,-14.018646,81.774592)"
+       inkscape:label="#g3142"
+       style="fill:none;fill-opacity:1;stroke:#000000;stroke-opacity:1">
+      <title
+         id="title3278">template</title>
+      <path
+         inkscape:connector-curvature="0"
+         id="path87"
+         style="fill:none;fill-opacity:1;stroke:#000000;stroke-width:2.12598443;stroke-linecap:square;stroke-linejoin:bevel;stroke-miterlimit:2.23606801;stroke-dasharray:none;stroke-opacity:1"
+         d="m 49.067296,199.32385 c 0,-8.21904 -6.662847,-14.88189 -14.881888,-14.88189 -8.219041,0 -14.881889,6.66285 -14.881889,14.88189 0,8.21904 6.662848,14.88189 14.881889,14.88189 8.219041,0 14.881888,-6.66285 14.881888,-14.88189 z" />
+      <g
+         id="g3119"
+         style="fill:none;fill-opacity:1;stroke:#000000;stroke-opacity:1">
+        <path
+           d="m 44.815326,199.32385 c 0,-5.87075 -4.759174,-10.62992 -10.629918,-10.62992 -5.870744,0 -10.629921,4.75917 -10.629921,10.62992 0,5.87074 4.759177,10.62992 10.629921,10.62992 5.870744,0 10.629918,-4.75918 10.629918,-10.62992 z"
+           style="fill:none;fill-opacity:1;stroke:#000000;stroke-width:2.12598443;stroke-linecap:square;stroke-linejoin:bevel;stroke-miterlimit:2.23606801;stroke-dasharray:none;stroke-opacity:1"
+           id="path85"
+           inkscape:connector-curvature="0" />
+      </g>
+    </g>
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer7"
+     inkscape:label="Actualites"
+     style="display:none">
+    <path
+       d="m 1.2870113,0.02268952 c 0,0.71080369 -0.57622035,1.28702328 -1.287023574708,1.28702328 C -0.71081588,1.3097128 -1.2870354,0.73349321 -1.2870354,0.02268952 c 0,-0.71080371 0.57621952,-1.28702332 1.287023125292,-1.28702332 C 0.71079095,-1.2643338 1.2870113,-0.68811419 1.2870113,0.02268952 Z"
+       style="fill:none;fill-opacity:1;stroke:#000000;stroke-width:0.162155;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:2.23607;stroke-dasharray:0.486463, 0.486463;stroke-dashoffset:0;stroke-opacity:1;marker-start:none;marker-mid:none;marker-end:none"
+       id="Actualites"
+       inkscape:connector-curvature="0"
+       inkscape:label="#path87-1"
+       mask="none" />
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer9"
+     inkscape:label="Cours_theoriques"
+     style="display:none">
+    <g
+       id="Cours_theoriques"
+       style="display:inline;fill:none;fill-opacity:1;stroke:#000000;stroke-opacity:0.99615389"
+       transform="matrix(0.40423298,0,0,0.40423298,35.552135,-0.25339326)"
+       inkscape:label="#Cours_theoriques">
+      <path
+         id="Orientations-0-7-6"
+         d="m -87.940348,-13.895148 c -8.05454,0 -14.593742,6.5079588 -14.593742,14.56249871 0,8.05454009 6.539202,14.59375129 14.593742,14.59375129 8.05454,0 14.59375,-6.5392112 14.59375,-14.59375129 0,-8.05453991 -6.53921,-14.56249871 -14.59375,-14.56249871 z"
+         style="fill:none;fill-opacity:1;stroke:#000000;stroke-width:3.19999981;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.99615389;marker-start:none"
+         inkscape:connector-curvature="0" />
+      <path
+         id="path6386-5-7"
+         d="m -87.815348,-5.0851598 c -0.778051,0 -1.519886,0.1712117 -2.194064,0.4563657 -0.674181,0.285154 -1.280481,0.7012471 -1.790358,1.2111239 -0.509877,0.509877 -0.92597,1.1161775 -1.211125,1.7903572 -0.285153,0.67417963 -0.438813,1.41601363 -0.438813,2.19406488 0,0.77805152 0.15366,1.50233312 0.438813,2.17651272 0.285155,0.6741797 0.701248,1.2980328 1.211125,1.8079096 0.509877,0.5098769 1.116177,0.9084175 1.790358,1.1935714 0.674178,0.2851541 1.416013,0.4563658 2.194064,0.4563658 0.778051,0 1.519886,-0.1712117 2.194064,-0.4563658 0.674181,-0.2851539 1.280481,-0.6836945 1.790358,-1.1935714 0.509877,-0.5098768 0.92597,-1.1337299 1.211125,-1.8079096 0.285153,-0.6741796 0.438813,-1.3984612 0.438813,-2.17651272 0,-0.77805125 -0.15366,-1.51988525 -0.438813,-2.19406488 -0.285155,-0.6741797 -0.701248,-1.2804802 -1.211125,-1.7903572 -0.509877,-0.5098768 -1.116177,-0.9259699 -1.790358,-1.2111239 -0.674178,-0.285154 -1.416013,-0.4563657 -2.194064,-0.4563657 z"
+         style="fill:#000000;fill-opacity:1;stroke:#000000;stroke-width:1.79737806;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.99615389;marker-start:none"
+         inkscape:connector-curvature="0" />
+    </g>
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer8"
+     inkscape:label="Enseignants"
+     style="display:none">
+    <path
+       sodipodi:type="star"
+       style="fill:none;fill-opacity:1;stroke:#000000;stroke-width:0.973914;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       id="Enseignants"
+       sodipodi:sides="3"
+       sodipodi:cx="0.0018145076"
+       sodipodi:cy="0.13116495"
+       sodipodi:r1="6.7946506"
+       sodipodi:r2="3.397325"
+       sodipodi:arg1="0.52606642"
+       sodipodi:arg2="1.573264"
+       inkscape:flatsided="true"
+       inkscape:rounded="0"
+       inkscape:randomized="0"
+       d="M 5.8777532,3.5430003 -5.8908909,3.5139594 0.01858127,-6.6634649 Z"
+       inkscape:transform-center-x="-0.0012016352"
+       inkscape:transform-center-y="0.24243705"
+       inkscape:label="#path3225-6-7-7" />
+  </g>
 </svg>

index.00.html

@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <title>école de recherche graphique</title>
+    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta charset="utf-8">
+    <link rel="stylesheet" type="text/css" href="style.css">
+</head>
+<body>
+    <div id="page">
+        <svg id="svg"></svg>
+        <pre id="debug"></pre>
+        <div id="bottompane">
+            <div id="bottompage">
+                <div id="menubar">
+                    <span id="menu"><img src="img/symhamburger.png"></span>
+                    <input id="searchinput" type="input" placeholder="école de recherche graphique" />
+                    <label for="searchinput" id="search"><img src="img/symsearch.png"></label>
+                    <img src="img/symup.png" />
+                </div>
+                <div id="wikiframediv">
+                    <iframe id="wikiframe" src="/mw"></iframe>
+                </div>
+        </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="dist/custom_scroller_menu.js"></script>
+<script type="text/javascript" src="dist/app.js"></script>
+<script src="dist/index.js"></script>
+</html>

index.html

@@ -1,43 +1,98 @@
 <!DOCTYPE html>
 <html>
-<head>
-    <title>école de recherche graphique</title>
-    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <meta charset="utf-8">
-    <link rel="stylesheet" type="text/css" href="style.css">
-</head>
-<body>
-    <div id="page">
-        <svg id="svg"></svg>
-        <pre id="debug"></pre>
-        <div id="bottompane">
-            <div id="bottompage">
-                <div id="menubar">
-                    <span id="menu"><img src="img/symhamburger.png"></span>
-                    <input id="searchinput" type="input" placeholder="école de recherche graphique" />
-                    <label for="searchinput" id="search"><img src="img/symsearch.png"></label>
-                    <img src="img/symup.png" />
-                </div>
-                <div id="wikiframediv">
-                    <iframe id="wikiframe" src="/mw"></iframe>
-                </div>
-        </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="dist/custom_scroller_menu.js"></script>
-<script type="text/javascript" src="dist/app.js"></script>
-<script src="dist/index.js"></script>
+	<head>
+		<title>école de recherche graphique</title>
+		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+		<!--<meta name="viewport" content="width=device-width, initial-scale=1">-->
+		 <meta name="viewport" content="width=device-width; initial-scale=1; maximum-scale=1; user-scalable=no;"/>
+		<meta charset="utf-8">
+		<link rel="stylesheet" type="text/css" href="style.css">
+		<link rel="stylesheet" type="text/css" href="style.custom_map.css">
+		<style type="text/css">
+#quit {
+	position:fixed;
+	top:15px;
+	right:15px;
+	visibility:visible;
+}
+	@media (max-width: 800px) and (-webkit-min-device-pixel-ratio: 1) { 
+		script {
+			display:none !important;
+		}
+		#page {
+			display:none !important;
+		}
+		#wikiframediv {
+			right:0;
+		}
+	}
+
+		</style>
+		<link rel="icon" type="image/x-icon" href="/Favicon_V1.png">
+	</head>
+	<body>
+		<div id="vbody">
+			<div id="page">
+				<div id="handle"></div>
+				<svg id="svg"></svg>
+				<div id="cats">
+					<div class="body"></div>
+					<div class="placeholder"></div>
+				</div>
+				<div class="zoom-controls">
+					<div class="leaflet-control-zoom leaflet-bar leaflet-control">
+						<a class="leaflet-control-zoom-in" href="#" title="Zoom in" role="button" aria-label="Zoom in">+</a>
+						<a class="leaflet-control-zoom-out" href="#" title="Zoom out" role="button" aria-label="Zoom out">&ndash;</a>
+					</div>  
+				</div>
+				<div id="specialclosediv">
+					<a id="specialclosebutton" href="#" title="Zoom in" role="button" aria-label="Zoom in">&times;</a>
+				</div>
+				<div id="specialselectdiv">
+					<select id="special">
+						<!--<option value="/m/special/recentnews">news</option>-->
+						<!--<option value="/m/special/ergtv/">erg tv !</option>-->
+						<option value="">Carte</option>
+						<option value="/m/special/recentfiles/">Nouveaux fichiers</option>
+						<option value="/m/special/recentchanges/">Modifications récentes</option>
+						<!--<option value="/m/special/jpo2021-live/">JPO 2021</option>-->
+					</select>
+					<a href="#" id="quit" class="button-style">fermer [x]</a>
+				</div>
+				<div id="specialiframediv"></div>
+			</div>
+			<div id="wikiframediv">
+				<iframe id="wikiframe" name="wikiframe" src="/mw"></iframe>
+			</div>
+
+		</div>
+	</body>
+	<script type="text/javascript">
+		var map = document.getElementById("page");
+document.getElementById("quit").addEventListener("click", function() {
+	if(document.getElementById("quit").textContent === "fermer [x]") {
+
+		console.log("quit map");
+		document.getElementById("page").style.visibility = "hidden";
+		document.getElementById("wikiframediv").style.right = "0";
+
+		document.getElementById("quit").textContent = "🌐 carte";
+		document.getElementById("quit").style.setProperty('top', 'initial');
+		document.getElementById("quit").style.bottom = "15px";
+	}
+	else {
+		document.getElementById("page").style.visibility = "visible";
+		document.getElementById("wikiframediv").style.right = "60%";
+
+		document.getElementById("page").style.visibility = "visible";
+		document.getElementById("wikiframediv").style.right = "60%";
+		document.getElementById("quit").textContent = "fermer [x]";
+		document.getElementById("quit").style.setProperty('bottom', 'initial');
+		document.getElementById("quit").style.top = "15px";
+	}
+
+});
+	</script>
+	<script type="text/javascript" src="dist/app.js"></script>
+	<script src="dist/index.js"></script>
 </html>

special/ergtv/index.html

@@ -0,0 +1,80 @@
+<!doctype>
+<html>
+	<head>
+		<title>erg ~ Portes ouvertes 2021</title>
+		<style>
+		/* F O N T E S */
+		@font-face {
+		    font-family: "Combined";
+		    src: url('/mw/skins/foreground/assets/fonts/combined.otf');
+		    font-style:   normal;
+		    font-weight:  normal;
+		}
+		@font-face {
+		    font-family: "Vega";
+		    src: url('/mw/skins/foreground/assets/fonts/Vega-Regular.otf');
+		    src: url('/mw/skins/foreground/assets/fonts/Vega-Regular.ttf') format("truetype");
+		    src: url("/mw/skins/foreground/assets/fonts/Vega-Regular-Webfont.svg") format("svg");
+		    src: url("/mw/skins/foreground/assets/fonts/Vega-Regular.woff") format("woff");
+		    src: url("/mw/skins/foreground/assets/fonts/Vega-Regular.woff2") format("woff2");
+		    font-style:   normal;
+		    font-weight:  normal;
+		}
+
+			body {
+				background-color: thistle;
+				height: 100%;
+				font-family: Vega;
+				display: flex;
+				flex-direction: column;
+				box-sizing: border-box;
+				overflow: hidden;
+			}
+			h1, h2 {
+				font-family: Combined;
+				font-weight: normal;
+				margin-bottom: 0;
+				display: contents;
+			}
+			h2 {
+				margin-bottom: 1em;
+			}
+			iframe {
+				width: 100%;
+				height: 100%;
+				border: 0;
+				flex-grow: 1;
+				box-sizing: border-box;
+			}
+			ul {
+				display: flex;
+				margin: 1.2em 0;
+				padding: 0;
+				justify-content: space-between;
+			}
+			li {
+				list-style-type: none;
+				padding: 0;
+				margin: 0;
+				border: 1px solid black;
+				border-radius: 10px;
+				padding: 0.25em 0.5em;
+				flex-basis: 10%;
+			}
+			a {
+				text-decoration: none;
+				color: inherit;
+			}
+			iframe {
+				width:100%;
+			}
+		</style>
+	</head>
+	<body>
+		<h1>erg tv</h1>
+		<h2>winterschool 2024</h2>
+
+		<iframe src="https://www.youtube.com/embed/3sThYW6bhEQ?si=DkvK7zpCHKEza81f" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
+
+	</body>
+</html>

special/ergtv/welcome.html

@@ -0,0 +1,49 @@
+<!doctype>
+<html>
+	<head>
+		<title>erg ~ Portes ouvertes 2021</title>
+		<style>
+		/* F O N T E S */
+		@font-face {
+		    font-family: "Combined";
+		    src: url('/mw/skins/foreground/assets/fonts/combined.otf');
+		    font-style:   normal;
+		    font-weight:  normal;
+		}
+		@font-face {
+		    font-family: "Vega";
+		    src: url('/mw/skins/foreground/assets/fonts/Vega-Regular.otf');
+		    src: url('/mw/skins/foreground/assets/fonts/Vega-Regular.ttf') format("truetype");
+		    src: url("/mw/skins/foreground/assets/fonts/Vega-Regular-Webfont.svg") format("svg");
+		    src: url("/mw/skins/foreground/assets/fonts/Vega-Regular.woff") format("woff");
+		    src: url("/mw/skins/foreground/assets/fonts/Vega-Regular.woff2") format("woff2");
+		    font-style:   normal;
+		    font-weight:  normal;
+		}
+
+			body {
+				width: 100%;
+				height: 100%;
+				background-color: thistle;
+				font-family: Vega;
+				display: flex;
+				flex-direction: column;
+				line-height: 1.2em;
+			}
+			h1, h2 {
+				font-family: Combined;
+				font-weight: normal;
+			}
+			iframe {
+				width: 100%;
+				border: 0;
+				flex-grow: 1;
+				box-sizing: border-box;
+				
+			}
+		</style>
+	</head>
+	<body>
+		<img src="https://wiki.erg.be/mw/images/c/cb/Affiche_Jury_2021_%2B_PO_FINAL.jpg">
+	</body>
+</html>

special/jpo2020-live/pad.html

@@ -0,0 +1,783 @@
+<html lang="en"><head><style type="text/css">.disclaimer{text-align:right;font-size:x-small}.banner{background-color:#fff;text-align:left}.cacheContent{position:relative}.b_vPanel>div{padding-bottom:10px}.b_vPanel>div:last-child{padding:0}.banner a{color:#000080}</style><!-- base href="http://wiki.erg.be/m/special/jpo2020-live/pad.html" --><meta http-equiv="content-type" content="text/html; charset=UTF-8"><!-- Banner:Start --><!--LocalizedDate:12/10/2020--><!--InvariantDate:10/12/2020--></head><body><div class="banner"><div class="b_vPanel"><div><!-- Title:Start -->You have reached the cached page for <strong><a target="_blank" href="http://wiki.erg.be/m/special/jpo2020-live/pad.html" h="ID=SERP,5003.1">http://wiki.erg.be/m/special/jpo2020-live/pad.html</a></strong><!-- Title:End --></div><div><!-- Content:Start -->Below is a snapshot of the Web page as it appeared on <strong>12/10/2020</strong>
+ (the last time our crawler visited it). This is the version of the page
+ that was used for ranking your search results. The page may have 
+changed since we last cached it. To see what might have changed (without
+ the highlights), <a target="_blank" href="http://wiki.erg.be/m/special/jpo2020-live/pad.html" h="ID=SERP,5003.2">go to the current page</a>.<!-- Content:End --></div><div><!-- Disclaimer:Start --><div class="disclaimer">Bing is not responsible for the content of this page.</div><!-- Disclaimer:End --></div><!-- Banner:End --></div></div><div class="cacheContent">
+
+
+<title>erg-jpo-2020-vos-questions-9hd0</title>
+<meta name="generator" content="Etherpad">
+<meta name="author" content="Etherpad">
+<meta name="changedby" content="Etherpad">
+<meta charset="utf-8">
+<style>
+ul.indent {
+  list-style-type: none;
+}
+ol {
+  list-style-type: none;
+  padding-left: 0;
+}
+body > ol {
+  counter-reset: first second third fourth fifth sixth seventh eighth ninth tenth eleventh twelfth thirteenth fourteenth fifteenth sixteenth;
+}
+ol > li:before {
+  content: counter(first) ". ";
+  counter-increment: first;
+}
+ol > ol > li:before {
+  content: counter(first) "." counter(second) ". ";
+  counter-increment: second;
+}
+ol > ol > ol > li:before {
+  content: counter(first) "." counter(second) "." counter(third) ". ";
+  counter-increment: third;
+}
+ol > ol > ol > ol > li:before {
+  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) ". ";
+  counter-increment: fourth;
+}
+ol > ol > ol > ol > ol > li:before {
+  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) ". ";
+  counter-increment: fifth;
+}
+ol > ol > ol > ol > ol > ol > li:before {
+  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) ". ";
+  counter-increment: sixth;
+}
+ol > ol > ol > ol > ol > ol > ol > li:before {
+  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) "." counter(seventh) ". ";
+  counter-increment: seventh;
+}
+ol > ol > ol > ol > ol > ol > ol > ol > li:before {
+  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) "." counter(seventh) "." counter(eighth) ". ";
+  counter-increment: eighth;
+}
+ol > ol > ol > ol > ol > ol > ol > ol > ol > li:before {
+  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) "." counter(seventh) "." counter(eighth) "." counter(ninth) ". ";
+  counter-increment: ninth;
+}
+ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > li:before {
+  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) "." counter(seventh) "." counter(eighth) "." counter(ninth) "." counter(tenth) ". ";
+  counter-increment: tenth;
+}
+ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > li:before {
+  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) "." counter(seventh) "." counter(eighth) "." counter(ninth) "." counter(tenth) "." counter(eleventh) ". ";
+  counter-increment: eleventh;
+}
+ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > li:before {
+  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) "." counter(seventh) "." counter(eighth) "." counter(ninth) "." counter(tenth) "." counter(eleventh) "." counter(twelfth) ". ";
+  counter-increment: twelfth;
+}
+ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > li:before {
+  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) "." counter(seventh) "." counter(eighth) "." counter(ninth) "." counter(tenth) "." counter(eleventh) "." counter(twelfth) "." counter(thirteenth) ". ";
+  counter-increment: thirteenth;
+}
+ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > li:before {
+  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) "." counter(seventh) "." counter(eighth) "." counter(ninth) "." counter(tenth) "." counter(eleventh) "." counter(twelfth) "." counter(thirteenth) "." counter(fourteenth) ". ";
+  counter-increment: fourteenth;
+}
+ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > li:before {
+  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) "." counter(seventh) "." counter(eighth) "." counter(ninth) "." counter(tenth) "." counter(eleventh) "." counter(twelfth) "." counter(thirteenth) "." counter(fourteenth) "." counter(fifteenth) ". ";
+  counter-increment: fifteenth;
+}
+ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > li:before {
+  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) "." counter(seventh) "." counter(eighth) "." counter(ninth) "." counter(tenth) "." counter(eleventh) "." counter(twelfth) "." counter(thirteenth) "." counter(fourteenth) "." counter(fifteenth) "." counter(sixteenth) ". ";
+  counter-increment: sixteenth;
+}
+ol {
+  text-indent: 0px;
+}
+ol > ol {
+  text-indent: 10px;
+}
+ol > ol > ol {
+  text-indent: 20px;
+}
+ol > ol > ol > ol {
+  text-indent: 30px;
+}
+ol > ol > ol > ol > ol {
+  text-indent: 40px;
+}
+ol > ol > ol > ol > ol > ol {
+  text-indent: 50px;
+}
+ol > ol > ol > ol > ol > ol > ol {
+  text-indent: 60px;
+}
+ol > ol > ol > ol > ol > ol > ol > ol {
+  text-indent: 70px;
+}
+ol > ol > ol > ol > ol > ol > ol > ol > ol {
+  text-indent: 80px;
+}
+ol > ol > ol > ol > ol > ol > ol > ol > ol > ol {
+  text-indent: 90px;
+}
+ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol {
+  text-indent: 100px;
+}
+ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol {
+  text-indent: 110px;
+}
+ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol {
+  text-indent: 120px;
+}
+ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol {
+  text-indent: 130px;
+}
+ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol {
+  text-indent: 140px;
+}
+ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol > ol {
+  text-indent: 150px;
+}
+sub{vertical-align:sub;font-size:smaller}sub{vertical-align:sup;font-size:smaller}h1{font-size: 2.0em;line-height: 120%;}   h2{font-size: 1.5em;line-height: 120%;}   h3{font-size: 1.17em;line-height: 120%;}   h4{line-height: 120%;}   h5{font-size: 0.83em;line-height: 120%;}   h6{font-size: 0.75em;line-height: 120%;}   code{font-family: monospace;}[data-color="black"], .color\:black  { color:black; }
+[data-color="red"], .color\:red    { color:red; }
+[data-color="green"], .color\:green  { color:green; }
+[data-color="blue"], .color\:blue   { color:blue; }
+[data-color="yellow"], .color\:yellow { color:yellow; }
+[data-color="orange"], .color\:orange { color:orange; }
+</style>
+
+
+    <style type="text/css" media="screen">
+	@font-face {
+	    font-family: "Combined";
+	    src: url('/mw/skins/foreground/assets/fonts/combined.otf');  
+	    font-style:   normal;
+	    font-weight:  normal;
+	}
+	@font-face {
+	    font-family: "Vega";
+	    src: url('/mw/skins/foreground/assets/fonts/Vega-Regular.otf');  
+	    src: url('/mw/skins/foreground/assets/fonts/Vega-Regular.ttf') format("truetype");  
+	    src: url("/mw/skins/foreground/assets/fonts/Vega-Regular-Webfont.svg") format("svg");
+	    src: url("/mw/skins/foreground/assets/fonts/Vega-Regular.woff") format("woff");
+	    src: url("/mw/skins/foreground/assets/fonts/Vega-Regular.woff2") format("woff2");
+	    font-style:   normal;
+	    font-weight:  normal;
+	}
+
+
+        body {
+            font-family: Vega;
+            font-size: 17px;
+            line-height: 1.5em;
+            background-color: white;
+        }
+        h1, h2, h3 {
+            /*color: #a700ff;*/
+            font-family: Combined;
+            font-size: 1em;
+            line-height: 1.5em;
+	    margin-bottom: 0;
+        }
+	h1 {
+		margin: 2em 0;
+	}
+	
+	h2 {
+		padding-top: 1em;
+		border-top: 2px solid white;
+		color: #A700FF;
+	}
+	strong {
+		color: #A700FF;
+	}
+
+        a {
+            text-decoration: none;
+            border-image: linear-gradient(to right, #A700FF, #00ab6b);
+            border-bottom-width: 2px;
+            border-image-slice: 1;
+            color: inherit;
+            border-bottom-style: solid;
+            padding: 3px 5px 1px;
+        }
+        video {
+            width: 100%;
+            height: 100%;
+        }
+        
+	hr {
+		border: 0;
+		margin: 0;
+		height: 1em;
+	}
+	sup {
+		font-size: 0.55em;
+		line-height: 0;
+		vertical-align: 0.55em;
+	}
+	iframe {
+		width: 100%;
+		height: 500px;
+		border: 0;
+		overflow-x: hidden;
+	}
+    </style>
+
+
+
+
+	<a href="http://wiki.erg.be/w/Bienvenue_%C3%A0_l%E2%80%99erg">Retour au site de l'erg.</a>
+
+
+	<h1>
+Organisation du pad
+	</h1>
+	<ul>
+		<li><a href="#questions-profs">Questions pour les profs</a></li>
+		<li><a href="#questions-admin">Questions pour l'administration</a></li>
+	</ul>
+
+	<h1 id="questions-profs">Questions pour les enseignant·e·s</h1>
+
+<strong>1/ Pour le dossier d'inscription (Cas 4) je ne comprends pas 
+précisement quel est le papier "composition de famille recente et 
+originale"&nbsp;&nbsp;</strong><br><ul class="indent"><li>=&gt;voir <strong>questions admin ci-dessous</strong></li></ul><strong><br><strong>2/A
+ quoi faut il s'attendre pour l'éxamen d'entrée, quels types d'atelier 
+il pourrait y avoir, sur quoi s'entrainer en amont&nbsp;</strong><br><ul class="indent"><li>surtout ne pas se préparer :) s'attendre à désapprendre</li><li>Ne rien préparer surtout ! Venez l'esprit ouvert.&nbsp;</li></ul><br><strong>3/
+ Bonjour, est-ce que quelqu’un qui n’a pas fait d’études en arts 
+appliqués et qui vient de l’Université a ses chances pour entrer à 
+l’Erg? Ou la MANAA (et/ou autre) est obligatoire?</strong><br><strong>En
+ fait, j’ai validé un M1 en cinéma dans une université française, et 
+maintenant je suis intéressé par ce que vous proposez en terme de 
+narration spéculative.</strong><br><strong>Du coup, je me demande s’il 
+est possible pour moi de proposer un dossier pour une demande 
+d’admission en master, ou même une admission en cours étude?&nbsp;</strong><br><ul class="indent"><li>oui
+ tout à fait du point de vue professoral. Pour l'entrée en M1 ou M2 tout
+ dépendra de votre dossier et de l'entretien. Difficile de vous dire 
+exactement ce qui sera possible, c'est vraiment lors de l'entretien que 
+l'on voit si votre attente et ce que nous proposons se rencontrent. 
+Tentez votre chance, je dirais. Pour les questions administratives, voir
+ ci-dessous.</li><li>Oui, pas de soucis, je comprends que tout se fait au cas par cas. Merci pour votre réponse!</li><li>Pour nous, il est surtout important qu'on ait on va dir</li><li>Administrativement
+ parlant: pas du tout de nécessité de MANAA, mais pour la valorisation 
+des crédits d'un bachelier à l'université, c'est vraiment sur base des 
+correspondances de cours, etc. Voir plus bas.</li><li>ça marche, je vais poser une dernière question sur la partie dédiée à l'administration alors, merci à vous</li></ul><br><strong>4/ Bonjour, en quoi consistent les rencontres d'admission ? Es-ce qu'il faut amener des choses sur lesquelles on travaille ?</strong><br><ul class="indent"><li>vous
+ serez amenés à travailler avec d'autres, à échanger en groupe etc... 
+pour les détails, je pense que vous pourrez avoir plus d'infos lors de 
+la videoconférence tout à l'heure.</li><li>D'accord merci !</li><li></li></ul><strong>5/&nbsp;
+ Ce que j'aime particulièrement ce sont les expérimentations graphiques,
+ l'exploration plastique, mêler différents mediums et support. Je suis 
+perdue concernant le choix de l'orientation. En fonction de cela, quel 
+orientation dans le pôle art me conseillez-vous ? Merci !</strong><br>Ces 3 points peuvent être arpentés en dessin, peinture, sculpture ou photographie, voir vidéo.<br>Et dans les trois pôles...! Oui!<br>Si
+ par exemple je choisis le dessin, puis-je venir peindre, dessiner sur 
+une photographie ? Cela est-il plutôt libre au final ? Ou au contraire, 
+si je choisis photographie, puis-je mêler différentes expérimentations 
+graphiques (que ce soit avec de la peinture/encres/bombes ou encore par 
+photoshop) dans mes projets photographiques ? Oui :&gt;&nbsp;<br>Super, je suis rassuré, merci !<br><ul class="indent"><li></li></ul><strong>6/&nbsp;
+ Bonjour, j'aime particulièrement l'image imprimée, et je ne sais pas 
+vraiment quelle orientation serait la plus adéquate pour pratiquer ? 
+Dessin, peinture, illu ?&nbsp;</strong><br>Il y a un cours appelé “Image imprimée” en Bac 1 (sur 4h semaine) qui est ouvert à toutes les orientations.&nbsp;<br>Merci beaucoup !<br>Oui
+ c'est difficile de répondre à ta question parce qu'en fonction de ce 
+que tu imagines ou de ta définition d'“image imprimée” tu pourrait 
+trouver matière à ta recherche en graphisme, photo, dessin ou peinture 
+en effet.<br>Je pensais surtout au printmaking, gravure, sérigraphie, litho, etc<br>D'accord. Il n'y a pas d'orientation dédiée à ces techniques mais des ateliers et stages lié.e.s.<br>Je vois, merci ! Avec plaisir.<br>L'école
+ est pluridisciplinaire. En B1 vous pourrez essayer des techniques et 
+éventuellement changer d'orientation quand vous aurez trouvé vos mediums
+ de choix<br>Génial :)<br><h2></h2><br><strong>7/&nbsp; Bonjour, 
+j'aimerais revenir sur l'introduction où l'on disait qu'il ne fallait 
+venir avec aucun objectif, aucune attente et projet déjà définis, et 
+j'entends bien à travers ça un discours d'ouverture et d'attitude 
+d'écoute des possibilités qui nous entourent, mais faut-il vraiment ne 
+rien attendre ? Pour une entrée en Master, il me semble difficile de 
+n'avoir aucune attente ou au-moins pré-projet, embryon de projet ?</strong><br>Bonjour,
+ pour le travail de master c'est un peu différent, c'est clair que le 
+travail d'atelier en master vient soutenir un projet personnel déjà 
+engagé, donc il faut effectivement avoir un projet personnel déjà 
+commencé, c'est à partir de là qu'on travaille. Arriver en master sans 
+aucun projet, sans idée perso et sans attente ne me semble pas vraiment 
+une bonne idée, même si on espère toujours qu'on vous aidera à 
+développer et à transformer ces projets de départ. Donc il faut 
+certainement faire preuve d'ouverture, ne pas arriver avec un projet 
+ficelé et sans rien attendre des profs.&nbsp;<br>Merci beaucoup pour la 
+réponse ! Bien sûr l'ouverture et une attitude poreuse sont requises à 
+tout moment du projet ! Merci à vous. Avec plaisir, le mieux je pense 
+pour l'arrivée en master est de se renseigner sur les différentes 
+orientation et de voir ce qui correspond au mieux à votre projet et vos 
+envies. Oui merci, je me renseignerai avec mes contacts étudiants !<br><br>8/&nbsp;<strong> <span class="color:blue">est-ce qu'il y a du matériel à prevoir pour les options bd et et illustration?</span></strong><br>L'erg est une école de la débrouille. À priori il n'est pas nécessaire de venir grandement équipé.e :&gt;<br>Je
+ confirme (Joanna enseignante en illu), les étudiant.e.s s'équipent en 
+fonction de leurs projets, en fonction de leurs moyens aussi. On se 
+débrouille dans tous les cas.génial!! merci beaucoup!<br><br><strong><span class="color:blue">9/ est ce que les diplomes sont reconnus hors belgique?&nbsp;</span></strong><br><ul class="indent"><li>Je remets ta question dans la section ci-dessous, ok?<span class="color:blue">d'accord merci!</span></li><li></li></ul><br><strong>10/
+ Bonjour, je suis intéressée par un master a finalité didactique, 
+j'aimerais savoir un peu en quoi consiste ce master, quels sont les 
+options conseillées , enfin tout ça ! Merci</strong><br><ul class="indent"><li>Le
+ master à finalité didactique est composé de 1 année commune à tous les 
+masters et une seconde année qui est composée de 30 crédits de cours à 
+l'erg et 30 crédits de cours communs avec l'agrégation ( en horaire 
+décalé).</li><li>est-ce que ça répond à ta question?</li><li>&nbsp;oui 
+très bien ! désolée la connexion est difficile, j'aimerais savoir juste 
+pour la rencontre si il y a besoin d'avoir déjà un dossier portée sur la
+ pédagogie ou s</li><li>si vous avez des problèmes de connexion, posez 
+vos questions ici et nous y répondrons dans le stream vidéo à gauche 
+après 16h très bien merci !&nbsp;</li><li></li></ul><strong>11/ Où pouvons-nous voir les travaux des étudiants B1 et B2 en arts numérique, photographie et vidéographie ?</strong><br><ul class="indent"><li>Voici
+ quelques liens pour voir des projets en ligne, mais il n'y a pas 
+forcément des productions qui représentent toutes les orientations.</li><li>- BAC 2 &amp; 3 - Programmation numérique: Écriture du code - <a href="http://curlybraces.be/" rel="noreferrer noopener">http://curlybraces.be/</a></li><li>- BAC 2 &amp; 3 - Vidéo - <a href="https://ergvideo.tumblr.com/" rel="noreferrer noopener">https://ergvideo.tumblr.com/</a></li><li>- Les photographies de Marc Wathieu (qui a enseigné en BAC 1/2/3 en arts numériques) dont des albums consacrés à l'erg - <a href="https://www.flickr.com/photos/marcwathieu/albums" rel="noreferrer noopener">https://www.flickr.com/photos/marcwathieu/albums</a></li></ul><br><strong>12/ Est- ce que le master didactique nécessite une formation/licence, portée sur la pédagogie ? merci</strong><br><ul class="indent"><li>non,
+ il faut être inscrit.e dans un des masters de l'erg, le master 
+didactique est une spécialisation du master 2, d'accord merci, et il 
+n'est pas lié au master agreg ? l'agrégation est une année 
+supplémentaire mais les cours sont communs avec lae master didactique 
+Merci !</li><li></li></ul><br><strong>13/<span class="color:blue"> pour le matériel lors du rdv d'admission; on ramène ce qu'on veut, ou est-ce qu'on travaille avec des outils imposés?</span></strong><br><ul class="indent"><li><span class="color:blue">&nbsp;Les
+ conditions de l'examen d'entrée restent encore à imaginer (peut-être 
+différent des dernières années vu le contexte) mais on part du principe 
+que les étudiant.e.s viennent avec la base (feuilles, outils, trousse, 
+clé usb...) on se débrouille, on se prête...génial! merci beaucoup!!</span></li></ul><br><strong>14/
+ Aux entretiens pour entrer en B2, j'ai vu que nous devons présenter des
+ travaux récents. Pouvons-nous présenter des travaux que vous aurez vu 
+auparavant dans notre portfolio que nous devons envoyer avec le dossier 
+d'inscription, ou alors vous attendez-vous à ce qu'on vous présente des 
+travaux différents de ceux de notre portfolio ?</strong><br><ul class="indent"><li>→ réponse donnée dans la 2e partie du pad, question 37</li></ul><br><strong>15/ À la fin des Portes Ouvertes, est-ce qu'il y aura ce document avec les questions encore disponible ?</strong><br><ul class="indent"><li>Oui, nous mettrons à disposition une archive de ce document, ainsi que du live.</li><li>Super merci !</li></ul><br>16/
+ Bonjour, je cherche à commencer un bachelier en graphisme. J'ai déjà 
+fait Bachelier + Master dans le domaine de la com', ensuite j'ai 
+travaillé un an en agence créative et une autre année en agence 
+média/créa. Je me suis rendu compte que la com' n'était pas pour moi car
+ j'ai davantage envie d'être du côté de la création plutôt que le 
+management. Est-ce que mon parcours reste légitime (25 ans - reprise 
+d'études) en sachant que j'ai toujours été intéressé par le 
+graphisme?&nbsp;<br><ul class="indent"><li>J'imagine que oui car j'ai 
+déjà eu des étudiants d'un certain âge, qui étaient déjà dans la vie 
+professionnelle et qui souhaitaient se réorienter. Je remets ta question
+ dans la partie administrative en bas pour voir s'il y a une démarche 
+différente ou non.</li><li>Ok merci beaucoup ! J'ai déjà pas mal utilisé
+ des programmes comme photoshop, je me suis mis récemment à Illustrator 
+et j'aimerais développer des compétences sur Spark, est-ce que je dois 
+venir pour les examens d'entrée avec des exemples de ce que j'ai déjà 
+fait en tant que "loisir"?</li><li>En Bac 1, pas de pré-requis mais un 
+portfolio est le bienvenu. Pour les années suivantes, il faut en effet 
+un portfolio. L'erg ne se focalise pas tellement sur les compétences et 
+l'apprentissage de logiciels à proprement parler. Nous mettons l'accent 
+sur les projets, et une bonne partie de l'équipe enseignante est plus 
+orientée logiciels libres que la suite Adobe. Est-ce que ça répond à ta 
+question? Oui c'est parfait, je me suis déjà renseigné sur les 
+différentes écoles à Bruxelles et j'aime l'idée que l'ERG n'est pas 
+forcément focalisée logiciels et davantage sur une approche artistique. 
+Je ne souhaite pas devenir graphic designer mais plutôt ouvrir mes 
+horizons sur le plan artistique et voir ce qui me convient le mieux et 
+ce que je pourrai en faire pour mes attentes vers le futur. J'ai 
+l'impression que l'ERG pousse vers ça?</li><li>En fait, tu peux tout 
+autant devenir graphic designer qu'artiste en faisant l'erg, c'est 
+vraiment à toi de choisir ta pratique. Mais dans toutes les orientations
+ de l'école, l'accent est mis sur l'expérimentation, la recherche, la 
+pratique personnelle et transdisciplinaire.C'est tout ce que je veux :).
+ Alors welcome pour t'inscrire :)Merci (y) ! L'équipe administrative t'a
+ répondue aussi tout en bas du pad.</li><li></li><li>Avec un parcours 
+comme celui-ci peut etre qu'entrer en master est plus pertinent ?&nbsp; 
+L'équipe administrative a répondu à cette question en bas, elle 
+préconise plutôt une entrée en B1...</li><li></li></ul><strong>17/&nbsp;
+ Est-ce que choisir l'orientation dessin dans le pôle art implique 
+uniquement la pratique du dessin ou est-ce beaucoup plus large ?&nbsp;</strong><br><ul class="indent"><li>Désolée,
+ les enseignants concernés n'ont pas dû voir ta question, tu peux la 
+reposer à information@erg.be, quelqu'un te répondra!</li></ul><br><br><strong>Nous allons maintenant archiver ce pad! Nous espérons que vous avons pu répondre à vos questions!</strong><br><br><br><strong>*******************************************************************************</strong><br><br>
+															
+															
+	<h1 id="questions-admin">Questions administratives</h1>
+														<strong>1/ Bonjour, je souhaiterai m'inscrire au Master en
+ Communication visuelle et graphique. J'ai un diplôme de Bachelier en 
+Arts Graphiques. Quelles sont les conditions d'admission pour accéder 
+directement à un Master? Merci.</strong><br><ul class="indent"><li>Bonjour,
+ pour accéder directement au master, nous te demanderons une copie de 
+ton diplôme de bachelier, tes relevés de notes de bachelier ainsi qu'un 
+descriptif des cours de bachelier que tu as suivi (normalement tu as ça 
+dans ton école). Sur cette base, l'administration et les profs du jury 
+d'admission regardent si cela correspond aux attendus pour rentrer en 
+master. Tu peux nous envoyer ton dossier (toutes les infos sont ici:<a href="http://wiki.erg.be/m/#Pr%C3%A9-inscription_en_cours_d%E2%80%99etudes_-_2e_cycle_master_120_ects_%E2%80%93_2020-2021" rel="noreferrer noopener">http://wiki.erg.be/m/#Pr%C3%A9-inscription_en_cours_d%E2%80%99etudes_-_2e_cycle_master_120_ects_%E2%80%93_2020-2021</a> ) sur aec-vae@erg.be, on l'analyse (il nous faut un peu de temps pour ça) avec Patrizia Tripoli et on revient vers toi.&nbsp;</li><li>Est-ce que ça répond à ta question? (Maryline)</li><li>Oui
+ merci beaucoup, dans le cas où je serai admise quelles sont les dates 
+de présentation devant le jury (Master)? Le 9 septembre pour les 
+master.&nbsp;</li><li>Et le cas échéant y a t-il une année intermédiaire
+ pour y accéder? Oui, c'est tout à fait possible que le jury d'admission
+ décide que le master n'est pas accessible tout de suite mais qu'il faut
+ prendre des cours de B3.</li><li>Merci! Et est-ce qu'il est possible 
+d'être à cheval sur les deux années? : entrer en Master en repassant en 
+même temps quelques cours de Bac 3 que je n'aurais pas eu?</li></ul><br><strong>2/
+ Pour le dossier d'inscription (Cas 4) je ne comprends pas précisement 
+quel est le papier "composition de famille recente et originale"</strong><br><ul class="indent"><li>Bonjour, c'est un document qui ne doit être fourni que par des étudiant.e.s qui ne sont <u>pas</u>
+ de nationalité belge et qui résident en Belgique. C'est un document que
+ votre Administration communale (service population) peut vous fournir. 
+(Maryline)</li><li>Mais si je réside en France mais compte déménager en Belgique a la rentrée. Je donne deux justificatifs different ?</li><li>Si
+ tu résides en France au moment d'envoyer ton dossier, il ne faut pas 
+mettre la composition de ménage. Tu nous fourniras le document plus 
+tard, lorsque tu auras fait toutes les démarches auprès de la 
+commune.&nbsp;</li><li>Parfait merci !</li><li></li></ul><strong>3/ Comment pouvons nous participer aux rencontres&nbsp; d'admissions ? merci</strong><br><ul class="indent"><li>Pour rentrer en quelle année?&nbsp;</li><li>en 1ere année</li><li>Bonjour,
+ pour participer aux épreuves d'admission B1, il faut remettre un 
+dossier en ligne. Une fois que ton dossier est complet, tu seras 
+invité.e à présenter l'épreuve d'admission qui a lieu pour les B1 du 31 
+août au 3 septembre (journées d'atelier suivi d'un entretien avec les 
+enseignant.e.s). Toutes les infos pour les B1 sur erg.be &gt; Admission 
+20-21 &gt; Admission Bac 1.&nbsp;</li><li>Est-ce que ça répond à ta question?&nbsp;</li><li>Merci ! parfait.</li><li></li></ul><strong>4/
+ Faut-il pour la rentrée prochaine se procurer une traduction du bac 
+francais ou non? Je n'ai pas vu cette info sur le site alors que je 
+pensais que c'était nécessaire auparavant</strong><br><ul class="indent"><li>Bonjour, par "traduction", tu veux dire une équivalence au CESS (diplôme belge de secondaire)?</li><li>Si
+ oui, il est obligatoire d'en avoir une pour accéder au bachelier. C'est
+ auprès du Ministère qu'il faut s'adresser pour ce faire: <a href="http://www.equivalences.cfwb.be/index.php?id=524" rel="noreferrer noopener">http://www.equivalences.cfwb.be/index.php?id=524</a> .&nbsp;&nbsp;</li></ul><br><strong>5/
+ Re-bonjour, en termes administratifs, est-il possible de présenter à la
+ fois un dossier pour une demande d’admission en Master et un dossier 
+pour une demande d’admission en cours d’études? Et donc de passer les 
+entretiens, etc.. pour les deux niveaux?&nbsp;</strong><br><ul class="indent"><li>Bonjour,
+ Oui bien sur. Lorsque tu remets ton dossier, indique nous si tu 
+souhaites accéder au master. En fonction de l'analyse administrative, 
+nous te ferons passer l'entretien de bachelier en cours d'études (B2-B3)
+ ou l'entretien de master. Lors de l'entretien d'admission, les 
+enseignant.e.s pourraient décider que tu dois rentrer dans à un autre 
+niveau.&nbsp;</li><li>Pas d'inquiétude en tout cas, ce n'est pas "figé" 
+en fonction de la case que vous cochez sur un formulaire, avec les 
+enseignant.e.s nous faisons au mieux en fonction de votre profil et 
+parcours.&nbsp;</li><li>Est-ce que ça répond à ta question?</li><li>Oui,
+ très bien, merci! Donc si je comprends bien, je peux présenter un 
+dossier de pré-inscription en cours d’études - Master, et envoyer les 
+documents complémentaire pour l'entretien cours d'études - bachelier (B2
+ - B3) si vous les jugez nécessaire? Oui, pas d'inquiétude, nous te 
+dirons si il faut faire des démarches supplémentaires ;-)</li><li>Je 
+demande ça car je vois que les documents demandés pour les deux cycles 
+ne sont pas les mêmes (notamment les grilles comparatives bloc2 qui ne 
+sont pas demandées pour le dossier master) Pas de problème, nous 
+régulariserons ça.&nbsp;</li><li>Parfait, merci à vous et courage pour la suite :) ++</li></ul><br><strong>6/
+ Si je postule directement pour rentrer en bac 2, que je passe les 
+entretiens et que je ne suis pas retenue, devrais-je à nouveau passer 
+des épreuves pour rentrer en bac 1 ?&nbsp;</strong><br><ul class="indent"><li>Bonjour,
+ c'est peut-être possible mais cela dépend un peu de la situation. 
+Patrizia saura mieux te répondre que moi (elle sera là à partir de 16h).</li><li>Pour passer en Bac1 : tout dépendra de la décision des enseignants de B2.</li></ul><br><strong>7/
+ Est-ce que je peux raisonnablement envisager de prendre un kot pour 
+septembre ? Quel est le pourcentage de gens retenus ? en bac1 et en bac 2
+ ?</strong><br><ul class="indent"><li>On parle de +/- 5% de refus mais c'est difficile à dire comme ça</li><li>Merci pour votre réponse. Prenez-vous beaucoup de nouveaux élèves en bac2 ?&nbsp;</li><li>Je suis incapable de répondre. Nous n'avons pas de nombre limite, c'est au cas par cas</li><li>D'accord, merci beaucoup !</li><li></li></ul><br><strong>8/
+ Bonjour! Pour ce qui concerne l'équivalence du baccalauréat français, 
+est-il suffisant de mettre la lettre de demande de dérogation à la date 
+limite de dépôt ainsi qu'une preuve d'envoi?&nbsp; J'ai fais une demande
+ de dérogation et j'aurais donc l'équivalence dans les 5 jours qui 
+suivent la réussite des épreuves d'admission.</strong><br><ul class="indent"><li><s>Bonjour, une demande de dérogation à la date limite du 15 juillet?&nbsp;</s></li><li><s>Si
+ oui, tu devras absolument y mettre un document officiel de réussite de 
+l'épreuve d'admission (que tu peux demander à l'erg dès que tu reçois 
+les résultats de l'épreuve d'admission). Attention, à bien suivre les 
+consignes données par le Service des équivalences du Ministère, c'est 
+assez exigeant.&nbsp;</s></li><li><s>C'est ça! Merci! Mais du coup dans 
+les préinscriptions (sur le site web) là où je devrais mettre cette 
+équivalence, que dois-je mettre?</s></li><li><s>Tu peux alors juste 
+mettre un mot qui explique ceci ;-) Je suppose que c'est parce que tu 
+n'auras pas obtenu ton diplôme de baccalauréat avant la date du 15 
+juillet?&nbsp;</s></li><li>Plus au moins, en fait je suis à Barcelone 
+(Lycée Français à l'étranger), et les procès administratifs avec le 
+covid sont ralentis. On nous a dit qu'on aurait notre relevé de notes le
+ 26 juin, mais le diplôme de bac peut arriver bien plus tard (vers 
+octobre, voire novembre...)</li><li>Alors si tu as ton relevé de notes 
+et/ou une attestation provisoire de réussite avant la date du 15 
+juillet, il vaut mieux déjà introduire ton dossier auprès du Ministère. 
+Ils te demanderont de le compléter par la suite. Mieux vaut faire ça au 
+plus vite ;-)</li><li>Vous avez raison! Merci mille fois!</li></ul><br><strong>9/
+ bonjour ! y-a-t-il une présentation de travaux type portfolio ? 
+j'imagine que oui, mais comme cela semble être très libre comme école je
+ me demandais ! (j'ai le sentiment qu'il y a surtout beaucoup de papiers
+ administratifs haha)</strong><br><ul class="indent"><li>Pour BAC 1, il 
+n'y a pas de pré-requis mais beaucoup de candidat·e·s amènent en effet 
+un portfolio. Pour les autres années, un portfolio est demandé.</li><li>&nbsp;merci beaucoup ! Le bac3 c'est l'équivalence d'une licence en France ?&nbsp;</li><li>Oui.</li></ul><br><strong><s>10/ <span class="color:blue">est-ce qu'il y a du matériel à prevoir pour les options bd et et illustration?</span></s></strong><br><s>je transfère ta question plus haut, directement aux enseignants d'accord merci!</s><br><br><strong>11/ Bonjour,</strong><br><strong>est-ce possible de s'inscrire au Master (Narration Spéculative) quand j'ai déjà un master dans les arts (photographie).</strong><br><ul class="indent"><li>Bonjour,
+ si tu as réussi ce master oui vraiment aucun problème, sous réserve de 
+l'épreuve d'admission. Si tu étais en échec durant ce master, nous 
+devrons analyser ton dossier.</li><li>En plus je me demandais si les 
+cours sont tous présentés en français. Je suis néerlandophone et je veux
+ bien améliorer mon francais mais en tout cas ça pourrait être une 
+barrière. :) :)&nbsp;</li><li>Oui, les cours sont en français...</li><li>Mais il y a quelques enseignant·e·s néerlandophones dans l'école ;) ++</li><li>Ok merci, haha&nbsp;&nbsp;</li><li></li></ul><strong>12/
+ Bonjour, pour l'inscription en Master, faut-il joindre un portfolio en 
+plus du formulaire d'inscription ? Et si oui, est-ce qu'il y a des 
+critères précis ou est-ce qu'il est plutôt "libre" ? Merci</strong><br><ul class="indent"><li>Bonjour, oui et l'apporter à l'épreuve d'admission.&nbsp;</li><li>Aucun critère précis, tout ce que vous voulez ;-)&nbsp;</li><li>Ok merci ! :)&nbsp;</li><li></li></ul>13/ <strong><span class="color:blue">est ce que les diplomes sont reconnus hors belgique?&nbsp;</span></strong><br><ul class="indent"><li>Bonjour,
+ oui les diplômes sont reconnus par la Fédération Wallonie-Bruxelles et 
+le système des crédits européens (ECTS) est d'application à l'erg. Pour 
+une demande d'équivalence de diplômes, voir: <a href="http://www.equivalences.cfwb.be/index.php?id=524" rel="noreferrer noopener">http://www.equivalences.cfwb.be/index.php?id=524</a> .&nbsp;&nbsp;</li><li>&nbsp;Ca
+ dépend du contexte de ta question, de ce que tu veux en faire et dans 
+quel pays... Mais là, ça dépend des législations de ces différents pays.
+ d'accord merci!</li></ul><br>14/ <strong>Est-il aussi possible de postuler dans 2 Master différents (Graphisme et Arts Numériques par exemple) ?</strong><br><ul class="indent"><li>Bonjour,
+ il faut faire un choix d'orientation principale (cours de 6h/semaine, 
+ce sera le titre de ton diplôme de master). Cependant, tu pourras faire 
+un stage de 3h/semaine différent de ton orientation. Ça te permet donc 
+de faire les deux, mais une orientation principale doit tout de même 
+être choisie.&nbsp;</li><li>D'accord très bien, merci beaucoup pour la réponse !</li></ul><br><strong>15/
+ Re-bonjour! Avez vous une liste d'attente (dans le cas ou un.e élève 
+soit pris.e mais finalement ne veux pas intégrer le cursus)?&nbsp;</strong><br><ul class="indent"><li>Il n'y a pas de nombre maximum d'inscription. L'admission est uniquement basée sur votre dossier et votre motivation</li><li>D'accord,
+ merci! Et du coup, comment se passe l'annulation à l'inscription (être 
+pris.e mais ne pas pouvoir finalement intégrer le cursus)? si tu es 
+admis.e et que finalement tu ne peux /veux plus intégrer l'erg il suffit
+ de nous le signaler.&nbsp;</li><li>Noté! Merci beaucoup :)</li></ul><br><strong>17/
+ Bonjour, il est indiqué sur votre site que les résultats des rencontres
+ d'admission seront donnés le 7 septembre, pas possible plus tôt?&nbsp;</strong><br><ul class="indent"><li>ben non</li></ul><br>18/
+ Bonjour, je me demandais quel était le volume horaire des cours par 
+semaine, car je travaille déjà (en journée) et je voudrais savoir si 
+c’est compatible.<br><ul class="indent"><li>Cela dépend des années. Mais il faut prévoir aussi le temps de travail en dehors de la présence en cours.</li><li>Pour une entrée en master.</li><li>En
+ master, il faut prévoir qu'en dehors des cours c'est votre implication 
+personnelle qui va compter. Par ailleurs, comme il est aussi possible 
+d'étaler votre cursus, c'est difficile à dire, sachant aussi que tout 
+dépendra de vos options. Mais comptez un temps plein travail personnel 
+et présence en cours tout compris à répartir, bien ŝur. De nombreux 
+étudiants travaillent en semaine et/ou le w-e, mais un travail à temps 
+plein en plus de l'ERG ça parait difficile.</li><li>Sur les possibilités
+ d'allègement du cursus (c'est-à-dire avoir moins de cours/an, mais 
+avoir un master qui dure du coup plus longtemps que 2 ans), tu peux 
+écrire à maryline.ledoux@erg.be .</li><li>ok merci.</li><li></li></ul><strong>19
+ / Bonjour, avec la situation actuelle, Savez-vous si l’année débutera 
+en présentielle ou est-il question de démarrer par voie virtuelle ?</strong><br><ul class="indent"><li>Bonjour,
+ grande question pour nous aussi ! On espère vraiment pouvoir revenir au
+ présentiel (en mettant en place des mesures de sécurité) le plus 
+possible - c'est notre volonté en tout cas - mais on dépend un peu des 
+autorités sanitaires pour cela donc on ne peut pas vous faire de fausses
+ promesses ;-)</li><li></li></ul><strong>20/ Bonjour,&nbsp; je me pose 
+une question concernant le choix de parcours en Master. J'ai vu qu'il y 
+avait deux cas dans le dossier : choisir d'abord une entrée par le 
+secteur, ou par la pratique. Qu'est-ce que ça change en réalité ? Par 
+exemple, si je veux entrer en Master de narration spéculative et choisir
+ les pratiques vidéo et installation/performance, pourquoi choisir par 
+exemple la narration spéculative en "dominante" et pas la vidéo ? Merci 
+:-)&nbsp;</strong><br><ul class="indent"><li>Il&nbsp; faut que tu choisisses le Master . Le titre de ton diplôme: être diplômé en Narration spéculative ou en Vidéo.</li></ul>Lorsque tu as choisis ça, tu peux ensuite choisir les autres pratiques artistiques&nbsp;<br><br><strong>21/ Bonjour est ce que cela pose un problème&nbsp; de rentrer dans votre école à 17 ans ?</strong><br><ul class="indent"><li>Aucun
+ problème tant que tu as un CESS ou un Bac. SI tu as toujours 17 ans 
+lors de ton inscription, un membre de ta famille majeur devra signer 
+pour toi.</li><li>Merci!</li></ul><br><strong>22/ Bonjour ! Est-il possible d'effectuer des Erasmus en Master ? :^)</strong><br><ul class="indent"><li>Bonjour ! Pour ça, il faut prendre contact avec Sammy. Il y a déjà pas mal d'informations sur le site de l'erg <a href="http://wiki.erg.be/" rel="noreferrer noopener">http://wiki.erg.be/</a> - Menu "International".&nbsp; <strong><span class="color:red">NON&nbsp;
+ les étudiants qui s'inscrivent en Master ne peuvent pas faire 
+d'Erasmus. Ce sont uniquement&nbsp; les étudiants qui ont effectué un 
+bachelor à l'erg.</span></strong></li><li>Super, merci bcp !!!</li><li>Oui, sinon cela crée trop de "brisures" dans le cursus&nbsp;</li></ul><br><strong>23/
+ Bonjour, Est-il&nbsp; nécessaire d'obtenir les 60 crédits en bac 1 
+(dans une autre école) afin d'effectuer la passerelle en Bac 2 à l'erg?</strong><br><ul class="indent"><li>Bonjour,
+ pour rentrer directement en B2 à l'erg, il faut effectivement avoir 60 
+crédits dans une autre école et il faut que l'erg puisse valoriser ces 
+60 crédits sur base du cursus qu'on organise. Une autre possibilité est 
+la valorisation des acquis de l'expérience (VAE) qui peut se faire sur 
+base de 5 années de pratiques. Je ne sais pas dans quel cas tu te 
+trouves?&nbsp;</li><li>D'accord merci, Pour le moment je ne sais pas 
+encore si je vais obtenir les 60 crédits car mes examens sont encore en 
+cours.&nbsp; On croise les doigts pour toi alors ;-) Quoi qu'il en soit,
+ introduit une demande d'admission en cours d'études. Tu pourras nous 
+fournir les relevés de notes (de juin et/ou de septembre) dès que tu les
+ as.</li><li>Quels sont les démarches à effectuer pour la VAE dans le 
+cas où ce serait nécessaire? Fournir des documents prouvant ta pratique 
+durant 5 ans (travaux, factures, etc.), ce sera analysé par l'équipe 
+administrative et par le jury d'admission. N'hésite pas à écrire à 
+écrire à aec-vae@erg.be.</li><li>Parfait, un tout grand merci!</li></ul><br><strong>24/ Bonjour, le "concours" se déroule bien sur 3 jours? ce sont des ateliers sur toute la journée avec d'autres candidats?</strong><br><ul class="indent"><li>Si
+ tu parles des rencontres d'admission en BAC 1, il s'agit d'une journée 
+voire une journée et demie de workshop pour que tu puisses "tester" 
+l'erg. Ces workshops ne sont pas éliminatoires. Ensuite, il y a un 
+entretien avec des enseignant·e·s de l'orientation pour laquelle tu 
+postules. Il y a un horaire de passage par ordre alphabétique.</li><li>d'accord! merci. pensez_vous que ces rencontres puissent avoir lieu en distanciel si toutefois il y a un nouveau confinement.</li><li>S'il
+ y a un nouveau confinement, nous ne pourrons en effet pas nous voir 
+face à face, et dans ce cas-ci, nous communiqueront les nouvelles 
+modalités d'admission.</li><li>Il n' ya pas de problème pour que les étrangers européens se déplacent à Bruxelles en ce moment? pas de quatorzaine obligatoire?</li><li>J'imagine
+ que ça dépend du pays d'où tu viens. Il me semble que les frontières 
+belges sont ouvertes pour les pays de l'espace Shengen. Plus d'infos sur
+ le site du Centre de crise belge: <a href="https://centredecrise.be/fr/news/gestion-de-crise/questions-relatives-au-franchissement-de-nos-frontieres" rel="noreferrer noopener">https://centredecrise.be/fr/news/gestion-de-crise/questions-relatives-au-franchissement-de-nos-frontieres</a></li><li>ok. Merci beaucoup</li><li>ce n'est pas un concours</li><li></li></ul><strong>25/ En quoi consiste le master à finalité approfondie ?</strong><br><ul class="indent"><li>&nbsp;Il
+ est composé de deux années d'études: une année commune à tous les 
+Masters et une année composée de 45 crédits à l'erg et 15 crédits 
+théoriques à choisir dans une université partenaire.</li></ul><br><strong>26/
+ (Pour l'entrée en master dans les dossier de pré-inscription) À propos 
+des documents à fournir pour les justifications post bac, qu'est ce qui 
+est entendu par "• Les attestations ORIGINALES justifiant TOUTES les 
+activités après l’obtention du diplôme"&nbsp; ?&nbsp; Pas de photocopie 
+ou pas de duplicata ? Aussi, (pour les justificatifs d'etudes 
+supérieures) puisqu'on ne peut pas mettre de certificat de scolarité, 
+vaut-il mieux mettre le diplôme ?</strong><br><ul class="indent"><li><strong>Vous
+ devez nous fournir en pdf des copies de toutes vos activités après 
+votre bac. Contrat de travail ou études. Vous devez justifier les 5 
+dernières années. Les originaux vous seront demandées ultérieurement.</strong></li><li>D'accord merci !</li></ul><br><strong>27/ Pour le dossier de candidature, le projet principal doit il etre développer&nbsp;</strong><br><strong>... vous proposez un encart assez serré dans votre formulaire, ducoup je me demandais à quel point le détailler ?</strong><br><ul class="indent"><li>Bonjour, je suppose que tu parles du master.&nbsp;</li><li>oui</li><li>Tu
+ peux en parler brièvement selon la place qui est laissée. Cela permet 
+aux enseignant.e.s de voir brièvement vers quel projet tu te diriges, et
+ vous pourrez en parler ensemble lors de l'entretien d'admission.&nbsp;</li><li></li></ul><strong>28/ Pour le logement, y-a-t-il quelqu'un de l'école/une association d'étudiants qui puisse aider (je viens de Barcelone)?</strong><br><ul class="indent"><li>Bonjour, Il y a beaucoup d'annonces pour des logements sur le groupe facebook de l'erg: <a href="https://www.facebook.com/groups/)/" rel="noreferrer noopener">https://www.<strong><em><u>facebook</u></em></strong>.com/groups/)/</a>. Sinon, il y a aussi un site d'annonces pour logement étudiant: <a href="https://ple.mykot.be/" rel="noreferrer noopener">https://ple.mykot.be/</a>.</li><li>Merci bcp!</li></ul><br><strong>29/ <span class="color:black">Bonjour,
+ j'ai obtenu l'an dernier un Diplôme National d'Art à l'ESADSE 
+(saint-étienne France), nous disposions de beaucoup d'ateliers, grande 
+force de l'école. Quels sont les différents ateliers pratiques que vous 
+proposez? Merci beaucoup !</span></strong><br><ul class="indent"><li>C'est
+ sûr que l'ESADSE est super équipée! Nous ne sommes malheureusement pas 
+aussi bien lotis, mais ceci nous force à être inventif et à faire avec 
+les moyens du bord. Cela dit, nous avons de plus en plus d'outils à 
+disposition. Dans les locaux de l'erg, il y a un atelier bois, du 
+matériel photo, vidéo, super 8 et 16mm, le print lab (impression laser, 
+riso, plotter, découpeuse vynil), des ordinateurs portables et fixes. 
+Sur les sites partagés avec l'ESA Saint-Luc dont l'erg fait partie, il y
+ a un atelier de sérigraphie, gravure sur bois, gravure sur métal (il me
+ semble), lithographie, impression 3D. Il y a aussi un partenariat avec 
+le fablab d'iMal qui a découpeuse laser, imprimantes 3D...&nbsp;</li><li><span class="color:green">C'est
+ vrai que commencer à appréhender le design à st-etienne est plutôt une 
+chance! Merci de votre réponse, je pense aussi que les liens créés entre
+ les différentes écoles peut aussi favoriser la création. Faut il avoir 
+des projets validés par des profs ou équipes techniques avant d'avoir 
+accès aux ateliers, ou y a t il plutôt une liberté d'accès?&nbsp;</span></li><li>Cela dépend du type de matériel/atelier dont tu as besoin, difficile de répondre maintenant. Merci de votre réponse!!</li></ul><br><strong>30/
+ Pour entrer en master, il est demandé de faire le tour de ses 
+expériences professionnelles ultérieures, je travaille comme artiste 
+depuis 10 ans avec des tonnes de petits contrats, tout cela doit-il être
+ détaillé ? ou je peux fonctionner sous forme de bloc, par thème ?</strong><br><ul class="indent"><li>Bonjour,
+ en fait nous vous demandons ça d'une part pour en savoir plus sur votre
+ profil pour l'épreuve d'admission. Mais l'autre raison pour laquelle 
+nous vous demandons cela, c'est que nous devons prouver ce qu'un.e 
+étudiant.e a fait durant les 5 dernières années (des études, du travail,
+ des projets, etc.) auprès de notre inspection.&nbsp;</li><li>C'est donc
+ très important de documenter ce que vous avez fait durant les 5 
+dernières années académiques (pas forcément les 10). S'il manque des 
+choses ou si c'est difficile à comprendre vu toute votre expérience, on 
+revient vers vous ! Est-ce que je réponds bien à ta question?</li><li>oui merci !</li><li></li></ul><strong>31/
+ Bonjour, il n'y a pas, dans le formulaire d'inscription de champ pour 
+le prénom d'usage. Est-il possible de l'indiquer autrement ? Par mail ?</strong><br><ul class="indent"><li>Nom
+ d'usage ? Pour le formulaire, nous demandons toutes les coordonnées qui
+ se trouvent sur la carte d'identité et ou acte de naissance. Ce sont 
+des données qui seront remis au Ministère.</li><li>On rencontre pour 
+l'instant des difficultés administratives pour intégrer les prénoms 
+d'usage auprès des autorités qui contrôlent le travail de 
+l'administration. On est en train de chercher toutes les solutions 
+possibles que nous n'avons pas pour l'instant, on en parle? Mais oui tu 
+peux l'indiquer dans le mail comme ça on peut en faire...usage ;-)</li><li>D'accord. Merci !</li></ul><br><strong>32/ Bonjour, après un BTS en France, soit Bac+2, à quelle équivalence je peux pretendre ? Master ou Bachelor 1, 2 ?</strong><br><ul class="indent"><li>Tout
+ dépendra du BTS. En général les étudiants avec un BTS de graphisme 
+design peuvent faire une demande pour une éventuelle inscription en B2.</li><li>Merci !</li></ul><br><strong>33/
+ Pour rentrer en première année de bachelor, faut-il emmener un book 
+pour éventuellement présenter des projets persos pendant l'entretien ?</strong><br><ul class="indent"><li>Il n'y a pas de pré-réquis pour BAC 1, mais beaucoup de personnes amènent en effet un portfolio pendant l'entretien.</li><li>D'accord, merci bcp!</li></ul><br><strong>34/
+ Bonjour ! Je suis Suisse, et j'avoue que je suis perdue avec toutes ces
+ démarches administratives concernant les équivalences. Je ne comprends 
+pas comment je dois m'y prendre pour faire des demandes d'équivalences ?
+ Et si je comprends bien, avec un bac ( et un cfc, je ne sais pas si ce 
+terme parle à quelqu'un.e ), je peux prétendre à une entrée en bac1 
+?&nbsp;</strong><br>Bonjour, toutes les infos sont ici : <a href="http://wiki.erg.be/w/Admission_Bachelor_1" rel="noreferrer noopener">http://wiki.erg.be/w/Admission_Bachelor_1</a> Vous devez choisir le cas qui correspond à votre situation (par exemple : <a href="http://wiki.erg.be/w/J%E2%80%99ai_d%C3%A9j%C3%A0_obtenu_mon_Baccalaur%C3%A9at_(ou_dipl%C3%B4me_du_secondaire_national)_%C3%A0_l%E2%80%99%C3%A9tranger)" rel="noreferrer noopener">http://wiki.erg.be/w/J%E2%80%99ai_d%C3%A9j%C3%A0_obtenu_mon_Baccalaur%C3%A9at_(ou_dipl%C3%B4me_du_secondaire_national)_%C3%A0_l%E2%80%99%C3%A9tranger)</a>
+ dans cette page, vous trouverez un lien pour le service des 
+équivalences (ATTENTION le terme equivalences en Belgique signifie une 
+équivalence de diplôme) -&gt; <a href="http://www.equivalences.cfwb.be/" rel="noreferrer noopener">http://www.equivalences.cfwb.be/</a><br>super, merci beaucoup!! :-)<br><br><strong>35/
+ Bonjour, pour les grilles comparitives Bloc 1 et Bloc 2, est-ce qu'il 
+faut les équivalences très précises des cours ou est ce que c'est un peu
+ à nous de voir selon notre formation ? Je ne comprends pas vraiment 
+comment nous devons les remplir !</strong><br><ul class="indent"><li>Bonjour,
+ il faut faire au mieux mais on on bien conscient.e.s que ce n'est pas 
+évident et peu adapté parfois (c'est une obligation légale). Peut-être 
+mettre en vis-à-vis des cours artistiques des cours artistiques que tu 
+as suivi? Et idem pour les cours théoriques? Ca te semble faisable au 
+regard de ton parcours? Si ça ne correspond pas bien, nous trouverons 
+des solutions, c'est juste important de remettre ce document, quitte à 
+ce qu'il doive être adapté/complété par la suite. Ok pour toi?</li><li>Ok super merci beaucoup ! Ca devrais aller normalement ! :) :-)</li><li>Bonjour, et comment pouvons-nous calculez nos crédits au regard de nos notes ? pour entrer en B2 il faut 60 credits ?</li><li>Vous n'aviez pas de crédits?&nbsp;</li><li>Non je suis étudiante en France et nous n'avions pas ce système de crédit dans mon école, je suis donc perdue par rapport à ça</li><li>C'était une Manaa ou un BTS peut-être?</li><li>Une manaa et deux ans de bts design graphique</li><li>en tout cas de mon expérience (la même MANAA + BTS je suis entré en B2&nbsp;</li><li>voila le lien <a href="https://jitsi.erg.be/JPO-2020-questions-administratives" rel="noreferrer noopener">https://jitsi.erg.be/JPO-2020-questions-administratives</a></li><li>salut ! je vais t'envoyer un lien vers lejitsi de l'administration tu pourras leur poser la question ;)&nbsp;</li><li>Mettre en parallèle les cours, après il faut que nous analysions la situation.</li><li>D'accord merci pour vos réponses !</li><li></li></ul><strong>36/ Avez vous des contacts avec des associations de logements étudiants?</strong><br><ul class="indent"><li>Bonjour, voir la question 28 ;-)suuuper je vais voir :))</li><li></li></ul><strong>37/&nbsp;
+ Aux entretiens pour entrer en B2, j'ai vu que nous devons présenter des
+ travaux récents. Pouvons-nous présenter des travaux que vous aurez vu 
+auparavant dans notre portfolio que nous devons envoyer avec le dossier 
+d'inscription, ou alors vous attendez-vous à ce qu'on vous présente des 
+travaux différents de ceux de notre portfolio ?</strong><br><ul class="indent"><li>Salut ! tu peux présenter les travaux que tu veux à l'entretien :) qu'il soient dans ton dossier ou non !</li></ul><br><strong>40/ petite question d'un bac 3 peut on en savoir plus sur les différent</strong>s<strong> master possible ? quand on vient de média par exemple ! merci&nbsp;</strong><br><strong>par exemple politique du multiple&nbsp;</strong><br><ul class="indent"><li>&nbsp;Tous les Masters sont accessibles, ça va dépendre de ta pratique.</li><li>Les masters les plus "teintés" média sont les deux masters PEG Politique et expérimentations graphiques.&nbsp;</li><li>- Pratiques artistiques et complexité scientifique</li><li>- Design et politique du Multiple</li><li>Tu peux faire une recherche sur le site de l'Erg pour en savoir plus sur chacun de ces masters.</li><li>merci beaucoup !</li><li>on va vous répondre en live aussi</li><li></li></ul><strong>41/ En bac1, quel pourcentage du programme est consacré aux cours théoriques généraux (cours historiques, philosophiques...)?</strong><br><ul class="indent"><li>Salut !&nbsp; tu as 8h de cours théoriques hebdomadaires donc à peu près 30-40% :) Merci ! avec plaisir !</li></ul><br><strong>43/&nbsp;
+ Je ne recevrai pas mon equivalence de baccalaureat avant l'envoi de mon
+ dossier d'inscription, cela pose-t-il probleme ? puis-je la donner en 
+septembre ?</strong><br><ul class="indent"><li>il faut juste la preuve 
+que tu l'as bien faite. Tu dois envoyer ton dossier d'équivalence par 
+recommandé et nous apporter la preuve de l'envoi. La preuve de paiement 
+des 200 euros est à mettre dans le dossier d'équivalence (original). IL 
+faut impérativement que le dossier d'équivalence soit complet.&nbsp;</li></ul><br><strong>44/
+ Au moment des entretiens, pouvons-nous présenter notre portfolio sous 
+forme de pdf sur notre ordinateur, ou alors devons nous absolument le 
+presenter au format papier ?</strong><br><ul class="indent"><li>C'est possible mais c'est toujours plus parlant de voir les originaux...</li><li>&nbsp;Mais si les originaux sont numériques, alors...</li><li>oui&nbsp;</li><li>Nous pouvons apporter le portfolio papier et presenter les projets videos par exemple en apportant notre ordinateur ?</li><li>Bien sûr :)</li></ul><br><strong>45/
+ Sur la grille de cours comparative pour entrer en cours d’études, je 
+vois que nous devons rentrer des notes dans la colonne de droite. 
+N’ayant pas encore eu mes notes associées à l’obtention de mon diplôme 
+(que je recevrais dans l’été), puis-je mettre mes notes de bulletin de 
+deuxième semestre de cette année ?</strong><br><ul class="indent"><li>Vous pouvez simplement noter les noms des cours. L'administration de l'erg complétera le document par la suite.&nbsp;</li><li>Je
+ devrais donc dans l'été envoyer mes notes de dipl^me afin que l'equipe 
+administrative puisse completer par eux-même ma grille ?oui vous devez 
+nous envoyer par la suite un dossier complet.</li></ul><br><strong>46/ 
+Bonjour! Je suis vraiment attirée par la pluridisciplinarité de votre 
+école et je viens d’un background très sonore mais j’aimerais me diriger
+ vers la conception d’installations intéractifs/productions mêlant son 
+avec d’autres supports/médiums d’arts (plastiques et visuels). Je me 
+demandais vis à vis du cursus BA ou MA d’Arts Numériques s’il y avait 
+une place pour le son dans ces études ? ou si on parle « que » des 
+aspects visuels des Arts Numériques.&nbsp;</strong><br><ul class="indent"><li>Le
+ son est omniprésent à l'erg, il existe même un cours technique de son 
+en 2ème et 3 ème année . Les arts numériques sont envisagés comme un 
+"carrefour" entre l'installation du media, le code pur et la production 
+personnelle. Mais tout le monde fait du son à l'erg, il suffit 
+d'intégrer cette composante dans sa pratique, que ce soir en graphisme 
+ou AN.&nbsp;</li><li>Ok, merci beaucoup!</li><li>J'ai cru voir qu'il y 
+avait Lawrence Le Doux en tant que professeur de son, c'est bien 
+cela?oui :) en cours de son B3, on a fait un k7 sur dispo bandcamp je te
+ met le lien ici <a href="https://ergmelody.bandcamp.com/album/rpgiator-2" rel="noreferrer noopener">https://ergmelody.bandcamp.com/album/rpgiator-2</a> Enjoy :)</li><li>:D</li><li>on vient de le contacter il essaye de se connecter au live pour répondre à votre question</li><li>sinon
+ le son est très présent, avec donc les profs Laurent et Sylvie, mais 
+aussi à la radio ou dans la galerie ou dans d'autres cours.&nbsp;</li><li>En
+ cours de master narration spéculative on en parle beaucoup par exemple.
+ Qu'est-ce qu'une narration sonore ? Qu'est-ce que l'histoire de la 
+musique&nbsp; peut nous dire du monde, de comment depuis la musique on 
+peut spéculer le monde ?&nbsp;</li><li>Ok merci c'est super, je suis rassurée et contente de lire ça !</li><li>Laurent est connecté il va avoir la parole dans quelques secondes</li><li>Niquel</li><li>J'ai
+ déjà une formation assez poussée et technique en son donc c'était plus 
+pour savoir si on apprenait par exemple, Max MSP pour lier la video avec
+ le son pour créer des "ponts" entre justement video/son</li><li>Je 
+pense que tu trouveras d'office le moyen de donner vie à ton projet, si 
+tu veux créer des ponts entre tes productions en son avec de la vidéo ça
+ ne posera pas de pb&nbsp;</li><li>Ok ça marche ! merci</li></ul>L'approche
+ de Sylvie est différente de celle de Laurent. Complémentaire. Elle 
+vient de l'art sonore avec une formation à la fois plus technique et 
+orientée texture, musique concrète, création sonore, field recording 
+etc...&nbsp; Laurent a une approche en lien avec ses propres pratiques 
+musicales et sonores, djing, radio, bricolage, débrouille. Voilà.&nbsp;<br>Ok, merci et du coup là on parle plutôt de B2/B3 AN<br>pour les cours dédiés oui.&nbsp;<br>Mais
+ comme on disait ça n'empêche pas de travailler la question ailleurs, et
+ avoir des échanges ou un suivi par x ou y. L'école est vraiment 
+transdisciplinaire. J'interviens (peggy) dans le master narration et 
+plusieurs élèves présentent des travaux autour de la musique et du son, 
+que ça soit via leurs mémoires ou dans leurs pratiques.&nbsp;<br>Cette année au moins deux jurys de narration spéculative seront exclusivement sonores.&nbsp;<br>D'accord,
+ merci pour toutes ces réponses rassurantes, c'est justement cette 
+transdisciplinarité que je trouve chouette dans cette école. Merci 
+!&nbsp;<br>Si tu as d'autres questions envoies un mail à 
+information@erg.be on le fera suivre à Laurent et Sylvie ou autres 
+personnes.&nbsp;<br>Et puis bien sur, il y a la radio qui peut être investie par qui veut. (avec stream en ligne)<br>Super :)<br><a href="http://erg.be/ergoteradio/" rel="noreferrer noopener">http://erg.be/ergoteradio/</a><br><br><br>47/
+ Bonjour, je cherche à commencer un bachelier en graphisme. J'ai déjà 
+fait Bachelier + Master dans le domaine de la com', ensuite j'ai 
+travaillé un an en agence créative et une autre année en agence 
+média/créa. Je me suis rendu compte que la com' n'était pas pour moi car
+ j'ai davantage envie d'être du côté de la création plutôt que le 
+management. Est-ce que mon parcours reste légitime (25 ans - reprise 
+d'études) en sachant que j'ai toujours été intéressé par le 
+graphisme?&nbsp;<br><ul class="indent"><li>J'imagine que oui car j'ai 
+déjà eu des étudiants d'un certain âge, qui étaient déjà dans la vie 
+professionnelle et qui souhaitaient se réorienter. Je remets ta question
+ dans la partie administrative en bas pour voir s'il y a une démarche 
+différente ou non.</li><li>Bonjour, oui bien sur. Il n'y a aucun problème, beaucoup d'étudiant.e.s ont déjà eu un parcours avant d'arriver à l'erg.&nbsp;</li><li>Les
+ démarches sont semblables ;-) On doit juste te demander de nous 
+indiquer et prouver ce que tu as fait ces cinq dernières années: nous 
+devons montrer cela à notre inspection (ministère).&nbsp;</li><li>Souhaites-tu
+ entamer un bachelier en B1? Si tu souhaites tenter de valoriser ton 
+parcours académique antérieur, on peut y regarder ensemble lors de ta 
+demande d'admission pour voir si il y a des possibilités...Bonjour, j'ai
+ déjà rassemblé les documents de Bachelier/Master qui prouvent mon 
+inscription+relevés de notes. J'ai aussi commencé à rassembler les 
+autres documents pour pouvoir s'inscrire. J'aimerais entrer en BAC 1 
+mais je ne sais pas si c'est ce qui est le plus logique, je me dis que 
+ça serait logique car je n'ai pas eu de formation artistique du tout. Je
+ dois faire ma demande d'admission en ligne ou bien c'est préférable de 
+venir sur place du coup? Effectivement cela serait plus pertinent de 
+commencer en B1 vu votre parcours en Com.Quel serait la démarche la plus
+ simple ? Rassembler l'ensemble des documents et venir sur place avant 
+le 15 juillet pour faire un dossier d'inscription ? Ou bien tout envoyer
+ en ligne ? Je me sentirais mieux de pouvoir discuter et vérifier que 
+tout est en ordre.&nbsp;</li><li>Demande d'admission en ligne uniquement
+ ;-) Si des choses sont manquantes ou problème, on prend contact avec 
+vous, pas d'inquiétude. Ok pas de soucis Cela se passe comme ça cette 
+année vu les incertitudes sur les conditions sanitaires...</li><li></li></ul><strong>48/ Bonjour après un b3 quelle démarche pour rentrer en master ? Merci</strong>&nbsp;<br>Toutes les info sont sur le site de l'erg. Document à télécharger et à nous envoyer via mail.<br>Vous devez également nous envoyer certains documents.<br><br><br><s>49/
+ Est-ce que choisir l'orientation dessin dans le pôle art implique&nbsp;
+ uniquement la pratique du dessin ou est-ce beaucoup plus large ?&nbsp;</s><br><s>Je
+ remets ta question dans la 1re partie du pad, car je pense que les 
+enseignant·e·s de l'orientation dessin seront plus à même de te 
+répondre.</s><br><br><strong>50/Une petite question administrative, je 
+n'ai pas trouvé le coût de la formation exemple pour le Master en Arts 
+Numériques. J'ai vu 100€ de frais d'inscription mais je ne sais pas le 
+coût des cours.</strong><br><ul class="indent"><li>Bonjour, le minerval ne varie pas selon l'orientation, il varie en fonction de l'année d'études.</li><li>En master 1, le minerval est de 873€. En master 2 (car année diplômante), il est de 924€.&nbsp;</li><li>Plus d'infos et infos sur les aides sociales: erg.be - Menu - Mode d'emploi - Frais d'inscription.</li><li></li><li>Ok TOP, merci:)</li><li>Pour
+ les étudiant.e.s hors Union Européenne et qui ne peuvent pas être 
+assimilé.e.s, le montant est par contre plus important car il faut y 
+ajouter une part (voir le site web). Ce n'est pas ton cas?&nbsp;</li></ul>Non c'est bon je suis italienne&nbsp; Super ! Mais d'accord merci pour l'info !<br><br><br>51/
+ Afin d'être considéré comme "étudiant modeste" (statut), quels sont les
+ pré-recquis. Je compte travailler comme étudiant tout en faisant les 
+études et je ne vis plus chez mes parents depuis deux ans, est-ce que 
+cela me donne un statut particulier ?<br><ul class="indent"><li>Bonjour, en fait la définition d'un.e "étudiant.e modeste" est imposée par la Fédération Wallonie-Bruxelles.&nbsp;</li><li>Quelle
+ que soit ta situation, le Service social de l'école est là pour vous 
+aider (il faut prouver vos revenus et rendre un dossier, on vous 
+explique tout en début d'année). Il peut vous aider soit en vous 
+attribuant ce statut d' "étudiant.e modeste", soit en vous octroyant des
+ aides de l'école en fonction de vos situations.&nbsp;</li><li>Il y a 
+également les bourses d'études de la Fédération Wallonie-Bruxelles 
+(attention, là, il y a des conditions de nationalité et/ou résidence). 
+Plus d'infos ici: <a href="https://allocations-etudes.cfwb.be/" rel="noreferrer noopener">https://allocations-etudes.cfwb.be/</a>
+ Ok, merci beaucoup. Est-ce que je dois contacter le service social de 
+moi-même ou bien attendre le début d'année académique ?&nbsp;</li><li>Si
+ cela te rassurerait d'avoir plus d'informations maintenant, tu peux 
+écrire à Thérèse Groulard (servicesocial@stluc-bruxelles.be) pour 
+obtenir la brochure d'informations 2020-21 (elle n'est pas encore 
+disponible sur le site web). Pour l'introduction d'une demande, ce sera 
+en début d'année académique.Ok je contacterai donc, est-ce que c'est 
+cette adresse: Marie Alui – Service comptabilité - 
+secretariatfinancestluc@gmail.com ? Plutôt Thérèse Groulard (voir 
+ci-dessus) dans un premier temps. Le service compta c'est plutôt pour le
+ paiement du minerval par la suite.&nbsp;</li><li>NB: un acompte de 50€ 
+sur le minerval doit être payé avant le 31 octobre 2020. Mais pour le 
+solde du minerval, vous avez jusqu'au 31 janvier 2021. Ok parfait, merci
+ pour les précisions/informations</li><li></li><li></li><li></li></ul><br><br><strong>Nous allons maintenant archiver ce pad! Nous espérons que vous avons pu répondre à vos questions!</strong><br><br><br><br>
+
+
+</strong></div></body></html>

special/jpo2021-live/index.html

@@ -0,0 +1,83 @@
+<!doctype>
+<html>
+	<head>
+		<title>erg ~ Portes ouvertes 2021</title>
+		<style>
+		/* F O N T E S */
+		@font-face {
+		    font-family: "Combined";
+		    src: url('/mw/skins/foreground/assets/fonts/combined.otf');
+		    font-style:   normal;
+		    font-weight:  normal;
+		}
+		@font-face {
+		    font-family: "Vega";
+		    src: url('/mw/skins/foreground/assets/fonts/Vega-Regular.otf');
+		    src: url('/mw/skins/foreground/assets/fonts/Vega-Regular.ttf') format("truetype");
+		    src: url("/mw/skins/foreground/assets/fonts/Vega-Regular-Webfont.svg") format("svg");
+		    src: url("/mw/skins/foreground/assets/fonts/Vega-Regular.woff") format("woff");
+		    src: url("/mw/skins/foreground/assets/fonts/Vega-Regular.woff2") format("woff2");
+		    font-style:   normal;
+		    font-weight:  normal;
+		}
+
+			body {
+				background-color: thistle;
+				height: 100%;
+				font-family: Vega;
+				display: flex;
+				flex-direction: column;
+				box-sizing: border-box;
+				overflow: hidden;
+			}
+			h1, h2 {
+				font-family: Combined;
+				font-weight: normal;
+				margin-bottom: 0;
+				display: contents;
+			}
+			h2 {
+				margin-bottom: 1em;
+			}
+			iframe {
+				width: 100%;
+				height: 100%;
+				border: 0;
+				flex-grow: 1;
+				box-sizing: border-box;
+			}
+			ul {
+				display: flex;
+				margin: 1.2em 0;
+				padding: 0;
+				justify-content: space-between;
+			}
+			li {
+				list-style-type: none;
+				padding: 0;
+				margin: 0;
+				border: 1px solid black;
+				border-radius: 10px;
+				padding: 0.25em 0.5em;
+				flex-basis: 10%;
+			}
+			a {
+				text-decoration: none;
+				color: inherit;
+			}
+		</style>
+	</head>
+	<body>
+		<h1>erg</h1>
+		<h2>journées portes ouvertes 2021</h2>
+		<ul>
+			<li><a href="https://annuel.framapad.org/p/erg-jpo2021-admin" target="porte">Questions à l’administration</a></li>
+		    	<li><a href="https://annuel.framapad.org/p/erg-jpo2021-profs" target="porte">Questions aux enseignant·e·s</a></li>
+			<li><a href="https://www.mixcloud.com/Ergote_Radio/" target="_blank">Ergote Radio</a></li>
+			<li><a href="https://vimeo.com/showcase/8533632" target="_blank">Vidéos JPO 2021</a></li>
+		</ul>
+
+		<iframe name="porte" src="welcome.html"></iframe>
+
+	</body>
+</html>

special/jpo2021-live/welcome.html

@@ -0,0 +1,49 @@
+<!doctype>
+<html>
+	<head>
+		<title>erg ~ Portes ouvertes 2021</title>
+		<style>
+		/* F O N T E S */
+		@font-face {
+		    font-family: "Combined";
+		    src: url('/mw/skins/foreground/assets/fonts/combined.otf');
+		    font-style:   normal;
+		    font-weight:  normal;
+		}
+		@font-face {
+		    font-family: "Vega";
+		    src: url('/mw/skins/foreground/assets/fonts/Vega-Regular.otf');
+		    src: url('/mw/skins/foreground/assets/fonts/Vega-Regular.ttf') format("truetype");
+		    src: url("/mw/skins/foreground/assets/fonts/Vega-Regular-Webfont.svg") format("svg");
+		    src: url("/mw/skins/foreground/assets/fonts/Vega-Regular.woff") format("woff");
+		    src: url("/mw/skins/foreground/assets/fonts/Vega-Regular.woff2") format("woff2");
+		    font-style:   normal;
+		    font-weight:  normal;
+		}
+
+			body {
+				width: 100%;
+				height: 100%;
+				background-color: thistle;
+				font-family: Vega;
+				display: flex;
+				flex-direction: column;
+				line-height: 1.2em;
+			}
+			h1, h2 {
+				font-family: Combined;
+				font-weight: normal;
+			}
+			iframe {
+				width: 100%;
+				border: 0;
+				flex-grow: 1;
+				box-sizing: border-box;
+				
+			}
+		</style>
+	</head>
+	<body>
+		<img src="https://wiki.erg.be/mw/images/c/cb/Affiche_Jury_2021_%2B_PO_FINAL.jpg">
+	</body>
+</html>

special/recentchanges/Makefile

@@ -0,0 +1,6 @@
+
+all: dist/app.js
+
+dist/app.js: src/*.js
+	# node_modules/.bin/rollup src/index.js --file dist/index.js --format iife
+	node_modules/.bin/rollup -c

special/recentchanges/dist/recentchanges.js

@@ -0,0 +1,915 @@
+(function () {
+  'use strict';
+
+  var xhtml = "http://www.w3.org/1999/xhtml";
+
+  var namespaces = {
+    svg: "http://www.w3.org/2000/svg",
+    xhtml: xhtml,
+    xlink: "http://www.w3.org/1999/xlink",
+    xml: "http://www.w3.org/XML/1998/namespace",
+    xmlns: "http://www.w3.org/2000/xmlns/"
+  };
+
+  function namespace(name) {
+    var prefix = name += "", i = prefix.indexOf(":");
+    if (i >= 0 && (prefix = name.slice(0, i)) !== "xmlns") name = name.slice(i + 1);
+    return namespaces.hasOwnProperty(prefix) ? {space: namespaces[prefix], local: name} : name;
+  }
+
+  function creatorInherit(name) {
+    return function() {
+      var document = this.ownerDocument,
+          uri = this.namespaceURI;
+      return uri === xhtml && document.documentElement.namespaceURI === xhtml
+          ? document.createElement(name)
+          : document.createElementNS(uri, name);
+    };
+  }
+
+  function creatorFixed(fullname) {
+    return function() {
+      return this.ownerDocument.createElementNS(fullname.space, fullname.local);
+    };
+  }
+
+  function creator(name) {
+    var fullname = namespace(name);
+    return (fullname.local
+        ? creatorFixed
+        : creatorInherit)(fullname);
+  }
+
+  function none() {}
+
+  function selector(selector) {
+    return selector == null ? none : function() {
+      return this.querySelector(selector);
+    };
+  }
+
+  function selection_select(select) {
+    if (typeof select !== "function") select = selector(select);
+
+    for (var groups = this._groups, m = groups.length, subgroups = new Array(m), j = 0; j < m; ++j) {
+      for (var group = groups[j], n = group.length, subgroup = subgroups[j] = new Array(n), node, subnode, i = 0; i < n; ++i) {
+        if ((node = group[i]) && (subnode = select.call(node, node.__data__, i, group))) {
+          if ("__data__" in node) subnode.__data__ = node.__data__;
+          subgroup[i] = subnode;
+        }
+      }
+    }
+
+    return new Selection(subgroups, this._parents);
+  }
+
+  function empty() {
+    return [];
+  }
+
+  function selectorAll(selector) {
+    return selector == null ? empty : function() {
+      return this.querySelectorAll(selector);
+    };
+  }
+
+  function selection_selectAll(select) {
+    if (typeof select !== "function") select = selectorAll(select);
+
+    for (var groups = this._groups, m = groups.length, subgroups = [], parents = [], j = 0; j < m; ++j) {
+      for (var group = groups[j], n = group.length, node, i = 0; i < n; ++i) {
+        if (node = group[i]) {
+          subgroups.push(select.call(node, node.__data__, i, group));
+          parents.push(node);
+        }
+      }
+    }
+
+    return new Selection(subgroups, parents);
+  }
+
+  function matcher(selector) {
+    return function() {
+      return this.matches(selector);
+    };
+  }
+
+  function selection_filter(match) {
+    if (typeof match !== "function") match = matcher(match);
+
+    for (var groups = this._groups, m = groups.length, subgroups = new Array(m), j = 0; j < m; ++j) {
+      for (var group = groups[j], n = group.length, subgroup = subgroups[j] = [], node, i = 0; i < n; ++i) {
+        if ((node = group[i]) && match.call(node, node.__data__, i, group)) {
+          subgroup.push(node);
+        }
+      }
+    }
+
+    return new Selection(subgroups, this._parents);
+  }
+
+  function sparse(update) {
+    return new Array(update.length);
+  }
+
+  function selection_enter() {
+    return new Selection(this._enter || this._groups.map(sparse), this._parents);
+  }
+
+  function EnterNode(parent, datum) {
+    this.ownerDocument = parent.ownerDocument;
+    this.namespaceURI = parent.namespaceURI;
+    this._next = null;
+    this._parent = parent;
+    this.__data__ = datum;
+  }
+
+  EnterNode.prototype = {
+    constructor: EnterNode,
+    appendChild: function(child) { return this._parent.insertBefore(child, this._next); },
+    insertBefore: function(child, next) { return this._parent.insertBefore(child, next); },
+    querySelector: function(selector) { return this._parent.querySelector(selector); },
+    querySelectorAll: function(selector) { return this._parent.querySelectorAll(selector); }
+  };
+
+  function constant(x) {
+    return function() {
+      return x;
+    };
+  }
+
+  var keyPrefix = "$"; // Protect against keys like “__proto__”.
+
+  function bindIndex(parent, group, enter, update, exit, data) {
+    var i = 0,
+        node,
+        groupLength = group.length,
+        dataLength = data.length;
+
+    // Put any non-null nodes that fit into update.
+    // Put any null nodes into enter.
+    // Put any remaining data into enter.
+    for (; i < dataLength; ++i) {
+      if (node = group[i]) {
+        node.__data__ = data[i];
+        update[i] = node;
+      } else {
+        enter[i] = new EnterNode(parent, data[i]);
+      }
+    }
+
+    // Put any non-null nodes that don’t fit into exit.
+    for (; i < groupLength; ++i) {
+      if (node = group[i]) {
+        exit[i] = node;
+      }
+    }
+  }
+
+  function bindKey(parent, group, enter, update, exit, data, key) {
+    var i,
+        node,
+        nodeByKeyValue = {},
+        groupLength = group.length,
+        dataLength = data.length,
+        keyValues = new Array(groupLength),
+        keyValue;
+
+    // Compute the key for each node.
+    // If multiple nodes have the same key, the duplicates are added to exit.
+    for (i = 0; i < groupLength; ++i) {
+      if (node = group[i]) {
+        keyValues[i] = keyValue = keyPrefix + key.call(node, node.__data__, i, group);
+        if (keyValue in nodeByKeyValue) {
+          exit[i] = node;
+        } else {
+          nodeByKeyValue[keyValue] = node;
+        }
+      }
+    }
+
+    // Compute the key for each datum.
+    // If there a node associated with this key, join and add it to update.
+    // If there is not (or the key is a duplicate), add it to enter.
+    for (i = 0; i < dataLength; ++i) {
+      keyValue = keyPrefix + key.call(parent, data[i], i, data);
+      if (node = nodeByKeyValue[keyValue]) {
+        update[i] = node;
+        node.__data__ = data[i];
+        nodeByKeyValue[keyValue] = null;
+      } else {
+        enter[i] = new EnterNode(parent, data[i]);
+      }
+    }
+
+    // Add any remaining nodes that were not bound to data to exit.
+    for (i = 0; i < groupLength; ++i) {
+      if ((node = group[i]) && (nodeByKeyValue[keyValues[i]] === node)) {
+        exit[i] = node;
+      }
+    }
+  }
+
+  function selection_data(value, key) {
+    if (!value) {
+      data = new Array(this.size()), j = -1;
+      this.each(function(d) { data[++j] = d; });
+      return data;
+    }
+
+    var bind = key ? bindKey : bindIndex,
+        parents = this._parents,
+        groups = this._groups;
+
+    if (typeof value !== "function") value = constant(value);
+
+    for (var m = groups.length, update = new Array(m), enter = new Array(m), exit = new Array(m), j = 0; j < m; ++j) {
+      var parent = parents[j],
+          group = groups[j],
+          groupLength = group.length,
+          data = value.call(parent, parent && parent.__data__, j, parents),
+          dataLength = data.length,
+          enterGroup = enter[j] = new Array(dataLength),
+          updateGroup = update[j] = new Array(dataLength),
+          exitGroup = exit[j] = new Array(groupLength);
+
+      bind(parent, group, enterGroup, updateGroup, exitGroup, data, key);
+
+      // Now connect the enter nodes to their following update node, such that
+      // appendChild can insert the materialized enter node before this node,
+      // rather than at the end of the parent node.
+      for (var i0 = 0, i1 = 0, previous, next; i0 < dataLength; ++i0) {
+        if (previous = enterGroup[i0]) {
+          if (i0 >= i1) i1 = i0 + 1;
+          while (!(next = updateGroup[i1]) && ++i1 < dataLength);
+          previous._next = next || null;
+        }
+      }
+    }
+
+    update = new Selection(update, parents);
+    update._enter = enter;
+    update._exit = exit;
+    return update;
+  }
+
+  function selection_exit() {
+    return new Selection(this._exit || this._groups.map(sparse), this._parents);
+  }
+
+  function selection_join(onenter, onupdate, onexit) {
+    var enter = this.enter(), update = this, exit = this.exit();
+    enter = typeof onenter === "function" ? onenter(enter) : enter.append(onenter + "");
+    if (onupdate != null) update = onupdate(update);
+    if (onexit == null) exit.remove(); else onexit(exit);
+    return enter && update ? enter.merge(update).order() : update;
+  }
+
+  function selection_merge(selection) {
+
+    for (var groups0 = this._groups, groups1 = selection._groups, m0 = groups0.length, m1 = groups1.length, m = Math.min(m0, m1), merges = new Array(m0), j = 0; j < m; ++j) {
+      for (var group0 = groups0[j], group1 = groups1[j], n = group0.length, merge = merges[j] = new Array(n), node, i = 0; i < n; ++i) {
+        if (node = group0[i] || group1[i]) {
+          merge[i] = node;
+        }
+      }
+    }
+
+    for (; j < m0; ++j) {
+      merges[j] = groups0[j];
+    }
+
+    return new Selection(merges, this._parents);
+  }
+
+  function selection_order() {
+
+    for (var groups = this._groups, j = -1, m = groups.length; ++j < m;) {
+      for (var group = groups[j], i = group.length - 1, next = group[i], node; --i >= 0;) {
+        if (node = group[i]) {
+          if (next && node.compareDocumentPosition(next) ^ 4) next.parentNode.insertBefore(node, next);
+          next = node;
+        }
+      }
+    }
+
+    return this;
+  }
+
+  function selection_sort(compare) {
+    if (!compare) compare = ascending;
+
+    function compareNode(a, b) {
+      return a && b ? compare(a.__data__, b.__data__) : !a - !b;
+    }
+
+    for (var groups = this._groups, m = groups.length, sortgroups = new Array(m), j = 0; j < m; ++j) {
+      for (var group = groups[j], n = group.length, sortgroup = sortgroups[j] = new Array(n), node, i = 0; i < n; ++i) {
+        if (node = group[i]) {
+          sortgroup[i] = node;
+        }
+      }
+      sortgroup.sort(compareNode);
+    }
+
+    return new Selection(sortgroups, this._parents).order();
+  }
+
+  function ascending(a, b) {
+    return a < b ? -1 : a > b ? 1 : a >= b ? 0 : NaN;
+  }
+
+  function selection_call() {
+    var callback = arguments[0];
+    arguments[0] = this;
+    callback.apply(null, arguments);
+    return this;
+  }
+
+  function selection_nodes() {
+    var nodes = new Array(this.size()), i = -1;
+    this.each(function() { nodes[++i] = this; });
+    return nodes;
+  }
+
+  function selection_node() {
+
+    for (var groups = this._groups, j = 0, m = groups.length; j < m; ++j) {
+      for (var group = groups[j], i = 0, n = group.length; i < n; ++i) {
+        var node = group[i];
+        if (node) return node;
+      }
+    }
+
+    return null;
+  }
+
+  function selection_size() {
+    var size = 0;
+    this.each(function() { ++size; });
+    return size;
+  }
+
+  function selection_empty() {
+    return !this.node();
+  }
+
+  function selection_each(callback) {
+
+    for (var groups = this._groups, j = 0, m = groups.length; j < m; ++j) {
+      for (var group = groups[j], i = 0, n = group.length, node; i < n; ++i) {
+        if (node = group[i]) callback.call(node, node.__data__, i, group);
+      }
+    }
+
+    return this;
+  }
+
+  function attrRemove(name) {
+    return function() {
+      this.removeAttribute(name);
+    };
+  }
+
+  function attrRemoveNS(fullname) {
+    return function() {
+      this.removeAttributeNS(fullname.space, fullname.local);
+    };
+  }
+
+  function attrConstant(name, value) {
+    return function() {
+      this.setAttribute(name, value);
+    };
+  }
+
+  function attrConstantNS(fullname, value) {
+    return function() {
+      this.setAttributeNS(fullname.space, fullname.local, value);
+    };
+  }
+
+  function attrFunction(name, value) {
+    return function() {
+      var v = value.apply(this, arguments);
+      if (v == null) this.removeAttribute(name);
+      else this.setAttribute(name, v);
+    };
+  }
+
+  function attrFunctionNS(fullname, value) {
+    return function() {
+      var v = value.apply(this, arguments);
+      if (v == null) this.removeAttributeNS(fullname.space, fullname.local);
+      else this.setAttributeNS(fullname.space, fullname.local, v);
+    };
+  }
+
+  function selection_attr(name, value) {
+    var fullname = namespace(name);
+
+    if (arguments.length < 2) {
+      var node = this.node();
+      return fullname.local
+          ? node.getAttributeNS(fullname.space, fullname.local)
+          : node.getAttribute(fullname);
+    }
+
+    return this.each((value == null
+        ? (fullname.local ? attrRemoveNS : attrRemove) : (typeof value === "function"
+        ? (fullname.local ? attrFunctionNS : attrFunction)
+        : (fullname.local ? attrConstantNS : attrConstant)))(fullname, value));
+  }
+
+  function defaultView(node) {
+    return (node.ownerDocument && node.ownerDocument.defaultView) // node is a Node
+        || (node.document && node) // node is a Window
+        || node.defaultView; // node is a Document
+  }
+
+  function styleRemove(name) {
+    return function() {
+      this.style.removeProperty(name);
+    };
+  }
+
+  function styleConstant(name, value, priority) {
+    return function() {
+      this.style.setProperty(name, value, priority);
+    };
+  }
+
+  function styleFunction(name, value, priority) {
+    return function() {
+      var v = value.apply(this, arguments);
+      if (v == null) this.style.removeProperty(name);
+      else this.style.setProperty(name, v, priority);
+    };
+  }
+
+  function selection_style(name, value, priority) {
+    return arguments.length > 1
+        ? this.each((value == null
+              ? styleRemove : typeof value === "function"
+              ? styleFunction
+              : styleConstant)(name, value, priority == null ? "" : priority))
+        : styleValue(this.node(), name);
+  }
+
+  function styleValue(node, name) {
+    return node.style.getPropertyValue(name)
+        || defaultView(node).getComputedStyle(node, null).getPropertyValue(name);
+  }
+
+  function propertyRemove(name) {
+    return function() {
+      delete this[name];
+    };
+  }
+
+  function propertyConstant(name, value) {
+    return function() {
+      this[name] = value;
+    };
+  }
+
+  function propertyFunction(name, value) {
+    return function() {
+      var v = value.apply(this, arguments);
+      if (v == null) delete this[name];
+      else this[name] = v;
+    };
+  }
+
+  function selection_property(name, value) {
+    return arguments.length > 1
+        ? this.each((value == null
+            ? propertyRemove : typeof value === "function"
+            ? propertyFunction
+            : propertyConstant)(name, value))
+        : this.node()[name];
+  }
+
+  function classArray(string) {
+    return string.trim().split(/^|\s+/);
+  }
+
+  function classList(node) {
+    return node.classList || new ClassList(node);
+  }
+
+  function ClassList(node) {
+    this._node = node;
+    this._names = classArray(node.getAttribute("class") || "");
+  }
+
+  ClassList.prototype = {
+    add: function(name) {
+      var i = this._names.indexOf(name);
+      if (i < 0) {
+        this._names.push(name);
+        this._node.setAttribute("class", this._names.join(" "));
+      }
+    },
+    remove: function(name) {
+      var i = this._names.indexOf(name);
+      if (i >= 0) {
+        this._names.splice(i, 1);
+        this._node.setAttribute("class", this._names.join(" "));
+      }
+    },
+    contains: function(name) {
+      return this._names.indexOf(name) >= 0;
+    }
+  };
+
+  function classedAdd(node, names) {
+    var list = classList(node), i = -1, n = names.length;
+    while (++i < n) list.add(names[i]);
+  }
+
+  function classedRemove(node, names) {
+    var list = classList(node), i = -1, n = names.length;
+    while (++i < n) list.remove(names[i]);
+  }
+
+  function classedTrue(names) {
+    return function() {
+      classedAdd(this, names);
+    };
+  }
+
+  function classedFalse(names) {
+    return function() {
+      classedRemove(this, names);
+    };
+  }
+
+  function classedFunction(names, value) {
+    return function() {
+      (value.apply(this, arguments) ? classedAdd : classedRemove)(this, names);
+    };
+  }
+
+  function selection_classed(name, value) {
+    var names = classArray(name + "");
+
+    if (arguments.length < 2) {
+      var list = classList(this.node()), i = -1, n = names.length;
+      while (++i < n) if (!list.contains(names[i])) return false;
+      return true;
+    }
+
+    return this.each((typeof value === "function"
+        ? classedFunction : value
+        ? classedTrue
+        : classedFalse)(names, value));
+  }
+
+  function textRemove() {
+    this.textContent = "";
+  }
+
+  function textConstant(value) {
+    return function() {
+      this.textContent = value;
+    };
+  }
+
+  function textFunction(value) {
+    return function() {
+      var v = value.apply(this, arguments);
+      this.textContent = v == null ? "" : v;
+    };
+  }
+
+  function selection_text(value) {
+    return arguments.length
+        ? this.each(value == null
+            ? textRemove : (typeof value === "function"
+            ? textFunction
+            : textConstant)(value))
+        : this.node().textContent;
+  }
+
+  function htmlRemove() {
+    this.innerHTML = "";
+  }
+
+  function htmlConstant(value) {
+    return function() {
+      this.innerHTML = value;
+    };
+  }
+
+  function htmlFunction(value) {
+    return function() {
+      var v = value.apply(this, arguments);
+      this.innerHTML = v == null ? "" : v;
+    };
+  }
+
+  function selection_html(value) {
+    return arguments.length
+        ? this.each(value == null
+            ? htmlRemove : (typeof value === "function"
+            ? htmlFunction
+            : htmlConstant)(value))
+        : this.node().innerHTML;
+  }
+
+  function raise() {
+    if (this.nextSibling) this.parentNode.appendChild(this);
+  }
+
+  function selection_raise() {
+    return this.each(raise);
+  }
+
+  function lower() {
+    if (this.previousSibling) this.parentNode.insertBefore(this, this.parentNode.firstChild);
+  }
+
+  function selection_lower() {
+    return this.each(lower);
+  }
+
+  function selection_append(name) {
+    var create = typeof name === "function" ? name : creator(name);
+    return this.select(function() {
+      return this.appendChild(create.apply(this, arguments));
+    });
+  }
+
+  function constantNull() {
+    return null;
+  }
+
+  function selection_insert(name, before) {
+    var create = typeof name === "function" ? name : creator(name),
+        select = before == null ? constantNull : typeof before === "function" ? before : selector(before);
+    return this.select(function() {
+      return this.insertBefore(create.apply(this, arguments), select.apply(this, arguments) || null);
+    });
+  }
+
+  function remove() {
+    var parent = this.parentNode;
+    if (parent) parent.removeChild(this);
+  }
+
+  function selection_remove() {
+    return this.each(remove);
+  }
+
+  function selection_cloneShallow() {
+    return this.parentNode.insertBefore(this.cloneNode(false), this.nextSibling);
+  }
+
+  function selection_cloneDeep() {
+    return this.parentNode.insertBefore(this.cloneNode(true), this.nextSibling);
+  }
+
+  function selection_clone(deep) {
+    return this.select(deep ? selection_cloneDeep : selection_cloneShallow);
+  }
+
+  function selection_datum(value) {
+    return arguments.length
+        ? this.property("__data__", value)
+        : this.node().__data__;
+  }
+
+  var filterEvents = {};
+
+  if (typeof document !== "undefined") {
+    var element = document.documentElement;
+    if (!("onmouseenter" in element)) {
+      filterEvents = {mouseenter: "mouseover", mouseleave: "mouseout"};
+    }
+  }
+
+  function filterContextListener(listener, index, group) {
+    listener = contextListener(listener, index, group);
+    return function(event) {
+      var related = event.relatedTarget;
+      if (!related || (related !== this && !(related.compareDocumentPosition(this) & 8))) {
+        listener.call(this, event);
+      }
+    };
+  }
+
+  function contextListener(listener, index, group) {
+    return function(event1) {
+      try {
+        listener.call(this, this.__data__, index, group);
+      } finally {
+      }
+    };
+  }
+
+  function parseTypenames(typenames) {
+    return typenames.trim().split(/^|\s+/).map(function(t) {
+      var name = "", i = t.indexOf(".");
+      if (i >= 0) name = t.slice(i + 1), t = t.slice(0, i);
+      return {type: t, name: name};
+    });
+  }
+
+  function onRemove(typename) {
+    return function() {
+      var on = this.__on;
+      if (!on) return;
+      for (var j = 0, i = -1, m = on.length, o; j < m; ++j) {
+        if (o = on[j], (!typename.type || o.type === typename.type) && o.name === typename.name) {
+          this.removeEventListener(o.type, o.listener, o.capture);
+        } else {
+          on[++i] = o;
+        }
+      }
+      if (++i) on.length = i;
+      else delete this.__on;
+    };
+  }
+
+  function onAdd(typename, value, capture) {
+    var wrap = filterEvents.hasOwnProperty(typename.type) ? filterContextListener : contextListener;
+    return function(d, i, group) {
+      var on = this.__on, o, listener = wrap(value, i, group);
+      if (on) for (var j = 0, m = on.length; j < m; ++j) {
+        if ((o = on[j]).type === typename.type && o.name === typename.name) {
+          this.removeEventListener(o.type, o.listener, o.capture);
+          this.addEventListener(o.type, o.listener = listener, o.capture = capture);
+          o.value = value;
+          return;
+        }
+      }
+      this.addEventListener(typename.type, listener, capture);
+      o = {type: typename.type, name: typename.name, value: value, listener: listener, capture: capture};
+      if (!on) this.__on = [o];
+      else on.push(o);
+    };
+  }
+
+  function selection_on(typename, value, capture) {
+    var typenames = parseTypenames(typename + ""), i, n = typenames.length, t;
+
+    if (arguments.length < 2) {
+      var on = this.node().__on;
+      if (on) for (var j = 0, m = on.length, o; j < m; ++j) {
+        for (i = 0, o = on[j]; i < n; ++i) {
+          if ((t = typenames[i]).type === o.type && t.name === o.name) {
+            return o.value;
+          }
+        }
+      }
+      return;
+    }
+
+    on = value ? onAdd : onRemove;
+    if (capture == null) capture = false;
+    for (i = 0; i < n; ++i) this.each(on(typenames[i], value, capture));
+    return this;
+  }
+
+  function dispatchEvent(node, type, params) {
+    var window = defaultView(node),
+        event = window.CustomEvent;
+
+    if (typeof event === "function") {
+      event = new event(type, params);
+    } else {
+      event = window.document.createEvent("Event");
+      if (params) event.initEvent(type, params.bubbles, params.cancelable), event.detail = params.detail;
+      else event.initEvent(type, false, false);
+    }
+
+    node.dispatchEvent(event);
+  }
+
+  function dispatchConstant(type, params) {
+    return function() {
+      return dispatchEvent(this, type, params);
+    };
+  }
+
+  function dispatchFunction(type, params) {
+    return function() {
+      return dispatchEvent(this, type, params.apply(this, arguments));
+    };
+  }
+
+  function selection_dispatch(type, params) {
+    return this.each((typeof params === "function"
+        ? dispatchFunction
+        : dispatchConstant)(type, params));
+  }
+
+  var root = [null];
+
+  function Selection(groups, parents) {
+    this._groups = groups;
+    this._parents = parents;
+  }
+
+  function selection() {
+    return new Selection([[document.documentElement]], root);
+  }
+
+  Selection.prototype = selection.prototype = {
+    constructor: Selection,
+    select: selection_select,
+    selectAll: selection_selectAll,
+    filter: selection_filter,
+    data: selection_data,
+    enter: selection_enter,
+    exit: selection_exit,
+    join: selection_join,
+    merge: selection_merge,
+    order: selection_order,
+    sort: selection_sort,
+    call: selection_call,
+    nodes: selection_nodes,
+    node: selection_node,
+    size: selection_size,
+    empty: selection_empty,
+    each: selection_each,
+    attr: selection_attr,
+    style: selection_style,
+    property: selection_property,
+    classed: selection_classed,
+    text: selection_text,
+    html: selection_html,
+    raise: selection_raise,
+    lower: selection_lower,
+    append: selection_append,
+    insert: selection_insert,
+    remove: selection_remove,
+    clone: selection_clone,
+    datum: selection_datum,
+    on: selection_on,
+    dispatch: selection_dispatch
+  };
+
+  function select(selector) {
+    return typeof selector === "string"
+        ? new Selection([[document.querySelector(selector)]], [document.documentElement])
+        : new Selection([[selector]], root);
+  }
+
+  /*
+  Uses the Mediawiki API to display a list of recent images and a link to
+  the page where the image has been used/placed.
+
+  Makes use of the following API calls:
+
+  * https://www.mediawiki.org/wiki/API:Allimages
+  * https://www.mediawiki.org/wiki/API:Imageinfo
+  * https://www.mediawiki.org/wiki/API:Imageusage
+  */
+  var PAGE_COUNT = 25; /* how many edits to show per load*/
+  var main = select("#content"),
+      baseurl = "/mw/api.php?action=query&list=recentchanges&rclimit=25&rcnamespace=0&rctoponly=1&format=json&formatversion=2&rcshow=!minor|!bot|!redirect|!anon",
+      url = baseurl;
+
+  async function get_json (url) {
+      var resp = await fetch(url);
+      return await resp.json();
+  }
+
+  function url_for_title (title) {
+      return "/w/"+encodeURI(title.replace(/ /g, "_"));
+  }
+
+  async function load () {
+      let count = 0;
+      while (count < PAGE_COUNT) {
+          // console.log("starting loop", "count", count, "url", url);
+          let data = await get_json(url),
+              recentchanges = data.query.recentchanges;
+          console.log("recentchanges", recentchanges);
+          let items = main.selectAll("div.edit")
+              .data(recentchanges, d=>d.title)
+              .enter()
+              .append("div")
+              .attr("class", "edit")
+              .append("a")
+              .attr("href", d=>url_for_title(d.title))
+              .attr("target", "wikiframe")
+              .text(d=>d.title);
+
+          if (data.continue) {
+              url = baseurl+"&rccontinue="+data.continue.rccontinue;
+          } else {
+              return;
+          }
+          count += recentchanges.length;
+      }
+  }
+  document.addEventListener("DOMContentLoaded", load);
+  document.querySelector("a#more").addEventListener("click", function (e) {
+      e.preventDefault();
+      load();
+  });
+
+}());

special/recentchanges/index.html

@@ -0,0 +1,55 @@
+<!DOCTYPE html>
+<html>
+<head>
+<title>erg: modifications récentes</title>
+<meta charset="utf-8">
+<link rel="stylesheet" type="text/css" href="/m/style.css">
+<style>
+    body {
+        margin: 1.5em;
+        margin-left: 40px;
+        margin-top: 2.5em;
+        background: #333;
+        color: white;
+        overflow: auto;
+	font-family: Vega;
+	font-size: 17px;
+    }
+    h1 {
+        margin: 0;
+        font-family: Combined;
+        font-size: 1.5em;
+    }
+    #content {
+        margin-top: 1em;
+    }
+    div#footer {
+        clear: both;
+        text-align: center;
+        margin-top: 1em;
+    }
+    a {
+        color: white;
+        text-decoration: none;
+    }
+    a:hover {
+        text-decoration: underline;
+    }
+    a#more {
+        color: black;
+        text-decoration: none;
+        background: white;
+        padding: 5px;
+    }
+    div.edit {
+        margin-bottom: 1em;
+    }
+</style>
+</head>
+<body>
+    <h1>Modifications récentes</h1>
+<div id="content"></div>
+<div id="footer"><a href="#" id="more">en plus&hellip;</a></div>
+<script src="dist/recentchanges.js"></script>
+</body>
+</html>

special/recentchanges/package.json

@@ -0,0 +1,16 @@
+{
+  "name": "recentfiles",
+  "version": "1.0.0",
+  "description": "",
+  "main": "rollup.config.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "dependencies": {
+    "d3-selection": "^1.4.0",
+    "rollup": "^1.17.0"
+  }
+}

special/recentchanges/rollup.config.js

@@ -0,0 +1,17 @@
+// rollup.config.js
+// https://github.com/rollup/rollup-plugin-commonjs
+import commonjs from 'rollup-plugin-commonjs';
+import resolve from 'rollup-plugin-node-resolve';
+
+export default [{
+  input: 'src/recentchanges.js',
+  output: {
+    file: 'dist/recentchanges.js',
+    format: 'iife',
+    name: 'app'
+  },
+  plugins: [
+    resolve(), 
+    commonjs()
+  ]
+}];

special/recentchanges/src/recentchanges.js

@@ -0,0 +1,55 @@
+import { selectAll, select } from 'd3-selection';
+/*
+Uses the Mediawiki API to display a list of recent images and a link to
+the page where the image has been used/placed.
+
+Makes use of the following API calls:
+
+* https://www.mediawiki.org/wiki/API:Allimages
+* https://www.mediawiki.org/wiki/API:Imageinfo
+* https://www.mediawiki.org/wiki/API:Imageusage
+*/
+var PAGE_COUNT = 25; /* how many edits to show per load*/
+var main = select("#content"),
+    baseurl = "/mw/api.php?action=query&list=recentchanges&rclimit=25&rcnamespace=0&rctoponly=1&format=json&formatversion=2&rcshow=!minor|!bot|!redirect|!anon",
+    url = baseurl;
+
+async function get_json (url) {
+    var resp = await fetch(url);
+    return await resp.json();
+}
+
+function url_for_title (title) {
+    return "/w/"+encodeURI(title.replace(/ /g, "_"));
+}
+
+async function load () {
+    let count = 0;
+    while (count < PAGE_COUNT) {
+        // console.log("starting loop", "count", count, "url", url);
+        let data = await get_json(url),
+            recentchanges = data.query.recentchanges;
+        console.log("recentchanges", recentchanges);
+        let items = main.selectAll("div.edit")
+            .data(recentchanges, d=>d.title)
+            .enter()
+            .append("div")
+            .attr("class", "edit")
+            .append("a")
+            .attr("href", d=>url_for_title(d.title))
+            .attr("target", "wikiframe")
+            .text(d=>d.title);
+
+        if (data.continue) {
+            url = baseurl+"&rccontinue="+data.continue.rccontinue;
+        } else {
+            return;
+        }
+        count += recentchanges.length;
+    }
+}
+document.addEventListener("DOMContentLoaded", load);
+document.querySelector("a#more").addEventListener("click", function (e) {
+    e.preventDefault();
+    load();
+});

special/recentfiles/Makefile

@@ -0,0 +1,6 @@
+
+all: dist/app.js
+
+dist/app.js: src/*.js
+	# node_modules/.bin/rollup src/index.js --file dist/index.js --format iife
+	node_modules/.bin/rollup -c

special/recentfiles/dist/recentfiles.js

@@ -0,0 +1,932 @@
+(function () {
+  'use strict';
+
+  var xhtml = "http://www.w3.org/1999/xhtml";
+
+  var namespaces = {
+    svg: "http://www.w3.org/2000/svg",
+    xhtml: xhtml,
+    xlink: "http://www.w3.org/1999/xlink",
+    xml: "http://www.w3.org/XML/1998/namespace",
+    xmlns: "http://www.w3.org/2000/xmlns/"
+  };
+
+  function namespace(name) {
+    var prefix = name += "", i = prefix.indexOf(":");
+    if (i >= 0 && (prefix = name.slice(0, i)) !== "xmlns") name = name.slice(i + 1);
+    return namespaces.hasOwnProperty(prefix) ? {space: namespaces[prefix], local: name} : name;
+  }
+
+  function creatorInherit(name) {
+    return function() {
+      var document = this.ownerDocument,
+          uri = this.namespaceURI;
+      return uri === xhtml && document.documentElement.namespaceURI === xhtml
+          ? document.createElement(name)
+          : document.createElementNS(uri, name);
+    };
+  }
+
+  function creatorFixed(fullname) {
+    return function() {
+      return this.ownerDocument.createElementNS(fullname.space, fullname.local);
+    };
+  }
+
+  function creator(name) {
+    var fullname = namespace(name);
+    return (fullname.local
+        ? creatorFixed
+        : creatorInherit)(fullname);
+  }
+
+  function none() {}
+
+  function selector(selector) {
+    return selector == null ? none : function() {
+      return this.querySelector(selector);
+    };
+  }
+
+  function selection_select(select) {
+    if (typeof select !== "function") select = selector(select);
+
+    for (var groups = this._groups, m = groups.length, subgroups = new Array(m), j = 0; j < m; ++j) {
+      for (var group = groups[j], n = group.length, subgroup = subgroups[j] = new Array(n), node, subnode, i = 0; i < n; ++i) {
+        if ((node = group[i]) && (subnode = select.call(node, node.__data__, i, group))) {
+          if ("__data__" in node) subnode.__data__ = node.__data__;
+          subgroup[i] = subnode;
+        }
+      }
+    }
+
+    return new Selection(subgroups, this._parents);
+  }
+
+  function empty() {
+    return [];
+  }
+
+  function selectorAll(selector) {
+    return selector == null ? empty : function() {
+      return this.querySelectorAll(selector);
+    };
+  }
+
+  function selection_selectAll(select) {
+    if (typeof select !== "function") select = selectorAll(select);
+
+    for (var groups = this._groups, m = groups.length, subgroups = [], parents = [], j = 0; j < m; ++j) {
+      for (var group = groups[j], n = group.length, node, i = 0; i < n; ++i) {
+        if (node = group[i]) {
+          subgroups.push(select.call(node, node.__data__, i, group));
+          parents.push(node);
+        }
+      }
+    }
+
+    return new Selection(subgroups, parents);
+  }
+
+  function matcher(selector) {
+    return function() {
+      return this.matches(selector);
+    };
+  }
+
+  function selection_filter(match) {
+    if (typeof match !== "function") match = matcher(match);
+
+    for (var groups = this._groups, m = groups.length, subgroups = new Array(m), j = 0; j < m; ++j) {
+      for (var group = groups[j], n = group.length, subgroup = subgroups[j] = [], node, i = 0; i < n; ++i) {
+        if ((node = group[i]) && match.call(node, node.__data__, i, group)) {
+          subgroup.push(node);
+        }
+      }
+    }
+
+    return new Selection(subgroups, this._parents);
+  }
+
+  function sparse(update) {
+    return new Array(update.length);
+  }
+
+  function selection_enter() {
+    return new Selection(this._enter || this._groups.map(sparse), this._parents);
+  }
+
+  function EnterNode(parent, datum) {
+    this.ownerDocument = parent.ownerDocument;
+    this.namespaceURI = parent.namespaceURI;
+    this._next = null;
+    this._parent = parent;
+    this.__data__ = datum;
+  }
+
+  EnterNode.prototype = {
+    constructor: EnterNode,
+    appendChild: function(child) { return this._parent.insertBefore(child, this._next); },
+    insertBefore: function(child, next) { return this._parent.insertBefore(child, next); },
+    querySelector: function(selector) { return this._parent.querySelector(selector); },
+    querySelectorAll: function(selector) { return this._parent.querySelectorAll(selector); }
+  };
+
+  function constant(x) {
+    return function() {
+      return x;
+    };
+  }
+
+  var keyPrefix = "$"; // Protect against keys like “__proto__”.
+
+  function bindIndex(parent, group, enter, update, exit, data) {
+    var i = 0,
+        node,
+        groupLength = group.length,
+        dataLength = data.length;
+
+    // Put any non-null nodes that fit into update.
+    // Put any null nodes into enter.
+    // Put any remaining data into enter.
+    for (; i < dataLength; ++i) {
+      if (node = group[i]) {
+        node.__data__ = data[i];
+        update[i] = node;
+      } else {
+        enter[i] = new EnterNode(parent, data[i]);
+      }
+    }
+
+    // Put any non-null nodes that don’t fit into exit.
+    for (; i < groupLength; ++i) {
+      if (node = group[i]) {
+        exit[i] = node;
+      }
+    }
+  }
+
+  function bindKey(parent, group, enter, update, exit, data, key) {
+    var i,
+        node,
+        nodeByKeyValue = {},
+        groupLength = group.length,
+        dataLength = data.length,
+        keyValues = new Array(groupLength),
+        keyValue;
+
+    // Compute the key for each node.
+    // If multiple nodes have the same key, the duplicates are added to exit.
+    for (i = 0; i < groupLength; ++i) {
+      if (node = group[i]) {
+        keyValues[i] = keyValue = keyPrefix + key.call(node, node.__data__, i, group);
+        if (keyValue in nodeByKeyValue) {
+          exit[i] = node;
+        } else {
+          nodeByKeyValue[keyValue] = node;
+        }
+      }
+    }
+
+    // Compute the key for each datum.
+    // If there a node associated with this key, join and add it to update.
+    // If there is not (or the key is a duplicate), add it to enter.
+    for (i = 0; i < dataLength; ++i) {
+      keyValue = keyPrefix + key.call(parent, data[i], i, data);
+      if (node = nodeByKeyValue[keyValue]) {
+        update[i] = node;
+        node.__data__ = data[i];
+        nodeByKeyValue[keyValue] = null;
+      } else {
+        enter[i] = new EnterNode(parent, data[i]);
+      }
+    }
+
+    // Add any remaining nodes that were not bound to data to exit.
+    for (i = 0; i < groupLength; ++i) {
+      if ((node = group[i]) && (nodeByKeyValue[keyValues[i]] === node)) {
+        exit[i] = node;
+      }
+    }
+  }
+
+  function selection_data(value, key) {
+    if (!value) {
+      data = new Array(this.size()), j = -1;
+      this.each(function(d) { data[++j] = d; });
+      return data;
+    }
+
+    var bind = key ? bindKey : bindIndex,
+        parents = this._parents,
+        groups = this._groups;
+
+    if (typeof value !== "function") value = constant(value);
+
+    for (var m = groups.length, update = new Array(m), enter = new Array(m), exit = new Array(m), j = 0; j < m; ++j) {
+      var parent = parents[j],
+          group = groups[j],
+          groupLength = group.length,
+          data = value.call(parent, parent && parent.__data__, j, parents),
+          dataLength = data.length,
+          enterGroup = enter[j] = new Array(dataLength),
+          updateGroup = update[j] = new Array(dataLength),
+          exitGroup = exit[j] = new Array(groupLength);
+
+      bind(parent, group, enterGroup, updateGroup, exitGroup, data, key);
+
+      // Now connect the enter nodes to their following update node, such that
+      // appendChild can insert the materialized enter node before this node,
+      // rather than at the end of the parent node.
+      for (var i0 = 0, i1 = 0, previous, next; i0 < dataLength; ++i0) {
+        if (previous = enterGroup[i0]) {
+          if (i0 >= i1) i1 = i0 + 1;
+          while (!(next = updateGroup[i1]) && ++i1 < dataLength);
+          previous._next = next || null;
+        }
+      }
+    }
+
+    update = new Selection(update, parents);
+    update._enter = enter;
+    update._exit = exit;
+    return update;
+  }
+
+  function selection_exit() {
+    return new Selection(this._exit || this._groups.map(sparse), this._parents);
+  }
+
+  function selection_join(onenter, onupdate, onexit) {
+    var enter = this.enter(), update = this, exit = this.exit();
+    enter = typeof onenter === "function" ? onenter(enter) : enter.append(onenter + "");
+    if (onupdate != null) update = onupdate(update);
+    if (onexit == null) exit.remove(); else onexit(exit);
+    return enter && update ? enter.merge(update).order() : update;
+  }
+
+  function selection_merge(selection) {
+
+    for (var groups0 = this._groups, groups1 = selection._groups, m0 = groups0.length, m1 = groups1.length, m = Math.min(m0, m1), merges = new Array(m0), j = 0; j < m; ++j) {
+      for (var group0 = groups0[j], group1 = groups1[j], n = group0.length, merge = merges[j] = new Array(n), node, i = 0; i < n; ++i) {
+        if (node = group0[i] || group1[i]) {
+          merge[i] = node;
+        }
+      }
+    }
+
+    for (; j < m0; ++j) {
+      merges[j] = groups0[j];
+    }
+
+    return new Selection(merges, this._parents);
+  }
+
+  function selection_order() {
+
+    for (var groups = this._groups, j = -1, m = groups.length; ++j < m;) {
+      for (var group = groups[j], i = group.length - 1, next = group[i], node; --i >= 0;) {
+        if (node = group[i]) {
+          if (next && node.compareDocumentPosition(next) ^ 4) next.parentNode.insertBefore(node, next);
+          next = node;
+        }
+      }
+    }
+
+    return this;
+  }
+
+  function selection_sort(compare) {
+    if (!compare) compare = ascending;
+
+    function compareNode(a, b) {
+      return a && b ? compare(a.__data__, b.__data__) : !a - !b;
+    }
+
+    for (var groups = this._groups, m = groups.length, sortgroups = new Array(m), j = 0; j < m; ++j) {
+      for (var group = groups[j], n = group.length, sortgroup = sortgroups[j] = new Array(n), node, i = 0; i < n; ++i) {
+        if (node = group[i]) {
+          sortgroup[i] = node;
+        }
+      }
+      sortgroup.sort(compareNode);
+    }
+
+    return new Selection(sortgroups, this._parents).order();
+  }
+
+  function ascending(a, b) {
+    return a < b ? -1 : a > b ? 1 : a >= b ? 0 : NaN;
+  }
+
+  function selection_call() {
+    var callback = arguments[0];
+    arguments[0] = this;
+    callback.apply(null, arguments);
+    return this;
+  }
+
+  function selection_nodes() {
+    var nodes = new Array(this.size()), i = -1;
+    this.each(function() { nodes[++i] = this; });
+    return nodes;
+  }
+
+  function selection_node() {
+
+    for (var groups = this._groups, j = 0, m = groups.length; j < m; ++j) {
+      for (var group = groups[j], i = 0, n = group.length; i < n; ++i) {
+        var node = group[i];
+        if (node) return node;
+      }
+    }
+
+    return null;
+  }
+
+  function selection_size() {
+    var size = 0;
+    this.each(function() { ++size; });
+    return size;
+  }
+
+  function selection_empty() {
+    return !this.node();
+  }
+
+  function selection_each(callback) {
+
+    for (var groups = this._groups, j = 0, m = groups.length; j < m; ++j) {
+      for (var group = groups[j], i = 0, n = group.length, node; i < n; ++i) {
+        if (node = group[i]) callback.call(node, node.__data__, i, group);
+      }
+    }
+
+    return this;
+  }
+
+  function attrRemove(name) {
+    return function() {
+      this.removeAttribute(name);
+    };
+  }
+
+  function attrRemoveNS(fullname) {
+    return function() {
+      this.removeAttributeNS(fullname.space, fullname.local);
+    };
+  }
+
+  function attrConstant(name, value) {
+    return function() {
+      this.setAttribute(name, value);
+    };
+  }
+
+  function attrConstantNS(fullname, value) {
+    return function() {
+      this.setAttributeNS(fullname.space, fullname.local, value);
+    };
+  }
+
+  function attrFunction(name, value) {
+    return function() {
+      var v = value.apply(this, arguments);
+      if (v == null) this.removeAttribute(name);
+      else this.setAttribute(name, v);
+    };
+  }
+
+  function attrFunctionNS(fullname, value) {
+    return function() {
+      var v = value.apply(this, arguments);
+      if (v == null) this.removeAttributeNS(fullname.space, fullname.local);
+      else this.setAttributeNS(fullname.space, fullname.local, v);
+    };
+  }
+
+  function selection_attr(name, value) {
+    var fullname = namespace(name);
+
+    if (arguments.length < 2) {
+      var node = this.node();
+      return fullname.local
+          ? node.getAttributeNS(fullname.space, fullname.local)
+          : node.getAttribute(fullname);
+    }
+
+    return this.each((value == null
+        ? (fullname.local ? attrRemoveNS : attrRemove) : (typeof value === "function"
+        ? (fullname.local ? attrFunctionNS : attrFunction)
+        : (fullname.local ? attrConstantNS : attrConstant)))(fullname, value));
+  }
+
+  function defaultView(node) {
+    return (node.ownerDocument && node.ownerDocument.defaultView) // node is a Node
+        || (node.document && node) // node is a Window
+        || node.defaultView; // node is a Document
+  }
+
+  function styleRemove(name) {
+    return function() {
+      this.style.removeProperty(name);
+    };
+  }
+
+  function styleConstant(name, value, priority) {
+    return function() {
+      this.style.setProperty(name, value, priority);
+    };
+  }
+
+  function styleFunction(name, value, priority) {
+    return function() {
+      var v = value.apply(this, arguments);
+      if (v == null) this.style.removeProperty(name);
+      else this.style.setProperty(name, v, priority);
+    };
+  }
+
+  function selection_style(name, value, priority) {
+    return arguments.length > 1
+        ? this.each((value == null
+              ? styleRemove : typeof value === "function"
+              ? styleFunction
+              : styleConstant)(name, value, priority == null ? "" : priority))
+        : styleValue(this.node(), name);
+  }
+
+  function styleValue(node, name) {
+    return node.style.getPropertyValue(name)
+        || defaultView(node).getComputedStyle(node, null).getPropertyValue(name);
+  }
+
+  function propertyRemove(name) {
+    return function() {
+      delete this[name];
+    };
+  }
+
+  function propertyConstant(name, value) {
+    return function() {
+      this[name] = value;
+    };
+  }
+
+  function propertyFunction(name, value) {
+    return function() {
+      var v = value.apply(this, arguments);
+      if (v == null) delete this[name];
+      else this[name] = v;
+    };
+  }
+
+  function selection_property(name, value) {
+    return arguments.length > 1
+        ? this.each((value == null
+            ? propertyRemove : typeof value === "function"
+            ? propertyFunction
+            : propertyConstant)(name, value))
+        : this.node()[name];
+  }
+
+  function classArray(string) {
+    return string.trim().split(/^|\s+/);
+  }
+
+  function classList(node) {
+    return node.classList || new ClassList(node);
+  }
+
+  function ClassList(node) {
+    this._node = node;
+    this._names = classArray(node.getAttribute("class") || "");
+  }
+
+  ClassList.prototype = {
+    add: function(name) {
+      var i = this._names.indexOf(name);
+      if (i < 0) {
+        this._names.push(name);
+        this._node.setAttribute("class", this._names.join(" "));
+      }
+    },
+    remove: function(name) {
+      var i = this._names.indexOf(name);
+      if (i >= 0) {
+        this._names.splice(i, 1);
+        this._node.setAttribute("class", this._names.join(" "));
+      }
+    },
+    contains: function(name) {
+      return this._names.indexOf(name) >= 0;
+    }
+  };
+
+  function classedAdd(node, names) {
+    var list = classList(node), i = -1, n = names.length;
+    while (++i < n) list.add(names[i]);
+  }
+
+  function classedRemove(node, names) {
+    var list = classList(node), i = -1, n = names.length;
+    while (++i < n) list.remove(names[i]);
+  }
+
+  function classedTrue(names) {
+    return function() {
+      classedAdd(this, names);
+    };
+  }
+
+  function classedFalse(names) {
+    return function() {
+      classedRemove(this, names);
+    };
+  }
+
+  function classedFunction(names, value) {
+    return function() {
+      (value.apply(this, arguments) ? classedAdd : classedRemove)(this, names);
+    };
+  }
+
+  function selection_classed(name, value) {
+    var names = classArray(name + "");
+
+    if (arguments.length < 2) {
+      var list = classList(this.node()), i = -1, n = names.length;
+      while (++i < n) if (!list.contains(names[i])) return false;
+      return true;
+    }
+
+    return this.each((typeof value === "function"
+        ? classedFunction : value
+        ? classedTrue
+        : classedFalse)(names, value));
+  }
+
+  function textRemove() {
+    this.textContent = "";
+  }
+
+  function textConstant(value) {
+    return function() {
+      this.textContent = value;
+    };
+  }
+
+  function textFunction(value) {
+    return function() {
+      var v = value.apply(this, arguments);
+      this.textContent = v == null ? "" : v;
+    };
+  }
+
+  function selection_text(value) {
+    return arguments.length
+        ? this.each(value == null
+            ? textRemove : (typeof value === "function"
+            ? textFunction
+            : textConstant)(value))
+        : this.node().textContent;
+  }
+
+  function htmlRemove() {
+    this.innerHTML = "";
+  }
+
+  function htmlConstant(value) {
+    return function() {
+      this.innerHTML = value;
+    };
+  }
+
+  function htmlFunction(value) {
+    return function() {
+      var v = value.apply(this, arguments);
+      this.innerHTML = v == null ? "" : v;
+    };
+  }
+
+  function selection_html(value) {
+    return arguments.length
+        ? this.each(value == null
+            ? htmlRemove : (typeof value === "function"
+            ? htmlFunction
+            : htmlConstant)(value))
+        : this.node().innerHTML;
+  }
+
+  function raise() {
+    if (this.nextSibling) this.parentNode.appendChild(this);
+  }
+
+  function selection_raise() {
+    return this.each(raise);
+  }
+
+  function lower() {
+    if (this.previousSibling) this.parentNode.insertBefore(this, this.parentNode.firstChild);
+  }
+
+  function selection_lower() {
+    return this.each(lower);
+  }
+
+  function selection_append(name) {
+    var create = typeof name === "function" ? name : creator(name);
+    return this.select(function() {
+      return this.appendChild(create.apply(this, arguments));
+    });
+  }
+
+  function constantNull() {
+    return null;
+  }
+
+  function selection_insert(name, before) {
+    var create = typeof name === "function" ? name : creator(name),
+        select = before == null ? constantNull : typeof before === "function" ? before : selector(before);
+    return this.select(function() {
+      return this.insertBefore(create.apply(this, arguments), select.apply(this, arguments) || null);
+    });
+  }
+
+  function remove() {
+    var parent = this.parentNode;
+    if (parent) parent.removeChild(this);
+  }
+
+  function selection_remove() {
+    return this.each(remove);
+  }
+
+  function selection_cloneShallow() {
+    return this.parentNode.insertBefore(this.cloneNode(false), this.nextSibling);
+  }
+
+  function selection_cloneDeep() {
+    return this.parentNode.insertBefore(this.cloneNode(true), this.nextSibling);
+  }
+
+  function selection_clone(deep) {
+    return this.select(deep ? selection_cloneDeep : selection_cloneShallow);
+  }
+
+  function selection_datum(value) {
+    return arguments.length
+        ? this.property("__data__", value)
+        : this.node().__data__;
+  }
+
+  var filterEvents = {};
+
+  if (typeof document !== "undefined") {
+    var element = document.documentElement;
+    if (!("onmouseenter" in element)) {
+      filterEvents = {mouseenter: "mouseover", mouseleave: "mouseout"};
+    }
+  }
+
+  function filterContextListener(listener, index, group) {
+    listener = contextListener(listener, index, group);
+    return function(event) {
+      var related = event.relatedTarget;
+      if (!related || (related !== this && !(related.compareDocumentPosition(this) & 8))) {
+        listener.call(this, event);
+      }
+    };
+  }
+
+  function contextListener(listener, index, group) {
+    return function(event1) {
+      try {
+        listener.call(this, this.__data__, index, group);
+      } finally {
+      }
+    };
+  }
+
+  function parseTypenames(typenames) {
+    return typenames.trim().split(/^|\s+/).map(function(t) {
+      var name = "", i = t.indexOf(".");
+      if (i >= 0) name = t.slice(i + 1), t = t.slice(0, i);
+      return {type: t, name: name};
+    });
+  }
+
+  function onRemove(typename) {
+    return function() {
+      var on = this.__on;
+      if (!on) return;
+      for (var j = 0, i = -1, m = on.length, o; j < m; ++j) {
+        if (o = on[j], (!typename.type || o.type === typename.type) && o.name === typename.name) {
+          this.removeEventListener(o.type, o.listener, o.capture);
+        } else {
+          on[++i] = o;
+        }
+      }
+      if (++i) on.length = i;
+      else delete this.__on;
+    };
+  }
+
+  function onAdd(typename, value, capture) {
+    var wrap = filterEvents.hasOwnProperty(typename.type) ? filterContextListener : contextListener;
+    return function(d, i, group) {
+      var on = this.__on, o, listener = wrap(value, i, group);
+      if (on) for (var j = 0, m = on.length; j < m; ++j) {
+        if ((o = on[j]).type === typename.type && o.name === typename.name) {
+          this.removeEventListener(o.type, o.listener, o.capture);
+          this.addEventListener(o.type, o.listener = listener, o.capture = capture);
+          o.value = value;
+          return;
+        }
+      }
+      this.addEventListener(typename.type, listener, capture);
+      o = {type: typename.type, name: typename.name, value: value, listener: listener, capture: capture};
+      if (!on) this.__on = [o];
+      else on.push(o);
+    };
+  }
+
+  function selection_on(typename, value, capture) {
+    var typenames = parseTypenames(typename + ""), i, n = typenames.length, t;
+
+    if (arguments.length < 2) {
+      var on = this.node().__on;
+      if (on) for (var j = 0, m = on.length, o; j < m; ++j) {
+        for (i = 0, o = on[j]; i < n; ++i) {
+          if ((t = typenames[i]).type === o.type && t.name === o.name) {
+            return o.value;
+          }
+        }
+      }
+      return;
+    }
+
+    on = value ? onAdd : onRemove;
+    if (capture == null) capture = false;
+    for (i = 0; i < n; ++i) this.each(on(typenames[i], value, capture));
+    return this;
+  }
+
+  function dispatchEvent(node, type, params) {
+    var window = defaultView(node),
+        event = window.CustomEvent;
+
+    if (typeof event === "function") {
+      event = new event(type, params);
+    } else {
+      event = window.document.createEvent("Event");
+      if (params) event.initEvent(type, params.bubbles, params.cancelable), event.detail = params.detail;
+      else event.initEvent(type, false, false);
+    }
+
+    node.dispatchEvent(event);
+  }
+
+  function dispatchConstant(type, params) {
+    return function() {
+      return dispatchEvent(this, type, params);
+    };
+  }
+
+  function dispatchFunction(type, params) {
+    return function() {
+      return dispatchEvent(this, type, params.apply(this, arguments));
+    };
+  }
+
+  function selection_dispatch(type, params) {
+    return this.each((typeof params === "function"
+        ? dispatchFunction
+        : dispatchConstant)(type, params));
+  }
+
+  var root = [null];
+
+  function Selection(groups, parents) {
+    this._groups = groups;
+    this._parents = parents;
+  }
+
+  function selection() {
+    return new Selection([[document.documentElement]], root);
+  }
+
+  Selection.prototype = selection.prototype = {
+    constructor: Selection,
+    select: selection_select,
+    selectAll: selection_selectAll,
+    filter: selection_filter,
+    data: selection_data,
+    enter: selection_enter,
+    exit: selection_exit,
+    join: selection_join,
+    merge: selection_merge,
+    order: selection_order,
+    sort: selection_sort,
+    call: selection_call,
+    nodes: selection_nodes,
+    node: selection_node,
+    size: selection_size,
+    empty: selection_empty,
+    each: selection_each,
+    attr: selection_attr,
+    style: selection_style,
+    property: selection_property,
+    classed: selection_classed,
+    text: selection_text,
+    html: selection_html,
+    raise: selection_raise,
+    lower: selection_lower,
+    append: selection_append,
+    insert: selection_insert,
+    remove: selection_remove,
+    clone: selection_clone,
+    datum: selection_datum,
+    on: selection_on,
+    dispatch: selection_dispatch
+  };
+
+  function select(selector) {
+    return typeof selector === "string"
+        ? new Selection([[document.querySelector(selector)]], [document.documentElement])
+        : new Selection([[selector]], root);
+  }
+
+  /*
+  Uses the Mediawiki API to display a list of recent images and a link to
+  the page where the image has been used/placed.
+
+  Makes use of the following API calls:
+
+  * https://www.mediawiki.org/wiki/API:Allimages
+  * https://www.mediawiki.org/wiki/API:Imageinfo
+  * https://www.mediawiki.org/wiki/API:Imageusage
+  */
+  var NUM_FILES = 30; /* how many files to show */
+      //baseurl = "/mw/api.php?action=query&list=allimages&ailimit=1&format=json&formatversion=2&aisort=timestamp&aidir=older&aiprop=timestamp|user|url|mime|size",
+  var main = select("#content"),
+      baseurl = "/mw/api.php?action=query&list=allimages&aimime=image/png|image/gif|image/jpg&ailimit=1&format=json&formatversion=2&aisort=timestamp&aidir=older&aiprop=timestamp|user|url|mime|size",
+      url = baseurl;
+
+  async function get_json (url) {
+      var resp = await fetch(url);
+      return await resp.json();
+  }
+
+  function url_for_title (title) {
+      return "/w/"+encodeURI(title.replace(/ /g, "_"));
+  }
+
+  async function load () {
+      let count = 0;
+      while (count < NUM_FILES) {
+          // console.log("starting loop", "count", count, "url", url);
+          let data = await get_json(url),
+              allimages = data.query.allimages,
+              useimages = [];
+
+          // console.log("got data", data.query.allimages.length);
+          for (var i=0, l=allimages.length; i<l; i++) {
+              let image = allimages[i];
+              // console.log("image", image.name);
+              let iu_data = await get_json(`/mw/api.php?action=query&list=imageusage&iutitle=${image.title}&iunamespace=0&format=json&formatversion=2`);
+              image.imageusage = iu_data.query.imageusage;
+              if (image.imageusage.length == 0) { 
+                  continue;
+              }
+              let ii_data = await get_json(`/mw/api.php?action=query&prop=imageinfo&titles=${image.title}&iiprop=url|size&dimensions|mime&iiurlwidth=320&format=json&formatversion=2`);
+              image.imageinfo = ii_data.query.pages[0].imageinfo[0];
+              if (!image.imageinfo.thumburl) {
+                  continue;
+              }
+              useimages.push(image);
+          }
+          let items = main.selectAll("div.file")
+              .data(useimages, d=>d.title)
+              .enter()
+              .append("div")
+              .attr("class", "file")
+              .append("a")
+              .attr("href", d=>url_for_title(d.imageusage[d.imageusage.length-1].title))
+              .attr("target", "wikiframe")
+              .append("img")
+              .attr('src', d=>d.imageinfo.thumburl);
+
+          if (data.continue) {
+              url = baseurl+"&aicontinue="+data.continue.aicontinue;
+          }
+          count += useimages.length;
+      }
+  }
+  document.addEventListener("DOMContentLoaded", load);
+  document.querySelector("a#more").addEventListener("click", function (e) {
+      e.preventDefault();
+      load();
+  });
+
+}());

special/recentfiles/index.html

@@ -0,0 +1,58 @@
+<!DOCTYPE html>
+<html>
+<head>
+<title>recent files</title>
+<meta charset="utf-8">
+<style>
+	:root {
+		--font-title: Combined;
+		--font-body: Vega;
+		--color-a: #a700ff;
+		--color-b: #00ab6b;
+	}
+    body {
+        background: #eee;
+        background-image: linear-gradient(45deg, rgba(0,0,100,.25) 25%, transparent 0, transparent 75%, rgba(0,0,100,.25) 0), linear-gradient(45deg, rgba(0,0,100,.25) 25%, transparent 0, transparent 75%, rgba(0,0,100,.25) 0);
+        background-position: 0 0, 10px 10px;
+        background-size: 20px 20px;
+    }
+    div.file {
+        float: left;
+        margin: 8px;
+	max-width: 30%;
+    }
+    div.file img {
+	max-width: 100%;
+	display: block;
+    }
+    div.file a {
+    	border-style: solid;
+	border-width: 2px;
+	border-color: transparent;
+	display: block;
+    }
+    div.file a:hover {
+	border-image: linear-gradient(to right, var(--color-a), var(--color-b));
+        border-image-slice: 1;
+    	border-width: 10px;
+	border-color: initial;
+box-sizing: border-box;
+    }
+    div#footer {
+        clear: both;
+        text-align: center;
+    }
+    a#more {
+        color: white;
+        text-decoration: none;
+        background: black;
+        padding: 5px;
+    }
+</style>
+</head>
+<body>
+<div id="content"></div>
+<div id="footer"><a href="#" id="more">en plus&hellip;</a></div>
+<script src="dist/recentfiles.js"></script>
+</body>
+</html>

special/recentfiles/package.json

@@ -0,0 +1,16 @@
+{
+  "name": "recentfiles",
+  "version": "1.0.0",
+  "description": "",
+  "main": "rollup.config.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "dependencies": {
+    "d3-selection": "^1.4.0",
+    "rollup": "^1.17.0"
+  }
+}

special/recentfiles/rollup.config.js

@@ -0,0 +1,17 @@
+// rollup.config.js
+// https://github.com/rollup/rollup-plugin-commonjs
+import commonjs from 'rollup-plugin-commonjs';
+import resolve from 'rollup-plugin-node-resolve';
+
+export default [{
+  input: 'src/recentfiles.js',
+  output: {
+    file: 'dist/recentfiles.js',
+    format: 'iife',
+    name: 'app'
+  },
+  plugins: [
+    resolve(), 
+    commonjs()
+  ]
+}];

special/recentfiles/src/recentfiles.js

@@ -0,0 +1,71 @@
+import { selectAll, select } from 'd3-selection';
+/*
+Uses the Mediawiki API to display a list of recent images and a link to
+the page where the image has been used/placed.
+
+Makes use of the following API calls:
+
+* https://www.mediawiki.org/wiki/API:Allimages
+* https://www.mediawiki.org/wiki/API:Imageinfo
+* https://www.mediawiki.org/wiki/API:Imageusage
+*/
+var NUM_FILES = 10; /* how many files to show */
+var main = select("#content"),
+    baseurl = "/mw/api.php?action=query&list=allimages&ailimit=1&format=json&formatversion=2&aisort=timestamp&aidir=older&aiprop=timestamp|user|url|mime|size",
+    url = baseurl;
+
+async function get_json (url) {
+    var resp = await fetch(url);
+    return await resp.json();
+}
+
+function url_for_title (title) {
+    return "/w/"+encodeURI(title.replace(/ /g, "_"));
+}
+
+async function load () {
+    let count = 0;
+    while (count < NUM_FILES) {
+        // console.log("starting loop", "count", count, "url", url);
+        let data = await get_json(url),
+            allimages = data.query.allimages,
+            useimages = [];
+
+        // console.log("got data", data.query.allimages.length);
+        for (var i=0, l=allimages.length; i<l; i++) {
+            let image = allimages[i];
+            // console.log("image", image.name);
+            let iu_data = await get_json(`/mw/api.php?action=query&list=imageusage&iutitle=${image.title}&iunamespace=0&format=json&formatversion=2`);
+            image.imageusage = iu_data.query.imageusage;
+            if (image.imageusage.length == 0) { 
+                continue;
+            }
+            let ii_data = await get_json(`/mw/api.php?action=query&prop=imageinfo&titles=${image.title}&iiprop=url|size&dimensions|mime&iiurlwidth=320&format=json&formatversion=2`);
+            image.imageinfo = ii_data.query.pages[0].imageinfo[0];
+            if (!image.imageinfo.thumburl) {
+                continue;
+            }
+            useimages.push(image);
+        }
+        let items = main.selectAll("div.file")
+            .data(useimages, d=>d.title)
+            .enter()
+            .append("div")
+            .attr("class", "file")
+            .append("a")
+            .attr("href", d=>url_for_title(d.imageusage[d.imageusage.length-1].title))
+            .attr("target", "wikiframe")
+            .append("img")
+            .attr('src', d=>d.imageinfo.thumburl);
+
+        if (data.continue) {
+            url = baseurl+"&aicontinue="+data.continue.aicontinue;
+        }
+        count += useimages.length;
+    }
+}
+document.addEventListener("DOMContentLoaded", load);
+document.querySelector("a#more").addEventListener("click", function (e) {
+    e.preventDefault();
+    load();
+});

special/recentnews/Makefile

@@ -0,0 +1,6 @@
+
+all: dist/app.js
+
+dist/app.js: src/*.js
+	# node_modules/.bin/rollup src/index.js --file dist/index.js --format iife
+	node_modules/.bin/rollup -c

special/recentnews/dist/recentchanges.js

@@ -0,0 +1,917 @@
+(function () {
+  'use strict';
+
+  var xhtml = "http://www.w3.org/1999/xhtml";
+
+  var namespaces = {
+    svg: "http://www.w3.org/2000/svg",
+    xhtml: xhtml,
+    xlink: "http://www.w3.org/1999/xlink",
+    xml: "http://www.w3.org/XML/1998/namespace",
+    xmlns: "http://www.w3.org/2000/xmlns/"
+  };
+
+  function namespace(name) {
+    var prefix = name += "", i = prefix.indexOf(":");
+    if (i >= 0 && (prefix = name.slice(0, i)) !== "xmlns") name = name.slice(i + 1);
+    return namespaces.hasOwnProperty(prefix) ? {space: namespaces[prefix], local: name} : name;
+  }
+
+  function creatorInherit(name) {
+    return function() {
+      var document = this.ownerDocument,
+          uri = this.namespaceURI;
+      return uri === xhtml && document.documentElement.namespaceURI === xhtml
+          ? document.createElement(name)
+          : document.createElementNS(uri, name);
+    };
+  }
+
+  function creatorFixed(fullname) {
+    return function() {
+      return this.ownerDocument.createElementNS(fullname.space, fullname.local);
+    };
+  }
+
+  function creator(name) {
+    var fullname = namespace(name);
+    return (fullname.local
+        ? creatorFixed
+        : creatorInherit)(fullname);
+  }
+
+  function none() {}
+
+  function selector(selector) {
+    return selector == null ? none : function() {
+      return this.querySelector(selector);
+    };
+  }
+
+  function selection_select(select) {
+    if (typeof select !== "function") select = selector(select);
+
+    for (var groups = this._groups, m = groups.length, subgroups = new Array(m), j = 0; j < m; ++j) {
+      for (var group = groups[j], n = group.length, subgroup = subgroups[j] = new Array(n), node, subnode, i = 0; i < n; ++i) {
+        if ((node = group[i]) && (subnode = select.call(node, node.__data__, i, group))) {
+          if ("__data__" in node) subnode.__data__ = node.__data__;
+          subgroup[i] = subnode;
+        }
+      }
+    }
+
+    return new Selection(subgroups, this._parents);
+  }
+
+  function empty() {
+    return [];
+  }
+
+  function selectorAll(selector) {
+    return selector == null ? empty : function() {
+      return this.querySelectorAll(selector);
+    };
+  }
+
+  function selection_selectAll(select) {
+    if (typeof select !== "function") select = selectorAll(select);
+
+    for (var groups = this._groups, m = groups.length, subgroups = [], parents = [], j = 0; j < m; ++j) {
+      for (var group = groups[j], n = group.length, node, i = 0; i < n; ++i) {
+        if (node = group[i]) {
+          subgroups.push(select.call(node, node.__data__, i, group));
+          parents.push(node);
+        }
+      }
+    }
+
+    return new Selection(subgroups, parents);
+  }
+
+  function matcher(selector) {
+    return function() {
+      return this.matches(selector);
+    };
+  }
+
+  function selection_filter(match) {
+    if (typeof match !== "function") match = matcher(match);
+
+    for (var groups = this._groups, m = groups.length, subgroups = new Array(m), j = 0; j < m; ++j) {
+      for (var group = groups[j], n = group.length, subgroup = subgroups[j] = [], node, i = 0; i < n; ++i) {
+        if ((node = group[i]) && match.call(node, node.__data__, i, group)) {
+          subgroup.push(node);
+        }
+      }
+    }
+
+    return new Selection(subgroups, this._parents);
+  }
+
+  function sparse(update) {
+    return new Array(update.length);
+  }
+
+  function selection_enter() {
+    return new Selection(this._enter || this._groups.map(sparse), this._parents);
+  }
+
+  function EnterNode(parent, datum) {
+    this.ownerDocument = parent.ownerDocument;
+    this.namespaceURI = parent.namespaceURI;
+    this._next = null;
+    this._parent = parent;
+    this.__data__ = datum;
+  }
+
+  EnterNode.prototype = {
+    constructor: EnterNode,
+    appendChild: function(child) { return this._parent.insertBefore(child, this._next); },
+    insertBefore: function(child, next) { return this._parent.insertBefore(child, next); },
+    querySelector: function(selector) { return this._parent.querySelector(selector); },
+    querySelectorAll: function(selector) { return this._parent.querySelectorAll(selector); }
+  };
+
+  function constant(x) {
+    return function() {
+      return x;
+    };
+  }
+
+  var keyPrefix = "$"; // Protect against keys like “__proto__”.
+
+  function bindIndex(parent, group, enter, update, exit, data) {
+    var i = 0,
+        node,
+        groupLength = group.length,
+        dataLength = data.length;
+
+    // Put any non-null nodes that fit into update.
+    // Put any null nodes into enter.
+    // Put any remaining data into enter.
+    for (; i < dataLength; ++i) {
+      if (node = group[i]) {
+        node.__data__ = data[i];
+        update[i] = node;
+      } else {
+        enter[i] = new EnterNode(parent, data[i]);
+      }
+    }
+
+    // Put any non-null nodes that don’t fit into exit.
+    for (; i < groupLength; ++i) {
+      if (node = group[i]) {
+        exit[i] = node;
+      }
+    }
+  }
+
+  function bindKey(parent, group, enter, update, exit, data, key) {
+    var i,
+        node,
+        nodeByKeyValue = {},
+        groupLength = group.length,
+        dataLength = data.length,
+        keyValues = new Array(groupLength),
+        keyValue;
+
+    // Compute the key for each node.
+    // If multiple nodes have the same key, the duplicates are added to exit.
+    for (i = 0; i < groupLength; ++i) {
+      if (node = group[i]) {
+        keyValues[i] = keyValue = keyPrefix + key.call(node, node.__data__, i, group);
+        if (keyValue in nodeByKeyValue) {
+          exit[i] = node;
+        } else {
+          nodeByKeyValue[keyValue] = node;
+        }
+      }
+    }
+
+    // Compute the key for each datum.
+    // If there a node associated with this key, join and add it to update.
+    // If there is not (or the key is a duplicate), add it to enter.
+    for (i = 0; i < dataLength; ++i) {
+      keyValue = keyPrefix + key.call(parent, data[i], i, data);
+      if (node = nodeByKeyValue[keyValue]) {
+        update[i] = node;
+        node.__data__ = data[i];
+        nodeByKeyValue[keyValue] = null;
+      } else {
+        enter[i] = new EnterNode(parent, data[i]);
+      }
+    }
+
+    // Add any remaining nodes that were not bound to data to exit.
+    for (i = 0; i < groupLength; ++i) {
+      if ((node = group[i]) && (nodeByKeyValue[keyValues[i]] === node)) {
+        exit[i] = node;
+      }
+    }
+  }
+
+  function selection_data(value, key) {
+    if (!value) {
+      data = new Array(this.size()), j = -1;
+      this.each(function(d) { data[++j] = d; });
+      return data;
+    }
+
+    var bind = key ? bindKey : bindIndex,
+        parents = this._parents,
+        groups = this._groups;
+
+    if (typeof value !== "function") value = constant(value);
+
+    for (var m = groups.length, update = new Array(m), enter = new Array(m), exit = new Array(m), j = 0; j < m; ++j) {
+      var parent = parents[j],
+          group = groups[j],
+          groupLength = group.length,
+          data = value.call(parent, parent && parent.__data__, j, parents),
+          dataLength = data.length,
+          enterGroup = enter[j] = new Array(dataLength),
+          updateGroup = update[j] = new Array(dataLength),
+          exitGroup = exit[j] = new Array(groupLength);
+
+      bind(parent, group, enterGroup, updateGroup, exitGroup, data, key);
+
+      // Now connect the enter nodes to their following update node, such that
+      // appendChild can insert the materialized enter node before this node,
+      // rather than at the end of the parent node.
+      for (var i0 = 0, i1 = 0, previous, next; i0 < dataLength; ++i0) {
+        if (previous = enterGroup[i0]) {
+          if (i0 >= i1) i1 = i0 + 1;
+          while (!(next = updateGroup[i1]) && ++i1 < dataLength);
+          previous._next = next || null;
+        }
+      }
+    }
+
+    update = new Selection(update, parents);
+    update._enter = enter;
+    update._exit = exit;
+    return update;
+  }
+
+  function selection_exit() {
+    return new Selection(this._exit || this._groups.map(sparse), this._parents);
+  }
+
+  function selection_join(onenter, onupdate, onexit) {
+    var enter = this.enter(), update = this, exit = this.exit();
+    enter = typeof onenter === "function" ? onenter(enter) : enter.append(onenter + "");
+    if (onupdate != null) update = onupdate(update);
+    if (onexit == null) exit.remove(); else onexit(exit);
+    return enter && update ? enter.merge(update).order() : update;
+  }
+
+  function selection_merge(selection) {
+
+    for (var groups0 = this._groups, groups1 = selection._groups, m0 = groups0.length, m1 = groups1.length, m = Math.min(m0, m1), merges = new Array(m0), j = 0; j < m; ++j) {
+      for (var group0 = groups0[j], group1 = groups1[j], n = group0.length, merge = merges[j] = new Array(n), node, i = 0; i < n; ++i) {
+        if (node = group0[i] || group1[i]) {
+          merge[i] = node;
+        }
+      }
+    }
+
+    for (; j < m0; ++j) {
+      merges[j] = groups0[j];
+    }
+
+    return new Selection(merges, this._parents);
+  }
+
+  function selection_order() {
+
+    for (var groups = this._groups, j = -1, m = groups.length; ++j < m;) {
+      for (var group = groups[j], i = group.length - 1, next = group[i], node; --i >= 0;) {
+        if (node = group[i]) {
+          if (next && node.compareDocumentPosition(next) ^ 4) next.parentNode.insertBefore(node, next);
+          next = node;
+        }
+      }
+    }
+
+    return this;
+  }
+
+  function selection_sort(compare) {
+    if (!compare) compare = ascending;
+
+    function compareNode(a, b) {
+      return a && b ? compare(a.__data__, b.__data__) : !a - !b;
+    }
+
+    for (var groups = this._groups, m = groups.length, sortgroups = new Array(m), j = 0; j < m; ++j) {
+      for (var group = groups[j], n = group.length, sortgroup = sortgroups[j] = new Array(n), node, i = 0; i < n; ++i) {
+        if (node = group[i]) {
+          sortgroup[i] = node;
+        }
+      }
+      sortgroup.sort(compareNode);
+    }
+
+    return new Selection(sortgroups, this._parents).order();
+  }
+
+  function ascending(a, b) {
+    return a < b ? -1 : a > b ? 1 : a >= b ? 0 : NaN;
+  }
+
+  function selection_call() {
+    var callback = arguments[0];
+    arguments[0] = this;
+    callback.apply(null, arguments);
+    return this;
+  }
+
+  function selection_nodes() {
+    var nodes = new Array(this.size()), i = -1;
+    this.each(function() { nodes[++i] = this; });
+    return nodes;
+  }
+
+  function selection_node() {
+
+    for (var groups = this._groups, j = 0, m = groups.length; j < m; ++j) {
+      for (var group = groups[j], i = 0, n = group.length; i < n; ++i) {
+        var node = group[i];
+        if (node) return node;
+      }
+    }
+
+    return null;
+  }
+
+  function selection_size() {
+    var size = 0;
+    this.each(function() { ++size; });
+    return size;
+  }
+
+  function selection_empty() {
+    return !this.node();
+  }
+
+  function selection_each(callback) {
+
+    for (var groups = this._groups, j = 0, m = groups.length; j < m; ++j) {
+      for (var group = groups[j], i = 0, n = group.length, node; i < n; ++i) {
+        if (node = group[i]) callback.call(node, node.__data__, i, group);
+      }
+    }
+
+    return this;
+  }
+
+  function attrRemove(name) {
+    return function() {
+      this.removeAttribute(name);
+    };
+  }
+
+  function attrRemoveNS(fullname) {
+    return function() {
+      this.removeAttributeNS(fullname.space, fullname.local);
+    };
+  }
+
+  function attrConstant(name, value) {
+    return function() {
+      this.setAttribute(name, value);
+    };
+  }
+
+  function attrConstantNS(fullname, value) {
+    return function() {
+      this.setAttributeNS(fullname.space, fullname.local, value);
+    };
+  }
+
+  function attrFunction(name, value) {
+    return function() {
+      var v = value.apply(this, arguments);
+      if (v == null) this.removeAttribute(name);
+      else this.setAttribute(name, v);
+    };
+  }
+
+  function attrFunctionNS(fullname, value) {
+    return function() {
+      var v = value.apply(this, arguments);
+      if (v == null) this.removeAttributeNS(fullname.space, fullname.local);
+      else this.setAttributeNS(fullname.space, fullname.local, v);
+    };
+  }
+
+  function selection_attr(name, value) {
+    var fullname = namespace(name);
+
+    if (arguments.length < 2) {
+      var node = this.node();
+      return fullname.local
+          ? node.getAttributeNS(fullname.space, fullname.local)
+          : node.getAttribute(fullname);
+    }
+
+    return this.each((value == null
+        ? (fullname.local ? attrRemoveNS : attrRemove) : (typeof value === "function"
+        ? (fullname.local ? attrFunctionNS : attrFunction)
+        : (fullname.local ? attrConstantNS : attrConstant)))(fullname, value));
+  }
+
+  function defaultView(node) {
+    return (node.ownerDocument && node.ownerDocument.defaultView) // node is a Node
+        || (node.document && node) // node is a Window
+        || node.defaultView; // node is a Document
+  }
+
+  function styleRemove(name) {
+    return function() {
+      this.style.removeProperty(name);
+    };
+  }
+
+  function styleConstant(name, value, priority) {
+    return function() {
+      this.style.setProperty(name, value, priority);
+    };
+  }
+
+  function styleFunction(name, value, priority) {
+    return function() {
+      var v = value.apply(this, arguments);
+      if (v == null) this.style.removeProperty(name);
+      else this.style.setProperty(name, v, priority);
+    };
+  }
+
+  function selection_style(name, value, priority) {
+    return arguments.length > 1
+        ? this.each((value == null
+              ? styleRemove : typeof value === "function"
+              ? styleFunction
+              : styleConstant)(name, value, priority == null ? "" : priority))
+        : styleValue(this.node(), name);
+  }
+
+  function styleValue(node, name) {
+    return node.style.getPropertyValue(name)
+        || defaultView(node).getComputedStyle(node, null).getPropertyValue(name);
+  }
+
+  function propertyRemove(name) {
+    return function() {
+      delete this[name];
+    };
+  }
+
+  function propertyConstant(name, value) {
+    return function() {
+      this[name] = value;
+    };
+  }
+
+  function propertyFunction(name, value) {
+    return function() {
+      var v = value.apply(this, arguments);
+      if (v == null) delete this[name];
+      else this[name] = v;
+    };
+  }
+
+  function selection_property(name, value) {
+    return arguments.length > 1
+        ? this.each((value == null
+            ? propertyRemove : typeof value === "function"
+            ? propertyFunction
+            : propertyConstant)(name, value))
+        : this.node()[name];
+  }
+
+  function classArray(string) {
+    return string.trim().split(/^|\s+/);
+  }
+
+  function classList(node) {
+    return node.classList || new ClassList(node);
+  }
+
+  function ClassList(node) {
+    this._node = node;
+    this._names = classArray(node.getAttribute("class") || "");
+  }
+
+  ClassList.prototype = {
+    add: function(name) {
+      var i = this._names.indexOf(name);
+      if (i < 0) {
+        this._names.push(name);
+        this._node.setAttribute("class", this._names.join(" "));
+      }
+    },
+    remove: function(name) {
+      var i = this._names.indexOf(name);
+      if (i >= 0) {
+        this._names.splice(i, 1);
+        this._node.setAttribute("class", this._names.join(" "));
+      }
+    },
+    contains: function(name) {
+      return this._names.indexOf(name) >= 0;
+    }
+  };
+
+  function classedAdd(node, names) {
+    var list = classList(node), i = -1, n = names.length;
+    while (++i < n) list.add(names[i]);
+  }
+
+  function classedRemove(node, names) {
+    var list = classList(node), i = -1, n = names.length;
+    while (++i < n) list.remove(names[i]);
+  }
+
+  function classedTrue(names) {
+    return function() {
+      classedAdd(this, names);
+    };
+  }
+
+  function classedFalse(names) {
+    return function() {
+      classedRemove(this, names);
+    };
+  }
+
+  function classedFunction(names, value) {
+    return function() {
+      (value.apply(this, arguments) ? classedAdd : classedRemove)(this, names);
+    };
+  }
+
+  function selection_classed(name, value) {
+    var names = classArray(name + "");
+
+    if (arguments.length < 2) {
+      var list = classList(this.node()), i = -1, n = names.length;
+      while (++i < n) if (!list.contains(names[i])) return false;
+      return true;
+    }
+
+    return this.each((typeof value === "function"
+        ? classedFunction : value
+        ? classedTrue
+        : classedFalse)(names, value));
+  }
+
+  function textRemove() {
+    this.textContent = "";
+  }
+
+  function textConstant(value) {
+    return function() {
+      this.textContent = value;
+    };
+  }
+
+  function textFunction(value) {
+    return function() {
+      var v = value.apply(this, arguments);
+      this.textContent = v == null ? "" : v;
+    };
+  }
+
+  function selection_text(value) {
+    return arguments.length
+        ? this.each(value == null
+            ? textRemove : (typeof value === "function"
+            ? textFunction
+            : textConstant)(value))
+        : this.node().textContent;
+  }
+
+  function htmlRemove() {
+    this.innerHTML = "";
+  }
+
+  function htmlConstant(value) {
+    return function() {
+      this.innerHTML = value;
+    };
+  }
+
+  function htmlFunction(value) {
+    return function() {
+      var v = value.apply(this, arguments);
+      this.innerHTML = v == null ? "" : v;
+    };
+  }
+
+  function selection_html(value) {
+    return arguments.length
+        ? this.each(value == null
+            ? htmlRemove : (typeof value === "function"
+            ? htmlFunction
+            : htmlConstant)(value))
+        : this.node().innerHTML;
+  }
+
+  function raise() {
+    if (this.nextSibling) this.parentNode.appendChild(this);
+  }
+
+  function selection_raise() {
+    return this.each(raise);
+  }
+
+  function lower() {
+    if (this.previousSibling) this.parentNode.insertBefore(this, this.parentNode.firstChild);
+  }
+
+  function selection_lower() {
+    return this.each(lower);
+  }
+
+  function selection_append(name) {
+    var create = typeof name === "function" ? name : creator(name);
+    return this.select(function() {
+      return this.appendChild(create.apply(this, arguments));
+    });
+  }
+
+  function constantNull() {
+    return null;
+  }
+
+  function selection_insert(name, before) {
+    var create = typeof name === "function" ? name : creator(name),
+        select = before == null ? constantNull : typeof before === "function" ? before : selector(before);
+    return this.select(function() {
+      return this.insertBefore(create.apply(this, arguments), select.apply(this, arguments) || null);
+    });
+  }
+
+  function remove() {
+    var parent = this.parentNode;
+    if (parent) parent.removeChild(this);
+  }
+
+  function selection_remove() {
+    return this.each(remove);
+  }
+
+  function selection_cloneShallow() {
+    return this.parentNode.insertBefore(this.cloneNode(false), this.nextSibling);
+  }
+
+  function selection_cloneDeep() {
+    return this.parentNode.insertBefore(this.cloneNode(true), this.nextSibling);
+  }
+
+  function selection_clone(deep) {
+    return this.select(deep ? selection_cloneDeep : selection_cloneShallow);
+  }
+
+  function selection_datum(value) {
+    return arguments.length
+        ? this.property("__data__", value)
+        : this.node().__data__;
+  }
+
+  var filterEvents = {};
+
+  if (typeof document !== "undefined") {
+    var element = document.documentElement;
+    if (!("onmouseenter" in element)) {
+      filterEvents = {mouseenter: "mouseover", mouseleave: "mouseout"};
+    }
+  }
+
+  function filterContextListener(listener, index, group) {
+    listener = contextListener(listener, index, group);
+    return function(event) {
+      var related = event.relatedTarget;
+      if (!related || (related !== this && !(related.compareDocumentPosition(this) & 8))) {
+        listener.call(this, event);
+      }
+    };
+  }
+
+  function contextListener(listener, index, group) {
+    return function(event1) {
+      try {
+        listener.call(this, this.__data__, index, group);
+      } finally {
+      }
+    };
+  }
+
+  function parseTypenames(typenames) {
+    return typenames.trim().split(/^|\s+/).map(function(t) {
+      var name = "", i = t.indexOf(".");
+      if (i >= 0) name = t.slice(i + 1), t = t.slice(0, i);
+      return {type: t, name: name};
+    });
+  }
+
+  function onRemove(typename) {
+    return function() {
+      var on = this.__on;
+      if (!on) return;
+      for (var j = 0, i = -1, m = on.length, o; j < m; ++j) {
+        if (o = on[j], (!typename.type || o.type === typename.type) && o.name === typename.name) {
+          this.removeEventListener(o.type, o.listener, o.capture);
+        } else {
+          on[++i] = o;
+        }
+      }
+      if (++i) on.length = i;
+      else delete this.__on;
+    };
+  }
+
+  function onAdd(typename, value, capture) {
+    var wrap = filterEvents.hasOwnProperty(typename.type) ? filterContextListener : contextListener;
+    return function(d, i, group) {
+      var on = this.__on, o, listener = wrap(value, i, group);
+      if (on) for (var j = 0, m = on.length; j < m; ++j) {
+        if ((o = on[j]).type === typename.type && o.name === typename.name) {
+          this.removeEventListener(o.type, o.listener, o.capture);
+          this.addEventListener(o.type, o.listener = listener, o.capture = capture);
+          o.value = value;
+          return;
+        }
+      }
+      this.addEventListener(typename.type, listener, capture);
+      o = {type: typename.type, name: typename.name, value: value, listener: listener, capture: capture};
+      if (!on) this.__on = [o];
+      else on.push(o);
+    };
+  }
+
+  function selection_on(typename, value, capture) {
+    var typenames = parseTypenames(typename + ""), i, n = typenames.length, t;
+
+    if (arguments.length < 2) {
+      var on = this.node().__on;
+      if (on) for (var j = 0, m = on.length, o; j < m; ++j) {
+        for (i = 0, o = on[j]; i < n; ++i) {
+          if ((t = typenames[i]).type === o.type && t.name === o.name) {
+            return o.value;
+          }
+        }
+      }
+      return;
+    }
+
+    on = value ? onAdd : onRemove;
+    if (capture == null) capture = false;
+    for (i = 0; i < n; ++i) this.each(on(typenames[i], value, capture));
+    return this;
+  }
+
+  function dispatchEvent(node, type, params) {
+    var window = defaultView(node),
+        event = window.CustomEvent;
+
+    if (typeof event === "function") {
+      event = new event(type, params);
+    } else {
+      event = window.document.createEvent("Event");
+      if (params) event.initEvent(type, params.bubbles, params.cancelable), event.detail = params.detail;
+      else event.initEvent(type, false, false);
+    }
+
+    node.dispatchEvent(event);
+  }
+
+  function dispatchConstant(type, params) {
+    return function() {
+      return dispatchEvent(this, type, params);
+    };
+  }
+
+  function dispatchFunction(type, params) {
+    return function() {
+      return dispatchEvent(this, type, params.apply(this, arguments));
+    };
+  }
+
+  function selection_dispatch(type, params) {
+    return this.each((typeof params === "function"
+        ? dispatchFunction
+        : dispatchConstant)(type, params));
+  }
+
+  var root = [null];
+
+  function Selection(groups, parents) {
+    this._groups = groups;
+    this._parents = parents;
+  }
+
+  function selection() {
+    return new Selection([[document.documentElement]], root);
+  }
+
+  Selection.prototype = selection.prototype = {
+    constructor: Selection,
+    select: selection_select,
+    selectAll: selection_selectAll,
+    filter: selection_filter,
+    data: selection_data,
+    enter: selection_enter,
+    exit: selection_exit,
+    join: selection_join,
+    merge: selection_merge,
+    order: selection_order,
+    sort: selection_sort,
+    call: selection_call,
+    nodes: selection_nodes,
+    node: selection_node,
+    size: selection_size,
+    empty: selection_empty,
+    each: selection_each,
+    attr: selection_attr,
+    style: selection_style,
+    property: selection_property,
+    classed: selection_classed,
+    text: selection_text,
+    html: selection_html,
+    raise: selection_raise,
+    lower: selection_lower,
+    append: selection_append,
+    insert: selection_insert,
+    remove: selection_remove,
+    clone: selection_clone,
+    datum: selection_datum,
+    on: selection_on,
+    dispatch: selection_dispatch
+  };
+
+  function select(selector) {
+    return typeof selector === "string"
+        ? new Selection([[document.querySelector(selector)]], [document.documentElement])
+        : new Selection([[selector]], root);
+  }
+
+  /*
+  Uses the Mediawiki API to display a list of recent images and a link to
+  the page where the image has been used/placed.
+
+  Makes use of the following API calls:
+
+  * https://www.mediawiki.org/wiki/API:Allimages
+  * https://www.mediawiki.org/wiki/API:Imageinfo
+  * https://www.mediawiki.org/wiki/API:Imageusage
+  */
+  var PAGE_COUNT = 25; /* how many edits to show per load*/
+  var main = select("#content"),
+      //baseurl = "/mw/api.php?action=query&list=allpages&rclimit=25&rcnamespace=0&rctoponly=1&format=json&formatversion=2&rcshow=!minor|!bot|!redirect|!anon",
+      //baseurl = "/mw/api.php?action=query&generator=categorymembers&gcmtitle=Category:B1&prop=categories&cllimit=max&gcmlimit=max|!bot|!redirect|!anon",
+	baseurl="/mw/api.php?action=query&generator=categorymembers&gcmtitle=Cat%E9gorie:Actualit%E9s&prop=categories&cllimit=max&gcmlimit=max",
+      url = baseurl;
+
+  async function get_json (url) {
+      var resp = await fetch(url);
+      return await resp.json();
+  }
+
+  function url_for_title (title) {
+      return "/w/"+encodeURI(title.replace(/ /g, "_"));
+  }
+
+  async function load () {
+      let count = 0;
+      while (count < PAGE_COUNT) {
+           console.log("starting loop", "count", count, "url", url);
+          let data = await get_json(url),
+              recentchanges = data.query.recentchanges;
+          console.log("recentchanges", recentchanges);
+          let items = main.selectAll("div.edit")
+              .data(recentchanges, d=>d.title)
+              .enter()
+              .append("div")
+              .attr("class", "edit")
+              .append("a")
+              .attr("href", d=>url_for_title(d.title))
+              .attr("target", "wikiframe")
+              .text(d=>d.title);
+
+          if (data.continue) {
+              url = baseurl+"&rccontinue="+data.continue.rccontinue;
+          } else {
+              return;
+          }
+          count += recentchanges.length;
+      }
+  }
+  document.addEventListener("DOMContentLoaded", load);
+  document.querySelector("a#more").addEventListener("click", function (e) {
+      e.preventDefault();
+      load();
+  });
+
+}());

special/recentnews/index.html

@@ -0,0 +1,55 @@
+<!DOCTYPE html>
+<html>
+<head>
+<title>erg: modifications récentes</title>
+<meta charset="utf-8">
+<link rel="stylesheet" type="text/css" href="/m/style.css">
+<style>
+    body {
+        margin: 1.5em;
+        margin-left: 40px;
+        margin-top: 2.5em;
+        background: #333;
+        color: white;
+        overflow: auto;
+	font-family: Vega;
+	font-size: 17px;
+    }
+    h1 {
+        margin: 0;
+        font-family: Combined;
+        font-size: 1.5em;
+    }
+    #content {
+        margin-top: 1em;
+    }
+    div#footer {
+        clear: both;
+        text-align: center;
+        margin-top: 1em;
+    }
+    a {
+        color: white;
+        text-decoration: none;
+    }
+    a:hover {
+        text-decoration: underline;
+    }
+    a#more {
+        color: black;
+        text-decoration: none;
+        background: white;
+        padding: 5px;
+    }
+    div.edit {
+        margin-bottom: 1em;
+    }
+</style>
+</head>
+<body>
+    <h1>Modifications récentes</h1>
+<div id="content"></div>
+<div id="footer"><a href="#" id="more">en plus&hellip;</a></div>
+<script src="dist/recentchanges.js"></script>
+</body>
+</html>

special/recentnews/package.json

@@ -0,0 +1,16 @@
+{
+  "name": "recentfiles",
+  "version": "1.0.0",
+  "description": "",
+  "main": "rollup.config.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "dependencies": {
+    "d3-selection": "^1.4.0",
+    "rollup": "^1.17.0"
+  }
+}

special/recentnews/rollup.config.js

@@ -0,0 +1,17 @@
+// rollup.config.js
+// https://github.com/rollup/rollup-plugin-commonjs
+import commonjs from 'rollup-plugin-commonjs';
+import resolve from 'rollup-plugin-node-resolve';
+
+export default [{
+  input: 'src/recentchanges.js',
+  output: {
+    file: 'dist/recentchanges.js',
+    format: 'iife',
+    name: 'app'
+  },
+  plugins: [
+    resolve(), 
+    commonjs()
+  ]
+}];

special/recentnews/src/recentchanges.js

@@ -0,0 +1,55 @@
+import { selectAll, select } from 'd3-selection';
+/*
+Uses the Mediawiki API to display a list of recent images and a link to
+the page where the image has been used/placed.
+
+Makes use of the following API calls:
+
+* https://www.mediawiki.org/wiki/API:Allimages
+* https://www.mediawiki.org/wiki/API:Imageinfo
+* https://www.mediawiki.org/wiki/API:Imageusage
+*/
+var PAGE_COUNT = 25; /* how many edits to show per load*/
+var main = select("#content"),
+    baseurl = "/mw/api.php?action=query&list=recentchanges&rclimit=25&rcnamespace=0&rctoponly=1&format=json&formatversion=2&rcshow=!minor|!bot|!redirect|!anon",
+    url = baseurl;
+
+async function get_json (url) {
+    var resp = await fetch(url);
+    return await resp.json();
+}
+
+function url_for_title (title) {
+    return "/w/"+encodeURI(title.replace(/ /g, "_"));
+}
+
+async function load () {
+    let count = 0;
+    while (count < PAGE_COUNT) {
+        // console.log("starting loop", "count", count, "url", url);
+        let data = await get_json(url),
+            recentchanges = data.query.recentchanges;
+        console.log("recentchanges", recentchanges);
+        let items = main.selectAll("div.edit")
+            .data(recentchanges, d=>d.title)
+            .enter()
+            .append("div")
+            .attr("class", "edit")
+            .append("a")
+            .attr("href", d=>url_for_title(d.title))
+            .attr("target", "wikiframe")
+            .text(d=>d.title);
+
+        if (data.continue) {
+            url = baseurl+"&rccontinue="+data.continue.rccontinue;
+        } else {
+            return;
+        }
+        count += recentchanges.length;
+    }
+}
+document.addEventListener("DOMContentLoaded", load);
+document.querySelector("a#more").addEventListener("click", function (e) {
+    e.preventDefault();
+    load();
+});

special/wikipage/Makefile

@@ -0,0 +1,6 @@
+
+all: dist/app.js
+
+dist/app.js: src/*.js
+	# node_modules/.bin/rollup src/index.js --file dist/index.js --format iife
+	node_modules/.bin/rollup -c

special/wikipage/package.json

@@ -0,0 +1,16 @@
+{
+  "name": "wikipage",
+  "version": "1.0.0",
+  "description": "",
+  "main": "rollup.config.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "dependencies": {
+    "d3-selection": "^1.4.0",
+    "rollup": "^1.17.0"
+  }
+}

special/wikipage/package.json~

@@ -0,0 +1,16 @@
+{
+  "name": "recentfiles",
+  "version": "1.0.0",
+  "description": "",
+  "main": "rollup.config.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "dependencies": {
+    "d3-selection": "^1.4.0",
+    "rollup": "^1.17.0"
+  }
+}

special/wikipage/rollup.config.js

@@ -0,0 +1,17 @@
+// rollup.config.js
+// https://github.com/rollup/rollup-plugin-commonjs
+import commonjs from 'rollup-plugin-commonjs';
+import resolve from 'rollup-plugin-node-resolve';
+
+export default [{
+  input: 'src/wikipage.js',
+  output: {
+    file: 'dist/wikpage.js',
+    format: 'iife',
+    name: 'app'
+  },
+  plugins: [
+    resolve(), 
+    commonjs()
+  ]
+}];

special/wikipage/src/wikipage.js

@@ -0,0 +1,86 @@
+import { selectAll, select } from 'd3-selection';
+
+/*
+
+Uses the Mediawiki API to simply display the contents of a wiki page.
+
+Makes use of the following API calls:
+
+* https://www.mediawiki.org/wiki/API:Parsing_wikitext
+
+*/
+var main = select("#content"),
+    title = window.location.hash ? window.location.hash.substring(1) : "Bienvenue_à_l’erg",
+    baseurl = "/mw/api.php?action=parse&format=json&formatversion=2title=",
+    url = baseurl;
+
+async function get_json (url) {
+    var resp = await fetch(url);
+    return await resp.json();
+}
+
+function url_for_title (title) {
+    return "/w/"+encodeURI(title.replace(/ /g, "_"));
+}
+
+async function load () {
+    let count = 0,
+        debugloopcount = 0;
+    while (count < NUM_FILES) {
+        console.log("starting loop", debugloopcount, "count", count, "url", url);
+        let resp = await fetch(url),
+            data = await resp.json(),
+            allimages = data.query.allimages,
+            useimages = [];
+        // console.log("got data", data.query.allimages.length);
+        // For each image:
+        // Use API:Imageinfo request/get the URL to a thumbnail image
+        // 
+        for (var i=0, l=allimages.length; i<l; i++) {
+            let image = allimages[i];
+            // console.log("image", image.name);
+            let iu_data = await get_json(`/mw/api.php?action=query&list=imageusage&iutitle=${image.title}&iunamespace=0&format=json&formatversion=2`);
+
+            image.imageusage = iu_data.query.imageusage;
+            if (image.imageusage.length == 0) { 
+                continue;
+            }
+
+            let ii_data = await get_json(`/mw/api.php?action=query&prop=imageinfo&titles=${image.title}&iiprop=url|size&dimensions|mime&iiurlwidth=320&format=json&formatversion=2`);
+            image.imageinfo = ii_data.query.pages[0].imageinfo[0];
+            if (!image.imageinfo.thumburl) {
+                continue;
+            }
+
+            useimages.push(image);
+            // console.log("imageusage", image.name, image.imageusage.length);
+            // console.log("imageinfo", image.name, image.imageinfo);
+        }
+
+        // console.log("allimages", allimages);
+        // allimages = allimages.filter(d=>d.imageinfo.thumburl && (d.imageusage.length > 0));
+        let items = main.selectAll("div.file")
+            .data(useimages, d=>d.title)
+            .enter()
+            .append("div")
+            .attr("class", "file")
+            .append("a")
+            .attr("href", d=>url_for_title(d.imageusage[d.imageusage.length-1].title))
+            .attr("target", "wikiframe")
+            .append("img")
+            .attr('src', d=>d.imageinfo.thumburl);
+
+        if (data.continue) {
+            url = baseurl+"&aicontinue="+data.continue.aicontinue;
+        }
+        count += useimages.length;
+        debugloopcount += 1;
+        // if (debugloopcount >= 5) break;
+    }
+
+}
+document.addEventListener("DOMContentLoaded", load);
+document.querySelector("a#more").addEventListener("click", function (e) {
+    e.preventDefault();
+    load();
+});

special/wikipage/wikipage.html

@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html>
+<head>
+<title>recent files</title>
+<meta charset="utf-8">
+<style>
+    body {
+        background: #eee;
+        background-image: linear-gradient(45deg, rgba(0,0,0,.25) 25%, transparent 0, transparent 75%, rgba(0,0,0,.25) 0), linear-gradient(45deg, rgba(0,0,0,.25) 25%, transparent 0, transparent 75%, rgba(0,0,0,.25) 0);
+        background-position: 0 0, 20px 20px;
+        background-size: 40px 40px;
+    }
+    div.file {
+        float: left;
+        margin: 8px;
+	max-width: 45%;
+    }
+    div.file img {
+	max-width: 100%;
+    }
+    div#footer {
+        clear: both;
+        text-align: center;
+    }
+    a#more {
+        color: white;
+        text-decoration: none;
+        background: black;
+        padding: 5px;
+    }
+</style>
+</head>
+<body>
+<div id="content"></div>
+<div id="footer"><a href="#" id="more">en plus&hellip;</a></div>
+<script src="dist/recentfiles.js"></script>
+</body>
+</html>

splitscreen.css

@@ -0,0 +1,312 @@
+/* F O N T E S */
+@font-face {
+    font-family: "Combined";
+    src: url('/typo/Combined/combined.otf');  
+    font-style:   normal;
+    font-weight:  normal;
+}
+
+@font-face {
+    font-family: 'combinedregular';
+    src: url('/typo/Combined/web/combined.eot');
+    src: url('/typo/Combined/web/combined.eot?#iefix') format('embedded-opentype'),
+         url('/typo/Combined/web/combined.woff2') format('woff2'),
+         url('/typo/Combined/web/combined.woff') format('woff'),
+         url('/typo/Combined/web/combined.ttf') format('truetype'),
+         url('/typo/Combined/web/combined.svg#combinedregular') format('svg');
+    font-weight: normal;
+    font-style: normal;
+}
+
+
+body {
+    margin: 0;
+    padding: 0;
+    background: #f1f2f3;
+    overflow: hidden;
+}
+
+
+.links line {
+  stroke: #aaa;
+  /*stroke: none;*/
+}
+
+.links line.active2 {
+    stroke: magenta;
+}
+
+.links line.history {
+    stroke: purple;
+}
+
+.active {
+    stroke: magenta;
+}
+
+.category circle {
+    fill: cyan;
+}
+
+.web circle {
+    fill: purple;
+}
+
+.news circle {
+    fill: lightgray;
+}
+
+.template circle {
+    fill: lightgreen;
+}
+
+.discussion circle {
+    fill: aqua;
+}
+
+
+
+svg {
+    position: absolute;
+    left: 0; top: 0; right: 0; bottom: 0;
+    font: 10px sans-serif;
+}
+
+svg g.page {
+    cursor: pointer;
+}
+
+svg g.page text {
+    visibility: hidden;
+    fill: #222;
+    font: 9px sans-serif;
+}
+
+svg g.active text {
+    /*visibility: visible;*/
+}
+
+svg g.mouse text {
+    visibility: visible;
+}
+
+use {
+    fill: #EEE;
+    stroke: black;
+}
+
+.highlight use {
+    fill: #FFF;
+    stroke: cyan;
+}
+
+.active use {
+/*  animation-transform: 2;*/
+  animation-duration: 2s;
+  animation-name: pulse;
+  animation-iteration-count: infinite;
+}
+
+@keyframes pulse {
+  0% {
+    transform: scale(1, 1);
+  }
+  50% {
+    transform: scale(1.5, 1.5);
+  }
+  100% {
+    transform: scale(1, 1);
+  }
+}
+
+.active use {
+    fill: #FFF;
+    stroke: magenta;
+}
+
+.active text {
+    stroke: none;
+}
+
+.active2 use {
+    fill: #FFF;
+    stroke: magenta;
+}
+
+
+
+/* Categories */
+
+#cats .body {
+  display: none;
+}
+
+#cats .placeholder {
+  min-width: 100%;
+  text-align: center;
+  color: gray;
+  font-weight: bold;
+  font-size: 12px;
+}
+#cats.expanded .body {
+  display: block;
+}
+
+#cats.expanded .placeholder {
+  display: none;
+}
+
+#cats {
+    /*display: none;*/
+    position: absolute;
+    left: 10px;
+    bottom: 10px;
+    background: #FFFFFFFF;
+    border-radius: 24px;
+    padding: 10px;
+    font-size: 12px;
+    min-width: 16px;
+    min-height: 16px;
+    box-shadow: 0 3px 3px 3px rgba(255, 0, 255, 0.44);
+}
+
+#cats div.cat span.icon {
+    position: relative;
+    top: 4px;
+    display: inline-block;
+    width: 18px;
+    height: 18px;
+    background-repeat: no-repeat;
+    margin-right: 4px;
+    background-position: center center;
+}
+#cats div.cat span.count {
+  display: none;
+    padding: 0px 3px;
+    background: #DDD;
+    color: #444;
+    font-size: 10px;
+    margin-left: 4px;
+}
+#cats div.cat a {
+    color: black;
+    text-decoration: none;
+}
+#cats div.cat.highlight a {
+    color: cyan;
+}
+#cats hr {
+  color: white;
+}
+
+
+#page {
+  position: absolute;
+  left: 0; right: 50%;
+  top: 0;
+  bottom: 0;
+}
+
+#wikiframediv {
+    position: absolute;
+    left: 50%; top: 0;
+    right: 0; bottom: 0;
+}
+#wikiframediv iframe {
+  width: 100%;
+  height: 100%;
+  border: none;
+}
+
+/* MEDIAWIKI PAGE */
+.header-container {
+  display: none !important;
+}
+
+iframe form.header {
+  display: none;
+}
+/*ul#page-actions {
+  display: none;
+}
+*/
+a.talk {
+  display:none;
+}
+
+
+
+
+
+
+/* control positioning */
+
+.leaflet-control {
+  position: relative;
+  z-index: 800;
+  pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */
+  pointer-events: auto;
+  font-size: 12px;
+}
+.leaflet-control {
+  float: left;
+  clear: both;
+  }
+
+/* general toolbar styles */
+
+.leaflet-bar {
+  box-shadow: 0 1px 5px rgba(0,0,0,0.65);
+}
+.leaflet-bar a,
+.leaflet-bar a:hover {
+  background-color: #fff;
+  border-bottom: 1px solid #ccc;
+  width: 26px;
+  height: 26px;
+  line-height: 26px;
+  display: block;
+  text-align: center;
+  text-decoration: none;
+  color: black;
+  }
+.leaflet-bar a,
+.leaflet-control-layers-toggle {
+  background-position: 50% 50%;
+  background-repeat: no-repeat;
+  display: block;
+}
+.leaflet-bar a:hover {
+  background-color: #f4f4f4;
+  }
+.leaflet-bar a:first-child {
+  }
+.leaflet-bar a:last-child {
+  border-bottom: none;
+  }
+.leaflet-bar a.leaflet-disabled {
+  cursor: default;
+  background-color: #f4f4f4;
+  color: #bbb;
+  }
+
+
+/* zoom controls */
+
+.zoom-controls {
+  position: absolute;
+  left: 10px;
+  top: 10px;
+  z-index: 10000;
+}
+
+.leaflet-control-zoom-in,
+.leaflet-control-zoom-out {
+  font: Combined;
+  font-size: 24px;
+  line-height: 20px;
+  text-indent: 1px;
+  box-shadow: 0 3px 3px 3px rgba(255, 0, 255, 0.44);
+  background-color: #ffffff;
+}
+

splitscreen.html

@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <title>école de recherche graphique</title>
+    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta charset="utf-8">
+    <link rel="stylesheet" type="text/css" href="splitscreen.css">
+</head>
+<body>
+    <div id="page">
+        <svg id="svg"></svg>
+        <div id="cats">
+            <div class="body"></div>
+            <div class="placeholder">?</div>
+        </div>
+    </div>
+    <div id="wikiframediv">
+        <iframe id="wikiframe" src="/mw"></iframe>
+    </div>
+
+<div class="zoom-controls">
+    <div class="leaflet-control-zoom leaflet-bar leaflet-control">
+        <a class="leaflet-control-zoom-in" href="#" title="Zoom in" role="button" aria-label="Zoom in">+</a>
+        <a class="leaflet-control-zoom-out" href="#" title="Zoom out" role="button" aria-label="Zoom out">-</a>
+    </div>  
+</div>
+
+</body>
+<script type="text/javascript" src="dist/app.js"></script>
+<script src="dist/index.js"></script>
+</html>

src/forcenet.js

@@ -19,8 +19,8 @@ export class ForceNet {
         // this.nodes = {};
         this.simulation = forceSimulation()
             //.velocityDecay(0.1)
-            .force("link", forceLink().id(d => d.title))
-            .force("charge", forceManyBody())
+		    .force("link", forceLink().id(d => d.title).distance(800))
+            .force("charge", forceManyBody().distanceMin(800))
             .force("radial", forceRadial(180, width/2, height/2));
             // .force("center", forceCenter(width / 2, height / 2));
         this.svg = null;
@@ -74,13 +74,38 @@ export class ForceNet {
         return (a < b) ? ("link_"+a+"_"+b) : ("link_"+b+"_"+a);
     }
 
+    /*
+    link_key (p1, p2) {
+        return (p1.title < p2.title) ?
+            ("link_"+p1.title+"_"+p2.title) :
+            ("link_"+p2.title+"_"+p1.title);
+    }
+    */
+    make_link (p1, p2) {
+        return (p1.title < p2.title) ?
+            {source: p1, target: p2 } :
+            {source: p2, target: p1 };        
+    }
+
+    register_link (from_page, to_page) {
+        var lkey = this.link_key(from_page, to_page);
+        if (this.links[lkey] === undefined) {
+            this.links[lkey] = this.make_link(from_page, to_page);
+        }
+    }
+
+
+
     get_symbol (d, def) {
+        return "symbols.svg#Main";
+        /*
         for (var i=0, l=d.cats.length; i<l; i++) {
             if (this.symbols[d.cats[i]]) {
                 return this.symbols[d.cats[i]];
             }
         }
         return this.symbols.default || def;
+        */
     }
 
     update_graph (graph) {
@@ -103,6 +128,8 @@ export class ForceNet {
         var node = this.nodesg
             .selectAll("g.page")
             .data(graph.nodes, function (d) { return d.title });
+        
+        node.exit().remove();
 
         var that = this;
         var node_enter = node.enter().append("g")
@@ -215,13 +242,26 @@ export class ForceNet {
             if (d.source.active || d.target.active) {
                 return 1;
             } else {
+                return 1;
                 // same as d3.force's defaultStrength
-                return 0.5 * (1 / Math.min(d.source.count, d.target.count)); 
+                // return 0.5 * (1 / Math.min(d.source.count, d.target.count)); 
             }
         });
         this.simulation.alphaTarget(0.3).restart();
     }
 
+    activate_linked_nodes (page, active) {
+        // deactivate linked links/nodes
+        for (let i=0, l=this.links.length; i<l; i++) {
+            let link = this.links[i];
+            if (link.source == page || link.target == page) {
+                link.active2 = active;
+                link.source.active2 = active;
+                link.target.active2 = active;
+            }
+        }        
+    }
+
 
 }
 

src/legend.json

@@ -0,0 +1,42 @@
+[
+   {
+      "key" : "Orientations",
+      "symbol" : "symbols.svg#Orientations",
+      "icon": "img/Orientations.png"
+   },
+   {
+      "key" : "Ateliers pluridisciplinaires",
+      "symbol" : "symbols.svg#Ateliers_pluridisciplinaires",
+      "icon" : "img/Ateliers_pluridisciplinaires.png"
+   },
+   {
+      "key" : "Cours de soutien spécifique",
+      "symbol" : "symbols.svg#Cours_de_soutien_specifique",
+      "icon" : "img/Cours_de_soutien_specifique.png"
+   },
+   {
+      "key" : "Cours techniques",
+      "symbol" : "symbols.svg#Cours_techniques",
+      "icon" : "img/Cours_techniques.png"
+   },
+   {
+      "key" : "Cours théoriques",
+      "symbol" : "symbols.svg#Cours_theoriques",
+      "icon" : "img/Cours_theoriques.png"
+   },
+   {
+      "key" : "Enseignant·e·s",
+      "symbol" : "symbols.svg#Enseignant__e__s",
+      "icon" : "img/Enseignants.png"
+   },
+   {
+      "key" : "Actualités",
+      "symbol" : "symbols.svg#Actualites",
+      "icon" : "img/Actualites.png"
+   },
+   {
+      "key" : "default",
+      "symbol" : "symbols.svg#Main",
+      "icon" : "img/Main.png"
+   }
+]

src/mobilecheck.js

@@ -0,0 +1,7 @@
+// https://stackoverflow.com/questions/11381673/detecting-a-mobile-browser
+export function mobilecheck () {
+  var check = false;
+  (function(a){if(/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i.test(a)||/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(a.substr(0,4))) check = true;})(navigator.userAgent||navigator.vendor||window.opera);
+  return check;
+};
+

src/wiki.js

@@ -1,6 +1,7 @@
 
-import fetchJsonp from 'fetch-jsonp';
-import { map } from 'd3-collection';
+// import fetchJsonp from 'fetch-jsonp';
+import { json } from 'd3-fetch';
+import { values, map } from 'd3-collection';
 
 var NS = {
     main: 0,
@@ -11,6 +12,10 @@ var NS = {
     web: 3116
 }
 
+function strip_fragment (href) {
+    return href.replace(/#.?$/, '');
+}
+
 export class Wiki {
     constructor (apiurl) {
         this.apiurl = apiurl;
@@ -20,13 +25,91 @@ export class Wiki {
             var nsid = NS[key];
             this.ns_names[nsid] = key;
         }
+        this.siteinfo = null;
     }
+
+    get_nodes () {
+        var ret = values(this.pages_by_title);
+        ret = ret.filter(p => (!p.redirect && p.ns === 0));
+        return ret;
+    }
+
+    get_links () {
+        return values(this.links);
+    }
+
+    async init () {
+        await this.get_site_info();
+    }
+
+    async get_site_info () {
+        // https://en.wikipedia.org/w/api.php
+        var url = this.apiurl + "?action=query&meta=siteinfo&siprop=general&format=json&formatversion=2";
+        var data = await json(url);
+        // this.siteinfo = data.query.general;
+
+        this.server = data.query.general.server; // e.g. "http://activearchives.org"
+        this.articlepath = data.query.general.articlepath; // e.g. "/wiki/$1"
+        this.base = data.query.general.base; // e.g. "http://activearchives.org/wiki/Main_Page"
+        // this.sitename = data.query.general.sitename;
+        this.mainpage = data.query.general.mainpage;
+        this.wikibasepat = new RegExp(this.server+this.articlepath.replace(/\$1$/, "(.+)"));
+
+        url = this.apiurl + "?action=query&meta=siteinfo&siprop=namespaces&format=json&formatversion=2";
+        data = await json(url);
+        this.namespaces_by_id = data.query.namespaces;
+        this.namespaces_by_name = {};
+        values(this.namespaces_by_id).forEach(n => {
+            this.namespaces_by_name[n.name] = n;
+        });
+        // create special special entry
+        var special = { name: "Special", id: -17 };
+        this.namespaces_by_name["Special"] = special;
+        this.namespaces_by_id[-17] = special;
+
+    }
+
+    escapeTitle (title) {
+        return encodeURI(title.replace(/ /g, "_"));
+    }
+
+    unescapeTitle (title) {
+        return decodeURI(title.replace(/_/g, " "));
+    }
+
+    wiki_title_to_url (title) {
+        return this.server + this.articlepath.replace(/\$1$/, this.escapeTitle(title));
+    }
+
+    url_to_wiki_title (href) {
+        var m = this.wikibasepat.exec(strip_fragment(href));
+        if (m !== null) {
+            return this.unescapeTitle(m[1]);
+        }
+    }
+
+    /* sample siteinfo, see: http://activearchives.org/mw/api.php?action=query&meta=siteinfo&formatversion=2&format=json */
+
+    get_page (url) {
+        var title = this.url_to_wiki_title(url);
+        if (title) {
+            return this.get_page_by_title(title);
+        }
+    }
+
     get_page_by_title (title) {
         var p = this.pages_by_title[title];
         if (p) {
             return p;
         } else {
-            p = new Page(this, {title: title, ns: 0});
+            var cpos = title.indexOf(":"),
+                name = title,
+                namespace = "";
+            if (cpos >= 0) {
+                namespace = title.substring(0, cpos);
+                name = title.substring(cpos+1);
+            }
+            p = new Page(this, {title: title, name: name, ns: this.namespaces_by_name[namespace].id});
             this.pages_by_title[title] = p;
             return p; 
         }
@@ -68,7 +151,8 @@ export class Page {
     }
     url () {
         // return this.wiki.apiurl.replace("api.php", "index.php")+"/"+encodeURIComponent(this.title);
-        return this.wiki.apiurl.replace("api.php", "index.php")+"/"+encodeURIComponent(this.title);
+        // return this.wiki.apiurl.replace("api.php", "index.php")+"/"+encodeURIComponent(this.title);
+        return this.wiki.wiki_title_to_url(this.title);
     }
     merge_data (node) {
         for (var key in node) {
@@ -83,50 +167,51 @@ export class Page {
         var ret = [];
         var url = this.wiki.apiurl+"?action=query&format=json&formatversion=2&prop="+pname+"&titles="+encodeURIComponent(this.title);
         while (true) {
-            var data = await fetchJsonp(url);
-            var json = await data.json();
-            // console.log("BACKLINKS.RAW", json);
-            // filter REDIRECTS + Discussion pages (ns==1)
-            if (json.query.pages[0]) {
-                var p = json.query.pages[0];
+            var data = await json(url);
+            // var json = await data.json();
+            if (data.query.pages[0]) {
+                var p = data.query.pages[0];
                 // extract any missing page info
                 if (p.ns && !this.ns) { this.ns = p.ns; }
                 if (p.pageid && !this.pageid) { this.pageid = p.pageid; }
             }
-            if (json.query.pages[0][pname]) {
-                ret.push.apply(ret, json.query.pages[0][pname]);
+            if (data.query.pages[0][pname]) {
+                ret.push.apply(ret, data.query.pages[0][pname]);
             }
-            if (!json.continue) { break; }
-            url = this.wiki.apiurl+"?action=query&format=json&formatversion=2&prop="+pname+"&"+prefix+"continue="+json.continue[prefix+"continue"]+"&titles="+encodeURIComponent(this.title);
+            if (!data.continue) { break; }
+            url = this.wiki.apiurl+"?action=query&format=json&formatversion=2&prop="+pname+"&"+prefix+"continue="+data.continue[prefix+"continue"]+"&titles="+encodeURIComponent(this.title);
         }
         ret = ret.map(x => this.wiki.page_for_object(x));
-        // console.log("get_backlinks", ret);
-        console.log("get_prop", pname, prefix, ret);
+        // console.log("get_prop", pname, prefix, ret);
         return ret;
     }
+
+    async get_list (lname, prefix, appendstr) {
+        var ret = [];
+        var baseurl = this.wiki.apiurl+"?action=query&list="+lname+"&format=json&formatversion=2&"+prefix+"title="+encodeURIComponent(this.title)+(appendstr || "");
+        var url = baseurl;
+        while (true) {
+            var data = await json(url);
+            if (data.query[lname]) {
+                ret.push.apply(ret, data.query[lname]);
+            }
+            if (!data.continue) { break; }
+            url = baseurl+"&"+prefix+"continue="+data.continue[prefix+"continue"];
+        }
+        ret = ret.map(x => this.wiki.page_for_object(x));
+        // console.log("get_prop", pname, prefix, ret);
+        return ret;
+    }
+
     async get_links () {
         return await this.get_prop("links", "pl");
     }
+
     async get_linkshere () {
         return await this.get_prop("linkshere", "lh");
     }
-    async get_list () {        
-        // http://localhost/mw/api.php?action=query&prop=links&titles=Bienvenue_%C3%A0_l%E2%80%99erg
-        var ret = [];
-        var url = this.wiki.apiurl+"?action=query&format=json&formatversion=2&list=backlinks&bltitle="+encodeURIComponent(this.title);
-        while (true) {
-            var data = await fetchJsonp(url);
-            var json = await data.json();
-            // console.log("BACKLINKS.RAW", json);
-            // filter REDIRECTS + Discussion pages (ns==1)
-            var backlinks = json.query.backlinks;
-            // backlink = backlinks.filter(x => (!x.redirect && x.ns != 1);
-            ret.push.apply(ret, backlinks);
-            if (!json.continue) { break; }
-            url = this.wiki.apiurl+"?action=query&format=json&formatversion=2&list=backlinks&blcontinue="+json.continue.blcontinue+"&bltitle="+encodeURIComponent(this.title);
-        }
-        ret = ret.map(x => this.wiki.page_for_object(x));
-        // console.log("get_backlinks", ret);
-        return ret;
+
+    async get_categorymembers () {
+        return await this.get_list("categorymembers", "cm", "&cmtype=page");
     }
 }

src/wikimap.js

@@ -1,159 +1,81 @@
 import { event, select, selectAll} from 'd3-selection';
 import { values, set, map } from 'd3-collection';
 import { drag } from 'd3-drag';
-import { zoom } from 'd3-zoom';
+import { zoom, zoomIdentity, zoomTransform } from 'd3-zoom';
 import { forceSimulation, forceLink, forceManyBody, forceCenter, forceX, forceY, forceRadial } from 'd3-force';
 import { Wiki, Page } from './wiki.js';
 import EventEmitter from 'eventemitter3';
 import { json } from 'd3-fetch';
+import { mobilecheck } from './mobilecheck.js';
 
-import { ForceNet } from './forcenet.js';
+// import { ForceNet } from './forcenet.js';
 
 export class Map {
 
-    constructor (symbols) {
+    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";
+        this.symbols_src = opts.symbols;
+        this.categorydiv = select(opts.categorydiv);
+
+        this.wiki = new Wiki(this.apiurl);
 
         this.events = new EventEmitter();
         this.active_page = null;
-        // this.nodes = {};
-        this.symbols = symbols;
-        this.net = new ForceNet(symbols);
-        this.net.on("nodeclick", this.nodeclick.bind(this));
-        // this.simulation = forceSimulation()
-        //     .velocityDecay(0.1)
-        //     .force("link", forceLink().id(d => d.title))
-        //     .force("charge", forceManyBody())
-        //     .force("radial", forceRadial(180, width/2, height/2));
-        //     // .force("center", forceCenter(width / 2, height / 2));
+        // this.symbols = symbols;
+        // this.net = new ForceNet({});
+        // this.net.on("nodeclick", this.nodeclick.bind(this));
         this.svg = null;
+        this.init_svg(opts.svg);
         this.historylinks = {};
         this.links = null;
         this.highlight_category = null;
         this.show_history = true;
+        this.loaded = false;
+        this.active_url = null;
+        this.active_page = null;
+
+        this.simulation = forceSimulation()
+            //.velocityDecay(0.1)
+            .force("link", forceLink().id(d => d.title))
+            .force("charge", forceManyBody())
+            .force("radial", forceRadial(180, width/2, height/2));
+            // .force("center", forceCenter(width / 2, height / 2));
+
+        this.all_links_by_key = {};
     }
 
-    nodeclick (d, elt) {
-        console.log("nodeclick", d, elt, this);
-        this.set_active_node(d, elt);
-    }
+    async init () {
+        this.symbols = await json(this.symbols_src);
+        await this.wiki.init();
 
-    init_svg (svg) {
-        this.net.init_svg(svg);
-    }
-
-    async load_json (source) {
-        var data = await json(source);
-        // console.log("got data!", data);
-        // index the nodes by title, init link-arity count
-        var index = {};
-        this.nodes_by_title = index;
-        for (let i=0, l=data.nodes.length; i<l; i++) {
-            let node = data.nodes[i];
-            node.count = 0;
-            index[node.title] = node;
-        }
-        this.nodes = data.nodes;
-
-        var use_links = [];
-        data.links = data.links.forEach(x => {
-            var source = index[x.source],
-                target = index[x.target];
-            if (source === undefined) {
-                console.log("bad source", x.source);
-                return;
-            }
-            if (target === undefined) {
-                console.log("bad target", x.target);
-                return;
-            }
-            source.count += 1;
-            target.count += 1;
-            use_links.push({ source: source, target: target });
-        });
-        data.links = use_links;
-        this.links = data.links;
-        // console.log("data", data);
-        // calculate the node sizes (link arity)
-        this.net.update_graph(data);
-    }
-
-    get_symbol_image_path (cname) {
-        var symbol = this.symbols[cname];
-        if (symbol) {
-            let hpos = symbol.indexOf("#"),
-                rest = symbol.substr(hpos+1);
-            rest = rest.replace(/'/g, '');
-            return "img/"+rest+".png";
-        }
-    }
-    async load_cats (src, elt) {
-        var data = await json(src);
-        
-        console.log("indexing categories by title");
-        var cats_by_title = {};
-        for (let i=0, l=data.length; i<l; i++) {
-            let cat = data[i];
-            cats_by_title[cat.title] = cat;
-            cat.pages = [];
-            cat.tcount = 0;
-        }
-        // index categories
-        console.log("indexing categories");
-        for (let key in this.nodes_by_title) {
-            let node = this.nodes_by_title[key];
-            // console.log("key", key, node.cats);
-            for (let j=0, jl=node.cats.length; j<jl; j++) {
-                let cname = node.cats[j],
-                    cat = cats_by_title[cname];
-                if (cat) {
-                    // increment the category + parents
-                    cat.pages.push(node);
-                    cat.tcount += 1
-                    while (cat.parent) {
-                        cat = cats_by_title[cat.parent];
-                        cat.tcount += 1;
-                    }
-                } else {
-                    console.log("Warning, unknown category", cname);
+        // load categories & set their page symbols
+        for (let i=0, l=this.symbols.length; i<l; i++) {
+            let sym = this.symbols[i];
+            if (sym.key === "default") {
+                let page = this.wiki.get_page_by_title("Special:AllPages");
+                sym.page = page;
+            } else {
+                let cat = this.wiki.get_page_by_title(this.categorylabel+":"+sym.key);
+                sym.page = cat;
+                cat.pages = await cat.get_categorymembers();
+                // console.log("got cat pages", cat);
+                for (let j=0, jlen=cat.pages.length; j<jlen; j++) {
+                    let cp = cat.pages[j];
+                    cp.symbol = sym.symbol;
                 }
             }
         }
-        console.log("pre filter", data.length);
-        data = data.filter(d => d.tcount > 0)
-        console.log("post filter", data.length);
-        console.log("load_cats.data", data, elt);
-        var cat = select(elt)
-            .selectAll("div.cat")
-            .data(data)
-            .enter()
-            .append("div")
-            .attr("class", "cat");
-        cat.classed("icon", d => this.get_symbol_image_path(d.title));
-        cat.append("span").attr("class", "icon").filter(d=> this.get_symbol_image_path(d.title)).style("background-image", d => "url("+this.get_symbol_image_path(d.title)+")");
-        cat.append("span").attr("class", "spacing").html(d => {
-            var d = d.depth,
-                ret = "";
-            while(d) {
-                ret += "&nbsp;&nbsp;&nbsp;&nbsp;";
-                d-=1;
-            }
-            return ret;
-        });
-        cat.append("a").attr("class", "label").html(d => d.title).attr("href", "#").on("click", d => {
-            event.preventDefault();
-            this.category_click(d);
-        })
-        cat.append("span").attr("class", "count").html(d => d.tcount)
-    }
 
-    async load_legend (src, elt) {
-        var data = await json(src);
-        console.log("load_legend", data);
-        var cat = select(elt)
+        // create the categories
+        let cat = this.categorydiv
             .selectAll("div.cat")
-            .data(data)
+            .data(this.symbols)
             .enter()
             .append("div")
             .attr("class", "cat icon");
@@ -162,94 +84,299 @@ export class Map {
             .style("background-image", d => "url("+d.icon+")");
         cat.append("a")
             .attr("class", "label")
-            .html(d => d.key)
+            .html(d => d.key === "default" ? "Page" : d.key)
             .attr("href", "#").on("click", d => {
                 event.preventDefault();
                 this.category_click(d);
             })
         cat.append("span").attr("class", "count").html(d => d.tcount)
-    }
 
-    category_click (d) {
-        console.log("category click", d);
-        if (this.highlight_category) {
-            // cleanup old pages
-            this.highlight_category.pages.forEach(d => d.highlight = false);
+        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 (window.location.hash) {
+            set_active_url_from_window();
+        } else if (this.active_url) {
+            this.set_active_url(this.active_url);
         }
-        this.highlight_category = d;
-        this.highlight_category.pages.forEach(d => d.highlight = true);
-        this.net.update_nodes();
-        // set highlight category...
-        // all nodes with this category get .highlight = true
-        // make a category index ?!
+
+        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) {
         this.events.on(message, callback, context);
     }
 
-/* OLD STYLE with node.all_links
-    walk (node, links) {
-        var links_seen = {};
-        // var node = this.ensure_node(nodename);
-        node.all_links.forEach(x => {
-            var link_key = this.link_key(node.title, x.title);
-            if (!links_seen[link_key]) {
-                links.push({source: node, target: x});
-                links_seen[link_key] = true;
-            }
-        })
-        return;
-    }
-*/
-    set_active_title (title) {
-        this.set_active_node(title);
+    async json (src) {
+        // expose d3's json method
+        return await json(src);
     }
 
-    activate_linked_nodes (page, active) {
-        // deactivate linked links/nodes
-        for (let i=0, l=this.links.length; i<l; i++) {
-            let link = this.links[i];
-            if (link.source == page || link.target == page) {
-                link.active2 = active;
-                link.source.active2 = active;
-                link.target.active2 = active;
-            }
-        }        
-    }
+    init_svg (svg) {
+        this.svg = select(svg || "svg");
+        this.zoom = zoom()
+            .scaleExtent([1 / 16, 16])
+            .on("zoom", () => {
+              this.content.attr("transform", event.transform);
+              // console.log("transform", event.transform, this.content.attr("transform"));
+            })
+            .filter(function () {
+                // console.log("filter", event);
+                if (event.touches && event.touches.length == 1) {
+                    return false;
+                }
+                return true;
+            });
 
-    async set_active_node (page) {
-        if (typeof(page) === "string") {
-             let pagename = page;
-             page = this.nodes_by_title[page];
-
-             if (!page) {
-                console.log("wikimap.set_active_node: page not found", pagename);
-             }
+        this.rect = this.svg.append("rect")
+            .attr("width", 1000)
+            .attr("height", 1000)
+            .style("fill", "none");
+        if (!mobilecheck()) {
+            this.rect.style("pointer-events", "all")
+                .call(this.zoom);            
         }
+            
+        this.content = this.svg.append("g")
+            .attr("id", "content"),
+        this.linksg = this.content.append("g")
+            .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();
+        // this.simulation.restart();
+        d.fx = d.x;
+        d.fy = d.y;
+    }
+
+    dragged (d) {
+        d.fx = event.x;
+        d.fy = event.y;
+    }
+
+    dragended(d) {
+        if (!event.active) this.simulation.alphaTarget(0);
+        d.fx = null;
+        d.fy = null;
+    }
+
+    /* Links */
+
+    link_key (p1, p2) {
+        return (p1.title < p2.title) ?
+            ("link_"+p1.title+"_"+p2.title) :
+            ("link_"+p2.title+"_"+p1.title);
+    }
+
+    make_link (p1, p2) {
+        return (p1.title < p2.title) ?
+            {source: p1, target: p2 } :
+            {source: p2, target: p1 };        
+    }
+
+    ensure_link (from_page, to_page) {
+        var lkey = this.link_key(from_page, to_page),
+            ret = this.all_links_by_key[lkey];
+        if (ret === undefined) {
+            ret = this.make_link(from_page, to_page);
+            this.all_links_by_key[lkey] = ret;
+        }
+        return ret;
+    }
+
+    // function called on iframe load
+    async set_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);
+            }
+        }
+    }
+
+    linked_nodes_set_active (page, active) {
+        // deactivate linked links/nodes
+        for (var key in this.all_links_by_key) {
+            if (this.all_links_by_key.hasOwnProperty(key)) {
+                var link = this.all_links_by_key[key];
+                if (link.source == page || link.target == page) {
+                    link.active2 = active;
+                    link.source.active2 = active;
+                    link.target.active2 = active;
+                }
+            }
+        }
+    }
+
+    clear_highlight_category () {
+        if (this.highlight_category) {
+            // cleanup old pages
+            this.highlight_category.highlight = false;
+            this.highlight_category.pages.forEach(d => d.highlight = false);
+        }
+        if (this.active_page == this.highlight_category) {
+            this.active_page = null;
+        }
+        this.highlight_category = null;
+        this.categorydiv
+            .selectAll("div.cat")
+            .classed("highlight", d=> d.page ? d.page.highlight : false);
+        var data = {nodes: this.get_nodes(), links: values(this.all_links_by_key)};
+        this.update_node_counts()
+        this.update_graph(data);
+    }
+
+    get_nodes () {
+        var nodes = this.wiki.get_nodes();
+        nodes = nodes.filter(d => d.linked || d.active || d.active2 || d.highlight);
+        return nodes;
+    }
+
+    async set_active_page (page) {
+        console.log("wikimap: set_active_page:", page);
         if (page === this.active_page) {
             // 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.activate_linked_nodes(this.active_page, false);
-            // ENSURE HISTORY LINK TO PREVIOUS NODE AND CURRENT
-            var lkey = this.net.link_key(this.active_page.title, page.title),
-                 source = (this.active_page.title < page.title) ? this.active_page : page,
-                 target = (this.active_page.title < page.title) ? page : this.active_page;
-            this.historylinks[lkey] = {source: source, target: target, type:"history"};
+            this.linked_nodes_set_active(this.active_page, false);
+            // ENSURE (HISTORY) LINK TO PREVIOUS NODE AND CURRENT
+            //var link = this.ensure_link(this.active_page, page);
+            // link.visited = true;
         }
-        
+
+        if (page.ns == 14) {
+            this.active_page = page;
+            if (!page.pages) {
+                page.pages = await page.get_categorymembers();
+            }
+            if (this.highlight_category) {
+                // cleanup old pages
+                this.highlight_category.highlight = false;
+                this.highlight_category.pages.forEach(d => d.highlight = false);
+            }
+            this.highlight_category = page;
+            this.highlight_category.highlight = true;
+            this.highlight_category.pages.forEach(d => d.highlight = true);
+            // this.update_nodes();
+
+            this.categorydiv
+                .selectAll("div.cat")
+                .classed("highlight", d=> d.page ? d.page.highlight : false);
+            // repetition of below... (could be improved)
+            // this.events.emit("page", this.active_page);
+            // var data = {nodes: this.wiki.get_nodes(), links: values(this.all_links_by_key)};
+            // this.update_node_counts()
+            // this.update_graph(data);
+
+            // return;
+        } else if (page.ns !== 0) {
+            console.log("SPECIAL PAGE", page);
+
+        } else {
+            // 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);
+            var links_in = await page.get_linkshere();
+            links_in = links_in.filter(p => (!p.redirect && p.ns == 0));
+            // console.log("links_in", links_in);
+            links_out.forEach(p => {
+                this.ensure_link(page, p).wiki = true;
+            });
+            links_in.forEach(p => {
+                this.ensure_link(p, page).wiki = true;
+            });
+
+        }
+
         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.activate_linked_nodes(this.active_page, true);
+        this.linked_nodes_set_active(this.active_page, true);
+        
+        //setTimeout(() => {
+        this.centerOnItem(page, 1000);
+        //}, 1000);
 
-        this.events.emit("page", this.active_page.title);
+        this.events.emit("page", this.active_page);
+        var data = {nodes: this.get_nodes(), links: values(this.all_links_by_key)};
+        this.update_node_counts()
+        this.update_graph(data);
+        // this.update_nodes();
+        // this.update_forces();
+    }
 
-        this.net.update_nodes();
-        this.net.update_forces();
+    update_node_counts () {
+        var nodes = this.wiki.get_nodes();
+        for (let i=0, len=nodes.length; i<len; i++) {
+            nodes[i].count = 0;
+        }
+        for (var key in this.all_links_by_key) {
+            if (this.all_links_by_key.hasOwnProperty(key)) {
+                var link = this.all_links_by_key[key];
+                link.source.count += 1;
+                link.target.count += 1;
+            }
+        }
+    }
+
+    category_click (d) {
+        console.log("category click", d);
+        if (d.page) {
+            if (this.highlight_category == d.page) {
+                this.clear_highlight_category();
+            } else {
+                this.set_active_page(d.page);
+            }
+        }
     }
 
     set_show_history (value) {
@@ -263,44 +390,207 @@ export class Map {
                 for (var key in this.historylinks) {
                     graph.links.push(this.historylinks[key])
                 }
-                this.net.update_graph(graph);
+                this.update_graph(graph);
             } else {
                 let graph = {};
                 graph.nodes = this.nodes;
                 graph.links = this.links;
-                this.net.update_graph(graph);
+                this.update_graph(graph);
             }
         }
     }
-/*
-    async load (page) {
-        console.log("loading", page.title);
-        var links = await page.get_links(),
-            backlinks = await page.get_linkshere(),
-            alllinks = this.wiki.union(links, backlinks);
 
-        page.all_links = alllinks;
-        // console.log("alllinks", alllinks);
-        var graph = {};
+    update_graph (graph) {
+        // 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()
+            .append("line");
 
-        graph.nodes = values(this.wiki.pages_by_title);
-        graph.links = [];
-        this.walk(page, graph.links);
-        // activate historylinks
-        values(this.historylinks).forEach(x => {
-            graph.links.push(x);
-        })
-        // graph.links = titles.map(t => ({source: pagetitle, target: t}));
-        this.update_graph(graph);
-        // console.log("GOT DATA", titles);
-        // return titles;
+        link.exit().each(d => {
+            d.source.linked = false;
+            d.target.linked = false;
+        }).remove();
+        
+        link_enter.merge(link).each(d => {
+                d.source.linked = true;
+                d.target.linked = true;
+            });
+
+        var node = this.nodesg
+            .selectAll("g.page")
+            .data(graph.nodes, function (d) { return d.title });
+        
+        node.exit().remove();
+
+        var that = this;
+        var node_enter = node.enter().append("g")
+            .attr("class", "page")
+            // .attr("class", d=>"page "+this.wiki.get_ns_classname(d.ns))
+            .on("click", d => {
+                // that.events.emit("nodeclick", d, this);
+                this.set_active_page(d);
+                // this.set_active_node(d.title);
+            })
+            .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))
+                .on("drag", this.dragged.bind(this))
+                .on("end", this.dragended.bind(this)));
+
+
+        node_enter.append("use")
+            .attr("xlink:href", d => d.symbol || "symbols.svg#Main")
+            .attr("class", "testcolor");
+
+            // {
+            //     for (var i=0, l=d.cats.length; i<l; i++) {
+            //         if (this.symbols[d.cats[i]]) {
+            //             return this.symbols[d.cats[i]];
+            //         }
+            //     }
+            //     return this.symbols.default || "default";
+            // });
+
+        // node_enter.append("circle")
+        //     .attr("r", 6);
+
+        node_enter.append("text")
+            .text(d => d.title)
+            .attr("x", 10);
+
+        //node_enter.append("title")
+        //   .text(function(d) { return d.title; });
+
+        node = node_enter.merge(node);
+        link = link_enter.merge(link);
+
+        node.classed("active", d=>d.active);
+
+
+        this.simulation
+            .nodes(graph.nodes)
+            .on("tick", ticked);
+
+        this.simulation.force("link")
+            .links(graph.links);
+
+        this.simulation.force("radial").radius(d => (d.linked || d.highlight) ? null : 200);
+
+        function ticked() {
+            link
+                .attr("x1", function(d) { return d.source.x; })
+                .attr("y1", function(d) { return d.source.y; })
+                .attr("x2", function(d) { return d.target.x; })
+                .attr("y2", function(d) { return d.target.y; });
+
+            // node
+            //     .attr("cx", function(d) { return d.x; })
+            //     .attr("cy", function(d) { return d.y; });
+            node
+                .attr("transform", d => `translate(${d.x},${d.y})`);
+        }
+
+        // document.querySelector("#page").style.background = "purple";
+        // return;
+
+        this.update_nodes();
+        this.update_forces();
+        // this.simulation.alphaTarget(0.3).restart();
+    }
+
+    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.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");
+        links.classed("active2", d=>d.active2);        
+        links.classed("history", d=>d.type == "history");        
+        links.sort((a, b) => {
+            // console.log("sort", a, b);
+            var x = a.active2 ? 10 : (a.history ? 5 : 0),
+                y = b.active2 ? 10 : (b.history ? 5 : 0);
+            return x - y; 
+        });
+    }
+
+    update_forces () {
+        var force = this.simulation.force("link");
+        // console.log("update_forces:force", force);
+        this.simulation.force("link").strength(d => {
+            if (d.source.active || d.target.active) {
+                return 1;
+            } else {
+                // same as d3.force's defaultStrength
+                return 0.5 * (1 / Math.min(d.source.count, d.target.count)); 
+            }
+        });
+        // this.simulation.alphaTarget(0.3).restart();
+        this.simulation.alpha(0.5).restart();
+    }
+
+    centerOnItem(item, duration) {
+        var bounds = this.svg.node().getBoundingClientRect();
+        var curt = zoomTransform(this.rect.node());
+        // 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)
+                    .scale(zoom_level)
+                    .translate(-item.x, -item.y);
+            };
+            if (duration) {
+                this.rect.transition().duration(duration).call(this.zoom.transform, transform);
+            } else {    
+                this.rect.call(this.zoom.transform, transform);
+            }
+            */
+        } else {
+            console.log("NO ITEM");
+            var transform = function () {
+                return zoomIdentity
+                    .scale(1);
+            };
+            this.rect.call(this.zoom.transform, transform);
+        }
+    }
+
+    do_zoom (f, transition) {
+        this.rect.call(this.zoom.scaleBy, f);
+    }
+
+    zoom_in () {
+        this.do_zoom(1.25);
+    }
+
+    zoom_out () {
+        this.do_zoom(1/1.25);
     }
-*/
 }
 
-
-
-// http://erg.activearchives.org/mw/api.php?action=query&prop=links&titles=Bienvenue_%C3%A0_l%E2%80%99erg
-// http://erg.activearchives.org/w/api.php?action=query&prop=info&titles=Main%20Page
-// Bienvenue_à_l’erg
-// http://erg.activearchives.org/mw/index.php/Bienvenue_%C3%A0_l%E2%80%99erg

style.00.css

@@ -0,0 +1,315 @@
+/* F O N T E S */
+@font-face {
+    font-family: "Combined";
+    src: url('/typo/Combined/combined.otf');  
+    font-style:   normal;
+    font-weight:  normal;
+}
+
+@font-face {
+    font-family: 'combinedregular';
+    src: url('/typo/Combined/web/combined.eot');
+    src: url('/typo/Combined/web/combined.eot?#iefix') format('embedded-opentype'),
+         url('/typo/Combined/web/combined.woff2') format('woff2'),
+         url('/typo/Combined/web/combined.woff') format('woff'),
+         url('/typo/Combined/web/combined.ttf') format('truetype'),
+         url('/typo/Combined/web/combined.svg#combinedregular') format('svg');
+    font-weight: normal;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: 'wremena';
+    src: url('typo/Wremema/webfont/wremena_bold-webfont.woff2') format('woff2'),
+         url('typo/Wremema/webfont/wremena_bold-webfont.woff') format('woff'),
+         url('typo/Wremema/webfont/wremena_bold-webfont.ttf') format('truetype'),
+         url('typo/Wremema/webfont/wremena_bold-webfont.svg#wremenabold') format('svg');
+    font-weight: bold;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: 'wremena';
+    src: url('typo/Wremema/webfont/wremena_regular-webfont.woff2') format('woff2'),
+         url('typo/Wremema/webfont/wremena_regular-webfont.woff') format('woff'),
+         url('typo/Wremema/webfont/wremena_regular-webfont.ttf') format('truetype'),
+         url('typo/Wremema/webfont/wremena_regular-webfont.svg#wremenaregular') format('svg');
+    font-weight: normal;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: 'wremena';
+    src: url('typo/Wremema/webfont/wremena_light-webfont.woff2') format('woff2'),
+         url('typo/Wremema/webfont/wremena_light-webfont.woff') format('woff'),
+         url('typo/Wremema/webfont/wremena_light-webfont.ttf') format('truetype'),
+         url('typo/Wremema/webfont/wremena_light-webfont.svg#wremenalight') format('svg');
+    font-weight: normal;
+    font-style: 200;
+}
+
+@font-face {
+  font-family: 'Coupeur Monospace Bold';
+  src: url('/typo/Coupeur/webfont/CoupeurMonospace-Bold.eot'); /* IE9 Compat Modes */
+  src: url('/typo/Coupeur/webfont/CoupeurMonospace-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
+       url('/typo/Coupeur/webfont/CoupeurMonospace-Bold.woff') format('woff'), /* Modern Browsers */
+       url('/typo/Coupeur/webfont/CoupeurMonospace-Bold.ttf')  format('truetype'), /* Safari, Android, iOS */
+       url('/typo/Coupeur/webfont/CoupeurMonospace-Bold.svg#fcf36b8f65c0f0737cd36a2be6922659') format('svg'); /* Legacy iOS */
+       
+  font-style:   normal;
+  font-weight:  700;
+}
+
+@font-face {
+  font-family: 'Coupeur Monospace Normal';
+  src: url('/typo/Coupeur/webfont/CoupeurMonospace-Normal.eot'); /* IE9 Compat Modes */
+  src: url('/typo/Coupeur/webfont/CoupeurMonospace-Normal.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
+       url('/typo/Coupeur/webfont/CoupeurMonospace-Normal.woff') format('woff'), /* Modern Browsers */
+       url('/typo/Coupeur/webfont/CoupeurMonospace-Normal.ttf')  format('truetype'), /* Safari, Android, iOS */
+       url('/typo/Coupeur/webfont/CoupeurMonospace-Normal.svg#4b219f539d302a6ffd9fd41e2da16172') format('svg'); /* Legacy iOS */
+       
+  font-style:   normal;
+  font-weight:  400;
+}
+
+
+
+body {
+    margin: 0;
+    padding: 0;
+    background: #f1f2f3;
+    overflow: hidden;
+}
+
+
+.links line {
+  /*stroke: #aaa;*/
+  stroke: none;
+}
+
+.links line.active2 {
+    stroke: red;
+}
+
+.links line.history {
+    stroke: purple;
+}
+
+.active {
+    stroke: red;
+}
+
+.category circle {
+    fill: yellow;
+}
+
+.web circle {
+    fill: purple;
+}
+
+.news circle {
+    fill: lightgray;
+}
+
+.template circle {
+    fill: lightgreen;
+}
+
+.discussion circle {
+    fill: aqua;
+}
+
+
+
+svg {
+    position: absolute;
+    left: 0; top: 0; right: 0; bottom: 0;
+    font: 10px sans-serif;
+}
+
+svg g.page {
+    cursor: pointer;
+}
+
+svg g.page text {
+    visibility: hidden;
+    fill: #222;
+    font: 10px sans-serif;
+}
+
+svg g.active text {
+    visibility: visible;
+}
+
+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;
+}
+#cats .ocontents {
+    background: #FFFFFFDD;
+    display: none;
+    /*padding: 5px;*/
+    /*box-sizing: border-box;*/
+}
+#cats.expanded .ocontents {
+    display: block;
+}
+
+/* showall class */
+#cats div.cat {
+    display: none;
+}
+#cats div.cat span.spacing {
+    display: none;
+}
+#cats div.cat.icon {
+    display: block;
+}
+#cats.showall div.cat {
+    display: block;
+}
+#cats.showall div.cat span.spacing {
+    display: inline;
+}
+
+#cats .contents {
+    overflow: auto;
+    height: 50vh;
+    min-width: 300px;
+}
+#cats .contents .scroll {}
+
+#cats .botright {
+    position: absolute;
+    right: 0;
+    bottom: 0;
+}
+
+#cats .botright .thumb {
+    position: absolute;
+    left: 0;
+    bottom: 0;
+    width: 32px;
+    height: 32px;
+    background: #FFFFFFDD;
+}
+#cats div.cat span.icon {
+    position: relative;
+    top: 4px;
+    display: inline-block;
+    width: 18px;
+    height: 18px;
+    background-repeat: no-repeat;
+    margin-right: 4px;
+}
+#cats div.cat span.count {
+    padding: 0px 3px;
+    background: #DDD;
+    color: #444;
+    font-size: 10px;
+    margin-left: 4px;
+}
+#cats div.cat a {
+    color: black;
+    text-decoration: none;
+}
+
+
+
+
+#page {
+    position: absolute;
+    left: 0; right: 0; top: 0;
+    height: 160vh;
+    text-align: center;
+}
+#page.touched {
+    background: #444;
+}
+#bottompane {
+    position: absolute;
+    top: 60vh;
+    left: 0; right: 0;
+    height: 100vh;
+    z-index: 2;
+}
+#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;
+}

style.css

@@ -1,86 +1,133 @@
-/* F O N T E S */
+/* ------- F O N T E S ------- */
 @font-face {
     font-family: "Combined";
-    src: url('/typo/Combined/combined.otf');  
+    src: url('/mw/skins/foreground/assets/fonts/combined.otf');  
     font-style:   normal;
     font-weight:  normal;
 }
 
 @font-face {
-    font-family: 'combinedregular';
-    src: url('/typo/Combined/web/combined.eot');
-    src: url('/typo/Combined/web/combined.eot?#iefix') format('embedded-opentype'),
-         url('/typo/Combined/web/combined.woff2') format('woff2'),
-         url('/typo/Combined/web/combined.woff') format('woff'),
-         url('/typo/Combined/web/combined.ttf') format('truetype'),
-         url('/typo/Combined/web/combined.svg#combinedregular') format('svg');
-    font-weight: normal;
-    font-style: normal;
+    font-family: "Vega";
+    src: url('/mw/skins/foreground/assets/fonts/Vega-Regular.otf');  
+    src: url('/mw/skins/foreground/assets/fonts/Vega-Regular.ttf') format("truetype");  
+    src: url("/mw/skins/foreground/assets/fonts/Vega-Regular-Webfont.svg") format("svg");
+    src: url("/mw/skins/foreground/assets/fonts/Vega-Regular.woff") format("woff");
+    src: url("/mw/skins/foreground/assets/fonts/Vega-Regular.woff2") format("woff2");
+    font-style:   normal;
+    font-weight:  normal;
 }
 
 @font-face {
-    font-family: 'wremena';
-    src: url('typo/Wremema/webfont/wremena_bold-webfont.woff2') format('woff2'),
-         url('typo/Wremema/webfont/wremena_bold-webfont.woff') format('woff'),
-         url('typo/Wremema/webfont/wremena_bold-webfont.ttf') format('truetype'),
-         url('typo/Wremema/webfont/wremena_bold-webfont.svg#wremenabold') format('svg');
-    font-weight: bold;
-    font-style: normal;
+font-family: Lucette;
+src: url("/mw/skins/foreground/assets/fonts/LUCETTE/font/otf/Lucette-Regular.otf");
+src: url("/mw/skins/foreground/assets/fonts/LUCETTE/font/ttf/Lucette-Regular.ttf");
+src: url("/mw/skins/foreground/assets/fonts/LUCETTE/font/woff/Lucette-Regular.woff");
+src: url("/mw/skins/foreground/assets/fonts/LUCETTE/font/woff2/Lucette-Regular.woff2");
 }
 
 @font-face {
-    font-family: 'wremena';
-    src: url('typo/Wremema/webfont/wremena_regular-webfont.woff2') format('woff2'),
-         url('typo/Wremema/webfont/wremena_regular-webfont.woff') format('woff'),
-         url('typo/Wremema/webfont/wremena_regular-webfont.ttf') format('truetype'),
-         url('typo/Wremema/webfont/wremena_regular-webfont.svg#wremenaregular') format('svg');
-    font-weight: normal;
-    font-style: normal;
+font-family: Lucette;
+src: url("/mw/skins/foreground/assets/fonts/LUCETTE/font/otf/Lucette-Regularitalic.otf");
+src: url("/mw/skins/foreground/assets/fonts/LUCETTE/font/ttf/Lucette-Regularitalic.ttf");
+src: url("/mw/skins/foreground/assets/fonts/LUCETTE/font/woff/Lucette-Regularitalic.woff");
+src: url("/mw/skins/foreground/assets/fonts/LUCETTE/font/woff2/Lucette-Regularitalic.woff2");
+font-style: italic;
 }
 
 @font-face {
-    font-family: 'wremena';
-    src: url('typo/Wremema/webfont/wremena_light-webfont.woff2') format('woff2'),
-         url('typo/Wremema/webfont/wremena_light-webfont.woff') format('woff'),
-         url('typo/Wremema/webfont/wremena_light-webfont.ttf') format('truetype'),
-         url('typo/Wremema/webfont/wremena_light-webfont.svg#wremenalight') format('svg');
-    font-weight: normal;
-    font-style: 200;
+ font-family:'FontAwesome';
+ src:url(/mw/skins/foreground/assets/fonts/fontawesome-webfont.eot?32400);
+ src:url(/mw/skins/foreground/assets/fonts/fontawesome-webfont.eot?32400) format('embedded-opentype'),url(/mw/skins/foreground/assets/fonts/fontawesome-webfont.woff2?db812) format('woff2'),url(/mw/skins/foreground/assets/fonts/fontawesome-webfont.woff?a3572) format('woff'),url(/mw/skins/foreground/assets/fonts/fontawesome-webfont.ttf?a3de2) format('truetype'),url(/mw/skins/foreground/assets/fonts/fontawesome-webfont.svg?f775f) format('svg');
+ font-weight:normal;
+ font-style:normal
 }
 
-@font-face {
-  font-family: 'Coupeur Monospace Bold';
-  src: url('/typo/Coupeur/webfont/CoupeurMonospace-Bold.eot'); /* IE9 Compat Modes */
-  src: url('/typo/Coupeur/webfont/CoupeurMonospace-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
-       url('/typo/Coupeur/webfont/CoupeurMonospace-Bold.woff') format('woff'), /* Modern Browsers */
-       url('/typo/Coupeur/webfont/CoupeurMonospace-Bold.ttf')  format('truetype'), /* Safari, Android, iOS */
-       url('/typo/Coupeur/webfont/CoupeurMonospace-Bold.svg#fcf36b8f65c0f0737cd36a2be6922659') format('svg'); /* Legacy iOS */
-       
-  font-style:   normal;
-  font-weight:  700;
+/* Global variables. */
+:root,
+::backdrop {
+  /* Set sans-serif & mono fonts */
+  --sans-font: -apple-system, BlinkMacSystemFont, "Avenir Next", Avenir,
+    "Nimbus Sans L", Roboto, "Noto Sans", "Segoe UI", Arial, Helvetica,
+    "Helvetica Neue", sans-serif;
+  --mono-font: Consolas, Menlo, Monaco, "Andale Mono", "Ubuntu Mono", monospace;
+  --standard-border-radius: 5px;
+
+  /* Default (light) theme */
+  --bg: #fff;
+  --accent-bg: #f5f7ff;
+  --text: #212121;
+  --text-light: #585858;
+  --border: #898EA4;
+  --accent: #0d47a1;
+  --accent-hover: #1266e2;
+  --accent-text: var(--bg);
+  --code: #d81b60;
+  --preformatted: #444;
+  --marked: #ffdd33;
+  --disabled: #efefef;
+
+    --font-title: Giskith;
+    --font-body: Lucette;
+    --color-a: #a700ff; /* purple */
+    --color-b: #00ab6b; /* green */
+    --font-size: 23px;
+    --line-height: 1.3em;
+    --color-a-shadow: rgba(166, 0, 255, 0.44);
 }
 
-@font-face {
-  font-family: 'Coupeur Monospace Normal';
-  src: url('/typo/Coupeur/webfont/CoupeurMonospace-Normal.eot'); /* IE9 Compat Modes */
-  src: url('/typo/Coupeur/webfont/CoupeurMonospace-Normal.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
-       url('/typo/Coupeur/webfont/CoupeurMonospace-Normal.woff') format('woff'), /* Modern Browsers */
-       url('/typo/Coupeur/webfont/CoupeurMonospace-Normal.ttf')  format('truetype'), /* Safari, Android, iOS */
-       url('/typo/Coupeur/webfont/CoupeurMonospace-Normal.svg#4b219f539d302a6ffd9fd41e2da16172') format('svg'); /* Legacy iOS */
-       
-  font-style:   normal;
-  font-weight:  400;
+/* Dark theme */
+@media (prefers-color-scheme: dark) {
+  :root,
+  ::backdrop {
+    color-scheme: dark;
+    --bg: #222;
+    --accent-bg: #2b2b2b;
+    --text: #dcdcdc;
+    --text-light: #ababab;
+    --accent: #ffb300;
+    --accent-hover: #ffe099;
+    --accent-text: var(--bg);
+    --code: #f06292;
+    --preformatted: #ccc;
+    --disabled: #111;
+
+--font-title: Giskith;
+--font-body: Lucette;
+--color-a: #9557b5; /* washed-off purple */
+--color-b: #3c856b; /* washed-off green */
+--font-size: 23px;
+--line-height: 1.3em;
+  }
 }
 
-
-
 body {
     margin: 0;
     padding: 0;
-    background: #f1f2f3;
-    /*overflow: hidden;*/
+    background: var(--bg);
+    overflow: hidden;
+    font-family: Vega;
 }
 
+div#handle {
+    position: absolute;
+    bottom: -3em;
+    width: 70%;
+    height: 5em;
+    background-color: transparent;
+    left: 5em;
+}
+/* change la taille des cercle dans le svg */
+/*circle {
+transform: scale(0.8);
+}
+
+path {
+transform: scale(0.8);
+} */
+
+circle.active{
+transform: scale(0.5);
+}
 
 .links line {
   stroke: #aaa;
@@ -88,7 +135,7 @@ body {
 }
 
 .links line.active2 {
-    stroke: red;
+    stroke: var(--color-a);
 }
 
 .links line.history {
@@ -96,11 +143,11 @@ body {
 }
 
 .active {
-    stroke: red;
+    stroke: var(--color-a);
 }
 
 .category circle {
-    fill: yellow;
+    fill: var(--color-b);
 }
 
 .web circle {
@@ -119,30 +166,50 @@ body {
     fill: aqua;
 }
 
-
+/* ------- param<61>tre de la carte ------- */
 
 svg {
     position: absolute;
     left: 0; top: 0; right: 0; bottom: 0;
     font: 10px sans-serif;
+    /* C'est bon j'ai trouve, c'est ce tranform qui change la taille de l'affichage de la carte*/
+    transform: scale(1.5);
+}
+
+@media only screen and (max-width: 320px) {
+#cats,
+svg {
+    zoom: 0.5;
+    transform: scale(1);
+}
 }
 
 svg g.page {
     cursor: pointer;
 }
 
+ /* texte des noeud */
 svg g.page text {
     visibility: hidden;
-    fill: #222;
-    font: 12px sans-serif;
+    fill: var(--color-a);
+    font: 10px Combined;
+    max-width: 20%;
 }
 
 svg g.active text {
-    visibility: visible;
+    /*visibility: visible;*/
 }
 
+svg g.mouse use {
+    fill: var(--color-a);
+    stroke: var(--color-a);
+}
 svg g.mouse text {
     visibility: visible;
+    stroke-width: 1.5px;
+    stroke: white;
+    paint-order: stroke;
+
 }
 
 use {
@@ -150,85 +217,112 @@ use {
     stroke: black;
 }
 
+.highlight use {
+    fill: #FFF;
+    stroke: var(--color-b);
+}
+
+.active use {
+/*  animation-transform: 2;*/
+  animation-duration: 2s;
+  animation-name: pulse;
+  animation-iteration-count: infinite;
+}
+
+@keyframes pulse {
+  0% {
+    transform: scale(1, 1);
+  }
+  50% {
+    transform: scale(1.5, 1.5);
+  }
+  100% {
+    transform: scale(1, 1);
+  }
+}
+
 .active use {
     fill: #FFF;
-    stroke: red;
+    stroke: var(--color-b) !important;
 }
 
 .active text {
-    stroke: black;
+    stroke: var(--bg);
+    stroke-width: 1px;
+    paint-order: stroke;
+    fill: var(--color-b) !important;
+    visibility: visible !important;
+    transform: translate(-20px, 20px);
 }
 
 .active2 use {
     fill: #FFF;
-    stroke: red;
-}
-
-.highlight use {
-    fill: #FFF;
-    stroke: orange;
+    stroke: var(--color-a);
 }
 
 
-/* Categories */
-#cats .head {
+
+/* --------- Categories ------- */
+
+@media only screen and (max-width: 600px) {
+	#page {
+		display:none;
+	}
+	#wikiframediv {
+		right:0;
+		top:0;
+	}
+
+		#cats .body {
+		  display: none;
+		}
+		#cats.expanded .placeholder {
+		  display: block;
+		}
+}
+
+#cats .placeholder {
+  min-width: 100%;
+  text-align: center;
+  position: relative;
+  top: 3px;
+}
+#cats.expanded .body {
+  display: block;
+}
+
+#cats.expanded .placeholder {
   display: none;
 }
+#cats.expanded .placeholder:hover {
+	color: var(--color-b);
+}
+#cats.expanded .placeholder:before {
+    content: "×";
+    font-size: 17px;
+    cursor: pointer;
+}
+#cats .placeholder:before {
+    content: "?";
+    font-size: 12px;
+    cursor: pointer;
+}
+
 #cats {
-    display: none;
+    /*display: none;*/
     position: absolute;
     left: 10px;
     bottom: 10px;
-}
-#cats .ocontents {
-    background: #FFFFFFFF;
-    display: none;
-    border-radius: 30px;
-    /*padding: 5px;*/
-    /*box-sizing: border-box;*/
-}
-#cats.expanded .ocontents {
-    display: block;
+    background: white; 
+    color: black;
+    border-radius: 24px;
+    padding: 10px;
+    font-size: 12px;
+    min-width: 16px;
+    min-height: 16px;
+    box-shadow: 0 3px 3px 3px var(--color-a-shadow);
 }
 
-/* showall class */
-#cats div.cat {
-    display: none;
-}
-#cats div.cat span.spacing {
-    display: none;
-}
-#cats div.cat.icon {
-    display: block;
-}
-#cats.showall div.cat {
-    display: block;
-}
-#cats.showall div.cat span.spacing {
-    display: inline;
-}
-
-#cats .contents {
-    overflow: auto;
-    height: 50vh;
-    min-width: 300px;
-}
-#cats .contents .scroll {}
-
-#cats .botright {
-    position: absolute;
-    right: 0;
-    bottom: 0;
-}
-
-#cats .botright .thumb {
-    position: absolute;
-    left: 0;
-    bottom: 0;
-    width: 32px;
-    height: 32px;
-    background: #FFFFFFDD;
-}
 #cats div.cat span.icon {
     position: relative;
     top: 4px;
@@ -237,88 +331,58 @@ use {
     height: 18px;
     background-repeat: no-repeat;
     margin-right: 4px;
+    background-position: center center;
+    background-size: contain;
+}
+#cats div.cat:last-child span.icon {
+    background-size: 50%;
 }
 #cats div.cat span.count {
+  display: none;
     padding: 0px 3px;
     background: #DDD;
     color: #444;
-    font-size: 10px;
+    font-size: 12px;
     margin-left: 4px;
 }
 #cats div.cat a {
     color: black;
     text-decoration: none;
 }
-
-
+#cats div.cat.highlight span.icon {
+    background-color: var(--color-b);
+    background-blend-mode: screen;
+}
+#cats div.cat a:hover,
+#cats div.cat.highlight a {
+    color: var(--color-b);
+}
+#cats hr {
+  color: white;
+}
 
 
 #page {
-    position: absolute;
-    left: 0; right: 0; top: 0;
-    height: 160vh;
-    text-align: center;
+  position: absolute;
+  left: 65%; 
+  right:0;
+  top: 0;
+  bottom: 0;
 }
-#page.touched {
-    background: #444;
-}
-#bottompane {
-    position: absolute;
-    top: 60vh;
-    left: 0; right: 0;
-    height: 100vh;
-    z-index: 2;
-}
-#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;
+    left: 0; top: 0;
+    right: 35%; 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
+#wikiframediv iframe {
+  width: 100%;
+  height: 100%;
+  border: none;
 }
 
-#searchinput { 
-    min-width: 220px;
-    font-family: "combinedregular";
-    font-size: 11px;
-}
-#menubar {
-    text-align: center;
-}
-#menubar img {
-    position: relative;
-    top: 10px;
-}
+/* ------- MEDIAWIKI PAGE ------- */
 
-
-/* MEDIAWIKI PAGE */
 .header-container {
   display: none !important;
 }
@@ -326,9 +390,199 @@ use {
 iframe form.header {
   display: none;
 }
-ul#page-actions {
+/*ul#page-actions {
   display: none;
 }
+*/
 a.talk {
   display:none;
-}
+}
+
+
+/* ------- control positioning ------- */
+
+.leaflet-control {
+  position: relative;
+  z-index: 800;
+  pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */
+  pointer-events: auto;
+  font-size: 12px;
+}
+.leaflet-control {
+  float: left;
+  clear: both;
+  }
+
+/* ------- general toolbar styles ------- */
+
+.leaflet-bar {
+  box-shadow: 0 1px 5px rgba(0,0,0,0.65);
+}
+.leaflet-bar a,
+.leaflet-bar a:hover {
+  background-color: #fff;
+  border-bottom: 1px solid #ccc;
+  width: 26px;
+  height: 26px;
+  line-height: 26px;
+  display: block;
+  text-align: center;
+  text-decoration: none;
+  color: black;
+  }
+.leaflet-bar a,
+.leaflet-control-layers-toggle {
+  background-position: 50% 50%;
+  background-repeat: no-repeat;
+  display: block;
+}
+.leaflet-bar a:hover {
+  background-color: #f4f4f4;
+  }
+.leaflet-bar a:first-child:before {
+      content: " ";
+      height: 2px;
+      display: block;
+      }
+.leaflet-bar a:last-child {
+  border-bottom: none;
+  }
+.leaflet-bar a.leaflet-disabled {
+  cursor: default;
+  background-color: #f4f4f4;
+  color: #bbb;
+  }
+
+
+/* ------- zoom controls -------- */
+
+.zoom-controls {
+  position: absolute;
+  /* changed from left top to bottom right */
+  right: 10px;
+  bottom: 10px;
+  z-index: 10;
+}
+
+#specialclosediv {
+  position: absolute;
+  left: 25px;
+  top: 10px;
+  z-index: 10000;
+  box-shadow: 0 3px 3px 3px var(--color-a-shadow);
+  background-color: #ffffff;
+  display: none;
+}
+#specialclosediv a, #specialclosediv a:hover {
+  font-size: 24px;
+  background-color: #fff;
+  border-bottom: 1px solid #ccc;
+  width: 26px;
+  height: 26px;
+  display: block;
+  text-align: center;
+  text-decoration: none;
+  color: black;
+}
+
+
+.leaflet-control-zoom-in,
+.leaflet-control-zoom-out {
+  font: Combined;
+  font-size: 17px;
+  line-height: 20px;
+  text-indent: 1px;
+  box-shadow: 0 3px 3px 3px var(--color-a-shadow);
+  background-color: #ffffff;
+}
+
+@media only screen and (max-width: 600px) {
+#cats,
+svg {
+    zoom: 0.5;
+    transform: scale(1);
+}
+  body {
+    overflow: auto;
+  }
+
+  #container {
+    position: absolute;
+    left: 0; top: 0;
+    right: 0;
+    height: 150vh;
+  }
+
+  #page {
+	  display:none;
+    position: absolute;
+    left: 0; top: 0;
+    height: 50vh;
+      width: 100vw;
+      z-index: 10000;
+  }
+
+  #wikiframediv {
+      position: absolute;
+      left: 0; top: 0;
+      height: 100vh;
+      width: 100vw;
+  }
+
+}
+
+/* ------- Menu d<>pliant ------- */
+.button-style {
+  box-shadow: 0 3px 3px 3px var(--color-a-shadow);
+  background-color: white;
+  font-family: Vega;
+  font-size: 12px;
+  padding: 6px 2px;
+  cursor: pointer;
+  color: black;
+
+    border-radius: 24px;
+}
+
+a.button-style {
+	padding:8px;
+	text-decoration:none;
+}
+
+
+
+#specialselectdiv {
+  position: absolute;
+  /* changement des valeur sde bottom right a top left*/
+  top: 8px;
+  left: 25px;
+  z-index: 10000;
+  background: white;
+  }
+  
+#specialselectdiv select {
+  box-shadow: 0 3px 3px 3px var(--color-a-shadow);
+  background-color: white;
+  font-family: Vega;
+  font-size: 12px;
+  padding: 6px 2px;
+  text-transform: uppercase;
+  cursor: pointer;
+  color: black;
+}
+
+
+#specialiframediv {
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  display: none;
+  z-index: 100;
+}
+#specialiframediv iframe {
+  width: 100%;
+  height: 100%;
+  border: none;
+}

style.custom_map.css

@@ -0,0 +1,38 @@
+#page {  
+    left:40%;  
+}  
+      
+#wikiframediv {  
+    right: 60%;  
+}  
+      
+svg g.page text {  
+    font-size: 6pt;  
+    font-family: monospace;
+    stroke-width: 0px;  
+    fill: #888;          
+}  
+      
+svg g.active2 text {  
+    font-size: 6pt;  
+    visibility: visible;  
+}  
+      
+svg g.active text {  
+    font-size: 8pt;  
+    visibility: visible;  
+}  
+
+.links line:not(.active2), .nodes .page{  
+    opacity: 0.25;  
+}  
+
+
+.links .page {
+    opacity: 1;
+}
+
+.page.active, .page.active2 {  
+    opacity: 1;  
+}
+

symbols.orig.svg

@@ -0,0 +1,239 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="32.387501mm"
+   height="32.356251mm"
+   viewBox="0 0 32.3875 32.356251"
+   version="1.1"
+   id="svg5507"
+   inkscape:version="0.92.1 r15371"
+   sodipodi:docname="symbols.svg"
+   enable-background="new">
+  <defs
+     id="defs5501" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="5.6"
+     inkscape:cx="-9.2789814"
+     inkscape:cy="99.623528"
+     inkscape:document-units="mm"
+     inkscape:current-layer="layer8"
+     showgrid="false"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:window-width="1366"
+     inkscape:window-height="704"
+     inkscape:window-x="0"
+     inkscape:window-y="27"
+     inkscape:window-maximized="1" />
+  <metadata
+     id="metadata5504">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:groupmode="layer"
+     id="layer2"
+     inkscape:label="Main"
+     style="display:none">
+    <circle
+       r="5.0396824"
+       cy="1.4819558"
+       cx="0.43864226"
+       style="fill-opacity:1;stroke-width:2.01587296;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;marker-start:none"
+       id="Main"
+       inkscape:label="#path8162" />
+  </g>
+  <g
+     inkscape:label="Orientations"
+     inkscape:groupmode="layer"
+     id="layer1"
+     style="display:none">
+    <g
+       id="Orientations"
+       style="fill-opacity:1;stroke-opacity:0.99615389"
+       transform="matrix(0.404233,0,0,0.404233,36.032029,1.0220986)">
+      <path
+         id="Orientations-0"
+         d="m -87.8577,-14.01912 c -8.05454,0 -14.59375,6.50796 -14.59375,14.5625 0,8.05454 6.53921,14.59375 14.59375,14.59375 8.05454,0 14.59375,-6.53921 14.59375,-14.59375 0,-8.05454 -6.53921,-14.5625 -14.59375,-14.5625 z"
+         style="fill-opacity:1;stroke-width:3.19999981;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.99615389;marker-start:none"
+         inkscape:connector-curvature="0" />
+      <path
+         id="path6386"
+         d="m -87.7327,-7.603495 c -1.108176,0 -2.164768,0.243856 -3.125,0.65 -0.960232,0.406144 -1.823784,0.998784 -2.55,1.725 -0.726216,0.726216 -1.318856,1.589768 -1.725,2.55 -0.406144,0.960232 -0.625,2.016824 -0.625,3.125 0,1.108176 0.218856,2.139768 0.625,3.1 0.406144,0.960232 0.998784,1.848784 1.725,2.575 0.726216,0.726216 1.589768,1.293856 2.55,1.7 0.960232,0.406144 2.016824,0.65 3.125,0.65 1.108176,0 2.164768,-0.243856 3.125,-0.65 0.960232,-0.406144 1.823784,-0.973784 2.55,-1.7 0.726216,-0.726216 1.318856,-1.614768 1.725,-2.575 0.406144,-0.960232 0.625,-1.991824 0.625,-3.1 0,-1.108176 -0.218856,-2.164768 -0.625,-3.125 -0.406144,-0.960232 -0.998784,-1.823784 -1.725,-2.55 -0.726216,-0.726216 -1.589768,-1.318856 -2.55,-1.725 -0.960232,-0.406144 -2.016824,-0.65 -3.125,-0.65 z"
+         style="fill-opacity:1;stroke-width:2.55999994;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.99615389;marker-start:none"
+         inkscape:connector-curvature="0" />
+    </g>
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer3"
+     inkscape:label="Ateliers_pluridisciplinaires"
+     style="display:none;">
+    <g
+       transform="matrix(0.71815477,0,0,0.71815477,65.187921,-29.508788)"
+       id="Ateliers_pluridisciplinaires">
+      <circle
+         r="19.208878"
+         cy="40.264759"
+         cx="116.73087"
+         transform="matrix(0.36441483,0,0,0.36441483,-132.69908,28.796006)"
+         id="path6780"
+         style="fill-opacity:1;stroke-width:16.4647522;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;marker-start:none" />
+      <g
+         id="g8172"
+         transform="matrix(2.1333332,0,0,-2.1333332,13.499857,367.42774)"
+         style="fill-opacity:0.99615389;stroke-opacity:0.98846154">
+        <path
+           transform="matrix(0.05856667,0,0,-0.05856667,-55.427399,154.21379)"
+           style="fill-opacity:0.99615389;stroke-width:0;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.98846154;marker-start:none"
+           d="M 135.93975,40.264759 A 19.208878,19.208878 0 0 1 116.73087,59.473637 19.208878,19.208878 0 0 1 97.521996,40.264759 19.208878,19.208878 0 0 1 116.73087,21.055882 19.208878,19.208878 0 0 1 135.93975,40.264759 Z"
+           id="path8174" />
+      </g>
+    </g>
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer4"
+     inkscape:label="Cours_de_soutien_a_l'orientation"
+     style="display:none">
+    <g
+       id="Cours_de_soutien_a_l'orientation"
+       style="stroke-opacity:0.99615389"
+       transform="matrix(0.37928334,0,0,0.37928334,34.100402,17.553674)">
+      <path
+         transform="translate(-446.2952,-500.01912)"
+         id="path8166"
+         d="m 357.75,444.40625 c -7.15954,0 -12.96875,5.77796 -12.96875,12.9375 0,7.15954 5.80921,12.96875 12.96875,12.96875 7.15954,0 12.9375,-5.80921 12.9375,-12.96875 0,-7.15954 -5.77796,-12.9375 -12.9375,-12.9375 z"
+         style="fill-opacity:1;stroke-width:6.48174286;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.99615389;marker-start:none"
+         inkscape:connector-curvature="0" />
+      <path
+         transform="translate(-446.2952,-500.01912)"
+         id="path6363"
+         d="m 357.75,454.125 c 0.44747,0 0.86227,0.086 1.25,0.25 0.38773,0.164 0.73801,0.39426 1.03125,0.6875 0.29324,0.29324 0.5235,0.64352 0.6875,1.03125 0.164,0.38773 0.25,0.80253 0.25,1.25 0,0.44747 -0.086,0.89352 -0.25,1.28125 -0.164,0.38773 -0.39426,0.73801 -0.6875,1.03125 -0.29324,0.29324 -0.64352,0.5235 -1.03125,0.6875 -0.38773,0.164 -0.80253,0.25 -1.25,0.25 -0.44747,0 -0.89352,-0.086 -1.28125,-0.25 -0.38773,-0.164 -0.73801,-0.39426 -1.03125,-0.6875 -0.29324,-0.29324 -0.5235,-0.64352 -0.6875,-1.03125 -0.164,-0.38773 -0.25,-0.83378 -0.25,-1.28125 0,-0.44747 0.086,-0.86227 0.25,-1.25 0.164,-0.38773 0.39426,-0.73801 0.6875,-1.03125 0.29324,-0.29324 0.64352,-0.5235 1.03125,-0.6875 0.38773,-0.164 0.83378,-0.25 1.28125,-0.25 z"
+         style="fill-opacity:1;stroke-width:6.48174286;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.99615389;marker-start:none"
+         inkscape:connector-curvature="0" />
+    </g>
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer5"
+     inkscape:label="Cours_de_soutien_specifique"
+     style="display:none">
+    <g
+       id="Cours_de_soutien_specifique"
+       style="fill-opacity:0.99615389;stroke-opacity:0.99615389"
+       transform="matrix(0.41178012,0,0,0.41178012,37.56977,36.122666)">
+      <path
+         transform="translate(-446.2952,-500.01912)"
+         id="path6358"
+         d="m 356.1875,401.09375 c -8.05454,0 -14.59375,6.53921 -14.59375,14.59375 0,8.05454 6.53921,14.5625 14.59375,14.5625 8.05454,0 14.5625,-6.50796 14.5625,-14.5625 0,-8.05454 -6.50796,-14.59375 -14.5625,-14.59375 z"
+         style="fill-opacity:0.99615389;stroke-width:3.19999981;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.99615389;marker-start:none"
+         inkscape:connector-curvature="0" />
+      <path
+         transform="translate(-446.2952,-500.01912)"
+         id="path6329"
+         d="m 356.3125,413.9375 c -0.44744,0 -0.86303,0.17553 -1.15625,0.46875 -0.29322,0.29322 -0.46875,0.70881 -0.46875,1.15625 0,0.44744 0.17553,0.83178 0.46875,1.125 0.29322,0.29322 0.70881,0.46875 1.15625,0.46875 0.44744,0 0.83178,-0.17553 1.125,-0.46875 0.29322,-0.29322 0.46875,-0.67756 0.46875,-1.125 0,-0.44744 -0.17553,-0.86303 -0.46875,-1.15625 -0.29322,-0.29322 -0.67756,-0.46875 -1.125,-0.46875 z"
+         style="fill-opacity:0.99615389;stroke-width:3.19999981;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.99615389;marker-start:none"
+         inkscape:connector-curvature="0" />
+      <path
+         transform="translate(-446.2952,-500.01912)"
+         id="path6327"
+         d="m 356.3125,413.9375 c 0.44744,0 0.83178,0.17553 1.125,0.46875 0.29322,0.29322 0.46875,0.70881 0.46875,1.15625 0,0.44744 -0.17553,0.83178 -0.46875,1.125 -0.29322,0.29322 -0.67756,0.46875 -1.125,0.46875 -0.44744,0 -0.86303,-0.17553 -1.15625,-0.46875 -0.29322,-0.29322 -0.46875,-0.67756 -0.46875,-1.125 0,-0.44744 0.17553,-0.86303 0.46875,-1.15625 0.29322,-0.29322 0.70881,-0.46875 1.15625,-0.46875 z"
+         style="fill-opacity:0.99615389;stroke-width:3.19999981;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.99615389;marker-start:none"
+         inkscape:connector-curvature="0" />
+      <path
+         transform="translate(-446.2952,-500.01912)"
+         id="path6324"
+         d="m 356.3125,413.9375 c -0.44744,0 -0.86303,0.17553 -1.15625,0.46875 -0.29322,0.29322 -0.46875,0.70881 -0.46875,1.15625 0,0.44744 0.17553,0.83178 0.46875,1.125 0.29322,0.29322 0.70881,0.46875 1.15625,0.46875 0.44744,0 0.83178,-0.17553 1.125,-0.46875 0.29322,-0.29322 0.46875,-0.67756 0.46875,-1.125 0,-0.44744 -0.17553,-0.86303 -0.46875,-1.15625 -0.29322,-0.29322 -0.67756,-0.46875 -1.125,-0.46875 z"
+         style="fill-opacity:0.99615389;stroke-width:3.19999981;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.99615389;marker-start:none"
+         inkscape:connector-curvature="0" />
+    </g>
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer6"
+     inkscape:label="Cours_techniques"
+     style="display:none">
+    <g
+       id="Cours_techniques"
+       transform="matrix(0.42076685,0,0,-0.42076685,-14.006109,85.183824)"
+       inkscape:label="#g3142"
+       style="fill-opacity:1;stroke-opacity:1">
+      <title
+         id="title3278">template</title>
+      <path
+         inkscape:connector-curvature="0"
+         id="path87"
+         style="fill-opacity:1;stroke-width:2.12598443;stroke-linecap:square;stroke-linejoin:bevel;stroke-miterlimit:2.23606801;stroke-dasharray:none;stroke-opacity:1"
+         d="m 49.067296,199.32385 c 0,-8.21904 -6.662847,-14.88189 -14.881888,-14.88189 -8.219041,0 -14.881889,6.66285 -14.881889,14.88189 0,8.21904 6.662848,14.88189 14.881889,14.88189 8.219041,0 14.881888,-6.66285 14.881888,-14.88189 z" />
+      <g
+         id="g3119"
+         style="fill-opacity:1;stroke-opacity:1">
+        <path
+           d="m 44.815326,199.32385 c 0,-5.87075 -4.759174,-10.62992 -10.629918,-10.62992 -5.870744,0 -10.629921,4.75917 -10.629921,10.62992 0,5.87074 4.759177,10.62992 10.629921,10.62992 5.870744,0 10.629918,-4.75918 10.629918,-10.62992 z"
+           style="fill-opacity:1;stroke-width:2.12598443;stroke-linecap:square;stroke-linejoin:bevel;stroke-miterlimit:2.23606801;stroke-dasharray:none;stroke-opacity:1"
+           id="path85"
+           inkscape:connector-curvature="0" />
+      </g>
+    </g>
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer7"
+     inkscape:label="Cours_theoriques">
+    <path
+       d="m 6.7797495,1.3385787 c 0,3.5225563 -2.8555966,6.378149 -6.37815062,6.378149 -3.52255578,0 -6.37814838,-2.8555927 -6.37814838,-6.378149 0,-3.5225563 2.8555926,-6.3781491 6.37814838,-6.3781491 3.52255402,0 6.37815062,2.8555928 6.37815062,6.3781491 z"
+       style="fill-opacity:1;stroke-width:0.80359638;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:2.23606801;stroke-dasharray:2.41078917, 2.41078917;stroke-dashoffset:0;stroke-opacity:1;marker-start:none;marker-mid:none;marker-end:none"
+       id="Cours_theoriques"
+       inkscape:connector-curvature="0"
+       inkscape:label="#path87-1"
+       mask="none" />
+  </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer8"
+     inkscape:label="Enseignants"
+     style="display:none">
+    <path
+       sodipodi:type="star"
+       style="fill-opacity:1;stroke-width:0.97391373;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       id="Enseignants"
+       sodipodi:sides="3"
+       sodipodi:cx="0.36393768"
+       sodipodi:cy="2.2478313"
+       sodipodi:r1="6.7946506"
+       sodipodi:r2="3.397325"
+       sodipodi:arg1="0.52606642"
+       sodipodi:arg2="1.573264"
+       inkscape:flatsided="true"
+       inkscape:rounded="0"
+       inkscape:randomized="0"
+       d="M 6.2398764,5.6596667 -5.5287678,5.6306258 0.38070444,-4.5467985 Z"
+       inkscape:transform-center-x="0.013378058"
+       inkscape:transform-center-y="2.6969222"
+       inkscape:label="#path3225-6-7-7" />
+  </g>
+</svg>

symbols.svg

@@ -2,21 +2,21 @@
 <!-- Created with Inkscape (http://www.inkscape.org/) -->
 
 <svg
-   xmlns:dc="http://purl.org/dc/elements/1.1/"
-   xmlns:cc="http://creativecommons.org/ns#"
-   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
-   xmlns:svg="http://www.w3.org/2000/svg"
-   xmlns="http://www.w3.org/2000/svg"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
    width="32.387501mm"
    height="32.356251mm"
    viewBox="0 0 32.3875 32.356251"
    version="1.1"
    id="svg5507"
-   inkscape:version="0.92.1 r15371"
+   inkscape:version="1.2.2 (b0a8486541, 2022-12-01)"
    sodipodi:docname="symbols.svg"
-   enable-background="new">
+   enable-background="new"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:dc="http://purl.org/dc/elements/1.1/">
   <defs
      id="defs5501" />
   <sodipodi:namedview
@@ -26,11 +26,11 @@
      borderopacity="1.0"
      inkscape:pageopacity="0.0"
      inkscape:pageshadow="2"
-     inkscape:zoom="5.6"
-     inkscape:cx="-9.2789814"
-     inkscape:cy="99.623528"
+     inkscape:zoom="15.938267"
+     inkscape:cx="21.991098"
+     inkscape:cy="16.187456"
      inkscape:document-units="mm"
-     inkscape:current-layer="layer8"
+     inkscape:current-layer="layer7"
      showgrid="false"
      fit-margin-top="0"
      fit-margin-left="0"
@@ -40,7 +40,10 @@
      inkscape:window-height="704"
      inkscape:window-x="0"
      inkscape:window-y="27"
-     inkscape:window-maximized="1" />
+     inkscape:window-maximized="1"
+     inkscape:showpageshadow="0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1" />
   <metadata
      id="metadata5504">
     <rdf:RDF>
@@ -49,7 +52,7 @@
         <dc:format>image/svg+xml</dc:format>
         <dc:type
            rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
-        <dc:title></dc:title>
+        <dc:title />
       </cc:Work>
     </rdf:RDF>
   </metadata>
@@ -62,10 +65,23 @@
        r="5.0396824"
        cy="1.4819558"
        cx="0.43864226"
-       style="fill-opacity:1;stroke-width:2.01587296;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;marker-start:none"
+       style="fill-opacity:1;stroke-width:1.5;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;marker-start:none"
        id="Main"
        inkscape:label="#path8162" />
   </g>
+  <g
+     inkscape:groupmode="layer"
+     id="layer9"
+     inkscape:label="Actualites"
+     style="display:none">
+    <circle
+       r="3.5"
+       cy="1.4819558"
+       cx="0.43864226"
+       style="fill-opacity:1;stroke-width:1;stroke-miterlimit:4;stroke-dasharray:2, 1;stroke-opacity:1;marker-start:none;stroke-dashoffset:0"
+       id="Actualites"
+       inkscape:label="#path8163" />
+  </g>
   <g
      inkscape:label="Orientations"
      inkscape:groupmode="layer"
@@ -73,17 +89,17 @@
      style="display:none">
     <g
        id="Orientations"
-       style="fill-opacity:1;stroke-opacity:0.99615389"
-       transform="matrix(0.404233,0,0,0.404233,36.032029,1.0220986)">
+       style="display:inline;fill-opacity:1;stroke-width:1.30906;stroke-dasharray:none;stroke-opacity:0.996154"
+       transform="matrix(0.404233,0,0,0.404233,36.425594,0.81191722)">
       <path
          id="Orientations-0"
          d="m -87.8577,-14.01912 c -8.05454,0 -14.59375,6.50796 -14.59375,14.5625 0,8.05454 6.53921,14.59375 14.59375,14.59375 8.05454,0 14.59375,-6.53921 14.59375,-14.59375 0,-8.05454 -6.53921,-14.5625 -14.59375,-14.5625 z"
-         style="fill-opacity:1;stroke-width:3.19999981;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.99615389;marker-start:none"
+         style="fill-opacity:1;stroke-width:3.27266;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.996154;marker-start:none"
          inkscape:connector-curvature="0" />
       <path
          id="path6386"
          d="m -87.7327,-7.603495 c -1.108176,0 -2.164768,0.243856 -3.125,0.65 -0.960232,0.406144 -1.823784,0.998784 -2.55,1.725 -0.726216,0.726216 -1.318856,1.589768 -1.725,2.55 -0.406144,0.960232 -0.625,2.016824 -0.625,3.125 0,1.108176 0.218856,2.139768 0.625,3.1 0.406144,0.960232 0.998784,1.848784 1.725,2.575 0.726216,0.726216 1.589768,1.293856 2.55,1.7 0.960232,0.406144 2.016824,0.65 3.125,0.65 1.108176,0 2.164768,-0.243856 3.125,-0.65 0.960232,-0.406144 1.823784,-0.973784 2.55,-1.7 0.726216,-0.726216 1.318856,-1.614768 1.725,-2.575 0.406144,-0.960232 0.625,-1.991824 0.625,-3.1 0,-1.108176 -0.218856,-2.164768 -0.625,-3.125 -0.406144,-0.960232 -0.998784,-1.823784 -1.725,-2.55 -0.726216,-0.726216 -1.589768,-1.318856 -2.55,-1.725 -0.960232,-0.406144 -2.016824,-0.65 -3.125,-0.65 z"
-         style="fill-opacity:1;stroke-width:2.55999994;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.99615389;marker-start:none"
+         style="fill-opacity:1;stroke-width:1.30906;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.996154;marker-start:none"
          inkscape:connector-curvature="0" />
     </g>
   </g>
@@ -91,7 +107,7 @@
      inkscape:groupmode="layer"
      id="layer3"
      inkscape:label="Ateliers_pluridisciplinaires"
-     style="display:none;">
+     style="display:none">
     <g
        transform="matrix(0.71815477,0,0,0.71815477,65.187921,-29.508788)"
        id="Ateliers_pluridisciplinaires">
@@ -101,14 +117,14 @@
          cx="116.73087"
          transform="matrix(0.36441483,0,0,0.36441483,-132.69908,28.796006)"
          id="path6780"
-         style="fill-opacity:1;stroke-width:16.4647522;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;marker-start:none" />
+         style="fill-opacity:1;stroke-width:16.4648;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;marker-start:none" />
       <g
          id="g8172"
          transform="matrix(2.1333332,0,0,-2.1333332,13.499857,367.42774)"
-         style="fill-opacity:0.99615389;stroke-opacity:0.98846154">
+         style="fill-opacity:0.996154;stroke-opacity:0.988462">
         <path
            transform="matrix(0.05856667,0,0,-0.05856667,-55.427399,154.21379)"
-           style="fill-opacity:0.99615389;stroke-width:0;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.98846154;marker-start:none"
+           style="fill-opacity:0.996154;stroke-width:0;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.988462;marker-start:none"
            d="M 135.93975,40.264759 A 19.208878,19.208878 0 0 1 116.73087,59.473637 19.208878,19.208878 0 0 1 97.521996,40.264759 19.208878,19.208878 0 0 1 116.73087,21.055882 19.208878,19.208878 0 0 1 135.93975,40.264759 Z"
            id="path8174" />
       </g>
@@ -121,19 +137,19 @@
      style="display:none">
     <g
        id="Cours_de_soutien_a_l'orientation"
-       style="stroke-opacity:0.99615389"
+       style="display:none;stroke-opacity:0.996154"
        transform="matrix(0.37928334,0,0,0.37928334,34.100402,17.553674)">
       <path
          transform="translate(-446.2952,-500.01912)"
          id="path8166"
          d="m 357.75,444.40625 c -7.15954,0 -12.96875,5.77796 -12.96875,12.9375 0,7.15954 5.80921,12.96875 12.96875,12.96875 7.15954,0 12.9375,-5.80921 12.9375,-12.96875 0,-7.15954 -5.77796,-12.9375 -12.9375,-12.9375 z"
-         style="fill-opacity:1;stroke-width:6.48174286;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.99615389;marker-start:none"
+         style="fill-opacity:1;stroke-width:6.48174;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.996154;marker-start:none"
          inkscape:connector-curvature="0" />
       <path
          transform="translate(-446.2952,-500.01912)"
          id="path6363"
          d="m 357.75,454.125 c 0.44747,0 0.86227,0.086 1.25,0.25 0.38773,0.164 0.73801,0.39426 1.03125,0.6875 0.29324,0.29324 0.5235,0.64352 0.6875,1.03125 0.164,0.38773 0.25,0.80253 0.25,1.25 0,0.44747 -0.086,0.89352 -0.25,1.28125 -0.164,0.38773 -0.39426,0.73801 -0.6875,1.03125 -0.29324,0.29324 -0.64352,0.5235 -1.03125,0.6875 -0.38773,0.164 -0.80253,0.25 -1.25,0.25 -0.44747,0 -0.89352,-0.086 -1.28125,-0.25 -0.38773,-0.164 -0.73801,-0.39426 -1.03125,-0.6875 -0.29324,-0.29324 -0.5235,-0.64352 -0.6875,-1.03125 -0.164,-0.38773 -0.25,-0.83378 -0.25,-1.28125 0,-0.44747 0.086,-0.86227 0.25,-1.25 0.164,-0.38773 0.39426,-0.73801 0.6875,-1.03125 0.29324,-0.29324 0.64352,-0.5235 1.03125,-0.6875 0.38773,-0.164 0.83378,-0.25 1.28125,-0.25 z"
-         style="fill-opacity:1;stroke-width:6.48174286;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.99615389;marker-start:none"
+         style="fill-opacity:1;stroke-width:6.48174;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.996154;marker-start:none"
          inkscape:connector-curvature="0" />
     </g>
   </g>
@@ -144,31 +160,31 @@
      style="display:none">
     <g
        id="Cours_de_soutien_specifique"
-       style="fill-opacity:0.99615389;stroke-opacity:0.99615389"
+       style="display:inline;fill-opacity:0.996154;stroke-opacity:0.996154"
        transform="matrix(0.41178012,0,0,0.41178012,37.56977,36.122666)">
       <path
          transform="translate(-446.2952,-500.01912)"
          id="path6358"
          d="m 356.1875,401.09375 c -8.05454,0 -14.59375,6.53921 -14.59375,14.59375 0,8.05454 6.53921,14.5625 14.59375,14.5625 8.05454,0 14.5625,-6.50796 14.5625,-14.5625 0,-8.05454 -6.50796,-14.59375 -14.5625,-14.59375 z"
-         style="fill-opacity:0.99615389;stroke-width:3.19999981;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.99615389;marker-start:none"
+         style="fill-opacity:0.996154;stroke-width:3.2;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.996154;marker-start:none"
          inkscape:connector-curvature="0" />
       <path
          transform="translate(-446.2952,-500.01912)"
          id="path6329"
          d="m 356.3125,413.9375 c -0.44744,0 -0.86303,0.17553 -1.15625,0.46875 -0.29322,0.29322 -0.46875,0.70881 -0.46875,1.15625 0,0.44744 0.17553,0.83178 0.46875,1.125 0.29322,0.29322 0.70881,0.46875 1.15625,0.46875 0.44744,0 0.83178,-0.17553 1.125,-0.46875 0.29322,-0.29322 0.46875,-0.67756 0.46875,-1.125 0,-0.44744 -0.17553,-0.86303 -0.46875,-1.15625 -0.29322,-0.29322 -0.67756,-0.46875 -1.125,-0.46875 z"
-         style="fill-opacity:0.99615389;stroke-width:3.19999981;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.99615389;marker-start:none"
+         style="fill-opacity:0.996154;stroke-width:3.2;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.996154;marker-start:none"
          inkscape:connector-curvature="0" />
       <path
          transform="translate(-446.2952,-500.01912)"
          id="path6327"
          d="m 356.3125,413.9375 c 0.44744,0 0.83178,0.17553 1.125,0.46875 0.29322,0.29322 0.46875,0.70881 0.46875,1.15625 0,0.44744 -0.17553,0.83178 -0.46875,1.125 -0.29322,0.29322 -0.67756,0.46875 -1.125,0.46875 -0.44744,0 -0.86303,-0.17553 -1.15625,-0.46875 -0.29322,-0.29322 -0.46875,-0.67756 -0.46875,-1.125 0,-0.44744 0.17553,-0.86303 0.46875,-1.15625 0.29322,-0.29322 0.70881,-0.46875 1.15625,-0.46875 z"
-         style="fill-opacity:0.99615389;stroke-width:3.19999981;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.99615389;marker-start:none"
+         style="fill-opacity:0.996154;stroke-width:3.2;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.996154;marker-start:none"
          inkscape:connector-curvature="0" />
       <path
          transform="translate(-446.2952,-500.01912)"
          id="path6324"
          d="m 356.3125,413.9375 c -0.44744,0 -0.86303,0.17553 -1.15625,0.46875 -0.29322,0.29322 -0.46875,0.70881 -0.46875,1.15625 0,0.44744 0.17553,0.83178 0.46875,1.125 0.29322,0.29322 0.70881,0.46875 1.15625,0.46875 0.44744,0 0.83178,-0.17553 1.125,-0.46875 0.29322,-0.29322 0.46875,-0.67756 0.46875,-1.125 0,-0.44744 -0.17553,-0.86303 -0.46875,-1.15625 -0.29322,-0.29322 -0.67756,-0.46875 -1.125,-0.46875 z"
-         style="fill-opacity:0.99615389;stroke-width:3.19999981;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.99615389;marker-start:none"
+         style="fill-opacity:0.996154;stroke-width:3.2;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.996154;marker-start:none"
          inkscape:connector-curvature="0" />
     </g>
   </g>
@@ -179,7 +195,7 @@
      style="display:none">
     <g
        id="Cours_techniques"
-       transform="matrix(0.42076685,0,0,-0.42076685,-14.006109,85.183824)"
+       transform="matrix(0.4019761,0,0,-0.4019761,-13.363739,81.438379)"
        inkscape:label="#g3142"
        style="fill-opacity:1;stroke-opacity:1">
       <title
@@ -187,14 +203,14 @@
       <path
          inkscape:connector-curvature="0"
          id="path87"
-         style="fill-opacity:1;stroke-width:2.12598443;stroke-linecap:square;stroke-linejoin:bevel;stroke-miterlimit:2.23606801;stroke-dasharray:none;stroke-opacity:1"
+         style="fill-opacity:1;stroke-width:2.12598;stroke-linecap:square;stroke-linejoin:bevel;stroke-miterlimit:2.23607;stroke-dasharray:none;stroke-opacity:1"
          d="m 49.067296,199.32385 c 0,-8.21904 -6.662847,-14.88189 -14.881888,-14.88189 -8.219041,0 -14.881889,6.66285 -14.881889,14.88189 0,8.21904 6.662848,14.88189 14.881889,14.88189 8.219041,0 14.881888,-6.66285 14.881888,-14.88189 z" />
       <g
          id="g3119"
          style="fill-opacity:1;stroke-opacity:1">
         <path
            d="m 44.815326,199.32385 c 0,-5.87075 -4.759174,-10.62992 -10.629918,-10.62992 -5.870744,0 -10.629921,4.75917 -10.629921,10.62992 0,5.87074 4.759177,10.62992 10.629921,10.62992 5.870744,0 10.629918,-4.75918 10.629918,-10.62992 z"
-           style="fill-opacity:1;stroke-width:2.12598443;stroke-linecap:square;stroke-linejoin:bevel;stroke-miterlimit:2.23606801;stroke-dasharray:none;stroke-opacity:1"
+           style="fill-opacity:1;stroke-width:2.12598;stroke-linecap:square;stroke-linejoin:bevel;stroke-miterlimit:2.23607;stroke-dasharray:none;stroke-opacity:1"
            id="path85"
            inkscape:connector-curvature="0" />
       </g>
@@ -203,24 +219,42 @@
   <g
      inkscape:groupmode="layer"
      id="layer7"
-     inkscape:label="Cours_theoriques">
-    <path
-       d="m 6.7797495,1.3385787 c 0,3.5225563 -2.8555966,6.378149 -6.37815062,6.378149 -3.52255578,0 -6.37814838,-2.8555927 -6.37814838,-6.378149 0,-3.5225563 2.8555926,-6.3781491 6.37814838,-6.3781491 3.52255402,0 6.37815062,2.8555928 6.37815062,6.3781491 z"
-       style="fill-opacity:1;stroke-width:0.80359638;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:2.23606801;stroke-dasharray:2.41078917, 2.41078917;stroke-dashoffset:0;stroke-opacity:1;marker-start:none;marker-mid:none;marker-end:none"
+     inkscape:label="Cours_theoriques"
+     style="display:none">
+    <g
        id="Cours_theoriques"
-       inkscape:connector-curvature="0"
-       inkscape:label="#path87-1"
-       mask="none" />
+       transform="matrix(0.99529384,0,0,0.99529384,-0.44695171,-1.3774619)">
+      <path
+         id="path6358-3"
+         d="m 0.46521149,-4.6128375 c -3.31669949,0 -6.00941609,2.6927167 -6.00941609,6.0094161 0,3.3166995 2.6927166,5.996548 6.00941609,5.996548 3.31669941,0 5.99654801,-2.6798485 5.99654801,-5.996548 0,-3.3166994 -2.6798486,-6.0094161 -5.99654801,-6.0094161 z"
+         style="fill-opacity:0.996154;stroke-width:1.3177;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.996154;marker-start:none"
+         inkscape:connector-curvature="0" />
+      <path
+         id="path6329-6"
+         d="m 0.51668401,0.67596342 c -0.1842469,0 -0.3553786,0.0722798 -0.47612077,0.19302193 -0.12074216,0.12074217 -0.19302193,0.29187385 -0.19302193,0.47612075 0,0.1842469 0.07227977,0.3425105 0.19302193,0.4632527 0.12074217,0.1207421 0.29187387,0.1930219 0.47612077,0.1930219 0.18424689,0 0.34251047,-0.07228 0.46325263,-0.1930219 C 1.1006788,1.6876166 1.1729586,1.529353 1.1729586,1.3451061 c 0,-0.1842469 -0.07228,-0.35537858 -0.19302196,-0.47612075 C 0.85919448,0.74824319 0.7009309,0.67596342 0.51668401,0.67596342 Z"
+         style="fill-opacity:0.996154;stroke-width:1.3177;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.996154;marker-start:none"
+         inkscape:connector-curvature="0" />
+      <path
+         id="path6327-7"
+         d="m 0.51668401,0.67596342 c 0.18424689,0 0.34251047,0.0722798 0.46325263,0.19302193 C 1.1006788,0.98972752 1.1729586,1.1608592 1.1729586,1.3451061 c 0,0.1842469 -0.07228,0.3425105 -0.19302196,0.4632527 -0.12074216,0.1207421 -0.27900574,0.1930219 -0.46325263,0.1930219 -0.1842469,0 -0.3553786,-0.07228 -0.47612077,-0.1930219 -0.12074216,-0.1207422 -0.19302193,-0.2790058 -0.19302193,-0.4632527 0,-0.1842469 0.07227977,-0.35537858 0.19302193,-0.47612075 C 0.16130541,0.74824319 0.33243711,0.67596342 0.51668401,0.67596342 Z"
+         style="fill-opacity:0.996154;stroke-width:1.3177;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.996154;marker-start:none"
+         inkscape:connector-curvature="0" />
+      <path
+         id="path6324-5"
+         d="m 0.52751086,-0.43920397 c -0.49428682,0 -0.95338895,0.19390802 -1.27730899,0.51782796 C -1.0737181,0.40254403 -1.2676261,0.8616461 -1.2676261,1.3559329 c 0,0.4942868 0.193908,0.9188672 0.51782797,1.2427873 0.32392004,0.3239199 0.78302217,0.5178279 1.27730899,0.5178279 0.49428684,0 0.91886704,-0.1939086 1.24278714,-0.5178279 C 2.094218,2.2748001 2.288126,1.8502197 2.288126,1.3559329 2.288126,0.8616461 2.0942174,0.40254403 1.770298,0.07862399 1.4463779,-0.24529603 1.0217977,-0.43920397 0.52751086,-0.43920397 Z"
+         style="fill-opacity:0.996154;stroke-width:3.53505;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.996154;marker-start:none"
+         inkscape:connector-curvature="0" />
+    </g>
   </g>
   <g
      inkscape:groupmode="layer"
      id="layer8"
-     inkscape:label="Enseignants"
+     inkscape:label="Enseignant__e__s"
      style="display:none">
     <path
        sodipodi:type="star"
-       style="fill-opacity:1;stroke-width:0.97391373;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
-       id="Enseignants"
+       style="fill-opacity:1;stroke-width:0.973914;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       id="Enseignant__e__s"
        sodipodi:sides="3"
        sodipodi:cx="0.36393768"
        sodipodi:cy="2.2478313"