dashboard: nicer login form

cda740cf · Kálmán Viktor · 2fc3ff12 · cda740cf · cda740cf · cda740cf
Commit cda740cf authored Feb 27, 2014 by Kálmán Viktor
Showing with 138 additions and 7 deletions

circle/circle/settings/base.py
+2 -0

circle/circle/urls.py
+3 -0

circle/dashboard/forms.py
+43 -0

circle/templates/registration/base.html
+74 -0

circle/templates/registration/login.html
+16 -7

No files found.
--- a/circle/circle/settings/base.py
+++ b/circle/circle/settings/base.py
@@ -391,3 +391,5 @@ if get_env_variable('DJANGO_SAML', 'FALSE') == 'TRUE':
    if get_env_variable('DJANGO_SAML_ORG_ID_ATTRIBUTE', False) != False:
        SAML_ORG_ID_ATTRIBUTE = get_env_variable(
            'DJANGO_SAML_ORG_ID_ATTRIBUTE')
+
+LOGIN_REDIRECT_URL = "/"
--- a/circle/circle/urls.py
+++ b/circle/circle/urls.py
@@ -6,6 +6,7 @@ from django.shortcuts import redirect
 from django.core.urlresolvers import reverse

 from circle.settings.base import get_env_variable
+from dashboard.forms import CircleAuthenticationForm

 admin.autodiscover()

@@ -23,6 +24,8 @@ urlpatterns = patterns(
    url(r'^admin/', include(admin.site.urls)),
    url(r'^network/', include('network.urls')),
    url(r'^dashboard/', include('dashboard.urls')),
+    url(r'^accounts/login/?$', 'django.contrib.auth.views.login',
+        {'authentication_form': CircleAuthenticationForm}),
    url(r'^accounts/', include('django.contrib.auth.urls')),
 )


--- a/circle/dashboard/forms.py
+++ b/circle/dashboard/forms.py
@@ -2,6 +2,7 @@ from datetime import timedelta
 import uuid

 from django.contrib.auth.models import User
+from django.contrib.auth.forms import AuthenticationForm

 from crispy_forms.helper import FormHelper
 from crispy_forms.layout import (
@@ -762,6 +763,48 @@ class DiskAddForm(forms.Form):
        return helper


+class CircleAuthenticationForm(AuthenticationForm):
+    # fields: username, password
+
+    @property
+    def helper(self):
+        helper = FormHelper()
+        helper.form_show_labels = False
+        helper.layout = Layout(
+            AnyTag(
+                "div",
+                AnyTag(
+                    "span",
+                    AnyTag(
+                        "i",
+                        css_class="icon-user",
+                    ),
+                    css_class="input-group-addon",
+                ),
+                Field("username", placeholder=_("Username"),
+                      css_class="form-control"),
+                css_class="input-group",
+            ),
+            AnyTag(
+                "div",
+                AnyTag(
+                    "span",
+                    AnyTag(
+                        "i",
+                        css_class="icon-lock",
+                    ),
+                    css_class="input-group-addon",
+                ),
+                Field("password", placeholder=_("Password"),
+                      css_class="form-control"),
+                css_class="input-group",
+            ),
+        )
+        helper.add_input(Submit("submit", _("Sign in"),
+                                css_class="btn btn-success"))
+        return helper
+
+
 class LinkButton(BaseInput):

    """

--- a/circle/templates/registration/base.html
+++ b/circle/templates/registration/base.html
+{% load i18n %}
+{% load staticfiles %}
+{% get_current_language as LANGUAGE_CODE %}
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>Bootstrap, from Twitter</title>
+  <meta name="description" content="">
+  <meta name="author" content="">
+
+  <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
+  <link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet">
+<style type="text/css">
+    html, body {
+      background-color: #eee;
+    }
+    body {
+      margin-top: 40px; 
+    }
+    .container {
+      width: 400px;
+    }
+
+    ul, li {
+      list-style: none;
+      margin: 0;
+      padding: 0;
+    }
+
+    .container > .content {
+      background-color: #fff;
+      padding: 20px;
+      -webkit-border-radius: 10px 10px 10px 10px;
+         -moz-border-radius: 10px 10px 10px 10px;
+              border-radius: 10px 10px 10px 10px;
+      -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.15);
+         -moz-box-shadow: 0 1px 2px rgba(0,0,0,.15);
+              box-shadow: 0 1px 2px rgba(0,0,0,.15);
+    }
+
+    .login-form {
+      padding: 0 10px;
+    }
+
+    .login-form form {
+      padding: 0 20px;
+    }
+
+    .input-group {
+      margin-bottom: 10px;
+    }
+    
+    .input-group-addon {
+      width: 38px;
+    }
+
+    /* fix for crispy-forms' html */
+    .form-group {
+      margin-bottom: 0px;
+    }
+
+    .help-block {
+      display: none;
+    }
+  </style>
+</head>
+<body>
+  <div class="container">
+    <div class="content">
+      {% block content %}{% endblock %}
+    </div>
+  </div> <!-- /container -->
+</body>
+</html>
--- a/circle/templates/registration/login.html
+++ b/circle/templates/registration/login.html
-{% extends "base.html" %}
+{% extends "registration/base.html" %}
 {% load i18n %}
-{% load staticfiles %}
+{% load crispy_forms_tags %}
 {% get_current_language as LANGUAGE_CODE %}
+
 {% block content %}
-<form action="" method="POST">
-    {% csrf_token %}
-    {{ form }}
-    <input type="submit" value="LOGIN" />
-</form>
+  <div class="row">
+    <div class="login-form">
+      {% if form.password.errors or form.username.errors %}
+      {% include "display-form-errors.html" %}
+      {% endif %}
+      <h3>{% trans "Please login to continue!" %}</h3>
+      <form action="" method="POST">
+          {% csrf_token %}
+          {% crispy form %}
+      </form>
+      <a class="pull-right" href="">Forgot your password?</a>
+    </div>
+  </div>
 {% endblock %}