473,771 Members | 2,406 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

resize image on client side

Hi all,

I've a classic upload form where people may select images on their computer
to send on my website.

Since this is done by people not very confortable with computers, some sent
pictures are very huge (3MB) and I do resize them anyway since I only allow
500px wide pictures.

Instead of letting people upload the 3MB file then resize it on the server,
isn't there any possibility to "reduce" the file resolution on the client's
machine then upload on the server the reduced picture using javascript or
any other method ?

Thanks for any tip
May 4 '07 #1
6 4533
rf
"Bob Bedford" <bo*@bedford.co mwrote in message
news:46******** **************@ news.sunrise.ch ...
Hi all,

I've a classic upload form where people may select images on their
computer to send on my website.

Since this is done by people not very confortable with computers, some
sent pictures are very huge (3MB) and I do resize them anyway since I only
allow 500px wide pictures.

Instead of letting people upload the 3MB file then resize it on the
server, isn't there any possibility to "reduce" the file resolution on the
client's machine then upload on the server the reduced picture using
javascript or any other method ?
No.

--
Richard.
May 4 '07 #2
On May 4, 12:57 pm, "Bob Bedford" <b...@bedford.c omwrote:
Hi all,

I've a classic upload form where people may select images on their computer
to send on my website.

Since this is done by people not very confortable with computers, some sent
pictures are very huge (3MB) and I do resize them anyway since I only allow
500px wide pictures.

Instead of letting people upload the 3MB file then resize it on the server,
isn't there any possibility to "reduce" the file resolution on the client's
machine then upload on the server the reduced picture using javascript or
any other method ?

Thanks for any tip
the only ways would be to write a firefox extension, use activex for
IE (not recommended) or write an auto-upload script which doesnt use a
browser and uses something like imagemagick to crunch the images.
You could offer a .NET download to people which could resize nicely,
and then offer the upload from within the GUI which showed the ETA, it
would allow batch jobbing for more fun.
If this isnt worth it, just tell them what programs are out there
which resize and some instructions and then let them know approx times
for uploads if they don't resize first, and you could also provide the
user with some feedbck about the eta, either live, or after the
initial upload has begun you could use the filesize and approx
connection speed (you got earlier using some javascript) and show them
their eta, offering a link to the instructions page.

May 4 '07 #3
Bob Bedford wrote:
Hi all,

I've a classic upload form where people may select images on their computer
to send on my website.

Since this is done by people not very confortable with computers, some sent
pictures are very huge (3MB) and I do resize them anyway since I only allow
500px wide pictures.

Instead of letting people upload the 3MB file then resize it on the server,
isn't there any possibility to "reduce" the file resolution on the client's
machine then upload on the server the reduced picture using javascript or
any other method ?
I am going to venture an answer and say, "no."

JavaScript (without privileges) cannot write to the file system
(security and all).

Also bear in mind, size of the image is not the same thing as its width
and height.

--
-Lost
Remove the extra words to reply by e-mail. Don't e-mail me. I am
kidding. No I am not.
May 4 '07 #4
-Lost said the following on 5/4/2007 8:49 AM:
Bob Bedford wrote:
>Hi all,

I've a classic upload form where people may select images on their
computer to send on my website.

Since this is done by people not very confortable with computers, some
sent pictures are very huge (3MB) and I do resize them anyway since I
only allow 500px wide pictures.

Instead of letting people upload the 3MB file then resize it on the
server, isn't there any possibility to "reduce" the file resolution on
the client's machine then upload on the server the reduced picture
using javascript or any other method ?

I am going to venture an answer and say, "no."
Your venture is a successful one :)
JavaScript (without privileges) cannot write to the file system
(security and all).
It would need to do more than that. It would need to execute a program
on the users PC to be able to manipulate images as Javascript itself has
no means at all to modify image data.

--
Randy
Chance Favors The Prepared Mind
comp.lang.javas cript FAQ - http://jibbering.com/faq/index.html
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
May 4 '07 #5
On May 4, 3:02 pm, Randy Webb <HikksNotAtH... @aol.comwrote:
-Lost said the following on 5/4/2007 8:49 AM:
Bob Bedford wrote:
Hi all,
I've a classic upload form where people may select images on their
computer to send on my website.
Since this is done by people not very confortable with computers, some
sent pictures are very huge (3MB) and I do resize them anyway since I
only allow 500px wide pictures.
Instead of letting people upload the 3MB file then resize it on the
server, isn't there any possibility to "reduce" the file resolution on
the client's machine then upload on the server the reduced picture
using javascript or any other method ?
I am going to venture an answer and say, "no."

Your venture is a successful one :)
JavaScript (without privileges) cannot write to the file system
(security and all).

It would need to do more than that. It would need to execute a program
on the users PC to be able to manipulate images as Javascript itself has
no means at all to modify image data.

--
Randy
Chance Favors The Prepared Mind
comp.lang.javas cript FAQ -http://jibbering.com/faq/index.html
Javascript Best Practices -http://www.JavascriptT oolbox.com/bestpractices/

