<div class="well" ng-controller="tokenController">

    <div class="row">
        <div class="col-lg-3" ng-hide="token_wizard">
            <div class="pa-sidebar panel">
                <ul class="nav nav-pills nav-stacked">
                    <li role="presentation"
                        ng-class="{active: $state.includes('token.list')}">
                        <a ui-sref="token.list">
                            <span class="glyphicon glyphicon-list"></span>
                            <span translate>All tokens</span>
                        </a>
                    </li>
                    <li role="presentation"
                        ng-class="{active: $state.includes('token.details')}"
                        ng-show="$state.includes('token.details')"><a>Token
                        {{ $stateParams.tokenSerial }}</a>
                    </li>

                    <li role="presentation"
                        ng-show="checkEnroll() || loggedInUser.role === 'admin'"
                        ng-class="{active: $state.includes('token.enroll')}">
                        <a ui-sref="token.enroll">
                            <span class="glyphicon glyphicon-edit"></span>
                            <span translate>Enroll Token</span>
                        </a>
                    </li>
                    <li role="presentation"
                        ng-show="loggedInUser.role === 'user' && checkEnroll()
                            && token_wizard_2nd"
                        ng-class="{active: $state.includes('token.wizard')}">
                        <a ui-sref="token.wizard">
                            <span class="glyphicon glyphicon-star"></span>
                            <span translate>Token enrollment
                                wizard</span>
                        </a>
                    </li>
                    <li role="presentation"
                        ng-class="{active: $state.includes('token.assign')}"
                        ng-show="loggedInUser.role == 'user' &&
                            checkRight('assign')">
                        <a ui-sref="token.assign">
                            <span class="glyphicon glyphicon-plus"></span>
                            <span translate>Assign Token</span>
                        </a>
                    </li>
                    <li role="presentation"
                        ng-class="{active: $state.includes('token.import')}"
                        ng-show="loggedInUser.role == 'admin' &&
                            checkRight('importtokens')">
                        <a ui-sref="token.import">
                            <span class="glyphicon glyphicon-upload"></span>
                            <span translate>Import Tokens</span>
                        </a>
                    </li>
                    <li role="presentation"
                        ng-class="{active: $state.includes('token.challenges')}"
                        ng-show="loggedInUser.role == 'admin' &&
                            checkRight('getchallenges')">
                        <a ui-sref="token.challenges">
                            <span class="glyphicon glyphicon-repeat"></span>
                            <span translate>List Challenges</span>
                        </a>
                    </li>
                    <hr>
                    <li role="presentation"
                        ng-class="{active: $state.includes('token.lost')}"
                        ng-show="($state.includes('token.details')||
                        $state.includes('token.lost')) &&
                        checkRight('losttoken')">
                        <a ui-sref="token.lost({tokenSerial:selectedToken.serial})">
                            <span class="glyphicon glyphicon-eye-open"></span>
                            <span translate>Lost Token</span>
                        </a>
                    </li>
                    <li role="presentation"
                        ng-show="loggedInUser.role == 'admin' &&
                            checkRight('getserial')"
                        ng-class="{active: $state.includes('token.getserial')}">
                        <a ui-sref="token.getserial">
                            <span class="glyphicon glyphicon-question-sign">
                            </span>
                            <span translate>Get Serial</span>
                        </a>
                    </li>
                </ul>

            </div>

        </div>

        <div ui-view class="col-lg-9 slide panel">
        </div>

    </div>


</div>

