Merge branch 'master' of https://bitbucket.org/equilibriumito/gabinete-digital into master

src/app/pages/events/attachments/attachments-routing.module.ts

@@ -7,6 +7,10 @@ const routes: Routes = [
   {
     path: '',
     component: AttachmentsPage
+  },
+  {
+    path: 'viewer',
+    loadChildren: () => import('./viewer/viewer.module').then( m => m.ViewerPageModule)
   }
 ];
 

src/app/pages/events/attachments/attachments.page.ts

@@ -3,6 +3,8 @@ import { AttachmentsService } from 'src/app/services/attachments.service';
 import { Attachment } from 'src/app/models/attachment.model';
 import { ActivatedRoute, Router } from '@angular/router';
 import { InAppBrowser } from '@ionic-native/in-app-browser/ngx';
+import { AlertController, ModalController } from '@ionic/angular';
+import { ViewerPage } from 'src/app/pages/events/attachments/viewer/viewer.page'
 
 @Component({
   selector: 'app-attachments',
@@ -14,7 +16,7 @@ export class AttachmentsPage implements OnInit {
   loadedEventAttachments: Attachment[];
   pageId: string;
 
-  constructor(private attachamentsService: AttachmentsService, private activatedRoute: ActivatedRoute, private iab: InAppBrowser, private route: Router) { }
+  constructor(private attachamentsService: AttachmentsService, private activatedRoute: ActivatedRoute, private iab: InAppBrowser, private route: Router, private modalCtrl: ModalController) { }
 
   ngOnInit() {
         /* Emit new data when something changes */
@@ -32,14 +34,28 @@ export class AttachmentsPage implements OnInit {
     this.attachamentsService.getEventAttachments(eventid).subscribe(attachments => {
       this.loadedEventAttachments = attachments;
       this.pageId = eventid;
-      console.log(this.pageId);
     });
   }
 
-  viewDocument(documenturl:string)
+  async viewDocument(documenturl:string)
   {
-    const browser = this.iab.create(documenturl);
+    //var ref = cordova.InAppBrowser.open(documenturl, '_blank', 'location=yes');
+
+    const browser = this.iab.create(documenturl, "_self")
     browser.show();
+
+    // const modal = await this.modalCtrl.create({
+    //   component: ViewerPage,
+    //    componentProps: {
+    //     externalLink: documenturl
+    //   },
+    //   cssClass: 'viewer',
+    //   backdropDismiss: false
+    // });
+
+    // await modal.present();
+
+    // modal.onDidDismiss();
   }
 
   navigateBack(){

src/app/pages/events/attachments/viewer/viewer-routing.module.ts

@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+
+import { ViewerPage } from './viewer.page';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: ViewerPage
+  }
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
+})
+export class ViewerPageRoutingModule {}

src/app/pages/events/attachments/viewer/viewer.module.ts

@@ -0,0 +1,20 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+
+import { IonicModule } from '@ionic/angular';
+
+import { ViewerPageRoutingModule } from './viewer-routing.module';
+
+import { ViewerPage } from './viewer.page';
+
+@NgModule({
+  imports: [
+    CommonModule,
+    FormsModule,
+    IonicModule,
+    ViewerPageRoutingModule
+  ],
+  declarations: [ViewerPage]
+})
+export class ViewerPageModule {}

src/app/pages/events/attachments/viewer/viewer.page.html

@@ -0,0 +1,22 @@
+<ion-header>
+  <ion-toolbar>
+    <ion-title>viewer</ion-title>
+  </ion-toolbar>
+</ion-header>
+
+<ion-content>
+  <iframe class="e2e-iframe-untrusted-src" *ngIf="externalLink" [src]="externalLinkSanitized" width="100%" height="100%" frameborder="0" 
+    sandbox="allow-scripts 
+    allow-pointer-lock 
+    allow-same-origin 
+    allow-popups 
+    allow-forms"></iframe>
+    <!-- <iframe class="e2e-iframe-untrusted-src" *ngIf="externalLink" [src]="externalLinkSanitized" width="100%" height="100%" frameborder="0" 
+    sandbox="allow-presentation 
+    allow-scripts 
+    allow-top-navigation 
+    allow-pointer-lock 
+    allow-same-origin 
+    allow-popups 
+    allow-forms"></iframe> -->
+</ion-content>

src/app/pages/events/attachments/viewer/viewer.page.spec.ts

@@ -0,0 +1,24 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { IonicModule } from '@ionic/angular';
+
+import { ViewerPage } from './viewer.page';
+
+describe('ViewerPage', () => {
+  let component: ViewerPage;
+  let fixture: ComponentFixture<ViewerPage>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ ViewerPage ],
+      imports: [IonicModule.forRoot()]
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(ViewerPage);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  }));
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/pages/events/attachments/viewer/viewer.page.ts

@@ -0,0 +1,21 @@
+import { Component, OnInit } from '@angular/core';
+import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser';
+
+@Component({
+  selector: 'app-viewer',
+  templateUrl: './viewer.page.html',
+  styleUrls: ['./viewer.page.scss'],
+})
+export class ViewerPage implements OnInit {
+
+  externalLink: string;
+  externalLinkSanitized: SafeResourceUrl;
+
+  constructor(public sanitizer: DomSanitizer) { }
+
+  ngOnInit() {
+    this.externalLinkSanitized = this.sanitizer.bypassSecurityTrustResourceUrl(this.externalLink);
+    console.log(this.externalLinkSanitized);
+  }
+
+}

