From 3189cf87821e26816a601aba4fc7dac592731536 Mon Sep 17 00:00:00 2001
From: Gabriel Fiocchi <gabriel.fiocchi@crealogix.com>
Date: Mon, 3 Jan 2022 20:50:10 -0300
Subject: [PATCH] Add POC sidemenu

---
 source/ios/App/App/capacitor.config.json | 10 +++++++++-
 source/ios/App/App/config.xml            |  4 ++++
 source/ios/App/Podfile                   |  5 +++++
 source/src/app/app-routing.module.ts     | 10 ++++++++++
 source/src/app/app.component.html        | 16 +++++++++++++++-
 source/src/app/app.component.scss        |  8 ++++++++
 source/src/app/app.component.ts          |  4 ++++
 source/src/app/menu/menu.page.html       |  2 +-
 source/src/app/menu/menu.page.ts         |  6 ++++++
 9 files changed, 62 insertions(+), 3 deletions(-)

diff --git a/source/ios/App/App/capacitor.config.json b/source/ios/App/App/capacitor.config.json
index cf202da..611349d 100644
--- a/source/ios/App/App/capacitor.config.json
+++ b/source/ios/App/App/capacitor.config.json
@@ -2,5 +2,13 @@
 	"appId": "com.gueopic.gueopic",
 	"appName": "Gueopic",
 	"webDir": "www",
-	"bundledWebRuntime": false
+	"bundledWebRuntime": false,
+	"plugins": {
+		"SplashScreen": {
+			"launchAutoHide": false,
+			"showSpinner": true,
+			"androidSpinnerStyle": "small",
+			"iosSpinnerStyle": "small"
+		}
+	}
 }
diff --git a/source/ios/App/App/config.xml b/source/ios/App/App/config.xml
index 1b1b0e0..fc8cfe0 100644
--- a/source/ios/App/App/config.xml
+++ b/source/ios/App/App/config.xml
@@ -2,5 +2,9 @@
 <widget version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
   <access origin="*" />
   
+  <feature name="SQLitePlugin">
+    <param name="ios-package" value="SQLitePlugin"/>
+  </feature>
+
   
 </widget>
\ No newline at end of file
diff --git a/source/ios/App/Podfile b/source/ios/App/Podfile
index c3a4afe..b32249e 100644
--- a/source/ios/App/Podfile
+++ b/source/ios/App/Podfile
@@ -10,9 +10,14 @@ def capacitor_pods
   pod 'Capacitor', :path => '../../node_modules/@capacitor/ios'
   pod 'CapacitorCordova', :path => '../../node_modules/@capacitor/ios'
   pod 'CapacitorApp', :path => '../../node_modules/@capacitor/app'
+  pod 'CapacitorCamera', :path => '../../node_modules/@capacitor/camera'
+  pod 'CapacitorFilesystem', :path => '../../node_modules/@capacitor/filesystem'
   pod 'CapacitorHaptics', :path => '../../node_modules/@capacitor/haptics'
   pod 'CapacitorKeyboard', :path => '../../node_modules/@capacitor/keyboard'
+  pod 'CapacitorSplashScreen', :path => '../../node_modules/@capacitor/splash-screen'
   pod 'CapacitorStatusBar', :path => '../../node_modules/@capacitor/status-bar'
+  pod 'CapacitorVoiceRecorder', :path => '../../node_modules/capacitor-voice-recorder'
+  pod 'CordovaPlugins', :path => '../capacitor-cordova-ios-plugins'
 end
 
 target 'App' do
diff --git a/source/src/app/app-routing.module.ts b/source/src/app/app-routing.module.ts
index 14f1112..835bba9 100644
--- a/source/src/app/app-routing.module.ts
+++ b/source/src/app/app-routing.module.ts
@@ -25,6 +25,16 @@ const routes: Routes = [
         (m) => m.PlaygroundPageModule,
       ),
   },
