jQuery Forum

I would assume you would put a set timeout function on it somewhere and then have the the form submit and process thru ajax, and when the response from the server is complete, you will append the new thumbnail image to the page.
<br clear="all">
--
Benjamin Sterling
<a href="http://www.KenzoMedia.com">http://www.KenzoMedia.com</a>
<a href="http://www.KenzoHosting.com">http://www.KenzoHosting.com</a>
_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/

yea that`s the idea.. nut how to make it in ajax?
<div><span class="gmail_quote">2007/3/22, Benjamin Sterling <<a href="mailto:benjamin.sterling@kenzomedia.com">benjamin.sterling@kenzomedia.com</a>>:</span><blockquote class="gmail_quote" style="border-left: 1px solid rgb(204, 204, 204); margin: 0pt 0pt 0pt 0.8ex; padding-left: 1ex;">
I would assume you would put a set timeout function on it somewhere and then have the the form submit and process thru ajax, and when the response from the server is complete, you will append the new thumbnail image to the page.
<span class="sg"><br clear="all">
--
Benjamin Sterling
<a href="http://www.KenzoMedia.com" target="_blank" onclick="return top.js.OpenExtLink(window,event,this)">http://www.KenzoMedia.com</a>
<a href="http://www.KenzoHosting.com" target="_blank" onclick="return top.js.OpenExtLink(window,event,this)">
http://www.KenzoHosting.com</a>
</span>
_______________________________________________
jQuery mailing list
<a onclick="return top.js.OpenExtLink(window,event,this)" href="mailto:discuss@jquery.com">discuss@jquery.com</a>
<a onclick="return top.js.OpenExtLink(window,event,this)" href="http://jquery.com/discuss/" target="_blank">
http://jquery.com/discuss/</a>
</blockquote></div>
_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/

I would think that you could do this using php and gd...
http://us3.php.net/manual/en/ref.image.php
here's one way to do it... http://icant.co.uk/articles/phpthumbnails/
a quick search for "php create thumbnails" should help you find
other/better resources for creating images on the fly with php.
-Omar

that would require intimate knowledge of png format internals... I've
never seen that kind of code in Javascript! php or perl would be a
much saner direction!

<blockquote style="border-left: 1px solid rgb(204, 204, 204); margin: 0pt 0pt 0pt 0.8ex; padding-left: 1ex;" class="gmail_quote"><div style="direction: ltr;">I would think that you could do this using php and gd...
<a onclick="return top.js.OpenExtLink(window,event,this)" href="http://us3.php.net/manual/en/ref.image.php" target="_blank">
http://us3.php.net/manual/en/ref.image.php</a>
here's one way to do it... <a onclick="return top.js.OpenExtLink(window,event,this)" href="http://icant.co.uk/articles/phpthumbnails/" target="_blank">http://icant.co.uk/articles/phpthumbnails/
</a>
a quick search for "php create thumbnails" should help you find
other/better resources for creating images on the fly with php.</div></blockquote><div>
Thanx alot :D but that`s not what i need.
<blockquote style="border-left: 1px solid rgb(204, 204, 204); margin: 0pt 0pt 0pt 0.8ex; padding-left: 1ex;" class="gmail_quote">that would require intimate knowledge of png format internals... I've
never seen that kind of code in Javascript! php or perl would be a
much saner direction!</blockquote><div>
you missed something i think.
take another close look at this image: <a href="http://img393.imageshack.us/my.php?image=magedbimageuploadcopylc6.png">http://img393.imageshack.us/my.php?image=magedbimageuploadcopylc6.png
</a>
in the image i describe that the  image is first selected. than when THAT field doesn`t change (and is filled in ofcause) for a few seconds the upload will automatically start!! than those ajax get or posts things.. depends on how the form works:
GET: <a href="http://docs.jquery.com/API/1.1/AJAX#.24.get.28_url.2C_params.2C_callback_.29">http://docs.jquery.com/API/1.1/AJAX#.24.get.28_url.2C_params.2C_callback_.29</a>
POST: <a href="http://docs.jquery.com/API/1.1/AJAX#.24.post.28_url.2C_params.2C_callback_.29">
http://docs.jquery.com/API/1.1/AJAX#.24.post.28_url.2C_params.2C_callback_.29</a>
so when running that GET or POST the thumbnail is generated through PHP (not javascript!! javascript is just gonna send the command to create it) that GET or POST than returns the url to the thumbnail and that should than appear like in the screenshot.
the thumbnailing part itself is probably the least of my worries. the main thing i can`t get working right now is the automatic uploading.
if you still don`t get how this works open up gmail and attatch a file to a post. you will see that it`s auto uploading after a few seconds. that`s what i want.
anything more that needs to be cleared up?
thanx for the replys so far.
Mark.
</div>
 
</div>
<div><span class="gmail_quote">2007/3/23, Ⓙⓐⓚⓔ <<a href="mailto:jakecigar@gmail.com">jakecigar@gmail.com
</a>>:</span><blockquote class="gmail_quote" style="border-left: 1px solid rgb(204, 204, 204); margin: 0pt 0pt 0pt 0.8ex; padding-left: 1ex;">that would require intimate knowledge of png format internals... I've
never seen that kind of code in Javascript! php or perl would be a
much saner direction!
On 3/23/07, Mark <<a href="mailto:markg85@gmail.com">markg85@gmail.com</a>> wrote:
> yea that`s the idea.. nut how to make it in ajax?
>
> 2007/3/22, Benjamin Sterling
> <<a href="mailto:benjamin.sterling@kenzomedia.com">benjamin.sterling@kenzomedia.com</a>>:
> >
> > I would assume you would put a set timeout function on it somewhere and
> then have the the form submit and process thru ajax, and when the response
> from the server is complete, you will append the new thumbnail image to the
> page.
> >
> >
> > --
> > Benjamin Sterling
> > <a href="http://www.KenzoMedia.com">http://www.KenzoMedia.com</a>
> > <a href="http://www.KenzoHosting.com">http://www.KenzoHosting.com</a>
> > _______________________________________________
> > jQuery mailing list
> > <a href="mailto:discuss@jquery.com">discuss@jquery.com</a>
> > <a href="http://jquery.com/discuss/">http://jquery.com/discuss/</a>
> >
> >
>
>
> _______________________________________________
> jQuery mailing list
> <a href="mailto:discuss@jquery.com">discuss@jquery.com</a>
> <a href="http://jquery.com/discuss/">http://jquery.com/discuss/
</a>
>
>
--
Ⓙⓐⓚⓔ - יעקב   ʝǡǩȩ   ᎫᎪᏦᎬ
_______________________________________________
jQuery mailing list
<a href="mailto:discuss@jquery.com">discuss@jquery.com</a>
<a href="http://jquery.com/discuss/">
http://jquery.com/discuss/</a>
</blockquote></div>
_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/