src/app/pages/events/event-detail/event-detail.page.html

@@ -4,14 +4,19 @@
       <ion-back-button defaultHref="/home/events"></ion-back-button>
     </ion-buttons>
     <ion-title>Visualizar Evento</ion-title>
+    <ion-buttons slot="end">
+      <button (click)="deleteConfirm()" class="ion-icon-delete">
+        <ion-icon name="trash"></ion-icon>
+      </button>
+    </ion-buttons>
   </ion-toolbar>
 </ion-header>
 
 <ion-content padding>
+  <div *ngIf="loadedEvent">
   <ion-item-group>
     <ion-item>
       <ion-label position="stacked">Assunto</ion-label>
-      <!-- <ion-input value='{{event.Subject}}'></ion-input> -->
       <ion-input [(ngModel)]="loadedEvent.Subject"></ion-input>
     </ion-item>
     <ion-item>
@@ -22,11 +27,6 @@
       <ion-label position="stacked">Localização</ion-label>
       <ion-input [(ngModel)]='loadedEvent.Location'></ion-input>
     </ion-item>
-    <!-- <ion-item-sliding>
-      <ion-item (click)="openAttendees()">
-        <ion-label position="stacked">Pessoas</ion-label>
-      </ion-item>
-    </ion-item-sliding> -->
     <ion-item>
       <ion-label position="stacked">Calendário</ion-label>
       <ion-input [(ngModel)]='loadedEvent.CalendarName'></ion-input>
@@ -51,12 +51,6 @@
           displayFormat="D MMM YYYY H:mm"
           monthShortNames="Jan, Fev, Mar, Abr, Mai, Jun, Jul, Aug, Sep, Out, Nov, Dez"></ion-datetime>
     </ion-item>
-    <!-- <ion-item-sliding>
-      <ion-item
-        [routerLink]="['/home/attachments', loadedEvent.EventId]">
-        <ion-label position="stacked">Anexos</ion-label>
-      </ion-item>
-    </ion-item-sliding> -->
     <div class="div-card-button">
       <ion-card (click)="openAttendees()">
         <ion-card-header>
@@ -84,10 +78,75 @@
       </ion-card>
     </div>
   </ion-item-group>
+</div>
+   <!-- Skeleton screen -->
+<div *ngIf="!loadedEvent">
+  <div class="ion-padding custom-skeleton">
+    <ion-skeleton-text animated style="width: 60%"></ion-skeleton-text>
+    <ion-skeleton-text animated></ion-skeleton-text>
+    <ion-skeleton-text animated style="width: 88%"></ion-skeleton-text>
+    <ion-skeleton-text animated style="width: 70%"></ion-skeleton-text>
+    <ion-skeleton-text animated style="width: 60%"></ion-skeleton-text>
+  </div>
+
+  <ion-list>
+    <ion-list-header>
+      <ion-label>
+        <ion-skeleton-text animated style="width: 20%"></ion-skeleton-text>
+      </ion-label>
+    </ion-list-header>
+    <ion-item>
+      <ion-avatar slot="start">
+        <ion-skeleton-text animated></ion-skeleton-text>
+      </ion-avatar>
+      <ion-label>
+        <h3>
+          <ion-skeleton-text animated style="width: 50%"></ion-skeleton-text>
+        </h3>
+        <p>
+          <ion-skeleton-text animated style="width: 80%"></ion-skeleton-text>
+        </p>
+        <p>
+          <ion-skeleton-text animated style="width: 60%"></ion-skeleton-text>
+        </p>
+      </ion-label>
+    </ion-item>
+    <ion-item>
+      <ion-thumbnail slot="start">
+        <ion-skeleton-text animated></ion-skeleton-text>
+      </ion-thumbnail>
+      <ion-label>
+        <h3>
+          <ion-skeleton-text animated style="width: 50%"></ion-skeleton-text>
+        </h3>
+        <p>
+          <ion-skeleton-text animated style="width: 80%"></ion-skeleton-text>
+        </p>
+        <p>
+          <ion-skeleton-text animated style="width: 60%"></ion-skeleton-text>
+        </p>
+      </ion-label>
+    </ion-item>
+    <ion-item>
+      <ion-skeleton-text animated style="width: 27px; height: 27px" slot="start"></ion-skeleton-text>
+      <ion-label>
+        <h3>
+          <ion-skeleton-text animated style="width: 50%"></ion-skeleton-text>
+        </h3>
+        <p>
+          <ion-skeleton-text animated style="width: 80%"></ion-skeleton-text>
+        </p>
+        <p>
+          <ion-skeleton-text animated style="width: 60%"></ion-skeleton-text>
+        </p>
+      </ion-label>
+    </ion-item>
+  </ion-list>
+</div>
 </ion-content>
 <ion-footer class="ion-no-border">
   <div class="event-detail-buttons">
-    <ion-button shape="round" fill="outline" class="ion-button-left" (click)="deleteConfirm()">Apagar</ion-button>
+    <!-- <ion-button shape="round" fill="outline" class="ion-button-left" (click)="deleteConfirm()">Apagar</ion-button> -->
     <ion-button shape="round" class="ion-button-right" (click)="Save()">Gravar</ion-button>
   </div>
 </ion-footer>

src/app/pages/events/event-detail/event-detail.page.scss

@@ -73,4 +73,10 @@ ion-card{
 }
 .ion-button-right{
   float: right;
+}
+.ion-icon-delete{
+  font-size: 22px;
+  color: red;
+  background-color: white;
+  padding-right: 5px;
 }