Page Life Cycle: Adding Custom Steps (3.3.0.0) - akumina/AkuminaTraining GitHub Wiki

THE INFORMATION IN THIS ARTICLE IS OBSOLETE AS OF 3.4.0.0

Applies to

Digital Workplace 3.3.0.0

Adding Custom Steps

Akumina.Digispace.AddStepsAfter

In our code, we can add a custom step after a core step using the format below

Akumina.Digispace.Loader.AddStepsAfter("<CoreStepName>", [{ name: "<NewStepName>", callback: <NewStepFunction> }]);

CoreStepName

Replace this with the name of the Core Step you are adding after, ie “Auto Clear Local Cache”. They are listed under the Core Steps section.

NewStepName

Replace this with the name of your new step

NewStepFunction

Replace this with the name of the function that executes your step code.

Chaining Steps

Akumina.Digispace.Loader.AddStepsAfter("Auto Clear Local Cache", [{ name: "My First Step", callback: MyFirstStep }]);

Akumina.Digispace.Loader.AddStepsAfter("Auto Clear Local Cache", [{ name: "My Second Step", callback: MySecondStep }]);

The situation above where we add two new steps after the same step will not work. When this happens the second step added will overwrite the first. The correct way to handle this situation is to “chain” these steps, by adding the second step after the newly added first step, as shown below.

Akumina.Digispace.Loader.AddStepsAfter("Auto Clear Local Cache", [{ name: "My First Step", callback: MyFirstStep }]);

Akumina.Digispace.Loader.AddStepsAfter("My First Step", [{ name: "My Second Step", callback: MySecondStep }]);

Note: If you are doing customizations on a Digital Workplace Site you must take note of the Shipped Site Steps when adding new custom step. These steps are incorporated by Akumina.Digispace.Loader.AddStepsAfter and you need to be careful not to overwrite them when adding additional steps.

AdditionalSteps Object

In our digitalworkplace.custom.js we will need to create an AdditionalSteps object that will initialize our custom steps in the Page Life Cycle.

var AdditionalSteps = AdditionalSteps || {}

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

    AdditionalSteps.MoreSteps = {

        Init: function () {
            	console.log('AdditionalSteps.MoreSteps.Init');    
	//Add Custom Steps Here
        }        
    }
}

var AdditionalSteps = AditionalSteps || {}

This line calls the Init function of all objects grouped under AdditionalSteps

if ((typeof AdditionalSteps.MoreSteps) === ‘undefined’)

This defines the AdditionalSteps.MoreSteps object. We can create additional objects under AdditionalSteps called whatever we want, ie AdditionalSteps.MyAdvancedSteps, AdditionalSteps.HelloWorld, AdditionalSteps.ProgrammingIsFun, and their Init functions will all be called

Init: function ()

This is Init function for the AdditionalSteps.MoreSteps object. Here is where we want to add our custom steps.

References

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