Forums / Cotonti / Support / Thumbnails

chobblr
#1 2009-05-19 02:59
How can i edit the thumbnail look (other than color)

what i want to do is just change some things like rounded corners and drop shadows, i no this can be done in css but is there a way to hard code it in stead,


where you see the grey/black backgrounds with the rounded corners that is done by CSS but i would like that on the thumbnails, is this possible
Joy
#2 2009-05-19 03:01
From where is that pic?..is that ur Website
chobblr
#3 2009-05-19 03:07
yeh taken 5 mins ago
Lombi
#4 2009-05-19 03:24
You'd need to hack the sed_createthumb function with additional GD2 functionality. As far as I know it supports both shadows and rounded corners. But you need to hack it.
<a href="http://www.domenlo.com">Surreal Art</a>
chobblr
#5 2009-05-19 03:30
Are these files located in "../core/pfs"
Lombi
#6 2009-05-19 03:42
You could do a search... But no, it's in system/functions.php.
<a href="http://www.domenlo.com">Surreal Art</a>
chobblr
#7 2009-05-19 03:44
Thanks, will go Google on how to do it and to a peak at functions.php thanks again *trundles off to http://google.com"
Lombi
#8 2009-05-19 03:47
Hehe, I was actually referring to searching for the function in the cotonti file structure :)
<a href="http://www.domenlo.com">Surreal Art</a>
chobblr
#9 2009-05-19 03:51
yeh i sort knew that pfft , i was off to google to figure out how to do it, because php is like me trying to fly without wings its difficult(hard) (and imposable)

Edit: Dont you mean GD1
This post was edited by chobblr (2009-05-19 03:58, 14 years ago)
Lombi
#10 2009-05-19 04:07
No, I mean GD2 which is a much less limiting library. Here's a quickie I found online: http://documentation.coppermine-gallery.net/en/install_faq.htm#GD1vsGD2
<a href="http://www.domenlo.com">Surreal Art</a>
chobblr
#11 2009-05-19 04:11
oh i see. i also found something..ironic aye (no not really) any how..would any of this work (look down NOW!!)

$image_file = $_GET['src'];
$corner_radius = isset($_GET['radius']) ? $_GET['radius'] : 20; // The default corner radius is set to 20px
$angle = isset($_GET['angle']) ? $_GET['angle'] : 0; // The default angle is set to 0º
$topleft = (isset($_GET['topleft']) and $_GET['topleft'] == "no") ? false : true; // Top-left rounded corner is shown by default
$bottomleft = (isset($_GET['bottomleft']) and $_GET['bottomleft'] == "no") ? false : true; // Bottom-left rounded corner is shown by default
$bottomright = (isset($_GET['bottomright']) and $_GET['bottomright'] == "no") ? false : true; // Bottom-right rounded corner is shown by default
$topright = (isset($_GET['topright']) and $_GET['topright'] == "no") ? false : true; // Top-right rounded corner is shown by default

$images_dir = 'images/';
$corner_source = imagecreatefrompng('images/rounded_corner.png');

$corner_width = imagesx($corner_source);  
$corner_height = imagesy($corner_source);  
$corner_resized = ImageCreateTrueColor($corner_radius, $corner_radius);
ImageCopyResampled($corner_resized, $corner_source, 0, 0, 0, 0, $corner_radius, $corner_radius, $corner_width, $corner_height);

$corner_width = imagesx($corner_resized);  
$corner_height = imagesy($corner_resized);  
$image = imagecreatetruecolor($corner_width, $corner_height);  
$image = imagecreatefromjpeg($images_dir . $image_file); // replace filename with $_GET['src'] 
$size = getimagesize($images_dir . $image_file); // replace filename with $_GET['src'] 
$white = ImageColorAllocate($image,255,255,255);
$black = ImageColorAllocate($image,0,0,0);

// Top-left corner
if ($topleft == true) {
    $dest_x = 0;  
    $dest_y = 0;  
    imagecolortransparent($corner_resized, $black); 
    imagecopymerge($image, $corner_resized, $dest_x, $dest_y, 0, 0, $corner_width, $corner_height, 100);
} 

// Bottom-left corner
if ($bottomleft == true) {
    $dest_x = 0;  
    $dest_y = $size[1] - $corner_height; 
    $rotated = imagerotate($corner_resized, 90, 0);
    imagecolortransparent($rotated, $black); 
    imagecopymerge($image, $rotated, $dest_x, $dest_y, 0, 0, $corner_width, $corner_height, 100);  
}

// Bottom-right corner
if ($bottomright == true) {
    $dest_x = $size[0] - $corner_width;  
    $dest_y = $size[1] - $corner_height;  
    $rotated = imagerotate($corner_resized, 180, 0);
    imagecolortransparent($rotated, $black); 
    imagecopymerge($image, $rotated, $dest_x, $dest_y, 0, 0, $corner_width, $corner_height, 100);  
}

// Top-right corner
if ($topright == true) {
    $dest_x = $size[0] - $corner_width;  
    $dest_y = 0;  
    $rotated = imagerotate($corner_resized, 270, 0);
    imagecolortransparent($rotated, $black); 
    imagecopymerge($image, $rotated, $dest_x, $dest_y, 0, 0, $corner_width, $corner_height, 100);  
}

// Rotate image
$image = imagerotate($image, $angle, $white);

// Output final image
imagejpeg($image);

imagedestroy($image);  
imagedestroy($corner_source);
Elgan
#12 2009-05-19 06:59
that code isnt that brill.

I did write some code , experimental to create hard coded rounded thumbs, it;s in medlib but it had a lil prob with some that got cought up int he transparency ont he edge

http://www.cotonti.com/forums.php?m=posts&p=10939&highlight=ROUNDED#10939

its not the best.

i found a lil class that has uses gd and has a couple of thumbnail effetc,s rounding, shadows etc. without CSS.

I might add it to medlib with options to add the effects to thumbnails.

However it is always possible to do all of that with CSS. It's an arguement which is better for the same effect, hard coding and creating it, or css?
chobblr
#13 2009-05-19 22:03
CSS is far easer to do it in..i could simply use a code like below
.div IMG {box-shadow: 2px 2px 5px #000;} but only a few browsers will see it
or i could try
.div IMG {padding-right:4px;padding-bottom:4px;background-image:URL('dropshadowimage.png')} all browsers will see

but..both have there pros and cons, if i where to hard code it in it should be see able on all browsers and using no more images than before..