<div class="bs-sidebar col-md-3 clearfix" data-ng-include data-src="resourceUrl + '/partials/realm-menu.html'"></div>
<div id="content-area" class="col-md-9" role="main">
    <kc-navigation-application></kc-navigation-application>
    <div id="content">
        <ol class="breadcrumb" data-ng-hide="create">
            <li><a href="#/realms/{{realm.realm}}/applications">Applications</a></li>
            <li><a href="#/realms/{{realm.realm}}/applications/{{application.id}}">{{application.name}}</a></li>
            <li class="active">Protocol Mappers</li>
        </ol>
        <h2><span>{{realm.realm}} </span> {{application.name}} {{application.protocol}} Protocol Mappers  <span tooltip-placement="right" tooltip="Protocol mappers perform transformation on tokens and documents.  They an do things like map user data into protocol claims, or just transform any requests going between the application and auth server." class="fa fa-info-circle"></span></h2>
        <table class="table table-striped table-bordered">
            <thead>
            <tr>
                <th class="kc-table-actions" colspan="4">
                    <div class="search-comp clearfix">
                        <input type="text" placeholder="Search..." class="form-control search" data-ng-model="search.name"
                               onkeyup="if(event.keyCode == 13){$(this).next('button').click();}">
                        <button type="submit" class="kc-icon-search" tooltip-placement="right"
                                tooltip="Search by mapper name.">
                            Icon: search
                        </button>
                    </div>
                    <div class="pull-right">
                        <a class="btn btn-primary" href="#/create/protocols/{{application.protocol}}/realms/{{realm.realm}}/mappers">Create</a>
                        <a class="btn btn-primary" href="#/realms/{{realm.realm}}/applications/{{application.id}}/add-mappers">Add Builtin</a>
                        <button class="btn btn-primary" data-ng-click="remove()">Remove Selected</button>
                    </div>
                </th>
            </tr>
            <tr data-ng-hide="mappers.length == 0">
                <th>Name</th>
                <th>Category</th>
                <th>Type</th>
                <th>Remove</th>
            </tr>
            </thead>
            <tbody>
            <tr ng-repeat="mapper in mappers | filter:search">
                <td><a href="#/realms/{{realm.realm}}/protocols/{{application.protocol}}/mappers/{{mapper.id}}">{{mapper.name}}</a></td>
                <td>{{mapperTypes[mapper.protocolMapper].category}}</td>
                <td>{{mapperTypes[mapper.protocolMapper].name}}</td>
                <td><input type="checkbox" ng-model="mapper.isChecked"></td>
            </tr>
            <tr data-ng-show="mappers.length == 0">
                <td>No mappers available</td>
            </tr>
            </tbody>
        </table>
    </div>
</div>
