www4u.org

От много време искам да напиша този пост. Все не стига или време, или желание. Е сега явно е ударил часът. Замисляли ли сте се, кои са основните  елементи в дадена страница?

Това са текст, изображения и разбира се стиловите елементи. В тази статия, ще се спрем върху изображенията. Спирам се върху тях, защото това са и често най-грешно използваните елементи. Какво визирам под грешно? Колко от Вас, занимаващи се с изграждане на уеб страници, винаги указват размерите на дадено изображение?

Повечето дизайнери/програмисти смятат, че ако то ще се използва в истинските му размери, т.е. няма да бъде преоразмерявано, няма нужда да му се укажат стойностите на широчина(width) и височина(height). И действително, дори да не ги укажете, всичко се визуализира нормално и Вие решавате “щом работи, няма нужда да се указват”. Е да, ама не.

При зареждането на страницата, ако не са указани размери на изображението, то браузърът по подразбиране задава размери 10×10 и поставя останалите елементи от страница, докато се зареди изображението. В не един и два случая обаче, размерите на изображението се оказват други, те се поправят, и елементите трябва да се пренаредят. Това бави зареждането на страницата, а ние далеч не желаем това.

Ясно е, че е неудобно всеки път, да проверяваме какъв е размера на изображението, което включваме в дадена странца. Защо да не автоматизираме този процес? За целта написах един прост клас scf4u(SimpleClassFunctions4you), с две функции. Ще използвам този клас, като дописвам и други такива функции, които ще видите в следващите статии.

Сега към кода на първата функция:

/**
	 * @desctiption: Simple php function that calculates image's 
	 * width and height. The first parameter is contains 
	 * Image File URL, the second is for image border, and the last 
	 * defines image's alt. 
	 * @based: Based on Hack #9 from PHP Hacks by Jack D(O'Reilly)
	 * @created: 17 May 2008
	 **/
	public function img0($file, $border, $alt){
 
		$clean = array();
		$clean['alt'] = htmlentities($alt, ENT_QUOTES, 'UTF-8');
		if(ctype_digit($border)){
			$clean['border'] = $border;
		}
		else{
			$clean['border'] = 0;
		}
 
		list($width, $height) = getimagesize($file);
		echo( "<img src=\"{$file}\" 
				style=\" width: {$width}; height :{$height};\" 
				border=\"{$clean['border']}\" 
				alt=\"{$clean['alt']}\" 
		/>");
	}

С простата функция img0() задавате пътя до изображенето, рамката, която искате да му приложите и разбира се описанието му(alt). Функцията, започва със създаването на празен масив, в който ще съхраняваме филтрираните данни. С помощта на htmlentities() заместваме всякакви символи, които биха могли да се изпълнят от браузъра с техните HTML заместители. Чрез getimagesize() се определят размерите на изображението и се описват в края на функцията.

Разбира се, често ни се налага и да преоразмеряваме изображенията, които ще използваме в странциата си. Най-добре е това да се прави предварително, за да не се налага потребителският браузър да го прави, но все пак се налага понякога. Ето и функция, идентична като горепосочената, но с два параметъра за широчина(width) и височина(height):

/**
	 * @desctiption: Simple php function. The first parameter is contains 
	 * Image File URL, the second is for image border, and the last 
	 * defines image's alt. 
	 * @based: Based on Hack #9 from PHP Hacks by Jack D(O'Reilly)
	 * @created: 17 May 2008
	 **/
	public function img1($file, $border, $alt, $width, $height){
 
		$clean = array();
		$clean['alt'] = htmlentities($alt, ENT_QUOTES, 'UTF-8');
 
		$nums = array();
		if(!ctype_digit($border) ? $num['border'] = $border : $num['border'] = 0);
		if(!ctype_digit($width) ? $num['width'] = $height : $num['width'] = 0);
		if(!ctype_digit($height) ? $num['height'] = $height : $num['height'] = 0);
 
 
		list($width, $height) = getimagesize($file);
		echo( "<img src=\"{$file}\" 
 
				style=\" width: {$num['width']}; height :{$num['height']};\" 
				border=\"{$num['border']}\" 
				alt=\"{$clean['alt']}\" 
		/>");
	}

Обединявам двете функции в един клас - scf4u(SimpleClassFunctions4you). Ще има следващи прости, но полезни функции, които ще дописвам в него. В следващата статия мисля, да засегна хеширането на стрингове, но приемам и идеи.

Държа да отбележа, че идеята за тези функции, дойде от книгата “PHP Хакове” - O’Reilly. В книгата е указано, че при използване на съвсем малки части от кода, то те не претендират за собственост върху тях и дори не е задължително да бъдат указани като източник, все пак държа да го отбележа.

Можете да свалите класа от тук:
[Download scf4u - tar.bz2 (11.4KB)]
[Download scf4u - rar        (12.5KB)]

Класът се разпространява под GNU General Public License version 3 или по-нова