Message if fan cam not loaded + Social sharing news from home page

src/app/ar-fan-cam/ar-fan-cam.page.html

@@ -2,6 +2,8 @@
     
     <button class="back-button" (click)="back()"> <ion-icon name="close-outline"></ion-icon> </button>
 
+    <h5 *ngIf="!camLoaded"> Loading Camera... </h5>
+
     <div class="container">
         <canvas id="source-canvas" #sourceCanvasElement width="{{ width }}" height="{{ height }}"></canvas>
     </div>

src/app/ar-fan-cam/ar-fan-cam.page.ts

@@ -21,6 +21,8 @@ export class ArFanCamPage implements OnInit {
     width: number;
     height: number;
 
+    camLoaded: boolean = false;
+
     tempImg = '';
 
     glassesFramesMeshLoaded: boolean = false;
@@ -34,6 +36,7 @@ export class ArFanCamPage implements OnInit {
 
     back() {
         JEELIZFACEFILTER.destroy();
+        this.camLoaded = false;
         this.modalController.dismiss();
     }
 
@@ -200,6 +203,7 @@ export class ArFanCamPage implements OnInit {
                 }
             
                 console.log('INFO: JEELIZFACEFILTER IS READY');
+                this.camLoaded = true;
                 this.init_threeScene(spec);
             },
         

src/app/home/home.page.html

@@ -35,7 +35,7 @@
     
                 <section class="action-buttons">
                     <section class="shortcuts">
-                        <button>
+                        <button (click)="share(news.short_title, image_url + news.image_path + news.image_file_name)">
                             <ion-icon name="share-social-outline"></ion-icon>
                         </button>
                     </section>
@@ -69,7 +69,7 @@
     
                 <section class="action-buttons">
                     <section class="shortcuts">
-                        <button>
+                        <button (click)="share(news.short_title ? news.short_title : news.asset_title, image_url + news.image_path + news.image_file_name)">
                             <ion-icon name="share-social-outline"></ion-icon>
                         </button>
                     </section>                
@@ -88,7 +88,7 @@
                 <div class="image-holder">
                     <figure>
                         <img [src]="image_url + news.image_path + news.image_file_name">
-                    </figure>                    
+                    </figure>
                 </div>
     
                 <section class="content">
@@ -100,7 +100,7 @@
     
                 <section class="action-buttons">
                     <section class="shortcuts">
-                        <button>
+                        <button (click)="share(news.short_title ? news.short_title : news.asset_title, image_url + news.image_path + news.image_file_name)">
                             <ion-icon name="share-social-outline"></ion-icon>
                         </button>
                     </section>                

src/app/home/home.page.ts

@@ -5,7 +5,7 @@ import { NewsService, IMAGE_BASE_URL } from '../services/news.service';
 import { ToastService } from '../services/toast.service';
 import { DomSanitizer } from '@angular/platform-browser';
 import { Uptime } from '@ionic-native/uptime/ngx';
-
+import { SocialSharing } from '@ionic-native/social-sharing/ngx';
 
 @Component({
     selector: 'app-home',
@@ -41,13 +41,18 @@ export class HomePage implements OnInit {
         private newsService: NewsService,
         private toastService: ToastService,
         private dom: DomSanitizer,
-        private uptime: Uptime
+        private uptime: Uptime,
+        private socialSharing: SocialSharing
     ) { }
 
     transformYourHtml(htmlTextWithStyle) {
         return this.dom.bypassSecurityTrustHtml(htmlTextWithStyle += '<style type="text/css">p{ margin: 0px; }</style>');
     }
 
+    share(message: string, image?: string, url?: string) {
+        this.socialSharing.share(message, '', image ? image : '', url? url : '');
+    }
+
     ngOnInit() {
 
         this.uptime.getUptime(true)