@ofidj/generator-fidj 1.0.0

package/generators/app/templates/app2021/src/app/app.component.spec.ts

@@ -0,0 +1,50 @@
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { TestBed, async } from '@angular/core/testing';
+
+import { Platform } from '@ionic/angular';
+import { SplashScreen } from '@ionic-native/splash-screen/ngx';
+import { StatusBar } from '@ionic-native/status-bar/ngx';
+
+import { AppComponent } from './app.component';
+
+describe('AppComponent', () => {
+
+  let statusBarSpy;
+  let splashScreenSpy;
+  let platformReadySpy;
+  let platformSpy;
+
+  beforeEach(async(() => {
+    statusBarSpy = jasmine.createSpyObj('StatusBar', ['styleDefault']);
+    splashScreenSpy = jasmine.createSpyObj('SplashScreen', ['hide']);
+    platformReadySpy = Promise.resolve();
+    platformSpy = jasmine.createSpyObj('Platform', { ready: platformReadySpy });
+
+    TestBed.configureTestingModule({
+      declarations: [AppComponent],
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
+      providers: [
+        { provide: StatusBar, useValue: statusBarSpy },
+        { provide: SplashScreen, useValue: splashScreenSpy },
+        { provide: Platform, useValue: platformSpy },
+      ],
+    }).compileComponents();
+  }));
+
+  it('should create the app', () => {
+    const fixture = TestBed.createComponent(AppComponent);
+    const app = fixture.debugElement.componentInstance;
+    expect(app).toBeTruthy();
+  });
+
+  it('should initialize the app', async () => {
+    TestBed.createComponent(AppComponent);
+    expect(platformSpy.ready).toHaveBeenCalled();
+    await platformReadySpy;
+    expect(statusBarSpy.styleDefault).toHaveBeenCalled();
+    expect(splashScreenSpy.hide).toHaveBeenCalled();
+  });
+
+  // TODO: add more tests!
+
+});

package/generators/app/templates/app2021/src/app/app.component.ts

@@ -0,0 +1,28 @@
+import {Component} from '@angular/core';
+import {Platform} from '@ionic/angular';
+import {SplashScreen} from '@ionic-native/splash-screen/ngx';
+import {StatusBar} from '@ionic-native/status-bar/ngx';
+import {FidjService} from 'fidj';
+
+@Component({
+  selector: 'app-root',
+  templateUrl: 'app.component.html',
+  styleUrls: ['app.component.scss']
+})
+export class AppComponent {
+  constructor(
+    private platform: Platform,
+    private splashScreen: SplashScreen,
+    private statusBar: StatusBar,
+    private fidjService: FidjService
+  ) {
+    this.initializeApp();
+  }
+
+  async initializeApp() {
+    await this.platform.ready();
+    await this.fidjService.init('<%= appId %>' <%= appOptions %>);
+    this.statusBar.styleDefault();
+    this.splashScreen.hide();
+  }
+}

package/generators/app/templates/app2021/src/app/app.module.ts

@@ -0,0 +1,24 @@
+import { NgModule } from '@angular/core';
+import { BrowserModule } from '@angular/platform-browser';
+import { RouteReuseStrategy } from '@angular/router';
+
+import { IonicModule, IonicRouteStrategy } from '@ionic/angular';
+import { SplashScreen } from '@ionic-native/splash-screen/ngx';
+import { StatusBar } from '@ionic-native/status-bar/ngx';
+
+import { AppRoutingModule } from './app-routing.module';
+import { AppComponent } from './app.component';
+import {FidjModule} from "fidj";
+
+@NgModule({
+  declarations: [AppComponent],
+  entryComponents: [],
+  imports: [BrowserModule, IonicModule.forRoot(), AppRoutingModule, FidjModule],
+  providers: [
+    StatusBar,
+    SplashScreen,
+    { provide: RouteReuseStrategy, useClass: IonicRouteStrategy }
+  ],
+  bootstrap: [AppComponent]
+})
+export class AppModule {}

package/generators/app/templates/app2021/src/app/content/content-routing.module.ts

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

package/generators/app/templates/app2021/src/app/content/content.module.ts

