add auth and session system

coinmanager/coinc/static/coinc/main.js

@@ -231,6 +231,45 @@ $(document).ready(function() {
     // Buttons
     //
 
+    // login
+    $('#do_login').click(function() {
+        let modal = new Modal('login', login);
+        modal.show();
+    });
+
+    function login(args, form_data) {
+        $.ajax({
+            type:     'POST',
+            url:      '/coinc/accounts/login/',
+            data:     form_data,
+            success:  function(response) {
+              window.open(window.location.href, '_self');
+              //detach('#login');
+              //$('button#do_login').addClass('d-none');
+              //$('button#begin_edit').removeClass('d-none');
+              //$('button#do_logout').removeClass('d-none');
+            }
+        });
+
+    }
+
+    // logout
+    $('#do_logout').click(function() {
+      let data = { csrfmiddlewaretoken: $('input[name=csrfmiddlewaretoken]').val() };
+      $.ajax({
+        type: 'POST',
+        data: data,
+        url:  '/coinc/accounts/logout/',
+        success: function(response) {
+            window.open(window.location.href, '_self');
+            //detach('login');
+            //$('button#do_logout').addClass('d-none');
+            //$('button#begin_edit').addClass('d-none');
+            //$('button#do_login').removeClass('d-none');
+        }
+      });
+    });
+
 
     // go home
     $('thead tr:first-child th').click(function() {

coinmanager/coinc/static/coinc/modules/modal.mjs

@@ -93,7 +93,9 @@ class Modal {
     /*submit modal */
     submit() {
         let response = {};
-        $(this.div + ' input[type=text]').each(function() {
+        $(this.div + ' input[type=text], ' +
+          this.div + ' input[type=password], ' +
+          this.div + ' input[type=hidden]').each(function() {
             response[$(this).attr('name')] = $(this).val();
         });
         this.callback(this.callback_arguments, response);

coinmanager/coinc/static/coinc/styles.css

@@ -47,9 +47,9 @@ a:visited {
 
 /* Controlbar */
 
-button#begin_edit {
+div#button_control {
     position: fixed;
-    z-index: 1060;
+    z-index: 1030;
     right: 15px;
     bottom: 15px;
 }

coinmanager/coinc/templates/coinc/controlbar.html

@@ -2,7 +2,15 @@
       div.{{ user.name }} { background-color: {{ user.color }} !important; }{% endfor %}
     </style>
 
-    <button id="begin_edit" class="btn btn-info">+ hinzufügen</button>
+    <div id="button_control">
+    {% csrf_token %}
+    {% if user.is_authenticated %}
+      <button id="begin_edit" class="btn btn-info" title="Hinzufügen"><i class="fas fa-plus"></i><span> Hinzufügen</span></button>
+      <button id="do_logout" class="btn btn-info" title="Abmelden"><i class="fas fa-sign-out-alt"></i></button>
+    {% else %}
+      <button id="do_login" class="btn btn-info" title="Anmelden"><i class="fas fa-sign-in-alt"></i> Anmelden</button>
+    {% endif %}
+    </div>
 
     <!-- navbar -->
     <nav class="navbar navbar-expand-lg navbar-light bg-light">
@@ -106,3 +114,14 @@
         </div>
       </div>
     </div>
+
+    <!-- modal login -->
+    {% if not user.is_authenticated %}
+    <div id="login" class="modal-container">
+      <div class="modal-dialog" role="document">
+        <div class="modal-content">
+        {% include 'registration/login.html' %}
+        </div>
+      </div>
+    </div>
+    {% endif %}

coinmanager/coinc/templates/coinc/country.html

@@ -4,7 +4,7 @@
       <h4 class="alert-heading">Wartungsarbeiten</h4>
       <p class="mb-0">Es können im Moment keine Änderungen an der Münztabelle vorgenommen werden</p>
     </div>
-{% elif logged_in %}{% include 'coinc/controlbar.html' with users=users %}{% endif %}
+{% else %}{% include 'coinc/controlbar.html' with users=users %}{% endif %}
     <div class="container-fluid">
       <table name="{{ country.name_iso }}">
         <thead>

coinmanager/coinc/templates/header.html

@@ -44,6 +44,9 @@
     <link rel="stylesheet" type="text/css" href="{% static 'coinc/bootstrap.min.css' %}">
     <link rel="stylesheet" type="text/css" href="{% static 'coinc/jquery-ui.min.css' %}">
     <link rel="stylesheet" type="text/css" href="{% static 'coinc/styles.css' %}">
+
+    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.0/css/all.css" integrity="sha384-lZN37f5QGtY3VHgisS14W3ExzMWZxybE1SJSEsQp9S+oqd12jhcu+A56Ebc1zFSJ" crossorigin="anonymous">
+
     <script src="{% static 'coinc/jquery.min.js' %}" type="text/javascript"></script>
     <script src="{% static 'coinc/jquery-ui.min.js' %}" type="text/javascript"></script>
     <script src="{% static 'coinc/main.js' %}" type="module"></script>

coinmanager/coinc/templates/registration/logged_out.html

@@ -0,0 +1,2 @@
+<p>Abgemeldet.</p>
+<button id="login" class="btn btn-info">anmelden</button>

coinmanager/coinc/templates/registration/login.html

@@ -0,0 +1,48 @@
+{% if user.is_authenticated %}
+          <div class="modal-header">
+            <h5 class="modal-title">Wilkommen {{ user.get_username }}</h5>
+            <button id="login_close" type="button" class="close" data-dismiss="modal" aria-label="Close">
+              <span aria-hidden="true">×</span>
+            </button>
+          </div>
+          <div class="modal-body">
+          {% if next %}
+            <span>Du verfügst nicht über genügend Rechte bitte melde dich mit einem anderen Konto an.</span>
+          {% endif %}
+          </div>
+          <div class="modal-footer">
+            <button type="button" id="do_logout" class="btn btn-info"><i class="fas fa-sign-out-alt"></i> Abmelden</button>
+          </div>
+{% else %}
+          <div class="modal-header">
+            <h5 class="modal-title">Anmelden</h5>
+            <button id="login_close" type="button" class="close" data-dismiss="modal" aria-label="Close">
+              <span aria-hidden="true">×</span>
+            </button>
+          </div>
+          <div class="modal-body">
+            {% csrf_token %}
+            <div class="form-group">
+              <label for="login_name">Name</label>
+              <input type="text" name="username" id="login_name" class="form-control">
+            <div class="form-group">
+            </div>
+              <label for="login_password">Passwort</label>
+              <input type="password" name="password" id="login_password" class="form-control">
+              <input type="hidden" name="next" value="{{ next }}" />
+            </div>
+          </div>
+          <div class="modal-footer">
+            {% if form.errors %}
+              <span id="response">Dein Benutzername und Passwort passen nicht, bitte versuche es erneut.</span>
+            {% endif %}
+            {% if next %}
+              {% if user.is_authenticated %}
+                <span>Du verfügst nicht über genügend Rechte bitte melde dich mit einem anderen Konto an.</span>
+              {% else %}
+                <span>Bitte melde dich an um diese Seite zu sehen.</span>
+              {% endif %}
+            {% endif %}
+            <button type="button" id="login_action" class="btn btn-primary">Anmelden</button>
+          </div>
+{% endif %}

coinmanager/coinc/urls.py

@@ -18,7 +18,7 @@
 
 
 
-from django.urls import path
+from django.urls import path, include
 
 from . import views
 
@@ -29,4 +29,6 @@ urlpatterns = [
     #path('statistik', views.statistic, name='statistic'),
     path('<str:name_iso>', views.detail_country, name='country'),
     path('add/user/<str:username>/color/<str:color>', views.add_user, name='add_user'),
-    path('add/coin', views.add_coin, name='add_coin') ]
+    path('add/coin', views.add_coin, name='add_coin'),
+    path('accounts/', include('django.contrib.auth.urls')),
+]

coinmanager/coinc/views.py

@@ -77,14 +77,6 @@ def detail_country(request, name_iso):
 
     context = show_country(country, single_country=True)
 
-    password = 'foobar'
-    password_try = request.GET.get('p', '')
-    if password_try == password:
-        if settings.MAINTENANCE_MODE_READ_ONLY:
-            context['maintenance_mode'] = True
-        else:
-            context['logged_in'] = True
-
     return HttpResponse(template.render(context, request))
 
 

coinmanager/coinmanager/production_settings.py

@@ -126,3 +126,6 @@ CSRF_COOKIE_SECURE = True
 
 # Maintenance Mode
 MAINTENANCE_MODE_READ_ONLY = True
+
+# do not redirect after login
+LOGIN_REDIRECT_URL = './'

coinmanager/coinmanager/settings.py

@@ -122,3 +122,6 @@ STATIC_URL = '/static/'
 
 # Maintenance Mode
 MAINTENANCE_MODE_READ_ONLY = False
+
+# do not redirect after login
+LOGIN_REDIRECT_URL = './'