I'm making an avatar site. One of my users is having an issue... their avatar is going blank. Their avatar:
http://www.world2build.com/API/Avatar.aspx?ID=1586
The items on their avatar work fine without this item, but when they put this body on, which is the very first layer, it goes blank:
http://node1.world2build.com/Body/13245107086553.png
However, if I move the Body to the top layer, it displays... but I have to keep the body at bottom layer to make sure it displays like a normal avatar. Why would this make the PNG go blank with it as the bottom layer? I don't see the problem.
Code (with $vars being an array with the links to the files):
function merge_image($base, $img){
$width = imagesx($img);
$height = imagesy($img);
imagecopy($base,$img,0,0,0,0,$width,$height);
}
$base = imagecreatefrompng($vars[0]);
for($i=1; $i<count($vars); $i++){
merge_image($base, imagecreatefrompng($vars[$i]));
//echo $vars[$i]."<BR>";
}
header("Content-Type: image/png");
imagesavealpha($base, true);
imagepng($base);
NOTICE: $base, on line 7, is the body image (the one causing the problem.)
A working avatar is: http://www.world2build.com/API/Avatar.aspx?ID=1602 (it uses a different body than the one provided above)
I fixed this by replacing the code with this, and turning $base into a blank image.
$base = imagecreatefrompng("../Images/BlankTransparentImage.png");
for($i=0; $i<count($vars); $i++){
merge_image($base, imagecreatefrompng($vars[$i]));
//echo $vars[$i]."<BR>";
}
(Notice I changed $i=1 to $i=0 in the for loop to include the body.)
Related
So i am trying to create a compass to show wind direction.
Function rotate($angle) {
$original = imagecreatefrompng("img/Arrow.png");
$compass = imagerotate($original, $angle, 0);
return $compass;
}
That will be displayed using some html that i am echoing. The variable angle is being passed from a database. The html on the php script looks like this:
<img src='".rotate($row['wind_dir'])."'/>
The image never displays, and clearly the browser does not know where it is.
When i view the html in my browser, the above line shows as
<img src="Resource id #4"/>
and when i click on it, it navigates to a 404.
What am i doing wrong? Have i forgotten a line in the image rotation function?
EDIT:
Having tried some of the responses below, i get an image, but it only shows as a black box!
EDIT2:
Well after much fiddling, it turns out all that was needed was to the third value of imagerotate() to -1 as follows:
$original = imagecreatefrompng("img/goog.png");
$compass = imagerotate($original, $angle, -1);
imagealphablending($compass, true);
imagesavealpha($compass, true);
header('Content-Type: image/png');
imagepng($compass);
imagedestroy($compass);
I posted a comment about using CSS or JS rotation instead but since then I've had a better idea.
The compass is always going to be Arrow.png in one of 360 positions.
Use a batch process in Photoshop or PHP to create 360 versions. One for each degree. Then you can just call Arrow_120.png for example for 120 degrees. You remove the issue with your existing code of creating images on the fly while avoiding compatibility issues with CSS / JS.
You have to execute the function and send header: try like below, say our php file name is rotate.php :
rotate.php
function rotate($angle) {
$original = imagecreatefrompng("test.png");
$compass = imagerotate($original, $angle, 0);
header('Content-Type: image/png');
imagepng($compass);
imagedestroy($compass);
}
if(isset($_GET['angle'])){
rotate($_GET['angle']);
}
THen in your html you can call the web resource i.e you php file as:
<img src="url_to_rotate.php?angle=90" />
Also remember to sanitize the GET input before executing it.
The displayed image should be a image file. To achieve this you should use imagejpeg();
So basically you should have 2 php files:
1: Creates the image file using your code and imagejpeg();
<?php
$original = imagecreatefrompng("img/Arrow.png");
$compass = imagerotate($original, $_GET['angle'], 0);
header('Content-Type: image/jpeg');
imagejpeg($compass);
?>
2: The php file that displays the image.
<img src='image.php?angle=".$row['wind_dir']."'/>
if you want just one file you could do the following:
<?php
$original = imagecreatefrompng("img/Arrow.png");
$compass = imagerotate($original, $_GET['angle'], 0);
ob_start();
imagepng($compass);
$stringdata = ob_get_contents();
ob_end_clean();
$imageData = base64_encode($stringdata);
$src = 'data: image/png;base64,'.$imageData;
echo '<img src="',$src,'">';
?>
I have created a script which takes a random IMAGE ID from the database, converts it to a valid file name and then I use it to generate random images from a link.
This is how such a link looks like (works - try it):
http://imgit.org/roll.php?image=3J9N0Y4k8g4l4G7
When you reload that link, you'll notice the image changes. If I add this image to <img src="THAT LINK" /> it works, however, it doesn't work on message board like phpBB or vBulletin when I put that link inside [img][/img] BBCode tags.
I suppose there is a problem with my script, because there are various services out there that do exactly the same thing (link on forums) and it works.
Here is my roll.php script:
<?php
$imgit_root_path = '.';
include("{$imgit_root_path}/common.php");
if ($config['disable_roll'])
{
redirect('index.php');
}
$roll_key = request_var('image', '');
$roll_key = substr($roll_key, 0, 15);
if (!$roll_key)
{
redirect('index.php?action=404');
}
if (!$image->roll_key_exists($roll_key))
{
redirect('index.php?action=404');
}
$images = $image->roll_info($roll_key);
$images = explode('|', $images);
$count = sizeof($images);
$index = mt_rand(0, $count - 1);
$extList = array();
$extList['gif'] = 'image/gif';
$extList['jpg'] = 'image/jpeg';
$extList['jpeg'] = 'image/jpeg';
$extList['png'] = 'image/png';
$image_url = generate_site_url() . IMAGES_PATH . $image->get_name($images[$index]);
$image_inf = pathinfo($image_url);
header('Content-type: ' . $extList[$image_inf['extension']]);
readfile($image_url);
?>
I believe the problem may be that phpBB will disallow links which aren't confirmed as images. That is, don't have a known image extension, such as .jpg;
https://www.phpbb.com/community/viewtopic.php?f=46&t=1285255
For security reasons, images whose extensions cannot be confirmed
(such as in the first example) aren't allowed by BBCode. Instead of an
image, it's fully possible for someone to embed a JavaScript script,
or even worse, onto a page which could be a security risk to anyone
visiting the page, or possibly even the server.
This is most likely the same in vBulletin.
Seems you can override it in the forum settings maybe?
Alternatively, if you can change you script, so that you can append a ".jpg" extension to the end, then that may also work!
I think what happens is browser caches image. Try adding header('Cache-Control: max-age=0'); before readfile($image_url);
Sorry if the title is a bit vague, couldn't think of a better way to phrase it, anyway.
I'm attempting to make a page system for a website. Where you predictably start on page one, and then click page two and a different set of images appear. Each page has 12 images which are all thumbnail images. You click on the thumbnail image and lightbox brings up the high res shot.
My current problem is that I cannot link the PHP script to the images correctly. To me it looks correct but it doesn't work, so clearly not.
Info:
Thumbnails are name "thumb1.jpg" from 1-24, full images are name "img1.jpg" from 1-24
<?php
$imgs = array(12, 12, );
if(!empty($_GET["page"]))
{
$currPage = $_GET["page"];
}
else
{
$currPage = 1;
}
for($i = 1; $i<$imgs[$currPage-1]+1;$i++)
{
echo "<a href='albums/norfolk weekender 2012/img'.$imgs[$currPage][$i].'.jpg' rel='lightbox[group]'><img src='albums/norfolk weekender 2012/thumb'.$imgs[$currPage][$i].'.jpg'/></a>";
}
?>
.
Anyway, I'm unsure why it doesn't work, and any help will be much appreciated.
Ta.
John.
'.$imgs[$currPage][$i].'
It looks like you should be using " instead of ' to wrap round this embedded variable both times you reference it in the code, since your echo is distinguished by ".
Either way, looking at this it doesn't seem this array structure you've got going on is working.
"albums/norfolk weekender 2012/img".$imgs[$currPage][$i].".jpg"
Have you not considered something like this (care, it's rough); with $pageNo representing $_GET["page"]
for ( $i = ($pageNo - 1) * 12 + 1; $i <= ($pageNo * 12); $i++ )
{
echo "<a href='albums/norfolk weekender 2012/img".$i.".jpg' rel='lightbox[group]'><img src='albums/norfolk weekender 2012/thumb".$i.".jpg'/></a>";
}
If presentation (i.e. checking to see if an image exists before displaying it) is a major concern, you could use file_exists( filename ). By creating an Array like this...
$imgs = array(12, 12, );
...you are simply creating an array containing two elements of 12 (and possibly a blank element, I'm not entirely sure.) I think where you went wrong is you attempted to declare the size in the "constructor" of Array; in PHP this is not the case.
I have a simple PHP script that enables users to upload images on a server. I am after some help in displaying these images as thumbnails in an HTMl page and then letting the user click on these thumbnails and then the original picture is displayed in a new page.
Can I use straight HTML for this? Or do I need some combination of javascript or PHP variant?
I know that there are many questions about this on stackoverflow, and I have tried them, but nothing is what I am after.
I would prefferably like the thumbnails be created on the 'fly' rather than me personally having to create each thumbnal when a user uploads an image.
So basically what language should I use to do this? And also can I have some source code if possible?
thanks
Creating thumbnails every time they are requested is a very bad idea - it takes a lot of processing power, which would be easily saved by keeping them around the first time you create them. I would suggest putting the thumbnail creation in the php script that processes the file upload, so that you save the image and its thumbnail to disk at the same time. You can also keep the thumbnail in memory, or wait until the first time it's requested to create it, but either way you cannot re-generate it every time it is requested.
It is possible to use html to change an image's size, by simply setting the width and/or height properties:
<img src='foo.jpg' alt='foo' width='500' height='300'/>
However, this is a bad idea if you aren't certain that the user will later want to view the full-sized image. The reason is that a thumbnail has a smaller filesize than the full image: if the client only wants to view the thumbnail, then you don't want to waste bandwidth (= your money and the client's time) sending them the full image.
As for your interface, you don't need javascript to accomplish that, just html. However, you will need a server-side script to create the thumbnails that your html page links to.
There are plenty of php thumbnail scripts out there.
Either you use a rewriter to still show the original path, but server a php thumbnail version. Or you have to have the url change to something like:
<img src="thumb.php?file=path/to/picture.jpg&size=128" />
Mighty Stuff
phpThumb
Are just such two. Best configured to utilize the cached folder. I use a modified version of the first script at work.
Here's a PHP script you can build appon only works with jpg images.
It will scan through a directory, normalize the image to a decent dimension and also make a thumb on the fly, then on next refresh it wont need to reprocess the image as its already present in the thumbs dir. Hope it helps...
Script placement
Root>
thisscript.php
/images/
someimage.jpg
someimage2.jpg
thisscript.php
<?php
// config section
$path = "./images/";
$thpath = $path."thumbs/";
// end configration
// Open the directory
$do = dir($path);
// now check if the thumb dir is available if not, create it!!
if (!is_dir($thpath)){
mkdir($thpath);
}
$output = '<div>';
while (($file = $do->read()) !== false){
if (is_dir($path.$file)){
continue;
}else{
$info = pathinfo($path.$file);
$fileext = $info['extension'];
if (strtolower($fileext) == 'jpg'){
if (!is_file($thpath.$file)){
//Normalize Super lrg Image to 750x550
thumb_it($path, $file, $path,750,550,99);
//Make Thumb 200x125
thumb_it($path, $file, $thpath,200,125,99);
$output .='<p><img src="'.$thpath.$file.'" title="" alt="" /></p>';
}else{
$output .='<p><img src="'.$thpath.$file.'" title="" alt="" /></p>';
}
}
}
}
$output .='</div>';
echo $output;
//Functions
function thumb_it($dirn, $file, $thumbdir,$rwidth,$rheight,$quality){
set_time_limit(0);
$filename = $dirn.$file;
$thfilename = $thumbdir.preg_replace('/[^a-zA-Z0-9.-]/s', '_', $file);
// get the filename and the thumbernail directory
if (is_file($filename)){
// create the thumbernail from the original picture
$im = #ImageCreateFromJPEG($filename);
if($im==false){return false;}
$width = ImageSx($im); // Original picture width is stored
$height = ImageSy($im); // Original picture height is stored
if (($width < $rwidth) && ($height < $rheight)){
$n_height = $height;
$n_width = $width;
}else{
// saveing the aspect ratio
$aspect_x = $width / $rwidth;
$aspect_y = $height / $rheight;
if ($aspect_x > $aspect_y){
$n_width = $rwidth;
$n_height = $height / $aspect_x;
}else{
$n_height = $rheight;
$n_width = $width / $aspect_y;
}
}
$newimage = imagecreatetruecolor($n_width, $n_height);
// resizing the picture
imageCopyResized($newimage, $im, 0, 0, 0, 0, $n_width, $n_height, $width, $height);
// writing to file the thumbnail
if(file_exists($thfilename)){chmod($thfilename, 0777);}
Imagejpeg($newimage, $thfilename, $quality);
imagedestroy($newimage);
imagedestroy($im);
}
}
?>
I have a 1 pixel tall by 760 pixel wide image that I use as a repeating vertical background image. The right side of this image is filled with a spot color (the remaining left side of the image is white).
The purpose of this background image, in my css based layout, is that it provides the illusion that the sidebar background color runs all the way down the page (easy to do with tables, but no so much with CSS positioning).
What I need to do is to figure a way to feed a php script (background-image.php) which contains the imagecreatefromgif function, a hex number and have it use that to repaint the spot color of the image to match the spot color that's passed in and save the resulting image onto the server, overwriting the default one.
Ideally, I'd not like to have to call this function everytime the template loads, and onlydo it when the user elects to change the template colors. So once they do that, I'd just like to modify the existing image I've got on the server which will always be called "sidebar_bg.gif"
Any ideas on how to do this are much appreciated.
Something like this could do it:
$token = md5(serialize(array($red, $green, $blue)));
if (!file_exists('cachedir/'.$token.'.gif'))
{
$img = imagecreatefromgif('origfilename.gif');
$color = imagecolorallocate($img, $red, $green, $blue);
for ($i = $startPixel-1; $i < $endPixel; $i++)
{
imagesetpixel($img, $i, 0, $color);
}
imagegif($img, 'cachedir/'.$token.'.gif');
}
serveFile($token);
EDIT: Added caching to example code
Just an addition to this post. You can convert HEX color into RGB notation with the folowing function:
function hexToRGB ($hexColor)
{
$output = array();
$output['red'] = hexdec($hexColor[0].$hexColor[1]);
$output['green'] = hexdec($hexColor[2].$hexColor[3]);
$output['blue'] = hexdec($hexColor[4].$hexColor[5]);
return $output;
}
e.g. try:
var_dump(hexToRGB("FFFFFF"));