#27 collection/tabs

irods-contrib · Jan 23, 2018 · 57858b4 · 57858b4
2 parents 1b7f4f7 + 7f054bf
commit 57858b4
Show file tree

Hide file tree

Showing 28 changed files with 310 additions and 156 deletions.
diff --git a/src/emc-metalnx-shared/src/main/resources/i18n/messages_en.properties b/src/emc-metalnx-shared/src/main/resources/i18n/messages_en.properties
@@ -27,8 +27,13 @@ text.close=Close
 text.modification.date=Modification Date
 text.not.contains=Does Not Contain
 text.path=Path
+text.properties=Properties
 text.replica.number=Replica Number
 text.resource.name=Resource Name
+text.replica=Replica
+text.reset=Reset
+text.root=Root(/)
+text.search=Search
 text.size=Size
 text.owner.name=Owner Name
 
@@ -386,6 +391,7 @@ private.menu.title=Private Library
 user.profile.label=User Profile
 user.preferences.label=Preferences
 user.logout.label=Logout
+template.add.attribute=Add Attribute
 
 # Preferences Page
 preferences.page.title=Preferences
@@ -447,7 +453,7 @@ collections.management.progress.label.permissions=Retrieving permissions...
 collections.management.btn.action.add.collection=Add Collection
 collections.management.btn.action.upload=Upload
 collections.management.btn.action.download=Download
-
+collections.management.upload.upload.status=Upload Status
 collections.management.msg.access.denied=You do not have permissions to access information in the target collection or for the selected object.
 
 ## Collections tooltips

diff --git a/src/emc-metalnx-shared/src/main/resources/views/collections/collectionInfo.html b/src/emc-metalnx-shared/src/main/resources/views/collections/collectionInfo.html
@@ -1,4 +1,3 @@
-
 <html xmlns="http://www.w3.org/1999/xhtml"
 	xmlns:th="http://www.thymeleaf.org"
 	xmlns:layout="http://www.thymeleaf.org" lang="en"
@@ -9,6 +8,85 @@
 
 		<div class="row">
 			<th:block th:include="collections/summary :: summaryView"></th:block>
+<!--
+  ~ Copyright (c) 2015-2017, Dell EMC
+  ~
+  ~  Licensed under the Apache License, Version 2.0 (the "License");
+  ~  you may not use this file except in compliance with the License.
+  ~  You may obtain a copy of the License at
+  ~
+  ~  http://www.apache.org/licenses/LICENSE-2.0
+  ~
+  ~  Unless required by applicable law or agreed to in writing, software
+  ~  distributed under the License is distributed on an "AS IS" BASIS,
+  ~  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  ~  See the License for the specific language governing permissions and
+  ~  limitations under the License.
+  -->
+
+<th:block th:fragment="treeView">
+	<!-- <div class="col-md-12" th:fragment="treeView" xmlns:th="http://www.w3.org/1999/xhtml"> -->
+
+
+	<div class="col-md-12" th:unless="${dataProfile == null}">
+
+		<div th:unless="${dataProfile.file}" th:fragment="collectionInfoView">
+			<span>this is collection Info</span>
+			<div class="panel property">
+				<div class="row">
+					<h4 class="property-title" th:text="#{text.info}">
+						<i class="fa fa-info-circle"></i>
+					</h4>
+					<div class="col-md-12 col-sm-12">
+						<div class="col-md-12 col-sm-12 collLesserInfo divider"></div>
+					</div>
+				</div>
+				<div class="panel-info">
+					<div class="name">
+						<i th:class="${ iconToDisplay }"></i> <span><b
+							th:text="${ dataProfile.getDomainObject().getCollectionName() }"></b></span>
+						<!--  <span class="resulting-permission" th:text="${ '[' + collectionAndDataObject.getMostPermissiveAccessForCurrentUser() + ' access]'}"></span> -->
+						<a id="breadcrumbStar" class="btn-favorite" href="#"
+							data-toggle="popover" data-placement="left" data-trigger="manual"
+							data-content=""
+							th:title="${dataProfile.starred}?#{collections.favorite.unmark.button.tooltip}:#{collections.favorite.button.tooltip}">
+							<i
+							th:class="true? 'fa fa-star bm-checked' : 'fa fa-star bm-unchecked'"
+							aria-hidden="true"></i>
+						</a>
+					</div>
+
+
+					<div class="row">
+						<div class="text-right col-md-1 col-sm-4 col-xs-4">
+							<label th:text="#{collections.management.table.owner.label}"></label>
+						</div>
+						<!--    <div class="col-md-9 col-sm-8 col-xs-8"><span th:text="${ currentCollection.getOwner() }"></span></div> -->
+					</div>
+					<div class="row">
+						<div class="text-right col-md-1 col-sm-4 col-xs-4">
+							<label for="createdAt" th:text="#{collections.management.table.created.label}"></label>
+						</div>
+						<div class="col-md-9 col-sm-8 col-xs-8">
+							<span id="createdAt" th:text="${ dataProfile.getDomainObject().getCreatedAt() }"></span>
+						</div>
+					</div>
+					<div class="row">
+						<div class="text-right col-md-1 col-sm-4 col-xs-4">
+							<label for="modifiedAt" th:text="#{collections.management.table.modified.label}"></label>
+						</div>
+						<div class="col-md-9 col-sm-8 col-xs-8">
+							<span id="modifiedAt"
+								th:text="${ dataProfile.getDomainObject().getModifiedAt() }"></span>
+						</div>
+					</div>
+					<!-- Will we have checksum on collection??? <div class="row">
+                    <div class="text-right col-md-1 col-sm-4 col-xs-4"><label th:text="#{collections.management.checksum.label}"></label></div>
+                    <div class="col-md-9 col-sm-8 col-xs-8"><span th:text="${ dataProfile.getChecksum() }"></span></div>
+                </div> -->
+				</div>
+			</div>
+
 		</div>
 
 		<div id="tabs">
