Merge pull request #22 from fga-eps-mds/47-assistir-stream

47 assistir stream

package.json

@@ -24,6 +24,7 @@
     "@angular/platform-browser-dynamic": "^15.2.0",
     "@angular/router": "^15.2.0",
     "angular-oauth2-oidc": "^15.0.1",
+    "hls.js": "^1.4.12",
     "jwt-decode": "^3.1.2",
     "postcss-cli": "^10.1.0",
     "postcss-import": "^15.1.0",

src/app/app-routing.module.ts

@@ -4,6 +4,7 @@ import { LoginComponent } from './pages/login/login.component';
 import { RegisterComponent } from './pages/register/register.component';
 import { LoginSocialComponent } from './pages/login-social/login-social.component';
 import { VideoComponent } from './pages/video/video.component';
+import { StreamViewComponent } from './pages/stream-view/stream-view.component';
 import { VideoViewerComponent } from './pages/video-viewer/video-viewer.component';
 import { ActiveAccountComponent } from './pages/active-account/active-account.component';
 import { ProfileComponent } from './pages/profile/profile.component';
@@ -21,6 +22,15 @@ import { GridComponent } from './pages/grid/grid.component';
 import { WithTokenGuard } from './guard/with-token.guard';
 
 const routes: Routes = [
+  { path: 'login', component: LoginComponent },
+  { path: 'register', component: RegisterComponent },
+  { path: 'loginsocial', component: LoginSocialComponent },
+  { path: 'stream', component: StreamViewComponent },
+  { path: 'videos', component: VideoComponent },
+  { path: 'video/:idVideo', component: VideoViewerComponent },
+  { path: 'activeAccount', component: ActiveAccountComponent },
+  { path: 'sendCodeResetPassword', component: CheckCodeRestPasswordComponent },
+  { path: 'changePassword', component: ResetPasswordComponent },
   { path: '', component: VideoComponent, canActivate: [AuthGuard], }, // Default route - Showd be stream component
   { path: 'login', component: LoginComponent, canActivate: [WithTokenGuard], },
   { path: 'register', component: RegisterComponent, canActivate: [WithTokenGuard], },

src/app/app.module.ts

@@ -29,6 +29,7 @@ import { CheckCodeRestPasswordComponent } from './pages/check-code-rest-password
 import { AuthGuard } from './guard/auth.guard';
 import { AuthService } from './services/auth.service';
 import { EditUserComponent } from './pages/edit-user/edit-user.component';
+import { StreamViewComponent } from './pages/stream-view/stream-view.component';
 import { UpdateRoleComponent } from './pages/update-role/update-role.component';
 import {MatPaginatorModule} from '@angular/material/paginator';
 import { MenuModule } from 'primeng/menu';
@@ -57,6 +58,7 @@ import { ProgressSpinnerModule } from 'primeng/progressspinner';
     BrowserAnimationsModule,
     MatPaginatorModule
   ],
+
   declarations: [
     AppComponent,
     LoginComponent,
@@ -70,13 +72,15 @@ import { ProgressSpinnerModule } from 'primeng/progressspinner';
     ResetPasswordComponent,
     CheckCodeRestPasswordComponent,
     EditUserComponent,
+    StreamViewComponent,
     UpdateRoleComponent,
     SuggestAgendaComponent,
     ParticipateComponent,
     GridComponent,
     GridDaysComponent,
     VideoCommentComponent
   ],
+
   providers: [
     { provide: 'authGuard', useClass: AuthGuard },
     AuthService,

src/app/pages/stream-view/stream-view.component.css

@@ -0,0 +1,15 @@
+.stream-iframe {
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+  }
+
+  .stream-iframe-container {
+    position: relative;
+    width: 100%;
+    padding-top: 56.25%; 
+  }

src/app/pages/stream-view/stream-view.component.html

@@ -0,0 +1,10 @@
+<div class="max-w-full justify-center max-h-full flex">
+  <div class="max-w-6xl h-2/3 max-h-full stream-iframe-container">
+    <iframe
+      title="Agora na TV"
+      class="stream-iframe"
+      src="https://eduplay.rnp.br/portal/tv/embed/168269"
+      allowfullscreen
+    ></iframe>
+  </div>
+</div>

src/app/pages/stream-view/stream-view.component.spec.ts

@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { StreamViewComponent } from './stream-view.component';
+
+describe('StreamViewComponent', () => {
+  let component: StreamViewComponent;
+  let fixture: ComponentFixture<StreamViewComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ StreamViewComponent ]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(StreamViewComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/pages/stream-view/stream-view.component.ts

@@ -0,0 +1,9 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'app-stream-view',
+  templateUrl: './stream-view.component.html',
+  styleUrls: ['./stream-view.component.css']
+})
+export class StreamViewComponent {
+}

src/index.html

@@ -1,4 +1,4 @@
-<!doctype html>
+<!DOCTYPE html>
 <html lang="en">
 <head>
   <meta charset="utf-8">