bildergallerie - eigenbau

P

philomatrix

Grünschnabel
Hallo!
Ich bin PHP-Anfänger, und habe erade meine eigens kreierte Foto-Gallerie zusammengebaut.
Kann von euch jmd kurz mal über den code fliegen, ich glaube ich hab mich mehrmals "verheddert", d.h. es könnte sein, daß ich bestimmte sachen an der falschen Stelle stehen hab, oder das ganze ziemlich umständlich gecodet ist.

aufbau:
bildergallerie- 3 tabellen:
tabelle 1: kategorie (natur,menschen,gebaeude....)
tabelle 1-Felder: ID und katname

tabelle 2: pics_thumb (thumbnails der bilder, "echte" miniaturen,also nicht in laufzeit generiert...)
tabelle 2-Felder: ID, kategorie (id), img, datum, beschreibung

tabelle 3: pics (die echten bilder)
tabelle 3-Felder: ID, kategorie (id), img, datum, beschreibung

-Anmerkung: ich weiß, Datum und Beschreibung der Thumbs brauch ich nicht unbedingt...

Struktur:
quasi 3spaltiges Layout;
links = kategorieauswahl
mitte = Thumbnails
rechts = detailansicht

Anforderungen:
1.-der Besucher soll zwischen einzelnen Bildkategorien (per drop down menu) auswählen können
2.die jeweils ausgewählte Kategorie soll im drop down sichtbar sein (default?)
3.der Kategoriename soll über den jeweiligen Thumbnailbildern ständig sichtbar sein
4.die Gallerie soll auch ohne Javascript funktionieren
5. wenn jmd trotzdem Javascript aktiviert hat (ohne überprüfung), soller das rechts angezeigte Einzelbild in einem Popup-Fenster vergrößert dargestellt bekommen

-bis dahin ja noch "einfach";

Ablauf:
Vorgang A
1)links=onload werden die Kategorien (id,katname) ausgelesen und im dropdownmenu
angezeigt

2) mitte=leer (evtl. könnte ich hier noch eine * - Übersicht einbauen...)

3) rechts= status ("kein Bild angezeigt")..+ hinweis, daß für die große ansicht JS aktiviert sein muss

-Vorgang B:
Auswahl einer Kategorie:
Klick auf Kategorie - > reload der Seite + Vorgang A1), B2)=Thumbnailanzeige+Katname,B3) = A3)

-Vorgang C:
Auswahl eines Thumbnailbildes:
Klick auf Thumnailbild-> reload der Seite + Vorgang A1),Vorgang B2),
C3)=Anzeige Einzelbild mit beschreibungstext


---soweit, so gut ---

Das Problem, welches sich mir stellt(e):
Bevor ich eine alles umfassende Abfrage "$_GET['kategorie']!='' " gemacht habe,
"verschwand" die Thumbnailanzeige, sodaß nur das Einzelbild angezeigt wurde.

es gibt wohl noch eine elegantere Lösung (ohne JS)...? oder?
nun folgend mein code....
 
PHP: 
<?php
####################	INCLUDES ####################
# Datenbankverbindung aufbauen
	include( '../../sic/script_include/db_inc.php' );

# Kategorien auslesen
	include( '../../sic/script_include/querys_inc.php' );	

# Fehlermeldungen deaktivieren 
	ini_set('display_errors', 0);
