-
Notifications
You must be signed in to change notification settings - Fork 2
Frontend Helper Elements
This page is very incomplete! Check back soon for a complete reference
While oTree Markets does a lot to simplify the process of creating market interfaces, if you're looking for anything more specialized than the basic single- or multi-asset sample experiments you'll have to write a bit of HTML/Javascript. Most of the work has already been done though, you'll just have to know enough to layout and plumb together some pre-made components. This page lists all of the helper components that come included and explains how to use them.
These helper elements are Polymer.js webcomponents which can be easily dropped into any HTML page. While it's definitely not necessary to use Polymer.js to build your interface, its data binding features may make some parts of the interface construction process easier. To learn more about Polymer, check out its docs here.
All of oTree Markets' helper Polymer elements are listed below. To see a complete interface constructed with these elements, check out LEEPS' reference single asset market and multiple asset market implementations.
This component automatically grays out the screen before and after the round has started. This prevents players from interacting with the interface when not actively playing.
To use this component, just include it somewhere on your page. That's it! It'll use redwood-period to determine when the round starts and when it ends, adding and removing the gray overlay appropriately.
The event-log component is a scrollable text box that you can use to send info or error messages to players.
Path: /static/otree_markets/event_log.js
Methods: