<!doctype html>
<html lang="en" data-ng-app="keycloak">

<head>
    <meta charset="utf-8">
    <title>Keycloak</title>

    <style type="text/css">
        #idletimeout { background:#CC5100; border:3px solid #FF6500; color:#fff; font-family:arial, sans-serif; text-align:center; font-size:12px; padding:10px; position:relative; top:0px; left:0; right:0; z-index:100000; display:none; }
        #idletimeout a { color:#fff; font-weight:bold }
        #idletimeout span { font-weight:bold }
    </style>

    <link href="lib/bootstrap/css/bootstrap.css" rel="stylesheet">
    <link href="lib/bootstrap/css/bootstrap-responsive.css" rel="stylesheet">
    <link href="css/admin.css" rel="stylesheet">
    <link href="css/admin-responsive.css" rel="stylesheet">

    <link href="css/styles.css" rel="stylesheet">

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

    <script src="js/app.js"></script>
    <script src="js/controllers.js"></script>
    <script src="js/loaders.js"></script>
    <script src="js/services.js"></script>


</head>

<body data-ng-controller="GlobalCtrl">
<div id="idletimeout">
    You will be logged off in <span></span>&nbsp;seconds due to inactivity.
    <a id="idletimeout-resume" href="#">Click here to continue using this web page</a>.
</div>


<div class="alert-container" data-ng-show="notification" data-ng-click="notification = null">
    <div class="alert alert-{{notification.type}}">{{notification.message}}</div>
</div>

<div id="wrap">
    <div data-ng-include data-src="'partials/menu.html'"></div>

    <div data-ng-view id="view" data-ng-hide="httpProviderError"></div>

    <div id="httpProviderError" data-ng-show="httpProviderError">
        <button class="btn btn-danger" data-ng-click="httpProviderError=null">
            <strong>Error</strong> {{httpProviderError}}
        </button>
    </div>

    <div id="loading">
        <i class="icon-spinner icon-spin"></i> Loading...
    </div>
</div>

<script src="lib/jquery/jquery-1.10.2.js" type="text/javascript"></script>
<script src="lib/jquery/jquery.idletimer.js" type="text/javascript"></script>
<script src="lib/jquery/jquery.idletimeout.js" type="text/javascript"></script>
<script type="text/javascript">
    $.idleTimeout('#idletimeout', '#idletimeout a', {
        idleAfter: 300,
        pollingInterval: 60,
        keepAliveURL: '/auth-server/rest/saas/keepalive',
        serverResponseEquals: '',
        failedRequests: 1,
        onTimeout: function(){
            $(this).slideUp();
            window.location = "/auth-server/rest/saas/logout";
        },
        onIdle: function(){
            $(this).slideDown(); // show the warning bar
        },
        onCountdown: function( counter ){
            $(this).find("span").html( counter ); // update the counter
        },
        onResume: function(){
            $(this).slideUp(); // hide the warning bar
        }
    });
</script>

</body>
</html>
