From 4b604f107c24f8fb01d4d0fb8761f4a1c3f6975d Mon Sep 17 00:00:00 2001 From: pabloFuente Date: Mon, 16 Oct 2017 17:16:14 +0200 Subject: [PATCH] openvidu-testapp: Angular Material breaking change fix (md to mat) --- openvidu-testapp/src/app/app.component.css | 2 +- openvidu-testapp/src/app/app.component.html | 24 ++--- .../src/app/app.material.module.ts | 68 +++++++------- .../extension-dialog.component.ts | 18 ++-- .../openvidu-instance.component.css | 20 ++-- .../openvidu-instance.component.html | 94 +++++++++---------- .../openvidu-instance.component.ts | 4 +- .../test-apirest/test-apirest.component.html | 28 +++--- .../test-sessions/test-sessions.component.css | 2 +- .../test-sessions.component.html | 18 ++-- openvidu-testapp/src/styles.css | 1 + 11 files changed, 140 insertions(+), 139 deletions(-) diff --git a/openvidu-testapp/src/app/app.component.css b/openvidu-testapp/src/app/app.component.css index d2e551e4..509e139c 100644 --- a/openvidu-testapp/src/app/app.component.css +++ b/openvidu-testapp/src/app/app.component.css @@ -12,7 +12,7 @@ main { font-weight: inherit; } -md-toolbar a { +mat-toolbar a { padding: 0 10px 0 10px; font-weight: bold; } \ No newline at end of file diff --git a/openvidu-testapp/src/app/app.component.html b/openvidu-testapp/src/app/app.component.html index 1810eff3..9933d7b3 100644 --- a/openvidu-testapp/src/app/app.component.html +++ b/openvidu-testapp/src/app/app.component.html @@ -1,18 +1,18 @@ - - + + - +
- - - - - - + + + + + +
- + diff --git a/openvidu-testapp/src/app/app.material.module.ts b/openvidu-testapp/src/app/app.material.module.ts index 6b5a89ea..e77e5927 100644 --- a/openvidu-testapp/src/app/app.material.module.ts +++ b/openvidu-testapp/src/app/app.material.module.ts @@ -1,45 +1,45 @@ import { NgModule } from '@angular/core'; import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { - MdButtonModule, - MdIconModule, - MdCheckboxModule, - MdCardModule, - MdInputModule, - MdProgressSpinnerModule, - MdTooltipModule, - MdDialogModule, - MdToolbarModule, - MdTabsModule, - MdTableModule, - MdListModule, - MdRadioModule, - MdSelectModule, - MdChipsModule, - MdExpansionModule, - MdSlideToggleModule + MatButtonModule, + MatIconModule, + MatCheckboxModule, + MatCardModule, + MatInputModule, + MatProgressSpinnerModule, + MatTooltipModule, + MatDialogModule, + MatToolbarModule, + MatTabsModule, + MatTableModule, + MatListModule, + MatRadioModule, + MatSelectModule, + MatChipsModule, + MatExpansionModule, + MatSlideToggleModule } from '@angular/material'; @NgModule({ exports: [ BrowserAnimationsModule, - MdButtonModule, - MdIconModule, - MdCheckboxModule, - MdCardModule, - MdInputModule, - MdProgressSpinnerModule, - MdTooltipModule, - MdDialogModule, - MdToolbarModule, - MdTabsModule, - MdTableModule, - MdListModule, - MdRadioModule, - MdSelectModule, - MdChipsModule, - MdExpansionModule, - MdSlideToggleModule + MatButtonModule, + MatIconModule, + MatCheckboxModule, + MatCardModule, + MatInputModule, + MatProgressSpinnerModule, + MatTooltipModule, + MatDialogModule, + MatToolbarModule, + MatTabsModule, + MatTableModule, + MatListModule, + MatRadioModule, + MatSelectModule, + MatChipsModule, + MatExpansionModule, + MatSlideToggleModule ], }) export class AppMaterialModule { } diff --git a/openvidu-testapp/src/app/components/openvidu-instance/extension-dialog.component.ts b/openvidu-testapp/src/app/components/openvidu-instance/extension-dialog.component.ts index 34e53c44..2bc7f625 100644 --- a/openvidu-testapp/src/app/components/openvidu-instance/extension-dialog.component.ts +++ b/openvidu-testapp/src/app/components/openvidu-instance/extension-dialog.component.ts @@ -1,19 +1,19 @@ import { Component, Inject } from '@angular/core'; -import { MdDialog, MD_DIALOG_DATA, MdDialogConfig } from '@angular/material'; +import { MatDialog, MAT_DIALOG_DATA, MatDialogConfig } from '@angular/material'; @Component({ selector: 'app-extension-dialog', template: `
-

Install extension

- An extension is needed to share your screen! - - - - +

Install extension

+ An extension is needed to share your screen! + + + +
- +
` }) @@ -21,7 +21,7 @@ export class ExtensionDialogComponent { installView = true; - constructor(public dialog: MdDialog, @Inject(MD_DIALOG_DATA) public data: any) { } + constructor(public dialog: MatDialog, @Inject(MAT_DIALOG_DATA) public data: any) { } goToExtension() { window.open(this.data.url, '_blank'); diff --git a/openvidu-testapp/src/app/components/openvidu-instance/openvidu-instance.component.css b/openvidu-testapp/src/app/components/openvidu-instance/openvidu-instance.component.css index 794c48f9..e0fa59f7 100644 --- a/openvidu-testapp/src/app/components/openvidu-instance/openvidu-instance.component.css +++ b/openvidu-testapp/src/app/components/openvidu-instance/openvidu-instance.component.css @@ -5,19 +5,19 @@ border-radius: 2px; } -md-card { +mat-card { background-color: #ffffff; margin: 0; padding: 20px; padding-top: 10px; } -md-card.session-card { +mat-card.session-card { padding: 15px; margin-left: 10px; } -.session-form md-form-field { +.session-form mat-form-field { width: 130px; } @@ -25,7 +25,7 @@ md-card.session-card { width: fit-content; } -.join-card md-card-content { +.join-card mat-card-content { margin-bottom: 0; } @@ -52,7 +52,7 @@ md-card.session-card { margin-right: 8px; } -md-radio-button { +mat-radio-button { margin-bottom: 8px; } @@ -98,7 +98,7 @@ md-radio-button { overflow-x: hidden; } -md-chip { +mat-chip { line-height: 6px; font-size: 9.5px; padding: 6px 9px !important; @@ -123,20 +123,20 @@ md-chip { background-color: #797979; } -md-expansion-panel { +mat-expansion-panel { background: #e0e0e0 !important; margin-right: 0 !important; } -md-expansion-panel-header { +mat-expansion-panel-header { font-size: 10.5px !important; padding: 0 7px 0 9px !important; } -.secure-div md-checkbox { +.secure-div mat-checkbox { padding-right: 10px; } -.secure-div md-form-field { +.secure-div mat-form-field { max-width: 80px; } \ No newline at end of file diff --git a/openvidu-testapp/src/app/components/openvidu-instance/openvidu-instance.component.html b/openvidu-testapp/src/app/components/openvidu-instance/openvidu-instance.component.html index a7d0ca75..fb82fb2c 100644 --- a/openvidu-testapp/src/app/components/openvidu-instance/openvidu-instance.component.html +++ b/openvidu-testapp/src/app/components/openvidu-instance/openvidu-instance.component.html @@ -1,37 +1,37 @@
- + - +
- SECURE - - - - - - + SECURE + + + + + +
- - - + + + - - - + + +
- - - Publish + + + Publish
@@ -40,59 +40,59 @@

Send

- Audio - Video + Audio + Video

Enter active

- Audio - Video + Audio + Video
- +
- Video + Video
- Screen + Screen
- - +
to remote
- + - +
- +
{{sessionName}}
@@ -101,22 +101,22 @@
- - - + + {{event.name}} - +
{{event.content}}
- - + +
- +
diff --git a/openvidu-testapp/src/app/components/openvidu-instance/openvidu-instance.component.ts b/openvidu-testapp/src/app/components/openvidu-instance/openvidu-instance.component.ts index 470c152d..07446c87 100644 --- a/openvidu-testapp/src/app/components/openvidu-instance/openvidu-instance.component.ts +++ b/openvidu-testapp/src/app/components/openvidu-instance/openvidu-instance.component.ts @@ -3,7 +3,7 @@ import { OnInit, OnDestroy, OnChanges } from '@angular/core'; import { OpenVidu, Session, Subscriber, Publisher, Stream } from 'openvidu-browser'; -import { MdDialog, MdDialogRef } from '@angular/material'; +import { MatDialog } from '@angular/material'; import { ExtensionDialogComponent } from './extension-dialog.component'; import { TestFeedService } from '../../services/test-feed.service'; @@ -88,7 +88,7 @@ export class OpenviduInstanceComponent implements OnInit, OnChanges, OnDestroy { openviduError: any; constructor(private changeDetector: ChangeDetectorRef, - private extensionDialog: MdDialog, + private extensionDialog: MatDialog, private testFeedService: TestFeedService) { this.generateSessionInfo(); } diff --git a/openvidu-testapp/src/app/components/test-apirest/test-apirest.component.html b/openvidu-testapp/src/app/components/test-apirest/test-apirest.component.html index 0b8f2bde..247b3592 100644 --- a/openvidu-testapp/src/app/components/test-apirest/test-apirest.component.html +++ b/openvidu-testapp/src/app/components/test-apirest/test-apirest.component.html @@ -1,13 +1,13 @@
- +
- +
- +
@@ -21,15 +21,15 @@ - {{sid[0]}} + {{sid[0]}} - +

{{token}}

- + - + @@ -42,16 +42,16 @@ - - + + {{ role }} - - + + - - - + + + diff --git a/openvidu-testapp/src/app/components/test-sessions/test-sessions.component.css b/openvidu-testapp/src/app/components/test-sessions/test-sessions.component.css index 25a4cb8f..fda797b8 100644 --- a/openvidu-testapp/src/app/components/test-sessions/test-sessions.component.css +++ b/openvidu-testapp/src/app/components/test-sessions/test-sessions.component.css @@ -20,7 +20,7 @@ app-openvidu-instance { display: inline-block; } -md-form-field { +mat-form-field { width: 30px; } diff --git a/openvidu-testapp/src/app/components/test-sessions/test-sessions.component.html b/openvidu-testapp/src/app/components/test-sessions/test-sessions.component.html index d69bf3e8..ae75d433 100644 --- a/openvidu-testapp/src/app/components/test-sessions/test-sessions.component.html +++ b/openvidu-testapp/src/app/components/test-sessions/test-sessions.component.html @@ -1,17 +1,17 @@
- - - + + +
- Auto join - - - - - + Auto join + + + + +
diff --git a/openvidu-testapp/src/styles.css b/openvidu-testapp/src/styles.css index ced5816b..f389ac30 100644 --- a/openvidu-testapp/src/styles.css +++ b/openvidu-testapp/src/styles.css @@ -62,6 +62,7 @@ button { .mat-expansion-panel-body { font-size: 9.5px !important; padding: 0 9px 0px !important; + margin: 0 2px 0 2px !important; background-color: white; border: 3px solid #e0e0e0; line-height: 13px;