<div class="page-header">
    <h1>{{name}} <small>Class</small></h1>
</div>
 <div class="well well-small sign-left3">
      {{{classDescription}}}
 </div>

<div class="well well-small sign-left2 container-fluid" id="classesItems">
    <div class="row">
    
        <div class="index-section methods col-sm-4">
            <h3>Methods</h3>
            {{#if methods}}
            <ul class="index-list methods{{#if extends}} extends{{/if}}">
                {{#methods}}
                    <li class="index-item method{{#if access}} {{access}}{{/if}}{{#if deprecated}} deprecated{{/if}}{{#if overwritten_from}} inherited{{/if}}{{#if extended_from}} inherited{{/if}}">
                        <a href="#" data-tabid="#method" data-anchor="#method_{{name}}" data-tablink="{{name}}">{{name}}</a>

                        {{#if static}}
                            <span class="flag static">static</span>
                        {{/if}}
                        {{#if deprecated}}
                            <span class="flag deprecated">deprecated</span>
                        {{/if}}
                    </li>
                {{/methods}}
            </ul>
            {{/if}}
        </div>
    
        <div class="index-section properties col-sm-4">
            <h3>Properties</h3>
            {{#if properties}}
            <ul class="index-list properties{{#if extends}} extends{{/if}}">
                {{#properties}}
                    <li class="index-item property{{#if access}} {{access}}{{/if}}{{#if deprecated}} deprecated{{/if}}{{#if overwritten_from}} inherited{{/if}}{{#if extended_from}} inherited{{/if}}">
                        <a href="#" data-tabid="#property" data-anchor="#property_{{name}}" data-tablink="{{name}}">{{name}}</a>

                        {{#if static}}
                            <span class="flag static">static</span>
                        {{/if}}
                        {{#if deprecated}}
                            <span class="flag deprecated">deprecated</span>
                        {{/if}}
                    </li>
                {{/properties}}
            </ul>
            {{/if}}
        </div>
    
        <div class="index-section events col-sm-4">
            <h3>Events</h3>
            {{#if events}}
            <ul class="index-list events{{#if extends}} extends{{/if}}">
                {{#events}}
                    <li class="index-item event{{#if access}} {{access}}{{/if}}{{#if deprecated}} deprecated{{/if}}{{#if overwritten_from}} inherited{{/if}}{{#if extended_from}} inherited{{/if}}">
                        <a href="#" data-tabid="#event" data-anchor="#event_{{name}}" data-tablink="{{name}}">{{name}}</a>

                        {{#if static}}
                            <span class="flag static">static</span>
                        {{/if}}
                        {{#if deprecated}}
                            <span class="flag deprecated">deprecated</span>
                        {{/if}}
                    </li>
                {{/events}}
            </ul>
             {{/if}}
        </div>
    </div>
</div>

<div>
    <ul id="itemTab" class="nav nav-tabs">
        <li class="active"><a data-toggle="tab" href="#class">Detail</a></li>
        {{#if methods}}
            <li><a data-toggle="tab" href="#method">Methods</a></li>
        {{/if}}
        {{#if properties}}
            <li><a data-toggle="tab" href="#property">Properties</a></li>
        {{/if}}
        {{#if events}}
            <li><a data-toggle="tab" href="#event">Events</a></li>
        {{/if}}
    </ul>

    <div class="tab-content">
        <div id="class" class="tab-pane active">
            <div class="well well-small classDetail sign-left1">
            {{#if uses}}
                <div class="uses">
                    Uses
                    <ul class="inline commas">
                        {{#uses}}
                            <li><a href="{{.}}.html">{{.}}</a></li>
                        {{/uses}}
                    </ul>
                </div>
            {{/if}}

            {{#if extends}}
                <div class="extends">
                    Extends {{#crossLink extends}}{{/crossLink}}
                </div>
            {{/if}}

            {{#if foundAt}}
                <div class="foundat">
                    Defined in: <a href="{{foundAt}}">`{{{file}}}:{{{line}}}`</a>
                </div>
            {{/if}}

            {{#if module}}
                {{#if submodule}}
                    Module: {{#crossLinkModule submodule}}{{/crossLinkModule}}<br>
                    Parent Module: {{#crossLinkModule module}}{{/crossLinkModule}}
                {{else}}
                    Module: {{#crossLinkModule module}}{{/crossLinkModule}}
                {{/if}}
            {{/if}}

            {{#if since}}
                <p>Available since {{since}}</p>
            {{/if}}
        </div>

        {{#if deprecated}}
            <div class="well well-small sign-left2">
                <p>
                {{#if deprecationMessage}}
                    <strong>Deprecated:</strong> {{deprecationMessage}}
                {{else}}
                    This class is deprecated.
                {{/if}}
                </p>
            </div>
        {{/if}}
            {{#is_constructor}}
                <div class="constructor">
                    <h2>Constructor</h2>
                    {{>method}}
                </div>
            {{/is_constructor}}
        </div>

        {{#if methods}}
            <div id="method" class="tab-pane">
                <h2 class="off-left">Methods</h2>

                {{#methods}}
                    {{>method}}
                {{/methods}}
            </div>
        {{/if}}

        {{#if properties}}
            <div id="property" class="tab-pane">
                <h2 class="off-left">Properties</h2>

                {{#properties}}
                    {{>props}}
                {{/properties}}
            </div>
        {{/if}}

        {{#if events}}
            <div id="event" class="tab-pane">
                <h2 class="off-left">Events</h2>

                {{#events}}
                    {{>events}}
                {{/events}}
            </div>
        {{/if}}
    </div>
</div>
