Fotogalerie v PHP - 1. díl
 x   TIP: Přetáhni ikonu na hlavní panel pro připnutí webu

Fotogalerie v PHP - 1. dílFotogalerie v PHP - 1. díl

 

Fotogalerie v PHP - 1. díl

Google       Google       1. 10. 2008       59 903×

Jistě jste se dostali již do situace, kdy potřebujete na svých stránkách umožnit návštěvníkovi prohlédnout si vaše fotky, ale dávat je do jednotlivých stránek ručně je buď nepraktické, nebo příliš náročné. Hodit by se mohla automaticky generovaná fotogalerie.

V prvním díle vytvoříme stránku, která dokáže zobrazit obsah složky. Protože se chceme ve svém kódu vyznat, budeme používat téměř na vše funkce. První bude pro zobrazení obsahu složky.

Tato funkce vám vypíše vše, co se ve složce nachází. Nejdříve si tedy předveďme ten nejjednodušší kód a pak si ho upravíme, aby dělal přesně to, co potřebujeme.

<?php
function ObsahSlozky($slozka) {
	$obsah = scandir($slozka);
	foreach($obsah as $soubor) {
		print $soubor.'<br>';
	}
	return True;
}
?>

Opravdu jednoduchá funkce, která vám pouze vypíše obsah složky. Funkci můžeme jednoduše zavolat příkazem:

ObsahSlozky('cesta/ke/slozce/s/fotografiemi/');

Druhý řádek s funkcí scandir nám do proměnné vloží pole se všemi soubory a složkami, toto pole pak příkazem foreach procházíme a vypisujeme všechny soubory.

Dalším krokem je rozlišit složky od souborů a soubory s obrázky od jiných souborů. Také je zbytečné vypisovat tečku, dvojitá se bude hodit pro přechod do vyšší složky. Po ošetření bude funkce vypadat takto:

<?php
function ObsahSlozky($slozka) {
	$obsah = scandir($slozka);
	foreach($obsah as $soubor) {
		if($soubor != "."){
			if(is_dir($slozka."/".$soubor)) {
				ZobrazNahled($soubor, $slozka, "slozka");
			} else {
				if(@getimagesize($cesta."/".$soubor)) {
					ZobrazNahled($soubor, $slozka, "obrazek");
				} else {
					ZobrazNahled($soubor, $slozka, "soubor");
				}
			}
		}
	}
	return True;
}
?>

Nejdříve jsme do funkce přidali rozpoznání složky od souboru pomocí funkce is_dir. Samozřejmě by šlo systém obrátit – zjistit, zda je položka v poli soubor pomocí funkce is_file. Další úpravou bylo vložení podmínky se zavoláním funkce getimagesize. Pokud je soubor obrázkem, vrátí nenulovou hodnotu s polem o jeho rozměrech, v opačném případě vrátí nulovou hodnotu.

Dalším naším úkolem je dodat naší funkci formu. Abychom však udrželi v kódu přehlednost, nebudeme vše sumírovat do jedné funkce a vytvoříme další funkci na přehledné vykreslení všech souborů. Zde trochu sáhneme i do CSS. Připravíme si dva obrázky o velikosti 100×75 px (poměr 4:3, stejný jako u většiny fotografií), první pro zobrazení složky, druhý pro soubor, který není obrázkem.

function ZobrazNahled($soubor, $cesta, $typ) {
	echo "<div style='border: 1px solid black; margin: 10px; float: left; text-align: center;'>";
	echo "<div style='width: 100px; height: 75px; padding: 5px;'>";
	
	if($typ == "slozka") {
		echo "<img src='slozka.png' alt='' title=''>";
	} else if($typ == "soubor") {
		echo "<img src='soubor.png' alt='' title=''>";
	} else {
		echo "<img src='".$_SESSION["slozka"]."/".$soubor."' alt='' title='' width=100>";
	}
	
	echo "</div>";
	echo "<div style='width:110px; background: #000; color: #FFF; text-align: center;' title='".$soubor."'>".substr($soubor, 0, 10)."</div>";
	echo "</div>";
}

Funkce, která v podstatě jenom zařídí, aby se vykreslil náhled obrázku, obrázek složky nebo souboru. Tato funkce však nebude fungovat stoprocentně. Pokud bude obrázek širší nežli vyšší, bude vše fungovat správně, v opačném případě ale rozhodí rozvržení stránky. Vytvoříme tedy funkci, která zajistí, aby byla vždy výška menší než 75 px a šířka menší než 100 px, přičemž poměr musí zůstat zachován. Protože se nám ale tato funkce bude ještě hodit, nestanovíme maximální výšku a šířku napevno, ale vždy si je vyžádáme.

