Skip to content
Snippets Groups Projects

Compare revisions

Changes are shown as if the source revision was being merged into the target revision. Learn more about comparing revisions.

Source

Select target project
No results found

Target

Select target project
  • faproietti/XRF-App
  • chnet/XRF-App
2 results
Show changes
Commits on Source (8)
Expand all Hide whitespace changes
Inline Side-by-side
Showing
with 910 additions and 1606 deletions
callbacks.ts
View file @ c8f08ac7
export class CallbackManager class CallbackManager {
{
private static _instance: CallbackManager = new CallbackManager();
private constructor(){
if(CallbackManager._instance) {
throw new Error("Error: Image object is already instantiated");
}
else{
CallbackManager._instance = this;
}
}
public static getInstance(): CallbackManager {
return CallbackManager._instance;
}
constructor() {
}
public showElement(elementID: string, show: boolean): void { public showElement(elementID: string, show: boolean): void {
if(show){ if (show) {
document.getElementById(elementID).style.display = "inline"; document.getElementById(elementID).style.display = "inline";
} }
else else {
{
document.getElementById(elementID).style.display = "none"; document.getElementById(elementID).style.display = "none";
} }
} }
public closeBootstrapModel(elementID: string): void{ public closeBootstrapModel(elementID: string): void {
document.getElementById(elementID).click(); document.getElementById(elementID).click();
} }
} }
export { CallbackManager };
\ No newline at end of file
drawChart.ts → chart.ts
View file @ c8f08ac7
import { DrawImage, coordinates } from "./drawImage"; import { Image, coordinates } from "./image";
import * as Help from "./helper"; import * as Utility from "./utility";
import * as Dygraph from "dygraphs"; import "dygraphs"
export class DrawChart { class Chart {
_graphic: any; graphic: any;
private readonly chartElementID: string = "chart"; private readonly chartElementID: string = "chart";
private _setLinearButton: HTMLAnchorElement; private setLinearButton: HTMLAnchorElement;
private _setLogButton: HTMLAnchorElement; private setLogButton: HTMLAnchorElement;
private _setEnergyButton: HTMLAnchorElement; private setEnergyButton: HTMLAnchorElement;
private _setChannelButton: HTMLAnchorElement; private setChannelButton: HTMLAnchorElement;
private _exportgraph: HTMLAnchorElement; private exportgraph: HTMLAnchorElement;
private _readSpinBox: HTMLButtonElement; private readSpinBox: HTMLButtonElement;
private _chartElement: HTMLElement; private chartElement: HTMLElement;
private _elementSelect: HTMLSelectElement; private elementSelect: HTMLSelectElement;
public spinBoxMin: HTMLInputElement; public spinBoxMin: HTMLInputElement;
public spinBoxMax: HTMLInputElement; public spinBoxMax: HTMLInputElement;
...@@ -21,16 +21,16 @@ export class DrawChart { ...@@ -21,16 +21,16 @@ export class DrawChart {
dataCompleteChart: string = "Channel,Counts\n"; dataCompleteChart: string = "Channel,Counts\n";
dataCompleteChartCalibrated: string = "Energy,Counts\n"; dataCompleteChartCalibrated: string = "Energy,Counts\n";
calibrated: boolean = false; //variabile per il controllo sulla calibrazione calibrated: boolean = false; //variabile per il controllo sulla calibrazione
constructor() { constructor() {
this._chartElement = <HTMLElement>document.getElementById(this.chartElementID); this.chartElement = <HTMLElement>document.getElementById(this.chartElementID);
this.spinBoxMin = <HTMLInputElement>document.getElementById("spinBoxMin"); this.spinBoxMin = <HTMLInputElement>document.getElementById("spinBoxMin");
this.spinBoxMax = <HTMLInputElement>document.getElementById("spinBoxMax"); this.spinBoxMax = <HTMLInputElement>document.getElementById("spinBoxMax");
} }
drawChart(image: DrawImage, pixel1: coordinates, pixel2: coordinates, xMinRange: number, xMaxRange: number) { drawChart(image: Image, pixel1: coordinates, pixel2: coordinates, xMinRange: number, xMaxRange: number) {
//definisco la variabile "grafico", i bottoni relativi al grafico, il tag //definisco la variabile "grafico", i bottoni relativi al grafico, il tag
//select e le due spinbox con il relativo botton //select e le due spinbox con il relativo botton
...@@ -39,11 +39,11 @@ export class DrawChart { ...@@ -39,11 +39,11 @@ export class DrawChart {
if (!this.calibrated) { if (!this.calibrated) {
//canali //canali
let chartTitle: string = "Chart from (0, 0) to (" + (image.width - 1) + ", " + (image.height - 1) + ")"; let chartTitle: string = "Chart from (0, 0) to (" + (image.width - 1) + ", " + (image.height - 1) + ")";
this._graphic = this.setChart(image, this.dataCompleteChart, chartTitle, xMinRange, xMaxRange); this.graphic = this.setChart(image, this.dataCompleteChart, chartTitle, xMinRange, xMaxRange);
} else { } else {
//energie //energie
let chartTitle: string = "Calibrated chart from (0, 0) to (" + (image.width - 1) + ", " + (image.height - 1) + ")"; let chartTitle: string = "Calibrated chart from (0, 0) to (" + (image.width - 1) + ", " + (image.height - 1) + ")";
this._graphic = this.setChart(image, this.dataCompleteChartCalibrated, chartTitle, xMinRange, xMaxRange); this.graphic = this.setChart(image, this.dataCompleteChartCalibrated, chartTitle, xMinRange, xMaxRange);
} }
//disegno il grafico parzialmente //disegno il grafico parzialmente
...@@ -73,12 +73,12 @@ export class DrawChart { ...@@ -73,12 +73,12 @@ export class DrawChart {
} else { } else {
chartTitle = "Chart from (" + pixel1.x + "," + pixel2.x + ") to (" + (image.height - pixel1.y - 1) + ", " + (image.height - pixel2.y - 1) + ")"; chartTitle = "Chart from (" + pixel1.x + "," + pixel2.x + ") to (" + (image.height - pixel1.y - 1) + ", " + (image.height - pixel2.y - 1) + ")";
} }
this._graphic = this.setChart(image, dataChart, chartTitle, xMinRange, xMaxRange); this.graphic = this.setChart(image, dataChart, chartTitle, xMinRange, xMaxRange);
} else { } else {
//disegno in energie //disegno in energie
let dataChartCalibrated: string = "Energy,Counts\n"; let dataChartCalibrated: string = "Energy,Counts\n";
for (let i: number = 0; i < image.depth; i++) { for (let i: number = 0; i < image.depth; i++) {
dataChartCalibrated += Help.round3(((i + 1) * image.calibration.a - image.calibration.b) / 1000) + "," + dataForChart[i] + "\n"; dataChartCalibrated += Utility.round3(((i + 1) * image.calibration.a - image.calibration.b) / 1000) + "," + dataForChart[i] + "\n";
} }
let chartTitle: string; let chartTitle: string;
if (pixel1.x == pixel2.x && pixel1.y == pixel2.y) { if (pixel1.x == pixel2.x && pixel1.y == pixel2.y) {
...@@ -86,13 +86,13 @@ export class DrawChart { ...@@ -86,13 +86,13 @@ export class DrawChart {
} else { } else {
chartTitle = "Calibrated chart from (" + pixel1.x + ", " + pixel2.x + ") to (" + (image.height - pixel1.y - 1) + ", " + (image.height - pixel2.y - 1) + ")"; chartTitle = "Calibrated chart from (" + pixel1.x + ", " + pixel2.x + ") to (" + (image.height - pixel1.y - 1) + ", " + (image.height - pixel2.y - 1) + ")";
} }
this._graphic = this.setChart(image, dataChartCalibrated, chartTitle, xMinRange, xMaxRange); this.graphic = this.setChart(image, dataChartCalibrated, chartTitle, xMinRange, xMaxRange);
} }
} }
} }
//la funzione setChart riceve in input i dati e il titolo del grafico da disegnare //la funzione setChart riceve in input i dati e il titolo del grafico da disegnare
//il quale è restituito il output //il quale è restituito il output
setChart(image: DrawImage, dataString: string, charTitle: string, xMinRange: number, xMaxRange: number): Dygraph { setChart(image: Image, dataString: string, charTitle: string, xMinRange: number, xMaxRange: number): Dygraph {
let xArrayRange: number[]; //estremi asse x da visualizzare let xArrayRange: number[]; //estremi asse x da visualizzare
let xLab: string; let xLab: string;
if (!this.calibrated) { if (!this.calibrated) {
...@@ -106,11 +106,11 @@ export class DrawChart { ...@@ -106,11 +106,11 @@ export class DrawChart {
//dimensioni grafico //dimensioni grafico
let chartDim: any = document.querySelector("#chart-pannel").getBoundingClientRect(); let chartDim: any = document.querySelector("#chart-pannel").getBoundingClientRect();
let chartWidth = chartDim.right - chartDim.left - 50; let chartWidth = chartDim.right - chartDim.left - 50;
this._chartElement.setAttribute("width", chartWidth.toString()); this.chartElement.setAttribute("width", chartWidth.toString());
this._chartElement.setAttribute("height", "400"); this.chartElement.setAttribute("height", "400");
//disegno il grafico //disegno il grafico
this._graphic = new Dygraph(this._chartElement, dataString, this.graphic = new Dygraph(this.chartElement, dataString,
{ {
title: charTitle, title: charTitle,
ylabel: "Counts", ylabel: "Counts",
...@@ -124,11 +124,11 @@ export class DrawChart { ...@@ -124,11 +124,11 @@ export class DrawChart {
logscale: false, logscale: false,
}); });
return this._graphic; return this.graphic;
} }
//la funzione, dati gli estremi dell'intervallo da rappresentare, aggiorna mappa e grafico //la funzione, dati gli estremi dell'intervallo da rappresentare, aggiorna mappa e grafico
peackSelection(xMinRange: number, xMaxRange: number, image: DrawImage) { peackSelection(xMinRange: number, xMaxRange: number, image: Image) {
//se l'intervallo è [0, 0] devo leggere dalle i valori dalle spinbox //se l'intervallo è [0, 0] devo leggere dalle i valori dalle spinbox
if (xMinRange == 0 && xMaxRange == 0) { if (xMinRange == 0 && xMaxRange == 0) {
xMinRange = parseInt((this.spinBoxMin).value); xMinRange = parseInt((this.spinBoxMin).value);
...@@ -144,3 +144,5 @@ export class DrawChart { ...@@ -144,3 +144,5 @@ export class DrawChart {
this.drawChart(image, { x: 0, y: 0 }, { x: image.width - 1, y: image.height - 1 }, image.globalxMinRange, image.globalxMaxRange); this.drawChart(image, { x: 0, y: 0 }, { x: image.width - 1, y: image.height - 1 }, image.globalxMinRange, image.globalxMaxRange);
} }
} }
export { Chart };
events.ts
View file @ c8f08ac7
This diff is collapsed.
fs.test.ts
View file @ c8f08ac7
import G = require("./globals"); import {Fs} from "./fs";
import * as gfs from "./fs";
import * as fs from "fs"; import * as fs from "fs";
import * as md5 from "ts-md5/dist/md5"; import * as md5 from "ts-md5/dist/md5";
import { Image } from "./image";
import { Chart } from "./chart";
let content: Buffer; let content: Buffer;
let lines: string[]; let lines: string[];
let numbers: number[]; let numbers: number[];
let image: Image = new Image();
let chart: Chart = new Chart();
let filesys: Fs = new Fs();
beforeAll(() => beforeAll(() =>
{ {
content = fs.readFileSync("XRF-File-System/Pergamena-Medioevale/codapavone_500.txt"); content = fs.readFileSync("XRF-File-System/Pergamena-Medioevale/codapavone_500.txt");
...@@ -14,9 +19,9 @@ beforeAll(() => ...@@ -14,9 +19,9 @@ beforeAll(() =>
numbers = lines.map(Number); numbers = lines.map(Number);
}); });
/*test("get_metadata", () => test("get_metadata", () =>
{ {
let metadata = gfs.get_metadata(numbers); let metadata = filesys.get_metadata(image, numbers);
expect(metadata).toEqual({ expect(metadata).toEqual({
xMin: 50088000, xMin: 50088000,
xMax: 50103000, xMax: 50103000,
...@@ -25,18 +30,11 @@ beforeAll(() => ...@@ -25,18 +30,11 @@ beforeAll(() =>
step: 500, step: 500,
direction: 'c' direction: 'c'
}); });
})*/ })
/*test("readImage", () => test("readImage", () =>
{ {
let image = gfs.readImage(content.toString()); let readImage = filesys.readImage(image, chart, content.toString());
expect(md5.Md5.hashAsciiStr(JSON.stringify(image))).toBe("0a77bca5eb4c9bdd137c753a21b98545"); // coda_pavone_500 expect(md5.Md5.hashAsciiStr(JSON.stringify(readImage))).toBe("0a77bca5eb4c9bdd137c753a21b98545"); // coda_pavone_500
//expect(md5.Md5.hashAsciiStr(JSON.stringify(image))).toBe("b9e7fb96f36452cc3c2350d6132b50c6"); // coda_pavone_250 //expect(md5.Md5.hashAsciiStr(JSON.stringify(image))).toBe("b9e7fb96f36452cc3c2350d6132b50c6"); // coda_pavone_250
})*/
/* test("readImage_lc", () =>
{
let image = gfs.readImage_lc(content.toString());
console.log(md5.Md5.hashAsciiStr(JSON.stringify(image));
}) })
*/
fs.ts
View file @ c8f08ac7
This diff is collapsed.
globals.ts deleted 100644 → 0
View file @ bb4b0579
export interface coordinates // used in multiple files
{
x: number;
y: number;
}
export class Calibration //used in multiple files
{
a: number;
b: number;
}
export enum ReadDirection {
u,// lettura non definita
r,//lettura per righe
c//lettura per colonne
}
export class Metadata //used only on fs.ts
{
private static _instance: Metadata = new Metadata();
private constructor() {
if(Metadata._instance) {
throw new Error("Error: Image object is already instantiated");
}
else {
Metadata._instance = this;
}
}
xMin: number = 0;
xMax: number = 0;
yMin: number = 0;
yMax: number = 0;
step: number = 0;
direction: ReadDirection = ReadDirection.u;
public static getInstance(): Metadata {
return Metadata._instance;
}
}
// export class Image
// {
// private static _instance: Image = new Image();
// private constructor() {
// if(Image._instance)
// {
// throw new Error ("Error: Image object is already instantiated");
// }
// else
// {
// Image._instance = this;
// }
// }
// DataMatrix: number[][][];
// width: number;
// height: number;
// readonly calibration: Calibration = {a: 3.36275, b: 58.2353}; // TODO
// readonly depth: number = 8000;
// readonly maxCoordValueX = 60000000;
// readonly headerSetValue = 17000;
// readonly xCoordHeaderFirstValue = 5; //instestazione X
// readonly yCoordHeaderFirstValue = 6; //intestazione y
// channelDepth: number = require("./helper").round3(((this.depth + 1) * this.calibration.a - this.calibration.b) / 1000); //profondità massima in canali
// globalxMinRange: number = 0;
// globalxMaxRange: number = this.channelDepth;
// zPixel1: coordinates;
// zPixel2: coordinates; //pixel2 dello zoom
// newOrigin: coordinates = { x: 0, y: 0}; //nuovo origine nel caso di zoom
// maxAbsolute: number; //massimo conteggio della matrice nOfCounts
// pixelDim: number; //dimensione dei pixel responsive
// nOfCounts: number[][]; //matrici con i dati
// rePrint: boolean = false; //variabile per ricolorare con il max relativo
// public static getInstance(): Image
// {
// return Image._instance;
// }
// }
// export class Chart {
// private static _instance: Chart = new Chart();
// private constructor()
// {
// if(Chart._instance)
// {
// throw new Error("Error: Image object is already instantiated");
// }
// else
// {
// Chart._instance = this;
// }
// }
// dataCompleteChart: string = "Channel,Counts\n";
// dataCompleteChartCalibrated: string = "Energy,Counts\n";
// calibrated: boolean = false; //variabile per il controllo sulla calibrazione
// public static getInstance(): Chart
// {
// return Chart._instance;
// }
// }
drawImage.ts → image.ts
View file @ c8f08ac7
import G = require("./globals"); import * as Utility from "./utility";
import * as $ from "jquery";
import * as Help from "./helper";
import { DrawChart } from "./drawChart";
export interface coordinates // used in multiple files interface coordinates // used in multiple files
{ {
x: number; x: number;
y: number; y: number;
} }
export class Calibration //used in multiple files class Calibration //used in multiple files
{ {
a: number; a: number;
b: number; b: number;
} }
export class DrawImage { class Image {
private readonly _saturationSliderID: string = "SaturationSlider"; private readonly saturationSliderID: string = "SaturationSlider";
private readonly _transparencySliderID: string = "TrasparencySlider"; private readonly transparencySliderID: string = "TrasparencySlider";
private readonly _selectionCanvasID: string = "selectionCanvas"; private readonly selectionCanvasID: string = "selectionCanvas";
private readonly _myCanvasID: string = "myCanvas"; private readonly myCanvasID: string = "myCanvas";
private _context: CanvasRenderingContext2D; private context: CanvasRenderingContext2D;
private _saturationSlider: HTMLInputElement; private saturationSlider: HTMLInputElement;
private _transparencySlider: HTMLInputElement; private transparencySlider: HTMLInputElement;
_pixel1: coordinates; pixel1: coordinates;
_pixel2: coordinates; pixel2: coordinates;
private _xMinRange: number; private xMinRange: number;
private _xMaxRange: number; private xMaxRange: number;
private _selectionCanvas: HTMLCanvasElement; private selectionCanvas: HTMLCanvasElement;
private _myCanvas: HTMLCanvasElement; private myCanvas: HTMLCanvasElement;
private _ctx; private ctx;
private _isDown = false; private isDown = false;
DataMatrix: number[][][]; DataMatrix: number[][][];
width: number; width: number;
height: number; height: number;
readonly calibration: Calibration = { a: 3.36275, b: 58.2353 }; readonly calibration: Calibration = { a: 3.36275, b: 58.2353 };
readonly depth: number = 8000; readonly depth: number = 8000;
channelDepth: number = Help.round3(((this.depth + 1) * this.calibration.a - this.calibration.b) / 1000); //profondità massima in canali channelDepth: number = Utility.round3(((this.depth + 1) * this.calibration.a - this.calibration.b) / 1000); //profondità massima in canali
readonly maxCoordValueX = 60000000; // to check readonly maxCoordValueX = 60000000; // to check
readonly headerSetValue = 17000; readonly headerSetValue = 17000;
readonly xCoordHeaderFirstValue = 5; //instestazione X readonly xCoordHeaderFirstValue = 5; //instestazione X
...@@ -56,12 +53,12 @@ export class DrawImage { ...@@ -56,12 +53,12 @@ export class DrawImage {
rePrint: boolean = false; //variabile per ricolorare con il max relativo rePrint: boolean = false; //variabile per ricolorare con il max relativo
constructor() { constructor() {
this._selectionCanvas = <HTMLCanvasElement>document.getElementById(this._selectionCanvasID); this.selectionCanvas = <HTMLCanvasElement>document.getElementById(this.selectionCanvasID);
this._ctx = this._selectionCanvas.getContext("2d"); this.ctx = this.selectionCanvas.getContext("2d");
this._myCanvas = <HTMLCanvasElement>document.getElementById(this._myCanvasID); this.myCanvas = <HTMLCanvasElement>document.getElementById(this.myCanvasID);
this._saturationSlider = <HTMLInputElement>document.getElementById(this._saturationSliderID); this.saturationSlider = <HTMLInputElement>document.getElementById(this.saturationSliderID);
this._transparencySlider = <HTMLInputElement>document.getElementById(this._transparencySliderID); this.transparencySlider = <HTMLInputElement>document.getElementById(this.transparencySliderID);
} }
...@@ -85,13 +82,13 @@ export class DrawImage { ...@@ -85,13 +82,13 @@ export class DrawImage {
pixel.y = Math.floor((allY - objY - 1) / this.pixelDim) + this.newOrigin.y; pixel.y = Math.floor((allY - objY - 1) / this.pixelDim) + this.newOrigin.y;
} }
drawImg(pixel1: coordinates, pixel2: coordinates, xMinRange: number, xMaxRange: number, callback?: () => void) { drawImg(pixel1: coordinates, pixel2: coordinates, xMinRange: number, xMaxRange: number, callback?: () => void) {
this._pixel1 = pixel1; this.pixel1 = pixel1;
this._pixel2 = pixel2; this.pixel2 = pixel2;
//alert("disegno in corso"); //alert("disegno in corso");
//numero di pixel per dimensione //numero di pixel per dimensione
let nPixelX: number = this._pixel2.x - this._pixel1.x + 1; let nPixelX: number = this.pixel2.x - this.pixel1.x + 1;
let nPixelY: number = this._pixel2.y - this._pixel1.y + 1; let nPixelY: number = this.pixel2.y - this.pixel1.y + 1;
//dimensione dei canvas //dimensione dei canvas
let mappaPannelDim: any = document.querySelector("#mappa-pannel").getBoundingClientRect(); let mappaPannelDim: any = document.querySelector("#mappa-pannel").getBoundingClientRect();
...@@ -104,22 +101,22 @@ export class DrawImage { ...@@ -104,22 +101,22 @@ export class DrawImage {
this.pixelDim = dimPixelx < dimPixely ? dimPixelx : dimPixely; this.pixelDim = dimPixelx < dimPixely ? dimPixelx : dimPixely;
//dimensioni esatte dei canvas //dimensioni esatte dei canvas
this._myCanvas.height = nPixelY * this.pixelDim; this.myCanvas.height = nPixelY * this.pixelDim;
this._myCanvas.width = nPixelX * this.pixelDim; this.myCanvas.width = nPixelX * this.pixelDim;
this._selectionCanvas.height = nPixelY * this.pixelDim; this.selectionCanvas.height = nPixelY * this.pixelDim;
this._selectionCanvas.width = nPixelX * this.pixelDim; this.selectionCanvas.width = nPixelX * this.pixelDim;
let ctx = this._myCanvas.getContext("2d"); //contesto del canvas let ctx = this.myCanvas.getContext("2d"); //contesto del canvas
if (xMaxRange - xMinRange >= this.channelDepth) { if (xMaxRange - xMinRange >= this.channelDepth) {
//range completo //range completo
let max: number = 0; //massimo relativo o assoluto let max: number = 0; //massimo relativo o assoluto
if (this.rePrint) { if (this.rePrint) {
max = Help.findMax(this.nOfCounts, this._pixel1, this._pixel2); max = Utility.findMax(this.nOfCounts, this.pixel1, this.pixel2);
} else { } else {
max = this.maxAbsolute; max = this.maxAbsolute;
} }
max *= parseInt(this._saturationSlider.value) / 100; max *= parseInt(this.saturationSlider.value) / 100;
this.drawCanvas(this.nOfCounts, max); this.drawCanvas(this.nOfCounts, max);
} else { } else {
...@@ -132,18 +129,18 @@ export class DrawImage { ...@@ -132,18 +129,18 @@ export class DrawImage {
for (let i: number = 0; i < this.width; i++) { for (let i: number = 0; i < this.width; i++) {
nOfCountsRelative[i] = new Array(this.height); nOfCountsRelative[i] = new Array(this.height);
for (let j: number = 0; j < this.height; j++) { for (let j: number = 0; j < this.height; j++) {
nOfCountsRelative[i][j] = Help.sumVect(this.DataMatrix[i][j], xMinRangeCh, xMaxRangeCh); nOfCountsRelative[i][j] = Utility.sumVect(this.DataMatrix[i][j], xMinRangeCh, xMaxRangeCh);
} }
} }
//calcolo il massimo //calcolo il massimo
let max: number = 0; let max: number = 0;
if (this.rePrint) { if (this.rePrint) {
max = Help.findMax(nOfCountsRelative, this._pixel1, this._pixel2); max = Utility.findMax(nOfCountsRelative, this.pixel1, this.pixel2);
} else { } else {
max = Help.findMax(nOfCountsRelative, { x: 0, y: 0 }, { x: this.width - 1, y: this.height - 1 }); max = Utility.findMax(nOfCountsRelative, { x: 0, y: 0 }, { x: this.width - 1, y: this.height - 1 });
} }
max *= parseInt(this._saturationSlider.value) / 100; max *= parseInt(this.saturationSlider.value) / 100;
if (max == 0) if (max == 0)
alert("WARNING: max value is 0"); alert("WARNING: max value is 0");
...@@ -157,12 +154,12 @@ export class DrawImage { ...@@ -157,12 +154,12 @@ export class DrawImage {
private drawCanvas(noc, max) { private drawCanvas(noc, max) {
//controllo il valore della trasparenza //controllo il valore della trasparenza
let setTrsp: number = 1 - parseInt(this._transparencySlider.value) / 100; let setTrsp: number = 1 - parseInt(this.transparencySlider.value) / 100;
//scorro tutti i pixel: ne determino il colore e li disegno //scorro tutti i pixel: ne determino il colore e li disegno
let color: string = ""; let color: string = "";
for (let i: number = this._pixel1.x; i <= this._pixel2.x; i++) { for (let i: number = this.pixel1.x; i <= this.pixel2.x; i++) {
for (let j: number = this._pixel1.y; j <= this._pixel2.y; j++) { for (let j: number = this.pixel1.y; j <= this.pixel2.y; j++) {
let intensity: number = noc[i][j] / max; let intensity: number = noc[i][j] / max;
if (intensity < 1 / 5) if (intensity < 1 / 5)
//blu //blu
...@@ -180,16 +177,19 @@ export class DrawImage { ...@@ -180,16 +177,19 @@ export class DrawImage {
else else
color = "rgba(255," + (255 - Math.floor((intensity - 4 / 5) * 5 * 255)) + ", 0, " + setTrsp + ")"; color = "rgba(255," + (255 - Math.floor((intensity - 4 / 5) * 5 * 255)) + ", 0, " + setTrsp + ")";
this._ctx.fillStyle = color; this.ctx.fillStyle = color;
this._ctx.fillRect((i - this._pixel1.x) * this.pixelDim, (j - this._pixel1.y) * this.pixelDim, this.pixelDim, this.pixelDim); this.ctx.fillRect((i - this.pixel1.x) * this.pixelDim, (j - this.pixel1.y) * this.pixelDim, this.pixelDim, this.pixelDim);
} }
} }
//console.log(color); //console.log(color);
this.rePrint = false; //annullo rePrint this.rePrint = false; //annullo rePrint
this._ctx.fillStyle = "rgba(0, 110, 255, 0.25)"; this.ctx.fillStyle = "rgba(0, 110, 255, 0.25)";
this._isDown = false; this.isDown = false;
} }
} }
export { coordinates, Calibration, Image };
importFile.ts 0 → 100644
View file @ c8f08ac7
import { Image } from "./image";
import { Chart } from "./chart";
import { Fs } from "./fs";
import { CallbackManager } from "./callbacks"
import $ = require("jquery");
class ImportFile {
private image: Image;
private chart: Chart;
private fs: Fs;
private callbackManager: CallbackManager;
constructor(drawImage: Image, drawChart: Chart) {
this.image = drawImage;
this.chart = drawChart;
this.fs = new Fs();
this.callbackManager = new CallbackManager();
}
//funzione che definisce tutti gli elementi responsabili dell'apertura di un file.
//Sono definiti quindi l'albero e il bottone per l'importazione da locale
setImportFile() {
// genero e leggo il contenuto della directory "filesystem"
// comment out waiting to properly address the request
// let xmlDoc: Document;
// let xmlListingFile: any = new XMLHttpRequest();
// xmlListingFile.open("PROPFIND", "CHNET/", false);
// xmlListingFile.setRequestHeader("Depth", "infinity");
// xmlListingFile.onreadystatechange = function () {
// if (xmlListingFile.readyState === 4) {
// if (xmlListingFile.status === 207) {
// let parser = new DOMParser();
// xmlDoc = parser.parseFromString(xmlListingFile.responseText, "text/xml");
// }
// }
// }
// xmlListingFile.send(null);
//ora genero l'albero e definisco l'evento in caso di selezione di un nodo
// jQuery(document.getElementById('FileTreeview')).treeview({ data: this.fs.generateTree(xmlDoc) });
// $('#FileTreeview').on('nodeSelected', (e, node) => {
// if (node['url'] != undefined) {
// $("#load-spinner").css("display", "inline");
// this.fs.openFileFromServer(node['url']);
// }
// });
// import a local file
let fileInputButton: any = document.getElementById("myImport");
fileInputButton.onchange = () => {
this.callbackManager.showElement("load-spinner", true);
let file: File = fileInputButton.files[0];
let readerObject = new FileReader();
readerObject.onload = () => {
let content = readerObject.result;
let image = this.fs.readImage(this.image, this.chart, content);
this.callbackManager.showElement("load-spinner", false);
this.image.drawImg({ x: 0, y: 0 }, { x: image.width - 1, y: image.height - 1 }, 0, image.channelDepth,
() => { this.callbackManager.closeBootstrapModel("btnCloseModal"); });
this.chart.drawChart(image, { x: 0, y: 0 }, { x: image.width - 1, y: image.height - 1 }, 0, image.channelDepth);
};
readerObject.readAsText(file);
};
}
//funzione per la compressione della sidenav sx
compressingSidenav() {
let fsLabel = document.getElementById("collapse-symbol");
let isClosedfs = false;
let fsLabel_cross = () => {
if (isClosedfs == true) {
isClosedfs = false;
console.log("closed");
$(".w3-bar-block").css("width", "65px");
$(".text-sidenav").css("display", "none");
document.getElementById("collapse-symbol").title = "Open Sidebar";
document.getElementById("collapse-symbol").classList.replace("fa-angle-double-left", "fa-angle-double-right");
} else {
isClosedfs = true;
$(".w3-bar-block").css("width", "200px");
$(".text-sidenav").css("display", "inline");
document.getElementById("collapse-symbol").title = "Close Sidebar";
document.getElementById("collapse-symbol").classList.replace("fa-angle-double-right", "fa-angle-double-left");
}
};
fsLabel.addEventListener("mousedown", fsLabel_cross, false);
}
//funzione che definisce l'area su cui si può eseguire il drag&drop
makeDroppable(droppableArea) {
//creo l'elemento "input type file" non visibile e lo aggiungo a "droppableArea"
let input: any = document.createElement("input");
input.type = "file";
input.multiple = true;
input.style.display = "none";
droppableArea.appendChild(input);
//questo evento è chiamato quando i file sono trascinati ma non ancora lasciati
droppableArea.addEventListener("dragover", function (e) {
e.preventDefault(); //impediamo l'apertura del file
e.stopPropagation();
e.dataTransfer.dropEffect = "copy";
droppableArea.classList.add("dragover");
});
//l'evento è chiamato quando un file lascia la zona predefinita per il drag&drop
droppableArea.addEventListener("dragleave", function (e) {
e.preventDefault();
e.stopPropagation();
droppableArea.classList.remove("dragover");
});
//questo evento si innesca quando il drop è effettivamente avvenuto
droppableArea.addEventListener("drop", function (e) {
e.preventDefault();
e.stopPropagation();
droppableArea.classList.remove("dragover");
this.callback(e.dataTransfer.files, this.image, this.chart);
});
}
//funzione chiamata in caso di drag&drop responsabile dell'apertura del file droppato,
//della sua lettura e del passaggio del suo contenuto alla funzione readData()
private callback(files, drawImage: Image, drawChart: Chart, fs: Fs) {
this.callbackManager.showElement("load-spinner", true);
let file: File = files[files.length - 1];
console.log("Try to open " + file.name + " ...");
let readerObject = new FileReader();
readerObject.onload = () => {
let content = readerObject.result;
fs.readImage(drawImage, drawChart, content);
this.callbackManager.showElement("load-spinner", false);
};
readerObject.readAsText(file);
}
}
export { ImportFile };
\ No newline at end of file
index.php
View file @ c8f08ac7
...@@ -13,14 +13,11 @@ ...@@ -13,14 +13,11 @@
<link rel="stylesheet" type="text/css" href="style.css"> <link rel="stylesheet" type="text/css" href="style.css">
<link rel="stylesheet" type="text/css" href="node_modules/bootstrap/dist/css/bootstrap.min.css"> <link rel="stylesheet" type="text/css" href="node_modules/bootstrap/dist/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="node_modules/bootstrap-select/dist/css/bootstrap-select.min.css"> <link rel="stylesheet" type="text/css" href="node_modules/bootstrap-select/dist/css/bootstrap-select.min.css">
<link rel="stylesheet" type="text/css" href="node_modules/bootstrap-treeview/dist/bootstrap-treeview.min.css">
<link rel="stylesheet" type="text/css" href="src/font-awesome/dist/font-awesome.min.css"> <link rel="stylesheet" type="text/css" href="src/font-awesome/dist/font-awesome.min.css">
<!-- Librerie --> <!-- Librerie -->
<script type="text/javascript" src="node_modules/jquery/dist/jquery.min.js"></script> <script type="text/javascript" src="node_modules/jquery/dist/jquery.min.js"></script>
<script type="text/javascript" src="node_modules/bootstrap/dist/js/bootstrap.min.js"></script> <script type="text/javascript" src="node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
<script type="text/javascript" src="node_modules/bootstrap-treeview/dist/bootstrap-treeview.min.js"></script>
<script type="text/javascript" src="node_modules/bootstrap-select/dist/js/bootstrap-select.min.js"></script>
<script type="text/javascript" src="node_modules/dygraphs/dist/dygraph.min.js"></script> <script type="text/javascript" src="node_modules/dygraphs/dist/dygraph.min.js"></script>
<script type="text/javascript" src="xrf.js"></script> <script type="text/javascript" src="xrf.js"></script>
<!-- ./Librerie --> <!-- ./Librerie -->
...@@ -57,7 +54,7 @@ ...@@ -57,7 +54,7 @@
} else { } else {
echo "<img src=\"./default-avatar.png\" class=\"img-circle\" width=\"25\">"; echo "<img src=\"./default-avatar.png\" class=\"img-circle\" width=\"25\">";
} }
// echo " ".ucfirst($_SERVER["OIDC_CLAIM_name"]); //echo " ".ucfirst($_SERVER["OIDC_CLAIM_name"]);
?> ?>
<span class="glyphicon glyphicon-chevron-down"></span> <span class="glyphicon glyphicon-chevron-down"></span>
</a> </a>
......
package-lock.json
View file @ c8f08ac7
This diff is collapsed.
package.json
View file @ c8f08ac7
...@@ -10,9 +10,6 @@ ...@@ -10,9 +10,6 @@
"bootstrap-select": "^1.12.4", "bootstrap-select": "^1.12.4",
"bootstrap-slider": "^10.0.0", "bootstrap-slider": "^10.0.0",
"bootstrap-tooltip": "^3.1.1", "bootstrap-tooltip": "^3.1.1",
"bootstrap-treeview": "^1.2.0",
"bower": "^1.8.4",
"connect": "^3.6.6",
"dygraphs": "^2.0.0", "dygraphs": "^2.0.0",
"jquery": "^3.3.1" "jquery": "^3.3.1"
}, },
...@@ -23,13 +20,15 @@ ...@@ -23,13 +20,15 @@
"url": "https://baltig.infn.it/chnet/XRF-App.git" "url": "https://baltig.infn.it/chnet/XRF-App.git"
}, },
"devDependencies": { "devDependencies": {
"@types/dygraphs": "^1.1.8",
"@types/jest": "^21.1.6", "@types/jest": "^21.1.6",
"@types/node": "^8.0.51", "@types/jquery": "^3.3.4",
"@types/node": "^8.10.18",
"jest": "^21.2.1", "jest": "^21.2.1",
"ts-jest": "^21.2.2", "ts-jest": "^21.2.2",
"ts-md5": "^1.2.2", "ts-md5": "^1.2.2",
"ts-node": "^6.0.3", "ts-node": "^6.1.0",
"typescript": "^2.6.1" "typescript": "^2.9.1"
}, },
"jest": { "jest": {
"testEnvironment": "node", "testEnvironment": "node",
......
start.ts
View file @ c8f08ac7
...@@ -2,12 +2,11 @@ ...@@ -2,12 +2,11 @@
// //
// Licensed under the EUPL // Licensed under the EUPL
import * as $ from "jquery"; import { Chart } from './chart';
import { DrawChart } from './drawChart'; import { Image } from './image';
import { DrawImage } from './drawImage';
import * as fs from "./fs";
import * as Callback from "./callbacks";
import { Events } from "./events"; import { Events } from "./events";
import { ImportFile } from "./importFile";
//INIZIO DELLO SCRIPT //INIZIO DELLO SCRIPT
...@@ -15,147 +14,23 @@ window.onload = () => { ...@@ -15,147 +14,23 @@ window.onload = () => {
// skip the tooltip for the moment; it generates an apparently fatal error // skip the tooltip for the moment; it generates an apparently fatal error
//$('[data-toggle="tooltip"]').tooltip(); //$('[data-toggle="tooltip"]').tooltip();
let drawImage = new DrawImage(); let drawImage = new Image();
let drawChart = new DrawChart(); let drawChart = new Chart();
let importFile = new ImportFile(drawImage, drawChart);
new Events(drawImage,drawChart); new Events(drawImage, drawChart);
//creazione dell'albero e gestione barre laterali //creazione dell'albero e gestione barre laterali
setImportFile(drawImage, drawChart); importFile.setImportFile();
compressingSidenav(); importFile.compressingSidenav();
// enable drag&drop // enable drag&drop
let droppableArea: any = document.querySelector('.droppable'); let droppableArea: any = document.querySelector('.droppable');
//makeDroppable(droppableArea, callback); importFile.makeDroppable(droppableArea);
drawImage.zPixel1 = { x: 0, y: 0 }; drawImage.zPixel1 = { x: 0, y: 0 };
drawImage.zPixel2 = { x: 0, y: 0 }; drawImage.zPixel2 = { x: 0, y: 0 };
}; };
//funzione che definisce tutti gli elementi responsabili dell'apertura di un file.
//Sono definiti quindi l'albero e il bottone per l'importazione da locale
function setImportFile(drawImage: DrawImage, drawChart: DrawChart) {
// genero e leggo il contenuto della directory "filesystem"
// comment out waiting to properly address the request
/*let xmlDoc: Document;
let xmlListingFile: any = new XMLHttpRequest();
xmlListingFile.open("PROPFIND", "CHNET/", false);
xmlListingFile.setRequestHeader("Depth", "infinity");
xmlListingFile.onreadystatechange = function ()
{
if (xmlListingFile.readyState === 4) {
if (xmlListingFile.status === 207) {
let parser = new DOMParser();
xmlDoc = parser.parseFromString(xmlListingFile.responseText, "text/xml");
}
}
}
xmlListingFile.send(null);
//ora genero l'albero e definisco l'evento in caso di selezione di un nodo
$('#FileTreeview').treeview({data: fs.generateTree(xmlDoc)});
$('#FileTreeview').on('nodeSelected', function (e, node)
{
if (node['url'] != undefined) {
$("#load-spinner").css("display", "inline");
fs.openFileFromServer(node['url']);
}
});*/
// import a local file
let fileInputButton: any = document.getElementById("myImport");
fileInputButton.onchange = function () {
Callback.CallbackManager.getInstance().showElement("load-spinner", true);
let file: File = fileInputButton.files[0];
let readerObject = new FileReader();
readerObject.onload = function () {
let content: string = readerObject.result;
let image: DrawImage = fs.readImage(drawImage, drawChart,content);
Callback.CallbackManager.getInstance().showElement("load-spinner", false);
drawImage.drawImg({ x: 0, y: 0 }, { x: image.width - 1, y: image.height - 1 }, 0, image.channelDepth,
() => { Callback.CallbackManager.getInstance().closeBootstrapModel("btnCloseModal"); });
drawChart.drawChart(image, { x: 0, y: 0 }, { x: image.width - 1, y: image.height - 1 }, 0, image.channelDepth);
// install callbacks for the canvas and chart?
};
readerObject.readAsText(file);
};
}
//funzione per la compressione della sidenav sx
function compressingSidenav() {
let fsLabel = document.getElementById("collapse-symbol");
let isClosedfs = false;
let fsLabel_cross = () => {
if (isClosedfs == true) {
isClosedfs = false;
console.log("closed");
$(".w3-bar-block").css("width", "65px");
$(".text-sidenav").css("display", "none");
document.getElementById("collapse-symbol").title = "Open Sidebar";
document.getElementById("collapse-symbol").classList.replace("fa-angle-double-left","fa-angle-double-right");
} else {
isClosedfs = true;
$(".w3-bar-block").css("width", "200px");
$(".text-sidenav").css("display", "inline");
document.getElementById("collapse-symbol").title = "Close Sidebar";
document.getElementById("collapse-symbol").classList.replace("fa-angle-double-right","fa-angle-double-left");
}
};
fsLabel.addEventListener("mousedown", fsLabel_cross, false);
}
//funzione che definisce l'area su cui si può eseguire il drag&drop
/*function makeDroppable(droppableArea, callback) {
//creo l'elemento "input type file" non visibile e lo aggiungo a "droppableArea"
let input: any = document.createElement("input");
input.type = "file";
input.multiple = true;
input.style.display = "none";
droppableArea.appendChild(input);
//questo evento è chiamato quando i file sono trascinati ma non ancora lasciati
droppableArea.addEventListener("dragover", function (e) {
e.preventDefault(); //impediamo l'apertura del file
e.stopPropagation();
e.dataTransfer.dropEffect = "copy";
droppableArea.classList.add("dragover");
});
//l'evento è chiamato quando un file lascia la zona predefinita per il drag&drop
droppableArea.addEventListener("dragleave", function (e) {
e.preventDefault();
e.stopPropagation();
droppableArea.classList.remove("dragover");
});
//questo evento si innesca quando il drop è effettivamente avvenuto
droppableArea.addEventListener("drop", function (e) {
e.preventDefault();
e.stopPropagation();
droppableArea.classList.remove("dragover");
callback.call(null, e.dataTransfer.files);
});
}*/
//funzione chiamata in caso di drag&drop responsabile dell'apertura del file droppato,
//della sua lettura e del passaggio del suo contenuto alla funzione readData()
/*function callback(files) {
Callback.CallbackManager.getInstance().showElement("load-spinner", true);
let file: File = files[files.length - 1];
console.log("Try to open " + file.name + " ...");
let readerObject = new FileReader();
readerObject.onload = function () {
let content: string = readerObject.result;
fs.readImage(drawImage, content);
Callback.CallbackManager.getInstance().showElement("load-spinner", false);
};
readerObject.readAsText(file);
}*/
tsconfig.json
View file @ c8f08ac7
...@@ -2,8 +2,9 @@ ...@@ -2,8 +2,9 @@
"compilerOptions": { "compilerOptions": {
// "target": "es6", // "target": "es6",
// "allowSyntheticDefaultImports": true // "allowSyntheticDefaultImports": true
"module": "commonjs",
"lib": [ "lib": [
"es6", "dom" "es6", "dom"
] ],
} }
} }
\ No newline at end of file
helper.ts → utility.ts
View file @ c8f08ac7
import { DrawImage, coordinates } from "./drawImage"; import { Image, coordinates } from "./image";
import { DrawChart } from "./drawChart"; import { Chart } from "./chart";
// round to the 3rd decimal digit // round to the 3rd decimal digit
export function round3(val: number) function round3(val: number) {
{
return (Math.round(val * Math.pow(10, 3)) / Math.pow(10, 3)); return (Math.round(val * Math.pow(10, 3)) / Math.pow(10, 3));
} }
// sum the elements of the array in the range [from, to] // sum the elements of the array in the range [from, to]
export function sumVect(vect: number[], from: number, to: number) function sumVect(vect: number[], from: number, to: number) {
{
let sum: number = 0; let sum: number = 0;
for (let i: number = from; i < to; i++) { sum += vect[i]; } for (let i: number = from; i < to; i++) {
sum += vect[i];
}
return sum; return sum;
} }
// find the max in the sub-matrix specified by the two coordinates // find the max in the sub-matrix specified by the two coordinates
export function findMax(matrix: number[][], pixel1: coordinates, pixel2: coordinates) function findMax(matrix: number[][], pixel1: coordinates, pixel2: coordinates) {
{
let max = 0; let max = 0;
for (let i = pixel1.x; i <= pixel2.x; i++) { for (let i = pixel1.x; i <= pixel2.x; i++) {
for (let j = pixel1.y; j <= pixel2.y; j++) { for (let j = pixel1.y; j <= pixel2.y; j++) {
...@@ -29,8 +29,7 @@ export function findMax(matrix: number[][], pixel1: coordinates, pixel2: coordin ...@@ -29,8 +29,7 @@ export function findMax(matrix: number[][], pixel1: coordinates, pixel2: coordin
} }
// prepara i dati per il grafico completo // prepara i dati per il grafico completo
export function setDataForCompleteChart(image: DrawImage, chart: DrawChart): number[] function setDataForCompleteChart(image: Image, chart: Chart): number[] {
{
// per ogni pixel sommo i conteggi di tutti i canali rilevati // per ogni pixel sommo i conteggi di tutti i canali rilevati
let data: number[] = []; let data: number[] = [];
data.length = image.depth; data.length = image.depth;
...@@ -57,21 +56,22 @@ export function setDataForCompleteChart(image: DrawImage, chart: DrawChart): num ...@@ -57,21 +56,22 @@ export function setDataForCompleteChart(image: DrawImage, chart: DrawChart): num
} }
export function getFirstDigitNumber(n: number): number { function getFirstDigitNumber(n: number): number {
return parseInt(n.toString()[0]); return parseInt(n.toString()[0]);
} }
export function isAnXHeader(value: number, image: DrawImage): boolean { function isAnXHeader(value: number, image: Image): boolean {
if(value > image.headerSetValue && getFirstDigitNumber(value) == image.xCoordHeaderFirstValue) { if (value > image.headerSetValue && getFirstDigitNumber(value) == image.xCoordHeaderFirstValue) {
return true; return true;
} }
return false; return false;
} }
export function isAnYHeader(value: number, image: DrawImage): boolean { function isAnYHeader(value: number, image: Image): boolean {
if(value > image.headerSetValue && getFirstDigitNumber(value) == image.yCoordHeaderFirstValue) { if (value > image.headerSetValue && getFirstDigitNumber(value) == image.yCoordHeaderFirstValue) {
return true; return true;
} }
return false; return false;
} }
export { round3, sumVect, findMax, setDataForCompleteChart, getFirstDigitNumber, isAnXHeader, isAnYHeader };