jitsi shortened urls

src/app/pages/jitsi/jitsi.component.html

@@ -21,10 +21,14 @@
           </mat-icon>
         </a>
 
-        <a *ngIf="!open(jitsiRoom, false)" mat-button disabled matTooltip="{{'jitsi.rooms.notStarted' | i18n}}"
+        <a *ngIf="!open(jitsiRoom, false)" mat-button disabled matTooltip="{{'jitsi.rooms.notStarted' | i18n}}">
-          matTooltipPosition="above">
           {{ jitsiRoom.room }}
         </a>
+
+        <a *ngIf="!jitsiRoom.code && shortenedUrlQuota" mat-icon-button (click)="createShortenedUrl(jitsiRoom)" inline
+          matTooltip="{{'urlshortener.create' | i18n}}">
+          <mat-icon>add_link</mat-icon>
+        </a>
       </td>
     </ng-container>
 
@@ -49,15 +53,14 @@
       <th mat-header-cell *matHeaderCellDef mat-sort-header="moderationUrl"> {{'jitsi.rooms.moderationUrl' | i18n}}
       </th>
       <td mat-cell *matCellDef="let jitsiRoom">
-        <a *ngIf="open(jitsiRoom, true)" mat-button color="primary" class="url" href="{{ jitsiRoom.moderationUrl}}"
+        <a *ngIf="open(jitsiRoom, true)" mat-button color="primary" href="{{ jitsiRoom.moderationUrl}}" target="_blank">
-          target="_blank">
+          <span class="url">{{ jitsiRoom.moderationUrl }}</span>
-          {{ jitsiRoom.moderationUrl }}
           <mat-icon style="font-size: 1em;">open_in_new</mat-icon>
         </a>
 
-        <a *ngIf="!open(jitsiRoom, true)" mat-button color="primary" class="url" disabled
+        <a *ngIf="!open(jitsiRoom, true)" mat-button color="primary" disabled
           matTooltip="{{'jitsi.rooms.notStarted' | i18n}}" matTooltipPosition="above">
-          {{ jitsiRoom.moderationUrl }}
+          <span class="url">{{ jitsiRoom.moderationUrl }}</span>
         </a>
       </td>
     </ng-container>
@@ -74,8 +77,8 @@
     <tr mat-header-row *matHeaderRowDef="jitsiRoomsColumns"></tr>
     <tr mat-row *matRowDef="let myRowData; columns: jitsiRoomsColumns"></tr>
   </table>
-  <mat-paginator [pageSizeOptions]="pageSizeOptions" [length]="jitsiRooms.totalElements"
+  <mat-paginator [pageSizeOptions]="pageSizeOptions" [length]="jitsiRooms.totalElements" [pageSize]="jitsiRooms.size"
-    [pageSize]="jitsiRooms.size" (page)="updatePages($event)" showFirstLastButtons></mat-paginator>
+    (page)="updatePages($event)" showFirstLastButtons></mat-paginator>
 
 </div>
 

src/app/pages/jitsi/jitsi.component.scss

