Update education page

Co-authored-by: rubenwardy <[email protected]>

_data/countries.yml

@@ -0,0 +1,15 @@
+ar: Argentina
+ca: Canada
+cn: China
+de: Germany
+es: Spain
+fr: France
+gb: United Kingdom
+in: India
+ja: Japan
+kr: The Republic of Korea
+pl: Poland
+qa: Qatar
+ru: Russia
+se: Sweden
+us: United States of America

_data/edu.yml

@@ -1,85 +1,167 @@
 why:
-- title: Free of Charge
-  para:  Minetest is <a href="/get-involved/">developed</a> by an
-         international network of <a href="/credits/">volunteer developers</a>.
-         You don't have to pay a license fee.
+- title: Free & Open Source
+  para: >-
+    The Minetest Engine is [developed](/get-involved/) by an independent
+    community of [volunteer developers](/credits/). It is provided for
+    everyone to use, modify, and redistribute freely.
+
+- title: Modular & Customizable
+  para: >-
+    Access [a library of 2000+ free and open source community developed mods](https://content.minetest.net/)
+    to customize your EDU environment, and an accessible scripting system for
+    you and your students to create your own!
+
+- title: Low-spec & Cross-platform
+  para: >-
+    Minetest has low system requirements, is compatible with previous
+    generations of hardware, and allows crossplay from any supported device.
+
+
+projects_map: "//umap.openstreetmap.fr/en/map/minetest-projects_893367?scaleControl=false&amp;miniMap=false&amp;scrollWheelZoom=false&amp;zoomControl=true&amp;editMode=disabled&amp;moreControl=true&amp;searchControl=null&amp;tilelayersControl=null&amp;embedControl=null&amp;datalayersControl=true&amp;onLoadPanel=databrowser&amp;captionBar=false&amp;captionMenus=true"
+
+projects:
+
+- title: Minestory
+  author: académie de Dijon - Julien Crémoux
+  tag: School - Heritage Sites
+  country: fr
+  img: minestory.webp
+  para: >-
+    Since 2019, more than 600 primary school students from 30 classes in 3
+    different countries have replicated heritage sites (like Notre-Dame de
+    Paris, the medieval Louvre castle or the Besançon citadel), placed them on
+    an interactive timeline and gave tours and presentations in the virtual
+    world.
+  url: http://minetest.wp.ac-dijon.fr/minestory-frise-immersive-de-sites-du-patrimoine-architectural/
+
+- title: Minetest Classroom
+  author: University of British Columbia - Paul Pickell
+  tag: University - Digital Twin
+  country: ca
+  img: minetest_classroom.webp
+  para: >-
+    A project funded by the University of British Columbia around the use of
+    Minetest as a learning tool and for the production of digital twins of
+    natural and human built environments. It has been used to organize virtual
+    field trips in the context of Covid 19.
+  url: https://eml.ubc.ca/projects/gamifying-forestry/
 
-- title: Easy Scripting
-  para: Minetest is not a game itself, but instead provides a Lua API which is used to create games and mods.
-        This makes creation and customisation super easy.
-
-- title: Customisable without Limits
-  para: You are not restricted by any EULA, and have full access to the source code.
-        Minetest is available under the LGPLv2.1+ license.
-
-- title: Runs well on old hardware
-  para: Minetest is written in a computer language that makes more efficient use of hardware,
-        allowing more schools to be able to experience interactive virtual learning.
-
-- title: Independent
-  para: Minetest is not associated with any company or commercial entity, which can make it
-        more suitable for adoption in organisations where this is a problem.
-
-- title: Friendly Community
-  para: You can find help with any problems on our <a href="/get-involved/">forums or IRC channels.</a>
+- title: BLOCKALOT
+  author: Landesmedienzentrum Baden-Württemberg
+  tag: Platform/Tool
+  country: de
+  img: blockalot.webp
+  para:
+    The Landesmedienzentrum Baden-Württemberg aims at helping teachers implement
+    future-oriented, game-based, learning in a hands-on approach. It provides
+    Minetest server hosting, educational resources, as well as technical and
+    educational support.
+  url: https://www.blockalot.de/
 
+- title: Permis de déconstruire
+  author: Praticable
+  tag: School - Artistic Residency
+  country: fr
+  img: permisdedeconstruire.webp
+  para: >-
+    Between November 2021 and June 2022, secondary school students from
+    Aulney-sous-Bois in France have reinvented their neighborhood with Minetest.
+    This project, coordinated by the IRI foundation and the teachers, allowed
+    the students to explore the digital practice of cooperative and contributive
+    construction. The projects created emphasized well-being and the
+    neighborhood's conviviality.
+  url: https://praticable.fr/productions/permis-de-deconstruire
+
+- title: UNEJ
+  author: Institut de Recherche et d'Innovation
+  tag: School - Urban Planning
+  country: fr
+  img: unej.webp
+  para: >-
+    The UNEJ project (*Urbanités Numériques En Jeux*) is a 4 years project where
+    teachers and students discover about urban planning while building concrete
+    proposals for their neighborhood's development with the help of
+    professionals from the sector. It is done in connection with the urban
+    transformations carried out for the 2024 Olympics.
+  url: https://tac93.fr/capacitation/unej
+
+- title: Maubeuge en Cubes
+  author: Thomate & Lemente
+  tag: Citizen Participation
+  country: fr
+  img: maubeuge.webp
+  para: >-
+    A Workshop for the city of Maubeuge in France where groups of young citizens
+    between 10 and 16 years old shared ideas to improve their neighborhood. They
+    then built them in an in-game map of their city, allowing urban planners to
+    see what young people wanted for their local area and discuss current issues
+    with them.
+  url: https://agglo-maubeugevaldesambre.fr/wp-content/uploads/2023/02/Journal-du-Renouvellement-Urbain-7-Decembre-2022-Final-numerique.pdf
+
+
+articles:
 
-featured:
-- title: Framinetest
-  author: Framasoft
-  lang: fr
-  img: framinetest.png
-  para: An educational server, with geology, biology, and historical reconstruction to imagine your world!
-  url: https://framinetest.org
+- title: Mining for Education
+  author: Paul Brown, OS Mag
+  para: >-
+    An article explaining why you should use Minetest for education, and a guide
+    in doing so.
+  url: https://www.ocsmag.com/mining-for-education/
 
-- title: QiskitBlocks
-  author: James Weaver
-  img: qiskitblocks.png
-  para: Teaching Quantum Computing using Qiskit in a block world.
-  url: https://content.minetest.net/packages/JavaFXpert/qiskitblocks/
+- title: Learning with Minetest
+  author: Teacher Squeaks
+  para: >-
+    A 3-part post-mortem based on the author's experience of using Minetest in a
+    pre-school.
+  url: http://teachersqueaks.blogspot.co.za/2016/08/minewhat-rolling-out-minetest-in-pre.html
 
-- title: Craft the Web
-  author: CERN
-  tag: Unreleased
-  img: ctw.png
-  para: Learn what makes the Web function, and about the ideas and major inventions that paved its creation.
-  url: https://forum.minetest.net/viewtopic.php?t=22871
+- title: Build Block Worlds with Minetest
+  author: Miguel Guhlin
+  para: ""
+  url: https://blog.tcea.org/build-block-worlds-with-minetest/
 
 
 resources:
 
-- title: BLOCKALOT
-  author: Landesmedienzentrum Baden-Württemberg
-  lang: de
-  img: imvec.png
-  para: >
+- title: Minetest Wiki (Edu page)
+  author: The official Minetest Wiki, by the community
+  para: >-
+    A trove of information, in multiple languages, with a space dedicated to
+    education. Looking for more contributions!
+  url: https://wiki.minetest.net/MinetestEDU
+
+- title: ContentDB
+  author: To find Minetest mods
+  para: >-
+    A database where modders can submit their mods to make them easily
+    accessible. Includes features such as a tag system, reviews, and more.
+  url:  https://content.minetest.net/packages/?tag=education
+
+- title: BLOCKALOT Server Hosting
+  author: To host an Edu server
+  para: >-
+    A server management dashboard offered free of charge to facilitate hosting
+    Minetest Edu servers. Comes with support in English/French/German, a wiki
+    and workshops.
+  para: >-
     A dashboard to create worlds for future-oriented learning without hosting
     servers. Comes with support (in English/French/German), a wiki and
     workshops. It's currently free to use.
   url: https://www.blockalot.de/
 
-- title: Edu Wiki
-  classes: is-primary
-  author: Various
-  para: There's a section of our wiki dedicated for education-related help.
-  url: https://wiki.minetest.net/MinetestEDU
+- title: Blockexchange
+  author: To share Minetest builds
+  para: >-
+    A website and mod that allows you to import or share Minetest constructions
+    on an online library.
+  url: https://blockexchange.minetest.ch/
 
-- title: List of Mods for Education
-  author: Various
-  para: We have a large collection of educational mods, all of which are free and open source.
-  url: https://content.minetest.net/packages/?tag=education
+- title: Create/host a server (Wiki)
+  author: To host a server by yourself
+  para: The basics to host your multiplayer world locally or online.
+  url: https://wiki.minetest.net/Setting_up_a_server
 
 - title: Minetest Modding Book
   author: rubenwardy
   para: Learn how to use Minetest's Lua API to create mods and games.
   url: https://rubenwardy.com/minetest_modding_book/
-
-- title: Mining for Education
-  author: Paul Brown, OS Mag
-  para: An article explaining why you should use Minetest for education, and a guide in doing so.
-  url: https://www.ocsmag.com/mining-for-education/
-
-- title: Learning with Minetest
-  author: Teacher Squeaks
-  para: A 3-part post-mortem based on the author's experience of using Minetest in a pre-school.
-  url: http://teachersqueaks.blogspot.co.za/2016/08/minewhat-rolling-out-minetest-in-pre.html

_includes/edu_card.html

@@ -0,0 +1,29 @@
+{% assign point = include.item %}
+<a class="column is-one-third hover-enlarge" href="{{ point.url }}">
+  <div class="card">
+    {% if point.img %}
+      <div class="card-image">
+        <figure class="image is-16by9">
+          <img src="/media/edu/{{ point.img }}" style="object-fit: cover;" alt="screenshot">
+        </figure>
+      </div>
+    {% endif %}
+    <div class="card-content">
+      {% for country in point.country %}
+        <img class="is-pulled-right" src="/assets/icons/country-{{ country }}.png"
+          alt="{{ site.data.countries[country] }}" title="{{ site.data.countries[country] }}">
+      {% endfor %}
+
+      <h3 class="title is-4">{{ point.title }}</h3>
+      <p class="subtitle is-6 {% if point.tag %}mb-0{% endif %}">{{ point.author }}</p>
+      {% if point.tag %}
+        <p class="mt-2 mb-3">
+          <span class="tag is-rounded">{{ point.tag }}</span>
+        </p>
+      {% endif %}
+      <p>
+        {{ point.para | markdownify }}
+      </p>
+    </div>
+  </div>
+</a>

education.html

@@ -14,19 +14,11 @@ <h2 id="why" class="title">Why Minetest?</h2>
 				<div class="column is-one-third">
 					<h3 class="title is-4">{{ point.title }}</h3>
 					<p>
-						{{ point.para }}
+						{{ point.para | markdownify }}
 					</p>
 				</div>
 			{% endfor %}
 		</div>
-
-		<p class="has-text-centered footnote">
-			<small>
-				The above is based on the
-				<a href="https://web.archive.org/web/20221218200032/https://twitter.com/MinetestProject/status/1147812428647936001">responses</a>
-				of educators using Minetest.
-			</small>
-		</p>
 	</div>
 </section>
 
@@ -35,60 +27,53 @@ <h3 class="title is-4">{{ point.title }}</h3>
 	<div class="container">
 		<h2 class="title">Projects</h2>
 
+		<article id="map" class="card is-clipped mb-6">
+			<h3 class="is-sr-only">Map</h3>
+			<iframe width="100%" height="450px" frameborder="0" allowfullscreen=""
+				allow="geolocation" class="is-block"
+				src="{{ site.data.edu.projects_map }}"></iframe>
+		</article>
+
 		<div class="columns is-multiline">
-			{% for point in site.data.edu.featured %}
-				<a class="column is-one-third hover-enlarge" href="{{ point.url }}">
-					<div class="card">
-						<div class="card-image">
-							<figure class="image is-16by9">
-								<img src="/media/edu/{{ point.img }}" style="object-fit: cover;" alt="screenshot">
-							</figure>
-						</div>
-						<div class="card-content">
-							<h2 class="title is-4">{{ point.title }}
-								{% if point.tag %}
-									<span class="tag is-rounded is-warning">{{ point.tag }}</span>
-								{% endif %}
-								{% for lang in point.lang %}
-									<img class="is-pulled-right" src="/assets/icons/lang-{{ lang }}.png" alt="{{ lang }}">
-								{% endfor %}
-							</h2>
-							<h6 class="subtitle is-6">{{ point.author }}</h6>
-							<p>
-								{{ point.para }}
-							</p>
-						</div>
-					</div>
-				</a>
+			{% for point in site.data.edu.projects %}
+				{% include edu_card.html item=point %}
 			{% endfor %}
 		</div>
 	</div>
 </section>
 
-<section class="section">
+<section class="section" style="background-color: #f0f0f0;">
 	<div class="container">
-		<h2 id="resources" class="title">Resources</h2>
+		<h2 id="resources" class="title is-3">Resources</h2>
 
+		<h3 id="articles-and-guides" class="title is-4">
+			Articles and Guides
+		</h3>
+		<div class="columns is-multiline">
+			{% for point in site.data.edu.articles %}
+				{% include edu_card.html item=point %}
+			{% endfor %}
+		</div>
+
+		<h3 id="other-resources" class="title is-4 mt-5">
+			Other Resources
+		</h3>
 		<div class="columns is-multiline">
 			{% for point in site.data.edu.resources %}
-				<a class="column is-one-third hover-enlarge" href="{{ point.url }}">
-					<div class="card {{ point.classes }}">
-						<div class="card-content">
-							<h2 class="title is-4">{{ point.title }}</h2>
-							<h6 class="subtitle is-6">{{ point.author }}</h6>
-							<p>
-								{{ point.para }}
-							</p>
-						</div>
-					</div>
-				</a>
+				{% include edu_card.html item=point %}
 			{% endfor %}
 		</div>
+	</div>
+</section>
 
-		<div class="notification">
-			<b>Your project here!</b>
-			Contribute back to the community by making your learning resources publicly available.
-			Then, <a href="https://github.com/minetest/minetest.github.io/issues/new">create an issue</a> or
+<section class="section">
+	<div class="container">
+		<h2 id="resources" class="title">Working on an edu project?</h2>
+		<p>
+			Contribute back to the community by making your learning resources
+			publicly available. Then,
+			<a href="https://github.com/minetest/minetest.github.io/issues/new">
+				create an issue</a> or
 			<a href="https://rubenwardy.com/contact/">contact rubenwardy</a>.
 		</div>
 	</div>