Animate a reused view on click

Question

I have a view that I reused and provide a click event so the user thinks they are changing pages. This works great for what I need but because the view has all the same text, images, the user will think nothing has changed and therefore there selection didn't take. How would I animate the UI when the user clicks on an image?

private onCurrentLookSelected(args: CurrentLookSelectedEvent) {
    this.hasCurrent(true);
    ko.utils.arrayForEach(this._formulas(), (formula: FormulaValues) => {
       formula.startingLevel(args.currentValue.startingLevel());
       formula.startingTone(args.currentValue.startingTone());
    });
    window.scrollTo(0, 0);
}

Answer 1

If you are doing this in Durandal, I would recommend that you set up your router to have separate routes for each "page":

router.map([{ 
    title: 'Page 1', 
    route: 'first',
    moduleId: 'viewmodels/reusable' 
},{ 
    title: 'Page 2', 
    route: 'second',
    moduleId: 'viewmodels/reusable' 
}])

And then use the built in animate plugin:

app.setRoot('viewmodels/shell', 'entrance');