@@ -47,6 +125,54 @@
 				<div id="info">
 					<th:block th:include="collections/info :: infoView"></th:block>
 					<!-- <th:block th:unless="${dataProfile.file}" th:include="collections/collectionInfo :: collectionInfoView"></th:block> -->
+
+				<div class="panel-info">
+					<div class="name">
+						<i th:class="${ iconToDisplay }"></i> <span><b
+							th:text="${ dataProfile.getDomainObject().getCollectionName() }"></b></span>
+						<!--  <span class="resulting-permission" th:text="${ '[' + collectionAndDataObject.getMostPermissiveAccessForCurrentUser() + ' access]'}"></span> -->
+						<a id="breadcrumbStar" class="btn-favorite" href="#"
+							data-toggle="popover" data-placement="left" data-trigger="manual"
+							data-content=""
+							th:title="${dataProfile.starred}?#{collections.favorite.unmark.button.tooltip}:#{collections.favorite.button.tooltip}">
+							<i
+							th:class="true? 'fa fa-star bm-checked' : 'fa fa-star bm-unchecked'"
+							aria-label="access the info page for details"></i>
+						</a>
+					</div>
+
+
+					<div class="row">
+						<div class="text-right col-md-1 col-sm-4 col-xs-4">
+							<label th:text="#{collections.management.table.owner.label}"></label>
+						</div>
+						<!--    <div class="col-md-9 col-sm-8 col-xs-8"><span th:text="${ currentCollection.getOwner() }"></span></div> -->
+					</div>
+					<div class="row">
+						<div class="text-right col-md-1 col-sm-4 col-xs-4">
+							<label for="createdAt" th:text="#{collections.management.table.created.label}"></label>
+						</div>
+						<div id="createdAt" class="col-md-9 col-sm-8 col-xs-8">
+							<span th:text="${ dataProfile.getDomainObject().getCreatedAt() }"></span>
+						</div>
+					</div>
+					<div class="row">
+						<div class="text-right col-md-1 col-sm-4 col-xs-4">
+							<label for="updatedAt" th:text="#{collections.management.table.modified.label}"></label>
+						</div>
+						<div class="col-md-9 col-sm-8 col-xs-8" >
+							<span id="updatedAt" th:text="${ dataProfile.getDomainObject().getUpdatedAt() }"></span>
+						</div>
+					</div>
+					<div class="row">
+						<div class="text-right col-md-1 col-sm-4 col-xs-4">
+							<label for="checksum" th:text="#{collections.management.checksum.label}"></label>
+						</div>
+						<div class="col-md-9 col-sm-8 col-xs-8">
+							<span id="checksum" th:text="${ dataProfile.getDomainObject().getChecksum() }"></span>
+						</div>
+					</div>
+
 				</div>
 
 				<div id="metadata"></div>

