Skip to content
Snippets Groups Projects
Commit 565f9941 authored by mathias.chouet's avatar mathias.chouet
Browse files

Fix #204 : fullscreen rétrocompatible, factorisation de code

parent f9d10143
No related branches found
No related tags found
No related merge requests found
......@@ -50,6 +50,7 @@
"roboto-fontface": "^0.10.0",
"rxjs": "^6.3.3",
"rxjs-compat": "^6.3.3",
"screenfull": "^4.2.0",
"tslib": "^1.9.0",
"xlsx": "^0.14.1",
"zone.js": "^0.8.28"
......
import * as screenfull from "screenfull";
import { Screenfull } from "screenfull"; // @see https://github.com/sindresorhus/screenfull.js/issues/126#issuecomment-488796645
/**
* Base class for results components, including common features
*/
export class ResultsComponent {
/** tracks the fullscreen state */
public get isFullscreen() {
// return (document["fullscreenElement"] !== null);
const sf = <Screenfull>screenfull;
if (sf.enabled) {
return sf.isFullscreen;
}
}
public setFullscreen(element) {
// element.requestFullscreen();
const sf = <Screenfull>screenfull;
if (sf.enabled) {
sf.request(element);
}
}
public exitFullscreen() {
// document.exitFullscreen();
const sf = <Screenfull>screenfull;
if (sf.enabled) {
sf.exit();
}
}
}
......@@ -4,6 +4,7 @@ import { ApplicationSetupService } from "../../services/app-setup/app-setup.serv
import { ResultElement } from "jalhyd";
import { I18nService } from "../../services/internationalisation/internationalisation.service";
import * as XLSX from "xlsx";
import { ResultsComponent } from "./results.component";
@Component({
selector: "var-results",
......@@ -12,7 +13,7 @@ import * as XLSX from "xlsx";
"./var-results.component.scss"
]
})
export class VarResultsComponent {
export class VarResultsComponent extends ResultsComponent {
/** résultats non mis en forme */
protected _varResults: VarResults;
......@@ -23,17 +24,14 @@ export class VarResultsComponent {
/** entêtes des colonnes (param à varier, à calculer + extraResults) */
protected _headers: string[];
/** tracks the fullscreen state */
public get isFullscreen() {
return (document["fullscreenElement"] !== null);
}
@ViewChild("tableContainer") table: ElementRef;
constructor(
protected appSetupService: ApplicationSetupService,
protected intlService: I18nService
) { }
) {
super();
}
public set results(r: VarResults) {
this._varResults = r;
......@@ -106,14 +104,6 @@ export class VarResultsComponent {
return data;
}
public setFullscreen(element) {
element.requestFullscreen();
}
public exitFullscreen() {
document.exitFullscreen();
}
public exportAsSpreadsheet() {
// automagic <table> extraction
const ws: XLSX.WorkSheet = XLSX.utils.table_to_sheet(this.table.nativeElement);
......
......@@ -5,6 +5,7 @@ import { PabResults } from "../../results/pab-results";
import * as XLSX from "xlsx";
import { ApplicationSetupService } from "../../services/app-setup/app-setup.service";
import { I18nService } from "../../services/internationalisation/internationalisation.service";
import { ResultsComponent } from "../fixedvar-results/results.component";
@Component({
selector: "pab-results-table",
......@@ -13,7 +14,7 @@ import { I18nService } from "../../services/internationalisation/internationalis
"./pab-results-table.component.scss"
]
})
export class PabResultsTableComponent {
export class PabResultsTableComponent extends ResultsComponent {
/** résultats non mis en forme */
private _pabResults: PabResults;
......@@ -24,17 +25,14 @@ export class PabResultsTableComponent {
/** résultats mis en forme */
private _dataSet: any[];
/** tracks the fullscreen state */
public get isFullscreen() {
return (document["fullscreenElement"] !== null);
}
@ViewChild("tableContainer") table: ElementRef;
constructor(
protected appSetupService: ApplicationSetupService,
protected intlService: I18nService
) { }
) {
super();
}
public set results(r: PabResults) {
this._pabResults = r;
......@@ -138,14 +136,6 @@ export class PabResultsTableComponent {
return this._dataSet;
}
public setFullscreen(element) {
element.requestFullscreen();
}
public exitFullscreen() {
document.exitFullscreen();
}
public exportAsSpreadsheet() {
// automagic <table> extraction
const ws: XLSX.WorkSheet = XLSX.utils.table_to_sheet(this.table.nativeElement);
......
......@@ -10,6 +10,7 @@ import { VarResultsComponent } from "../fixedvar-results/var-results.component";
import { ApplicationSetupService } from "../../services/app-setup/app-setup.service";
import { ServiceFactory } from "../../services/service-factory";
import { FormulaireService } from "../../services/formulaire/formulaire.service";
import { ResultsComponent } from "../fixedvar-results/results.component";
/**
* données pour une ligne dans le graphe
......@@ -35,8 +36,6 @@ class LineData {
*/
private _data = {};
private appSetup: ApplicationSetupService;
/**
* profondeur à laquelle est dessinée la ligne
* les profondeurs les plus petites sont dessinées derrière les profondeurs les plus grandes
......@@ -49,7 +48,6 @@ class LineData {
for (let i = this._tx.length - 1; i >= 0; i--) {
this._ty.push(null);
}
this.appSetup = ServiceFactory.instance.applicationSetupService;
}
public getYat(x: number) {
......@@ -198,7 +196,7 @@ class GraphData {
"./remous-results.component.scss"
]
})
export class RemousResultsComponent implements DoCheck {
export class RemousResultsComponent extends ResultsComponent implements DoCheck {
private _remousResults: RemousResults;
/*
......@@ -237,16 +235,13 @@ export class RemousResultsComponent implements DoCheck {
@ViewChild(LogComponent)
private logComponent: LogComponent;
/** tracks the fullscreen state */
public get isFullscreen() {
return (document["fullscreenElement"] !== null);
}
constructor(
private intlService: I18nService,
private appSetup: ApplicationSetupService,
private formService: FormulaireService
) { }
) {
super();
}
private get uitextLigneFluviale() {
// calculator type for translation
......@@ -655,14 +650,6 @@ export class RemousResultsComponent implements DoCheck {
}
}
public setFullscreen(element) {
element.requestFullscreen();
}
public exitFullscreen() {
document.exitFullscreen();
}
public exportAsImage(element: HTMLDivElement) {
const canvas: HTMLCanvasElement = element.querySelector("canvas");
canvas.toBlob((blob) => {
......
......@@ -7,6 +7,7 @@ import { ApplicationSetupService } from "../../services/app-setup/app-setup.serv
import { I18nService } from "../../services/internationalisation/internationalisation.service";
import { PlottableData } from "../../results/plottable-data";
import { GraphType } from "../../results/graph-type";
import { ResultsComponent } from "../fixedvar-results/results.component";
@Component({
selector: "results-graph",
......@@ -15,7 +16,7 @@ import { GraphType } from "../../results/graph-type";
"./results-graph.component.scss"
]
})
export class ResultsGraphComponent implements AfterContentInit, Observer {
export class ResultsGraphComponent extends ResultsComponent implements AfterContentInit, Observer {
private _results: PlottableData;
/** used to briefly destroy/rebuild the chart component, to refresh axis labels (@see bug #137) */
......@@ -49,15 +50,12 @@ export class ResultsGraphComponent implements AfterContentInit, Observer {
}
};
/** tracks the fullscreen state */
public get isFullscreen() {
return (document["fullscreenElement"] !== null);
}
public constructor(
private appSetup: ApplicationSetupService,
private intlService: I18nService
) { }
) {
super();
}
public set results(r: PlottableData) {
this.forceRebuild();
......@@ -260,14 +258,6 @@ export class ResultsGraphComponent implements AfterContentInit, Observer {
};
}
public setFullscreen(element) {
element.requestFullscreen();
}
public exitFullscreen() {
document.exitFullscreen();
}
public exportAsImage(element: HTMLDivElement) {
const canvas: HTMLCanvasElement = element.querySelector("canvas");
canvas.toBlob((blob) => {
......
......@@ -6,6 +6,7 @@ import { SectionCanvasComponent } from "../section-canvas/section-canvas.compone
import { SectionResults } from "../../results/section-results";
import { ApplicationSetupService } from "../../services/app-setup/app-setup.service";
import { CalculatorResults } from "../../results/calculator-results";
import { ResultsComponent } from "../fixedvar-results/results.component";
@Component({
selector: "section-results",
......@@ -14,11 +15,13 @@ import { CalculatorResults } from "../../results/calculator-results";
"./section-results.component.scss"
]
})
export class SectionResultsComponent implements DoCheck {
export class SectionResultsComponent extends ResultsComponent implements DoCheck {
constructor(
private appSetupService: ApplicationSetupService
) { }
) {
super();
}
public set results(rs: CalculatorResults[]) {
this._resultElement = undefined;
......@@ -65,11 +68,6 @@ export class SectionResultsComponent implements DoCheck {
@ViewChild(SectionCanvasComponent)
private _sectionCanvas: SectionCanvasComponent;
/** tracks the fullscreen state */
public get isFullscreen() {
return (document["fullscreenElement"] !== null);
}
public updateView() {
if (this._sectionCanvas) {
this._sectionCanvas.reset();
......@@ -126,14 +124,6 @@ export class SectionResultsComponent implements DoCheck {
return "result_id_" + String(i & 1);
}
public setFullscreen(element) {
element.requestFullscreen();
}
public exitFullscreen() {
document.exitFullscreen();
}
public exportAsImage(element: HTMLDivElement) {
const canvas: HTMLCanvasElement = element.querySelector("canvas");
canvas.toBlob((blob) => {
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment