<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <title>Angular Product Portal</title>

    <script src="lib/angular/angular.js"></script>
    <script src="lib/angular/angular-resource.js"></script>
    <script src="lib/angular/angular-route.js"></script>
    <script src="lib/angular/ui-bootstrap-tpls-0.4.0.js"></script>

    <script src="/auth/js/keycloak.js"></script>
    <script src="js/app.js" type="text/javascript"></script>
</head>

<body data-ng-controller="GlobalCtrl">

<div id="content-area" class="col-md-9" role="main">
    <div id="content">
        <h2><span>Products</span></h2>
        <a href="" ng-click="logout()">Sign Out</a>
        <button type="submit" data-ng-click="reloadData()">Reload</button>
        <table class="table" data-ng-show="products.length > 0">
            <thead>
            <tr>
                <th>Product Listing</th>
            </tr>
            </thead>
            <tbody>
            <tr data-ng-repeat="p in products">
                <td>{{p}}</a></td>
            </tr>
            </tbody>
        </table>
    </div>
    <hr />
    <div>
        <h2><span>Realm Roles</span></h2>
        <button type="submit" data-ng-click="loadRoles()">load Roles</button>
        <button type="submit" data-ng-click="addRole()">Add Role</button>
        <button type="submit" data-ng-click="deleteRole()">Delete Role</button>
        <table class="table" data-ng-show="roles.length > 0">
            <thead>
            <tr>
                <th>Role Listing</th>
            </tr>
            </thead>
            <tbody>
            <tr data-ng-repeat="r in roles">
                <td>{{r.name}}</a></td>
            </tr>
            </tbody>
        </table>
    </div>
    <hr />
    <div>
        <h2><span>Social providers</span></h2>
        <button type="submit" data-ng-click="loadServerInfo()">load available social providers</button>
        <table class="table" data-ng-show="serverInfo.socialProviders.length > 0">
            <thead>
            <tr>
                <th>Available social providers</th>
            </tr>
            </thead>
            <tbody>
            <tr data-ng-repeat="sp in serverInfo.socialProviders">
                <td>{{sp}}</a></td>
            </tr>
            </tbody>
        </table>
    </div>
    <hr />
    <div>
        <h2><span>Realm info</span></h2>
        <button type="submit" data-ng-click="loadPublicRealmInfo()">Load public realm info</button>

        <div data-ng-show="realm">
            Realm name: {{realm.realm}} <br/>
            Public key: {{realm.public_key}} <br/>
        </div>
    </div>
    <hr />
</div>
</body>
</html>
