diff --git a/js/app/views/PlotComponents/plotFunction/BaseComponent.js b/js/app/views/PlotComponents/plotFunction/BaseComponent.js
new file mode 100644
index 0000000..4ac2d9e
--- /dev/null
+++ b/js/app/views/PlotComponents/plotFunction/BaseComponent.js
@@ -0,0 +1,13 @@
+// Define the base class
+Ext.define('amdaPlotComp.plotFunction.BaseComponent', {
+ extend: 'Ext.form.FieldSet',
+
+ /**
+ * Subclasses are expected to implement this method to retrieve values.
+ * @returns {Object} The values.
+ * @throws {Error} If the method is not implemented.
+ */
+ getValues: function () {
+ throw new Error('getValues() method must be implemented by subclass');
+ }
+});
diff --git a/js/app/views/PlotComponents/plotFunction/FFTCmpt.js b/js/app/views/PlotComponents/plotFunction/FFTCmpt.js
new file mode 100644
index 0000000..125dd52
--- /dev/null
+++ b/js/app/views/PlotComponents/plotFunction/FFTCmpt.js
@@ -0,0 +1,45 @@
+Ext.define('amdaPlotComp.plotFunction.FFTCmpt', {
+ extend: 'amdaPlotComp.plotFunction.BaseComponent',
+ title: "FFT Arguments",
+ id: 'fftComboBox',
+
+ initComponent: function () {
+ const me = this;
+
+ // Define combo box store
+ const comboStore = Ext.create('Ext.data.Store', {
+ fields: ['label', 'value'],
+ data: [
+ { label: 'Frequency', value: 'Frequency' },
+ { label: 'Period', value: 'Period' }
+ ]
+ });
+
+ // Create combo box
+ const fftCombo = Ext.create('Ext.form.field.ComboBox', {
+ itemId: me.id, // Add itemId here
+ fieldLabel: 'Abscisse',
+ store: comboStore,
+ queryMode: 'local',
+ displayField: 'label',
+ valueField: 'value',
+ editable: false,
+ value: 'Frequency'
+ });
+
+ // Assign items to the component
+ me.items = [fftCombo];
+
+ // Call the parent class's initComponent method
+ me.callParent(arguments);
+ },
+
+ getValues: function () {
+ const fftComboBox = this.down('#'+this.id); // Retrieve ComboBox by itemId
+ const selectedValue = fftComboBox.getValue(); // Get selected value
+
+ return {
+ abscisse: selectedValue
+ };
+ }
+});
diff --git a/js/app/views/PlotComponents/plotFunction/FunctionType copy.js b/js/app/views/PlotComponents/plotFunction/FunctionType copy.js
new file mode 100644
index 0000000..d17da1d
--- /dev/null
+++ b/js/app/views/PlotComponents/plotFunction/FunctionType copy.js
@@ -0,0 +1,247 @@
+/**
+ * Un composant de 'PlotFunction' qui permet à l'utilisateur de séléctionner le type de fonction à appliquer : FFT, SUM, ...
+ */
+Ext.define('amdaPlotComp.plotFunction.FunctionType', {
+ extend: 'Ext.form.Panel',
+
+ plotFunctionItems: {
+ type: {
+ name: "type",
+ field: "Function Type",
+ values: {
+ fft: "FFT",
+ dft: "DFT",
+ sum: "SUM",
+ avg: "AVG",
+ hist: "Histogram"
+ },
+ labels: {
+ fft: "FFT (Magnitude^2)",
+ dft: "DFT (Magnitude^2)",
+ sum: "SUM",
+ avg: "AVG",
+ hist: "Histogram Plot"
+ }
+ },
+ scale: {
+ name: "scale_abscisse",
+ field: "X-Axis Scale",
+ values: {
+ log: "logarithmic",
+ linear: "linear",
+ inherits: "Inherits"
+ }
+ },
+ abscisse: {
+ name: "abscisse",
+ field: "Abscisse",
+ values: {
+ frequency: "Frequency",
+ period: "Period"
+ }
+ },
+ scale_ordonnee: {
+ name: "scale_ordonnee",
+ field: "Y-Axis Scale"
+ },
+ // For histogram plot
+ histogram: {
+ x_min: {
+ name: "x_min",
+ filed:"X Min"
+ },
+ x_max: {
+ name: "x_max",
+ filed:"X Max"
+ },
+ bins: {
+ name: "bins",
+ filed:"Nb. of bins"
+ },
+ function:{
+ name: "function",
+ filed: "Function to apply",
+ values: {
+ density: "density",
+ normalised_density: "normalised_density"
+ },
+ labels: {
+ density: "Density",
+ normalised_density: "Normalised Density"
+ }
+ }
+
+
+
+ }
+ },
+
+ initComponent: function () {
+ const key_ = "key";
+ const name_ = "name";
+
+ //Combobox to choose the type of fucntion to be applied
+ const data_function_type = [];
+ let item_type = {};
+ item_type[key_] = this.plotFunctionItems.type.values.fft;
+ item_type[name_] = this.plotFunctionItems.type.labels.fft;
+ data_function_type.push(item_type);
+ item_type = {};
+ item_type[key_] = this.plotFunctionItems.type.values.dft;
+ item_type[name_] = this.plotFunctionItems.type.labels.dft;
+ // Disbale DFT momentarily
+ data_function_type.push(item_type);
+
+ item_type = {};
+ item_type[key_] = this.plotFunctionItems.type.values.sum;
+ item_type[name_] = this.plotFunctionItems.type.labels.sum;
+ data_function_type.push(item_type);
+ item_type = {};
+ item_type[key_] = this.plotFunctionItems.type.values.avg;
+ item_type[name_] = this.plotFunctionItems.type.labels.avg;
+ data_function_type.push(item_type);
+
+ const function_type = Ext.create('Ext.data.Store', {
+ fields: [key_, name_],
+ data: data_function_type
+ });
+
+ //Combo to choose type of scaling
+ const data_ = [];
+ const item_inherits = {};
+ item_inherits[key_] = this.plotFunctionItems.scale.values.inherits;
+ item_inherits[name_] = this.plotFunctionItems.scale.values.inherits;
+ // Disbale inherits momentarily
+ //data_.push(item_inherits);
+
+ const item_log = {};
+ item_log[key_] = this.plotFunctionItems.scale.values.log;
+ item_log[name_] = this.plotFunctionItems.scale.values.log;
+ data_.push(item_log);
+
+ const item_linear = {};
+ item_linear[key_] = this.plotFunctionItems.scale.values.linear;
+ item_linear[name_] = this.plotFunctionItems.scale.values.linear;
+ data_.push(item_linear);
+
+ const scale = Ext.create('Ext.data.Store', {
+ fields: [key_, name_],
+ data: data_
+ });
+
+ //Combo to choose x type data of FFT
+ const data__ = [];
+ const item_frequency = {};
+ item_frequency[key_] = this.plotFunctionItems.abscisse.values.frequency;
+ item_frequency[name_] = this.plotFunctionItems.abscisse.values.frequency;
+ data__.push(item_frequency);
+
+ const item_period = {};
+ item_period[key_] = this.plotFunctionItems.abscisse.values.period;
+ item_period[name_] = this.plotFunctionItems.abscisse.values.period;
+ data__.push(item_period);
+
+ const abscisse = Ext.create('Ext.data.Store', {
+ fields: [key_, name_],
+ data: data__
+ });
+
+ const me = this;
+
+ var tabParams = Ext.create('Ext.form.FieldSet', {
+ collapsible: false,
+ layout: {
+ type: 'vbox',
+ pack: 'start',
+ align: 'stretch',
+ },
+ bodyStyle: 'background: none',
+ items: [
+ {
+ xtype: 'combo',
+ fieldLabel: this.plotFunctionItems.type.field,
+ store: function_type,
+ queryMode: 'local',
+ displayField: name_,
+ valueField: key_,
+ editable: false,
+ value: this.plotFunctionItems.type.values.sum,
+ name: this.plotFunctionItems.type.name,
+ listeners: {
+ change: function (combo, value) {
+ if (value === me.plotFunctionItems.type.values.fft || value === me.plotFunctionItems.type.values.dft) {
+ me.getForm().findField(me.plotFunctionItems.abscisse.name).setVisible(true);
+ }
+ else {
+ me.getForm().findField(me.plotFunctionItems.abscisse.name).setVisible(false);
+ }
+ }
+ }
+ },
+ {
+ xtype: 'combo',
+ fieldLabel: this.plotFunctionItems.scale.field,
+ store: scale,
+ queryMode: 'local',
+ displayField: name_,
+ valueField: key_,
+ editable: false,
+ value: this.plotFunctionItems.scale.values.log,
+ name: this.plotFunctionItems.scale.name
+ },
+ {
+ xtype: 'combo',
+ fieldLabel: this.plotFunctionItems.abscisse.field,
+ store: abscisse,
+ queryMode: 'local',
+ displayField: name_,
+ valueField: key_,
+ editable: false,
+ hidden: true,
+ value: this.plotFunctionItems.abscisse.values.frequency,
+ name: this.plotFunctionItems.abscisse.name
+ },
+ {
+ xtype: 'combo',
+ fieldLabel: this.plotFunctionItems.scale_ordonnee.field,
+ store: scale,
+ queryMode: 'local',
+ displayField: name_,
+ valueField: key_,
+ editable: false,
+ value: this.plotFunctionItems.scale.values.log,
+ name: this.plotFunctionItems.scale_ordonnee.name
+ }
+ ]
+ });
+
+ const config =
+ {
+ title: 'Function Type',
+ bodyStyle: { background: '#dfe8f6' },
+ items: [tabParams]
+ };
+
+ Ext.apply(this, config);
+ this.callParent(arguments);
+ },
+
+ /**
+ * Retournes les valeurs des comboboxes associées à ce composant
+ * @returns les valeurs des comboboxes se forme d'un dictionnaire
+ */
+ getValues: function () {
+ const value_scale = this.getForm().findField(this.plotFunctionItems.scale.name).getValue();
+ const value_abscisse = this.getForm().findField(this.plotFunctionItems.abscisse.name).getValue();
+ const value_scale_ordonnee = this.getForm().findField(this.plotFunctionItems.scale_ordonnee.name).getValue();
+ const type_function = this.getForm().findField(this.plotFunctionItems.type.name).getValue();
+
+ let out = {};
+ out[this.plotFunctionItems.type.name] = type_function;
+ out[this.plotFunctionItems.abscisse.name] = value_abscisse;
+ out[this.plotFunctionItems.scale.name] = value_scale;
+ out[this.plotFunctionItems.scale_ordonnee.name] = value_scale_ordonnee;
+
+ return out;
+ }
+});
\ No newline at end of file
diff --git a/js/app/views/PlotComponents/plotFunction/FunctionType.js b/js/app/views/PlotComponents/plotFunction/FunctionType.js
index 7e9e61a..873d554 100644
--- a/js/app/views/PlotComponents/plotFunction/FunctionType.js
+++ b/js/app/views/PlotComponents/plotFunction/FunctionType.js
@@ -3,120 +3,98 @@
*/
Ext.define('amdaPlotComp.plotFunction.FunctionType', {
extend: 'Ext.form.Panel',
-
- plotFunctionItems: {
- type: {
- name: "type",
- field: "Function Type",
- values: {
- fft: "FFT",
- dft: "DFT",
- sum: "SUM",
- avg: "AVG"
- },
- labels: {
- fft: "FFT (Magnitude^2)",
- dft: "DFT (Magnitude^2)",
- sum: "SUM",
- avg: "AVG"
- }
- },
- scale: {
- name: "scale_abscisse",
- field: "X-Axis Scale",
- values: {
- log: "logarithmic",
- linear: "linear",
- inherits: "Inherits"
- }
- },
- abscisse: {
- name: "abscisse",
- field: "Abscisse",
- values: {
- frequency: "Frequency",
- period: "Period"
- }
- },
- scale_ordonnee: {
- name: "scale_ordonnee",
- field: "Y-Axis Scale"
- }
+
+ view: null,
+ currentModule: null,
+
+ functionComboBox: "type",
+ x_axis: { label: "X Axis", value: "scale_abscisse" },
+ y_axis: { label: "Y Axis", value: "scale_ordonnee" },
+ scaleOptions: {
+ linear: { label: "Linear", value: "linear" },
+ logarithmic: { label: "Logarithmic", value: "logarithmic" }
+ },
+ functionOptions: {
+ fft: { label: "FFT (Magnitude^2)", value: "FFT" },
+ dft: { label: "DFT (Magnitude^2)", value: "DFT" },
+ sum: { label: "SUM", value: "SUM" },
+ avg: { label: "AVG", value: "AVG" },
+ hist: { label: "Histogram Plot", value: "histogram_plot" }
},
- initComponent: function () {
- const key_ = "key";
- const name_ = "name";
-
- //Combobox to choose the type of fucntion to be applied
- const data_function_type = [];
- let item_type = {};
- item_type[key_] = this.plotFunctionItems.type.values.fft;
- item_type[name_] = this.plotFunctionItems.type.labels.fft;
- data_function_type.push(item_type);
- item_type = {};
- item_type[key_] = this.plotFunctionItems.type.values.dft;
- item_type[name_] = this.plotFunctionItems.type.labels.dft;
- // Disbale DFT momentarily
- data_function_type.push(item_type);
-
- item_type = {};
- item_type[key_] = this.plotFunctionItems.type.values.sum;
- item_type[name_] = this.plotFunctionItems.type.labels.sum;
- data_function_type.push(item_type);
- item_type = {};
- item_type[key_] = this.plotFunctionItems.type.values.avg;
- item_type[name_] = this.plotFunctionItems.type.labels.avg;
- data_function_type.push(item_type);
-
- const function_type = Ext.create('Ext.data.Store', {
- fields: [key_, name_],
- data: data_function_type
+ createFunctionComboBox: function (defaultSelection) {
+ const self = this;
+ const comboStore = Ext.create('Ext.data.Store', {
+ fields: ['label', 'value'],
+ data: Object.values(this.functionOptions)
});
- //Combo to choose type of scaling
- const data_ = [];
- const item_inherits = {};
- item_inherits[key_] = this.plotFunctionItems.scale.values.inherits;
- item_inherits[name_] = this.plotFunctionItems.scale.values.inherits;
- // Disbale inherits momentarily
- //data_.push(item_inherits);
-
- const item_log = {};
- item_log[key_] = this.plotFunctionItems.scale.values.log;
- item_log[name_] = this.plotFunctionItems.scale.values.log;
- data_.push(item_log);
-
- const item_linear = {};
- item_linear[key_] = this.plotFunctionItems.scale.values.linear;
- item_linear[name_] = this.plotFunctionItems.scale.values.linear;
- data_.push(item_linear);
-
- const scale = Ext.create('Ext.data.Store', {
- fields: [key_, name_],
- data: data_
+ const combo = Ext.create('Ext.form.field.ComboBox', {
+ fieldLabel: 'Function',
+ store: comboStore,
+ queryMode: 'local',
+ displayField: 'label',
+ valueField: 'value',
+ editable: false,
+ name: this.functionComboBox,
+ value: defaultSelection || Object.values(this.functionOptions)[2].value, // Default value
+ listeners: {
+ change: function (combo, value) {
+ self.handleFunction(value);
+ }
+ }
+ });
+
+ return combo;
+ },
+
+ createAxisComboBox: function (axis) {
+ const comboStore = Ext.create('Ext.data.Store', {
+ fields: ['label', 'value'],
+ data: Object.values(this.scaleOptions)
});
- //Combo to choose x type data of FFT
- const data__ = [];
- const item_frequency = {};
- item_frequency[key_] = this.plotFunctionItems.abscisse.values.frequency;
- item_frequency[name_] = this.plotFunctionItems.abscisse.values.frequency;
- data__.push(item_frequency);
-
- const item_period = {};
- item_period[key_] = this.plotFunctionItems.abscisse.values.period;
- item_period[name_] = this.plotFunctionItems.abscisse.values.period;
- data__.push(item_period);
-
- const abscisse = Ext.create('Ext.data.Store', {
- fields: [key_, name_],
- data: data__
+ const combo = Ext.create('Ext.form.field.ComboBox', {
+ fieldLabel: axis.label,
+ store: comboStore,
+ queryMode: 'local',
+ displayField: 'label',
+ valueField: 'value',
+ editable: false,
+ name: axis.value,
+ value: Object.values(this.scaleOptions)[0].value // Default value
});
- const me = this;
+ return combo;
+ },
+
+
+ handleFunction: function (value) {
+ if (this.currentModule) {
+ this.view.remove(this.currentModule, true);
+ this.currentModule = null;
+ }
+
+ switch (value) {
+ case this.functionOptions.fft.value:
+ this.currentModule = Ext.create('amdaPlotComp.plotFunction.FFTCmpt');
+ break;
+ case this.functionOptions.dft.value:
+ this.currentModule = Ext.create('amdaPlotComp.plotFunction.FFTCmpt', { title: "DFT Arguments" });
+ break;
+ case this.functionOptions.hist.value:
+ this.currentModule = Ext.create('amdaPlotComp.plotFunction.Histogram');
+ break;
+ default:
+ break;
+ }
+ if (this.currentModule)
+ this.view.add(this.currentModule);
+ },
+
- var tabParams = Ext.create('Ext.form.FieldSet', {
+ initComponent: function () {
+ this.view = Ext.create('Ext.form.FieldSet', {
collapsible: false,
layout: {
type: 'vbox',
@@ -124,70 +102,14 @@ Ext.define('amdaPlotComp.plotFunction.FunctionType', {
align: 'stretch',
},
bodyStyle: 'background: none',
- items: [
- {
- xtype: 'combo',
- fieldLabel: this.plotFunctionItems.type.field,
- store: function_type,
- queryMode: 'local',
- displayField: name_,
- valueField: key_,
- editable: false,
- value: this.plotFunctionItems.type.values.sum,
- name: this.plotFunctionItems.type.name,
- listeners: {
- change: function (combo, value) {
- if (value === me.plotFunctionItems.type.values.fft || value === me.plotFunctionItems.type.values.dft) {
- me.getForm().findField(me.plotFunctionItems.abscisse.name).setVisible(true);
- }
- else {
- me.getForm().findField(me.plotFunctionItems.abscisse.name).setVisible(false);
- }
- }
- }
- },
- {
- xtype: 'combo',
- fieldLabel: this.plotFunctionItems.scale.field,
- store: scale,
- queryMode: 'local',
- displayField: name_,
- valueField: key_,
- editable: false,
- value: this.plotFunctionItems.scale.values.log,
- name: this.plotFunctionItems.scale.name
- },
- {
- xtype: 'combo',
- fieldLabel: this.plotFunctionItems.abscisse.field,
- store: abscisse,
- queryMode: 'local',
- displayField: name_,
- valueField: key_,
- editable: false,
- hidden: true,
- value: this.plotFunctionItems.abscisse.values.frequency,
- name: this.plotFunctionItems.abscisse.name
- },
- {
- xtype: 'combo',
- fieldLabel: this.plotFunctionItems.scale_ordonnee.field,
- store: scale,
- queryMode: 'local',
- displayField: name_,
- valueField: key_,
- editable: false,
- value: this.plotFunctionItems.scale.values.log,
- name: this.plotFunctionItems.scale_ordonnee.name
- }
- ]
+ items: [this.createFunctionComboBox(), this.createAxisComboBox(this.x_axis), this.createAxisComboBox(this.y_axis)]
});
const config =
{
- title: 'Function Type',
+ title: 'Function To Apply',
bodyStyle: { background: '#dfe8f6' },
- items: [tabParams]
+ items: [this.view]
};
Ext.apply(this, config);
@@ -199,16 +121,19 @@ Ext.define('amdaPlotComp.plotFunction.FunctionType', {
* @returns les valeurs des comboboxes se forme d'un dictionnaire
*/
getValues: function () {
- const value_scale = this.getForm().findField(this.plotFunctionItems.scale.name).getValue();
- const value_abscisse = this.getForm().findField(this.plotFunctionItems.abscisse.name).getValue();
- const value_scale_ordonnee = this.getForm().findField(this.plotFunctionItems.scale_ordonnee.name).getValue();
- const type_function = this.getForm().findField(this.plotFunctionItems.type.name).getValue();
-
+ const xAxisScale = this.getForm().findField(this.x_axis.value).getValue();
+ const yAxisScale = this.getForm().findField(this.y_axis.value).getValue();
+ const functionType = this.getForm().findField(this.functionComboBox).getValue();
let out = {};
- out[this.plotFunctionItems.type.name] = type_function;
- out[this.plotFunctionItems.abscisse.name] = value_abscisse;
- out[this.plotFunctionItems.scale.name] = value_scale;
- out[this.plotFunctionItems.scale_ordonnee.name] = value_scale_ordonnee;
+ out[this.functionComboBox] = functionType;
+ out[this.x_axis.value] = xAxisScale;
+ out[this.y_axis.value] = yAxisScale;
+
+ const values = this.currentModule.getValues();
+
+ // Adding values to out
+ Object.assign(out, values);
+ console.log(out);
return out;
}
diff --git a/js/app/views/PlotComponents/plotFunction/Histogram.js b/js/app/views/PlotComponents/plotFunction/Histogram.js
new file mode 100644
index 0000000..c120e27
--- /dev/null
+++ b/js/app/views/PlotComponents/plotFunction/Histogram.js
@@ -0,0 +1,45 @@
+Ext.define('amdaPlotComp.plotFunction.Histogram', {
+ extend: 'amdaPlotComp.plotFunction.BaseComponent',
+ title: "Histogram Arguments",
+
+
+ items: [
+ {
+ xtype: 'numberfield',
+ fieldLabel: 'X Min',
+ name: 'xMin',
+ allowDecimals: true, // This allows decimal numbers
+ hideTrigger: true, // Hides the spinner buttons
+ keyNavEnabled: false, // Disables keyboard navigation for precision
+ },
+ {
+ xtype: 'numberfield',
+ fieldLabel: 'X Max',
+ name: 'xMax',
+ allowDecimals: true, // This allows decimal numbers
+ hideTrigger: true, // Hides the spinner buttons
+ keyNavEnabled: false, // Disables keyboard navigation for precision
+ },
+ {
+ xtype: 'numberfield',
+ fieldLabel: 'Number of Bins',
+ name: 'numBins',
+ minValue: 1,
+ value: 100,
+ allowDecimals: false, // This ensures only integers are allowed
+ keyNavEnabled: false, // Disables keyboard navigation for precision
+ },
+ {
+ xtype: 'combo',
+ fieldLabel: 'Density Type',
+ name: 'densityType',
+ store: ['Density', 'Normalized Density'],
+ value: 'Density' // Set 'Density' as default
+ }
+ ],
+
+ getValues: function () {
+
+ }
+
+});
--
libgit2 0.21.2