<!-- Users page partial html -->
<div class="container">
    <div id="user" class="row">
        <div class="col-xs-12">
            <table class="table">
                <thead>
                    <tr>
                        <th></th>
                        <th class="form-inline">
                            Name <input ng-model="q.name" type="text" class="form-control">
                        </th>
                        <th>Last Login</th>
                        <th ng-if="isFamily">
                            Select Site Rating
                            <span class="help" ng-click="showRatings()"> (?)</span>
                        </th>
                        <th ng-if="isFamily"></th>
                    </tr>
                </thead>
                <tr ng-repeat="user in users | filter:q" class="animate-repeat">
                    <td class="avatar">
                        <img ng-src="{{'/imgs/' + user.icon_id + '.jpg'}}">
                    </td>
                    <td>{{user.name}}</td>
                    <td>{{shared.userActivity[user.id]}}</td>
                    <td ng-if="isFamily">
                        <select class="form-control" ng-model="user.level" ng-options="l for l in levels" ng-change="updateLevel(user)">
                        </select>
                    </td>
                    <td ng-if="isFamily" style="width: 46px">
                        <user-updated-tick user="user">Saved</user-updated-tick>
                    </td>
                </tr>
            </table>
        </div>

        <!-- TODO refactor in modal-->
        <div ng-if="isFamily">
            <ratings-panel></ratings-panel>
        </div>
    </div>
</div>