Skip to content

Commit 93bdabf

Browse files
isaachillyisaachilly
authored
Merge branch 'main' into feature/O2B-1492/Add-filtering-by-the-status-history-to-the-envs-filtering-panel
2 parents fddd637 + aace7a6 commit 93bdabf

13 files changed

Lines changed: 370 additions & 145 deletions

File tree

‎lib/public/components/Filters/LhcFillsFilter/StableBeamFilterModel.js‎

Lines changed: 76 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,76 @@
1+
/**
2+
* @license
3+
* Copyright CERN and copyright holders of ALICE Trg. This software is
4+
* distributed under the terms of the GNU General Public License v3 (GPL
5+
* Version 3), copied verbatim in the file "COPYING".
6+
*
7+
* See http://alice-Trg.web.cern.ch/license for full licensing information.
8+
*
9+
* In applying this license CERN does not waive the privileges and immunities
10+
* granted to it by virtue of its status as an Intergovernmental Organization
11+
* or submit itself to any jurisdiction.
12+
*/
13+
14+
import { SelectionModel } from '../../common/selection/SelectionModel.js';
15+
16+
/**
17+
* Stable beam filter model
18+
* Holds true or false value
19+
*/
20+
export class StableBeamFilterModel extends SelectionModel {
21+
/**
22+
* Constructor
23+
*/
24+
constructor() {
25+
super({ availableOptions: [{ value: true }, { value: false }],
26+
defaultSelection: [{ value: false }],
27+
multiple: false,
28+
allowEmpty: false });
29+
}
30+
31+
/**
32+
* Returns true if the current filter is stable beams only
33+
*
34+
* @return {boolean} true if filter is stable beams only
35+
*/
36+
isStableBeamsOnly() {
37+
return this.current;
38+
}
39+
40+
/**
41+
* Sets the current filter to stable beams only
42+
*
43+
* @param {boolean} value value to set this stable beams only filter with
44+
* @return {void}
45+
*/
46+
setStableBeamsOnly(value) {
47+
this.select({ value });
48+
}
49+
50+
/**
51+
* Get normalized selected option
52+
*/
53+
get normalized() {
54+
return this.current;
55+
}
56+
57+
/**
58+
* Overrides SelectionModel.isEmpty to respect the fact that stable beam filter cannot be empty.
59+
* @returns {boolean} true if the current value of the filter is false.
60+
*/
61+
get isEmpty() {
62+
return this.current === false;
63+
}
64+
65+
/**
66+
* Reset the filter to default values
67+
*
68+
* @return {void}
69+
*/
70+
resetDefaults() {
71+
if (!this.isEmpty) {
72+
this.reset();
73+
this.notify();
74+
}
75+
}
76+
}

‎lib/public/components/Filters/LhcFillsFilter/stableBeamFilter.js‎

Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
/**
2+
* @license
3+
* Copyright CERN and copyright holders of ALICE Trg. This software is
4+
* distributed under the terms of the GNU General Public License v3 (GPL
5+
* Version 3), copied verbatim in the file "COPYING".
6+
*
7+
* See http://alice-Trg.web.cern.ch/license for full licensing information.
8+
*
9+
* In applying this license CERN does not waive the privileges and immunities
10+
* granted to it by virtue of its status as an Intergovernmental Organization
11+
* or submit itself to any jurisdiction.
12+
*/
13+
14+
import { h } from '/js/src/index.js';
15+
import { switchInput } from '../../common/form/switchInput.js';
16+
import { radioButton } from '../../common/form/inputs/radioButton.js';
17+
18+
/**
19+
* Display a toggle switch or radio buttons to filter stable beams only
20+
*
21+
* @param {StableBeamFilterModel} stableBeamFilterModel the stableBeamFilterModel
22+
* @param {boolean} radioButtonMode define whether or not to return radio buttons or a switch.
23+
* @returns {Component} the toggle switch
24+
*/
25+
export const toggleStableBeamOnlyFilter = (stableBeamFilterModel, radioButtonMode = false) => {
26+
const name = 'stableBeamsOnlyRadio';
27+
const labelOff = 'OFF';
28+
const labelOn = 'ON';
29+
if (radioButtonMode) {
30+
return h('.form-group-header.flex-row.w-100', [
31+
radioButton({
32+
label: labelOff,
33+
isChecked: !stableBeamFilterModel.isStableBeamsOnly(),
34+
action: () => stableBeamFilterModel.setStableBeamsOnly(false),
35+
name: name,
36+
}),
37+
radioButton({
38+
label: labelOn,
39+
isChecked: stableBeamFilterModel.isStableBeamsOnly(),
40+
action: () => stableBeamFilterModel.setStableBeamsOnly(true),
41+
name: name,
42+
}),
43+
]);
44+
} else {
45+
return switchInput(stableBeamFilterModel.isStableBeamsOnly(), (newState) => {
46+
stableBeamFilterModel.setStableBeamsOnly(newState);
47+
}, { labelAfter: 'STABLE BEAM ONLY' });
48+
}
49+
};

