Nicht sicher, wie man über diese Javascript/Imagebild/PHP Problem

Question

Ich versuche herauszufinden, die beste oder effizienteste Art, dies zu tun.

Meine Website ist in PHP auf der Serverseite geschrieben, mit einer MySQL DB und javascript und jQuery auf der Client-Seite.

Der Benutzer kommt auf diese eine bestimmte Seite (d. H. Map.php), die eine Image Map enthält. Es gibt fünf verschiedene anklickbare Bereiche auf dieser Karte. Jeder Bereich enthält eine Reihe von Bildern, die in die Warteschlange gehen und jedes Bild nacheinander laden, wenn der Benutzer auf das Bild klickt. Wenn Sie beispielsweise auf Bereich A klicken, wird möglicherweise die Warteschlange A1.jpg, A2.jpg, A3.jpg, A4.jpg, map.jpg generiert. Zuerst wird das Bild A1.jpg geladen, wenn der Benutzer auf das Bild klickt, dann lädt es A2.jpg usw. Das letzte Bild bringt sie zurück zur Hauptkarte.

Wenn sie auf einen der fünf Bereiche auf der Hauptkarte klicken, entfernt javascript alle anklickbaren Bereiche und erstellt einen neuen Bereich, der das ganze Bild darstellt, auf das der Benutzer klicken kann. Wenn Sie zu map.jpg zurückkehren, werden auch die fünf Imagemap-Bereiche hinzugefügt.

Um die Dinge etwas komplizierter zu machen. Keiner der 5 Bereiche hat die gleiche Warteschlange und Sie werden möglicherweise nicht immer wieder zur selben Bildwarteschlange zurückkehren.

Zum Beispiel, wenn Sie zum ersten Mal auf Bereich A klicken, können Sie A1, A2, A3, A4 und Karte durchlaufen. Beim zweiten Mal, wenn sie nach A zurückkehren, könnte die Warteschlange A3, A4, Karte sein. Ein Auslöser durch Anzeigen einer externen Seite (außerhalb von map.php) kann die nächste Warteschlange in A5, A3, A4 oder A6, A3, A4 oder A7, A3, A4 umwandeln. Eine letzte Bildwarteschlange könnte A8, A9, A10, A11, A12, ... A18 sein.

Und Bildbereich B, C, D und E können alle unterschiedliche Bildwarteschlangen haben.

Jetzt versuche ich darüber nachzudenken, wie man das macht, aber egal wie ich es versuche und schreibe, es scheint übermäßig kompliziert und es muss einen besseren Weg geben. Ich dachte daran, möglicherweise jede mögliche Bildwarteschlange in der DB zu speichern und dann zu speichern, welcher "Status" jeder Benutzer in map.php ist. Aber der Datenbankstatus muss sich vielleicht ändern und da das Frontend in Javascript ist, war ich mir nicht sicher wie ich das machen soll. Es gibt auch das Problem, die Bilder vorab zu laden und sie so flüssig wie möglich zu machen.

Deshalb bin ich hier um zu versuchen und nach Ideen und Vorschlägen zu fragen, versuche Ideen herumzupreschen und mir dabei zu helfen einen besseren Weg zu finden.

Answer 1

Klingt, als würden Sie einen Google Maps-Klon machen.

Sie können versuchen, den Status serverseitig in einer Sitzung zu speichern. Wenn ein Benutzer auf A1 klickt, führt er eine Ajax-Anforderung aus, die besagt, dass auf den Server A1 geklickt wurde, und der Server antwortet mit einer Liste von Bildern für den vergrößerten Bereich von A1.

Auf diese Weise kann der Server, wenn der Benutzer die Ansicht verkleinert, mit dem richtigen Satz von Bildern basierend auf dem zuvor angeklickten Bereich antworten.

Sie könnten die Bilder in einer hierarchischen Datenbank speichern. Also hat Bild A1 ein Elternbild von A. Sie klicken auf A zoomen, machen eine Abfrage, um alle Bilder zu erhalten, die ein Elternteil von A haben und Ihnen die neue Karte geben.

Ähnlich, wenn Sie die Ansicht verkleinern klicken, haben Sie A in der Session gespeichert, so dass Sie alle Bilder, die die gleichen Eltern wie A. haben

Also alles, was Sie in der Sitzung speichern, müssen eine Warteschlange angeklickt ist Bilder. Sie drücken auf die Warteschlange, wenn Sie heranzoomen, und entfernen die Warteschlange, wenn Sie herauszoomen.

Answer 2

Sie sagen, dass jede "Warteschlange" aus einer Laune heraus ändern kann.Wenn ein Client die Hälfte einer Warteschlange durchläuft, ist es akzeptabel, dass der Client sich nur unwissend über eine Aktualisierung verhält und seine aktuelle Warteschlange beendet?

Der Client könnte immer noch über die neuesten Aktualisierungen informiert sein, aber nur Aktualisierungen anwenden, wenn die Warteschlange durchquert wurde und zur Karte zurückgekehrt ist. Dies erleichtert das Vorladen von Bildern. Er könnte damit beginnen, die Bilder in den neuesten Versionen der Warteschlangen vorzuladen, während er weiterhin seine aktuelle Warteschlange durchläuft.