+  // Sidebar outlet
+  {
+    path: '',
+    loadChildren: () =>
+      import('./menu/menu.module').then((m) => m.MenuPageModule),
+    outlet: 'sidebar',
+    data: {
+      isSidebar: true,
+    },
+  },
 ];
 
 @NgModule({
diff --git a/source/src/app/app.component.html b/source/src/app/app.component.html
index 13b9677..3ec5735 100644
--- a/source/src/app/app.component.html
+++ b/source/src/app/app.component.html
@@ -1,3 +1,17 @@
 <ion-app>
-  <ion-router-outlet></ion-router-outlet>
+  <ion-split-pane contentId="main-content" when="md">
+    <ion-menu
+      contentId="main-content"
+      menuId="detail-evaluation"
+      type="overlay"
+      side="start"
+      swipe-gesture="false"
+      [disabled]="isMobile"
+    >
+      <ion-content>
+        <router-outlet name="sidebar"></router-outlet>
+      </ion-content>
+    </ion-menu>
+    <ion-router-outlet id="main-content"></ion-router-outlet>
+  </ion-split-pane>
 </ion-app>
diff --git a/source/src/app/app.component.scss b/source/src/app/app.component.scss
index e69de29..448b4aa 100644
--- a/source/src/app/app.component.scss
+++ b/source/src/app/app.component.scss
@@ -0,0 +1,8 @@
+ion-menu {
+  --side-min-width: 50%;
+  --side-max-width: 50%;
+}
+ion-router-outlet.split-pane-side {
+  --side-min-width: 50%;
+  --side-max-width: 50%;
+}
diff --git a/source/src/app/app.component.ts b/source/src/app/app.component.ts
index 0fb8291..38b18f4 100644
--- a/source/src/app/app.component.ts
+++ b/source/src/app/app.component.ts
@@ -25,6 +25,10 @@ export class AppComponent implements OnInit {
     private router: Router,
   ) {}
 
+  get isMobile() {
+    return window.innerWidth < 768;
+  }
+
   ngOnInit() {
     this.platform.ready().then((res) => {
       console.debug('Platform initialized:', res);
diff --git a/source/src/app/menu/menu.page.html b/source/src/app/menu/menu.page.html
index 2dd0408..21b03cf 100644
--- a/source/src/app/menu/menu.page.html
+++ b/source/src/app/menu/menu.page.html
@@ -1,6 +1,6 @@
 <ion-header>
   <ion-toolbar>
-    <ion-buttons slot="start">
+    <ion-buttons *ngIf="!routeData?.isSidebar" slot="start">
       <ion-button [routerLink]="['/home']" routerDirection="back">
         {{ 'common.actions.back' | translate }}
       </ion-button>
diff --git a/source/src/app/menu/menu.page.ts b/source/src/app/menu/menu.page.ts
index 64692f8..144fe00 100644
--- a/source/src/app/menu/menu.page.ts
+++ b/source/src/app/menu/menu.page.ts
@@ -4,6 +4,7 @@ import {
   OnDestroy,
   OnInit,
 } from '@angular/core';
+import { ActivatedRoute, Router } from '@angular/router';
 import { ModalController } from '@ionic/angular';
 import { ItemWithFilesModel } from '../../core/models/item-with-files.model';
 import { VerbWithFilesModel } from '../../core/models/verb-with-files.model';
@@ -31,9 +32,14 @@ export class MenuPage implements OnInit, OnDestroy {
     public modalController: ModalController,
     private audioService: AudioService,
     public appTranslateService: AppTranslateService,
+    private route: ActivatedRoute,
   ) {}
 
+  get routeData() {
+    return this.route.snapshot.data;
+  }
   ngOnInit() {
+    console.log('tset', this.route.snapshot.data);
     this.itemsStateService.loadAll();
     this.verbsStateService.loadAll();
     this.settingsStateService.loadAll(true);