@@ -0,0 +1,20 @@
+import { IonicModule } from '@ionic/angular';
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+import { ContentPage } from './content.page';
+import { ExploreContainerComponentModule } from '../explore-container/explore-container.module';
+
+import { ContentPageRoutingModule } from './content-routing.module';
+
+@NgModule({
+  imports: [
+    IonicModule,
+    CommonModule,
+    FormsModule,
+    ExploreContainerComponentModule,
+    ContentPageRoutingModule
+  ],
+  declarations: [ContentPage]
+})
+export class ContentPageModule {}

package/generators/app/templates/app2021/src/app/content/content.page.html

@@ -0,0 +1,31 @@
+<ion-header [translucent]="true">
+  <ion-toolbar>
+    <ion-title>
+      <img src="assets/icon/favicon.png" height="15em"> Home
+    </ion-title>
+  </ion-toolbar>
+</ion-header>
+
+<ion-content [fullscreen]="true">
+  <!-- Default Refresher -->
+  <ion-refresher slot="fixed" (ionRefresh)="refresh($event)">
+    <ion-refresher-content></ion-refresher-content>
+  </ion-refresher>
+
+  <ion-header collapse="condense">
+    <ion-toolbar>
+      <ion-title size="large">Home</ion-title>
+    </ion-toolbar>
+  </ion-header>
+
+  <ion-grid>
+    <ion-row>
+      <ion-col size-md="8" offset-md="2" size-sm="12">
+
+        <app-explore-container content="<%= appContent %>"></app-explore-container>
+
+      </ion-col>
+    </ion-row>
+  </ion-grid>
+
+</ion-content>

package/generators/app/templates/app2021/src/app/content/content.page.ts

@@ -0,0 +1,26 @@
+import {Component} from '@angular/core';
+import {Router} from '@angular/router';
+import {EndpointInterface, FidjService} from 'fidj';
+
+@Component({
+    selector: 'app-content',
+    templateUrl: 'content.page.html',
+    styleUrls: ['content.page.scss']
+})
+export class ContentPage {
+
+    constructor(
+        private router: Router,
+        private fidjService: FidjService) {
+
+        this.refresh(null);
+    }
+
+    async refresh(event) {
+
+        if (event) {
+            event.target.complete();
+        }
+    }
+
+}

package/generators/app/templates/app2021/src/app/explore-container/explore-container.component.html

@@ -0,0 +1,4 @@
+<div id="container">
+  <strong>{{ name }}</strong>
+  <div [innerHtml]="content"></div>
+</div>

package/generators/app/templates/app2021/src/app/explore-container/explore-container.component.scss

@@ -0,0 +1,4 @@
+#container {
+  text-align: center;
+  padding-top:100px;
+}

package/generators/app/templates/app2021/src/app/explore-container/explore-container.component.spec.ts

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

package/generators/app/templates/app2021/src/app/explore-container/explore-container.component.ts

@@ -0,0 +1,16 @@
+import { Component, OnInit, Input } from '@angular/core';
+
+@Component({
+  selector: 'app-explore-container',
+  templateUrl: './explore-container.component.html',
+  styleUrls: ['./explore-container.component.scss'],
+})
+export class ExploreContainerComponent implements OnInit {
+  @Input() name: string;
+  @Input() content: string;
+
+  constructor() { }
+
+  ngOnInit() {}
+
+}

package/generators/app/templates/app2021/src/app/explore-container/explore-container.module.ts

@@ -0,0 +1,14 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+
+import { IonicModule } from '@ionic/angular';
+
+import { ExploreContainerComponent } from './explore-container.component';
+
+@NgModule({
+  imports: [ CommonModule, FormsModule, IonicModule],
+  declarations: [ExploreContainerComponent],
+  exports: [ExploreContainerComponent]
+})
+export class ExploreContainerComponentModule {}

package/generators/app/templates/app2021/src/app/my/my-routing.module.ts

@@ -0,0 +1,36 @@
+import { NgModule } from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+import { MyPage } from './my.page';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: MyPage,
+    children: [
+      {
+        path: 'content',
+        loadChildren: () => import('../content/content.module').then(m => m.ContentPageModule)
+      },
+      {
+        path: 'profile',
+        loadChildren: () => import('../profile/profile.module').then(m => m.ProfilePageModule)
+      },
+      {
+        path: '',
+        redirectTo: '/my/content',
+        pathMatch: 'full'
+      }
+    ]
+  },
+  {
+    path: '',
+    redirectTo: '/my/content',
+    pathMatch: 'full'
+  }
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule]
+})
+export class MyPageRoutingModule {}

package/generators/app/templates/app2021/src/app/my/my.module.ts