function Zmensi($vyska, $sirka, $x, $y) {
	if($vyska > $x) {
		$zmenseno = $x / $vyska;
		$vyska = $x;
		$sirka = $sirka*$zmenseno;
	}

	if($sirka > $y) {
		$zmenseno = $y / $sirka;
		$sirka = $y;
		$vyska = $vyska*$zmenseno;
	}

	$ret = array($vyska, $sirka);
	return $ret;
}

Touto matematickou funkcí úspěšně zjistíme nové rozměry obrázku, které nyní stačí aplikovat do předchozí funkce (kód o kus níže). Není to úplně přesně vytváření náhledu, spíše zmenšeniny původního obrázku. O tom, jak vytvořit plnohodnotné náhledy (se zmenšením velikosti), si povíme v dalším díle. Zobrazení popisku je zkráceno funkcí substr, druhé číslo udává počet zobrazených znaků. Pokud by nebyla nastavena maximální délka, mohl by se design při dlouhém názvu rozhodit. To je první část vašeho domácího úkolu – vytvořit funkci, která by kontrolovala délku názvů a příliš dlouhé názvy by zkracovala co nejchytřeji. Za zkrácený název může přidat třeba tři tečky.

Teď už stačí začlenit použití této funkce do funkce ObsahSlozky().

function ObsahSlozky($slozka) {
	$obsah = scandir($slozka);
	foreach($obsah as $soubor) {
		if($soubor != "."){
			if(is_dir($slozka."/".$soubor)) {
				ZobrazNahled($soubor, $slozka, "slozka");
			} else {
				if(@getimagesize($cesta."/".$soubor)) {
					ZobrazNahled($soubor, $slozka, "obrazek");
				} else {
					ZobrazNahled($soubor, $slozka, "soubor");
				}
			}
		}
	}
	echo "<hr style='display:none; clear: both;'>";
	return True;
}

Tím je náš první skript na zobrazení obsahu složky hotov. V příštím díle přidáme možnost procházení podsložkami.

Ukázka celého okomentovaného kódu pro kontrolu:

<?php
function ObsahSlozky($slozka) {
	#
	# funkce pro vypsani obsahu slozky
	# a nasledne zavolani prilehlych funkci
	#

	// nacteni obsahu slozky do pole
	$obsah = scandir($slozka);
	// prochazeni polem obsah
	foreach($obsah as $soubor) {
		// pokud soubor neni .
		if($soubor != "."){
			// pokud je soubor slozkou
			if(is_dir($slozka."/".$soubor)) {
				// zavolani funkce pro ikonku slozky
				ZobrazNahled($soubor, $slozka, "slozka");
			} else {
				// pokud je soubor obrazkem
				if(@getimagesize($slozka."/".$soubor)) {
					// zavolani funkce pro zobrazeni zmenseniny obrazku
					ZobrazNahled($soubor, $slozka, "obrazek");
				// pokud soubor neni obrazkem
				} else {
					// zavolani funkce pro zobrazeni ikonky neznameho souboru
					ZobrazNahled($soubor, $slozka, "soubor");
				}
			}
		}
	}
	// vypsani cistice
	echo "<hr style='visibility: hidden; clear: both;'>";
	// vraceni informace o uspesnem provedeni funkce
	return True;
}

function Zmensi($vyska, $sirka, $x, $y) {
	#
	# funkce, ktera zmensuje rozmery tak aby byl mezi sirkou a vyskou
	# zachovan pomer.
	#

	if($vyska > $x) {
		$zmenseno = $x / $vyska;
		$vyska = $x;
		$sirka = $sirka*$zmenseno;
	}

	if($sirka > $y) {
		$zmenseno = $y / $sirka;
		$sirka = $y;
		$vyska = $vyska*$zmenseno;
	}

	$ret = array($vyska, $sirka);
	return $ret;
}

