Major Functionality

Our goal of providing steem functionality from inside user created VR scenes is finally realized. See a real live steem post. This a a static webpage stored in IPFS. Our steem frontend puts that static content in an iFrame and gives it limited API to a users steem wallet; Vote. However, it can display current state information as well. The goal with this test is to show functional features. Like who is logged in (disregardfiat), the post title, as well as the current vote total.

If your eyes are already glazed over I wouldn't recommend reading further. However, if you're interested in seeing how you might create experiences to share then lets get to it!

initialState: {
          post: "",
          username: "@",
          id: "",
          title: "No sync ...",
          author: "",
          rep: "UND",
          profileimage: "",
          votesNum: "UNK",
          votesVal: "$0",
          menuVis: false,
          voteMsg: "Vote!"
        }

All state is store in one state component, this, in addition to any state requirements of your experience, is the data model to use. aframe-state-component has some useful documentation to apply this model to your interactive experience.

Handlers listen for updates and automatically update components that have bound values.

<a-gui-label
                width="6.5" height="0.75"
                bind__value="votesVal"
                value=""
                id="voteMsgR"
                font-family="Arial"
                margin="0 0 0.05 0">
</a-gui-label>

The bind is easy to program:

value="Something Static" /* becomes -> */ bind__value="votesVal"

These data model bound values can even be networked. A two player game of horse for instance is not much more difficult than specifying "shared" attributes for the ball's position and game score and using the right aframe modules for physics and collisions.

<a-gui-button
                width="2.5" height="0.75"
                onclick="voteButton"
                bind__value="voteMsg"
                value="Vote"
                font-family="Helvetica"
                margin="0 0 0.05 0">
        </a-gui-button>

Actions such as onclick="voteButton can be bound to anything. This is XR. Triggering a vote also updates the SteemState for the page, which means you get feedback as to how much the vote was worth.

@disregardfiat is using this data model to build dynamic links/portals so you can explore the steem blockchain VR content much the same way you interact with steemit. A feed, trending, tags, blogs... resteems and follows. A true social network blurring the lines of reality.

Visit and contribute to this opensource project dluxio
Join our Discord