Da ich einige Private Nachrichten bekommen habe wie man den "Betrachter" für den
Tanelorn Hexcrawl für eigene Projekte einsetzen kann... nun, schön ist es nicht, aber hier mal was für die Nachwelt
Zur Erinnerung: Das Projekt hatte mal
hier gestartet, wurde in einem Google-Spreadsheet gepflegt (
Link zum Google-Doc) und von mir mit einem Betrachter versehen,
hier zu finden.
Um Letzteres geht es hier.Wer sowas auch starten möchte, braucht aktuell:
0. Eine eigene Hex-Karte in einem Browser-lesbarem Bild-Format (also gif, png, jpeg. Andere wie webp und svg habe ich nicht ausprobiert).
1. Einen Google-Account um ein eigenes Google-Spreadsheet anzulegen. Aktuell ist das Programm einfach recht stark an die ursprüngliche herangehensweise angelehnt. Sorry, kommt man aktuell nicht drum herum.
2. Die Programmdateien die ich als tcrawl.zip anhängen werde.
3. Ein wenig Webspace, der etwas php kann (sollte aber auch kein Ding sein, das bisschen PHP in anderen Sprachen abzubilden).
Die folgende Anleitung ist recht ausführlich geworden, aber sollte nicht sonderlich schwer zu befolgen sein.
Schritt 1: Dein eigenes Google-Spreadsheat
Geh zum Original Google-Spreadsheet:
https://docs.google.com/spreadsheets/d/1WAX7kBUwhCSV7asc3A4joTMi-j_cG0lebQM_HkVMj9c/edit#gid=0Wähle dort File->Make Copy (im Deutschen vermutlich "Datei -> Kopie erstellen").
Wähle "My Drive", gebe einen
ANDEREN Namen sagen wir "My Crawl" ein und drücke Enter (Der Button "OK" wirkt bei mir nicht, aber "Enter" klappt). Du solltest nun das gleiche Dokument mit anderer Überschrift "My Crawl" haben.
Wenn du sicher bist, die Kopie mit Überschrift "My Crawl" vor dir zu haben: Mache dir ein Lesezeichen, und dann kannst immer wieder zurückkehren, deine Daten zu ergänzen/abzuändern. Für den Anfang
ersetzen wir einfach mal in die Zeile 2 "Schlachtfeld von Nahtun..." mit "Test für My Crawl"
Gehe dann auf "File -> Publish to Web" (im deutschen vermutlich "Datei -> Im Web veröffentlichen") und wähle statt "Entire Document" (Ganzes Dokument) die Seite "Zwillingssee im Osten" (Kannst du vorher natürlich gerne umbenennen. Ich glaube das geht auch im Nachhinein, bin mir aber nich sicher, im Worstcase musst du die folgenden Schritte wiederholen).
Google Docs erzeugt dann einen Link der grob wir folgt aussieht (das ist das Original):
https://docs.google.com/spreadsheet/pub?key=0ArNSK5Xga7i7dFI3T3BXdVhaQlJybHJMSlgxdk5JTUE&single=true&gid=0&output=htmlKopiere dir den Export-link in eine Text-Datei. Dann rufe ihn in einem neuen Tab auf (sieht aus wie die das Original-Spreadsheet nur ohne Bearbeitungsmöglichkeiten), speichere das ganze (strg+s) als "map.html".
Schritt 2: Die Dateien in deinem Webspace...
Du brauchst ein klein wenig webspace (oder einen lokalen webserver). Am besten einen der ein bisschen PHP kann. Geht zu Not auch ohne, ist dann aber mehr Handarbeit.
Lade tcrawl.zip aus meinem Anhang herunter und entpacke es in deinen Webspace.
Ersetze die Datei "map.html" (NICHT "map.php") mit der html Datei aus Schritt 1.
Wenn du die Seite über deinen Webspace aufrufst solltest du nun die alte Map sehen aber links oben im ersten Hex sollte "Test für My Crawl" sehen. Statt "Schlachtfeld von Nahtun..." sehen.
Soweit, hoffenlich so gut. Wenn dein Webspace kein php kann müsstest du immer wieder die Datei exportieren und als map.html hochladen, nur wer will das schon?
Schritt 2b (Optional, wenn du nicht händisch aktualisieren magst):
Bearbeite nun die Datei "map.php". Falls du noch ein altes Windows 10 oder davor hast, lade lieber Notepad++ stat dem mitgeliefertem Editor von Windows, ansonsten sollte jeder halbwegs moderne text-editor reichen. Bearbeite die folgende Zeile :
$html = file_get_contents("
https://docs.google.com/...");
Stze dort zwischen den "Anführungstrichen" den Export-Link ein den du bei Schritt 1 in die Text-Datei gepackt hast.
Dann kannst du über den Button "Google Doc aktualisieren" die jeweils neuste Export-Version vom GoogleDrive auf deinen Webspace laden.
Jedenfalls, wenn dein Webspace php kann und php entfernte Dateien lesen darf. Also einfach mal die Test-zeile im Google-Doc verändern, sagen wir, "My Crawl for real" und den Button "Google Doc aktualisieren" in deinem Webspace klicken.
Im Idealfall steht nun "My Crawl for real" im ersten Hex.
Wenn da wieder das "Schlachtfeld von Nathun..." steht, ist "map.php" noch nicht bearbeitet/gespeichert worden.
Mit ein bisschen Pech steht dort immer noch "Test für My Crawl" dann hat dein PHP entweder keine Rechte externe Daten zu lesen, oder bei der Bearbeitung von map.php ist etwas schief gelaufen. Vielleicht hat auch dein Webserver keine Rechte die Dateien zu bearbeiten. In dem Fall muss der Webserver entsprechende Rechte bekommen. Hier hilft es am ehesten das Server-Log anzusehen.
Schritt 3: Deine Karte einsetzen:
Kopiere deine neue Karte in den webspace. Entweder nennst
du sie auch TanelornHexcrawl2.jpg (und überschreibst damit das Original)
oder du bearbeitest folgende Zeile in "index.html":
props :{cid:'#main', MapSrc:"TanelornHexcrawl2.jpg"},
Also z.B. MyHexCrawl.jpg (Vorsicht: Groß- und Kleinschreibung ist
den meisten Webservern wichtig):
props :{cid:'#main', MapSrc:"MyHexCrawl.jpg"},
Schritt 4: Feinschliff:
Jetzt wirds ein bisschen Pech frickelig.
Immer noch in der "index.html" folgende Zeile suchen:
hex :{sideLength:36.25,ycorr:0.25,xcorr:-0.9},
Hier kannst du größe der Hexes bestimmen indem dur die Länge einer der sechs Seiten deines Hexes angibst. Kommt dann in sideLength, d.h. falls das vom Original abweicht.
"ycorr:0.25,xcorr:-0.9" korrigieren ein wenig den "Anzeiger", der Kreis, der mittig angezeigt wird, wenn der Text zum Hex nicht leer ist.
Im Anschluss "leert" man am besten dass
*eigene* Google-Doc (im Prinzip kann alles unter der Zeile 1 weg) und passt ggfs. unter A und B die möglichen Hexes in Breite und Höhe an. Aktuell gehen Spalte A und B jeweils von 00-31 (also 32 breit/hoch) und falls man ein eigene Karte mit 16 x 16 oder 64x64 hat, müsste man hier die Spalten entsprechend neu beziffern (0-15, bzw. 0-63), damit das Programm sie zuordnen kann. Auch "Sonderformate" wie 16x84 o.ä. sollte das Programm mitmachen (dann halt 0-15 in A und 0-83 in B) es nimmt einfach treudoof mit was in der Tabelle steht.
--------
Ich hoffe das hilft. Soweit kann man damit jedenfalls arbeiten, ohne dass ich meinen Spagetthi-Code nochmal komplett auseinander nehmen muss
. Falls ich mich zuletzterem noch mal aufraufe (oder das ganze nochmal von vorn aufrolle, was vermutlich einfacher wäre), ein Memo an mich selbst, was man sich für die Zukunft noch vornehmen könnte:
-Die Seite ein wenig "Responsive" gestalten. Sie ist seit Ewigkeiten ziemlich fix auf 1920x1080 eingestellt und das nicht mal gut. Sieht ziemlich schäbig aus.
-Konfigurationen im allgemeinen und den Hex-Cursor im speziellen weniger frickelig einstellbar machen. Vielleicht direkt über Menüs in der Seite?
-Live-Bearbeitung der Inhalte in der Seite? Google-Docs kann man mW nicht von extern mit Inhalten füttern, müsste man über eine eigene Datei (SQLite oder so) machen. So wäre man von Google-Docs unabhängig. Bräuchte dann aber auch wieder User-Rechte, Passwörter und Gedöns (sonst schreibt einem der nächste Troll/Chatbot die Karte voll, oder leert sie nach belieben).
Falls ihr es einsetzt wäre es cool einen Link zu euren HexCrawls zu sehen :-)
[gelöscht durch Administrator]
Thema: DIY Tanelorn-Hexcrawl-Betrachter (Gelesen 1007 mal)