function ZobrazNahled($soubor, $cesta, $typ) {
	#
	# funkce, ktera zobrazi zmenseninu obrazku, slozky nebo souboru
	#

	echo "<div style='border: 1px solid black; margin: 10px; float: left; text-align: center;'>";
	echo "<div style='width: 100px; height: 75px; padding: 5px;'>";

	// pokud chceme zobrazit ikonku slozky
	if($typ == "slozka") {
		// zobrazeni obrazku
		echo "<img src='slozka.png' alt='' title=''>";
	// pokud chceme zobrazit ikonku souboru, ktery neni obrazkem
	} else if($typ == "soubor") {
		// zobrazeni ikonky a odkazu
		echo "<img src='soubor.png' alt='' title=''>";

	// pokud chceme zobrazit nahled obrazku
	} else {
		// zjisteni rozmeru obrazku
		$rozmery = getimagesize($cesta."/".$soubor);

		$vyska = $rozmery[1];
		$sirka = $rozmery[0];

		// zavolani funkce pro zmenseni rozmeru
		$rozmery = Zmensi($vyska, $sirka, 75, 100);

		// nastaveni novych rozmeru
		$vyska = $rozmery[0];
		$sirka = $rozmery[1];

		// vykresleni nahledu
		echo "<img src='".$_SESSION["slozka"]."/".$soubor."' alt='' title='' style='border:0;' width=".$sirka." height=".$vyska.">";
	}

	echo "</div>";

	// zobrazeni popisku
	echo "<div style='width:110px; background: #000; color: #FFF; text-align: center;' title='".$soubor."'>".substr($soubor, 0, 10)."</div>";

	echo "</div>";
}

session_start();
ObsahSlozky(".");
?>

×Odeslání článku na tvůj Kindle

Zadej svůj Kindle e-mail a my ti pošleme článek na tvůj Kindle.
Musíš mít povolený příjem obsahu do svého Kindle z naší e-mailové adresy kindle@programujte.com.

E-mailová adresa (např. novak@kindle.com):

TIP: Pokud chceš dostávat naše články každé ráno do svého Kindle, koukni do sekce Články do Kindle.

Hlasování bylo ukončeno    
0 hlasů
Google
(fotka) Juda KaletaAutor programuje v PHP a Pythonu, má velmi rád Linux a svobodný software. Také občas vyrazí do terénu s fotoaparátem. Většinu takto získaného materiálu publikuje na svém blogu.
Web     Facebook     LinkedIn    

Nové články

Obrázek ke článku Stavebnice umělé inteligence 1

Stavebnice umělé inteligence 1

Článek popisuje první část stavebnice umělé inteligence. Obsahuje lineární a plošnou optimalizaci.  Demo verzi je možné použít pro výuku i zájmovou činnost. Profesionální verze je určena pro vývojáře, kteří chtějí integrovat popsané moduly do svých systémů.

Obrázek ke článku Hybridní inteligentní systémy 2

Hybridní inteligentní systémy 2

V technické praxi využíváme často kombinaci různých disciplín umělé inteligence a klasických výpočtů. Takovým systémům říkáme hybridní systémy. V tomto článku se zmíním o určitém typu hybridního systému, který je užitečný ve velmi složitých výrobních procesech.

Obrázek ke článku Jak vést kvalitně tým v IT oboru: Naprogramujte si ty správné manažerské kvality

Jak vést kvalitně tým v IT oboru: Naprogramujte si ty správné manažerské kvality

Vedení týmu v oboru informačních technologií se nijak zvlášť neliší od jiných oborů. Přesto však IT manažeři čelí výzvě v podobě velmi rychlého rozvoje a tím i rostoucími nároky na své lidi. Udržet pozornost, motivaci a efektivitu týmu vyžaduje opravdu pevné manažerské základy a zároveň otevřenost a flexibilitu pro stále nové výzvy.

Obrázek ke článku Síla týmů se na home office může vytrácet. Odborníci radí, jak z pracovních omezení vytěžit maximum

Síla týmů se na home office může vytrácet. Odborníci radí, jak z pracovních omezení vytěžit maximum

Za poslední rok se podoba práce zaměstnanců změnila k nepoznání. Především plošné zavedení home office, které mělo být zpočátku jen dočasným opatřením, je pro mnohé už více než rok každodenní realitou. Co ale dělat, když se při práci z domova ztrácí motivace, zaměstnanci přestávají komunikovat a dříve fungující tým se rozpadá na skupinu solitérů? Odborníci na personalistiku dali dohromady několik rad, jak udržet tým v chodu, i když pracovní podmínky nejsou ideální.

Hostujeme u Českého hostingu       ISSN 1801-1586       ⇡ Nahoru Webtea.cz logo © 20032024 Programujte.com
Zasadilo a pěstuje Webtea.cz, šéfredaktor Lukáš Churý