Commit 9ce3a739 authored by François Agneray's avatar François Agneray
Browse files

Fixed detail page

parent 99aa11f8
......@@ -9,8 +9,10 @@
import { TableDetailComponent } from './table-detail.component';
import { TrDetailComponent } from './tr-detail.component';
import { detailRenderers } from './renderers';
export const detailComponents = [
TableDetailComponent,
TrDetailComponent
TrDetailComponent,
detailRenderers
];
/**
* This file is part of Anis Client.
*
* @copyright Laboratoire d'Astrophysique de Marseille / CNRS
*
* For the full copyright and license information, please view the LICENSE
* file that was distributed with this source code.
*/
import { SpectraGraphRendererComponent } from './spectra-graph-renderer.component';
export const detailRenderers = [
SpectraGraphRendererComponent
];
/**
* This file is part of Anis Client.
*
* @copyright Laboratoire d'Astrophysique de Marseille / CNRS
*
* For the full copyright and license information, please view the LICENSE
* file that was distributed with this source code.
*/
import { FormControl } from "@angular/forms";
export abstract class RendererDetailFormFactory {
static create(renderer: string) {
switch (renderer) {
case 'spectra_graph':
return {
z: new FormControl(null)
};
default:
return {};
}
}
}
<ng-container [formGroup]="form">
<div class="form-group row align-items-center">
<label for="{{id}}_z" class="col-md-5 col-sm-12 col-form-label">Attribute z:</label>
<div class="col-md-7 col-sm-12">
<select class="form-control" name="{{id}}_z" formControlName="z">
<option *ngFor="let attribute of attributeList" [ngValue]="attribute.id">{{ attribute.form_label }}</option>
</select>
</div>
</div>
</ng-container>
\ No newline at end of file
/**
* This file is part of Anis Client.
*
* @copyright Laboratoire d'Astrophysique de Marseille / CNRS
*
* For the full copyright and license information, please view the LICENSE
* file that was distributed with this source code.
*/
import { Component, Input, ChangeDetectionStrategy } from '@angular/core';
import { FormGroup } from '@angular/forms';
import { Attribute } from 'src/app/metamodel/models';
@Component({
selector: 'app-spectra-graph-renderer',
templateUrl: 'spectra-graph-renderer.component.html',
changeDetection: ChangeDetectionStrategy.OnPush
})
export class SpectraGraphRendererComponent {
@Input() id: number;
@Input() form: FormGroup;
@Input() attributeList: Attribute[];
}
......@@ -6,7 +6,7 @@
<input type="checkbox" class="form-control" name="detail" formControlName="detail">
</td>
<td>
<input *ngIf="form.controls.detail.value" type="number" class="form-control" name="display_detail" formControlName="display_detail">
<input *ngIf="form.controls.detail.value" type="number" class="form-control" name="display_detail" (change)="rendererDetailOnChange()" formControlName="display_detail">
</td>
<td>
<select *ngIf="form.controls.detail.value" class="form-control" name="renderer_detail" formControlName="renderer_detail">
......@@ -15,6 +15,13 @@
</select>
</td>
<td>
<ng-container *ngIf="form.controls.renderer_detail.value" [ngSwitch]="form.controls.renderer_detail.value">
<app-spectra-graph-renderer *ngSwitchCase="'spectra_graph'"
[id]="attribute.id"
[form]="getRendererDetailConfigForm()"
[attributeList]="attributeList">
</app-spectra-graph-renderer>
</ng-container>
</td>
<td class="text-center align-middle">
<button (click)="submit()" [disabled]="form.invalid || form.pristine" class="btn btn-outline-primary">
......
......@@ -11,6 +11,7 @@ import { Component, Input, Output, EventEmitter, ChangeDetectionStrategy, OnInit
import { FormControl, FormGroup } from '@angular/forms';
import { Attribute, SelectOption } from 'src/app/metamodel/models';
import { RendererDetailFormFactory } from './renderers/renderer-detail-form-factory';
@Component({
selector: '[detail]',
......@@ -20,6 +21,7 @@ import { Attribute, SelectOption } from 'src/app/metamodel/models';
})
export class TrDetailComponent implements OnInit {
@Input() attribute: Attribute
@Input() attributeList: Attribute[];
@Input() rendererDetailList: SelectOption[];
@Output() save: EventEmitter<Attribute> = new EventEmitter();
......@@ -32,10 +34,25 @@ export class TrDetailComponent implements OnInit {
ngOnInit() {
if (this.attribute) {
const rendererDetailConfigForm = RendererDetailFormFactory.create(this.attribute.renderer_detail);
this.form.addControl('renderer_detail_config', new FormGroup(rendererDetailConfigForm));
this.form.patchValue(this.attribute);
}
}
getRendererDetailConfigForm() {
return this.form.controls['renderer_detail_config'] as FormGroup;
}
rendererDetailOnChange() {
if (this.form.controls.renderer_detail.value === '') {
this.form.controls.renderer_detail.setValue(null);
this.form.setControl('renderer_detail_config', new FormGroup({}));
} else {
this.form.setControl('renderer_detail_config', new FormGroup(RendererDetailFormFactory.create(this.form.controls.renderer_detail.value)));
}
}
submit(): void {
this.save.emit({
...this.attribute,
......
......@@ -10,12 +10,12 @@
</div>
</div>
<div class="form-group row">
<label for="{{id}}_blank" class="col-md-5 col-sm-12 col-form-label">Blank:</label>
<label for="{{id}}_component" class="col-md-5 col-sm-12 col-form-label">Component:</label>
<div class="col-md-7 col-sm-12">
<select class="form-control" name="{{id}}_blank" formControlName="blank">
<select class="form-control" name="{{id}}_component" formControlName="component">
<option></option>
<option value="true">True</option>
<option value="false">False</option>
<option value="default">Default</option>
<option value="spectra">Spectra</option>
</select>
</div>
</div>
......
......@@ -15,7 +15,7 @@ export abstract class RendererFormFactory {
case 'detail-link':
return {
display: new FormControl('text'),
blank: new FormControl(true)
component: new FormControl('default')
};
case 'link':
return {
......
......@@ -64,10 +64,6 @@
</div>
</accordion-group>
<accordion-group heading="Download" [isOpen]="true">
<div class="custom-control custom-switch">
<input class="custom-control-input" type="checkbox" id="download_enabled" name="download_enabled" formControlName="download_enabled" (change)="checkDownloadDisableOpened()">
<label class="custom-control-label" for="download_enabled">Enabled</label>
</div>
<div class="custom-control custom-switch">
<input class="custom-control-input" type="checkbox" id="download_json" name="download_json" formControlName="download_json">
<label class="custom-control-label" for="download_json">Display download results button in JSON format</label>
......
......@@ -45,7 +45,6 @@ export class DatasetFormComponent implements OnInit, OnChanges {
public: new FormControl('', [Validators.required]),
id_database: new FormControl('', [Validators.required]),
id_dataset_family: new FormControl('', [Validators.required]),
download_enabled: new FormControl(true),
download_json: new FormControl(true),
download_csv: new FormControl(true),
download_ascii: new FormControl(true),
......@@ -65,7 +64,6 @@ export class DatasetFormComponent implements OnInit, OnChanges {
this.form.controls.id_dataset_family.setValue(this.idDatasetFamily);
}
this.checkDownloadDisableOpened();
this.checkDatatableDisablOpened();
}
......@@ -101,24 +99,6 @@ export class DatasetFormComponent implements OnInit, OnChanges {
this.loadRootDirectory.emit(`${this.instance.data_path}${path}`);
}
checkDownloadDisableOpened() {
if (this.form.controls.download_enabled.value) {
this.form.controls.download_json.enable();
this.form.controls.download_csv.enable();
this.form.controls.download_ascii.enable();
this.form.controls.download_vo.enable();
} else {
this.form.controls.download_json.setValue(false);
this.form.controls.download_json.disable();
this.form.controls.download_csv.setValue(false);
this.form.controls.download_csv.disable();
this.form.controls.download_ascii.setValue(false);
this.form.controls.download_ascii.disable();
this.form.controls.download_vo.setValue(false);
this.form.controls.download_vo.disable();
}
}
checkDatatableDisablOpened() {
if (this.form.controls.datatable_enabled.value) {
this.form.controls.datatable_selectable_rows.enable();
......
......@@ -127,6 +127,7 @@
<tr *ngFor="let attribute of (attributeList | async)"
detail
[attribute]="attribute"
[attributeList]="attributeList | async"
[rendererDetailList]="selectOptionList | async | optionListBySelect:'renderer_detail'"
(save)="editAttribute($event)">
</tr>
......
import { DefaultObjectComponent } from './default-object.component';
export const defaultComponents = [
DefaultObjectComponent
];
import { defaultComponents } from './default';
import { spectraComponents } from './spectra';
import { ObjectDataComponent } from './object-data.component';
import { DefaultObjectComponent } from './default-object.component';
import { spectraComponents } from './spectra';
export const detailsComponents = [
defaultComponents,
spectraComponents,
ObjectDataComponent
ObjectDataComponent,
DefaultObjectComponent,
spectraComponents
];
<!-- <div *ngIf="getAttributeBySearchFlag('RA') && getAttributeBySearchFlag('DEC')" class="row">
<div *ngIf="getAttributeRa() && getAttributeDec()" class="row">
<div class="col-12">
<table class="table mb-1" aria-describedby="Object coordinates">
<tr>
......@@ -7,13 +7,13 @@
<th scope="col" class="text-center" rowspan="2"><img src="assets/cesam_anis80.png" alt="CeSAM logo" /></th>
</tr>
<tr>
<td>{{ object[getAttributeBySearchFlag('RA').label] }}</td>
<td>{{ object[getAttributeBySearchFlag('DEC').label] }}</td>
<td>{{ object[getAttributeRa().label] }}</td>
<td>{{ object[getAttributeDec().label] }}</td>
</tr>
</table>
<hr class="mt-0 mb-4">
</div>
</div> -->
</div>
<!-- Accordion families -->
<accordion [isAnimated]="true">
......
......@@ -75,4 +75,12 @@ export class ObjectDataComponent {
getDownloadHref(attributeLabel: string): string {
return `${getHost(this.appConfig.apiUrl)}/download-file/${this.datasetSelected}/${attributeLabel}`;
}
getAttributeRa() {
return this.attributeList.find(attribute => attribute.renderer_detail === 'ra');
}
getAttributeDec() {
return this.attributeList.find(attribute => attribute.renderer_detail === 'dec');
}
}
......@@ -16,7 +16,7 @@
<div class="col">
<div class="row justify-content-center">
<div class="col-auto">
<a [href]="getSpectra()" target="_blank" class="btn btn-lg btn-block dl-btn">
<a [href]="getSpectra()" class="btn btn-lg btn-block dl-btn">
Download SPECTRA archive
</a>
</div>
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment