librelist archives

« back to archive

To send data from the user and use it to dynamically generate Image.

To send data from the user and use it to dynamically generate Image.

From:
angela martin
Date:
2012-07-07 @ 07:09
Hi,
I was working on a Python script where I want to send a image from the user
selected by it to the page where that image can be used to generate another
image.
I know it's complicated.

My code is:
from flask import Flask, render_template
@app.route("/try")
def editor():
text = request.form["Text"]
color = request.form["color"]
Image = request.form["Image"]
make_img(text,font=Font,image=Image)
return render_template('editor.html',image=img)
def
make_img(text,font="Dearest.ttf",FontSize=45,Image="cute.jpg",color=color):
bg="#ffffff"
fg="#000000"
font_size = FontSize
fnt = ImageFont.truetype(font, font_size)
lineWidth = 20
img = Image.open(image)
imgbg = Image.new('RGBA', img.size, "#000000") # make an entirely black
image
mask = Image.new('L',img.size,"#000000")       #mask
draw = ImageDraw.Draw(img)                     # draw on the main image
drawmask = ImageDraw.Draw(mask)                #draw on the mask
drawmask.line((0, lineWidth/2, img.size[0],lineWidth/2),fill="#000000",
width=10)        # draw a line on the mask
img.paste(imgbg, mask=mask)
draw.text((10,0), text, font=fnt, fill=bg)     # add some text to the main
del draw
return img

the user selects the Image and when he selects it. It sends a request to
another page /editor where different options are available to the user to
select the color, text to write on the image and fontsize and all. and when
the user selects the button "generate image". It should generate the image.
The problem is that how i send that image location to the other page for
the editing. and How do I get the options selected by the users to the
script. I thought of using Jquery and all but got confused what to select.
I am using Mysql to store the Path of the images.
How to send values to the script from Flask. I hope someone might know the
solution to this.
Thanks for all your time and help.

Re: [flask] To send data from the user and use it to dynamically generate Image.

From:
Ign Aarushi
Date:
2012-07-07 @ 10:36
You should try using JQuery I guess.
http://flask.pocoo.org/docs/patterns/jquery/

Re: [flask] To send data from the user and use it to dynamically generate Image.

From:
Delilah Parks
Date:
2012-07-07 @ 11:08
I am using mongodb ... specifically gridfs for images. I am now stuck on
how to dynamically resize images and still use them within gridfs.
Has any one dode this or know where I can find an example. I have searched
every where but I can't seem to wrap my head around the concept.

Any advise or help would be appreciated. Thanks all!
Delilah

On Sat, Jul 7, 2012 at 6:36 AM, Ign Aarushi <ign.aarushi@gmail.com> wrote:

> You should try using JQuery I guess.
> http://flask.pocoo.org/docs/patterns/jquery/

Re: [flask] To send data from the user and use it to dynamically generate Image.

From:
angela martin
Date:
2012-07-07 @ 11:38
@Aarushi Thanks for the help but I still don't know how to use JQuery
properly to do this task.

Re: [flask] To send data from the user and use it to dynamically generate Image.

From:
angela martin
Date:
2012-07-07 @ 11:39
If anyone know how to combine JQuery and Flask to take input from the user
and use it then please help.
Thank you!

Re: [flask] To send data from the user and use it to dynamically generate Image.

From:
Budi Arief Gusandi
Date:
2012-07-07 @ 11:57
Hi Angela,

Aarushi gave you http://flask.pocoo.org/docs/patterns/jquery/ as starting
point. First try to understand how jquery ajax work to submit form, direct
submit or via serialization and next how to get the response back from
flask whether you want to get the data in json format or html.

var data = $('#your-form-id').serialize();
$.post('/try', data,  function(response) {
  //Do something with your response: alert(response);
  $('.result').html(response);
});

Hope the code above help you.

Budi


On Jul 7, 2012 6:39 PM, angela martin <martinangela63@gmail.com> wrote:

> If anyone know how to combine JQuery and Flask to take input from the user
> and use it then please help.
> Thank you!
>

Re: [flask] To send data from the user and use it to dynamically generate Image.

From:
pronoyc@gmail.com
Date:
2012-07-07 @ 12:17
Or kill 2 birds with one stone. Use Flask-Sijax. Trivial and easy.


Hi Angela,
>
> Aarushi gave you http://flask.pocoo.org/docs/patterns/jquery/ as starting
> point. First try to understand how jquery ajax work to submit form, direct
> submit or via serialization and next how to get the response back from
> flask whether you want to get the data in json format or html.
>
>
> var data = $('#your-form-id').serialize();
> $.post('/try', data,  function(response) {
>   //Do something with your response: alert(response);
>   $('.result').html(response);
> });
>
> Hope the code above help you.
>
> Budi
>
>
> On Jul 7, 2012 6:39 PM, angela martin <martinangela63@gmail.com> wrote:
>
>> If anyone know how to combine JQuery and Flask to take input from the
>> user and use it then please help.
>> Thank you!
>>
>


-- 
Regards,

Pronoy Chopra
http://blog.pronoy.in <http://www.pronoy.in/about>/
http://www.twitter.com/pronoyc

Re: [flask] To send data from the user and use it to dynamically generate Image.

From:
angela martin
Date:
2012-07-07 @ 12:26
@ BUDI ARIEF GUSANDI
Thank you for the help. I will try that way.

Re: [flask] To send data from the user and use it to dynamically generate Image.

From:
angela martin
Date:
2012-07-07 @ 12:31
@ pronoyc Can you give some code or example regarding my problem please.  I
need to get multiple values from the user(Image, Text, Color etc.) and use
them to generate a image and show it on the same webpage.
and i can't understand how to control the urls in it.

Re: [flask] To send data from the user and use it to dynamically generate Image.

From:
pronoyc@gmail.com
Date:
2012-07-07 @ 12:38
https://github.com/spantaleev/flask-sijax/tree/master/examples

1. Create a form that takes user input.
2. Add Sijax script to the page that takes the value from the form and
sends it across to the views function.
3. The views take the data and process it.



@ pronoyc Can you give some code or example regarding my problem please.  I
> need to get multiple values from the user(Image, Text, Color etc.) and use
> them to generate a image and show it on the same webpage.
> and i can't understand how to control the urls in it.
>



-- 
Regards,

Pronoy Chopra
http://blog.pronoy.in <http://www.pronoy.in/about>/
http://www.twitter.com/pronoyc

Re: [flask] To send data from the user and use it to dynamically generate Image.

From:
angela martin
Date:
2012-07-07 @ 12:44
@pronoyc Thanks! Thanks a lot