GUAC-1099: Paginate management interface. Remove styles from ui.css where possible/relevant.

guacamole/src/main/webapp/app/index/styles/ui.css

@@ -289,51 +289,6 @@ div.section {
     background-image: url('images/group-icons/guac-open.png');
 }
 
-/*
- * Settings formatting
- */
-
-.form dt,
-.settings dt {
-    border-bottom: 1px dotted #AAA;
-    padding-bottom: 0.25em;
-}
-
-.form dd,
-.settings dd {
-    margin: 1.5em;
-    margin-left: 2.5em;
-    font-size: 0.75em;
-}
-
-.connections input.name,
-.users input.name {
-    max-width: 80%;
-    width: 20em;
-}
-
-.connection-list,
-.user-list {
-    border: 1px solid rgba(0, 0, 0, 0.25);
-    height: 20em;
-    -moz-border-radius: 0.2em;
-    -webkit-border-radius: 0.2em;
-    -khtml-border-radius: 0.2em;
-    border-radius: 0.2em;
-    overflow: auto;
-}
-
-.connections .add-connection,
-.connections .add-connection-group,
-.users .add-user {
-    font-size: 0.8em;
-}
-
-.connection-add-form,
-.user-add-form {
-    margin-bottom: 0.5em;
-}
-
 div.logout-panel {
     padding: 0.45em;
     text-align: right;

guacamole/src/main/webapp/app/manage/manageModule.js

@@ -23,5 +23,5 @@
 /**
  * The module for the administration functionality.
  */
-angular.module('manage', ['groupList', 'locale', 'rest']);
+angular.module('manage', ['groupList', 'locale', 'pager', 'rest']);
 

guacamole/src/main/webapp/app/manage/styles/buttons.css

@@ -20,6 +20,12 @@
  * THE SOFTWARE.
  */
 
+button.add-user,
+a.button.add-connection,
+a.button.add-connection-group {
+    font-size: 0.8em;
+}
+
 button.add-user {
 
     background-image: url('images/action-icons/guac-user-add.png');

guacamole/src/main/webapp/app/manage/styles/forms.css

@@ -30,3 +30,12 @@
     text-align: center;
     margin-bottom: 1em;
 }
+
+.manage .user-add-form {
+    margin-bottom: 0.5em;
+}
+
+.manage .user-add-form input.name {
+    max-width: 80%;
+    width: 20em;
+}

guacamole/src/main/webapp/app/manage/styles/lists.css

@@ -0,0 +1,31 @@
+/*
+ * Copyright (C) 2015 Glyptodon LLC
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+ * THE SOFTWARE.
+ */
+
+.manage .connection-list .group-list-page,
+.manage .user-list {
+    border: 1px solid rgba(0, 0, 0, 0.25);
+    min-height: 15em;
+    -moz-border-radius: 0.2em;
+    -webkit-border-radius: 0.2em;
+    -khtml-border-radius: 0.2em;
+    border-radius: 0.2em;
+}

guacamole/src/main/webapp/app/manage/templates/manage.html

@@ -44,7 +44,7 @@ THE SOFTWARE.
 
             <!-- List of users this user has access to -->
             <div class="user-list">
-                <div ng-repeat="user in users | orderBy : 'username'" class="user list-item">
+                <div ng-repeat="user in userPage" class="user list-item">
                     <a ng-href="#/manage/users/{{user.username}}">
                         <div class="caption">
                             <div class="icon user"></div>
@@ -53,6 +53,10 @@ THE SOFTWARE.
                     </a>
                 </div>
             </div>
+
+            <!-- Pager controls for user list -->
+            <guac-pager page="userPage" items="users | orderBy : 'username'"></guac-pager>
+
         </div>
     </div>
 

guacamole/src/main/webapp/app/manage/templates/manageUser.html

@@ -68,7 +68,8 @@ THE SOFTWARE.
             context="groupListContext"
             connection-group="rootGroup"
             connection-template="'app/manage/templates/connectionPermission.html'"
-            connection-group-template="'app/manage/templates/connectionGroupPermission.html'"/>
+            connection-group-template="'app/manage/templates/connectionGroupPermission.html'"
+            page-size="20"/>
     </div>
 
     <!-- Form action buttons -->