Uploads and background images.

25 views
Skip to first unread message

annet

unread,
Jan 18, 2009, 10:16:33 AM1/18/09
to web2py Web Framework
I am facing a problem similar to the one presented in the follwing
post:

http://groups.google.com/group/web2py/browse_thread/thread/dbde3f153f2b776c/66de4de738e36031?lnk=gst&q=uploads#66de4de738e36031

So far, I haven't been able to construct a solution from the entries
in this thread, I hope one of you will help me do so.


I have a view with a number of <div></div> elements, basically I want
to give users the option of setting a background image to these <div></
div> elements. Therefore, these <div></div> elements all have a
different id, which is stored in a database table.

In the view I construct a stylesheet which, amongst others, contains
the following lines of code:

{{for record in records: }} #{{=record.tag}} { background-image: url
('../uploads/{{=record.image}}') ;
{{pass}}


This doesn't work. However, when I move the images to the images
folder in the static folder the following lines of code do work:

{{for record in records: }} #{{=record.tag}} { background-image: url
('../static/images/{{=record.image}}') ;
{{pass}}


Since I don't want to bypass the uploads functionality in web2py, I am
looking for a solution as described in the thread above.


Best regards,

Annet.

mdipierro

unread,
Jan 18, 2009, 11:17:05 AM1/18/09
to web2py Web Framework
do you have an action called upload? should it be called download?
I may need to see a longer portion of the view.

Massimo

On Jan 18, 9:16 am, annet <jmverm...@planet.nl> wrote:
> I am facing a problem similar to the one presented in the follwing
> post:
>
> http://groups.google.com/group/web2py/browse_thread/thread/dbde3f153f...

annet

unread,
Jan 18, 2009, 12:00:31 PM1/18/09
to web2py Web Framework
Massimo,

I don't have an upload or download function. In the controller I have
a function compage which contains the following lines of code:

def compage():
records=db(db.images.organisation==id).select(db.images.ALL)
....
return dict(records=records)


As I explained in my previous post, I then have the following code in
the view:

{{for record in records: }} #{{=record.tag}} { background-image: url
('../uploads/{{=record.image}}') ;
{{pass}}

which is part of the following <style></style> element:

<style type="text/css">
{{for record in records: }}
#{{=record.tag}} {
background-image: url('../uploads/{{=record.image}}') ;
background-repeat: repeat-x ;
}{{pass}}
</style>

The problem results from the fact that the uploads folder isn't
accessible from the browser. When I put the images in anither folder
the problem is solved, but I want the user to be able to upload and
delete an image using the upload facilities in web2py. Voltron solved
this problem in the thread mentioned above, however, I haven't got a
clue how he did that. Maybe using the download action would solve the
problem but I don't know how to implement that.

Best regards,

Annet.

mdipierro

unread,
Jan 18, 2009, 2:04:51 PM1/18/09
to web2py Web Framework
This

('../uploads/{{=record.image}}') ;

should instead be

{{=URL(r=request,f='dowload',args=record.image)}}

and you need a controller like

def download():
import os
return response.stream(os.join
(request.folder,'uploads',request.args[0]))

web2py does not automatically serve files other those in the static
folder. Otherise it would be a big security risk.

Massimo

annet

unread,
Jan 19, 2009, 5:45:56 AM1/19/09
to web2py Web Framework
Massimo,

I am still struggling with this part of my application. I built a
simple mock application containing only the relevant part of the
problem.

The model defines one table: image:

db.define_table('image',
SQLField('organisation'),
SQLField('title'),
SQLField('div'),
SQLField('file','upload'),
migrate='image.table')

db.image.title.requires=[IS_NOT_EMPTY(),IS_NOT_IN_DB
(db,db.image.title)]


The controller contains 2 functions: index() and download().
I hard-coded the image.organisation variable because it bears no
relevance to solving the problem.

def index():
response.view='image_layout.html'
images=db(db.image.organisation==1).select(db.image.ALL)
return dict(images=images)


def download():
import os
path=os.path.join(request.folder,'uploads',request.args[0])
return response.stream(path)


The view contains the <style></style> element which I want to generate
dynamically based on the contents of the image table.

<link href="{{=URL(r=request,c='static',f='images.css')}}"
rel="stylesheet" type="text/css" media="screen" charset="utf-8" />
<style type="text/css">
{{for image in images:}}
#{{=image.div}} {
background-image: url{{=URL
(r=request,f='download',args=image.file)}};
}
{{pass}}
</style>
<div id="container">
<div id="header">
<div id="logo">

</div> <!-- logo -->
<div id="image">

</div> <!-- image -->
</div> <!-- header -->
<div id="content">

</div> <!-- content -->
<div id="footer">

</div> <!-- footer -->
</div> <!-- container -->



The image.css file reads like:

#container {
background-color: gray;
width: 984px;
height: 576px;
}

#header {
width: 100%;
}

#logo {
float: left;
width: 240px;
height: 144px;
}

#image {
float: right;
width: 720px;
height: 144px;
}

#content {}

#footer {}


When I expose the index function, the source code of the html page
reads like:

<link href="/images/static/images.css" rel="stylesheet" type="text/
css" media="screen" charset="utf-8" />
<style type="text/css">

#logo {
background-image: url/images/default/download/image.file.8bdf62bb-
ee59-411c-94ac-ef7d729dfa75.gif;
}

#image {
background-image: url/images/default/download/image.file.5d948237-
de5b-4a71-a0b6-24e2688a0d4c.jpg;
}

</style>
<div id="container">
<div id="header">
<div id="logo">

</div> <!-- logo -->
<div id="image">

</div> <!-- image -->
</div> <!-- header -->
<div id="content">

</div> <!-- content -->
<div id="footer">

</div> <!-- footer -->
</div> <!-- container -->


The contents of <style type="text/css"></style> should read something
like:

<style type="text/css">
#logo {
background-image: url('url/images/default/download/image.file.
8bdf62bb-ee59-411c-94ac-ef7d729dfa75.gif');
}
#image {
background-image: url('url/images/default/download/image.file.
5d948237-de5b-4a71-a0b6-24e2688a0d4c.jpg');
}
</style>

Where the code between ('...'); should reference the image file, which
it doesn't.


I hope that with the information provided you will be able to help me
solve this problem.


Best regards,

Annet.


mdipierro

unread,
Jan 19, 2009, 5:53:17 AM1/19/09
to web2py Web Framework
in

url{{=URL(r=request,f='download',args=image.file)}};

you have an extra "url" that gets pre-pended to the path. It should
not be there

{{=URL(r=request,f='download',args=image.file)}};

or

url('{{=URL(r=request,f='download',args=image.file)}}');

annet

unread,
Jan 19, 2009, 6:17:37 AM1/19/09
to web2py Web Framework
Massimo,

Thanks for your patience...

url('{{=URL(r=request,f='download',args=image.file)}}');

solved the problem!

Annet
Reply all
Reply to author
Forward
0 new messages