<!-- Navigation -->

<nav class="navbar navbar-default navbar-static-top" role="navigation" style="margin-bottom: 0">
    <div class="navbar-header">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
            <span class="sr-only">{{ 'toggleNavigation'|_ }}</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
        <a class="navbar-brand" href="{{ route('index') }}">Firefly</a>
    </div>
    <!-- /.navbar-header -->


    <ul class="nav navbar-top-links navbar-right hidden-xs">

        <!-- reminders -->
        {% if reminders|length > 0 %}
            <li class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#" aria-expanded="false">
                    <i class="fa fa-envelope fa-fw"></i> <i class="fa fa-caret-down"></i>
                </a>
                <ul class="dropdown-menu dropdown-messages">
                    {% for reminder in reminders %}
                    <li>
                        <a href="{{ route('reminders.show',reminder.id) }}">
                            <div>
                                <strong>
                                    {{ reminder.remindersable.name }}
                                </strong>
                                    <span class="pull-right text-muted">
                                        <em>{{ reminder.startdate.diffForHumans }}</em>
                                    </span>
                            </div>
                            <div>{{ reminder.description|raw }}</div>
                        </a>
                    </li>
                    <li class="divider"></li>
                    {% endfor %}
                    <li>
                        <a class="text-center" href="{{ route('reminders.index') }}">
                            <strong>{{ 'seeAllReminders'|_ }}</strong>
                            <i class="fa fa-angle-right"></i>
                        </a>
                    </li>
                </ul>
                <!-- /.dropdown-messages -->
            </li>
        {% endif %}

        <!-- menu -->
        <li class="dropdown">
            <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                <i class="fa fa-user fa-fw"></i> <i class="fa fa-caret-down"></i>
            </a>
            <ul class="dropdown-menu dropdown-user">
                <li><a href="{{ route('profile') }}"><i class="fa fa-user fa-fw"></i> {{ Auth.user.email }}</a></li>
                <li><a href="{{ route('preferences') }}"><i class="fa fa-gear fa-fw"></i> {{ 'preferences'|_ }}</a></li>
                <li><a href="{{ route('currency.index') }}"><i class="fa fa-usd fa-fw"></i> {{ 'currency'|_ }}</a></li>
                <li><a href="{{ route('reminders.index') }}"><i class="fa fa-clock-o fa-fw"></i> {{ 'reminders'|_ }}</a></li>
                <li class="divider"></li>
                <li><a href="{{ route('logout') }}"><i class="fa fa-sign-out fa-fw"></i> {{ 'logout'|_ }}</a></li>
            </ul>
            <!-- /.dropdown-user -->
        </li>


        <!-- /.dropdown -->

    </ul>
    <p class="navbar-text navbar-right hidden-xs" id="daterange"><span>&nbsp;</span> <b class="caret"></b></p>


    <!-- /.navbar-top-links -->
    <div class="navbar-default sidebar" role="navigation">
        <div class="sidebar-nav navbar-collapse">
            <ul class="nav" id="side-menu">
                <li class="sidebar-search hidden-xs">
                    <form action="{{ route('search') }}" method="GET" class="form-inline">
                        <div class="input-group custom-search-form">
                            <input type="text" name="q" class="form-control" value="{% if Input.get('q') %}{{ Input.get('q') }}{% endif %}"
                                   placeholder="{{ 'searchPlaceholder'|_ }}">
                            <span class="input-group-btn">
                                <button class="btn btn-default" type="submit"><i class="fa fa-search"></i></button>
                            </span>
                        </div>
                    </form>
                    <!-- /input-group -->
                </li>
                <li>
                    <a class="{{ activeRouteStrict('index') }}" href="{{ route('index') }}"><i class="fa fa-dashboard fa-fw"></i> {{ 'dashboard'|_ }}</a>
                </li>
                <li class="{{ activeRoutePartial('accounts') }}">
                    <a href="#"><i class="fa fa-credit-card fa-fw"></i> {{ 'accounts'|_ }} <span class="fa arrow"></span></a>
                    <ul class="nav nav-second-level">
                        <li>
                            <a class="{{ activeRoutePartialWhat('accounts', 'asset') }}" href="{{ route('accounts.index','asset') }}">
                                <i class="fa fa-money fa-fw"></i> {{ 'assetAccounts'|_ }}</a>
                        </li>
                        <li>
                            <a class="{{ activeRoutePartialWhat('accounts', 'expense') }}" href="{{ route('accounts.index','expense') }}">
                                <i class="fa fa-shopping-cart fa-fw"></i> {{ 'expenseAccounts'|_ }}</a>
                        </li>
                        <li>
                            <a class="{{ activeRoutePartialWhat('accounts', 'revenue') }}" href="{{ route('accounts.index','revenue') }}">
                                <i class="fa fa-download fa-fw"></i> {{ 'revenueAccounts'|_ }}</a>
                        </li>
                    </ul>
                    <!-- /.nav-second-level -->
                </li>
                <li>
                    <a class="{{ activeRoutePartial('budgets') }}" href="{{ route('budgets.index') }}"><i class="fa fa-tasks fa-fw"></i> {{ 'budgets'|_ }}</a>
                </li>
                <li>
                    <a class="{{ activeRoutePartial('categories') }}" href="{{ route('categories.index') }}"><i class="fa fa-bar-chart fa-fw"></i> {{ 'categories'|_ }}</a>
                </li>
                <li>
                    <a class="{{ activeRoutePartial('tags') }}" href="{{ route('tags.index') }}"><i class="fa fa-tags fa-fw"></i> {{ 'tags'|_ }}</a>
                </li>
                <li>
                    <a class="{{ activeRoutePartial('reports') }}" href="{{ route('reports.index') }}"><i class="fa fa-line-chart fa-fw"></i> {{ 'reports'|_ }}</a>
                </li>
                <li class="{{ activeRoutePartial('transactions') }}">
                    <a href="#"><i class="fa fa-repeat fa-fw"></i> {{ 'transactions'|_ }}<span class="fa arrow"></span></a>
                    <ul class="nav nav-second-level">
                        <li>
                            <a class="{{ activeRoutePartialWhat('transactions','withdrawal') }}" href="{{ route('transactions.index','withdrawal') }}">
                                <i class="fa fa-long-arrow-left fa-fw"></i> {{ 'expenses'|_ }}</a>
                        </li>
                        <li>
                            <a class="{{ activeRoutePartialWhat('transactions','deposit') }}" href="{{ route('transactions.index','deposit') }}"><i
                                        class="fa fa-long-arrow-right fa-fw"></i> {{ 'income'|_ }}</a>
                        </li>
                        <li>
                            <a class="{{ activeRoutePartialWhat('transactions','transfers') }}" href="{{ route('transactions.index','transfers') }}">
                                <i class="fa fa-fw fa-exchange"></i> {{ 'transfers'|_ }}</a>
                        </li>
                    </ul>

                </li>
                <li class="{{ activeRoutePartial('bills') }} {{ activeRoutePartial('piggy-banks') }}">
                    <a href="#"><i class="fa fa-euro fa-fw"></i> {{ 'moneyManagement'|_ }}<span class="fa arrow"></span></a>
                    <ul class="nav nav-second-level">
                        <li>
                            <a class="{{ activeRoutePartial('piggy-banks') }}" href="{{ route('piggy-banks.index') }}">
                                <i class="fa fa-sort-amount-asc fa-fw"></i> {{ 'piggyBanks'|_ }}</a>
                        </li>
                        <li>
                            <a class="{{ activeRoutePartial('bills') }}" href="{{ route('bills.index') }}">
                                <i class="fa fa-calendar-o fa-fw"></i> {{ 'bills'|_ }}</a>
                        </li>
                    </ul>
                    <!-- /.nav-second-level -->
                </li>
                <li class="{{ activeRouteStrict('transactions.create') }}">
                    <a href="#"><i class="fa fa-plus fa-fw"></i> {{ 'createNew'|_ }} <span class="fa arrow"></span></a>
                    <ul class="nav nav-second-level">
                        <li>
                            <a class="{{ activeRoutePartialWhat('transactions.create','withdrawal') }}" href="{{ route('transactions.create','withdrawal') }}">
                                <i class="fa fa-long-arrow-left fa-fw"></i> {{ 'withdrawal'|_ }}</a>
                        </li>
                        <li>
                            <a class="{{ activeRoutePartialWhat('transactions.create','deposit') }}" href="{{ route('transactions.create','deposit') }}">
                                <i class="fa fa-long-arrow-right fa-fw"></i> {{ 'deposit'|_ }}</a>
                        </li>
                        <li>
                            <a class="{{ activeRoutePartialWhat('transactions.create','transfer') }}" href="{{ route('transactions.create','transfer') }}">
                                <i class="fa fa-fw fa-exchange"></i> {{ 'transfer'|_ }}</a>
                        </li>
                    </ul>
                    <!-- /.nav-second-level -->
                </li>
                <!-- top menu again -->
                <li class="hidden-sm hidden-md hidden-lg">
                    <a class="{{ activeRouteStrict('profile') }}" href="{{ route('profile') }}"><i class="fa fa-user fa-fw"></i> {{ Auth.user.email }}</a>
                </li>

                <li class="hidden-sm hidden-md hidden-lg">
                    <a class="{{ activeRouteStrict('preferences') }}" href="{{ route('preferences') }}"><i class="fa fa-gear fa-fw"></i> {{ 'preferences'|_ }}</a>
                </li>
                <li class="hidden-sm hidden-md hidden-lg">
                    <a class="{{ activeRoutePartial('currency') }}" href="{{ route('currency.index') }}"><i class="fa fa-usd fa-fw"></i> {{ 'currency'|_ }}</a>
                </li>
                <li class="hidden-sm hidden-md hidden-lg">
                    <a class="{{ activeRoutePartial('reminders') }}" href="{{ route('reminders.index') }}"><i class="fa fa-clock-o fa-fw"></i> {{ 'reminders'|_ }}</a>
                </li>
                <li class="hidden-sm hidden-md hidden-lg">
                    <a href="{{ route('logout') }}"><i class="fa fa-sign-out fa-fw"></i> {{ 'logout'|_ }}</a>
                </li>

                <!-- reminders, again-->
            </ul>
        </div>
        <!-- /.sidebar-collapse -->
    </div>
    <!-- /.navbar-static-side -->
</nav>
