Back button using Game>Backup function

#1

Is it possible to create a back button for a turn by turn simulation? I’d like to use the Venapp Game>Backup function to back the simulation up one period.

#2

Hi Bruce,
Currently, It’s not possible to create a back button to ‘back up’ (or ‘undo’) a previously submitted period (or ‘Step’)

#3

Hi Bruce,

Although the interface builder does not have a “go back” functionality built in, you can add this functionality by editing the pages directly.

There’s four steps to make this work.

  1. Create a new button using the interface builder and set it to Navigate to a new page
  2. Edit the button in HTML.
  3. Include a Javascript function rewind in the index.html page
  4. Edit the “ctx2” file for the model

Step 1. Add a new button to the decisions page. In the Interface Builder, on the decisions page, add a new button to the sim. Click the button bar at the bottom, click “Add New Button”. Set the button text to “Go Back” and the operation “UI: Navigate to”, choosing “dashboard” or “report”. This sets up the button to go to a new page when you click it.

add_button
add_button.png2812×1415 150 KB

Step 2. Edit the button in HTML. Go to the Interface tab. In the “pages” folder, find the file decisions.html and edit it. Find the line for the button. You will edit it to tell it to call a Javascript function to rewind.

<button class="btn btn-link f-action-button" data-f-on-click="js:goto(#report.html)">Go Back</button>

Change it by adding the onclick attribute so it looks like this:

<button class="btn btn-link f-action-button" onclick="rewindSim();" data-f-on-click="js:goto(#report.html)">Go Back</button>

Step 3. Add the Javascript function to “index.html”. Go to the Interface list of files and edit index.html. Include this JavaScript function just before the closing tag. This Javascript function will be called by your button.

<script>
function rewindSim() {
    Flow.channel.runManager.getRun().then(function(run) {
        const thisRunId = run.id;
        var sa = new F.service.State();
        sa.rewind({
            runId: thisRunId
        });
    });
}
</script>

Step 4. Edit the ctx2 file for the model. This tells the modeling engine that when you rewind, it will replay the sim up until just before the step operation.

Go to your project home page, then click “model” and you’ll see a list of files. One of the files will end in “ctx2”. If there are multiple files, use the one that matches the name of your model (e.g. if your model is “sales.vmf” the context file will be “sales.ctx2”.

Include these lines in the file in the “restorations” section

"rewind": {
    "name": "step"
}

The full file will look something similar to this

{
    "version": "v2",
    "restorations": {
        "assembly": [{
            "replay": {}
        }],
        "log": "temporal",
        "rewind": {
            "name": "step"
        }
    },
    "defaults": {
        "variables": {}
    },
    "variables": {}
}
#4

Thank you Will.

I have implemented this and it seems to work, but I am seeing two issues.

The first is that the page where I have the Go Back button is not refreshing - I have graphs and numeric indicators on the page and they do not refresh. If I go to other output pages with graphs and tables, they refresh. And if I navigate to other pages and then return, the page with the button refreshes.

The second issue is that sometimes the Go Back button seems to wipe out everything and go back to the base period. I haven’t been able to isolate the sequence that causes that, but I will continue to work on that.