replace chosen with select2 to provide ajaxified user and group selection for files_external, fixes #7499
remove minified select2 js show avatars for users, simpler results remove unneeded users and groups from settings template fix css, escape user and group names
This commit is contained in:
Jörn Friedrich Dreyer
parent
bff39f796e
commit
308e8d6379
|
|
@ -1,2 +0,0 @@
|
|||
.idea
|
||||
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,26 @@
|
|||
<?php
|
||||
|
||||
OCP\JSON::checkAppEnabled('files_external');
|
||||
OCP\JSON::callCheck();
|
||||
|
||||
OCP\JSON::checkAdminUser();
|
||||
|
||||
$pattern = '';
|
||||
$limit = null;
|
||||
$offset = null;
|
||||
if (isset($_GET['pattern'])) {
|
||||
$pattern = $_GET['pattern'];
|
||||
}
|
||||
if (isset($_GET['limit'])) {
|
||||
$limit = $_GET['limit'];
|
||||
}
|
||||
if (isset($_GET['offset'])) {
|
||||
$offset = $_GET['offset'];
|
||||
}
|
||||
|
||||
$groups = \OC_Group::getGroups($pattern, $limit, $offset);
|
||||
$users = \OCP\User::getDisplayNames($pattern, $limit, $offset);
|
||||
|
||||
$results = array('groups' => $groups, 'users' => $users);
|
||||
|
||||
\OCP\JSON::success($results);
|
||||
|
|
@ -37,6 +37,9 @@ $this->create('files_external_dropbox', 'ajax/dropbox.php')
|
|||
$this->create('files_external_google', 'ajax/google.php')
|
||||
->actionInclude('files_external/ajax/google.php');
|
||||
|
||||
$this->create('files_external_list_applicable', '/applicable')
|
||||
->actionInclude('files_external/ajax/applicable.php');
|
||||
|
||||
OC_API::register('get',
|
||||
'/apps/files_external/api/v1/mounts',
|
||||
array('\OCA\Files\External\Api', 'getUserMounts'),
|
||||
|
|
|
|||
|
|
@ -42,3 +42,19 @@ tr:hover>td.remove>img { visibility:visible; cursor:pointer; }
|
|||
#userMountingBackends {
|
||||
padding-left: 25px;
|
||||
}
|
||||
|
||||
#body-settings .select2-results .select2-result-label {
|
||||
height: 32px;
|
||||
padding: 3px;
|
||||
}
|
||||
.select2-results .select2-result-label .avatardiv {
|
||||
display:inline-block;
|
||||
}
|
||||
.select2-results .select2-result-label .avatardiv + span {
|
||||
margin-left: 10px;
|
||||
}
|
||||
.select2-results .select2-result-label .avatardiv[data-type="group"] + span {
|
||||
vertical-align: top;
|
||||
top: 6px;
|
||||
position: relative;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -42,9 +42,11 @@ OC.MountConfig={
|
|||
}
|
||||
});
|
||||
if ($('#externalStorage').data('admin') === true) {
|
||||
var multiselect = $(tr).find('.chzn-select').val();
|
||||
var multiselect = $(tr).find('.applicableUsers').select2('val');
|
||||
if (multiselect == null) {
|
||||
return false;
|
||||
} else if (multiselect instanceof Array && multiselect.length === 0) {
|
||||
multiselect.push('all');
|
||||
}
|
||||
}
|
||||
if (addMountPoint) {
|
||||
|
|
@ -166,8 +168,139 @@ OC.MountConfig={
|
|||
};
|
||||
|
||||
$(document).ready(function() {
|
||||
$('.chzn-select').chosen();
|
||||
//initialize hidden input field with list of users and groups
|
||||
$('#externalStorage').find('tr:not(#addMountPoint)').each(function(i,tr) {
|
||||
var applicable = $(tr).find('.applicable');
|
||||
if (applicable.length > 0) {
|
||||
var groups = applicable.data('applicable-groups');
|
||||
var groupsId = [];
|
||||
$.each(groups, function () {
|
||||
groupsId.push(this+"(group)");
|
||||
});
|
||||
var users = applicable.data('applicable-users');
|
||||
if (users.indexOf('all') > -1) {
|
||||
$(tr).find('.applicableUsers').val('');
|
||||
} else {
|
||||
$(tr).find('.applicableUsers').val(groupsId.concat(users).join(','));
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
var userListLimit = 30;
|
||||
function addSelect2 ($elements) {
|
||||
if ($elements.length > 0) {
|
||||
$elements.select2({
|
||||
placeholder: t('files_external', 'All users. Type to select user or group.'),
|
||||
allowClear: true,
|
||||
multiple: true,
|
||||
//minimumInputLength: 1,
|
||||
ajax: {
|
||||
url: OC.generateUrl('apps/files_external/applicable'),
|
||||
dataType: 'json',
|
||||
quietMillis: 100,
|
||||
data: function (term, page) { // page is the one-based page number tracked by Select2
|
||||
return {
|
||||
pattern: term, //search term
|
||||
limit: userListLimit, // page size
|
||||
offset: userListLimit*(page-1), // page number starts with 0
|
||||
};
|
||||
},
|
||||
results: function (data, page) {
|
||||
if (data.status === "success") {
|
||||
|
||||
var results = [];
|
||||
var userCount = 0; // users is an object
|
||||
|
||||
// add groups
|
||||
$.each(data.groups, function(i, group) {
|
||||
results.push({name:group+'(group)', displayname:group, type:'group' });
|
||||
});
|
||||
// add users
|
||||
$.each(data.users, function(id, user) {
|
||||
userCount++;
|
||||
results.push({name:id, displayname:user, type:'user' });
|
||||
});
|
||||
|
||||
|
||||
var more = (userCount >= userListLimit) || (data.groups.length >= userListLimit);
|
||||
return {results: results, more: more};
|
||||
} else {
|
||||
//FIXME add error handling
|
||||
}
|
||||
}
|
||||
},
|
||||
initSelection: function(element, callback) {
|
||||
|
||||
var promises = [];
|
||||
|
||||
var results = [];
|
||||
|
||||
$(element.val().split(",")).each(function (i,userId) {
|
||||
var def = new $.Deferred();
|
||||
promises.push(def.promise());
|
||||
|
||||
var pos = userId.indexOf('(group)');
|
||||
if (pos !== -1) {
|
||||
//add as group
|
||||
results.push({name:userId, displayname:userId.substr(0, pos), type:'group'});
|
||||
def.resolve();
|
||||
} else {
|
||||
$.ajax(OC.generateUrl('apps/files_external/applicable'), {
|
||||
data: {
|
||||
pattern: userId
|
||||
},
|
||||
dataType: "json"
|
||||
}).done(function(data) {
|
||||
if (data.status === "success") {
|
||||
if (data.users[userId]) {
|
||||
results.push({name:userId, displayname:data.users[userId], type:'user'});
|
||||
}
|
||||
def.resolve();
|
||||
} else {
|
||||
//FIXME add error handling
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
$.when.apply(undefined, promises).then(function(){
|
||||
callback(results);
|
||||
});
|
||||
},
|
||||
id: function(element) {
|
||||
return element.name;
|
||||
},
|
||||
formatResult: function (element) {
|
||||
var $result = $('<span><div class="avatardiv"/><span>'+escapeHTML(element.displayname)+'</span></span>');
|
||||
var $div = $result.find('.avatardiv')
|
||||
.attr('data-type', element.type)
|
||||
.attr('data-name', element.name)
|
||||
.attr('data-displayname', element.displayname);
|
||||
if (element.type === 'group') {
|
||||
var url = OC.imagePath('core','places/contacts-dark'); // TODO better group icon
|
||||
$div.html('<img width="32" height="32" src="'+url+'">');
|
||||
}
|
||||
return $result.get(0).outerHTML;
|
||||
},
|
||||
formatSelection: function (element) {
|
||||
if (element.type === 'group') {
|
||||
return '<span title="'+escapeHTML(element.name)+'" class="group">'+escapeHTML(element.displayname+' '+t('files_external', '(group)'))+'</span>';
|
||||
} else {
|
||||
return '<span title="'+escapeHTML(element.name)+'" class="user">'+escapeHTML(element.displayname)+'</span>';
|
||||
}
|
||||
},
|
||||
escapeMarkup: function (m) { return m; } // we escape the markup in formatResult and formatSelection
|
||||
}).on("select2-loaded", function() {
|
||||
$.each($(".avatardiv"), function(i, div) {
|
||||
$div = $(div);
|
||||
if ($div.data('type') === 'user') {
|
||||
$div.avatar($div.data('name'),32);
|
||||
}
|
||||
})
|
||||
});
|
||||
}
|
||||
}
|
||||
addSelect2($('tr:not(#addMountPoint) .applicableUsers'));
|
||||
|
||||
$('#externalStorage').on('change', '#selectBackend', function() {
|
||||
var tr = $(this).parent().parent();
|
||||
$('#externalStorage tbody').append($(tr).clone());
|
||||
|
|
@ -209,15 +342,11 @@ $(document).ready(function() {
|
|||
return false;
|
||||
}
|
||||
});
|
||||
// Reset chosen
|
||||
var chosen = $(tr).find('.applicable select');
|
||||
chosen.parent().find('div').remove();
|
||||
chosen.removeAttr('id').removeClass('chzn-done').css({display:'inline-block'});
|
||||
chosen.chosen();
|
||||
$(tr).find('td').last().attr('class', 'remove');
|
||||
$(tr).find('td').last().removeAttr('style');
|
||||
$(tr).removeAttr('id');
|
||||
$(this).remove();
|
||||
addSelect2($('tr:not(#addMountPoint) .applicableUsers'));
|
||||
});
|
||||
|
||||
function suggestMountPoint(defaultMountPoint) {
|
||||
|
|
@ -270,8 +399,8 @@ $(document).ready(function() {
|
|||
OC.MountConfig.saveStorage($(this).parent().parent().parent());
|
||||
});
|
||||
|
||||
$('#externalStorage').on('change', '.applicable .chzn-select', function() {
|
||||
OC.MountConfig.saveStorage($(this).parent().parent());
|
||||
$('#externalStorage').on('change', '.applicable', function() {
|
||||
OC.MountConfig.saveStorage($(this).parent());
|
||||
});
|
||||
|
||||
$('#sslCertificate').on('click', 'td.remove>img', function() {
|
||||
|
|
|
|||
|
|
@ -23,9 +23,10 @@
|
|||
OC_Util::checkAdminUser();
|
||||
|
||||
OCP\Util::addScript('files_external', 'settings');
|
||||
OCP\Util::addscript('3rdparty', 'chosen/chosen.jquery.min');
|
||||
OCP\Util::addStyle('files_external', 'settings');
|
||||
OCP\Util::addStyle('3rdparty', 'chosen/chosen');
|
||||
|
||||
OCP\Util::addScript('files_external', '../3rdparty/select2/select2');
|
||||
OCP\Util::addStyle('files_external', '../3rdparty/select2/select2');
|
||||
|
||||
$backends = OC_Mount_Config::getBackends();
|
||||
$personal_backends = array();
|
||||
|
|
@ -46,8 +47,6 @@ $tmpl->assign('isAdminPage', true);
|
|||
$tmpl->assign('mounts', OC_Mount_Config::getSystemMountPoints());
|
||||
$tmpl->assign('backends', $backends);
|
||||
$tmpl->assign('personal_backends', $personal_backends);
|
||||
$tmpl->assign('groups', OC_Group::getGroups());
|
||||
$tmpl->assign('users', OCP\User::getUsers());
|
||||
$tmpl->assign('userDisplayNames', OC_User::getDisplayNames());
|
||||
$tmpl->assign('dependencies', OC_Mount_Config::checkDependencies());
|
||||
$tmpl->assign('allowUserMounting', OCP\Config::getAppValue('files_external', 'allow_user_mounting', 'yes'));
|
||||
|
|
|
|||
|
|
@ -88,31 +88,8 @@
|
|||
print_unescaped(json_encode($mount['applicable']['groups'])); ?>'
|
||||
data-applicable-users='<?php if (isset($mount['applicable']['users']))
|
||||
print_unescaped(json_encode($mount['applicable']['users'])); ?>'>
|
||||
<select class="chzn-select"
|
||||
multiple style="width:20em;"
|
||||
data-placeholder="<?php p($l->t('No user or group')); ?>">
|
||||
<option value="all"
|
||||
<?php if (empty($mount['class']) || (isset($mount['applicable']['users']) && in_array('all', $mount['applicable']['users']))) print_unescaped('selected="selected"');?> >
|
||||
<?php p($l->t('All Users')); ?>
|
||||
</option>
|
||||
<optgroup label="<?php p($l->t('Groups')); ?>">
|
||||
<?php foreach ($_['groups'] as $group): ?>
|
||||
<option value="<?php p($group); ?>(group)"
|
||||
<?php if (isset($mount['applicable']['groups']) && in_array($group, $mount['applicable']['groups'])): ?>
|
||||
selected="selected"
|
||||
<?php endif; ?>><?php p($group); ?></option>
|
||||
<?php endforeach; ?>
|
||||
</optgroup>
|
||||
<optgroup label="<?php p($l->t('Users')); ?>">
|
||||
<?php foreach ($_['users'] as $user): ?>
|
||||
<option value="<?php p($user); ?>"
|
||||
<?php if (isset($mount['applicable']['users']) && in_array($user, $mount['applicable']['users'])): ?>
|
||||
selected="selected"
|
||||
<?php endif; ?>><?php p($_['userDisplayNames'][$user]); ?></option>
|
||||
<?php endforeach; ?>
|
||||
</optgroup>
|
||||
</select>
|
||||
</td>
|
||||
<input type="hidden" class="applicableUsers" style="width:20em;" value=""/>
|
||||
</td>
|
||||
<?php endif; ?>
|
||||
<td <?php if (isset($mount['mountpoint'])): ?>class="remove"
|
||||
<?php else: ?>style="visibility:hidden;"
|
||||
|
|
|
|||
Loading…
Reference in New Issue