This was incredibly helpful, I'd love for Sisense community to create more guides like this one.
I didn't want quarters included, so I had to remove it from both the BloX code and widget script. In the widget script, you need to make sure when removing Quarters you adjust the textOfButtonToFormat[1,2,3] of Days, Weeks, and Months to keep the logic. Here's what mine looks like:
var ChooseYourUnselectColor = '#D3D3D3'; //Unselected Color
var ChooseYourSelectedColor = '#1D426C'; //Selected Color
var widgetID = '651c59b817a37800334e1cb2'; //Current Widget which runs this script
widget.on('ready',function(widget, args){
var widgetOID = widgetID;
//Get the selected date granularity
var widget = prism.activeDashboard.widgets.$$widgets.find(w => w.oid === widgetOID)
if(widget.metadata.panels[0].items[0].jaql.level == 'months'){
var textOfButtonToFormat1 = 'Weeks';
var textOfButtonToFormat2 = 'Days';
var selectedButton = 'Months';
$('button.btn:contains('+textOfButtonToFormat1+')').css({
transition : 'background-color 50ms ease-in-out', "background-color": ChooseYourUnselectColor, "pointer-events": "auto"
});
$('button.btn:contains('+textOfButtonToFormat2+')').css({
transition : 'background-color 50ms ease-in-out', "background-color": ChooseYourUnselectColor, "pointer-events": "auto"
});
$('button.btn:contains('+selectedButton+')').css({
transition : 'background-color 50ms ease-in-out', "background-color": ChooseYourSelectedColor, "pointer-events": "none"
});
}
if(widget.metadata.panels[0].items[0].jaql.level == 'weeks'){
var textOfButtonToFormat1 = 'Months';
var textOfButtonToFormat2 = 'Days';
var selectedButton = 'Weeks';
$('button.btn:contains('+textOfButtonToFormat1+')').css({
transition : 'background-color 50ms ease-in-out', "background-color": ChooseYourUnselectColor, "pointer-events": "auto"
});
$('button.btn:contains('+textOfButtonToFormat2+')').css({
transition : 'background-color 50ms ease-in-out', "background-color": ChooseYourUnselectColor, "pointer-events": "auto"
});
$('button.btn:contains('+selectedButton+')').css({
transition : 'background-color 50ms ease-in-out', "background-color": ChooseYourSelectedColor, "pointer-events": "none"
});
}
if(widget.metadata.panels[0].items[0].jaql.level == 'days'){
var textOfButtonToFormat1 = 'Months';
var textOfButtonToFormat2 = 'Weeks';
var selectedButton = 'Days';
$('button.btn:contains('+textOfButtonToFormat1+')').css({
transition : 'background-color 50ms ease-in-out', "background-color": ChooseYourUnselectColor, "pointer-events": "auto"
});
$('button.btn:contains('+textOfButtonToFormat2+')').css({
transition : 'background-color 50ms ease-in-out', "background-color": ChooseYourUnselectColor, "pointer-events": "auto"
});
$('button.btn:contains('+selectedButton+')').css({
transition : 'background-color 50ms ease-in-out', "background-color": ChooseYourSelectedColor, "pointer-events": "none"
});
}
});
