<div class="mini-graph clearfix">
    <div class="nav"><nav><a class="breadcrumb" href="/">Offices</a> > <span>{{office}}</span></nav></div>
    <h3>NYC Campaign Contributions: {{office}}</h3>
    <hr>
    <ul>
        <li ng-click="byTotal($event)" class="chart-option active-option">Total Funds</li>
        <li ng-click="byContributions($event)" class="chart-option">Contributions</li>
        <li ng-click="byMatch($event)" class="chart-option">Matching Funds</li>
        <li ng-click="byContributors($event)" class="chart-option">Number of Contributors</li>
    </ul>
    <hr>
    <ul class="selected-candidates">
        <li ng-repeat="candidate in selectedCandidates" id="{{candidate.id}}" class="candidate-button-selected" ng-class="addActive(candidate.id)" ng-click="removeActive($event, candidate.id, $index)">
            {{candidate.name}}
        </li>
    </ul>
    <hr>
    <ul class="candidate-list">
        <li ng-repeat="candidate in candidates" id="can_{{candidate.id}}" class="candidate-button" ng-click="toggleSelected($event, $index)">
            {{candidate.name}}
        </li>
    </ul>
    <div class="candidates graph-wrapper">
        <svg d3="" d3-data="selectedCandidates" d3-renderer="barGraphRenderer" class="candidate-bar-graph"></svg>
    </div>
    <!--<hr>-->
    <!--<div class="candidate-info-box" style="display: none;">-->
        <!--<p class="candidate-name">{{name}}</p>-->
        <!--<p class="total-contributors">{{count_contributors}} Contributors</p><a href="{{detail_link}}" title="{{name}} Details">Details</a>-->
        <!--<table class="funds">-->
            <!--<tr class="match-amount">-->
                <!--<td>Matching Funds:</td>-->
                <!--<td>{{candidate_match | currency}}</td>-->
            <!--</tr>-->
            <!--<tr class="contribution-amount">-->
                <!--<td>Contributions Funds:</td>-->
                <!--<td>{{candidate_contributions | currency}}</td>-->
            <!--</tr>-->
            <!--<tr class="total-amount">-->
                <!--<td>Total Funds:</td>-->
                <!--<td>{{candidate_total | currency}}</td>-->
            <!--</tr>-->
        <!--</table>-->

    <!--</div>-->

    <div id="candidate_info" class="candidate-info tooltip">
        {{candidate_name}}<br>
        {{candidate_value}}
    </div>

</div>