public/coins-demo
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Bootstrapping list_detail / Add Task view

Browse source
This commit is contained in:
Scot Hacker 2018-03-19 00:41:52 -07:00
parent c470864c86
commit 3be7ea7745
7 changed files with 92 additions and 105 deletions
Download patch file Download diff file Expand all files Collapse all files

14
todo/forms.py
View file

@ -24,19 +24,17 @@ class AddItemForm(ModelForm):
must find other members of the groups the current list belongs to.""" must find other members of the groups the current list belongs to."""
def __init__(self, task_list, *args, **kwargs): def __init__(self, task_list, *args, **kwargs):
super(AddItemForm, self).__init__(*args, **kwargs) super().__init__(*args, **kwargs)
# debug:
# print(dir(self.fields['list']))
# print(self.fields['list'].initial)
self.fields['assigned_to'].queryset = get_user_model().objects.filter(groups__in=[task_list.group]) self.fields['assigned_to'].queryset = get_user_model().objects.filter(groups__in=[task_list.group])
self.fields['assigned_to'].label_from_instance = \ self.fields['assigned_to'].label_from_instance = lambda obj: "%s (%s)" % (obj.get_full_name(), obj.username)
lambda obj: "%s (%s)" % (obj.get_full_name(), obj.username) self.fields['assigned_to'].widget.attrs = {
'id': 'id_assigned_to', 'class': "custom-select mb-3", 'name': 'assigned_to'}
due_date = forms.DateField( due_date = forms.DateField(
widget=forms.DateInput(attrs={'type': 'date'}), required=False) widget=forms.DateInput(attrs={'type': 'date'}), required=False)
title = forms.CharField( title = forms.CharField(
widget=forms.widgets.TextInput(attrs={'size': 35})) widget=forms.widgets.TextInput())
note = forms.CharField( note = forms.CharField(
widget=forms.Textarea(), required=False) widget=forms.Textarea(), required=False)

55
todo/static/todo/css/styles.css
View file

@ -1,57 +1,4 @@
/*Distributed*/
ul.messages li {
color: green;
font-weight: bold;
}
.overdue {
color: #9A2441;
font-weight: bold;
}
/* Lighter font for completed items */
#completed li {
color: gray;
}
label { label {
display: block; display: block;
font-weight: bold; font-weight: bold;
} }
input {
color: #3A3A3A;
font-family: Verdana;
font-size: 14px;
}
input[type='text'] {
width: 300px;
}
input#id_priority {
width: 30px;
}
.todo-break {
margin-top: 30px;
border-top: 1px dotted gray;
}
table.nocolor, table.nocolor tr, table.nocolor td {
background-color: transparent;
}
.minor {
font-style: italic;
font-size: 0.8em;
}
.task_note, .task_comments {
width: 70%;
overflow: visible;
}

36
todo/templates/todo/add_list.html
View file

@ -1,16 +1,34 @@
{% extends "todo/base.html" %} {% extends "todo/base.html" %}
{% block page_heading %}{% endblock %} {% block page_heading %}{% endblock %}
{% block title %}Add Todo List{% endblock %} {% block title %}Add Todo List{% endblock %}
{% block content %} {% block content %}
<h2>Add a list:</h2> <h2>Add a list:</h2>
<form action="" method="post"> <form action="" method="post">
{% csrf_token %} {% csrf_token %}
<table>{{ form }}</table>
<p><input type="submit" value="Submit" class="todo-button"></p>
</form>
{% endblock %} <div class="form-group">
<label for="id_name">List Name</label>
<input type="text" class="form-control" id="id_name" name="name" aria-describedby="inputNameHelp" placeholder="">
<small id="inputNameHelp" class="form-text text-muted">The full display name for this list.</small>
</div>
<div class="form-group">
<label for="id_slug">Slug</label>
<input type="text" class="form-control" id="id_slug" name="slug" aria-describedby="inputSlugHelp" placeholder="">
<small id="inputSlugHelp" class="form-text text-muted">
To be used in URL for this list e.g. 'ux-tasks'. All lowercase, no spaces.</small>
</div>
<div class="form-group">
<label for="id_group">Group</label>
<select id="id_group" name ="group" class="custom-select size="3" mb-3">
{% for g in form.group %}
{{ g }}
<option value="{{ g.id }}">{{ g.name }}</option>
{% endfor %}
</select>
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
{% endblock %}

1
todo/templates/todo/base.html
View file

@ -4,5 +4,4 @@
{% block extrahead %} {% block extrahead %}
<!-- CSS and JavaScript for django-todo --> <!-- CSS and JavaScript for django-todo -->
<link rel="stylesheet" type="text/css" href="{% static 'todo/css/styles.css' %}" /> <link rel="stylesheet" type="text/css" href="{% static 'todo/css/styles.css' %}" />
<script src="{% static 'todo/js/jquery.tablednd_0_5.js' %}" type="text/javascript"></script>
{% endblock extrahead %} {% endblock extrahead %}

83
todo/templates/todo/list_detail.html
View file

@ -1,4 +1,5 @@
{% extends "todo/base.html" %} {% extends "todo/base.html" %}
{% load staticfiles %}
{% block title %}Todo List: {{ task_list.name }}{% endblock %} {% block title %}Todo List: {{ task_list.name }}{% endblock %}
@ -7,31 +8,48 @@
{% if list_slug != "mine" %} {% if list_slug != "mine" %}
<form action="" name="add_task" method="post"> <form action="" name="add_task" method="post">
{% csrf_token %} {% csrf_token %}
<h2 id="slideToggle" >&rarr; Click to add task &larr;</h2>
<div id="AddTask">
<table class="table">
<tr>
<td><label for="id_title">Task:</label> {{ form.title }}</td>
<td><label for="id_due_date">Due date:</label> {{ form.due_date }}</td>
<td><label for="id_assigned">Assign to:</label> {{ form.assigned_to }}</td>
<td><label for="id_notify">Notify*:</label> <input type="checkbox" checked="checked" name="notify" value="1" id="notify"></td>
</tr>
<tr>
<td>
<label for="id_note">Note:</label>
{{ form.note }}
<p class="minor">*Email notifications will only be sent if task is assigned to someone besides yourself.</p>
</td>
</tr>
</table>
<input type="hidden" name="priority" value="999" id="id_priority"> <button class="btn btn-primary" id="AddTaskButton" type="button"
<input type="hidden" name="created_by" value="{{ request.user.id }}" id="id_created_by"> data-toggle="collapse" data-target="#AddTask">Add Task</button>
<input type="hidden" name="task_list" value="{{ task_list.id }}" id="id_task_list">
<input type="hidden" name="created_date" value="{{ created_date }}" id="id_created_date"> <div id="AddTask" class="collapse mt-3">
<p><input type="submit" name="add_task" value="Add task" class="todo-button"></p> <div class="form-group">
<label for="id_title" name="title">Task</label>
<input type="text" class="form-control" id="id_title" name="title" required placeholder="Task title" value="{{ form.title.text }}">
</div>
<div class="form-group">
<label for="id_note">Description</label>
<textarea class="form-control" id="id_note" name="note"
rows="5" aria-describedby="inputNoteHelp">{{ form.note.text }}</textarea>
<small id="inputNoteHelp" class="form-text text-muted">Describe the task or bug. Provide steps to reproduce the issue.</small>
</div>
<div class="form-group">
<label for="id_due_date">Due Date</label>
<input type="date" class="form-control" id="id_due_date" name="due_date" value="{{ form.due_date.text }}">
</div>
<div class="form-group">
<label for="id_assigned_to">Assigned To</label>
{# See todo.forms.AddItemForm #}
{{form.assigned_to}}
</div>
<div class="form-group">
<label for="id_notify">Notify</label>
<input type="checkbox" checked="checked" class="form-control" id="id_notify" name="notify" aria-describedby="inputNotifyHelp" value="{{ form.notify.text }}">
<small id="inputNotifyHelp" class="form-text text-muted">Email notifications will only be sent if task is assigned to someone other than yourself.</small>
</div>
<input type="hidden" name="priority" value="999" id="id_priority">
<input type="hidden" name="created_by" value="{{ request.user.id }}" id="id_created_by">
<input type="hidden" name="task_list" value="{{ task_list.id }}" id="id_task_list">
<input type="hidden" name="created_date" value="{{ created_date }}" id="id_created_date">
<p><input type="submit" name="add_task" value="Submit" class="btn btn-primary"></p>
</div> </div>
</form> </form>
<hr />
{% endif %} {% endif %}
{% if items %} {% if items %}
@ -40,7 +58,6 @@
{% else %} {% else %}
<h1>{{ view_completed|yesno:"Completed tasks, Tasks" }} in "{{ task_list.name }}"</h1> <h1>{{ view_completed|yesno:"Completed tasks, Tasks" }} in "{{ task_list.name }}"</h1>
<p>This list belongs to group {{ task_list.group }}</p> <p>This list belongs to group {{ task_list.group }}</p>
<h3>Tasks :: Drag rows to set priorities</h3>
{% endif %} {% endif %}
<form action="" name="show_tasks" method="post"> <form action="" name="show_tasks" method="post">
@ -91,6 +108,9 @@
</tr> </tr>
{% endfor %} {% endfor %}
</table> </table>
<p>
<small><i>Drag rows to set priorities</i></small>
</p>
<p><input type="submit" name="process_tasks" value="Continue..." class="todo-button"></p> <p><input type="submit" name="process_tasks" value="Continue..." class="todo-button"></p>
</form> </form>
{% else %} {% else %}
@ -112,6 +132,8 @@
{% endblock %} {% endblock %}
{% block extra_js %} {% block extra_js %}
<script src="{% static 'todo/js/jquery.tablednd_0_5.js' %}" type="text/javascript"></script>
<script type="text/javascript"> <script type="text/javascript">
function order_tasks(data) { function order_tasks(data) {
// The JQuery plugin tableDnD provides a serialize() function which provides the re-ordered // The JQuery plugin tableDnD provides a serialize() function which provides the re-ordered
@ -131,13 +153,14 @@
} }
}); });
// Initially hide the Add Task form
$('#AddTask').hide();
// toggle slide to show the Add Task form when link clicked
$('#slideToggle').click(function(){
$(this).siblings('#AddTask').slideToggle();
});
}); });
// When adding a task, change the text of the Add Task button
function handleClick()
{
console.log(this.innerHTML);
this.innerHTML = (this.innerHTML == 'Add Task' ? 'Cancel' : 'Add Task');
}
document.getElementById('AddTaskButton').onclick=handleClick;
</script> </script>
{% endblock extra_js %} {% endblock extra_js %}

