Web Hosting Talk







View Full Version : How can one detect image pixel size via file input field regardless of the browser ty


airnine
04-12-2004, 10:40 AM
This issue is about getting info of an image that was selected as a file via a file input field? What I am trying to do is establish the width and height of an image. This image is defined by a value in a file input field. That means I have a client browse to a file and choose it. After he's made a choice I want to get the width and height values.

Now, in IE this can be done several ways. For example one can create an image via var newImage=document.createElement('img') function, define newImage.src=fileInputFieldValue and have width and height values read from the image. For that fact you could already have an image in your document like <img src="" name="myImage" id="myImage" /> and just give src a value defined by the file input field. So all clear here.

What the problem is, this works in no other browser. I came across some security issues connected to this doing in NN, but I wasn't sure what it meant.

Anyway, I want to submit an image file with a form and along with it I'm sending image height and width values defining the size at which it will be displayed at a later time. All I want to do is show the client how big the image will actually look.

If anybody has a good suggestion, please assist. Thanks to all in advanced.

Regards, Airnine

Ziad
04-12-2004, 12:09 PM
Does it have to be done necessarly before the form is processed? I was thinking you could just have the image sent in the form, and have a small PHP script to process the image and find the height/width, then finally send it to its end user.

You can use:

$size = getimagesize("PATH_WHERE_IMAGE_WAS_UPLOADED");

$size[0] is the width, $size[1] is the height. As an added bonus, $size[3] is an html string that you can use as follows:

echo "<img src=\"PATH_TO_IMAGE\" ".$size[3].">";

Hope this helps...

airnine
04-12-2004, 02:18 PM
Thanks for your input, but as I said, it needs to be done client-side, so it's visualized immediately. As for the php, I am well aware of it's possibilities and must say it's very powerful when it comes to image manipulation, however I can not afford to send data back on forth until the user makes up their mind on terminal image size. Thanks again.

Loon
04-12-2004, 05:16 PM
You can get the image size from the tmp_name that's given to the file while it's processed so you can return the size before you finishing processing the script, and if it's not right, select another file, if it is use move_uploaded_file() to move it into the directory.


$size = getimagesize($_FILES['input_name']['tmp_name']);

airnine
04-12-2004, 08:23 PM
The following bit of code makes possible to define local source for image elements in NN and Mozilla:

if (document.layers && location.protocol.toLowerCase() != 'file:' && navigator.javaEnabled()){
netscape.security.PrivilegeManager.enablePrivilege('UniversalFileRead');
}

It basically alters privileges as the function says and overrides the default browser security settings. For that matter a similar thing can be used to make file type inputs editable without client interference in some NN editions. I am just mentioning it here, because I have been looking for a solution to that as well in some of the other postings.

Regards, Airnine