webui: manage group owners

cloud/urls.py

@@ -93,11 +93,16 @@ urlpatterns = patterns('',
     url(r'^ajax/group/(?P<gid>\d+)/add/$',
             'school.views.group_ajax_add_new_member',
             name='group_ajax_add_new_member'),
+    url(r'^ajax/group/(?P<gid>\d+)/addOwner/$',
+            'school.views.group_ajax_add_new_owner',
+            name='group_ajax_add_new_owner'),
     url(r'^ajax/group/(?P<gid>\d+)/remove/$',
             'school.views.group_ajax_remove_member',
             name='group_ajax_remove_member'),
     url(r'^ajax/group/delete/$', 'school.views.group_ajax_delete',
             name='group_ajax_delete'),
+    url(r'^ajax/group/autocomplete/$', 'school.views.group_ajax_owner_autocomplete',
+            name='group_ajax_autocomplete'),
     url(r'^key/add/$', 'one.views.key_add', name='key_add'),
     url(r'^ajax/key/delete/$', 'one.views.key_ajax_delete',
             name='key_ajax_delete'),

one/static/script/cloud.js

@@ -423,11 +423,64 @@ $(function() {
     });
 
     $('#new-owner').click(function() {
-        $('#new-owner-form').toggle();
+        $('#new-owner-form input[type=text]').focus();
     });
     $('#new-owner-form input').click(function(e) {
         e.stopPropagation();
     });
+    $('#new-owner-form input').keyup(function() {
+        var timer;
+        return function(e){
+            var val=$(this).val().split(' ')[0];
+            clearTimeout(timer);
+            timer=setTimeout(function(){
+                if(val.length<1) return;
+                $.ajax({
+                    type: 'POST',
+                    data: 'q='+val,
+                    url: '/ajax/group/autocomplete/',
+                    dataType: 'json',
+                    success: function(data){
+                        console.log(data);
+                        $('#new-owner-autocomplete')[0].innerHTML='<ul>';
+                        var el=$('#new-owner-autocomplete')[0];
+                        for(var i in data){
+                            var d=data[i];
+                            el.innerHTML+='<li>'
+                                +d.name+': '
+                                +d.neptun
+                                +' <input type="button" value="'+gettext('Add owner')+'" data-neptun="'+d.neptun+'" />'
+                                +'<div class="clear"></div></li>';
+                        }
+                        if(data.length == 0){
+                            el.innerHTML+='<li>'
+                                +gettext('Unknown')+': '
+                                +val
+                                +' <input type="button" value="'+gettext('Add owner')+'" data-neptun="'+val+'" />'
+                                +'<div class="clear"></div></li>';
+                        }
+                        el.innerHTML+='</ul>';
+                        $(el).find('input').each(function(){
+                            var self=this;
+                            $(this).click(function(e){
+                                e.stopPropagation();
+                                $.ajax({
+                                    type: 'POST',
+                                    data: 'neptun='+$(self).data('neptun'),
+                                    url: '/ajax/group/'+$('#new-owner').data('gid')+'/addOwner/',
+                                    dataType: 'json',
+                                    success: function(data){
+                                        window.location.reload();
+                                    }
+                                })
+                            })
+                        })
+                    }
+                });
+            },1000);
+            e.stopPropagation();
+        }
+    }());
     $('#new-owner-form input[type=submit]').click(function() {
         var neptun = $(this).prev().val();
         $.ajax({
@@ -457,6 +510,19 @@ $(function() {
             }
         });
     });
+    /*$('#group-owners .remove').click(function(e) {
+        e.preventDefault();
+        e.stopPropagation();
+        var neptun = $(this).data('neptun');
+        $.ajax({
+            type: 'POST',
+            url: '/ajax/group/' + $(this).data('gid') + '/remove/',
+            data: 'neptun=' + neptun,
+            success: function(data) {
+                $('#member-' + neptun).slideUp(700);
+            }
+        });
+    });*/
     $('#groups .delete').click(function(e) {
         e.preventDefault();
         e.stopPropagation();

one/static/style/box.less

@@ -641,3 +641,8 @@ table {
     }
 }
 
+#new-owner-autocomplete {
+    input[type=button] {
+        float: right;
+    }
+}

school/templates/show-group.html

@@ -17,11 +17,11 @@
                         {{owner}} ({{owner.code}})
                         {% endif %}
                     </div>
-                    <div class="actions">
+                    <!--<div class="actions">
                         <a href="#" class="remove" data-gid="{{group.id}}" data-neptun="{{owner.code}}">
                             <img src="/static/icons/minus-circle.png" alt="{% trans 'Remove' %}" />
                         </a>
-                    </div>
+                    </div>-->
                     <div class="clear"></div>
                 </div>
                 <div class="details">
@@ -46,14 +46,16 @@
             </li>
             {% endfor %}
             <li class="entry small-row">
-                <div class="summary" id="new-owner">
+                <div class="summary" id="new-owner" data-gid="{{group.id}}">
                     <div class="name">{% trans "Add owner" %}</div>
-                    <div id="new-owner-form">
-                        <input type="text" placeholder="{% trans "Owner name/NEPTUN" %}" disabled="disabled" />
-                        <input type="submit" value="{% trans "Add owner" %}" data-id="{{group.id}}" disabled="disabled" />
-                    </div>
                     <div class="clear"></div>
                 </div>
+                <div class="details" id="new-owner-form">
+                    <div class="container">
+                        <input type="text" placeholder="{% trans "Owner name/NEPTUN" %}" />
+                        <div id="new-owner-autocomplete"></div>
+                    </div>
+                </div>
             </li>
         </ul>
     </div>

school/views.py

@@ -236,3 +236,31 @@ def group_ajax_delete(request):
     return HttpResponse(json.dumps({
         'status': 'OK'
         }))
+
+@login_required
+def group_ajax_owner_autocomplete(request):
+    results = map(lambda u: {
+        'name': u.get_full_name(),
+        'neptun': u.username }, User.objects.filter(last_name__startswith=request.POST['q'])[:5])
+    results += map(lambda u: {
+        'name': u.get_full_name(),
+        'neptun': u.username }, User.objects.filter(first_name__startswith=request.POST['q'])[:5])
+    results += map(lambda u: {
+        'name': u.get_full_name(),
+        'neptun': u.username }, User.objects.filter(username__startswith=request.POST['q'])[:5])
+    return HttpResponse(json.dumps(results, ensure_ascii=False))
+
+@login_required
+def group_ajax_add_new_owner(request, gid):
+    group = get_object_or_404(Group, id=gid)
+    member = request.POST['neptun']
+    if re.match('^[a-zA-Z][a-zA-Z0-9]{5}$', member.strip()) == None:
+        status = json.dumps({'status': 'Error'})
+        messages.error(request, _('Invalid NEPTUN code'))
+        return HttpResponse(status)
+    person, created = Person.objects.get_or_create(code=member)
+    group.owners.add(person)
+    group.save()
+    return HttpResponse(json.dumps({
+        'status': 'OK'
+        }))