#49 make list sortable

core/admin.py

@@ -122,5 +122,5 @@ class ChecklistAdmin(admin.ModelAdmin):
 @admin.register(ChecklistItem)
 class ChecklistItemAdmin(admin.ModelAdmin):
     list_filter = ['checklist__user', 'name']
-    list_display = ['name', 'to_be_checked_on_matchdays', 'to_be_checked_on_matchday_pattern', 'to_be_checked_if_home_match_tomorrow']
+    list_display = ['priority', 'name', 'to_be_checked_on_matchdays', 'to_be_checked_on_matchday_pattern', 'to_be_checked_if_home_match_tomorrow']
     search_fields = ['checklist__user__username', 'name']

core/migrations/0006_auto_20161203_1953.py

@@ -0,0 +1,24 @@
+# -*- coding: utf-8 -*-
+# Generated by Django 1.10.3 on 2016-12-03 18:53
+from __future__ import unicode_literals
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('core', '0005_auto_20161203_1816'),
+    ]
+
+    operations = [
+        migrations.AlterModelOptions(
+            name='checklistitem',
+            options={'ordering': ['-priority']},
+        ),
+        migrations.AddField(
+            model_name='checklistitem',
+            name='priority',
+            field=models.IntegerField(default=0),
+        ),
+    ]

core/models.py

@@ -794,8 +794,12 @@ class Checklist(models.Model):
 
 
 class ChecklistItem(models.Model):
+    class Meta:
+        ordering = ['priority']
+
     checklist = models.ForeignKey(Checklist)
     name = models.CharField(max_length=255)
+    priority = models.IntegerField(default=0)
     last_checked_on_matchday = models.ForeignKey(Matchday, default=None, blank=True, null=True)
     to_be_checked_on_matchdays = models.CharField(blank=True, null=True, max_length=255, validators=[validate_comma_separated_integer_list])
     to_be_checked_on_matchday_pattern = models.IntegerField(blank=True, null=True)

core/static/core/css/main.css

@@ -239,6 +239,7 @@ ul.nav-sub {  padding-left: 10%; }
     width: 80%;
     margin: 5px 5px;
 }
+.checklist_item_container { background-color: rgba(255, 255, 255, 0.5); }
 #add_checklist_item { margin: 5px; }
 .delete_checklist_item {
     cursor: default;
@@ -247,35 +248,45 @@ ul.nav-sub {  padding-left: 10%; }
 }
     .delete_checklist_item:hover { cursor: pointer; }
 
+#checklist_items_priority_saved.invisible,
 .checklist_item_saved.invisible {
     opacity: 0;
     transition: opacity 300ms linear;
 }
+#checklist_items_priority_saved,
 .checklist_item_saved {
     font-size: 1.5em;
-    top: 5px;
-    right: 35px;
     opacity: 1;
+    right: 35px;
+    top: 5px;
     transition: opacity 300ms linear;
 }
+#checklist_items_priority_saved { right:0; }
 
 #checklist_items .dropdown {
-    margin: 0 15px 10px 25px;
     display: inline-flex;
+    margin: 0 15px 10px 25px;
 }
     #checklist_items .dropdown-menu>.active>a,
     .dropdown-menu>.active>a:focus,
