Grundaufbau Admin-Bereich Design

[hamst0r]

Hallo,
ich habe auf meiner Homepage einen Administrations-Bereich, in dem ich auch für eine Bilder-Galerie Bilder hochladen kann, dabei wird automatisch auch eine Thumbnail erstellt.
Außerdem ist es möglich die Bilder aus der Galerie zu entfernen und dabei auch direkt die Datei zu löschen (Thumbnail auch). Dies ist jedoch nicht alles zusammen auf einer Seite, sondern aufgeteilt in Upload und Galerie. Ich hätte es lieber alles zusammen übersichtlich und Benutzerfreundlich, bzw Administratorfreundlich auf einer Seite.

Bisher gibt es keine Möglichkeit die vorhandenen Bilder anzusehen, da mir einfach nicht einfällt wie die Bilder anzeigen lassen könnte. Ich würde am liebsten direkt dabei ein Bearbeitungsfeld haben, wo ich den Dateinamen ändern kann, das Bild löschen und es der Galerie hinzufügen und auch wieder entfernen lassen kann. Bei der Upload Funktion sollte außerdem eine Nachfrage sein, ob auch ein Thumbnail erstellt werden soll.

Ich möchte auf keinen Fall ein fertiges Design mit Effekten oder Anderem, sondern lediglich einen Grundaufbau, der meinetwegen auch gerne mit Paint gemalt werden darf.

Also kurz Zusammengefasst möchte ich einfach eine Übersicht mit Bearbeitungsfunktion der hochgeladenen Bilder auf dem Server.

Wäre super wenn ich ein paar Ideen kriegen würde um meine Denkblockade zu überwinden.

Gruß hamst0r

 

[DarkMo]

also mit zeug uploaden hab ichs jetz auch noch nich so gehabt, daher kA. aber der rest sollte doch mit php kein ding sein oder?

wegen thumbnail erstellen:

<?php
     include("something.php"); // sofern nötig

     if(isset($_GET['imgName']) && $_GET['imgName'] != '') {
          $path = 'pfad/';
          $thumb_w = 157;
          $thumb_h = 102; // sind die maße der pcghx thumbs hier als bsp ^^
          $file = $path.$_GET['imgName'].'.png'; // oder welche endung auch immer. oder die endung is teil des namens.
          $img = @ImageCreateFromPNG($file) or die("failed to open image"); // muss dann halt png sein, find ich immer am schönsten
          $thumb = @ImageCreate(imagesx($file), imagesy($file)) or die ("failed to creat thumpnail");
          if(ImageCopyResized($thumb, $img, 0, 0, 0, 0, $thumb_w, $thumb_h, imagesx($file), imagesy($file))) {
               ImagePng($thumb, $path.$_GET['imgName'].'_thumb.png'); // speichert das ding
               ImagePng($thumb); // gibts bild zurück - so kannst du das sehen, was es gebastelt hat ^^
          }
          ImageDestroy($img);
          ImageDestroy($thumb);
     }
?>

hmm, grad fix zusammen gesucht alles, aber sollte funtzen. hier is ne super doukumentation zu php: PHP: GD and Image Functions - Manual
nuja, so solltest du zumindest thumbnails hinbekommen. einfach dann in der "hauptseite" folgendes schreiben (sofern du den schnipsel da oben als createThumb.php speicherst):

uploadImage($_POST['url']); // irgendeine funktion, die das bild hochlädt
$imgName = explode('/', $_POST['url']); // liefert ein array des strings  unterteilt nach /. aus [pfad/img.png] wird also [pfad] [img.png]
$imgName = $imgName[count($imgName)-1]; // uns intressiert nur der letzte teil
$imgName = explode('.', $imgName); // name und endung trennen
$imgName = $imgName[0]; // uns intressiert nur der name
echo 'Bild gespeichert:<br><img src="pfad/'.$imgName.'.png">';
if(isset($_POST['createThumb'])) { // wenn im forumlar angegeben wurde, es soll eins erstellt werden
     echo '<br><br>Thumbnail-Prewview:<br><img src="pfad/createThumb.php?imgName='.$imgName.'.png">'; // per forumlar übermittelter bildname
}

