Location sinnvoll von Usern anlegen lassen
Martin_Online
- programmiertechnik
1 hotti0 Martin_Online0 hotti
0 Tom0 Martin_Online0 Tom
Guten Abend,
irgendwie komme ich an einer Stelle nicht wirklich weiter bzw. ich weiß nicht wie ich dieses umsetzten soll. Ein User darf bei mir eine Location anlegen, dazu muss er Grunddaten eine Beschreibung sowie ein Bild angeben.
Grunddaten und Beschreibung habe ich bereits (beides in einer Datei), dieses sieht derzeit so aus (Designtechnisch ist dieses noch nicht 100%)
Nun fehlt mir noch ein Bild, ich dachte ich füge dazu einen Schritt 2 ein. Denn wenn das Bild zu groß ist, kann dieses vom User beschnitten werden. Dazu geht eine neue Seite auf, das Bild wird angezeigt und mit http://deepliquid.com/content/Jcrop.html auf Größe gebracht.
Wenn ich alles auf eine Seite packe, der User füllt das Formular aus, will dann ein Bild hochladen und es auf Seite zwei gewechselt wird sind seine Eingaben weg, ist sehr unschön. Zwei speichern Button auf einer Seite halte ich auch nicht für wirklich optimal.
Wenn ich jetzt mit Schritt 1 & Schritt 2 arbeite, sollte ich dieses in einer Datei unterbringen oder doch lieber auf zwei separate Dateien verteilen? Wie kann ich verhindern, dass die zweite Datei (Schritt 2) aufgerufen wird bevor die erste nicht ausgefüllt und gespeichert ist?
Ich bin an diesem Punkt einfach ahn ahnungslos, denke schon den ganzen Tag über dieses Problem nach. Habt Ihr eine Idee?
Eine letzte Idee, wenn ich wirklich mit Schritten arbeiten sollte, wäre es dann vielleicht angebracht meine Beschreibung auch in einen eigenen Schritt zu packen? Das würde dann so ablaufen:
Schritt 1 – Grunddaten
Schritt 2 – Beschreibung
Schritt 3 - Bild
So wäre alles schön getrennt und übersichtlich, das haltet ihr davon?
Sollte bei einer Location später weitere Optionen hinzukommen, könnten diese ohne weiteres in Schritt t2 mit untergebracht werden.
Jetzt kommt mir noch eine weitere Idee (da wäre es dann egal wenn ein User Schritt 3 vor Schritt zwei Aufruft, diese sieht wie folgt aus
Schritt 1 – Name der Location
Schritt 2 – Grunddaten
Schritt 3 – Beschreibung
Schritt 4 – Bild
Schritt 1 muss zuerst gespeichert werden, erst dann sind weitere Punkt anklickbar. Damit hätte ich eine eindeutige Location ID und könnte in den weiteren Schritten nur ein Update des Datensatzes machen. Somit ist der User komplett frei, welcher Schritt er zuerst machen möchte.
hi,
Wenn ich alles auf eine Seite packe, der User füllt das Formular aus, will dann ein Bild hochladen und es auf Seite zwei gewechselt wird sind seine Eingaben weg, ist sehr unschön. Zwei speichern Button auf einer Seite halte ich auch nicht für wirklich optimal.
Isses auch nicht. Ich würde das so machen:
User zieht seine Daten (Texte und Bild) per ajax in den Browser
kein Reload
User bearbeitet alle Daten (Texte und Bild) offline im Browser
kein Reload
User klickt nur einen Button, so geht alles zusammen (Texte und Bild) zurück zum Server
kein Reload
Ich bin an diesem Punkt einfach ahn ahnungslos, denke schon den ganzen Tag über dieses Problem nach. Habt Ihr eine Idee?
Siehe oben, wäre das was?
MfG
Hallo,
Isses auch nicht. Ich würde das so machen:
User zieht seine Daten (Texte und Bild) per ajax in den Browser
kein Reload
User bearbeitet alle Daten (Texte und Bild) offline im Browser
kein Reload
User klickt nur einen Button, so geht alles zusammen (Texte und Bild) zurück zum Server
kein Reload
Siehe oben, wäre das was?
das wäre natürlich das Optimale, User füllt das Formular aus, klickt auf Bild hochladen, wählt das Bild von seiner Festplatte, das Bild wird im Hintergrund hochgeladen, nun kann der User einen Ausschnitt wählen und klickt auf speichern.
Aber da bin ich ehrlich zu mir selber, dieses bekomme ich mit Ajax nicht hin, da ich darin so gut wie keine Erfahrungen habe.
das wäre natürlich das Optimale, User füllt das Formular aus, klickt auf Bild hochladen, wählt das Bild von seiner Festplatte, das Bild wird im Hintergrund hochgeladen, nun kann der User einen Ausschnitt wählen und klickt auf speichern.
Ach das geht noch schiel vöner, Texte und
Hochgeladen wird dann alles zsammen, Texte mit Grafik :)
Aber da bin ich ehrlich zu mir selber, dieses bekomme ich mit Ajax nicht hin, da ich darin so gut wie keine Erfahrungen habe.
Machs einfach, die Erfahrung kommt dann automatisch mit. Und wenn Du aus Fehlern lernen kannst, darfste auch welche machen ;)
Hello,
Ach das geht noch schiel vöner, Texte und
Hochgeladen wird dann alles zsammen, Texte mit Grafik :)
Und was ist dann, wenn noch was auzusetzen ist? Kann man das auch wieder alles in das Offline-Modul zurückschicken zur Korrektur? Sonst wird es den user sicherlich verärgern.
Liebe Grüße aus dem schönen Oberharz
Tom vom Berg
Moin,
Und was ist dann, wenn noch was auzusetzen ist? Kann man das auch wieder alles in das Offline-Modul zurückschicken zur Korrektur?
Siehe mein erster Post: User meldet sich an und zieht eine Replik mit seinen Daten, Texte und Bild. Hierbei ist die Ajax-Response ein ArrayBuffer, da ist alles drin.
Zur Bildbearbeitung brauchst Du von hier bspw. nur das Schneidwerkzeug. Über das canvas-Element kriegst Du die Binary vom Bildausschnitt, die wird in einem Vorschau-Element gezeigt, damit der User auch sieht, was er da macht. Texte: Die stehen in den Eingabefeldern, wenn die Replik gezogen wurde.
Ich baue heute mal eine kleine Demo, vorerst ohne JCrop; Daten serverseitig in der Session.
hi,
Wenn ich alles auf eine Seite packe, der User füllt das Formular aus, will dann ein Bild hochladen und es auf Seite zwei gewechselt wird sind seine Eingaben weg, ist sehr unschön. Zwei speichern Button auf einer Seite halte ich auch nicht für wirklich optimal.
Isses auch nicht. Ich würde das so machen:
User zieht seine Daten (Texte und Bild) per ajax in den Browser
kein Reload
User bearbeitet alle Daten (Texte und Bild) offline im Browser
kein Reload
User klickt nur einen Button, so geht alles zusammen (Texte und Bild) zurück zum Server
kein Reload
Danke für das Sternchen. Als kleine Gegenleistung:
Hier ist meine Demo
Upload: Privatsphäre ist sichergestekllt, die Daten (Text und Bild) liegen in der Session, da sieht jeder Benutzer nur Seins.
Viel Spaß damit ;)
Danke für das Sternchen. Als kleine Gegenleistung:
Hier ist meine Demo
WOW wie machst du es, dass die Bilder immer gut aussehen? Egal ob ich ein Quer bzw. Hochkanntbild nehme. Jetzt müsste man noch ein Schritt weiter gehen und zwar dass man dem User die Möglichkeit gibt, ein Bildausschnitt zu wählen, die Breite passt aber die Höhe, meine Bilder haben alle ein Format von 310px × 310px.
Danke für das Sternchen. Als kleine Gegenleistung:
Hier ist meine DemoWOW wie machst du es, dass die Bilder immer gut aussehen?
In der Demo wird diesbezüglich gar nichts gemacht. Du könntest mit
imgobj.naturalWidth
imgobj.naturalHeight
das eingefügte Image abfragen und entsprechende Attribute ins DOM setzen.
JPEG, PNG usw. ergeben am Dateianfang eine Magic-Number, so kannst Du auch das abfragen über den ArrayBuffer und ein entsprechendes DataView.
Es reichen auch 2 Bytes:
if(number_1 == 255 && number_2 == 216){ type = 'jpeg' }
else if(number_1 == 137 && number_2 == 80){ type = 'png' }
Egal ob ich ein Quer bzw. Hochkanntbild nehme. Jetzt müsste man noch ein Schritt weiter gehen und zwar dass man dem User die Möglichkeit gibt, ein Bildausschnitt zu wählen, die Breite passt aber die Höhe, meine Bilder haben alle ein Format von 310px × 310px.
JCrop und canvas
Aber das ist auch für mich noch ein Stück Arbeit. Machbar ist es.
hi,
Aber das ist auch für mich noch ein Stück Arbeit. Machbar ist es.
Es lohnt sich. Weil: Der Bildschnitt kann komplett im Browser erledigt werden. Entgegen den von mir bisher gefundenen Tutorials zu JCrop, werden
die Daten nicht erst zum Server gesendet, sondern gleich im Browser verarbeitet, so dass eine neue Grafikdatei entsteht. Zur Demo: Speichern unter…
Schönes Wochenende
Es lohnt sich. Weil: Der Bildschnitt kann komplett im Browser erledigt werden. Entgegen den von mir bisher gefundenen Tutorials zu JCrop, werden
WOW kann ich dazu nur sagen :o Hammer geil! Wäre froh, wenn ich das auch irgendwann mal hinbekomme. Wie lange bist du an dem Script gesessen?
Es lohnt sich. Weil: Der Bildschnitt kann komplett im Browser erledigt werden. Entgegen den von mir bisher gefundenen Tutorials zu JCrop, werden
WOW kann ich dazu nur sagen :o Hammer geil! Wäre froh, wenn ich das auch irgendwann mal hinbekomme. Wie lange bist du an dem Script gesessen?
Schön, dass Du fragst :)
Also: Gestern nachmittag… effektiv bin ich jedoch schon länger an solchen Sachen dran. Der echte Hammer ist das canvas-Element und JCrop (das hattest Du ja hier verlinkt) nimmt Dir Einiges an Aufwand ab. Wenn Du in den Quellcode schaust, ist das gar nicht soviel wonach es aussieht. Interessant wirds, wenn Du ein Image mit width > 640px einfügst, das wird zwar verkleinert dargestellt, aber der Ausschnitt wird auf die Originalgröße umgerechnet; so wirkt das wie eine Lupe.
Programmieren ist wie Schwimmen lernen: Üben, Üben und Üben. Basics sind sowas wie das Luftholen, das muss in Fleisch und Blut übergehen, erst dann kannst Du Dich auf andere Wesentlichere Dinge konzentrieren, z.B. wie Du beim Kraulen einen optimalen Schub erzeugst, das ist beim Programmieren ganz ähnlich. Stets jedoch ist am Anfang die Idee, so brauchst Du auch für gezielte Übungen ersteinmal eine Idee… Das oben verlinkte Demo-Teil insofern zu erweiteren, als dass damit ein Benutzer Bild + Texte hochladen kann, wobei er beim Bild gleich einen Ausschnitt festlegen kann, ist dann kein großartiger Akt mehr.
Mein heutiges Ziel: Bild in den Browser ziehen und RGB nach CMYK umrechnen ohne Upload, das geht alles Lokal mit den neuen Features, die so neu nun auch wieder nicht sind, dafür aber sehr umfangreich <- hier läuft die Zeit weg.
Viele Grüße :)
Hello,
Schritt 1 – Name der Location
Schritt 2 – Grunddaten
Schritt 3 – Beschreibung
Schritt 4 – Bild
Schritt 5 - Ansicht komplett und "absenden" durch den User
Denk an den [X] für die Anerkennung der AGB und übertragunng der
Rechte an Bild und Text
Schritt 6 - Freigabe durch den Redakteur
Schritt 1 muss zuerst gespeichert werden, erst dann sind weitere Punkt anklickbar. Damit hätte ich eine eindeutige Location ID und könnte in den weiteren Schritten nur ein Update des Datensatzes machen. Somit ist der User komplett frei, welcher Schritt er zuerst machen möchte.
Klar, Du willst doch, dass alles richtig ausgefüllt wird.
Da kann man dann aus jedem Teilschritt ein Affenformular machen.
Man kann solange alles in der Session speichern, auch das Bild.
Und beim Bild darauf achten, dass es wirklich nur ein Bild und unschädlich ist, also keine verkappte Scriptdatei oder .htaccess oder sonstwas Angriffsl(u|i)stiges.
Liebe Grüße aus dem schönen Oberharz
Tom vom Berg
Hallo Tom,
Schritt 5 - Ansicht komplett und "absenden" durch den User
Denk an den [X] für die Anerkennung der AGB und übertragunng der
Rechte an Bild und Text
Punkt 5 muss ein User bereits in den AGB bestätigen, die beim registrieren angeklickt und zugestimmt werden müssen. Beim Bildupload muss der User ebenfalls eine Checkbox anklicken um ein paar Rechtliche Sachen zu klären, erst wenn dieser Haken gesetzt ist, erscheint der Button.
Schritt 6 - Freigabe durch den Redakteur
Punkt 6 habe ich hier nicht aufgelistet, da dieser nicht wirklich den User etwas angeht, dieses passiert im Admin Bereich bzw. derzeit noch in der Datenbank (Händisch)
Und beim Bild darauf achten, dass es wirklich nur ein Bild und unschädlich ist, also keine verkappte Scriptdatei oder .htaccess oder sonstwas Angriffsl(u|i)stiges.
Das heißt wenn ich dich richtig verstanden habe, würdest du mit einzelnen Schritten arbeiten?
Hello,
Das heißt wenn ich dich richtig verstanden habe, würdest du mit einzelnen Schritten arbeiten?
Ja, würde ich.
Und ich würde dem User auch vorher klipp und klar machen, dass er da mehrere "Seiten" richtig ausfüllen muss, bevor er dann alles nochmal gezeigt bekommt (das meinte ich mit Schritt 5), um es tatsächlich abzuschicken. Das würde ich auf jeden Fall ganz fett hervorheben, weil es die Angst nimmt, etwas falsch machen zu können.
Ob man nun die Seiten voneinander abhängig macht (Seite n+1 erst ausfüllbar macht, wenn n fertig ist), oder jede für sich ausfüllbar/korrigierbar macht, ist Geschmackssache. Der User muss auf jeden Fall hin und her blättern können. Und erst, wenn alle fertig sind, kann er den Vorgang abschließen.
Liebe Grüße aus dem schönen Oberharz
Tom vom Berg