5
todo/urls.py
View file

@ -6,7 +6,10 @@ app_name = 'todo'
urlpatterns = [ urlpatterns = [
path('', views.list_lists, name="lists"), path(
'',
views.list_lists,
name="lists"),
# View reorder_tasks is only called by JQuery for drag/drop task ordering. # View reorder_tasks is only called by JQuery for drag/drop task ordering.
path( path(

3
todo/views.py
View file

@ -122,8 +122,6 @@ def list_detail(request, list_id=None, list_slug=None, view_completed=False):
toggle_done(request, request.POST.getlist('toggle_done_tasks')) toggle_done(request, request.POST.getlist('toggle_done_tasks'))
toggle_deleted(request, request.POST.getlist('toggle_deleted_tasks')) toggle_deleted(request, request.POST.getlist('toggle_deleted_tasks'))
# ###################### # ######################
# Add New Task Form # Add New Task Form
# ###################### # ######################
@ -240,6 +238,7 @@ def reorder_tasks(request) -> HttpResponse:
def add_list(request) -> HttpResponse: def add_list(request) -> HttpResponse:
"""Allow users to add a new todo list to the group they're in. """Allow users to add a new todo list to the group they're in.
""" """
if request.POST: if request.POST:
form = AddTaskListForm(request.user, request.POST) form = AddTaskListForm(request.user, request.POST)
if form.is_valid(): if form.is_valid():