Merge pull request #72 from refortin/collapsible-box

Add ability to collapse the Folder Owners box on folder and node pages.
jenkinsci · Oct 7, 2018 · 48b99ad · 48b99ad
2 parents 2b619c3 + 3bfb5c4
commit 48b99ad
Show file tree

Hide file tree

Showing 2 changed files with 81 additions and 49 deletions.
diff --git a/...rces/com/synopsys/arc/jenkins/plugins/ownership/OwnershipPlugin/floatingBoxTemplate.jelly b/...rces/com/synopsys/arc/jenkins/plugins/ownership/OwnershipPlugin/floatingBoxTemplate.jelly
@@ -43,59 +43,62 @@
     <!-- Layout for ownership with available data -->
     <j:if test="${helper.isDisplayOwnershipSummaryBox(item) and ownershipDescription.ownershipEnabled}">
       <div class="ownership-summary-box">   
-        <div class="ownership-header">${itemType} ${%Owners}</div>            
-        <table>
-            <tr>
-                <td>
-                    <div class="ownership-section">${%Primary}</div>
-                </td>
-                <td>
-                    <div class="ownership-user-info">
-                        <j:out value="${layoutFormatter.formatOwner(item, helper.getOwner(item))}"/>
-                    </div>
-                </td>
-            </tr>
-
-            <!-- Secondary owners (fka Co-owners) -->    
-            <j:set var="coownersList" value="${helper.getOwnershipDescription(item).getCoownersIds()}"/>
-            <j:if test="${not coownersList.isEmpty()}">
+        <input class="ownership-toggle-box" id="ownership-toogle-1" type="checkbox" />
+        <label for="ownership-toogle-1">${itemType} ${%Owners}</label>           
+        <div>
+            <table>
                 <tr>
-                    <td>        
-                        <div class="ownership-section">${%Secondary}</div>
-                    </td>       
                     <td>
-                        <j:forEach var="coownerId" items="${coownersList}">
-                            <div class="ownership-user-info">                   
-                                <j:out value="${layoutFormatter.formatOwner(item, coownerId)}"/>
-                            </div>
-                        </j:forEach>  
+                        <div class="ownership-section">${%Primary}</div>
+                    </td>
+                    <td>
+                        <div class="ownership-user-info">
+                            <j:out value="${layoutFormatter.formatOwner(item, helper.getOwner(item))}"/>
+                        </div>
                     </td>
                 </tr>
-            </j:if>
-        </table>
-
-        <div class="ownership-contact-links"> 
-            <table>
-                <tr>  
-                    <!-- Contact Owners link -->
-                    <j:set var="ownersMailToLink" value="${layoutFormatter.formatContactOwnersLink(item,helper)}"/>
-                    <j:if test="${ownersMailToLink != null}">   
-                        <td>    
-                            <img src="${imagesURL}/24x24/user.png"/>
-                            <a href="${ownersMailToLink}">${%ownersMailToLink.text(itemType)}</a>
-                        </td>
-                    </j:if>
-
-                    <!-- Contact Admins link -->
-                    <j:set var="adminsMailToLink" value="${layoutFormatter.formatContactAdminsLink(item,helper)}"/>
-                    <j:if test="${adminsMailToLink != null}">
+
+                <!-- Secondary owners (fka Co-owners) -->    
+                <j:set var="coownersList" value="${helper.getOwnershipDescription(item).getCoownersIds()}"/>
+                <j:if test="${not coownersList.isEmpty()}">
+                    <tr>
+                        <td>        
+                            <div class="ownership-section">${%Secondary}</div>
+                        </td>       
                         <td>
-                            <img src="${imagesURL}/24x24/setting.png"/>
-                            <a href="${adminsMailToLink}">${%adminsMailToLink.text}</a>
+                            <j:forEach var="coownerId" items="${coownersList}">
+                                <div class="ownership-user-info">                   
+                                    <j:out value="${layoutFormatter.formatOwner(item, coownerId)}"/>
+                                </div>
+                            </j:forEach>  
                         </td>
-                    </j:if>
-                </tr>
+                    </tr>
+                </j:if>
             </table>
+
+            <div class="ownership-contact-links"> 
+                <table>
+                    <tr>  
+                        <!-- Contact Owners link -->
+                        <j:set var="ownersMailToLink" value="${layoutFormatter.formatContactOwnersLink(item,helper)}"/>
+                        <j:if test="${ownersMailToLink != null}">   
+                            <td>    
+                                <img src="${imagesURL}/24x24/user.png"/>
+                                <a href="${ownersMailToLink}">${%ownersMailToLink.text(itemType)}</a>
+                            </td>
+                        </j:if>
+
+                        <!-- Contact Admins link -->
+                        <j:set var="adminsMailToLink" value="${layoutFormatter.formatContactAdminsLink(item,helper)}"/>
+                        <j:if test="${adminsMailToLink != null}">
+                            <td>
+                                <img src="${imagesURL}/24x24/setting.png"/>
+                                <a href="${adminsMailToLink}">${%adminsMailToLink.text}</a>
+                            </td>
+                        </j:if>
+                    </tr>
+                </table>
+            </div>
         </div>
       </div>
     </j:if>

diff --git a/src/main/webapp/css/ownership.css b/src/main/webapp/css/ownership.css
@@ -1,5 +1,5 @@
 .ownership-summary-box {
-    width: 400px;
+    width: 75%;
     background-color: #F0F0F0;
     border-color: #BBBBBB;
     border-style: double;
@@ -21,10 +21,39 @@
 }
 
 .ownership-text {
-
 }
 
 .ownership-contact-links {
     margin-left: 5px;
     border-spacing: 5px;
-}
+}
+
+.ownership-toggle-box {
+  display: none;
+}
+
+.ownership-toggle-box + label {
+    text-align: center;
+    font-weight: bold;
+}
+
+.ownership-toggle-box + label:before {
+  color: #000000;
+  content: "\25BA";
+  display: block;
+  float: left;
+  text-align: center;
+  margin-right: 10px;
+}
+
+.ownership-toggle-box:checked + label:before {
+  content: "\25BC";
+}
+
+.ownership-toggle-box + label + div {
+  display: none;
+}
+
+.ownership-toggle-box:checked + label + div {
+  display: block;
+}