Merge with store

.dockerignore

@@ -0,0 +1 @@
+**/node_modules

Dockerfile

@@ -0,0 +1,25 @@
+FROM schmelczera/error-pages as build-error-pages
+RUN python build.py 401 403 404 502 50x
+
+
+FROM node:latest as build-webpage
+WORKDIR /home/node
+
+COPY frontend .
+
+RUN npm install
+RUN npm run build
+
+
+FROM nginx:alpine
+WORKDIR /var/www
+RUN rm -rf *
+
+COPY --from=build-error-pages /home/python/built errors
+COPY --from=build-webpage /home/node/dist/frontend .
+RUN find . -type f | xargs gzip -k9     &&\
+    chmod -R 555 .
+
+VOLUME ["/var/www/sockets"]
+
+COPY ingress/nginx-config /etc/nginx/

docker-compose.yml

@@ -0,0 +1,83 @@
+version: "3.8"
+
+services:
+  towers-ingress:
+    init: true
+    depends_on:
+      - store
+    image: schmelczera/towers-ingress
+    networks:
+      - network
+    deploy:
+      replicas: 1
+      resources:
+        limits:
+          cpus: "0.2"
+          memory: 32M
+        reservations:
+          cpus: "0.1"
+          memory: 16M
+      placement:
+        constraints:
+          - "node.hostname == node-2"
+      update_config:
+        parallelism: 1
+        failure_action: rollback
+        delay: 10s
+        monitor: 10s
+      restart_policy:
+        condition: on-failure
+        window: 30s
+    volumes:
+      - sockets:/var/www/sockets
+
+  towers-store:
+    init: true
+    image: schmelczera/towers-store
+    networks:
+      - network
+    deploy:
+      replicas: 1
+      resources:
+        limits:
+          cpus: "0.2"
+          memory: 64M
+        reservations:
+          cpus: "0.05"
+          memory: 32M
+      placement:
+        constraints:
+          - "node.hostname == node-2"
+      restart_policy:
+        condition: on-failure
+        window: 30s
+    volumes:
+      - sockets:/home/backend/sockets
+
+  towers-db:
+    init: true
+    image: postgres:12.1-alpine
+    networks:
+      - network
+    deploy:
+      replicas: 1
+      resources:
+        limits:
+          cpus: "0.2"
+          memory: 64M
+        reservations:
+          cpus: "0.05"
+          memory: 32M
+      restart_policy:
+        condition: on-failure
+        window: 30s
+    volumes:
+      - /shared/towers/db:/var/lib/postgresql/data
+
+networks:
+  network:
+    driver: overlay
+
+volumes:
+  sockets:
+    driver: local

frontend/.editorconfig

@@ -0,0 +1,13 @@
+# Editor configuration, see https://editorconfig.org
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+insert_final_newline = true
+trim_trailing_whitespace = true
+
+[*.md]
+max_line_length = off
+trim_trailing_whitespace = false

frontend/.gitignore

