Merge pull request #96 from supportingami/dev-mike

Sharing and ExitOnBack

maths-club-app/android/build.gradle

@@ -8,7 +8,7 @@ buildscript {
         jcenter()
     }
     dependencies {
-        classpath 'com.android.tools.build:gradle:4.0.1'
+        classpath 'com.android.tools.build:gradle:4.1.0'
         classpath 'com.google.gms:google-services:4.3.3'
         classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version"
 

maths-club-app/android/gradle/wrapper/gradle-wrapper.properties

@@ -1,6 +1,6 @@
-#Wed Aug 05 09:58:33 EAT 2020
+#Sun Nov 01 13:50:01 EAT 2020
 distributionBase=GRADLE_USER_HOME
 distributionPath=wrapper/dists
 zipStoreBase=GRADLE_USER_HOME
 zipStorePath=wrapper/dists
-distributionUrl=https\://services.gradle.org/distributions/gradle-6.1.1-all.zip
+distributionUrl=https\://services.gradle.org/distributions/gradle-6.5-bin.zip

maths-club-app/src/app/app.component.ts

@@ -1,6 +1,6 @@
-import { Component, NgZone, ViewEncapsulation } from "@angular/core";
+import { Component, NgZone, ViewEncapsulation} from "@angular/core";
 import { AppService } from "./services/app.service";
-import { Router, RouterOutlet } from "@angular/router";
+import {  Router, RouterOutlet} from "@angular/router";
 import { slideTransition } from "./animations";
 
 import { environment } from "src/environments/environment";
@@ -10,7 +10,6 @@ import { Plugins, Capacitor, StatusBarStyle } from "@capacitor/core";
 import { AnalyticsService } from "./services/analytics.service";
 import { SeoService } from "./services/seo.service";
 const { StatusBar, App } = Plugins;
-
 @Component({
   selector: "app-root",
   templateUrl: "./app.component.html",
@@ -26,7 +25,7 @@ export class AppComponent {
     analytics: AnalyticsService,
     seo: SeoService,
     private zone: NgZone,
-    private router: Router
+    private router: Router,
   ) {
     // this.notifications.init()
     analytics.init();
@@ -37,7 +36,7 @@ export class AppComponent {
     } else {
       // SEO only relevant whe not native
       seo.init();
-    }
+    }    
   }
   getRouteAnimationState(outlet: RouterOutlet) {
     return (

maths-club-app/src/app/components/problem-detail/problem-detail.component.html

@@ -16,6 +16,9 @@
       <button mat-stroked-button [routerLink]="['notes']" aria-label="facilitator-notes">
         See Facilitator Notes
       </button>
+      <button *ngIf="isNative" mat-icon-button color="warn" (click)="share()">
+        <mat-icon>share</mat-icon>
+      </button>
     </div>
   </div>
 </div>

maths-club-app/src/app/components/problem-detail/problem-detail.component.ts

@@ -1,6 +1,8 @@
-import { Component, ViewEncapsulation, ChangeDetectorRef } from "@angular/core";
+import { Component, ViewEncapsulation, ChangeDetectorRef, OnInit } from "@angular/core";
 import { ProblemService } from "src/app/services/problem.service";
 import { fadeInOut } from "src/app/animations";
+import { Capacitor, Plugins } from '@capacitor/core';
+const { Share } = Plugins;
 
 @Component({
   selector: "app-problem-detail",
@@ -9,17 +11,42 @@ import { fadeInOut } from "src/app/animations";
   encapsulation: ViewEncapsulation.None,
   animations: [fadeInOut],
 })
-export class ProblemDetailComponent {
+export class ProblemDetailComponent implements OnInit {
   markdownReady = false;
+  isNative = Capacitor.isNative;
+
   constructor(
     public problemService: ProblemService,
     private cdr: ChangeDetectorRef
   ) {}
 
+  ngOnInit(){
+    console.log("on init", this.problemService);
+  }
+
   onMarkdownReady() {
     this.markdownReady = true;
+    //console.log("on md ready", this.problemService.activeProblem$.value);
+
     // as markdown can be ready before page fully initialised complete manually trigger
     // change detection to avoid change detection errors
     this.cdr.detectChanges();
   }
+
+
+
+  async share(){
+    if(Capacitor.isNative){
+      await Share.share({
+        title: this.problemService.activeProblem$.value.title,
+        text: "Here's a problem for you to try! If you get stuck there are also notes for facilitators included",
+        url: `https://mathsclub.samicharity.co.uk/en/${this.problemService.activeProblem$.value.slug}`,
+        dialogTitle: 'Share'
+      }).then((success)=>{
+        console.log("shared")
+      }).catch((err)=>{
+        console.log("an error occureed")
+      })
+    }   
+  }
 }

maths-club-app/src/app/components/problems-list/problems-list.component.ts

@@ -1,15 +1,17 @@
-import { Component } from "@angular/core";
+import { Component, OnDestroy, OnInit } from "@angular/core";
 import { ProblemService } from "../../services/problem.service";
 import { fadeChildren } from "src/app/animations";
 import * as Sentry from "@sentry/angular";
+import { Plugins, Capacitor } from "@capacitor/core";
+const { StatusBar, App } = Plugins;
 
 @Component({
   selector: "app-problems",
   templateUrl: "./problems-list.component.html",
   styleUrls: ["./problems-list.component.scss"],
   animations: [fadeChildren],
 })
-export class ProblemsListComponent {
+export class ProblemsListComponent implements OnInit, OnDestroy{
   constructor(public problemService: ProblemService) {}
 
   /**
@@ -18,4 +20,16 @@ export class ProblemsListComponent {
   testClick(identifier: string) {
     Sentry.captureMessage(`[${identifier}] UI Test Interaction Recorded`);
   }
+
+  ngOnInit(){
+    if(Capacitor.isNative){
+      App.addListener('backButton', App.exitApp);
+    }
+  }
+
+  ngOnDestroy(){
+    if(Capacitor.isNative){
+      App.removeAllListeners();
+    }
+  }
 }