diff --git a/src/emc-metalnx-shared/src/main/resources/views/collections/collectionManagement.html b/src/emc-metalnx-shared/src/main/resources/views/collections/collectionManagement.html
@@ -1,4 +1,3 @@
-<!DOCTYPE html>
 <!--
   ~ Copyright (c) 2015-2017, Dell EMC
   ~
@@ -32,17 +31,17 @@
 </head>
 
 <body>
-	<div layout:fragment="content">
-		<h1 class="page-header pull-left" th:text="#{collections.management.page.title}" th:data-content="#{collection.title.popover}"></h1>
-		<a id="collections-page-title" href="#" class="page-hint pull-left"><i class="fa fa-question-circle"></i></a>
+	<div aria-labelledby="collManagement" layout:fragment="content">
+		<h1 id="collManagement" class="page-header pull-left" th:text="#{collections.management.page.title}" th:data-content="#{collection.title.popover}"></h1>
+		<a aria-label="page help" id="collections-page-title" href="#" class="page-hint pull-left"><i class="fa fa-question-circle"></i></a>
 		<ol class="breadcrumb mlx"  th:if="${cameFromMetadataSearch} == true"
 					id="backToMetadataSearch">
-		  <li><a href="/emc-metalnx-web/metadata/?backFromCollections=true">Search Results</a></li>
+		  <li><a href="/emc-metalnx-web/metadata/?backFromCollections=true" aria-hidden="true">Search Results</a></li>
 		  <li class="active">Collections</li>
 		</ol>
 		<ol class="breadcrumb mlx"  th:if="${cameFromFilePropertiesSearch} == true"
 					id="backToFilePropertiesSearch">
-		  <li><a href="/emc-metalnx-web/fileproperty/?backFromCollections=true">Search Results</a></li>
+		  <li><a href="/emc-metalnx-web/fileproperty/?backFromCollections=true" aria-hidden="true">Search Results</a></li>
 		  <li class="active">Collections</li>
 		</ol>
         <div th:if="${unexpectedError}">
@@ -214,7 +213,7 @@ <h4 class="modal-title" id="myCopyModalLabel">Copy item to</h4>
 							<div role="tabpanel" class="tab-pane active" id="copyCollections">
 								<th:block th:if="${userDetails.isAdmin()}">
 									<p>
-										<a href="#" name="/" title="/"
+										<a aria-label="copy collection" href="#" name="/" title="/"
 											onclick="getSubDirectoriesOldTree('iRods', '/');"> <img
 											alt="" class="folder-icon" th:src="@{ /images/folder-16.png }"
 											name="/" /> <span>iRods</span>
@@ -223,7 +222,7 @@ <h4 class="modal-title" id="myCopyModalLabel">Copy item to</h4>
 								</th:block>
 								<th:block th:unless="${userDetails.isAdmin()}">
 									<p>
-										<a href="#" th:name="${homePath}"
+										<a href="#" th:name="${homePath}" area-label="user home directory"
 											th:title="${userDetails.getUsername()}"
 											th:onclick="'javascript:getSubDirectoriesOldTree(\'' + ${userDetails.getUsername()} + '\', \'' + ${homePath} + '\');'">
 
@@ -233,7 +232,7 @@ <h4 class="modal-title" id="myCopyModalLabel">Copy item to</h4>
 										</a>
 									</p>
 									<p>
-										<a href="#" th:name="Public" th:title="Public"
+										<a href="#" th:name="Public" th:title="Public" aria-label="public"
 											th:onclick="'javascript:getSubDirectoriesOldTree(\'Public\', \'' + ${publicPath} + '\');'">
 											<i class="glyphicon glyphicon-globe"></i> <span>Public</span>
 										</a>