@@ -0,0 +1,19 @@
+import { IonicModule } from '@ionic/angular';
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+
+import { MyPageRoutingModule } from './my-routing.module';
+
+import { MyPage } from './my.page';
+
+@NgModule({
+  imports: [
+    IonicModule,
+    CommonModule,
+    FormsModule,
+    MyPageRoutingModule
+  ],
+  declarations: [MyPage]
+})
+export class MyPageModule {}

package/generators/app/templates/app2021/src/app/my/my.page.html

@@ -0,0 +1,15 @@
+<ion-tabs>
+  <ion-tab-bar slot="bottom">
+
+    <ion-tab-button tab="content">
+      <ion-icon name="leaf-outline"></ion-icon>
+      <ion-label>Content</ion-label>
+    </ion-tab-button>
+
+    <ion-tab-button tab="profile">
+      <ion-icon name="person-circle-outline"></ion-icon>
+      <ion-label>Profile</ion-label>
+    </ion-tab-button>
+
+  </ion-tab-bar>
+</ion-tabs>

package/generators/app/templates/app2021/src/app/my/my.page.scss

@@ -0,0 +1 @@
+

package/generators/app/templates/app2021/src/app/my/my.page.spec.ts

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

package/generators/app/templates/app2021/src/app/my/my.page.ts

@@ -0,0 +1,25 @@
+import { Component } from '@angular/core';
+import {Router} from '@angular/router';
+import { FidjService } from 'fidj';
+
+@Component({
+  selector: 'app-my',
+  templateUrl: 'my.page.html',
+  styleUrls: ['my.page.scss']
+})
+export class MyPage {
+
+  constructor(
+      private router: Router,
+      private fidjService: FidjService) {}
+
+
+  ngOnInit() {
+    if (this.fidjService.isLoggedIn()) {
+    } else {
+      console.log('not logged in');
+      return this.router.navigateByUrl('/signin');
+    }
+  }
+
+}

package/generators/app/templates/app2021/src/app/profile/profile-routing.module.ts

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

package/generators/app/templates/app2021/src/app/profile/profile.module.ts

@@ -0,0 +1,20 @@
+import { IonicModule } from '@ionic/angular';
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+import { ProfilePage } from './profile.page';
+import { ExploreContainerComponentModule } from '../explore-container/explore-container.module';
+
+import { ProfilePageRoutingModule } from './profile-routing.module';
+
+@NgModule({
+  imports: [
+    IonicModule,
+    CommonModule,
+    FormsModule,
+    ExploreContainerComponentModule,
+    ProfilePageRoutingModule
+  ],
+  declarations: [ProfilePage]
+})
+export class ProfilePageModule {}

package/generators/app/templates/app2021/src/app/profile/profile.page.html

@@ -0,0 +1,49 @@
+<ion-header [translucent]="true">
+    <ion-toolbar>
+        <ion-title>
+            <img src="assets/icon/favicon.png" height="15em"> My profile
+        </ion-title>
+    </ion-toolbar>
+</ion-header>
+
+<ion-content [fullscreen]="true">
+    <!-- Default Refresher -->
+    <ion-refresher slot="fixed" (ionRefresh)="refresh($event)">
+        <ion-refresher-content></ion-refresher-content>
+    </ion-refresher>
+
+    <ion-header collapse="condense">
+        <ion-toolbar>
+            <ion-title size="large">Profile</ion-title>
+        </ion-toolbar>
+    </ion-header>
+
+    <form #profileForm="ngForm">
+        <ion-grid>
+            <ion-row>
+                <ion-col size-md="8" offset-md="2" size-sm="12">
+                    <ion-row>
+                        <ion-col>
+                            <ion-item>
+                                <ion-label>User</ion-label>
+                                <ion-input id="profileUsername"
+                                           [(ngModel)]="profileUsername" name="profileUsername" disabled></ion-input>
+                            </ion-item>
+                            <ion-item>
+                                <pre><small>App is using <a href="https://fidj.ovh">Fidj service</a> that take care of GDPR concerns.</small></pre>
+                            </ion-item>
+                        </ion-col>
+                    </ion-row>
+
+                    <ion-row>
+                        <ion-col>
+                            <ion-button color="danger" expand="block" (click)="logout()">Logout</ion-button>
+                        </ion-col>
+                    </ion-row>
+
+                </ion-col>
+            </ion-row>
+        </ion-grid>
+    </form>
+
+</ion-content>

