asked on August 15, 2017
Hello,
Yesterday I did the component upgrade, migrating from version 234 to 2.40 build 08/08/2017 10:58:43, but my custom toolbar did not load correctly.
Follow code below:
pivot = $("#pivotContainer").flexmonster({
componentFolder: "/Content/js/flexmonster/",
global: {
localization: "loc/pr.json"
},
height:"100%",
toolbar: true,
beforetoolbarcreated: customizeToolbar,
licenseKey: "XXXXXX-XXXXXXX"
});
var customizeToolbar = function(toolbar) {
var tabs = toolbar.getTabs();
toolbar.getTabs = function() {
delete tabs[0];
delete tabs[1];
delete tabs[2];
// add new tab
tabs.unshift({
id: "fm-tab-save",
title: "Save",
handler: "savetabHandler"
});
tabs.unshift({
id: "fm-tab-reload",
title: "Reload",
handler: "reloadCube"
});
return tabs;
}
toolbar.reloadCube = function() {
console.log("reload");
}
toolbar.savetabHandler = function() {
console.log("save")
}
}
⋅ August 16, 2017
Toolbar in old version
⋅ August 17, 2017
Hello Cleyton,
Thank you for writing to us.
The toolbar was changed in 2.4 version and I need to ask you to update your toolbar customization accordingly.
The icons were changed in 2.4. Now they are vector and if you like them please add icon property to your custom tabs in customizeToolbar function, as follows:
// add new tab
tabs.unshift({
id: "fm-tab-save",
title: "Save",
handler: "savetabHandler",
icon: this.icons.save
});
tabs.unshift({
id: "fm-tab-reload",
title: "Reload",
handler: "reloadCube",
icon: this.icons.connect
});
And please remove CSS with old icons in this case.
Also, the order of tabs was changed. If you like the current order, no changes are needed in your customizeToolbar function. If you would like to use the 2.4 toolbar with the old order of the tabs, please compose it in redefined toolbar.getTabs() function, as follows:
var customizeToolbar = function(toolbar) {
var tabs = toolbar.getTabs();
toolbar.getTabs = function() {
var newTabs = [];
// add new tab
newTabs.push({
id: "fm-tab-reload",
title: "Reload",
handler: "reloadCube",
icon: this.icons.connect
});
newTabs.push({
id: "fm-tab-save",
title: "Save",
handler: "savetabHandler",
icon: this.icons.save
});
newTabs.push(tabs[5]); //grid
newTabs.push(tabs[6]); //charts
//... etc
return newTabs;
}
//...
}
Please let me know if the toolbar looks as you expected after the changes.
Kind regards,
Iryna