@@ -274,7 +273,7 @@ <h4 class="modal-title" id="myCopyModalLabel">Copy item to</h4>
 						</div>
                         <div class="col-xs-12">
                             <input type="checkbox" id="inputCopyWithMetadata" name="replica" value="1" checked="checked"/>
-                            <span th:text="#{copy.with.metadata.label}"></span>
+                            <label for="inputCopyWithMetadata" th:text="#{copy.with.metadata.label}">Copy with metadata</label>
 						</div>
 					</div>
 					<div class="modal-footer">
@@ -303,7 +302,7 @@ <h4 class="modal-title" id="myCopyModalLabel">Copy item to</h4>
 						<button type="button" class="close" data-dismiss="modal">
 							<span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
 						</button>
-						<h4 class="modal-title" id="myMoveModalLabel">Move item to</h4>
+						<h4  class="modal-title" id="myMoveModalLabel">Move item to</h4>
 					</div>
 					<div class="modal-body">
 						<ul class="nav nav-tabs" role="tablist">
@@ -324,7 +323,7 @@ <h4 class="modal-title" id="myMoveModalLabel">Move item to</h4>
 							<div role="tabpanel" class="tab-pane active" id="moveCollections">
 								<th:block th:if="${userDetails.isAdmin()}">
 									<p>
-										<a href="#" name="/" title="/"
+										<a href="#" name="/" title="/" aria-label="Move collection"
 											onclick="getSubDirectoriesOldTree('iRods', '/');"> <img
 											alt="" class="folder-icon" th:src="@{ /images/folder-16.png }"
 											name="/" /> <span>iRods</span>
@@ -333,7 +332,7 @@ <h4 class="modal-title" id="myMoveModalLabel">Move item to</h4>
 								</th:block>
 								<th:block th:unless="${userDetails.isAdmin()}">
 									<p>
-										<a href="#" th:name="${homePath}"
+										<a href="#" th:name="${homePath}" aria-label="User home dir"
 											th:title="${userDetails.getUsername()}"
 											th:onclick="'javascript:getSubDirectoriesOldTree(\'' + ${userDetails.getUsername()} + '\', \'' + ${homePath} + '\');'">
 
@@ -343,7 +342,7 @@ <h4 class="modal-title" id="myMoveModalLabel">Move item to</h4>
 										</a>
 									</p>
 									<p>
-										<a href="#" th:name="Public" th:title="Public"
+										<a href="#" th:name="Public" th:title="Public" aria-label="Public dir"
 											th:onclick="'javascript:getSubDirectoriesOldTree(\'Public\', \'' + ${publicPath} + '\');'">
 											<i class="glyphicon glyphicon-globe"></i> <span>Public</span>
 										</a>
@@ -409,7 +408,7 @@ <h4 class="modal-title" id="myMoveModalLabel">Move item to</h4>
 						<button type="button" class="close" data-dismiss="modal">
 							<span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
 						</button>
-						<h4 class="modal-title" th:text="#{replicate.modal.title}"></h4>
+						<h4 id="myReplicateModalLabel" class="modal-title" th:text="#{replicate.modal.title}"></h4>
 					</div>
 					<div class="modal-body">
 						<form action="/emc-metalnx-web/fileOperation/replicate/"
@@ -439,14 +438,14 @@ <h4 class="modal-title" th:text="#{replicate.modal.title}"></h4>
 
 		<!-- Delete Modal -->
 		<div class="modal fade" id="deleteModal" tabindex="-1" role="dialog"
-			aria-labelledby="myModalLabel" aria-hidden="true">
+			aria-labelledby="deleteModalLabel" aria-hidden="true">
 			<div class="modal-dialog">
 				<div class="modal-content">
 					<div class="modal-header">
 						<button type="button" class="close" data-dismiss="modal">
 							<span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
 						</button>
-						<h4 class="modal-title" th:text="#{confirmation.deletion.title}"></h4>
+						<h4 id="deleteModalLabel" class="modal-title" th:text="#{confirmation.deletion.title}"></h4>
 					</div>
 					<div class="modal-body">
 						<span th:text="#{confirmation.deletion.label}"></span> <span
