Skip to content
Snippets Groups Projects
Commit 4de14fe6 authored by Owen Winkler's avatar Owen Winkler Committed by Arthur Schiwon
Browse files

Javascript cleanup for groups.

parent c38548a1
Branches
No related tags found
No related merge requests found
...@@ -5,53 +5,59 @@ ...@@ -5,53 +5,59 @@
* See the COPYING-README file. * See the COPYING-README file.
*/ */
var GroupList = { var $userGroupList;
var GroupList;
GroupList = {
activeGID: '', activeGID: '',
addGroup: function (gid, usercount) { addGroup: function (gid, usercount) {
var li = $('li[data-gid]').last().clone(); var $li = $userGroupList.find('.isgroup:last-child').clone();
var ul = $('li[data-gid]').first().parent(); $li
li.attr('data-gid', gid); .data('gid', gid)
li.find('a span').first().text(gid); .find('.groupname').text(gid);
GroupList.setUserCount(li, usercount); GroupList.setUserCount($li, usercount);
$(li).appendTo(ul); $li.appendTo($userGroupList);
GroupList.sortGroups(0); GroupList.sortGroups();
return li; return $li;
}, },
setUserCount: function (groupLiElement, usercount) { setUserCount: function (groupLiElement, usercount) {
var $groupLiElement = $(groupLiElement);
if (usercount === undefined || usercount === 0) { if (usercount === undefined || usercount === 0) {
usercount = ''; usercount = '';
} }
groupLiElement.attr('data-usercount', usercount); $groupLiElement.data('usercount', usercount);
groupLiElement.find('span[class=usercount]').first().text(usercount); $groupLiElement.find('.usercount').text(usercount);
}, },
getCurrentGID: function () { getCurrentGID: function () {
return GroupList.activeGID; return GroupList.activeGID;
}, },
sortGroups: function(usercount) { sortGroups: function () {
var lis = $('li[data-gid]').filterAttr('data-usercount', usercount.toString()).get(); var lis = $('.isgroup').get();
var ul = $(lis).first().parent();
lis.sort(function (a, b) { lis.sort(function (a, b) {
return UserList.alphanum($(a).find('a span').text(), $(b).find('a span').text()); return UserList.alphanum(
$(a).find('a span').text(),
$(b).find('a span').text()
);
}); });
var items = []; var items = [];
$.each(lis, function (index, li) { $.each(lis, function (index, li) {
items.push(li); items.push(li);
if (items.length === 100) { if (items.length === 100) {
$(ul).append(items); $userGroupList.append(items);
items = []; items = [];
} }
}); });
if (items.length > 0) { if (items.length > 0) {
$(ul).append(items); $userGroupList.append(items);
} }
}, },
...@@ -65,24 +71,16 @@ ...@@ -65,24 +71,16 @@
if (result.status !== 'success') { if (result.status !== 'success') {
OC.dialogs.alert(result.data.message, OC.dialogs.alert(result.data.message,
t('settings', 'Error creating group')); t('settings', 'Error creating group'));
} else { }
else {
if (result.data.groupname) { if (result.data.groupname) {
var addedGroups = result.data.groupname; var addedGroup = result.data.groupname;
UserList.availableGroups = $.unique($.merge(UserList.availableGroups, addedGroups)); UserList.availableGroups = $.unique($.merge(UserList.availableGroups, [addedGroup]));
GroupList.addGroup(result.data.groupname); GroupList.addGroup(result.data.groupname);
$('#newusergroups').children().first().attr('value', result.data.groupname); $('.groupsselect, .subadminsselect')
$('#newusergroups').children().first().text(result.data.groupname); .append($('<option>', { value: result.data.groupname })
.text(result.data.groupname));
$('.groupsselect').each( function (index, element) {
$(element).children().first().attr('value', result.data.groupname);
$(element).children().first().text(result.data.groupname);
});
$('.subadminsselect').each( function (index, element) {
$(element).children().first().attr('value', result.data.groupname);
$(element).children().first().text(result.data.groupname);
});
} }
GroupList.toggleAddGroup(); GroupList.toggleAddGroup();
} }
...@@ -95,36 +93,39 @@ ...@@ -95,36 +93,39 @@
return; return;
} }
GroupList.updating = true; GroupList.updating = true;
var pattern = filter.getPattern(); $.get(
var query = $.param({ pattern: pattern }); OC.generateUrl('/settings/ajax/grouplist'),
$.get(OC.generateUrl('/settings/ajax/grouplist') + '?' + query, function (result) { {pattern: filter.getPattern()},
function (result) {
var lis = []; var lis = [];
if (result.status === 'success') { if (result.status === 'success') {
$.each(result.data, function (i, subset) { $.each(result.data, function (i, subset) {
$.each(subset, function (index, group) { $.each(subset, function (index, group) {
if($('li[data-gid="' + group.name + '"]').length > 0) { if (GroupList.getGroupLI(group.name).length > 0) {
var li = $('li[data-gid="' + group.name + '"]'); GroupList.setUserCount(GroupList.getGroupLI(group.name).first(), group.usercount);
GroupList.setUserCount(li, group.usercount); }
return true; else {
var $li = GroupList.addGroup(group.name, group.usercount);
$li.addClass('appear transparent');
lis.push($li);
} }
var li = GroupList.addGroup(group.name, group.usercount);
li.addClass('appear transparent');
lis.push(li);
}); });
}); });
if (result.data.length > 0) { if (result.data.length > 0) {
GroupList.doSort(); GroupList.doSort();
} else { }
else {
GroupList.noMoreEntries = true; GroupList.noMoreEntries = true;
} }
setTimeout(function () { setTimeout(function () {
for (var i = 0; i < lis.length; i++) { $(lis).removeClass('transparent');
lis[i].removeClass('transparent');
}
}, 0); }, 0);
} }
GroupList.updating = false; GroupList.updating = false;
});
}
);
}, },
elementBelongsToAddGroup: function (el) { elementBelongsToAddGroup: function (el) {
...@@ -134,20 +135,18 @@ ...@@ -134,20 +135,18 @@
hasAddGroupNameText: function () { hasAddGroupNameText: function () {
var name = $('#newgroupname').val(); var name = $('#newgroupname').val();
if($.trim(name) === '') { return $.trim(name) !== '';
return false;
}
return true;
}, },
showGroup: function (gid) { showGroup: function (gid) {
GroupList.activeGID = gid; GroupList.activeGID = gid;
UserList.empty(); UserList.empty();
UserList.update(gid); UserList.update(gid);
$('#app-navigation li').removeClass('active'); $userGroupList.find('li').removeClass('active');
if (gid !== undefined) { if (gid !== undefined) {
//TODO: treat Everyone properly //TODO: treat Everyone properly
$('#app-navigation li').filterAttr('data-gid', gid).addClass('active'); GroupList.getGroupLI(gid).addClass('active');
} }
}, },
...@@ -161,7 +160,8 @@ ...@@ -161,7 +160,8 @@
$('#newgroup-form').show(); $('#newgroup-form').show();
$('#newgroup-init').hide(); $('#newgroup-init').hide();
$('#newgroupname').focus(); $('#newgroupname').focus();
} else { }
else {
$('#newgroup-form').hide(); $('#newgroup-form').hide();
$('#newgroup-init').show(); $('#newgroup-init').show();
$('#newgroupname').val(''); $('#newgroupname').val('');
...@@ -179,16 +179,18 @@ ...@@ -179,16 +179,18 @@
}, },
hide: function (gid) { hide: function (gid) {
$('li[data-gid="' + gid + '"]').hide(); GroupList.getGroupLI(gid).hide();
}, },
show: function (gid) { show: function (gid) {
$('li[data-gid="' + gid + '"]').show(); GroupList.getGroupLI(gid).show();
}, },
remove: function (gid) { remove: function (gid) {
$('li').filterAttr('data-gid', gid).remove(); GroupList.getGroupLI(gid).remove();
}, },
empty: function () { empty: function () {
$('li:not([data-gid=""])').remove(); $userGroupList.filter(function(item){
return item.data('gid') !== '';
}).remove();
}, },
initDeleteHandling: function () { initDeleteHandling: function () {
//set up handler //set up handler
...@@ -203,10 +205,9 @@ ...@@ -203,10 +205,9 @@
GroupList.show); GroupList.show);
//when to mark user for delete //when to mark user for delete
$('ul').on('click', 'span.utils>a', function () { $userGroupList.on('click', '.delete', function () {
// Call function for handling delete/undo // Call function for handling delete/undo
var gid = $(this).parent().parent().attr('data-gid'); GroupDeleteHandler.mark(GroupList.getElementGID(this));
GroupDeleteHandler.mark(gid);
}); });
console.log('init del groups'); console.log('init del groups');
...@@ -214,10 +215,21 @@ ...@@ -214,10 +215,21 @@
$(window).on('beforeunload', function () { $(window).on('beforeunload', function () {
GroupDeleteHandler.delete(); GroupDeleteHandler.delete();
}); });
},
getGroupLI: function (gid) {
return $userGroupList.find('li.isgroup').filter(function () {
return GroupList.getElementGID(this) === gid;
});
},
getElementGID: function (element) {
return ($(element).closest('li').data('gid') || '').toString();
} }
}; };
$(document).ready( function () { $(document).ready( function () {
$userGroupList = $('#usergrouplist');
GroupList.initDeleteHandling(); GroupList.initDeleteHandling();
// Display or hide of Create Group List Element // Display or hide of Create Group List Element
...@@ -248,64 +260,59 @@ $(document).ready( function () { ...@@ -248,64 +260,59 @@ $(document).ready( function () {
}); });
// click on group name // click on group name
// FIXME: also triggered when clicking on "remove" $userGroupList.on('click', '.isgroup', function () {
$('ul').on('click', 'li[data-gid]', function () { GroupList.showGroup(GroupList.getElementGID(this));
var li = $(this);
var gid = $(li).attr('data-gid');
GroupList.showGroup(gid);
}); });
// Implements Groupname editing. // Implements Groupname editing.
$('#app-navigation').on('click', 'img.rename', function (event) { $('#app-navigation').on('click', '.isgroup .rename', function (event) {
event.stopPropagation(); event.stopPropagation();
var img = $(this); var $li = $(this).closest('li');
var gid = img.parent().parent().attr('data-gid'); var gid = GroupList.getElementGID(this);
var groupname = escapeHTML(img.parent().parent().attr('data-gid')); var groupname = escapeHTML(gid);
var input = $('<input type="text" value="' + groupname + '">'); var $input = $('<input type="text" value="' + groupname + '">');
img.css('display', 'none'); $li.find('.dorename img').hide();
img.parent().children('span').replaceWith(input); $li.find('.dorename span').replaceWith($input);
input.focus(); $input.focus();
input.keypress(function (event) { $input.keypress(function (event) {
if (event.keyCode === 13) { if (event.keyCode === 13) {
if ($(this).val().length > 0) { if ($input.val().length > 0) {
$.post( $.post(
OC.filePath('settings', 'ajax', 'changegroupname.php'), OC.filePath('settings', 'ajax', 'changegroupname.php'),
{ groupname: gid, { groupname: $input.val() }
groupname: $(this).val()
}
); );
input.blur(); $input.blur();
} else { } else {
input.blur(); $input.blur();
} }
} }
}); });
input.blur(function () { $input.blur(function () {
var input = $(this), groupname = input.val(); var $input = $(this), groupname = $input.val();
input.closest('li').attr('data-gid', groupname); $input.closest('li').data('gid', groupname);
input.replaceWith('<span>' + escapeHTML(groupname) + '</span>'); $input.replaceWith('<span>' + escapeHTML(groupname) + '</span>');
img.css('display', ''); $li.find('img').show();
}); });
}); });
// Implements Quota Settings Toggle. // Implements Quota Settings Toggle.
var $appSettings = $('#app-settings');
$('#app-settings-header').on('click keydown',function(event) { $('#app-settings-header').on('click keydown',function(event) {
if(wrongKey(event)) { if(wrongKey(event)) {
return; return;
} }
var bodyListener = function(e) { if($appSettings.hasClass('open')) {
if($('#app-settings').find($(e.target)).length === 0) { $appSettings.switchClass('open', '');
$('#app-settings').switchClass('open', '');
}
};
if($('#app-settings').hasClass('open')) {
$('#app-settings').switchClass('open', '');
$('body').unbind('click', bodyListener);
} else { } else {
$('#app-settings').switchClass('', 'open'); $appSettings.switchClass('', 'open');
$('body').bind('click', bodyListener); }
});
$('body').on('click', function(event){
if($appSettings.find(event.target).length === 0) {
$appSettings.switchClass('open', '');
} }
}); });
}); });
var wrongKey = function(event) { var wrongKey = function(event) {
......
<ul> <ul id="usergrouplist">
<!-- Add new group --> <!-- Add new group -->
<li id="newgroup-init"> <li id="newgroup-init">
<a href="#"> <a href="#">
...@@ -12,7 +12,7 @@ ...@@ -12,7 +12,7 @@
</form> </form>
</li> </li>
<!-- Everyone --> <!-- Everyone -->
<li data-gid=""> <li data-gid="" class="isgroup">
<a href="#"> <a href="#">
<span> <span>
<?php p($l->t('Everyone')); ?> <?php p($l->t('Everyone')); ?>
...@@ -25,8 +25,8 @@ ...@@ -25,8 +25,8 @@
<!-- The Admin Group --> <!-- The Admin Group -->
<?php foreach($_["adminGroup"] as $adminGroup): ?> <?php foreach($_["adminGroup"] as $adminGroup): ?>
<li data-gid="admin"> <li data-gid="admin" class="isgroup">
<a href="#"><?php p($l->t('Admins')); ?></a> <a href="#"><span class="groupname"><?php p($l->t('Admins')); ?></span></a>
<span class="utils"> <span class="utils">
<span class="usercount"><?php if($adminGroup['usercount'] > 0) { p($adminGroup['usercount']); } ?></span> <span class="usercount"><?php if($adminGroup['usercount'] > 0) { p($adminGroup['usercount']); } ?></span>
</span> </span>
...@@ -35,9 +35,9 @@ ...@@ -35,9 +35,9 @@
<!--List of Groups--> <!--List of Groups-->
<?php foreach($_["groups"] as $group): ?> <?php foreach($_["groups"] as $group): ?>
<li data-gid="<?php p($group['name']) ?>" data-usercount="<?php p($group['usercount']) ?>"> <li data-gid="<?php p($group['name']) ?>" data-usercount="<?php p($group['usercount']) ?>" class="isgroup">
<a href="#"> <a href="#" class="dorename">
<span><?php p($group['name']); ?></span> <span class="groupname"><?php p($group['name']); ?></span>
<img class="svg action rename" src="<?php p(image_path('core', 'actions/rename.svg'))?>" <img class="svg action rename" src="<?php p(image_path('core', 'actions/rename.svg'))?>"
original-title="<?php p($l->t('Edit'))?>" alt="<?php p($l->t("change group name"))?>" title="<?php p($l->t("change group name"))?>" /> original-title="<?php p($l->t('Edit'))?>" alt="<?php p($l->t("change group name"))?>" title="<?php p($l->t("change group name"))?>" />
</a> </a>
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment