Skip to content

Commit

Permalink
fix: login animation
Browse files Browse the repository at this point in the history
  • Loading branch information
makimenko committed Nov 29, 2023
1 parent 0639e84 commit 3b63e58
Show file tree
Hide file tree
Showing 5 changed files with 57 additions and 9 deletions.
8 changes: 4 additions & 4 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@
"@angular/platform-browser": "^16.2.0",
"@angular/platform-browser-dynamic": "^16.2.0",
"@angular/router": "^16.2.0",
"atft": "^1.5.2",
"atft": "^1.5.3",
"dagre": "^0.8.5",
"rxjs": "~7.8.0",
"three": "^0.158.0",
Expand Down
21 changes: 20 additions & 1 deletion src/app/app.module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,16 @@ import {MatCardModule} from "@angular/material/card";
import {MatButtonModule} from "@angular/material/button";
import {DynamicScriptLoaderService} from './general/service/dynamic-script-loader.service';
import {MatProgressBarModule} from '@angular/material/progress-bar';
import {
AtftCameraModule,
AtftControlModule,
AtftDataCenterActorModule, AtftEffectModule,
AtftLightModule,
AtftMeshModule,
AtftObjectModule,
AtftRendererModule,
UxActorModule
} from 'atft';


@NgModule({
Expand All @@ -37,7 +47,16 @@ import {MatProgressBarModule} from '@angular/material/progress-bar';
MatGridListModule,
MatCardModule,
MatButtonModule,
MatProgressBarModule
MatProgressBarModule,
AtftCameraModule,
AtftControlModule,
AtftDataCenterActorModule,
AtftLightModule,
AtftMeshModule,
AtftObjectModule,
AtftRendererModule,
AtftEffectModule,
UxActorModule
],
declarations: [
AppComponent,
Expand Down
22 changes: 20 additions & 2 deletions src/app/login-home/login-home.component.html
Original file line number Diff line number Diff line change
@@ -1,3 +1,20 @@
<atft-renderer-canvas>
<atft-orthographic-camera [positionX]=0 [positionY]=0 [positionZ]="100" [zoom]="4">
</atft-orthographic-camera>
<!-- Background -->
<atft-scene name="backgroundScene" background="0x000051">
<atft-effect-composer [renderToScreen]="false" [sceneBackgroundTarget]="mainScene">
<atft-blur></atft-blur>
</atft-effect-composer>
<atft-point-light [intensity]="0.4" [distance]="1000" [translateX]="-60" [translateY]="-60"
[translateZ]="50"></atft-point-light>
<atft-loader-actor materialColor="#F0F0F0"></atft-loader-actor>
</atft-scene>
<!-- Foreground -->
<atft-scene name="scene" #mainScene atft-stats-auto-show>
</atft-scene>
</atft-renderer-canvas>

<mat-grid-list cols="1" rowHeight="100%" class="grid">
<mat-grid-tile>
<mat-card class="card">
Expand All @@ -7,12 +24,13 @@
<mat-card-content>
<p>
The Vect application is serverless.
Diagrams are stored on your personal Google drive (several YAML files under /Vect folder).
Your diagrams will be stored on personal Google drive (several YAML files under /Vect folder).
Please login to your account and permit access to Google Drive to continue.
</p>
</mat-card-content>
<mat-card-actions align="end">
<button [disabled]="!authService.allowToSignIn" mat-button color="warn" mat-raised-button #btnFocus=matButton [autofocus]="btnFocus.focus()" (click)="handleAuthClick()">Google Login</button>
<button [disabled]="!authService.allowToSignIn" mat-raised-button #btnFocus=matButton
[autofocus]="btnFocus.focus()" (click)="handleAuthClick()">Google Login</button>
</mat-card-actions>
</mat-card>
</mat-grid-tile>
Expand Down
13 changes: 12 additions & 1 deletion src/app/login-home/login-home.component.scss
Original file line number Diff line number Diff line change
Expand Up @@ -3,9 +3,20 @@

.card {
max-width: 400px;
background: mat.get-color-from-palette($vect-primary, A400, 0.5);
background: mat.get-color-from-palette($vect-primary, A400, 0.3);
}

.grid {
background: mat.get-color-from-palette($vect-primary, A200, 0.5);
}

mat-card-title {
font-weight: bold;
}

atft-renderer-canvas {
position: absolute;
width: 100%;
height: 100%;
z-index: 0;
}

0 comments on commit 3b63e58

Please sign in to comment.