Dasheng gallery v0.2 (2015.7.17), v0.22015.7.17

Dasheng gallery v0.2 (2015.7.17), v0.22015.7.17
Features added in version 0.2

• Image Classification by tag
• Beautify and increase the waterfall flow effect
• Add a tag page and a single image page
• Add publish image page

The following is a detailed description.

Each added function must be modified in four aspects: model, template, view, and route.

Model: Add tag attributes

After thinking about the classification method we thought yesterday, we couldn't fully consider it. So we decided to use the tag classification method.
First, create a new Tag class in models. py with only one name attribute.

class Tag(models.Model):    name=models.CharField(max_length=20,null=False,unique=True,default="")    def __unicode__(self):        return self.nameadmin.site.register(Tag)

Then, specify multiple-to-multiple tags in the Photo class.

tags=models.ManyToManyField(Tag,related_name='has_photos',blank=True)

Template: Add tag pages, photo pages, and post pages.

It is used to display all images contained in a tag and a single image respectively. Therefore, the tag display should be similar to that on the home page,

Tag.html

    {% extends "base.html" %}    {% block title %}{{tag.name}}{% endblock %}    {% block content %}    <div class="jumbotron">      

Here we set a giant screen above to display the tag name, which is shown below.
The tag variable is passed in by the view, and then all the images of the tag are obtained through tag. has_photos.all.

Photo.html

    {% extends "base.html" %}    {% block title %}{{photo.title}}{% endblock %}    {% block content %}    <div class="jumbotron" align="center">      

It is very easy to pass in photo and then display it.

Post.html

The post page requires a form to publish image information.

{% Extends "base.html" % }{% block title %} release new image {% endblock % }{% block content %} <form class = "form-horizontal panel container" method = "POST" action = ". ">{% csrf_token %} <div class =" form-group "> <label class =" control-label "for =" exampleReply "> title (required, each image must have a name ): </label> <input type = 'text' name = 'title' value = "" class = "form-control" id = "exampleReply" placeholder = ""> </input> </div> <div class = "form-g Roup "> <label class =" control-label "for =" exampleReply "> links (direct upload is not supported. You can publish images to websites such as sugar heaps before pasting them, thank you for your cooperation ): </label> <input type = 'text' name = 'url' value = "" class = "form-control" id = "exampleReply" placeholder = ""> </input> </div> <div class = "form-group"> <label class = "control-label" for = "exampleReply"> labels (separated by spaces): </label> <input type = 'text' name = 'tags' value = "" class = "form-control" id = "exampleReply" placeholder =" "> </Input> <label class =" control-label "for =" exampleReply "> it is best to use nouns or adjectives with clear meanings to specify the source and type of an image. See </label> </div> <div class = "form-group col-md-2"> <input type = "hidden" name = "next" value = "/ "/> <input type =" submit "class =" btn-lg btn-primary "value =" "/> </div> </form> <ul class = "list-group" >{% for tag in tags %} <li class = "list-group-item"> <span class = "badge" >{{ tag .}} </span> {tag. name }}</li >{% endfor % }</ul >{% endblock %}

Post transmits three parameters: Image title, image link url, and tag. The tag is transmitted as a string, which is separated in the View File and bound to the image.

Route: add links for tags, photo, and post.

Three lines are added:

    url(r'^post/$',post,name='post_page'),    url(r'^t/(?P<id>\d+)/$',show_by_tag,name='tag_page'),    url(r'^p/(?P<id>\d+)/$',show_photo,name='show_photo_page'),

It is much easier to transmit information in the link by id rather than name.

View: adds three views to the post view.

A little complicated. It is used to display forms and receive and process data.

    def post(request):        if request.method=='POST':            title=request.POST.get('title')            url=request.POST.get('url')                tags=request.POST.get('tags').split()            new_photo=Photo.objects.create(                title=title,                url=url            )            if tags:                for tag in tags:                    new_tag,dummy=Tag.objects.get_or_create(name=tag)                    new_photo.tags.add(new_tag)#add tag to new_photo                    new_photo.save()            return HttpResponseRedirect('/')        else:            tags=Tag.objects.all()            return render_to_response('post.html',RequestContext(request,{'tags':tags}))

When the transmission method is POST, obtain the post data and create a photo object accordingly. Then, cut the tag string into a single tag and add it to the tags attribute of photo, save and go to the homepage.

When the transfer method is GET, the form page is displayed directly. However, all existing tags are displayed after the form.

Tag and photo View

    def show_by_tag(request,id):        tag=Tag.objects.get(pk=id)        return render_to_response('tag.html',RequestContext(request,{'tag':tag}))    def show_photo(request,id):        photo=Photo.objects.get(pk=id)        return render_to_response('photo.html',RequestContext(request,{'photo':photo}))

Obtain the tag and photo corresponding to the id in the link, and then pass the parameter.

Still released using pythonanywhere:
Dasheng Gallery

Copyright Disclaimer: This article is an original article by the blogger and cannot be reproduced without the permission of the blogger.