зеркало из https://github.com/nextcloud/spreed.git
Added 'Add person' functionality to more-actions menu.
Signed-off-by: Ivan Sein <ivan@nextcloud.com>
This commit is contained in:
Родитель
339599ae00
Коммит
509811ac83
|
@ -14,21 +14,35 @@
|
|||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
|
||||
.oca-spreedme-add-person {
|
||||
width: 130px;
|
||||
top: 0;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
|
||||
/**
|
||||
* Sidebar styles
|
||||
*/
|
||||
|
||||
#select2-drop {
|
||||
top: 50px !important;
|
||||
margin-top: -46px !important;
|
||||
}
|
||||
#oca-spreedme-add-room .select2-container {
|
||||
|
||||
.select2-search input {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
#oca-spreedme-add-room .select2-container,
|
||||
.oca-spreedme-add-person .select2-container {
|
||||
width: 100%;
|
||||
margin: 0 !important;
|
||||
border: none;
|
||||
padding: 9px;
|
||||
}
|
||||
#oca-spreedme-add-room .select2-arrow {
|
||||
display: none;
|
||||
#oca-spreedme-add-room .select2-arrow,
|
||||
.oca-spreedme-add-person .select2-arrow {
|
||||
display: none !important;
|
||||
}
|
||||
.select2-search input {
|
||||
padding: 13px 12px !important;
|
||||
|
@ -282,6 +296,10 @@ video {
|
|||
width: 100% !important;
|
||||
}
|
||||
|
||||
#app-navigation .app-navigation-entry-menu input {
|
||||
margin-left: 3px !important;
|
||||
}
|
||||
|
||||
#app-navigation .app-navigation-entry-menu li span {
|
||||
display: inline-block;
|
||||
height: 36px;
|
||||
|
|
|
@ -20,7 +20,7 @@
|
|||
*
|
||||
*/
|
||||
|
||||
(function(OCA, Marionette, Handlebars) {
|
||||
(function(OC, OCA, Marionette, Handlebars) {
|
||||
'use strict';
|
||||
|
||||
OCA.SpreedMe = OCA.SpreedMe || {};
|
||||
|
@ -35,23 +35,19 @@
|
|||
'</ul>'+
|
||||
'</div>'+
|
||||
'<div class="app-navigation-entry-menu">'+
|
||||
'<ul>'+
|
||||
'<ul class="app-navigation-entry-menu-list">'+
|
||||
'<li>'+
|
||||
'<button class="add-person-button">'+
|
||||
'<span class="icon-add svg"></span>'+
|
||||
'<span>'+t('spreedme', 'Add person')+'</span>'+
|
||||
'</button>'+
|
||||
'</li>'+
|
||||
'</ul>'+
|
||||
'<ul>'+
|
||||
'<li>'+
|
||||
'<button class="share-group-button">'+
|
||||
'<span class="icon-share svg"></span>'+
|
||||
'<span>'+t('spreedme', 'Share group')+'</span>'+
|
||||
'</button>'+
|
||||
'</li>'+
|
||||
'</ul>'+
|
||||
'<ul>'+
|
||||
'<li>'+
|
||||
'<button class="leave-group-button">'+
|
||||
'<span class="icon-close svg"></span>'+
|
||||
|
@ -59,6 +55,9 @@
|
|||
'</button>'+
|
||||
'</li>'+
|
||||
'</ul>'+
|
||||
'<form class="oca-spreedme-add-person hidden">'+
|
||||
'<input class="add-person-input" type="text" placeholder="Type name..."/>'+
|
||||
'</form>'+
|
||||
'</div>';
|
||||
|
||||
var RoomItenView = Marionette.View.extend({
|
||||
|
@ -74,10 +73,8 @@
|
|||
initialize: function() {
|
||||
// Add class to every room list item to detect it on click.
|
||||
this.$el.addClass('room-list-item');
|
||||
|
||||
this.listenTo(uiChannel, 'document:click', function(event) {
|
||||
var target = $(event.target);
|
||||
|
||||
if (!this.$el.is(target.closest('.room-list-item'))) {
|
||||
// Click was not triggered by this element -> close menu
|
||||
this.menuShown = false;
|
||||
|
@ -86,6 +83,8 @@
|
|||
});
|
||||
},
|
||||
onRender: function() {
|
||||
this.initPersonSelector();
|
||||
|
||||
if (this.model.get('active')) {
|
||||
this.$el.addClass('active');
|
||||
} else {
|
||||
|
@ -111,7 +110,10 @@
|
|||
'click .app-navigation-entry-menu .leave-group-button': 'leaveGroup',
|
||||
},
|
||||
ui: {
|
||||
'menu': 'div.app-navigation-entry-menu',
|
||||
'menu': '.app-navigation-entry-menu',
|
||||
'menuList': '.app-navigation-entry-menu-list',
|
||||
'personSelectorForm' : '.oca-spreedme-add-person',
|
||||
'personSelectorInput': '.add-person-input'
|
||||
},
|
||||
template: Handlebars.compile(ITEM_TEMPLATE),
|
||||
menuShown: false,
|
||||
|
@ -124,7 +126,9 @@
|
|||
this.ui.menu.toggleClass('open', this.menuShown);
|
||||
},
|
||||
addPerson: function() {
|
||||
console.log("add person", this.model.get('id'));
|
||||
this.ui.menuList.attr('style', 'display: none !important');
|
||||
this.ui.personSelectorForm.toggleClass('hidden');
|
||||
this.ui.personSelectorInput.select2('open');
|
||||
},
|
||||
shareGroup: function() {
|
||||
console.log("share group", this.model.get('id'));
|
||||
|
@ -142,6 +146,105 @@
|
|||
url: OC.generateUrl('/apps/spreed/api/room/') + this.model.get('id'),
|
||||
type: 'DELETE'
|
||||
});
|
||||
},
|
||||
initPersonSelector: function() {
|
||||
var _this = this;
|
||||
|
||||
this.ui.personSelectorInput.select2({
|
||||
ajax: {
|
||||
url: OC.linkToOCS('apps/files_sharing/api/v1') + 'sharees',
|
||||
dataType: 'json',
|
||||
quietMillis: 100,
|
||||
data: function (term) {
|
||||
return {
|
||||
format: 'json',
|
||||
search: term,
|
||||
perPage: 200,
|
||||
itemType: 'call'
|
||||
};
|
||||
},
|
||||
results: function (response) {
|
||||
// TODO improve error case
|
||||
if (response.ocs.data === undefined) {
|
||||
console.error('Failure happened', response);
|
||||
return;
|
||||
}
|
||||
|
||||
var results = [];
|
||||
$.each(response.ocs.data.exact.users, function(id, user) {
|
||||
if (oc_current_user === user.value.shareWith) {
|
||||
return;
|
||||
}
|
||||
results.push({ id: user.value.shareWith, displayName: user.label, type: "user"});
|
||||
});
|
||||
$.each(response.ocs.data.users, function(id, user) {
|
||||
if (oc_current_user === user.value.shareWith) {
|
||||
return;
|
||||
}
|
||||
results.push({ id: user.value.shareWith, displayName: user.label, type: "user"});
|
||||
});
|
||||
|
||||
return {
|
||||
results: results,
|
||||
more: false
|
||||
};
|
||||
}
|
||||
},
|
||||
initSelection: function (element, callback) {
|
||||
console.log(element);
|
||||
callback({id: element.val()});
|
||||
},
|
||||
formatResult: function (element) {
|
||||
return '<span><div class="avatar" data-user="' + escapeHTML(element.id) + '" data-user-display-name="' + escapeHTML(element.displayName) + '"></div>' + escapeHTML(element.displayName) + '</span>';
|
||||
},
|
||||
formatSelection: function () {
|
||||
return '<span class="select2-default" style="padding-left: 0;">'+OC.L10N.translate('spreed', 'Choose person…')+'</span>';
|
||||
}
|
||||
});
|
||||
this.ui.personSelectorInput.on('change', function(e) {
|
||||
$.post(
|
||||
OC.generateUrl('/apps/spreed/api/room/') + _this.model.get('id'),
|
||||
{
|
||||
newParticipant: e.val
|
||||
}
|
||||
);
|
||||
$('body').find('.avatar').each(function () {
|
||||
var element = $(this);
|
||||
if (element.data('user-display-name')) {
|
||||
element.avatar(element.data('user'), 32, undefined, false, undefined, element.data('user-display-name'));
|
||||
} else {
|
||||
element.avatar(element.data('user'), 32);
|
||||
}
|
||||
});
|
||||
});
|
||||
this.ui.personSelectorInput.on('click', function() {
|
||||
$('body').find('.avatar').each(function () {
|
||||
var element = $(this);
|
||||
if (element.data('user-display-name')) {
|
||||
element.avatar(element.data('user'), 32, undefined, false, undefined, element.data('user-display-name'));
|
||||
} else {
|
||||
element.avatar(element.data('user'), 32);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
this.ui.personSelectorInput.on('select2-loaded', function() {
|
||||
$('body').find('.avatar').each(function () {
|
||||
var element = $(this);
|
||||
if (element.data('user-display-name')) {
|
||||
element.avatar(element.data('user'), 32, undefined, false, undefined, element.data('user-display-name'));
|
||||
} else {
|
||||
element.avatar(element.data('user'), 32);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
this.ui.personSelectorInput.on('select2-close', function () {
|
||||
_this.ui.menuList.attr('style', 'display: block !important');
|
||||
_this.ui.personSelectorForm.toggleClass('hidden');
|
||||
_this.menuShown = false;
|
||||
_this.toggleMenuClass();
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
|
@ -152,4 +255,4 @@
|
|||
|
||||
OCA.SpreedMe.Views.RoomListView = RoomListView;
|
||||
|
||||
})(OCA, Marionette, Handlebars);
|
||||
})(OC, OCA, Marionette, Handlebars);
|
||||
|
|
|
@ -311,6 +311,7 @@ class ApiController extends Controller {
|
|||
$room->addUser($user);
|
||||
}
|
||||
}
|
||||
$room->addUser($newUser);
|
||||
return new JSONResponse(['roomId' => $room->getId()], Http::STATUS_CREATED);
|
||||
}
|
||||
|
||||
|
|
Загрузка…
Ссылка в новой задаче