Juxtapose

Kurzfassung für Freitag: Das hier * https://www.w3schools.com/howto/howto_js_image_comparison.asp dürfte besonders interessant sein. In MediaWiki:Common.js kann man custom-Javascript ergänzen und in MediaWiki:Common.css custom css, das für alle User auf Wiki-Seiten zur Verfügung steht. Eventuell bekommt man das im Wiki dann damit zum Laufen, ohne dass man eine eigene Extension braucht. Versuch es mal.

Wenn das klappt mit Bildern im Wiki wäre es super.

• Ziel: Enduser soll zwei Bilder mit Slider überblenden können. Soll so aussehen wie hier: https://www.geschichtewiki.wien.gv.at/Juxtapose_Test
  • in diesem Test wurde ein vordefinierter Code in einem Widget verwendet. Quelltext:

{{#widget:Juxtapose|id=182c39d0-b552-11e9-b9b8-0edaf8f81e27|width=200px}}

• • Das ist ein ziemlicher Unsinn, weil zu umständlich: es verwendet das hier: https://juxtapose.knightlab.com/#make

Aufgaben

• Versuche mal, das Juxtapose-Widget aus dem Wien Geschichte Wiki in deinem Testwiki zu installieren (Widget Extension + das Widget von dort).
• Dann versuch mal, ein Beispiel mit diesem Konfiguratior zum Laufen zu bringen

Ziel

Ziel wäre es daher, eine eigene Extension dafür zu schreiben und nicht dem Widget eine "black box" mit vordefiniertem code anzeigen zu lassen.

• https://github.com/NUKnightLab/juxtapose#create-a-juxtapose-slider

Zuvor müssen wir aber überlegen, ob das überhaupt sinnvoll ist, das Projekt von KnightLab zu verwenden. Weil eventuell gibt es einfachere Möglichkeiten, so etwas in MediaWiki zu realisieren. Ziel ist es ja nicht, irgenwelche Bilder zu vergleichen, sondern nur die in einer MediaWiki-Instanz hochgeladenen.

Habe in einer kurzen Recherche das hier gefunden, bitte noch weiter recherchieren

• https://www.w3schools.com/howto/howto_js_image_comparison.asp
• https://ourcodeworld.com/articles/read/263/top-5-best-before-and-after-image-comparison-slider-jquery-and-javascript-plugins
  • bitte bei al denen in dem Artikel oberhalb recherchieren, ob es da ev. schon Lösungen für MediaWiki gibt
  • twentytwenty aus dem obigen Artikel kannte ich schon. Man sieht aber, dass das nicht aktuell weiterentwickelt wird
• https://www.jqueryscript.net/other/jQuery-Plugin-For-Comparing-Images-By-Mouse-Move-Comparison.html