‎lib/public/components/Filters/RunsFilter/dcs.js‎

Lines changed: 23 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@
1111
* or submit itself to any jurisdiction.
1212
*/
1313

14+
import { radioButton } from '../../common/form/inputs/radioButton.js';
1415
import { h } from '/js/src/index.js';
1516

1617
/**
@@ -20,33 +21,30 @@ import { h } from '/js/src/index.js';
2021
*/
2122
const dcsOperationRadioButtons = (runModel) => {
2223
const state = runModel.getDcsFilterOperation();
24+
const name = 'dcsFilterRadio';
25+
const labelAny = 'ANY';
26+
const labelOff = 'OFF';
27+
const labelOn = 'ON';
2328
return h('.form-group-header.flex-row.w-100', [
24-
radioButton('ANY', state === '', () => runModel.removeDcs()),
25-
radioButton('OFF', state === false, () => runModel.setDcsFilterOperation(false)),
26-
radioButton('ON', state === true, () => runModel.setDcsFilterOperation(true)),
29+
radioButton({
30+
label: labelAny,
31+
isChecked: state === '',
32+
action: () => runModel.removeDcs(),
33+
name,
34+
}),
35+
radioButton({
36+
label: labelOff,
37+
isChecked: state === false,
38+
action: () => runModel.setDcsFilterOperation(false),
39+
name,
40+
}),
41+
radioButton({
42+
label: labelOn,
43+
isChecked: state === true,
44+
action: () => runModel.setDcsFilterOperation(true),
45+
name,
46+
}),
2747
]);
2848
};
2949

30-
/**
31-
* Build a radio button with its configuration and actions
32-
* @param {string} label - label to be displayed to the user for radio button
33-
* @param {boolean} isChecked - is radio button selected or not
34-
* @param {Function} action - action to be followed on user click
35-
* @return {vnode} - radio button with label associated
36-
*/
37-
const radioButton = (label, isChecked, action) => h('.w-33.form-check', [
38-
h('input.form-check-input', {
39-
onchange: action,
40-
type: 'radio',
41-
id: `dcsFilterRadio${label}`,
42-
name: 'dcsFilterRadio',
43-
value: label,
44-
checked: isChecked,
45-
}, ''),
46-
h('label.form-check-label', {
47-
style: 'cursor: pointer;',
48-
for: `dcsFilterRadio${label}`,
49-
}, label),
50-
]);
51-
5250
export default dcsOperationRadioButtons;

‎lib/public/components/Filters/RunsFilter/ddflp.js‎

Lines changed: 23 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@
1111
* or submit itself to any jurisdiction.
1212
*/
1313

14+
import { radioButton } from '../../common/form/inputs/radioButton.js';
1415
import { h } from '/js/src/index.js';
1516

1617
/**
@@ -20,33 +21,30 @@ import { h } from '/js/src/index.js';
2021
*/
2122
const ddflpOperationRadioButtons = (runModel) => {
2223
const state = runModel.getDdflpFilterOperation();
24+
const name = 'ddFlpFilterRadio';
25+
const labelAny = 'ANY';
26+
const labelOff = 'OFF';
27+
const labelOn = 'ON';
2328
return h('.form-group-header.flex-row.w-100', [
24-
radioButton('ANY', state === '', () => runModel.removeDdflp()),
25-
radioButton('OFF', state === false, () => runModel.setDdflpFilterOperation(false)),
26-
radioButton('ON', state === true, () => runModel.setDdflpFilterOperation(true)),
29+
radioButton({
30+
label: labelAny,
31+
isChecked: state === '',
32+
action: () => runModel.removeDdflp(),
33+
name,
34+
}),
35+
radioButton({
36+
label: labelOff,
37+
isChecked: state === false,
38+
action: () => runModel.setDdflpFilterOperation(false),
39+
name,
40+
}),
41+
radioButton({
42+
label: labelOn,
43+
isChecked: state === true,
44+
action: () => runModel.setDdflpFilterOperation(true),
45+
name,
46+
}),
2747
]);
2848
};
2949

30-
/**
31-
* Build a radio button with its configuration and actions
32-
* @param {string} label - label to be displayed to the user for radio button
33-
* @param {boolean} isChecked - is radio button selected or not
34-
* @param {Function} action - action to be followed on user click
35-
* @return {vnode} - radio button with label associated
36-
*/
37-
const radioButton = (label, isChecked, action) => h('.w-33.form-check', [
38-
h('input.form-check-input', {
39-
onchange: action,
40-
type: 'radio',
41-
id: `ddFlpFilterRadio${label}`,
42-
name: 'ddFlpFilterRadio',
43-
value: label,
44-
checked: isChecked,
45-
}, ''),
46-
h('label.form-check-label', {
47-
style: 'cursor: pointer;',
48-
for: `ddFlpFilterRadio${label}`,
49-
}, label),
50-
]);
51-
5250
export default ddflpOperationRadioButtons;