that's the ol' little form upload trick! not the making a thumbnail trick!!
I've never done it , but I'm sure others have!

well.. i want to do more than just uploading but for now that`s enough.
any idea how i can do that? it might be a "old little form upload trick", but i can`t find any samples.
<div><span class="gmail_quote">
2007/3/23, Ⓙⓐⓚⓔ <<a href="mailto:jakecigar@gmail.com">jakecigar@gmail.com</a>>:</span><blockquote class="gmail_quote" style="border-left: 1px solid rgb(204, 204, 204); margin: 0pt 0pt 0pt 0.8ex; padding-left: 1ex;">
that's the ol' little form upload trick! not the making a thumbnail trick!!
I've never done it , but I'm sure others have!
On 3/23/07, Mark <<a href="mailto:markg85@gmail.com">markg85@gmail.com
</a>> wrote:
> >
> > I would think that you could do this using php and gd...
> > <a href="http://us3.php.net/manual/en/ref.image.php">http://us3.php.net/manual/en/ref.image.php</a>
> >
> > here's one way to do it...
> <a href="http://icant.co.uk/articles/phpthumbnails/">http://icant.co.uk/articles/phpthumbnails/</a>
> >
> > a quick search for "php create thumbnails" should help you find
> > other/better resources for creating images on the fly with php.
>
> Thanx alot :D but that`s not what i need.
>
> > that would require intimate knowledge of png format internals... I've
> > never seen that kind of code in Javascript! php or perl would be a
> > much saner direction!
>
> you missed something i think.
>
> take another close look at this image:
>
<a href="http://img393.imageshack.us/my.php?image=magedbimageuploadcopylc6.png">http://img393.imageshack.us/my.php?image=magedbimageuploadcopylc6.png</a>
> in the image i describe that the  image is first selected. than when THAT
> field doesn`t change (and is filled in ofcause) for a few seconds the upload
> will automatically start!! than those ajax get or posts things.. depends on
> how the form works:
> GET:
> <a href="http://docs.jquery.com/API/1.1/AJAX#.24.get.28_url.2C_params.2C_callback_.29">
http://docs.jquery.com/API/1.1/AJAX#.24.get.28_url.2C_params.2C_callback_.29</a>
> POST:
> <a href="http://docs.jquery.com/API/1.1/AJAX#.24.post.28_url.2C_params.2C_callback_.29">http://docs.jquery.com/API/1.1/AJAX#.24.post.28_url.2C_params.2C_callback_.29
</a>
>
> so when running that GET or POST the thumbnail is generated through PHP (not
> javascript!! javascript is just gonna send the command to create it) that
> GET or POST than returns the url to the thumbnail and that should than
> appear like in the screenshot.
>
> the thumbnailing part itself is probably the least of my worries. the main
> thing i can`t get working right now is the automatic uploading.
> if you still don`t get how this works open up gmail and attatch a file to a
> post. you will see that it`s auto uploading after a few seconds. that`s what
> i want.
>
> anything more that needs to be cleared up?
> thanx for the replys so far.
>
> Mark.
>
>
>
>
> 2007/3/23, Ⓙⓐⓚⓔ <<a href="mailto:jakecigar@gmail.com">jakecigar@gmail.com</a> >:
> > that would require intimate knowledge of png format internals... I've
> > never seen that kind of code in Javascript! php or perl would be a
> > much saner direction!
> >
> > On 3/23/07, Mark <<a href="mailto:markg85@gmail.com">markg85@gmail.com</a>> wrote:
> > > yea that`s the idea.. nut how to make it in ajax?
> > >
> > > 2007/3/22, Benjamin Sterling
> > > <<a href="mailto:benjamin.sterling@kenzomedia.com">benjamin.sterling@kenzomedia.com</a>>:
> > > >
> > > > I would assume you would put a set timeout function on it somewhere
> and
> > > then have the the form submit and process thru ajax, and when the
> response
> > > from the server is complete, you will append the new thumbnail image to
> the
> > > page.
> > > >
> > > >
> > > > --
> > > > Benjamin Sterling
> > > > <a href="http://www.KenzoMedia.com">http://www.KenzoMedia.com</a>
> > > >
<a href="http://www.KenzoHosting.com">http://www.KenzoHosting.com</a>
> > > > _______________________________________________
> > > > jQuery mailing list
> > > > <a href="mailto:discuss@jquery.com">
discuss@jquery.com</a>
> > > > <a href="http://jquery.com/discuss/">http://jquery.com/discuss/</a>
> > > >
> > > >
> > >
> > >
> > > _______________________________________________
> > > jQuery mailing list
> > > <a href="mailto:discuss@jquery.com">discuss@jquery.com</a>
> > > <a href="http://jquery.com/discuss/">http://jquery.com/discuss/</a>
> > >
> > >
> >
> >
> > --
> > Ⓙⓐⓚⓔ - יעקב   ʝǡǩȩ   ᎫᎪᏦᎬ
> > _______________________________________________
> > jQuery mailing list
> > <a href="mailto:discuss@jquery.com">
discuss@jquery.com</a>
> > <a href="http://jquery.com/discuss/">http://jquery.com/discuss/</a>
> >
>
>
> _______________________________________________
> jQuery mailing list
>
<a href="mailto:discuss@jquery.com">discuss@jquery.com</a>
> <a href="http://jquery.com/discuss/">http://jquery.com/discuss/</a>
>
>
--
Ⓙⓐⓚⓔ - יעקב   ʝǡǩȩ   ᎫᎪᏦᎬ
_______________________________________________
jQuery mailing list
<a href="mailto:discuss@jquery.com">discuss@jquery.com</a>
<a href="http://jquery.com/discuss/">http://jquery.com/discuss/</a>
</blockquote></div>
_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/

On 3/23/07, Mark <markg85@gmail.com>

ehm.. my javascript knowledge is kinda limited ^_^
would you (or anyone that has some javascript knowledge) like to make a sample code? i can expand it to mu wishes when i have a sample code but it`s really hard for me to start from scratch. i can do all the php coding myself
Thanx
Mark.
<div><span class="gmail_quote">2007/3/23, Mateusz Misiorny <<a href="mailto:mateusz.misiorny@gmail.com">mateusz.misiorny@gmail.com</a>>:</span><blockquote class="gmail_quote" style="border-left: 1px solid rgb(204, 204, 204); margin: 0pt 0pt 0pt 0.8ex; padding-left: 1ex;">
On 3/23/07, Mark <<a href="mailto:markg85@gmail.com">markg85@gmail.com</a>> wrote:
> [...]
>
> the thumbnailing part itself is probably the least of my worries. the main
> thing i can`t get working right now is the automatic uploading.
> if you still don`t get how this works open up gmail and attatch a file to a
> post. you will see that it`s auto uploading after a few seconds. that`s what
> i want.
That should be easy. I do something similar to input field for
searching which don't have an explicit "search" button next to
themselves, they just sit and wait until you stop typing and then
start the search on its own.
Goes like this: for each keystroke I set a timeout which fires ajax
call when finished.
If a new keystroke comes, the "old" timeout is obviously reset to its
start value again.
This way you can type as much as you want and nothing happens because
the timeout is being reset all the time, but when you finish and wait
2 seconds (or whatever), the action will fire.
You could try something like that with onchange() on the form file field
Should do the trick.
good luck,
Matt
_______________________________________________
jQuery mailing list
<a href="mailto:discuss@jquery.com">discuss@jquery.com</a>
<a href="http://jquery.com/discuss/">http://jquery.com/discuss/</a>
</blockquote></div>
_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/

On 3/23/07, Mark <markg85@gmail.com>

do you have a special timeout extension installed? cause that`s not working for me.
<div><span class="gmail_quote">2007/3/23, Mateusz Misiorny <<a href="mailto:mateusz.misiorny@gmail.com">mateusz.misiorny@gmail.com
</a>>:</span><blockquote class="gmail_quote" style="border-left: 1px solid rgb(204, 204, 204); margin: 0pt 0pt 0pt 0.8ex; padding-left: 1ex;">On 3/23/07, Mark <<a href="mailto:markg85@gmail.com">markg85@gmail.com</a>
> wrote:
> ehm.. my javascript knowledge is kinda limited ^_^
> would you (or anyone that has some javascript knowledge) like to make a
> sample code? i can expand it to mu wishes when i have a sample code but it`s
> really hard for me to start from scratch. i can do all the php coding myself
Ok, from my experience you learn more if you figure out stuff yourself
so I wanted to just push you in the right direction, but here is the
code I use:
var timer;
jQuery(function($) {
                $('#text').bind("keyup", function()
                        {
                                clearTimeout(timer);
                                timer = setTimeout(make_request, 1000);
                        });
        });
        function make_request() { ajax stuff }
<input type="text" name="text" id="text" size="25"/> <br/>
Hope it gets you going!
Matt
_______________________________________________
jQuery mailing list
<a href="mailto:discuss@jquery.com">discuss@jquery.com</a>
<a href="http://jquery.com/discuss/">
http://jquery.com/discuss/</a>
</blockquote></div>
_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/

