Beautiful image output

I always didn’t like the way the images on my sites are displayed. I wanted some sort of ordering, dependency. Therefore, I found it useful to search for scripts and solutions in Google. After unsuccessful searches, it was decided to do something myself.
But what? I began to look, as the conclusion of pictures at popular sites is made. I didn't like everything until I thought of seeing the output in google images and google +. It struck me that I never noticed that the pictures are aligned in width and height without clipping. This principle I wanted to implement. It turns out the mosaic. And everything seems to be in its place.
Without hesitation, I sat down to write code that can display pictures in the same way.

I decided to make it very simple: to make each line of a certain height and width. The main thing is that the height should not be greater than that which we set in the conditions.

Formulas

Armed with a marker and a fridge (yes, I don’t have a marker board), I made up a few simple equations and found a dependency.

h ₁ * X ₁ = h ₂ * X ₂ = ... = h _n X _n = height (height);
w ₁ * X ₁ + w ₂ * X ₂ + ... + w _n * X _n = width (width);
Where
h _{1 -n} - heights of images
w _1-n - the width of the image.
X _1-n - variable scaling (if you multiply the height and width by it, the picture will change proportionally).
')
It turns out that height = width * h ₁ / (w ₁ + w ₂ * h ₁ / h ₂ + w ₃ * h ₁ / h ₃ + ... + w _n * h ₁ / h _n ).

Code

$widthdef=800; //   $heightdef=150; //    $margin=2; //   $uploadsdir='./upload/'; //,     //$img[ 1  N] -   //$imagescount=N ,   echo '<div style="width:'.$widthdef.'px;">'; $first=1; while($first<=$imagescount){ $images=$first-1; $hightes=$heightdef+1; while($hightes > $heightdef && $images<$imagescount) { $images++; $width=$widthdef-($images-$first+1)*($margin*2); //,   list($w[$images], $h[$images]) = getimagesize($uploadsdir.$img[$images]); //        $delim=$width*$h[$first]; $delit=$w[$first]; for($j=($first+1);$j<=$images;$j++) { $delit=$delit+$w[$j]*($h[$first]/$h[$j]); } $hightes=floor($delim/$delit);//  if($hightes<=$heightdef) { for($i=$first;$i<=$images;$i++) { $ht=$hightes.'px'; echo '<img style="margin:'.$margin.'px;" src="'.$uploadsdir.$img[$i].'" height="'.$ht.'">'; //  } $first=$images+1; } else { if($images==$imagescount) { // ,       for($y=$first;$y<=$images;$y++) { echo '<img style="margin:'.$margin.'px;" src="'.$uploadsdir.$img[$y].'" height="'.$heightdef.'px">'; } $first=$images+1; //,     } } } } echo '</div>'; 

If there are not enough pictures to output across the entire width, output them with the maximum height specified.

From the author

The code is not perfect, so comments are taken into account.
You can see the demo here . There you can play around with the parameters. When loading the image is resized to the lowest possible resolution. Hosting is weak, I apologize in advance for lags.
Download here .

I also want to hear other ideas and improvements.

PS: The code is not provided for small images (I personally do not need it). If you load large and small, the latter can stretch. If anyone comes up with an elegant solution, share.

UPD: Thanks for the comments, very helpful. I will be improved. Error corrected. As already said, all the pictures are still here (removed by the crown after 3 hours).