Commit 13b92bc1a4406208a6fce29f1d4ad817a80c1912

Authored by Sergio Oliveira
1 parent ab5d09e6

Updating signup form

src/accounts/forms.py
1 1 # -*- coding: utf-8 -*-
2 2  
3 3 from django import forms
4   -from django.core.exceptions import ValidationError
5 4 from django.contrib.auth.models import User
6 5 from django.contrib.auth.forms import UserCreationForm as UserCreationForm_
7 6 from django.utils.translation import ugettext_lazy as _
... ... @@ -17,15 +16,12 @@ for list_ in MailingList.objects.iterator():
17 16  
18 17  
19 18 class UserCreationForm(UserCreationForm_):
20   - first_name = forms.CharField(max_length=30, label=_(u'Name'))
21   - last_name = forms.CharField(max_length=30, label=_(u'Last name'))
22   - email = forms.EmailField(validators=[UniqueValidator(User, 'email')])
23   - institution= forms.CharField(max_length=120, label=_(u'Institution'), required=False)
24   - role = forms.CharField(max_length=60, label=_(u'Role'), required=False)
25   - twitter = forms.URLField(label=_(u'Twitter'), required=False)
26   - facebook = forms.URLField(label=_(u'Facebook'), required=False)
27   - google_talk = forms.EmailField(label=_(u'Google Talk'), required=False)
28   - webpage = forms.URLField(label=_(u'Personal Website/Blog'), required=False)
  19 + first_name = forms.CharField(max_length=30, label=_(u'Name'),
  20 + widget=forms.TextInput(attrs={'class':'form-control'}))
  21 + last_name = forms.CharField(max_length=30, label=_(u'Last name'),
  22 + widget=forms.TextInput(attrs={'class':'form-control'}))
  23 + email = forms.EmailField(validators=[UniqueValidator(User, 'email')],
  24 + widget=forms.TextInput(attrs={'class':'form-control'}))
29 25 lists = forms.MultipleChoiceField(label=u'Listas',
30 26 required=False,
31 27 widget=forms.CheckboxSelectMultiple,
... ... @@ -39,6 +35,19 @@ class UserCreationForm(UserCreationForm_):
39 35  
40 36  
41 37 class UserUpdateForm(UserCreationForm):
  38 + institution= forms.CharField(max_length=120, label=_(u'Institution'), required=False,
  39 + widget=forms.TextInput(attrs={'class':'form-control'}))
  40 + role = forms.CharField(max_length=60, label=_(u'Role'), required=False,
  41 + widget=forms.TextInput(attrs={'class':'form-control'}))
  42 + twitter = forms.URLField(label=_(u'Twitter'), required=False,
  43 + widget=forms.TextInput(attrs={'class':'form-control'}))
  44 + facebook = forms.URLField(label=_(u'Facebook'), required=False,
  45 + widget=forms.TextInput(attrs={'class':'form-control'}))
  46 + google_talk = forms.EmailField(label=_(u'Google Talk'), required=False,
  47 + widget=forms.TextInput(attrs={'class':'form-control'}))
  48 + webpage = forms.URLField(label=_(u'Personal Website/Blog'), required=False,
  49 + widget=forms.TextInput(attrs={'class':'form-control'}))
  50 +
42 51 def __init__(self, *args, **kwargs):
43 52 super(UserUpdateForm, self).__init__(*args, **kwargs)
44 53 self.fields.pop('username')
... ...
src/accounts/templates/accounts/signup-form.html
... ... @@ -5,22 +5,20 @@
5 5  
6 6 <h2>{% trans "Sign up" %}</h2>
7 7  
8   -{% if form.errors %}
9   -<div>
10   - <b>{% trans "Please correct the errors below and try again." %}</b>
11   -</div>
12   -{% endif %}
13   -
14 8 <div class="row">
15   - <div class="col-lg-11 well">
16   - <label>{% trans "Avatar" %}</label >
17   - <div id="avatar">
18   - <img src="{{ STATIC_URL }}img/user.png" alt="user"/>
19   - </div>
20   - <p>
21   - {% trans "Add an avatar to your account using" %} <a href="http://gravatar.com/" target="_blank">Gravatar</a>
22   - </p>
  9 + {% if form.errors %}
  10 + <div class="alert alert-danger">
  11 + <b>{% trans "Please correct the errors below and try again" %}</b>
23 12 </div>
  13 + {% endif %}
  14 +
  15 + <div>
  16 + {% for field in form %}
  17 + {% if field.errors %}
  18 + {{ field.label }}
  19 + {% endif %}
  20 + {% endfor %}
  21 + </div>
24 22 </div>
25 23  
26 24  
... ... @@ -28,46 +26,51 @@
28 26 <label>{% trans "Required fields" %}</label>
29 27 </p>
30 28  
31   -<form action="." method="post">
  29 +<form action="." method="post" role="form" class="form-horizontal signup">
32 30 {% csrf_token %}
33 31  
34 32 <div class="row">
35   - <div class="col-lg-5">
36   - <fieldset class="well">
37   - <legend>{% trans "Personal Information" %}</legend>
38   - {% render_form_field form.first_name %}
39   - {% render_form_field form.last_name %}
40   - {% render_form_field form.email %}
41   - {% render_form_field form.username %}
42   - </fieldset>
43   -
44   - <fieldset class="well">
45   - <legend>{% trans "Others" %}</legend>
46   - {% render_form_field form.twitter %}
47   - {% render_form_field form.facebook %}
48   - {% render_form_field form.google_talk %}
49   - {% render_form_field form.webpage %}
50   - </fieldset>
51   - </div>
52 33  
53   - <div class="col-lg-5 col-lg-offset-1">
54   - <fieldset class="well">
55   - <legend>{% trans "Professionals Information" %}</legend>
56   - {% render_form_field form.institution %}
57   - {% render_form_field form.role %}
58   - </fieldset>
  34 + <div>
  35 + {% for legend, fields in fieldsets %}
  36 + <div class="col-md-6 col-lg-6 col-sm-6 col-xs-12" style="display: inline-block; vertical-align:top;">
  37 + <div class="well">
  38 + <fieldset>
  39 + <legend>{{ legend }}</legend>
  40 + {% for field in fields %}
  41 + <div class="form-group{% if field.field.required %} required{% endif %}{% if field.errors %} alert alert-danger has-error{% endif %}">
  42 + <label for="first_name" class="control-label">
  43 + {{ field.label }}
  44 + </label>
  45 + {% if field.name == 'username' %}
  46 + <input id="id_username" name="username" type="text" class="form-control">
  47 + {% elif field.name == 'lists' %}
  48 + {% for choice in field %}
  49 + <div class="checkbox">
  50 + {{ choice }}
  51 + </div>
  52 + {% endfor %}
  53 + {% else %}
  54 + {{ field }}
  55 + {% endif %}
  56 + {{ field.errors }}
  57 + </div>
59 58  
60   - <fieldset class="well">
61   - <legend>{% trans "Subscribe to mail lists" %}</legend>
62   - <div class="unstyled-list">
63   - {% render_form_field form.lists %}
  59 + {% endfor %}
  60 + </fieldset>
64 61 </div>
65   - </fieldset>
  62 + </div>
  63 + {% endfor %}
  64 +
66 65 </div>
  66 + </div>
67 67  
68   - <div class="col-lg-2 pull-right">
69   - <input type="submit" value="{% trans 'Register' %}"/>
  68 + <div class="row">
  69 + <div class="submit">
  70 + <input type="submit" value="{% trans 'Register' %}" class="btn btn-primary btn-lg btn-block">
70 71 </div>
71 72 </div>
  73 +
72 74 </form>
  75 +
73 76 {% endblock %}
... ...
src/accounts/views.py
... ... @@ -12,20 +12,39 @@ from django.shortcuts import render, get_object_or_404
12 12 from .forms import UserCreationForm
13 13 from super_archives.models import UserProfile, EmailAddress
14 14  
  15 +# helper
  16 +def get_field_set(form):
  17 + fieldsets = (
  18 + (_('Personal Information'), (
  19 + form['first_name'],
  20 + form['last_name'],
  21 + form['email'],
  22 + form['username'],
  23 + )
  24 + ),
  25 + (_('Subscribe to mail lists'), (
  26 + form['lists'],
  27 + )
  28 + ),
  29 + )
  30 + return fieldsets
  31 +
15 32  
16 33 def signup(request):
17 34  
18 35 # If the request method is GET just return the form
19 36 if request.method == 'GET':
20 37 form = UserCreationForm()
21   - return render(request, 'accounts/signup-form.html', {'form': form})
  38 + return render(request, 'accounts/signup-form.html',
  39 + {'form': form, 'fieldsets': get_field_set(form)})
22 40  
23 41 # If the request method is POST try to store data
24 42 form = UserCreationForm(request.POST)
25 43  
26 44 # If there is validation errors give the form back to the user
27 45 if not form.is_valid():
28   - return render(request, 'accounts/signup-form.html', {'form': form})
  46 + return render(request, 'accounts/signup-form.html',
  47 + {'form': form, 'fieldsets': get_field_set(form)})
29 48  
30 49 user = User(
31 50 username=form.cleaned_data.get('username'),
... ...
src/colab/static/css/screen.css
... ... @@ -86,41 +86,25 @@
86 86 max-width: 95% !important;
87 87 }
88 88  
89   -/* Forms */
  89 +/* Forms */
90 90 .required label:before {
91 91 color: #f00;
92 92 content: "* ";
93 93 }
94 94  
95   -input[type="text"],
96   -input[type="password"] {
97   - width: 300px;
98   - padding: 3px;
99   -}
100   -/* End Forms */
101   -
102   -/* Changing Bootstrap*/
103   -fieldset>legend {
104   - display:block;
105   - font-weight:bold;
106   - font-size:1.2em;
107   - margin-top:-0.2em;
108   - margin-bottom:0em;
109   - border: none;
  95 +form.signup .form-group {
  96 + width: 90%;
  97 + margin-left: 0.5em;
110 98 }
111 99  
112   -.well {
113   - background:#e5eCf9 !important;
  100 +form.signup div.submit {
  101 + margin: auto;
  102 + margin-bottom: 5em;
  103 + width: 200px;
114 104 }
115 105  
116   -.col-lg-6 .well{
117   - max-width:570px;
118   -}
  106 +/* End Forms */
119 107  
120   -.col-lg-3 .well {
121   - max-width:285px;
122   -}
123   -/* End changes */
124 108  
125 109 .rss-icon {
126 110 background-image: url(../img/rss.png);
... ...