There are ways this can be done as mentioned above by shimmyshack. At
the moment, probably the best way to do it is with a Java applet (for
example: http://www.radinks.com/upload/ ). If you want to write your
own, have a look at the apache commons libraries in particular
fileupload, httpclient and net.

Another possibility (and i am not sure if this would work), is the
Google Gears javascript project. This gives you access to a local
datbase which you have write access to. Assuming you can access a file
from the file input object in html, you could resize an image with
your javascript (assuming you can do this), and store it in the local
database, then upload the resized image to your server. This is all
theoretical, and i have no idea if it would work, or if it is
possible...but its an idea...

Jun 18 '07 #6
to*********@gma il.com wrote:
On May 4, 3:02 pm, Randy Webb <HikksNotAtH... @aol.comwrote:
>-Lost said the following on 5/4/2007 8:49 AM:
>>Bob Bedford wrote:
Hi all,
I've a classic upload form where people may select images on their
computer to send on my website.
Since this is done by people not very confortable with computers, some
sent pictures are very huge (3MB) and I do resize them anyway since I
only allow 500px wide pictures.
Instead of letting people upload the 3MB file then resize it on the
server, isn't there any possibility to "reduce" the file resolution on
the client's machine then upload on the server the reduced picture
using javascript or any other method ?
I am going to venture an answer and say, "no."
Your venture is a successful one :)
>>JavaScript (without privileges) cannot write to the file system
(security and all).
It would need to do more than that. It would need to execute a program
on the users PC to be able to manipulate images as Javascript itself has
no means at all to modify image data.

There are ways this can be done as mentioned above by shimmyshack. At
the moment, probably the best way to do it is with a Java applet (for
example: http://www.radinks.com/upload/ ). If you want to write your
own, have a look at the apache commons libraries in particular
fileupload, httpclient and net.
But the simple and end-all answer is "no." It cannot be done with
JavaScript alone.
Another possibility (and i am not sure if this would work), is the
Google Gears javascript project. This gives you access to a local
datbase which you have write access to. Assuming you can access a file
from the file input object in html, you could resize an image with
your javascript (assuming you can do this), and store it in the local
database, then upload the resized image to your server. This is all
theoretical, and i have no idea if it would work, or if it is
possible...but its an idea...
Sure, it is possible with XHRs and server-side. I am sure no one would
argue that. Again though, can it be done with JavaScript only? No.

--
-Lost
Remove the extra words to reply by e-mail. Don't e-mail me. I am
kidding. No I am not.
Jun 18 '07 #7

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

9
9826
by: Don | last post by:
Does anyone know where I can find a client-side function I can reference from within an HTML/JavaScript web page? I'm currently using a core PHP function to do this, but I'd rather do it on the client-side and not have to upload the large raw image to the server. Thanks in advance for your help. Don ----== Posted via Newsfeeds.Com - Unlimited-Uncensored-Secure Usenet News==---- http://www.newsfeeds.com The #1 Newsgroup Service in...
0
228
by: Jim Brandley | last post by:
I have a required field with a client-side validator. It works as advertised until I try to add code to block double submits and replace the image on the submit button to give the users some feedback. I have localized the problem to the definition of the form.onSubmit handler. Without my blocker, it looks like: onsubmit="ValidatorOnSubmit();" Since my javascript to block the double submit and change the image should only run if...
0
237
by: adam roth | last post by:
Hello, We're looking for a client-side (ActiveX) control to allow web users to resize, rotate, and manipulate images on our server without requiring a server post-back for each. Once the image is to the users liking, they can then click "Save" and that'll be that. I've found plenty of really great ASP.Net components for Image maniuplation, but nothing like what I described (they're all server-side). Does anybody know of any ActiveX...
2
1580
by: moondaddy | last post by:
I need to get the size on an image client side before the client uploads it, and if its too large, I need to alert the client rather than doing a postback. The code below successfully writes the file size to the text-input element on the second click (attempt), but writes -1 on the first click. It must return the file size on the first click to be useable. Can anyone explain why it returns -1 on the first click and then the actual file...
1
2405
by: Steve Lloyd | last post by:
Hi, I am stuck on how I can resize and image client side before it is uploaded to the server. Basically remote users take images using a digital camera and we need them to upload them to the server. Most people have there cameras set to high resolution so uploading in the image and resizing once on the server is not really an option and they do not want to (not capable of!) change the camera resolution.
5
1674
by: thisis | last post by:
Hi All, Hi All, (this is not the same topic as the my previous topic) What objects/methods/properties does VBScript offer for: Assuring/guarantee/make certain that ASP/VBSCript an ELEMENT - e.g. <img ... / - was FULLY Loaded into web Browser
11
1896
by: Adam Sandler | last post by:
Hello, Having an issue with JavaScript in my ASP.Net page. I use some COTS, which for all intents and purposes, simply makes a jpeg file and physically places it in a directory on the web server. The page load codebehind, makes a connection to the jpeg creation service and gets the path of the newly created image.
8
2624
by: brahmaforces | last post by:
Hi Folks, I am using cherrypy and python. I am trying to get a user profile image to resize on the client side before uploading to the server. PHP has a gd library that does it it seems. Has anyone done this in a python environment without uploading to the server?
0
9619
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main usage, and What is the difference between ONU and Router. Let’s take a closer look ! Part I. Meaning of...
0
9454
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...
0
10103
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth. The Art of Business Website Design Your website is...
1
10038
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...
0
6713
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...
0
5354
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...
1
4007
by: 6302768590 | last post by:
Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
2
3609
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.
3
2850
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.