jo, so sollte das gehn. und dieser schnipsel hier bekommt seine daten halt von er seite mit nem formular wie diesem hier:

echo '<form name="imgUpload" action="pfad/imgUpload.php" method="post">'; // sofern der schnipsel hier oben als imgUpload.php gespeichert wurde, und da methode = post ist, muss man die werte per $_POST array un ned per $_GET auslesen
echo 'Bildpfad zum uploaden: <input type="text" size="20" maxlength="100" name="url" class="text" value="">'; // name url => $_POST['url']
echo 'Thumbnail erstellen? <input type="checkbox" name="createThumb" class="text" value=""> // name createThumb => $_POST['createThumb']';
echo '<input type="submit" name="upload" value="Hochladen">';
echo '</form>';

die letzten beiden kann man zum bsp auch sehr bequem in einem vereinen:

// schauen, ob der button gedrückt wurde
if(isset($_POST['upload'])) { // name des submit buttons prüfen
     uploadImage($_POST['url']); // irgendeine funktion, die das bild hochlädt
     $imgName = explode('/', $_POST['url']); // liefert ein array des strings   unterteilt nach /. aus [pfad/img.png] wird also [pfad] [img.png]
     $imgName = $imgName[count($imgName)-1]; // uns intressiert nur der letzte teil
     $imgName = explode('.', $imgName); // name und endung trennen
     $imgName = $imgName[0]; // uns intressiert nur der name
     echo 'Bild gespeichert:<br><img src="pfad/'.$imgName.'.png">';
     if(isset($_POST['createThumb'])) { // wenn im forumlar angegeben wurde, es soll eins erstellt werden
          echo '<br><br>Thumbnail-Prewview:<br><img  src="pfad/createThumb.php?imgName='.$imgName.'.png">'; // per  forumlar übermittelter bildname
     }
}

// das formular bauen
echo '<form name="imgUpload" action="pfad/imgUpload.php"  method="post">'; // das ganze ding hier würde dann imgUpload.php heissen und die daten an sich selber senden
echo 'Bildpfad zum uploaden: <input type="text" size="20"  maxlength="100" name="url" class="text" value="">'; // name url =>  $_POST['url']
echo 'Thumbnail erstellen? <input type="checkbox" name="createThumb"  class="text" value=""> // name createThumb =>  $_POST['createThumb']';
echo '<input type="submit" name="upload" value="Hochladen">';
echo '</form>';

so, jetz hoff ich nurnoch, dass ich keine flüchtigkeitsfehler begangen hab un das auch alles so funzt >< und vorallem, das es dir hilft ^^

 

[hamst0r]

Oh man, vielen Dank, aber ich glaube du hast dir viel zu viel Arbeit gemacht. Der Code ist so gut wie fertig, ich wollte ein Design Grundgerüst haben.
Ich werde mir deine Formulare trotzdem mal ansehen.

Sowas wollte ich eher. Jedoch weiß ich nicht, wie ich die Bearbeiten Option mit einbringen könnte, also Bild unbenennen, löschen, etc.

 

[JimSim]

Naja, Standard wäre wohl, wenn du jedem Bild ne Radiobox packst, und dann unten die Optionen auflistest... So das du dann nen Bild per Radio auswählst, und dann die entsprechende Option drückst. Das ist zumindest Platz sparend.
Aber kommt immer drauf an wie viele Bilder du hast... Andere Option wäre es durch den Klick auf's Bild ein darüber liegenden Fenster mit dem vergrößerten Bild anzuzeigen, wo dann die Funktionen unten eingeblendet werden. Ähnlich so wie bei Facebook z.B.

 

[nay]

Schau dir mal dieses Plugin an: jQuery File Upload Demo

Das kann man einfach so in die Website reinhauen, ich finde das perfekt für das was du willst.