make >>indicate group members<< in acl selector work again on group > show or group > dont show is selected

3 files changed, 15 insertions, 9 deletions

diff --git a/view/js/acl.js b/view/js/acl.js
index 6d94b4987..70440b572 100644
--- a/view/js/acl.js
+++ b/view/js/acl.js
@@ -231,14 +231,15 @@ ACL.prototype.update_view = function() {
 				}
 				$(that.group_uids[id]).each(function(i, v) {
 					if(uclass == "grouphide")
-						$("#c"+v).removeClass("groupshow");
+						// we need attr selection here because the id can include an @ (diaspora/friendica xchans)
+						$('[id="c' + v + '"]').removeClass("groupshow");
 					if(uclass !== "") {
-						var cls = $("#c"+v).attr('class');
+						var cls = $('[id="c' + v + '"]').attr('class');
 						if( cls === undefined)
 							return true;
 						var hiding = cls.indexOf('grouphide');
 						if(hiding == -1)
-							$("#c"+v).addClass(uclass);
+							$('[id="c' + v + '"]').addClass(uclass);
 					}
 				});
 				break;
@@ -277,7 +278,7 @@ ACL.prototype.populate = function(data) {
 	$(data.items).each(function(){
 		html = "<div class='acl-list-item {4} {7} {5}' title='{6}' id='{2}{3}'>"+that.item_tpl+"</div>";
 		html = html.format(this.photo, this.name, this.type, this.xid, '', this.self, this.link, this.taggable);
-		if (this.uids !== undefined) that.group_uids[this.id] = this.uids;
+		if (this.uids !== undefined) that.group_uids[this.xid] = this.uids;
 		//console.log(html);
 		that.list_content.append(html);
 	});
@@ -287,4 +288,4 @@ ACL.prototype.populate = function(data) {
 		$(el).removeAttr("data-src");
 	});
 	that.update_view();
-};
\ No newline at end of file
+};
diff --git a/view/theme/redbasic/css/style.css b/view/theme/redbasic/css/style.css
index f0e057425..6ef9ea284 100644
--- a/view/theme/redbasic/css/style.css
+++ b/view/theme/redbasic/css/style.css
@@ -915,7 +915,15 @@ a.rconnect:hover, a.rateme:hover, div.rateme:hover {
 	border-radius: $radiuspx;
 }
 
-.acl-list-item img{
+.acl-list-item.grouphide {
+	border: 1px solid red;
+}
+
+.acl-list-item.groupshow {
+	border: 1px solid green;
+}
+
+.acl-list-item img {
 	width: 40px;
 	height: 40px;
 	float: left;
diff --git a/view/tpl/acl_selector.tpl b/view/tpl/acl_selector.tpl
index 013f3f296..88df7481a 100755
--- a/view/tpl/acl_selector.tpl
+++ b/view/tpl/acl_selector.tpl
@@ -15,14 +15,11 @@
 					<div class="clear"></div>
 				</div>
 				{{/if}}
-
 				<div id="acl-wrapper">
 					<button id="acl-showall" class="btn btn-block btn-default"><i class="icon-globe"></i> {{$showall}}</button>
 					<input type="text" id="acl-search" placeholder="&#xf002;">
-
 					<div id="acl-list">
 						<div id="acl-list-content"></div>
-
 					</div>
 					<span id="acl-fields"></span>
 				</div>