@@ -0,0 +1,48 @@
+# See http://help.github.com/ignore-files/ for more about ignoring files.
+
+# compiled output
+/dist
+/tmp
+/out-tsc
+# Only exists if Bazel was run
+/bazel-out
+
+# dependencies
+/node_modules
+
+# profiling files
+chrome-profiler-events.json
+speed-measure-plugin.json
+
+# IDEs and editors
+/.idea
+.project
+.classpath
+.c9/
+*.launch
+.settings/
+*.sublime-workspace
+
+# IDE - VSCode
+.vscode/*
+!.vscode/settings.json
+!.vscode/tasks.json
+!.vscode/launch.json
+!.vscode/extensions.json
+.history/*
+
+# misc
+/.sass-cache
+/connect.lock
+/coverage
+/libpeerconnection.log
+npm-debug.log
+yarn-error.log
+testem.log
+/typings
+
+# System Files
+.DS_Store
+Thumbs.db
+
+.firebase

frontend/.prettierrc

@@ -0,0 +1,8 @@
+{
+  "printWidth": 120,
+  "singleQuote": true,
+  "useTabs": false,
+  "tabWidth": 2,
+  "semi": true,
+  "bracketSpacing": true
+}

frontend/README.md

@@ -0,0 +1,27 @@
+# Frontend
+
+This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 7.3.8.
+
+## Development server
+
+Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
+
+## Code scaffolding
+
+Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`.
+
+## Build
+
+Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory. Use the `--prod` flag for a production build.
+
+## Running unit tests
+
+Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
+
+## Running end-to-end tests
+
+Run `ng e2e` to execute the end-to-end tests via [Protractor](http://www.protractortest.org/).
+
+## Further help
+
+To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md).

frontend/angular.json

@@ -0,0 +1,86 @@
+{
+  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+  "version": 1,
+  "newProjectRoot": "projects",
+  "projects": {
+    "frontend": {
+      "root": "",
+      "sourceRoot": "src",
+      "projectType": "application",
+      "prefix": "app",
+      "schematics": {
+        "@schematics/angular:component": {
+          "style": "scss"
+        }
+      },
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-angular:browser",
+          "options": {
+            "outputPath": "dist/frontend",
+            "index": "src/index.html",
+            "main": "src/main.ts",
+            "polyfills": "src/polyfills.ts",
+            "tsConfig": "src/tsconfig.app.json",
+            "assets": ["src/favicon.ico", "src/assets"],
+            "styles": ["src/styles.scss"],
+            "scripts": [],
+            "es5BrowserSupport": true
+          },
+          "configurations": {
+            "production": {
+              "fileReplacements": [
+                {
+                  "replace": "src/environments/environment.ts",
+                  "with": "src/environments/environment.prod.ts"
+                }
+              ],
+              "optimization": true,
+              "outputHashing": "all",
+              "sourceMap": false,
+              "extractCss": true,
+              "namedChunks": false,
+              "aot": true,
+              "extractLicenses": true,
+              "vendorChunk": false,
+              "buildOptimizer": true,
+              "budgets": [
+                {
+                  "type": "initial",
+                  "maximumWarning": "20mb",
+                  "maximumError": "50mb"
+                }
+              ]
+            }
+          }
+        },
+        "serve": {
+          "builder": "@angular-devkit/build-angular:dev-server",
+          "options": {
+            "browserTarget": "frontend:build"
+          },
+          "configurations": {
+            "production": {
+              "browserTarget": "frontend:build:production"
+            }
+
+          }
+        },
+        "extract-i18n": {
+          "builder": "@angular-devkit/build-angular:extract-i18n",
+          "options": {
+            "browserTarget": "frontend:build"
+          }
+        },
+        "lint": {
+          "builder": "@angular-devkit/build-angular:tslint",
+          "options": {
+            "tsConfig": ["src/tsconfig.app.json", "src/tsconfig.spec.json"],
+            "exclude": ["**/node_modules/**"]
+          }
+        }
+      }
+    }
+  },
+  "defaultProject": "frontend"
+}

frontend/firebase.json

@@ -0,0 +1,13 @@
+{
+  "hosting": {
+    "public": "dist/frontend",
+    "site": "towers-schmelczer-dev",
+    "ignore": ["firebase.json", "**/.*", "**/node_modules/**"],
+    "rewrites": [
+      {
+        "source": "**",
+        "destination": "/index.html"
+      }
+    ]
+  }
+}

frontend/package.json

@@ -0,0 +1,51 @@
+{
+  "name": "frontend",
+  "version": "0.0.0",
+  "scripts": {
+    "ng": "ng",
+    "start": "ng serve",
+    "build": "ng build",
+    "build:prod": "ng build --prod",
+    "format:fix": "pretty-quick --staged",
+    "precommit": "run-s format:fix lint",
+    "format:check": "prettier --config ./.prettierrc --list-different \"src/{app,environments,assets}/**/*{.ts,.js,.json,.css,.scss}\"",
+    "lint": "ng lint"
+  },
+  "private": true,
+  "dependencies": {
+    "@angular/animations": "^7.2.15",
+    "@angular/cdk": "^7.3.7",
+    "@angular/common": "~7.2.0",
+    "@angular/compiler": "~7.2.0",
+    "@angular/core": "~7.2.0",
+    "@angular/forms": "~7.2.0",
+    "@angular/material": "^7.3.7",
+    "@angular/platform-browser": "~7.2.0",
+    "@angular/platform-browser-dynamic": "~7.2.0",
+    "@angular/router": "~7.2.0",
+    "core-js": "^2.5.4",
+    "ng": "^0.0.0",
+    "rxjs": "~6.3.3",
+    "tslib": "^1.10.0",
+    "uuid": "^3.3.3",
+    "zone.js": "~0.8.26"
+  },
+  "devDependencies": {
+    "@angular-devkit/build-angular": "^0.13.10",
+    "@angular/cli": "~7.3.8",
+    "@angular/compiler-cli": "~7.2.0",
+    "@angular/language-service": "~7.2.0",
+    "@types/jasmine": "~2.8.8",
+    "@types/jasminewd2": "~2.0.3",
+    "@types/node": "~8.9.4",
+    "codelyzer": "~4.5.0",
+    "husky": "^3.0.4",
+    "npm-run-all": "^4.1.5",
+    "prettier": "^1.18.2",
+    "pretty-quick": "^1.11.1",
+    "sass": "^1.32.5",
+    "ts-node": "~7.0.0",
+    "tslint": "~5.11.0",
+    "typescript": "~3.2.2"
+  }
+}

frontend/src/app/app-routing.module.ts

@@ -0,0 +1,16 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+import { PagesComponent } from './components/pages/pages.component';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: PagesComponent
+  }
+];
+
+@NgModule({
+  imports: [RouterModule.forRoot(routes)],
+  exports: [RouterModule]
+})
+export class AppRoutingModule {}

frontend/src/app/app.component.html

@@ -0,0 +1,4 @@
+<main (click)="cancelService.cancelAll()">
+  <app-modal></app-modal>
+  <router-outlet></router-outlet>
+</main>

frontend/src/app/app.component.scss

@@ -0,0 +1,3 @@
+main {
+  height: 100%;
+}

frontend/src/app/app.component.ts

@@ -0,0 +1,24 @@
+import { ChangeDetectionStrategy, Component, DoCheck } from '@angular/core';
+import { CancelService } from './services/cancel.service';
+
+@Component({
+  selector: 'app-root',
+  templateUrl: './app.component.html',
+  styleUrls: ['./app.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush
+})
+export class AppComponent implements DoCheck {
+  title = 'life';
+
+  constructor(public cancelService: CancelService) {
+    window.addEventListener('keydown', (event: KeyboardEvent) => {
+      if (event.key === 'Escape') {
+        this.cancelService.cancelAll();
+      }
+    });
+  }
+
+  ngDoCheck() {
+    // console.log('app change detection');
+  }
+}

frontend/src/app/app.module.ts

@@ -0,0 +1,51 @@
+import { BrowserModule } from '@angular/platform-browser';
+import { NgModule } from '@angular/core';
+import { AppRoutingModule } from './app-routing.module';
+import { AppComponent } from './app.component';
+import { PageComponent } from './components/pages/page/page.component';
+import { TowerComponent } from './components/pages/page/tower/tower.component';
+import { DoubleSliderComponent } from './components/shared/double-slider/double-slider.component';
+import { PagesComponent } from './components/pages/pages.component';
+import { SelectAddComponent } from './components/shared/select-add/select-add.component';
+import { ModalComponent } from './components/modal/modal.component';
+import { FormsModule } from '@angular/forms';
+import { BlockComponent } from './components/pages/page/tower/block/block.component';
+import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+import { DragDropModule } from '@angular/cdk/drag-drop';
+import { SettingsComponent } from './components/modal/modals/settings/settings.component';
+import { RemoveTowerComponent } from './components/modal/modals/remove-tower/remove-tower.component';
+import { RemovePageComponent } from './components/modal/modals/remove-page/remove-page.component';
+import { GetStartedComponent } from './components/modal/modals/get-started/get-started.component';
+import { ToggleComponent } from './components/shared/toggle/toggle.component';
+import { TasksComponent } from './components/pages/page/tower/tasks/tasks.component';
+import { ColorPipe } from './pipes/color.pipe';
+import { BlocksComponent } from './components/modal/modals/blocks/blocks.component';
+import { FormatDatePipe } from './pipes/format-date.pipe';
+import { HttpClientModule } from '@angular/common/http';
+
+@NgModule({
+  declarations: [
+    AppComponent,
+    PageComponent,
+    BlockComponent,
+    TowerComponent,
+    DoubleSliderComponent,
+    PagesComponent,
+    SelectAddComponent,
+    ModalComponent,
+    BlockComponent,
+    SettingsComponent,
+    RemoveTowerComponent,
+    RemovePageComponent,
+    GetStartedComponent,
+    ToggleComponent,
+    TasksComponent,
+    ColorPipe,
+    BlocksComponent,
+    FormatDatePipe
+  ],
+  imports: [BrowserModule, AppRoutingModule, FormsModule, BrowserAnimationsModule, DragDropModule, HttpClientModule],
+  providers: [],
+  bootstrap: [AppComponent]
+})
+export class AppModule {}

frontend/src/app/components/modal/modal.component.html

@@ -0,0 +1,11 @@
+<section
+  (click)="modalService.cancel()"
+  class="{{ modalService.active ? 'active' : '' }}"
+  [ngSwitch]="modalService.active?.type"
+>
+  <app-blocks (save)="save = $event" (click)="$event.stopPropagation()" *ngSwitchCase="ModalType.blocks"></app-blocks>
+  <app-remove-tower (click)="$event.stopPropagation()" *ngSwitchCase="ModalType.removeTower"></app-remove-tower>
+  <app-settings (click)="$event.stopPropagation()" *ngSwitchCase="ModalType.settings"></app-settings>
+  <app-get-started (click)="$event.stopPropagation()" *ngSwitchCase="ModalType.getStarted"></app-get-started>
+  <app-remove-page (click)="$event.stopPropagation()" *ngSwitchCase="ModalType.removePage"></app-remove-page>
+</section>

frontend/src/app/components/modal/modal.component.scss

@@ -0,0 +1,29 @@
+@import '../../../styles';
+
+section {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+
+  z-index: 10000;
+
+  @include center-child();
+
+  padding: var(--large-padding);
+
+  box-sizing: border-box;
+
+  background: $background-gradient;
+  transition: opacity 300ms;
+
+  &:not(.active) {
+    opacity: 0;
+    pointer-events: none;
+  }
+
+  button {
+    margin-top: var(--medium-padding);
+  }
+}

frontend/src/app/components/modal/modal.component.ts

@@ -0,0 +1,25 @@
+import { Component } from '@angular/core';
+import { ModalService, ModalType } from '../../services/modal.service';
+import { CancelService } from '../../services/cancel.service';
+
+@Component({
+  selector: 'app-modal',
+  templateUrl: './modal.component.html',
+  styleUrls: ['./modal.component.scss']
+})
+export class ModalComponent {
+  ModalType = ModalType;
+
+  save: () => void = null;
+
+  constructor(public modalService: ModalService, private cancelService: CancelService) {
+    this.cancelService.subscribe(this, () => {
+      if (this.save) {
+        this.save();
+        this.save = null;
+      } else {
+        this.modalService.cancel();
+      }
+    });
+  }
+}

frontend/src/app/components/modal/modals/blocks/blocks.component.html

@@ -0,0 +1,85 @@
+<section #container *ngIf="tower">
+  <div class="card placeholder"></div>
+  <div
+    *ngFor="let i of range({ max: blocks.length })"
+    (click)="$event.stopPropagation(); scrollToChild(i + 1)"
+    class="card {{ i + 1 === activeChild ? 'active' : '' }} {{
+      i + 2 === activeChild || i === activeChild ? 'near-active' : ''
+    }}"
+  >
+    <div class="mask"></div>
+
+    <div class="header">
+      <div class="exit" (click)="modalService.cancel()"></div>
+      <div class="block" [ngStyle]="{ 'background-color': tower.getColorOfTag(editedValues[i].tag) | color }"></div>
+      <h1 [innerText]="editedValues[i]?.created | formatDate"></h1>
+    </div>
+
+    <div class="select-add-container">
+      <app-select-add
+        class="select"
+        [options]="tower.tags"
+        [default]="editedValues[i].tag"
+        [alwaysDropShadow]="true"
+        [onlyShadowBorder]="true"
+        [placeholder]="'Tag this item…'"
+        (value)="editedValues[i].tag = $event"
+      ></app-select-add>
+    </div>
+
+    <textarea placeholder="Write a description here…" [(ngModel)]="editedValues[i].description"></textarea>
+
+    <div>
+      <app-toggle
+        [beforeText]="'This task hasn\'t been finished yet'"
+        [afterText]="'Goal already accomplished'"
+        [default]="blocks[i].isDone"
+        (value)="editedValues[i].isDone = $event"
+      ></app-toggle>
+    </div>
+  </div>
+
+  <div
+    (click)="$event.stopPropagation(); scrollToChild(blocks.length + 1)"
+    class="card {{ blocks.length + 1 === activeChild ? 'active' : '' }} {{
+      blocks.length === activeChild ? 'near-active' : ''
+    }} "
+  >
+    <div class="mask"></div>
+
+    <div class="header">
+      <div class="exit" (click)="modalService.cancel()"></div>
+      <div class="block" [ngStyle]="{ 'background-color': tower.getColorOfTag(top(editedValues).tag) | color }"></div>
+      <h1>Create now</h1>
+    </div>
+
+    <div class="select-add-container">
+      <app-select-add
+        class="select"
+        [options]="tower.tags"
+        [default]="tower.tags.length ? tower.tags[0] : null"
+        [alwaysDropShadow]="true"
+        [onlyShadowBorder]="true"
+        [placeholder]="'Set a category…'"
+        [newValuePlaceholder]="'Add a category…'"
+        (value)="top(editedValues).tag = $event"
+      ></app-select-add>
+    </div>
+
+    <textarea placeholder="Write a description here…" [(ngModel)]="top(editedValues).description"></textarea>
+
+    <div>
+      <app-toggle
+        [beforeText]="'This task hasn\'t been finished yet'"
+        [afterText]="'Goal already accomplished'"
+        [default]="onlyDone"
+        (value)="top(editedValues).isDone = $event"
+      ></app-toggle>
+    </div>
+
+    <div class="bottom">
+      <button (click)="submitAdd()" [disabled]="!top(editedValues).tag">Create and exit</button>
+    </div>
+  </div>
+  <div class="card placeholder"></div>
+</section>