[Kimchi-devel] [PATCHv2 1/2] UI: support ldap vm permission tag

lvroyce at linux.vnet.ibm.com lvroyce at linux.vnet.ibm.com
Thu Nov 20 10:22:06 UTC 2014


From: Royce Lv <lvroyce at linux.vnet.ibm.com>

Add corresponding html and css to support vm permission.

Signed-off-by: Royce Lv <lvroyce at linux.vnet.ibm.com>
---
 ui/css/theme-default/guest-edit.css | 79 ++++++++++++++++++++++++++++---------
 ui/pages/guest-edit.html.tmpl       | 28 ++++++++++++-
 2 files changed, 87 insertions(+), 20 deletions(-)

diff --git a/ui/css/theme-default/guest-edit.css b/ui/css/theme-default/guest-edit.css
index b1d3931..11d0ff7 100644
--- a/ui/css/theme-default/guest-edit.css
+++ b/ui/css/theme-default/guest-edit.css
@@ -168,22 +168,26 @@
     padding: 5px 10px!important;
 }
 
-.guest-edit-permission .column {
+.guest-edit-permission .hide {
+    display: none;
+}
+
+.guest-edit-permission .pam .column {
     display: inline-block;
     vertical-align: top;
 }
 
-.guest-edit-permission .title {
+.guest-edit-permission .pam .title {
     margin-bottom: 3px;
 }
 
-.guest-edit-permission input[type="text"] {
+.guest-edit-permission .pam input[type="text"] {
     margin-bottom: 3px;
     font-size: 12px;
     width: 97%;
 }
 
-.guest-edit-permission .body {
+.guest-edit-permission .pam .body {
     border: 1px solid #999999;
     font-size: 12px;
     padding: 1px;
@@ -191,77 +195,114 @@
     overflow: auto;
 }
 
-.guest-edit-permission .body .head {
+.guest-edit-permission .pam .body .head {
     margin-bottom: 3px;
     font-weight: bold;
     background: linear-gradient(to bottom, #E5E5E5 0%, #C4C4C4 100%) repeat scroll 0 0 transparent;
 }
 
-.guest-edit-permission .body .item {
+.guest-edit-permission .pam .body .item {
     padding: 2px 3px;
     margin-bottom: 1px;
     cursor: pointer;
 }
 
-.guest-edit-permission .body .item:hover {
+.guest-edit-permission .pam .body .item:hover {
     background-color: #AAAAAA;
 }
 
-.guest-edit-permission .body .item-picked {
+.guest-edit-permission .pam .body .item-picked {
     background-color: #BBBBBB;
 }
 
-.guest-edit-permission .body .item .icon {
+.guest-edit-permission .pam .body .item .icon {
     display: inline-block;
     height: 15px;
     width: 15px;
     vertical-align: bottom;
 }
 
-.guest-edit-permission .body .item .user-icon {
+.guest-edit-permission .pam .body .item .user-icon {
     background: url('/images/theme-default/user.png') no-repeat scroll;
     background-size: 15px 15px;
 }
 
-.guest-edit-permission .body .item .group-icon {
+.guest-edit-permission .pam .body .item .group-icon {
     background: url('/images/theme-default/group.png') no-repeat scroll;
     background-size: 15px 15px;
 }
 
-.guest-edit-permission .body .column-user {
+.guest-edit-permission .pam .body .column-user {
     width: 48%;
 }
-.guest-edit-permission .body .column-group {
+.guest-edit-permission .pam .body .column-group {
     width: 50%;
 }
 
-.guest-edit-permission .control {
+.guest-edit-permission .pam .control {
     width: 5%;
 }
 
-.guest-edit-permission .control button {
+.guest-edit-permission .pam .control button {
     width: 26px;
     margin-left: 7px;
 }
 
-.guest-edit-permission .control button:first-child {
+.guest-edit-permission .pam .control button:first-child {
     margin-top: 110px;
     margin-bottom: 2px;
 }
 
-.guest-edit-permission .control .ui-button-text-only .ui-button-text {
+.guest-edit-permission .pam .control .ui-button-text-only .ui-button-text {
     padding: 2px 8px;
 }
 
-.guest-edit-permission .avail {
+.guest-edit-permission .pam .avail {
     width: 46%;
 }
 
-.guest-edit-permission .selected {
+.guest-edit-permission .pam .selected {
     width: 46%;
     float: right;
 }
 
+#form-guest-edit-permission .ldap .header {
+    font-weight: bold;
+    padding-bottom: 2px;
+    margin-bottom: 8px;
+    border-bottom: 1px solid #999;
+}
+
+#form-guest-edit-permission .ldap .body .item {
+    margin: 8px 0;
+}
+
+#form-guest-edit-permission .ldap .cell {
+    width: 250px;
+}
+
+#form-guest-edit-permission .ldap .action-area {
+    float: right;
+    line-height: 24px;
+}
+
+#form-guest-edit-permission .ldap button {
+    width: 20px;
+    height: 20px;
+}
+
+#form-guest-edit-permission .ldap .header button {
+    margin-bottom: 1px;
+}
+
+#form-guest-edit-permission .ldap .checked {
+    display: inline-block;
+}
+
+#form-guest-edit-permission .ldap .checked.hide {
+    display: none;
+}
+
 .guest-edit-pci {
     height: 79%;
     overflow: auto;
diff --git a/ui/pages/guest-edit.html.tmpl b/ui/pages/guest-edit.html.tmpl
index 512909a..1be7ed4 100644
--- a/ui/pages/guest-edit.html.tmpl
+++ b/ui/pages/guest-edit.html.tmpl
@@ -112,6 +112,7 @@
                 <div class="body"></div>
             </form>
             <form id="form-guest-edit-permission" class="guest-edit-permission">
+                <div class="pam">
                     <div class="column avail">
                         <div class="title">$_("Available system users and groups")</div>
                         <input type="text" id="permission-avail-searchBox">
@@ -140,6 +141,14 @@
                             <div id="permission-sel-groups"  class="column column-group"></div>
                         </div>
                     </div>
+                </div>
+                <div class="ldap">
+                    <div class="header">
+                        <span class="cell">$_("User")</span>
+                        <button type="button" id="guest-edit-add-user-button" class="action-area add"></button>
+                    </div>
+                    <div class="body"></div>
+                </div>
             </form>
             <form id="form-guest-edit-pci" class="guest-edit-pci">
                 <div class="guest-scroll-indent">
@@ -218,6 +227,23 @@
         </span>
     <div>
 </script>
+<script id="ldap-user-tmpl" type="text/html">
+    <div class="item" id="{user}">
+        <span class="cell">
+            <label class="{viewMode}">{user}</label>
+            <input type="text" class="{editMode}"/>
+        </span>
+        <span class="checked ui-icon ui-icon-notice">
+        </span>
+        <span class="action-area {editMode}">
+            <button class="cancel"></button>
+        </span>
+        <span class="action-area {viewMode}">
+            <button class="edit"></button>
+            <button class="delete"></button>
+        </span>
+    <div>
+</script>
 <script id="disk-row-tmpl" type="text/html">
     <div class="item" id="cdrom-{dev}">
         <span class="cell dev">
@@ -237,7 +263,7 @@
         </span>
     </div>
 </script>
-<script id="permission-item" type="text/html">
+<script id="permission-item-pam" type="text/html">
 <div class="item">
     <span class="icon {class}"></span>
     <label>{val}</label>
-- 
1.8.3.2




More information about the Kimchi-devel mailing list