finish: add/manage users

This commit is contained in:
koksnuss 2020-05-01 18:27:23 +02:00
parent 6b0a556728
commit c747461076
4 changed files with 68 additions and 46 deletions

View File

@ -23,16 +23,19 @@ import { Cookie } from './modules/cookie.mjs';
$(document).ready(function() { $(document).ready(function() {
function render_login(name, color) { function render_login(input_name, input_color) {
// manage user login // manage user login
let color = decodeURIComponent(input_color);
let name = decodeURIComponent(input_name);
new Cookie('coinc-name', name) new Cookie('coinc-name', name)
$('label#for_select_usernames').html('Wilkommen zurück');
render_login_color(color); render_login_color(color);
let option = $('div.username option[value=' + name + ']'); let option = $('div.username option[value=' + name + ']');
if (option.length == 0) {
if (!option) { $('div.username select').append($('<option>', {
$('div.username select').append($('<option>', { value: name, html: name })); value: name, label: color, html: name
}));
} }
$('div.username option[value=' + name + ']').attr('selected', 'selected'); $('div.username option[value=' + name + ']').attr('selected', 'selected');
@ -42,8 +45,13 @@ $(document).ready(function() {
function render_login_color(color) { function render_login_color(color) {
// manage login colors // manage login colors
$('div.username').css('background-color', color);
new Cookie('coinc-color', color); new Cookie('coinc-color', color);
$('div.username').css('background-color', color);
}
function hide_modal() {
$('div#modal_add_user').fadeOut('fast');
} }
@ -55,17 +63,32 @@ $(document).ready(function() {
$('button#show_add_user').click(function() { $('button#show_add_user').click(function() {
$('div#modal_add_user').fadeIn('fast');
$(document).on('click', function(event) {
if ($('div#modal_add_user').is(':visible')) {
let target = $(event.target);
if (target.attr('id') === 'modal_add_user') {
hide_modal();
}
}
});
$(document).keypress(function(event) {
if (event.keyCode == 27) { // ESC is pressed
hide_modal();
$(document).off('keypress');
}
});
$('div#modal_add_user').show('fast');
$('button#close_modal_add_user').click(function() { $('button#close_modal_add_user').click(function() {
hide_modal();
$('div#modal_add_user').hide('fast'); }); }); });
$('button#add_user').click(function() { $('button#add_user').click(function() {
let name = $('input#text_user').val(); let name = encodeURIComponent($('input#text_user').val());
let color = $('input#text_color').val(); let color = encodeURIComponent($('input#text_color').val());
$.ajax({ $.ajax({
type: 'GET', type: 'GET',
@ -73,20 +96,20 @@ $(document).ready(function() {
url: 'add/user/' + name + '/color/' + color, url: 'add/user/' + name + '/color/' + color,
success: function(response) { success: function(response) {
if (response.error) { if (response.status === 0) {
$('span#response').html(response.message); $('span#response').fadeOut('fast');
$('span#response').css('color', 'red'); hide_modal();
render_login(name, color);
} else { } else {
$('span#response').css('color', 'black'); $('span#response').html(response.message);
$('div#modal_add_user').hide('fast'); $('span#response').css('color', 'red');
$('span#user_message').hide();
render_login(name, color);
} }
} }
}); });
}); });
});
let cookie = new Cookie(); let cookie = new Cookie();
let name = cookie.get('coinc-name'); let name = cookie.get('coinc-name');

View File

@ -173,7 +173,6 @@ div.username {
bottom: 0; bottom: 0;
width: 100%; width: 100%;
height: 70px; height: 70px;
background-color:red;
line-height: 70px; line-height: 70px;
text-align: center; text-align: center;
z-index: 1; z-index: 1;

View File

@ -1,18 +1,18 @@
<div class="username"> <div class="username">
<label for="select_usernames" id="for_select_usernames">Dein Name</label> <label for="select_usernames" id="for_select_usernames">Name</label>
<select id="select_usernames" name="username" form="username_form" class="form-control"> <select id="select_usernames" name="username" form="username_form" class="form-control">
{% for user in users %} {% for user in users %}
<option value="{{ user.name }}" label="{{ user.color }}">{{ user.name }}</option> <option value="{{ user.name }}" label="{{ user.color }}">{{ user.name }}</option>
{% endfor %} {% endfor %}
</select> </select>
<span id="user_message">&nbsp;Nicht dabei? <button id="show_add_user" class="btn btn-primary">Namen hinzufügen</button></span> <span id="user_message"><button id="show_add_user" class="btn btn-info">+ Namen hinzufügen</button></span>
</div> </div>
<div id="modal_add_user" class="modal-container"> <div id="modal_add_user" class="modal-container">
<div class="modal-dialog" role="document"> <div class="modal-dialog" role="document">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header"> <div class="modal-header">
<h5 class="modal-title">Nutzer hinzufügen</h5> <h5 class="modal-title">Name hinzufügen</h5>
<button id="close_modal_add_user" type="button" class="close" data-dismiss="modal" aria-label="Close"> <button id="close_modal_add_user" type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span> <span aria-hidden="true">×</span>
</button> </button>

View File

@ -18,6 +18,7 @@
from json import dumps
from datetime import datetime from datetime import datetime
from django.http import HttpResponse from django.http import HttpResponse
@ -107,7 +108,7 @@ def show_country(country, single_country=False):
return { return {
'country': c, 'country': c,
'single_country': single_country, 'single_country': single_country,
'users': User.objects.order_by('name').values('name','color') 'users': User.objects.order_by('id').values('name','color')
} }
@ -172,24 +173,23 @@ def show_coin(country, year, stamp, value):
def add_user(request, username, color): def add_user(request, username, color):
''' add a user ''' ''' add a user '''
error = False status = 0
message = '' message = ''
if username and color: if username and color:
try: try:
existing_user = User.objects.get(name=username) existing_user = User.objects.get(name=username)
error = True status = 1
message = f"'{username}' ist schon vergeben." message = f"'{username}' ist schon vergeben."
except User.DoesNotExist: except User.DoesNotExist:
# u = User(name=username, color=color) User.objects.create(name=username, color=color)
# u.save() message = 'success'
message = f"Gespeichert"
else: else:
error = True status = 1
message = 'Du musst einen Namen und Farbe angeben.' message = 'Du musst einen Namen und Farbe angeben.'
import json
return HttpResponse(json.dumps({ 'error': error, 'message': message })) return HttpResponse(dumps({ 'status': status, 'message': message }))
# TODO # TODO