www.webOShelp.net

Example:

In scene:

<div x-mojo-element="Button" id="previousStory"></div>
<div x-mojo-element="Button" id="nextStory"></div>

In scene assistant:

StoryViewAssistant.prototype.setup = function() {

    // Hide Previous Button if first story, and Next Button if last one

    if (this.storyIndex > 0)    {
        this.controller.setupWidget("previousStory",
            this.attributes = {
                disabledProperty: 'disabled'
                },
            this.model = {
                buttonLabel : "Previous",
                buttonClass: '',
                disabled: false
            });

            this.controller.listen('previousStory', Mojo.Event.tap,
              this.previousStory.bindAsEventListener(this));
    }    else    {
        $('previousStory').hide();
    }

    if (this.storyIndex < this.storyFeed.stories.length-1)    {
        this.controller.setupWidget("nextStory",
            this.attributes = {
                disabledProperty: 'disabled'
                },
            this.model = {
                buttonLabel : "Next",
                buttonClass: '',
                disabled: false
            });

        this.controller.listen('nextStory', Mojo.Event.tap,
          this.nextStory.bindAsEventListener(this));
    }    else     {
        $('nextStory').hide();
    }

};

 

Screenshot (not representative of example above):

Note that the default visual styles can be overridden using CSS.