-    .dropdown-menu>.active>a:hover
-      { background-color: #239123; }
+    .dropdown-menu>.active>a:hover { background-color: #239123; }
 
 .checklist_item_matchdays,
 .checklist_item_matchday_pattern {
-    width: 50px;
     display: inline-flex;
     margin-left: 15px;
+    width: 50px;
 }
 .checklist_item_matchdays { width: 200px; }
 
+.checklist_item_priority {
+    color: #239123;
+    font-size: 1.3em;
+    vertical-align: middle;
+    width: 20px;
+}
+
+
 #ChecklistBar {
     padding: 0;
     background-color: #eee;

core/static/core/js/checklist_settings_handler.js

@@ -2,6 +2,7 @@ $('document').ready( function (){
     function addChecklistItem(item) {
         $('#checklist_items').append(
             "<div id='" + item['id'] + "' class='checklist_item_container new' style='opacity:0;'>" +
+                "<span class='checklist_item_priority glyphicon glyphicon-resize-vertical'></span>" +
                 "<input type='text' class='form-control checklist_item_name' name='" + item['id'] + "_name' value='" + item['name'] + "'  maxlength='255'>" +
                 "<span class='invisible checklist_item_saved alert-success glyphicon glyphicon-floppy-saved'></span>" +
                 "<span class='delete_checklist_item alert-danger glyphicon glyphicon-trash'></span>" +
@@ -52,6 +53,7 @@ $('document').ready( function (){
         new_checklist_item.removeClass('new');
 
         new_checklist_item.find('[data-toggle="tooltip"]').tooltip();
+        $( "#checklist_items" ).sortable();
     }
 
     $('#headingChecklistSettings').click(function(){
@@ -75,6 +77,17 @@ $('document').ready( function (){
         );
     });
 
+    $('#save_checklist_priority').click( function() {
+        var params = {
+            checklist_priority: $('#checklist_items').sortable("toArray").join(",")
+        };
+        $.post("/settings_update_checklist_priority", params);
+        $('#checklist_items_priority_saved').removeClass('invisible');
+        setTimeout(function() {
+            $('#checklist_items_priority_saved').addClass('invisible');
+        }, 2000);
+    });
+
     function saveChecklistName(elem) {
         var params = {
             checklist_item_id: elem.closest('.checklist_item_container').attr('id'),

core/templates/core/account/settings.html

@@ -127,12 +127,15 @@ <h4 class="panel-title">
                   <span class="glyphicon glyphicon-plus"></span>
                   neuer Eintrag
               </a>
+              <button type="submit" id="save_checklist_priority" class="btn btn-success">Reihenfolge speichern</button>
+              <span id="checklist_items_priority_saved" class="invisible alert-success glyphicon glyphicon-floppy-saved"></span>
           </div>
         </div>
       </div>
 
     </div>
 
+    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
     <script src="{% static 'core/js/checklist_settings_handler.js' %}"></script>
 
 {% endblock %}

core/urls.py

@@ -3,7 +3,7 @@
 
 from core import views
 from core.views import CreateChecklistItemView, DeleteChecklistItemView, GetChecklistItemsView, UpdateChecklistItemView, \
-    GetChecklistItemsForTodayView, GetCurrentMatchdayView
+    GetChecklistItemsForTodayView, GetCurrentMatchdayView, UpdateChecklistPriorityView
 
 app_name = 'core'
 urlpatterns = [
@@ -22,6 +22,7 @@
     url(r'^settings_add_checklist_item/?$', CreateChecklistItemView.as_view(), name='settings_add_checklist_item'),
     url(r'^settings_update_checklist_item/?$', UpdateChecklistItemView.as_view(), name='settings_update_checklist_item'),
     url(r'^settings_delete_checklist_item/?$', DeleteChecklistItemView.as_view(), name='settings_delete_checklist_item'),
+    url(r'^settings_update_checklist_priority/?$', UpdateChecklistPriorityView.as_view(), name='settings_update_checklist_priority'),
 
     url(r'^trigger_parsing/?$', views.trigger_parsing, name='trigger_parsing'),
     url(r'^trigger_matchday_parsing/?$', views.trigger_matchday_parsing, name='trigger_matchday_parsing'),

core/views.py

@@ -202,7 +202,8 @@ def get(self, request, *args, **kwargs):
                                                 if current_matchday.number % c.to_be_checked_on_matchday_pattern == 0]
             filtered_checklist_items.extend(checklist_items_matchday_pattern)
 
-        checklist_items_json = [_get_checklist_item_in_json(item) for item in filtered_checklist_items]
+        sorted_checklist_items = sorted(filtered_checklist_items, key=lambda x: x.priority, reverse=False)
+        checklist_items_json = [_get_checklist_item_in_json(item) for item in sorted_checklist_items]
 
         return self.render_json_response(checklist_items_json)
 
@@ -234,6 +235,21 @@ def get(self, request, *args, **kwargs):
         return self.render_json_response(new_checklist_item_json)
 
 
+@method_decorator(login_required, name='dispatch')
+class UpdateChecklistPriorityView(CsrfExemptMixin, JsonRequestResponseMixin, View):
+
+    def post(self, request, *args, **kwargs):
+        checklist_priority = request.POST.get('checklist_priority')
+
+        priority = [int(x) for x in checklist_priority.split(',')]
+        for checklist_item_id in priority:
+            checklist_item = ChecklistItem.objects.get(checklist__user=request.user, id=checklist_item_id)
+            checklist_item.priority = priority.index(checklist_item_id)
+            checklist_item.save()
+
+        return self.render_json_response({'success': True})
+
+
 @method_decorator(login_required, name='dispatch')
 class UpdateChecklistItemView(CsrfExemptMixin, JsonRequestResponseMixin, View):