‎lib/public/components/Filters/RunsFilter/epn.js‎

Lines changed: 23 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@
1111
* or submit itself to any jurisdiction.
1212
*/
1313

14+
import { radioButton } from '../../common/form/inputs/radioButton.js';
1415
import { h } from '/js/src/index.js';
1516

1617
/**
@@ -20,33 +21,30 @@ import { h } from '/js/src/index.js';
2021
*/
2122
const epnOperationRadioButtons = (runModel) => {
2223
const state = runModel.getEpnFilterOperation();
24+
const name = 'epnFilterRadio';
25+
const labelAny = 'ANY';
26+
const labelOff = 'OFF';
27+
const labelOn = 'ON';
2328
return h('.form-group-header.flex-row.w-100', [
24-
radioButton('ANY', state === '', () => runModel.removeEpn()),
25-
radioButton('OFF', state === false, () => runModel.setEpnFilterOperation(false)),
26-
radioButton('ON', state === true, () => runModel.setEpnFilterOperation(true)),
29+
radioButton({
30+
label: labelAny,
31+
isChecked: state === '',
32+
action: () => runModel.removeEpn(),
33+
name,
34+
}),
35+
radioButton({
36+
label: labelOff,
37+
isChecked: state === false,
38+
action: () => runModel.setEpnFilterOperation(false),
39+
name,
40+
}),
41+
radioButton({
42+
label: labelOn,
43+
isChecked: state === true,
44+
action: () => runModel.setEpnFilterOperation(true),
45+
name,
46+
}),
2747
]);
2848
};
2949

30-
/**
31-
* Build a radio button with its configuration and actions
32-
* @param {string} label - label to be displayed to the user for radio button
33-
* @param {boolean} isChecked - is radio button selected or not
34-
* @param {Function} action - action to be followed on user click
35-
* @return {vnode} - radio button with label associated
36-
*/
37-
const radioButton = (label, isChecked, action) => h('.w-33.form-check', [
38-
h('input.form-check-input', {
39-
onchange: action,
40-
type: 'radio',
41-
id: `epnFilterRadio${label}`,
42-
name: 'epnFilterRadio',
43-
value: label,
44-
checked: isChecked,
45-
}, ''),
46-
h('label.form-check-label', {
47-
style: 'cursor: pointer;',
48-
for: `epnFilterRadio${label}`,
49-
}, label),
50-
]);
51-
5250
export default epnOperationRadioButtons;

‎lib/public/components/common/form/inputs/radioButton.js‎

Lines changed: 61 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
/**
2+
* @license
3+
* Copyright CERN and copyright holders of ALICE Trg. This software is
4+
* distributed under the terms of the GNU General Public License v3 (GPL
5+
* Version 3), copied verbatim in the file "COPYING".
6+
*
7+
* See http://alice-Trg.web.cern.ch/license for full licensing information.
8+
*
9+
* In applying this license CERN does not waive the privileges and immunities
10+
* granted to it by virtue of its status as an Intergovernmental Organization
11+
* or submit itself to any jurisdiction.
12+
*/
13+
14+
import { h } from '/js/src/index.js';
15+
16+
/**
17+
* @typedef RadioButtonConfigStyle
18+
* @property {string} labelStyle - value for the label's style property.
19+
* @property {string} radioButtonStyle - value for the radio button's element styling.
20+
*/
21+
22+
/**
23+
* @typedef RadioButtonConfig - configuration object for radioButton.
24+
*
25+
* @property {string} label - label to be displayed to the user for radio button
26+
* @property {boolean} isChecked - is radio button selected or not
27+
* @property {function()} action - action to be followed on user click
28+
* @property {string} id - id of the radiobutton element
29+
* @property {string} name - name of the radiobutton element
30+
* @property {RadioButtonConfigStyle} style - label style property
31+
*/
32+
33+
/**
34+
* Build a radio button with its configuration and actions
35+
* @param {RadioButtonConfig} configuration - configuration object for radioButton.
36+
* @return {vnode} - radio button with associated label.
37+
*/
38+
export const radioButton = (configuration = {}) => {
39+
const {
40+
label = '',
41+
isChecked = false,
42+
action = () => { },
43+
name = '',
44+
id = `${name}${label}`,
45+
style = { labelStyle: 'cursor: pointer;', radioButtonStyle: '.w-33' },
46+
} = configuration;
47+
return h(`${style.radioButtonStyle}.form-check`, [
48+
h('input.form-check-input', {
49+
onchange: action,
50+
type: 'radio',
51+
id,
52+
name,
53+
value: label,
54+
checked: isChecked,
55+
}),
56+
h('label.form-check-label', {
57+
style: style.labelStyle,
58+
for: id,
59+
}, label),
60+
]);
61+
};

0 commit comments

Comments
 (0)