<rt-require dependency="./playground" as="playground"/>
<div class="fiddle">
    <div id="header">
        <div id="header-title">
            <a href="index.html" class="title-link">

            <img class="nav-logo" src="https://wix.github.io/react-templates/img/logo-rt.svg" width="56" height="24" />

            </a>
            RTFiddle
        </div>
        <div id="buttons-bar">
            <button type="button" class="btn btn-default" onClick="(evt)=>evt.preventDefault();this.save()">
                <span class="glyphicon glyphicon-star button-icon" aria-hidden="true"></span>Save fiddle
            </button>
            <button type="button" class="btn btn-default" onClick="(evt)=>evt.preventDefault();this.clear()">
                <span class="glyphicon glyphicon-trash button-icon" aria-hidden="true"></span>Clear
            </button>

            <div class="dropdown toolbar-dropdown">
                <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-expanded="true">
                    Load Sample
                    <span class="caret"></span>
                </button>
                <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
                    <li role="presentation"><a role="menuitem" tabindex="-1" href="#" onClick="(evt)=>evt.preventDefault();this.loadSample('rt-if')">rt-if</a></li>
                    <li role="presentation"><a role="menuitem" tabindex="-1" href="#" onClick="(evt)=>evt.preventDefault();this.loadSample('rt-repeat')">rt-repeat</a></li>
                    <li role="presentation"><a role="menuitem" tabindex="-1" href="#" onClick="(evt)=>evt.preventDefault();this.loadSample('rt-props')">rt-props</a></li>
                    <li role="presentation"><a role="menuitem" tabindex="-1" href="#" onClick="(evt)=>evt.preventDefault();this.loadSample('todo')">Todo</a></li>
                    <li role="presentation"><a role="menuitem" tabindex="-1" href="#" onClick="(evt)=>evt.preventDefault();this.loadSample('weather')">Weather</a></li>
                </ul>
            </div>
        </div>
    </div>
    <!--<div>-->
        <!--<h1>React Templates fiddle</h1>-->
        <!--<h2>Play with react templates and save/share your results</h2>-->
        <!--<button class="btn btn-lg btn-primary" onClick="(evt)=>evt.preventDefault();this.save()">Save fiddle</button>-->
        <!--<br />-->
    <div class="playground-container">
        <playground ref="playground" direction="vertical" fiddle="{true}" />
    </div>
    <!--</div>-->
</div>