From 0ec59d29fa5620c6b2ff359bce5f69e018b8112e Mon Sep 17 00:00:00 2001 From: Matthias Pfeil Date: Thu, 12 Aug 2021 14:20:03 +0200 Subject: [PATCH 1/3] Basic download structure --- src/app/modules/core/core.module.ts | 3 +- .../filter/download/download.component.html | 184 ++++++++++++++++++ .../filter/download/download.component.scss | 29 +++ .../download/download.component.spec.ts | 25 +++ .../filter/download/download.component.ts | 15 ++ .../filter-container.component.scss | 2 +- .../filter-switcher.component.html | 12 +- .../filter-switcher.component.scss | 2 +- .../core/filter/filter/filter.component.html | 4 +- 9 files changed, 269 insertions(+), 7 deletions(-) create mode 100644 src/app/modules/core/filter/download/download.component.html create mode 100644 src/app/modules/core/filter/download/download.component.scss create mode 100644 src/app/modules/core/filter/download/download.component.spec.ts create mode 100644 src/app/modules/core/filter/download/download.component.ts diff --git a/src/app/modules/core/core.module.ts b/src/app/modules/core/core.module.ts index f1369a1e..dd3fa52c 100644 --- a/src/app/modules/core/core.module.ts +++ b/src/app/modules/core/core.module.ts @@ -34,9 +34,10 @@ import { ContactComponent } from './contact/contact.component'; import { NewVisContainerComponent } from './new-vis-container/new-vis-container.component'; import { NewVisComponent } from './new-vis/new-vis.component'; import { VisFormComponent } from './vis-form/vis-form.component'; +import { DownloadComponent } from './filter/download/download.component'; @NgModule({ - declarations: [FilterContainerComponent, SearchComponent, SearchContainerComponent, PhenomenonComponent, NavContainerComponent, NavRightComponent, BottomBarContainerComponent, DatepickerComponent, FilterSwitcherComponent, FilterComponent, ImpressumComponent, PhenoInfoComponent, PhenoInfoModalComponent, VisContainerComponent, VisComponent, FilterContainerValuesComponent, FilterValuesComponent, DatetimeModalContainerComponent, DatetimeModalComponent, SidebarMenuComponent, SidebarMenuItemsComponent, AboutComponent, PrivacyComponent, SidebarBreadcrumbsComponent, ContactComponent, NewVisContainerComponent, NewVisComponent, VisFormComponent], + declarations: [FilterContainerComponent, SearchComponent, SearchContainerComponent, PhenomenonComponent, NavContainerComponent, NavRightComponent, BottomBarContainerComponent, DatepickerComponent, FilterSwitcherComponent, FilterComponent, ImpressumComponent, PhenoInfoComponent, PhenoInfoModalComponent, VisContainerComponent, VisComponent, FilterContainerValuesComponent, FilterValuesComponent, DatetimeModalContainerComponent, DatetimeModalComponent, SidebarMenuComponent, SidebarMenuItemsComponent, AboutComponent, PrivacyComponent, SidebarBreadcrumbsComponent, ContactComponent, NewVisContainerComponent, NewVisComponent, VisFormComponent, DownloadComponent], imports: [ CommonModule, RouterModule, diff --git a/src/app/modules/core/filter/download/download.component.html b/src/app/modules/core/filter/download/download.component.html new file mode 100644 index 00000000..7be6f1b4 --- /dev/null +++ b/src/app/modules/core/filter/download/download.component.html @@ -0,0 +1,184 @@ +
+
+ + Primar lorem ipsum dolor sit amet, consectetur + adipiscing elit lorem ipsum dolor. Pellentesque risus mi, tempus quis placerat ut, porta nec nulla. + Vestibulum rhoncus ac ex sit amet fringilla. Nullam gravida purus diam, et dictum felis venenatis efficitur. +
+
+ +
+ +
+ +
+ +
+
+ +
+
+
+ +
+ +
+
+ +
+
+
+ +
+ +
+
+ +
+
+
+ +
+ +
+ +
+ +
+
+ + +
+
+
+ +
+
+ +
+
+
+
\ No newline at end of file diff --git a/src/app/modules/core/filter/download/download.component.scss b/src/app/modules/core/filter/download/download.component.scss new file mode 100644 index 00000000..8cd8c909 --- /dev/null +++ b/src/app/modules/core/filter/download/download.component.scss @@ -0,0 +1,29 @@ +@import '../../../../../styles/variables.scss'; + +.download-container { + height: 75vh; + overflow: auto; +} + +.panel-header { + display: flex; +} + +.panel-header-text { + flex-grow: 1; +} + +.options-container { + width: 100%; + + .options-row { + width: 100%; + display: flex; + justify-content: space-around; + + .option-item { + flex-grow: 1; + } + } + +} \ No newline at end of file diff --git a/src/app/modules/core/filter/download/download.component.spec.ts b/src/app/modules/core/filter/download/download.component.spec.ts new file mode 100644 index 00000000..ad71a7ca --- /dev/null +++ b/src/app/modules/core/filter/download/download.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { DownloadComponent } from './download.component'; + +describe('DownloadComponent', () => { + let component: DownloadComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ DownloadComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(DownloadComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/modules/core/filter/download/download.component.ts b/src/app/modules/core/filter/download/download.component.ts new file mode 100644 index 00000000..047227fa --- /dev/null +++ b/src/app/modules/core/filter/download/download.component.ts @@ -0,0 +1,15 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'osem-download', + templateUrl: './download.component.html', + styleUrls: ['./download.component.scss'] +}) +export class DownloadComponent implements OnInit { + + constructor() { } + + ngOnInit() { + } + +} diff --git a/src/app/modules/core/filter/filter-container/filter-container.component.scss b/src/app/modules/core/filter/filter-container/filter-container.component.scss index 49854ccc..33da6f8e 100644 --- a/src/app/modules/core/filter/filter-container/filter-container.component.scss +++ b/src/app/modules/core/filter/filter-container/filter-container.component.scss @@ -1,7 +1,7 @@ @import '../../../../../styles/variables.scss'; .filter-container { - + height: 100vh; .filter-inner { background: var(--background-primary-full); box-shadow: var(--box-shadow-basic); diff --git a/src/app/modules/core/filter/filter-switcher/filter-switcher.component.html b/src/app/modules/core/filter/filter-switcher/filter-switcher.component.html index ece068ae..176e1ceb 100644 --- a/src/app/modules/core/filter/filter-switcher/filter-switcher.component.html +++ b/src/app/modules/core/filter/filter-switcher/filter-switcher.component.html @@ -6,12 +6,18 @@ {{'PHENOMENA' | translate}} -
  • +
  • {{'FILTER' | translate}}
    • +
  • + + + {{'DATADOWNLOAD' | translate}} + +
    • - +
    @@ -31,18 +28,8 @@
    - +
    @@ -76,19 +63,19 @@
    @@ -96,19 +83,19 @@
    @@ -116,19 +103,19 @@
    @@ -137,20 +124,20 @@
    @@ -172,7 +159,7 @@
    -
    -
    +
    @@ -151,20 +151,20 @@
    - - + +
    - +
    diff --git a/src/app/modules/core/filter/download/download.component.scss b/src/app/modules/core/filter/download/download.component.scss index 8cd8c909..459587c6 100644 --- a/src/app/modules/core/filter/download/download.component.scss +++ b/src/app/modules/core/filter/download/download.component.scss @@ -25,5 +25,8 @@ flex-grow: 1; } } +} +.grow { + flex-grow: 1; } \ No newline at end of file diff --git a/src/app/modules/core/filter/download/download.component.ts b/src/app/modules/core/filter/download/download.component.ts index 7defe7da..b89f1be4 100644 --- a/src/app/modules/core/filter/download/download.component.ts +++ b/src/app/modules/core/filter/download/download.component.ts @@ -7,6 +7,8 @@ import { Component, Input, OnInit } from '@angular/core'; }) export class DownloadComponent { + collapsed: boolean = false; + downloadDetails = { window: 'raw', operation: 'arithmeticMean', @@ -28,8 +30,16 @@ export class DownloadComponent { windows = ['raw', '10m', '1h', '1d']; operations = ['arithmeticMean', 'harmonicMean', 'geometricMean', 'min', 'max', 'mode', 'median', 'variance', 'rootMeanSquare', 'standardDeviation', 'sum']; + expand() { + this.collapsed = !this.collapsed; + } + + selectFormat(format: string) { + this.downloadDetails.format = format; + } + download() { - window.alert("ALERT"); + alert(JSON.stringify(this.downloadDetails, null, 2)); } }