#------------------------------------------------------------------------------------------#
# wenn variable kategorie INHALT hat (inhalt wurde in thumbnailgallerie durch anklicken eines aufgelisteten bildes übermittelt) <br />
# status: kategorie ausgewählt, thumbnailbild geklickt
if ($_GET['kategorie']!="")
{
	echo '
			<div id="pagewrapper">
				<div id="top">
				<div id="center">
					<div id="mainmenu">
						<div id="mainmenu_content">
							<ul>
								<li><a href="../../index.html" target="_self" class="redhover">start</a></li>
								<li><a href="../over/over.html" target="_self" class="redhover">&uuml;ber mich</a></li>
								<li><a href="../projekte/fotografie/projekte_foto.html" target="_self" class="redhover">meine projekte</a></li>
								<li><a href="bilder.php" target="_self" class="menuactred">bilder</a></li>
							</ul>
						</div>
					</div>
					<div id="teaser" class="teaserbgred">
						<div id="teasercontent">
									<h1 class="redheader">Auf den Blickwinkel kommt es an</h1>
									<p>Den Fl&uuml;gelschlag eines Schmetterlings f&uuml;r die &quot;Ewigkeit&quot; festhalten...die fastzinierende 
									Ausstrahlung von Ruhe und allgegenw&auml;rtig sp&uuml;rbare Majest&auml;t von mittelalterlichen 
									Burgen und Festungen.</p>    
									<p>All diese Eindr&uuml;cke (und viele mehr) kann ein Foto festhalten.</p>
						</div>
					</div>
					<div id="meta">
						<ul>
							<li><a href="../meta/kontakt.php" target="_self">Kontakt</a></li>
							<li><a href="../meta/impressum.html" target="_self">Impressum</a></li>
						</ul>
					</div>
				</div>
				<div id="bottom">
						<div id="bottom_menu">
							<div id="kategorieauswahl">
									<div class="notice">W&auml;hlen Sie bitte eine Kategorie:</div>
										<form action="bilder.php" method="POST" name="katauswahl" id="katauswahl">
	';

####################	In DB vorhandene Kategorien auslesen und ausgeben	####################
								$get_kat = $_GET['kategorie'];
								$katdata = kat_select();
												echo ('<select name="kategorie" size="1">');
								
								foreach( $katdata as $row){
												echo ('<option value="'.$row['ID'].'">'.$row['katname'].'</option>');
								}

								# Name der Kategorie auslesen, die gerade aktiv ist
								$abfrage = "SELECT katname FROM kategorie WHERE kategorie.ID = '$get_kat'  ";
								$ergebnis = mysql_query($abfrage);
								while($row = mysql_fetch_object($ergebnis))
								{
								$get_katname = $row->katname;
								}
								
#----------------------------------------------------------------------------------------------------------------------------------------------------#
						
	echo '						
							  </select>	
									<input name="submit" type="submit" class="bold" value="Auswahl best&auml;tigen" width="10" id="submit"> 
								  </form>
				</div>			
			</div>
			<div id="bottom_lrand"></div>
			<div id="bottom_content">
				<div class="bottom_content_article">
					<h2 class="redheader">...Bilder, die die Welt bedeuten</h2>
						<div id="thumbnail">
							<h3 class="redheader">Thumbnails: '.$get_katname.'</h3>
								<table class="tbl_tmbimg">
									<tr>
	';
	
####################	Die durch das Formular weitergegebene Variable "kategorie" (id)  verarbeiten	####################
# Alle Thumbnailbilder mit der selektierten kategorie-id auslesen und ausgeben
								$sendid = $_GET['id'];
								$abfrage = "SELECT pics_thumb.* FROM pics_thumb WHERE pics_thumb.kategorie = '$get_kat'  ";
								$ergebnis = mysql_query($abfrage);
								$i = 0;
								while($row = mysql_fetch_object($ergebnis))
								{
									if($i%3 == 0)
									{
												echo '	</tr>
												<tr><td colspan="3" class="tmbtrenner">&nbsp;</td></tr>
														<tr>';
									}
									;
												echo '<td>
														<a href="bilder.php?id='.$row->ID.'&kategorie='.$get_kat.'&class="singlepic">
															<img id="'.$row->ID.'" class="tmbimg" title="'.$row->beschreibung.'" src="../../bilder/pub/pics/pics_thumb/'.$row->img.'"/>
															<br />
															<!--<div class="bildtitel">'.$row->img.'</div>-->														
														</a>
													</td>';
									$i++; 	
								}
					
#-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------#

	echo '
							</tr>
					  </table>

			  </div>
					<div id="singlepic">
						<h3 class="redheader">Anzeige Einzelbild:</h3>
	';

####################	Anzeige des durch das Thumbnail ausgewählte	Einzelbild  #######################################
# durch den in der thumbnailgallerie um das bild gelegten link werden die variablen zur ausgabe singlepic übergeben
								$sql = "select * from pics where ID = $sendid";
								$res = mysql_query($sql);
							
									while($row = mysql_fetch_assoc($res))
									{
									$IDpic = $row['ID'];
									$titelpic = $row['img'];
									$datumpic = $row['datum'];
									$beschreibungpic = $row['beschreibung'];
									}
								
								# Bildvariablen definieren, mittels javascript verarbeiten (s.o. js-ldatei)	
								$size = getimagesize ('../../bilder/pub/pics/pics/'.$titelpic);
								$bildbreite = $size[0];
								$bildhoehe = $size[1];

								# status: kategorie ausgewählt, thumbnailbild angeklickt
								if ($_GET)
								{

										echo 
											$beschreibungpic.'
											<br />
											<a href="../../bilder/pub/pics/pics/'.$titelpic.'" onclick="javascript:PopUp('.$bildbreite.','.$bildhoehe.',this.href); return false;">	
											<img src="../../bilder/pub/pics/pics/'.$titelpic.'" class="snglimg" border="0" title="'.$beschreibungpic.'" alt="'.$beschreibungpic.'"/>
											</a>
											<br/>'
		
											;
								}
								else 
								# status: kategorie ausgewählt, thumbnailbild noch nicht angeklickt
								{								
										echo '<p class="notice"><br />Kein Bild ausgew&auml;hlt!<br />
												<br />Zum vergr&ouml;ssern auf das Einzelbild klicken (Javascript muss aktiviert sein).
											  </p>
										';
								}
#---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------#
}
# wenn variable kategorie KEINEN INHALT hat (inhalt wurde in thumbnailgallerie noch nicht durch anklicken eines aufgelisteten bildes übermittelt) <br />
# status: start=keine variablen übergeben oder kategorie bereits ausgewählt, thumbnailbild aber noch nicht geklickt
else
{

	$post_kat = $_POST['kategorie'];

	$abfrage = "SELECT katname FROM kategorie WHERE kategorie.ID = '$post_kat'  ";
	$ergebnis = mysql_query($abfrage);
	while($row = mysql_fetch_object($ergebnis))
	{
	$post_katname = $row->katname;
	}

#---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------#

	echo ' else
			<div id="pagewrapper">
				<div id="top"></div>
				<div id="center">
					<div id="mainmenu">
						<div id="mainmenu_content">
							<ul>
								<li><a href="../../index.html" target="_self" class="redhover">start</a></li>
								<li><a href="../over/over.html" target="_self" class="redhover">&uuml;ber mich</a></li>
								<li><a href="../projekte/fotografie/projekte_foto.html" target="_self" class="redhover">meine projekte</a></li>
								<li><a href="bilder.php" target="_self" class="menuactred">bilder</a></li>
							</ul>
						</div>
					</div>
					<div id="teaser" class="teaserbgred">
						<div id="teasercontent">
									<h1 class="redheader">Auf den Blickwinkel kommt es an</h1>
									<p>Den Fl&uuml;gelschlag eines Schmetterlings f&uuml;r die &quot;Ewigkeit&quot; festhalten...die fastzinierende 
									Ausstrahlung von Ruhe und allgegenw&auml;rtig sp&uuml;rbare Majest&auml;t von mittelalterlichen 
									Burgen und Festungen.</p>    
									<p>All diese Eindr&uuml;cke (und viele mehr) kann ein Foto festhalten.</p>
						</div>
					</div>
					<div id="meta">
						<ul>
							<li><a href="../meta/kontakt.php" target="_self">Kontakt</a></li>
							<li><a href="../meta/impressum.html" target="_self">Impressum</a></li>
						</ul>
					</div>
				</div>
				<div id="bottom">
						<div id="bottom_menu">
							<div id="kategorieauswahl">
									<div class="notice">W&auml;hlen Sie bitte eine Kategorie:</div>
										<form action="bilder.php" method="POST" name="katauswahl" id="katauswahl">
	';

####################	Ausgelesene Kategorien ausgeben	####################
					$katdata = kat_select();
									echo ('<select name="kategorie" size="1">');
					
					foreach( $katdata as $row){
									echo ('<option value="'.$row['ID'].'">'.$row['katname'].'</option>');
					}
#--------------------------------------------------------------------------------------------------------------------------#
	echo '						
							  </select>	
									<input name="submit" type="submit" class="bold" value="Auswahl best&auml;tigen" width="10" id="submit"> 
								  </form>
				</div>			
			</div>
			<div id="bottom_lrand"></div>
			<div id="bottom_content">
				<div class="bottom_content_article">
					<h2 class="redheader">...Bilder, die die Welt bedeuten</h2>
						<div id="thumbnail">
							<h3 class="redheader">Thumbnails: '.$post_katname.'</h3>
								<table class="tbl_tmbimg">
									<tr>
	';
	
####################	Die durch das Formular weitergegebene Variable "kategorie" (id)  verarbeiten	####################
# Alle Thumbnailbilder mit der selektierten kategorie-id auslesen und ausgeben
					$selkat = $_POST['kategorie'];
					$sendid = $_GET['id'];
					$abfrage = "SELECT pics_thumb.* FROM pics_thumb WHERE pics_thumb.kategorie = '$selkat'  ";
					$ergebnis = mysql_query($abfrage);
					$i = 0;
					while($row = mysql_fetch_object($ergebnis))
					{
						if($i%3 == 0)
						{
									echo '	</tr>
									<tr><td colspan="3" class="tmbtrenner">&nbsp;</td></tr>
											<tr>';
						}
						;
									echo '<td>
											<a href="bilder.php?id='.$row->ID.'&kategorie='.$selkat.'&class="singlepic">
												<img id="'.$row->ID.'" class="tmbimg" title="'.$row->beschreibung.'" src="../../bilder/pub/pics/pics_thumb/'.$row->img.'"/>
												<br />
												<!--<div class="bildtitel">'.$row->img.'</div>-->														
											</a>
										</td>';
						$i++; 	
					}
#-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------#
	echo '
							</tr>
					  </table>

			  </div>
					<div id="singlepic">
						<h3 class="redheader">Anzeige Einzelbild:</h3>
	';

####################	Anzeige des durch das Thumbnail ausgewählte	Einzelbild  #######################################
# durch den in der thumbnailgallerie um das bild gelegten link werden die variablen zur ausgabe singlepic übergeben
								$sql = "select * from pics where ID = $sendid";
								$res = mysql_query($sql);
							
									while($row = mysql_fetch_assoc($res))
									{
									$IDpic = $row['ID'];
									$titelpic = $row['img'];
									$datumpic = $row['datum'];
									$beschreibungpic = $row['beschreibung'];
									}
								$size = getimagesize ('../../bilder/pub/pics/pics/'.$titelpic);
								$bildbreite = $size[0];
								$bildhoehe = $size[1];

								if ($_GET)
								{
######################################################################################								
						
								
								
								
######################################################################################								
								echo 
									$beschreibungpic.'
									<br />
									<a href="../../bilder/pub/pics/pics/'.$titelpic.'" onclick="javascript:PopUp('.$bildbreite.','.$bildhoehe.',this.href); return false;">	
									<img src="../../bilder/pub/pics/pics/'.$titelpic.'" class="snglimg" border="0" title="'.$beschreibungpic.'" alt="'.$beschreibungpic.'"/>
									</a>
									<br/>
									Kategorie:'.$katname
									;
								}
								else 
								{								
										echo '<p class="notice"><br />Kein Bild ausgew&auml;hlt!<br />
												<br />Zum vergr&ouml;ssern auf das Einzelbild klicken (Javascript muss aktiviert sein).
											  </p>
										';
								}
#---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------#
#echo 'dudu';
}
?>
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück