Add frontend JS + JS unit tests

css/app.css

@@ -36,11 +36,11 @@
 /* FIXME: integrate with core styles */
 #customgroups .sidebar .close {
 	position: absolute;
-    top: 0;
-    right: 0;
-    padding: 15px;
-    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
-    opacity: .5;
+	top: 0;
+	right: 0;
+	padding: 15px;
+	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
+	opacity: .5;
 }
 
 #customgroups .avatar {

js/App.js

@@ -0,0 +1,84 @@
+/*
+ * Copyright (c) 2016 Vincent Petry <[email protected]>
+ *
+ * This file is licensed under the Affero General Public License version 3
+ * or later.
+ *
+ * See the COPYING-README file.
+ *
+ */
+
+(function(OCA) {
+
+	var App = OC.Backbone.View.extend({
+		events: {
+			'click .sidebar .action-close': '_onClickClose'
+		},
+
+		initialize: function() {
+			this.collection = new OCA.CustomGroups.GroupsCollection([], {
+				// admins can see all groups so don't set a user filter
+				userId: (OC.isUserAdmin() ? null : OC.getCurrentUser().uid)
+			});
+			this.listView = new OCA.CustomGroups.GroupsView(this.collection);
+			this.listView.on('select', this._onSelectGroup, this);
+
+			this.render();
+
+			this.collection.fetch();
+		},
+
+		template: function(data) {
+			return OCA.CustomGroups.Templates.app(data);
+		},
+
+		render: function() {
+			this.$el.html(this.template({
+				customGroupsTitle: t('customgroups', 'Custom Groups')
+			}));
+
+			this.$groupsContainer = this.$('.groups-container').removeClass('icon-loading');
+			this.$membersContainer = this.$('.members-container').removeClass('icon-loading');
+
+			this.listView.render();
+			this.$groupsContainer.append(this.listView.$el);
+		},
+
+		_onSelectGroup: function(group) {
+			this.$membersContainer.empty();
+			if (this.membersView) {
+				this.membersView.remove();
+			}
+
+			if (group !== null) {
+				OC.Apps.showAppSidebar(this.$membersContainer);
+				this.membersView = new OCA.CustomGroups.MembersView(group);
+				this.$membersContainer.append(this.membersView.$el);
+
+				this.membersView.render();
+			} else {
+				OC.Apps.hideAppSidebar(this.$membersContainer);
+			}
+		},
+
+		_onClickClose: function(ev) {
+			ev.preventDefault();
+			OC.Apps.hideAppSidebar(this.$membersContainer);
+			return false;
+		},
+
+	});
+
+	OCA.CustomGroups = _.extend({
+		ROLE_MEMBER: 'member',
+		ROLE_ADMIN: 'admin'
+	}, OCA.CustomGroups);
+
+	OCA.CustomGroups.App = App;
+
+})(OCA);
+
+$(document).ready(function() {
+	var app = new OCA.CustomGroups.App();
+	$('#customgroups').append(app.$el);
+});

js/GroupModel.js

@@ -0,0 +1,56 @@
+/*
+ * Copyright (c) 2016 Vincent Petry <[email protected]>
+ *
+ * This file is licensed under the Affero General Public License version 3
+ * or later.
+ *
+ * See the COPYING-README file.
+ *
+ */
+
+(function(OC, OCA) {
+	var NS = '{' + OC.Files.Client.NS_OWNCLOUD + '}';
+
+	/**
+	 * @class OCA.CustomGroups.GroupModel
+	 * @classdesc
+	 *
+	 */
+	var GroupModel = OC.Backbone.WebdavCollectionNode.extend(
+		/** @lends OCA.CustomGroups.GroupModel.prototype */ {
+
+		childrenCollectionClass: OCA.CustomGroups.MembersCollection,
+
+		davProperties: {
+			'displayName': NS + 'display-name',
+			'role': NS + 'role'
+		},
+
+		initialize: function() {
+			var self = this;
+			// group is part of a GroupsCollection ?
+			if (this.collection) {
+				// get owner
+				var userId = this.collection.getUserId();
+				if (userId) {
+					// detect removal of list owner
+					this.getChildrenCollection().on('remove', function(membershipModel) {
+						if (membershipModel.id === userId) {
+							// remove current group from the list
+							self.collection.remove(self);
+						}
+					});
+				}
+			}
+		},
+
+		url: function() {
+			return OC.linkToRemote('dav') + '/customgroups/groups/' + encodeURIComponent(this.get('id'));
+		}
+	});
+
+	OCA.CustomGroups = _.extend({}, OCA.CustomGroups);
+	OCA.CustomGroups.GroupModel = GroupModel;
+
+})(OC, OCA);
+

js/GroupsCollection.js

@@ -0,0 +1,46 @@
+/*
+ * Copyright (c) 2016 Vincent Petry <[email protected]>
+ *
+ * This file is licensed under the Affero General Public License version 3
+ * or later.
+ *
+ * See the COPYING-README file.
+ *
+ */
+(function(OC, OCA) {
+	/**
+	 * @class OCA.CustomGroups.GroupsCollection
+	 * @classdesc
+	 *
+	 */
+	var GroupsCollection = OC.Backbone.WebdavChildrenCollection.extend(
+		/** @lends OCA.CustomGroups.GroupsCollection.prototype */ {
+
+		model: OCA.CustomGroups.GroupModel,
+
+		_userId: null,
+
+		initialize: function(models, options) {
+			options = options || {};
+
+			this._userId = options.userId;
+		},
+
+		getUserId: function() {
+			return this._userId;
+		},
+
+		url: function() {
+			if (!this._userId) {
+				return OC.linkToRemote('dav') + '/customgroups/groups/';
+			} else {
+				return OC.linkToRemote('dav') + '/customgroups/users/' + encodeURIComponent(this._userId) + '/';
+			}
+		}
+	});
+
+	OCA.CustomGroups = _.extend({}, OCA.CustomGroups);
+	OCA.CustomGroups.GroupsCollection = GroupsCollection;
+
+})(OC, OCA);
+