Show group creation and member count in group detail view (#323)

Fixes #255

src/controller_model/group.ts

@@ -80,6 +80,10 @@ export class GroupControllerModel implements threema.ControllerModel {
         }
     }
 
+    public getMaxMemberSize(): number {
+        return this.webClientService.getMaxGroupMemberSize();
+    }
+
     public setOnRemoved(callback: any): void {
         this.onRemovedCallback = callback;
     }
@@ -157,7 +161,6 @@ export class GroupControllerModel implements threema.ControllerModel {
     }
 
     private reallyDelete(): void {
-
         if (!this.group.access.canDelete) {
             this.$log.error('can not delete group');
             return;

src/partials/messenger.receiver/group.html

@@ -9,30 +9,35 @@
 
 			<md-card-title>
 				<md-card-title-text>
-					<span class="md-headline" translate>messenger.GROUP_CREATOR</span>
+					<span class="md-headline">
+						<span translate>messenger.GROUP_CREATOR</span>
+						<span ng-if="ctrl.receiver.createdAt"> ({{ctrl.receiver.createdAt}})</span>
+					</span>
 				</md-card-title-text>
 			</md-card-title>
 			<md-card-content>
 				<eee-contact-badge
 						eee-identity="ctrl.receiver.administrator"
 						eee-linked="ctrl.receiver.administrator != ctrl.me.id"
-                        ng-class="{'linked': ctrl.receiver.administrator != ctrl.me.id}">
-                </eee-contact-badge>
+						ng-class="{'linked': ctrl.receiver.administrator != ctrl.me.id}">
+				</eee-contact-badge>
 			</md-card-content>
-
 			<md-card-title>
 				<md-card-title-text>
-					<span class="md-headline" translate>messenger.GROUP_MEMBERS</span>
+					<span class="md-headline">
+						<span translate>messenger.GROUP_MEMBERS</span>
+						<span> ({{ctrl.receiver.members.length}}/{{ctrl.controllerModel.getMaxMemberSize()}})</span>
+					</span>
 				</md-card-title-text>
 			</md-card-title>
 			<md-card-content>
 				<ul class="member-list">
-					<li ng-repeat="memberIdentity in ctrl.receiver.members" ng-if="memberIdentity != ctrl.receiver.administrator">
+					<li ng-repeat="memberIdentity in ctrl.receiver.members">
 						<eee-contact-badge
 								eee-identity="memberIdentity"
 								eee-linked="memberIdentity != ctrl.me.id"
-                                ng-class="{'linked': memberIdentity != ctrl.me.id}">
-                        </eee-contact-badge>
+								ng-class="{'linked': memberIdentity != ctrl.me.id}">
+						</eee-contact-badge>
 					</li>
 				</ul>
 

src/services/webclient.ts

@@ -177,7 +177,7 @@ export class WebClientService {
     private typingInstance: threema.Container.Typing;
     private drafts: threema.Container.Drafts;
     private pcHelper: PeerConnectionHelper = null;
-    private deviceInfo: string = null;
+    private clientInfo: threema.ClientInfo;
     private trustedKeyStore: TrustedKeyStoreService;
     public version = null;
 
@@ -2002,24 +2002,23 @@ export class WebClientService {
             this.$log.warn('Invalid client info, argument field missing');
             return;
         }
-        this.deviceInfo = args.device;
-        this.$log.debug('Client device:', this.deviceInfo);
+
+        this.clientInfo = args as threema.ClientInfo;
+        this.$log.debug('Client device:', this.clientInfo.device);
 
         // Store push token
-        if (args.myPushToken) {
-            this.pushToken = args.myPushToken;
-            this.pushService.init(args.myPushToken);
+        if (this.clientInfo.myPushToken) {
+            this.pushToken = this.clientInfo.myPushToken;
+            this.pushService.init(this.pushToken);
         }
 
         // Set own identity
-        let myAccount = args.myAccount;
-
         this.myIdentity = {
-            identity: myAccount.identity,
-            publicKey: myAccount.publicKey,
-            publicNickname: myAccount.publicNickname,
-            fingerprint: this.fingerPrintService.generate(myAccount.publicKey),
-        };
+            identity: this.clientInfo.myAccount.identity,
+            publicKey: this.clientInfo.myAccount.publicKey,
+            publicNickname: this.clientInfo.myAccount.publicNickname,
+            fingerprint: this.fingerPrintService.generate(this.clientInfo.myAccount.publicKey),
+        } as threema.Identity;
 
         this.registerInitializationStep('client info');
     }
@@ -2048,6 +2047,14 @@ export class WebClientService {
         return WebClientService.MAX_TEXT_LENGTH;
     }
 
+    /**
+     * Returns the max group member size
+     * @returns {number}
+     */
+    public getMaxGroupMemberSize(): number {
+        return this.clientInfo && this.clientInfo.maxGroupSize ? this.clientInfo.maxGroupSize : 50;
+    }
+
     /**
      * Called when a new message arrives.
      */

src/threema.d.ts

@@ -245,6 +245,7 @@ declare namespace threema {
         members: string[];
         administrator: string;
         access: GroupReceiverAccess;
+        createdAt?: string;
     }
 
     /**
@@ -462,6 +463,21 @@ declare namespace threema {
         isCharging: boolean;
     }
 
+    interface MyAccount {
+        identity: string;
+        publicKey: ArrayBuffer;
+        publicNickname: string;
+        fingerprint?: string;
+    }
+
+    interface ClientInfo {
+        device: string;
+        isWork: boolean;
+        myPushToken?: string;
+        maxGroupSize?: number;
+        myAccount: MyAccount;
+    }
+
     namespace Container {
         interface ReceiverData {
             me: MeReceiver;