oke.. timeout is a default javascript function :P
i`m getting somewhere now.
i will post my results when i`m getting close to the final result. or i will put it online somewhere.. i think this can be verry usefull for others aswell.
<div><span class="gmail_quote">2007/3/23, Mark <<a href="mailto:markg85@gmail.com">markg85@gmail.com</a>>:</span><blockquote class="gmail_quote" style="border-left: 1px solid rgb(204, 204, 204); margin: 0pt 0pt 0pt 0.8ex; padding-left: 1ex;">
do you have a special timeout extension installed? cause that`s not working for me.
<div><span class="q"><span class="gmail_quote">2007/3/23, Mateusz Misiorny <<a href="mailto:mateusz.misiorny@gmail.com" target="_blank" onclick="return top.js.OpenExtLink(window,event,this)">
mateusz.misiorny@gmail.com
</a>>:</span></span><div><span class="e" id="q_11180edfec059877_2"><blockquote class="gmail_quote" style="border-left: 1px solid rgb(204, 204, 204); margin: 0pt 0pt 0pt 0.8ex; padding-left: 1ex;">On 3/23/07, Mark <
<a href="mailto:markg85@gmail.com" target="_blank" onclick="return top.js.OpenExtLink(window,event,this)">markg85@gmail.com</a>
> wrote:
> ehm.. my javascript knowledge is kinda limited ^_^
> would you (or anyone that has some javascript knowledge) like to make a
> sample code? i can expand it to mu wishes when i have a sample code but it`s
> really hard for me to start from scratch. i can do all the php coding myself
Ok, from my experience you learn more if you figure out stuff yourself
so I wanted to just push you in the right direction, but here is the
code I use:
var timer;
jQuery(function($) {
                $('#text').bind("keyup", function()
                        {
                                clearTimeout(timer);
                                timer = setTimeout(make_request, 1000);
                        });
        });
        function make_request() { ajax stuff }
<input type="text" name="text" id="text" size="25"/> <br/>
Hope it gets you going!
Matt
_______________________________________________
jQuery mailing list
<a href="mailto:discuss@jquery.com" target="_blank" onclick="return top.js.OpenExtLink(window,event,this)">
discuss@jquery.com</a>
<a href="http://jquery.com/discuss/" target="_blank" onclick="return top.js.OpenExtLink(window,event,this)">
http://jquery.com/discuss/</a>
</blockquote></span></div></div>
</blockquote></div>
_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/