Image repeats on slider after croped/resized

[fantasma]

Greetings!

Recently I've been updating an image resize class I found on the internet. What I needed to have was a script that would crop an image in order to fit in a defined with a fixed width an height. However, after the image is redimensioned, (keeping the aspect ratio), it apears repeated on the slider. Is there any way to solve this? I've been hammering my head over this for the past hours with no results.

EDIT: The croped image on server appears correctly

Here's the code that manipulates the image

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

			public function resizeImage($newWidth, $newHeight, $option="auto")
			{
				// *** Get optimal width and height - based on $option
				$optionArray = $this->getDimensions($newWidth, $newHeight, $option);

				$optimalWidth  = $optionArray['optimalWidth'];
				$optimalHeight = $optionArray['optimalHeight'];


				// *** Resample - create image canvas of x, y size
				$this->imageResized = imagecreatetruecolor($optimalWidth, $optimalHeight);
				imagecopyresampled($this->imageResized, $this->image, 0, 0, 0, 0, $optimalWidth, $optimalHeight, $this->width, $this->height);


				// *** if option is 'crop', then crop too
				if ($option == 'crop') {
					$this->crop($optimalWidth, $optimalHeight, $newWidth, $newHeight);
				}
				if($option == 'toSize')
				{
					$this->cropToSize($optimalWidth, $optimalHeight, $newWidth, $newHeight);
				}
			}

			## --------------------------------------------------------
			private function getDimensions($newWidth, $newHeight, $option)
			{

			   switch ($option)
				{
					case 'exact':
						$optimalWidth = $newWidth;
						$optimalHeight= $newHeight;
						break;
					case 'toSize':
						$optionArray = $this->getSizeByAuto($newWidth, $newHeight);
						$optimalWidth = $optionArray['optimalWidth'];
						$optimalHeight = $optionArray['optimalHeight'];
						break;
					case 'portrait':
						$optimalWidth = $this->getSizeByFixedHeight($newHeight);
						$optimalHeight= $newHeight;
						break;
					case 'landscape':
						$optimalWidth = $newWidth;
						$optimalHeight= $this->getSizeByFixedWidth($newWidth);
						break;
					case 'auto':
						$optionArray = $this->getSizeByAuto($newWidth, $newHeight);
						$optimalWidth = $optionArray['optimalWidth'];
						$optimalHeight = $optionArray['optimalHeight'];
						break;
					case 'crop':
						$optionArray = $this->getOptimalCrop($newWidth, $newHeight);
						$optimalWidth = $optionArray['optimalWidth'];
						$optimalHeight = $optionArray['optimalHeight'];
						break;
				}
				return array('optimalWidth' => $optimalWidth, 'optimalHeight' => $optimalHeight);
			}



private function getSizeByAuto($newWidth, $newHeight)
			{
				if ($this->height < $this->width)
				// *** Image to be resized is wider (landscape)
				{
					$optimalWidth = $newWidth;
					$optimalHeight= $this->getSizeByFixedWidth($newWidth);
				}
				elseif ($this->height > $this->width)
				// *** Image to be resized is taller (portrait)
				{
					$optimalWidth = $this->getSizeByFixedHeight($newHeight);
					$optimalHeight= $newHeight;
				}
				else
				// *** Image to be resizerd is a square
				{
					if ($newHeight < $newWidth) {
						$optimalWidth = $newWidth;
						$optimalHeight= $this->getSizeByFixedWidth($newWidth);
					} else if ($newHeight > $newWidth) {
						$optimalWidth = $this->getSizeByFixedHeight($newHeight);
						$optimalHeight= $newHeight;
					} else {
						// *** Sqaure being resized to a square
						$optimalWidth = $newWidth;
						$optimalHeight= $newHeight;
					}
				}

				return array('optimalWidth' => $optimalWidth, 'optimalHeight' => $optimalHeight);
			}

This is another function I wrote, trying to acheive a solution. No luck either.

private function cropToSize($optimalWidth, $optimalHeight, $newWidth, $newHeight)
			{
				$src_x = 0;
				$src_y = 0;
				
				if ( ($this->width/$this->height) < ($newWidth/$newHeight) )
				{
					//Determina o racio para o resize
					$ratio = $newWidth / $this->width;
					//Detemina o crop
					$crop =  $this->height - ($newHeight/$ratio) ;
					$this->height = $this->height - $crop;
					$src_y = floor($crop/2);
				}
				else
				{
					//Detemina resize baseado na altura
					$ratio = $newHeight / $this->height;
					//Detemina resize baseado na largura
					$crop = $this->width - ($newWidth/$ratio);
					$this->width = $this->width - $crop;
					$src_x = floor($crop/2);
				}
				$dest = $this->imageResized;
				//imagedestroy($this->imageResized);
				var_dump($src_x, $src_y,$optimalWidth, $optimalHeight, $newWidth, $newHeight , $this->width, $this->height);

				// *** Now crop from center to exact requested size
				$this->imageResized = imagecreatetruecolor($newWidth , $newHeight);
				imagecopyresampled($this->imageResized, $dest , 0, 0, $src_x, $src_y, $optimalWidth, $optimalHeight, $this->width, $this->height);
			}

Glad for any help possible ;)

[chrishea]

It's possible that the problem is your css for displaying the image. If it's a background image, it will normally repeat unless you specify that it shouldn't. You can specify "no-repeat" so you only get it once.

[fantasma]

chrishea, thank you for your reply.

The thing is, i'm not displaying images with css. I'm just printing the <img> tags with PHP.

Here's the code that does it

<?php 

			
					$sentence = "SELECT imagens.caminho, noticias.ID as idnot, noticias.titulo_noticia FROM imagens, noticias WHERE noticias.ID_IMG = imagens.ID ORDER BY noticias.data DESC";

					
					$query = mysql_query($sentence);
					if(!$query)
					{
						echo "Erro ao executar a query".mysql_error();
					}
					while ($row = mysql_fetch_array($query)){
					
					$caminho = $row['caminho']; //Path to the image on server
					$id_not = $row['idnot']; //News id
					$titulo_not = $row['titulo_noticia'];
					
					echo'<a href="noticias.php?id_not='.$id_not.'">';
				
					echo'<img src="'.$caminho.'"/>';
					echo'<span>';
					echo $titulo_not;
					echo'</span>';

					echo'</a>';
					echo'<div class="SliderName_2Description_h"></div>';
					
					
					}
					?>

[chrishea]

You said: "The croped image on server appears correctly".
When displayed with what and from where?

Your display code seems straightforward enough that I would have to suspect that 2 copies of the image are being stored in imagens.caminho. Nothing else seems logical. If that is the case, then you will have to work backward to find out why.

[fantasma]

You said: "The croped image on server appears correctly".
When displayed with what and from where?

It's correctly cropped yes. I know it because, the new images I downloaded come with correct width and height, appearing as a single image, not in a repeated way.

In the server, I save the original image, and 2 cropped images. One for the slideshow, and one thumb with smaller dimensions. This one is displayed correctly