@@ -11,6 +11,7 @@ mat-form-field {
 
 .mat-cell .mat-button {
   padding-left: 0px;
+  padding-right: 0px;
 }
 
 .align-right{
@@ -20,7 +21,7 @@ mat-form-field {
 }
 
 .url  {
-  display: block;
+  display: inline-block;
   width: 200px;
   max-width: 200px;
   white-space: nowrap;

src/app/pages/jitsi/jitsi.component.ts

@@ -8,9 +8,9 @@ import {PageEvent} from '@angular/material/paginator';
 
 import {QuotaService} from '../../services/quota.service';
 import {JitsiService} from '../../services/jitsi.service';
+import {UrlShortenerService} from '../../services/urlshortener.service';
 import {ConfirmDialog} from '../../ui/confirm/confirm.component';
 import {I18nService} from './../../services/i18n.service';
-import {ThrowStmt} from '@angular/compiler';
 
 @Component({
   selector: 'app-account-jitsi',
@@ -26,6 +26,7 @@ export class JitsiComponent implements OnInit {
   jitsiRoom: any = {};
   success: boolean;
   working: boolean;
+  shortenedUrlQuota: number = 0;
   datetimeformat: String;
   page: any = {page: 0, size: 10, sort: "id", desc: false};
   pageSizeOptions: number[] = [5, 10, 25, 50];
@@ -36,6 +37,7 @@ export class JitsiComponent implements OnInit {
     private quotaService: QuotaService,
     private formBuilder: FormBuilder,
     private jitsiService: JitsiService,
+    private snackBar: MatSnackBar,
     private i18n: I18nService,
     public dialog: MatDialog) {}
 
@@ -81,10 +83,13 @@ export class JitsiComponent implements OnInit {
 
   update() {
     this.jitsiRoomsQuota = 0;
+    this.shortenedUrlQuota = 0;
     this.quotaService.quotas().subscribe((data: any) => {
       for(let quota of data) {
         if(quota.name == "jitsi") {
           this.jitsiRoomsQuota = quota.value;
+        } else if(quota.name == "url_shortener") {
+          this.shortenedUrlQuota = quota.value;
         }
       }
     })
@@ -115,7 +120,6 @@ export class JitsiComponent implements OnInit {
     }, (error) => {})
   }
 
-
   confirmDelete(jitsiRoom) {
     const dialogRef = this.dialog.open(ConfirmDialog, {
       data: {
@@ -133,10 +137,6 @@ export class JitsiComponent implements OnInit {
     });
   }
 
-
-
-
-
   share(jitsiRoom) {
     const dialogRef = this.dialog.open(JitsiShareDialog, {
       data: jitsiRoom,
@@ -147,6 +147,14 @@ export class JitsiComponent implements OnInit {
   open(jitsiRoom: any, moderation: boolean) {
     return (moderation && jitsiRoom.moderationStarts != null || !jitsiRoom.starts || Date.parse(jitsiRoom.starts) < new Date().getTime()) && (!moderation || jitsiRoom.moderationStarts == null || Date.parse(jitsiRoom.moderationStarts) < new Date().getTime());
   }
+
+  createShortenedUrl(jitsiRoom: any) {
+    this.jitsiService.createShortUrl(jitsiRoom.id).subscribe((result: any) => {
+      this.update();
+    }, (error: any) => {
+      this.snackBar.open(this.i18n.get("urlshortener.noQuota", []), this.i18n.get("close", []));
+    });
+  }
 }
 
 @Component({

src/app/pages/urlshortener/urlshortener.component.html

@@ -36,8 +36,8 @@
     <ng-container matColumnDef="url">
       <th mat-header-cell *matHeaderCellDef mat-sort-header="url"> {{'urlshortener.url' | i18n}} </th>
       <td mat-cell *matCellDef="let shortenedUrl">
-        <a mat-button color="accent" href="{{ shortenedUrl.url }}" target="_blank">
+        <a mat-button color="primary"  href="{{ shortenedUrl.url }}" target="_blank">
-          {{ shortenedUrl.url }}
+          <span class="url">{{ shortenedUrl.url }}</span>
           <mat-icon style="font-size: 1em;">open_in_new
           </mat-icon>
         </a>

src/app/pages/urlshortener/urlshortener.component.scss

@@ -11,6 +11,7 @@ mat-form-field {
 
 .mat-cell .mat-button {
   padding-left: 0px;
+  padding-right: 0px;
 }
 
 .align-right{
@@ -20,7 +21,7 @@ mat-form-field {
 }
 
 .url  {
-  display: block;
+  display: inline-block;
   width: 200px;
   max-width: 200px;
   white-space: nowrap;

src/app/services/jitsi.service.ts

@@ -20,6 +20,10 @@ export class JitsiService {
         return this.http.post(environment.apiUrl + "/jitsi/rooms", jitsiRoom);
     }
 
+    createShortUrl(id) {
+        return this.http.patch(environment.apiUrl + "/jitsi/rooms/" + id, null);
+    }
+
     delete(id) {
         return this.http.delete(environment.apiUrl + "/jitsi/rooms/" + id);
     }

src/app/services/urlshortener.service.ts

@@ -11,6 +11,10 @@ export class UrlShortenerService {
     constructor(private http: HttpClient) {
     }
 
+    getModel(code: string): Promise<Object> {
+        return this.http.get(environment.apiUrl + "/url/shortener/model/" + code).toPromise();
+    }
+
     get(page: number, size: number, sort: string, desc: boolean, search: string) {
         const httpParams = new HttpParams().set("page", "" + page).set("size", "" + size).set("sort", sort).set("desc", "" + desc).set("search", search);
         return this.http.get(environment.apiUrl + "/url/shortener", {params: httpParams});