package/generators/app/templates/app2021/src/app/profile/profile.page.spec.ts

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

package/generators/app/templates/app2021/src/app/profile/profile.page.ts

@@ -0,0 +1,44 @@
+import {Component} from '@angular/core';
+import {Router} from '@angular/router';
+import {Base64, FidjService} from 'fidj';
+
+@Component({
+  selector: 'app-profile',
+  templateUrl: 'profile.page.html',
+  styleUrls: ['profile.page.scss']
+})
+export class ProfilePage {
+
+  public profileUsername: string;
+
+  constructor(
+    private router: Router,
+    private fidjService: FidjService) {
+    this.refresh(null);
+  }
+
+  async refresh(event) {
+    try {
+      const idToken = await this.fidjService.getIdToken();
+      const payload = idToken.split('.')[1];
+      const payloadInfo = JSON.parse(Base64.decode(payload));
+      console.log(typeof payloadInfo, payloadInfo.name);
+      this.profileUsername = payloadInfo.name;
+    } catch (error) {
+      console.warn(error);
+      if (error.code === 401 || error.code === 403) {
+        await this.logout();
+      }
+    }
+
+    if (event) {
+      event.target.complete();
+    }
+  }
+
+  async logout() {
+    await this.fidjService.logout();
+    await this.router.navigateByUrl('/');
+  }
+
+}

package/generators/app/templates/app2021/src/app/shared/const.ts

@@ -0,0 +1,3 @@
+
+
+

package/generators/app/templates/app2021/src/app/signin/signin-routing.module.ts

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

package/generators/app/templates/app2021/src/app/signin/signin.module.ts

@@ -0,0 +1,18 @@
+import {IonicModule} from '@ionic/angular';
+import {NgModule} from '@angular/core';
+import {CommonModule} from '@angular/common';
+import {FormsModule} from '@angular/forms';
+import {SigninPage} from './signin.page';
+import {SigninPageRoutingModule} from "./signin-routing.module";
+
+@NgModule({
+    imports: [
+        IonicModule,
+        CommonModule,
+        FormsModule,
+        SigninPageRoutingModule
+    ],
+    declarations: [SigninPage]
+})
+export class SigninPageModule {
+}

package/generators/app/templates/app2021/src/app/signin/signin.page.html

@@ -0,0 +1,53 @@
+<ion-content>
+    <ion-grid>
+        <ion-row>
+            <ion-col size-md="8" offset-md="2" size-sm="12">
+                <ion-card>
+                    <ion-card-header>
+                      <h1><%= appName %> </h1>
+                      <p><%= appWelcome %></p>
+                    </ion-card-header>
+                    <ion-card-content>
+                        <form #heroForm="ngForm" (ngSubmit)="login(userLoginEmail, userLoginPassword)"
+                              (keyup.enter)="login(userLoginEmail, userLoginPassword)">
+                            <ion-item [hidden]="!loginError">
+                                <ion-label color="danger">{{loginError}}</ion-label>
+                            </ion-item>
+                            <ion-item>
+                                <ion-input
+                                        id="userLoginEmail"
+                                        type="text" placeholder="valid.email@required.com" required
+                                        [(ngModel)]="userLoginEmail" name="userLoginEmail"
+                                        pattern=".{1,}@[_a-z0-9A-Z]+(\.[a-z0-9A-Z]+)+"
+                                ></ion-input>
+                            </ion-item>
+                            <ion-item>
+                                <ion-input
+                                        id="userLoginPassword"
+                                        type="password" placeholder="password"
+                                        [(ngModel)]="userLoginPassword" name="userLoginPassword"
+                                        required></ion-input>
+                            </ion-item>
+
+              <div style="padding-top:20px">
+                <ion-button color="medium"
+                            id="userLoginButton"
+                            (click)="login(userLoginEmail, userLoginPassword)"
+                            [disabled]="!userLoginEmail || !heroForm.form.valid || !userLoginPassword">
+                  Login
+                </ion-button>
+                <ion-button color="medium" fill="clear"
+                            (click)="loginAsDemo()">
+                  Enter anonymously
+                </ion-button>
+              </div>
+            </form>
+          </ion-card-content>
+        </ion-card>
+      </ion-col>
+    </ion-row>
+  </ion-grid>
+
+  <span style="float:right;font-size:10px;">version: <%= appVersion %></span>
+
+</ion-content>