How to: Set the default controls on the dashboard - akumina/AkuminaTraining GitHub Wiki

Applies to

Akumina Foundation 4.0.1802.0159 and later

Overview

There may be cases where you would like to automatically add default Dashboard widgets to the Dashboard page so it is already populated when a user FIRST accesses their Dashboard. The following steps and code can be used to enable that capability and specify which widgets to add, and in what position, by default.

NOTE: Once a user accesses their dashboard page for the first time, and the default widgets are applied, this code will no longer have any impact. Any changes the user makes to their dashboard from that point forward will be maintained, including if they remove the original default widgets.

How to Deploy

1. Download digitalworkplace.custom.js from the “/Style Library/DigitalWorkplace/JS” folder within SharePoint
2. Paste the Code within digitalworkplace.custom.js
3. Upload the updated digitalworkplace.custom.js to the “/Style Library/DigitalWorkplace/JS” folder within SharePoint
4. Navigate to a page on your Akumina Foundation site
5. Flush your cache by clicking on the Akumina icon in the left rail, clicking the refresh icon, then clicking “Refresh All Cache”
6. Refresh the page. The alert should fire. Inspect the page and enter Akumina.Digispace.UserContext.MyCustomProperty into the console to view your property

Code

var AdditionalSteps = AdditionalSteps || {
}

if ((typeof AdditionalSteps.MoreSteps) === 'undefined') {

    AdditionalSteps.MoreSteps = {

        Init: function () {
            console.log('AdditionalSteps.MoreSteps.Init');  

            var steps = [];

            // run step before the provision dashboard step
            steps.push({ stepName: "Auto Clear Local Cache", additionalSteps: [{ name: "Set dashboard defaults", callback: SetDashboardDefaultControls}] });

            return steps;
        }       
    }
}

function SetDashboardDefaultControls() {
    // create the containers, these correspond to the zones in the dashboard layout
    var containers = { "pagebuilderseconddiv": [],"pagebuilderthirddiv": [], };

    // set the my favorites in the left side
    containers.pagebuilderseconddiv.push({
        "Title": "MyFavorites", "Id": "836dfe17-3dd1-4b0e-bc05-a2035e8eae81", "x": 0, "y": 0, "width": 11, "height": 8
    });

    // set the TBD control on the right side
    containers.pagebuilderthirddiv.push({
        "Title": "Something else", "Id": "0000000000-0000-0000-0000-0000000000", "x": 0, "y": 0, "width": 11, "height": 8
    });

    Akumina.Digispace.ConfigurationContext.DashboardWidgetsMap = containers;
               
    /Move on to next step
    Akumina.Digispace.AppPart.Eventing.Publish('/loader/onexecuted/');
}

Result

For a new user, go to the dashboard page and you will see the controls specified above.

References

To learn how to customize the Page Life Cycle using the Akumina Framework see the following articles: Page Life Cycle Overview