@@ -465,14 +464,14 @@ <h4 class="modal-title" th:text="#{confirmation.deletion.title}"></h4>
 
 		<!-- Upload Modal -->
 		<div class="modal fade" id="uploadModal" tabindex="-1" role="dialog"
-			aria-labelledby="myModalLabel" aria-hidden="true">
+			aria-labelledby="uploadModalLabel" aria-hidden="true">
 			<div class="modal-dialog">
 				<div class="modal-content">
 					<div class="modal-header">
 						<button type="button" class="close" data-dismiss="modal">
 							<span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
 						</button>
-						<h4 class="modal-title" th:text="#{upload.label}"></h4>
+						<h4 id="uploadModalLabel" class="modal-title" th:text="#{upload.label}"></h4>
 					</div>
 					<div class="modal-body">
 						<div class="hideElement" id="uploadMinMessage">
@@ -492,8 +491,8 @@ <h4 class="modal-title" th:text="#{upload.label}"></h4>
 
 
 							<p class="text-right">
-								<span id="numberFilesUpload">No</span><span>&nbsp;file(s)
-									selected</span>
+								<label id="numberFilesUpload"># file(s)
+									selected</label>
 							</p>
 							<div class="well">
 								<!-- <div class="col-sm-4 col-sm-offset-4" style="align-items: center; display: flex; min-height: 100%;"> -->
@@ -512,14 +511,15 @@ <h4 class="modal-title" th:text="#{upload.label}"></h4>
 
 									<div class="row form-group">
 										<th:block th:if="${dataGridUser.isAdvancedView()}">
-										<div class="col-md-6">Resource</div>
+										<div class="col-md-6" th:text="#{text.resource.name}">Resource</div>
 										<div class="col-md-6">
 												<input type="checkbox" id="inputReplica" name="replica"
-													value="1" /> &nbsp;&nbsp;<span>Replica</span>
+													value="1" />
+													<label for="inputReplica" th:text="#{text.replica}">Replica</label>
 										</div>
 
 										<div class="col-md-6">
-											<select class="form-control" name="resourceToUpload"
+											<select class="form-control" name="resourceToUpload" aria-label="Resource to upload"
 												id="selectResourceToUpload">
 											</select>
 										</div>
@@ -534,14 +534,14 @@ <h4 class="modal-title" th:text="#{upload.label}"></h4>
 
  								<div class="row form-group">
 									<div class="col-md-6">
-										<input type="checkbox" id="inputOverwriteDuplicateFiles"
+										<input type="checkbox" id="inputOverwriteDuplicateFiles" aria-label="overwrite on upload"
 											name="inputOverwriteDuplicateFiles"
 											th:checked="${overwriteFileOption}" /> &nbsp;&nbsp;<span>Overwrite
 											duplicate files</span>
 									</div>
 									<th:block th:if="${dataGridUser.isAdvancedView()}">
 									<div class="col-md-6">
-										<input type="checkbox" id="inputChecksum" name="checksum"
+										<input type="checkbox" id="inputChecksum" name="checksum" aria-label="compute checksum"
 										value="1" /> &nbsp;&nbsp;<span>Checksum</span>
 									</div>
 									</th:block>
@@ -562,8 +562,8 @@ <h4 class="modal-title" th:text="#{upload.label}"></h4>
 									<table class="table">
 										<thead>
 											<tr>
-												<th>File Name</th>
-												<th>Upload Status</th>
+												<th th:text="#{text.file.name}">File Name</th>
+												<th th:text="#{collections.management.upload.upload.status}">Upload Status</th>
 											</tr>
 										</thead>
 										<tbody class="upload-window">
@@ -625,7 +625,7 @@ <h4 class="modal-title" th:text="#{upload.label}"></h4>
 						this.reset();
 					});
 					$('#filesList').html('');
-					$('#numberFilesUpload').html('No');
+					$('#numberFilesUpload').html('Number of files to upload');
 					$('#uploadControlOptions').hide();
 					$('#uploadForm').show();
 					$('#browseButton').show();