<!doctype html>
<html ng-app="bucketApp" xmlns="http://www.w3.org/1999/html">
<head>
    <meta charset=utf-8 />
    <script src="scripts/angular/angular.min.js"></script>
    <script src="scripts/angular/angular-route.min.js"></script>
    <script src="scripts/angular/angular-sanitize.min.js"></script>
    <script src="scripts/angular-misc/ng-table.min.js"></script>
    <script src="scripts/angular-misc/angular-commons.js"></script>
    <script src="scripts/angular-misc/ui-bootstrap-tpls-0.10.0.min.js"></script>
    <script src="scripts/angular-misc/dialogs.v2.min.js"></script>
    <script src="scripts/bucketApp.js"></script>
    <script src="scripts/jquery.min.js"></script>
    <script src="scripts/bootstrap.min.js"></script>
    <link rel="stylesheet" href="css/testAdmin.css" />
    <link rel="stylesheet" href="css/tooltip.css" />
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="scripts/angular-misc/ng-table.min.css">
    <title>Ceph buckets admin</title>
</head>
<body ng-controller="ListCtrl" onresize="resizeBlocks(['#list','#control'])">

<header ng-include src="'partials/header.html'" ng-init="pageTitle='RGW bucket management'"></header>

<div>
    <div id="datePanel">Date : {{date | date:'HH:mm:ss'}}  <span class="text-warning" ng-show="status != 200"><i class="icon-warning-sign"></i> {{status}}</span></div>
    <div id="list">
    <table>
        <tr>
            <th><input type="text" ng-model="search" class="search-query" placeholder="Search"></th>
            <th>&nbsp; &nbsp; </th>
            <th ng-show="hasRole('admin_rgw')">new bucket <a href="#/new"><i class="icon-plus-sign" alt="add a new bucket" title="add a new bucket"></i></a></th>
        </tr>
    </table>
    <br>
    <table ng-table="tableParams" class="table table-condensed table-hover clickable">
        <tr ng-repeat="bucket in orderedData | filter:search" ng-click="showDetail(bucket)">
            <td data-title="'Bucket'" sortable="''">{{bucket}}</td>
            <td data-title="'View'" sortable="pool" style="text-align:center"><i class="icon-eye-open" alt="view details of {{ bucket }}" title="view details of {{ bucket }}"></i></td>
        </tr>
    </table>
    </div>
</div>
<div ng-view id="control"></div>

<!-- About DIVs -->
<div ng-switch on="pagename()">
    <div id="about" ng-switch-when="new" >
	<i class="icon-info-sign" alt="about canned acls" style="float:left"></i><h3>About canned ACLs</h3><br>
	<span><strong>private : </strong>Owner gets full control. No one else has access rights.</span><br>
	<span><strong>public-read : </strong>Owner gets full control. Anyone can see the bucket and its content.</span><br>
	<span><strong>public-read-write : </strong>Owner gets full control. Anyone can see and write in the bucket. (Not recommended)</span><br>
	<span><strong>authenticated-read : </strong>Owner gets full control. All the authenticated users can read in the bucket.</span><br>
    </div>

    <div id="about" ng-switch-when="acl">
	<i class="icon-info-sign" alt="about group of users" style="float:left"></i><h3>About group of users</h3><br>
	<span><strong>Authenticated users : </strong>All AWS accounts. Access permission to this group allows any AWS account to access {{detailedBucket.bucket}} and its content (authenticated requests only).</span><br>
	<span><strong>All users : </strong>Access permission to this group allows anyone to access {{detailedBucket.bucket}} and its content.</span><br>
    </div>

    <div id="about" ng-switch-when="modifyaccess"> <!-- doesn't work and i don't get it :( #EC -->
	<i class="icon-info-sign" alt="about permissions" style="float:left"></i><h3>About permissions</h3><br>
	<span><strong>Read : </strong>{{user}} can see all of the objects in {{bucketName}}</span><br>
	<span><strong>Write : </strong>{{user}} can create, replace and delete objects in {{bucketName}}</span><br>
	<span><strong>Read ACP : </strong>{{user}} can read {{detailedBucket.bucket}}'s access list</span><br>
	<span><strong>Write ACP : </strong>{{user}} can edit the {{detailedBucket.bucket}}'s access list</span><br>
	<span><strong>Full Control : </strong>{{user}} can Read, Write, Read ACP and Write ACP in {{bucketName}}</span>
    </div>
</div>

<script>resizeBlocks(['#list','#control']);</script>

</body>
</html>
