new system for object list
authorcavaliet
Fri, 13 Sep 2013 10:31:33 +0200
changeset 79 d585f6b46b88
parent 73 d1b176885515
child 80 c1e36f5911a9
new system for object list
src/p4l/static/p4l/css/p4l.css
src/p4l/static/p4l/js/p4l.js
src/p4l/static/p4l/templates/imprintDisp.html
src/p4l/static/p4l/templates/objectListTable.html
src/p4l/static/p4l/templates/serieDisp.html
src/p4l/static/p4l/templates/urlDisp.html
src/p4l/templates/p4l/record_update_form.html
--- a/src/p4l/static/p4l/css/p4l.css	Thu Sep 12 11:42:29 2013 +0200
+++ b/src/p4l/static/p4l/css/p4l.css	Fri Sep 13 10:31:33 2013 +0200
@@ -45,6 +45,12 @@
 	opacity: .7;
 	margin-right: 4px;
 }
+.grey-bottom {
+    border-bottom: 1px dotted #CCC;
+}
+.grey-hover:hover {
+    background-color: #EEE;
+}
 /* Flags */
 
 .flag {
--- a/src/p4l/static/p4l/js/p4l.js	Thu Sep 12 11:42:29 2013 +0200
+++ b/src/p4l/static/p4l/js/p4l.js	Fri Sep 13 10:31:33 2013 +0200
@@ -66,9 +66,27 @@
             list:"=objectList",
             dispTemplate: "@dispTemplate",
             formTemplate: "@formTemplate",
-            objectFields: "@objectFields"
+            objectFields: "@objectFields",
+            labelFields: "@labelFields",
+            sizeFields: "@sizeFields",
+            table: "@table"
         },
         controller: function($scope, $element, $attrs, $transclude) {
+        	// Setup divs table parameters
+        	$scope.headFields = angular.fromJson($scope.objectFields);
+        	$scope.headLabels = angular.fromJson($scope.labelFields);
+        	$scope.headSizes = angular.fromJson($scope.sizeFields);
+        	if($scope.headSizes==undefined){
+        		$scope.headSizes = [];
+        		var n = $scope.headFields.length;
+        		for(var i=0;i<n;i++){
+        			$scope.headSizes.push(2);
+        		}
+        	}
+        	if($scope.headLabels==undefined){
+        		$scope.headLabels = $scope.headFields;
+        	}
+        	
             $scope.getStaticTemplateUrl = function(templateName) {
                 return context.urls.base_static+'p4l/templates/'+templateName+".html";
             }
@@ -79,13 +97,21 @@
                 }
                 return res;
             }
+        },  
+        templateUrl: function(tElement, tAttrs){
+        	if(tAttrs.table=="true"){
+        		return context.urls.base_static+'p4l/templates/objectListTable.html'
+        	}
+        	else{
+        		return context.urls.base_static+'p4l/templates/objectList.html'
+        	}
         },
-        templateUrl: context.urls.base_static+'p4l/templates/objectList.html',  
         link: function($scope, $element, $attrs) {
+        	
             $scope.editedObj = null;
             
             $scope.getEmptyObject = function() {
-                return $scope.getEmptyObjectFromList(angular.fromJson($scope.objectFields));
+                return $scope.getEmptyObjectFromList($scope.headFields);
             };
 
             $scope.setEditedObject = function(obj) {
--- a/src/p4l/static/p4l/templates/imprintDisp.html	Thu Sep 12 11:42:29 2013 +0200
+++ b/src/p4l/static/p4l/templates/imprintDisp.html	Fri Sep 13 10:31:33 2013 +0200
@@ -1,6 +1,6 @@
-<tr>
-    <td>{{ obj.imprintCity }}</td>
-    <td>{{ obj.publisher }}</td>
-    <td>{{ obj.imprintDate }}</td>
-    <td>{{ obj.lang }}</td>
-</tr>
\ No newline at end of file
+<span>
+<div class="col-md-2">c {{ obj.imprintCity }}</div>
+<div class="col-md-2">p {{ obj.publisher }}</div>
+<div class="col-md-2">d {{ obj.imprintDate }}</div>
+<div class="col-md-2">l {{ obj.lang }}</div>
+</span>
\ No newline at end of file
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/p4l/static/p4l/templates/objectListTable.html	Fri Sep 13 10:31:33 2013 +0200
@@ -0,0 +1,22 @@
+<div>
+    <div class="row grey-bottom">
+        <div ng-repeat="l in headLabels" class="col-md-{{ headSizes[$index] }}">{{l | translate}}</div>
+        <div class="col-md-2">{{'Actions' | translate}}</div>
+    </div>
+    <div class="row grey-hover" ng-repeat="obj in list">
+        <span ng-if="dispTemplate==''">
+			<div ng-repeat="f in headFields" class="col-md-{{ headSizes[$index] }}">{{ obj[f] }}</div>
+        </span>
+        <object-disp ng-if="dispTemplate!=''" obj="obj" disp-template="dispTemplate"></object-disp>
+        <div class="col-md-2">
+	        <a ng-click='removeFromList(obj)' class="btn btn-default btn-xs"><i class="glyphicon glyphicon-trash"></i></a>
+	        <a ng-click='setEditedObject(obj)' class="btn btn-default btn-xs"><i class="glyphicon glyphicon-pencil"></i></a>
+	    </div>
+    </div>
+</table>
+<a ng-click='newEditedObject()' class="btn btn-default btn-xs"><i class="glyphicon glyphicon-plus-sign"></i></a>
+<div ng-show="editedObj!==null">
+    <ng-include src="getStaticTemplateUrl(formTemplate)"></ng-include>
+    <button ng-click="onOk()" class="btn btn-primary">OK</button>
+</div>
+</div>
\ No newline at end of file
--- a/src/p4l/static/p4l/templates/serieDisp.html	Thu Sep 12 11:42:29 2013 +0200
+++ b/src/p4l/static/p4l/templates/serieDisp.html	Fri Sep 13 10:31:33 2013 +0200
@@ -1,5 +1,5 @@
-<ul class="list-unstyled">
-    <li>{{'Title'|translate}} : {{ obj.title }}</li>
-    <li>{{'Volume'|translate}} : {{ obj.volume }}</li>    
-    <li>{{'Language'|translate}} : {{ obj.lang }}</li>
-</ul>
+<span>
+<div class="col-md-2">{{ obj.title }}</div>
+<div class="col-md-2">{{ obj.volume }}</div>
+<div class="col-md-2">{{ obj.lang }}</div>
+</span>
\ No newline at end of file
--- a/src/p4l/static/p4l/templates/urlDisp.html	Thu Sep 12 11:42:29 2013 +0200
+++ b/src/p4l/static/p4l/templates/urlDisp.html	Fri Sep 13 10:31:33 2013 +0200
@@ -1,5 +1,5 @@
-<ul class="list-unstyled">
-    <li>{{'Address'|translate}} : <a href="{{ obj.address }}" target="_blank">{{ obj.address }}</a></li>
-    <li>{{'Display'|translate}} : {{ obj.display }}</li>
-    <li>{{'Access level'|translate}} : {{ obj.accessLevel }}</li>
-</ul>
+<span>
+<div class="col-md-4"><a href="{{ obj.address }}" target="_blank">{{ obj.address }}</a></div>
+<div class="col-md-2">{{ obj.display }}</div>
+<div class="col-md-2">{{ obj.accessLevel }}</div>
+</span>
\ No newline at end of file
--- a/src/p4l/templates/p4l/record_update_form.html	Thu Sep 12 11:42:29 2013 +0200
+++ b/src/p4l/templates/p4l/record_update_form.html	Fri Sep 13 10:31:33 2013 +0200
@@ -113,8 +113,10 @@
       <td><textarea id="record-editionStatement-input" class="form-control" ng-model="record.editionStatement"></textarea></td>
     </tr>
     <tr>
-        <td>{{ 'imprints' | translate }}</td>
-        <td><object-list form-template="imprintForm" disp-template="imprintDisp" object-list="record.imprints" object-fields='["imprintCity","publisher","imprintDate", "lang"]'></object-list></td>
+      <td>{{ 'imprints' | translate }}</td>
+      <td><object-list form-template="imprintForm" disp-template="" object-list="record.imprints" 
+                       object-fields='["imprintCity","publisher","imprintDate", "lang"]' table="true" 
+                       label-fields='["City","Publisher","Date","Language"]' ></object-list></td>
     </tr>
     <tr>
       <td>{{ 'collations' | translate }}</td>
@@ -138,7 +140,9 @@
     </tr>
     <tr>
       <td>{{ 'series' | translate }}</td>
-      <td><object-list form-template="serieForm" disp-template="serieDisp" object-list="record.series" object-fields='["title", "volume", "lang"]'></object-list></td>
+      <td><object-list form-template="serieForm" disp-template="" object-list="record.series" 
+                       object-fields='["title", "volume", "lang"]' table="true" 
+                       size-fields='[4, 2, 2]' label-fields='["Title","Volume","Language"]'></object-list></td>
     </tr>
     <tr>
       <td>{{ 'authors' | translate }}</td>
@@ -162,7 +166,9 @@
     </tr>
     <tr>
       <td>{{ 'Urls' | translate }}</td>
-      <td><object-list form-template="urlForm" disp-template="urlDisp" object-list="record.urls" object-fields='["address", "display", "accessLevel"]'></object-list></td>
+      <td><object-list form-template="urlForm" disp-template="urlDisp" object-list="record.urls" 
+                       object-fields='["address", "display", "accessLevel"]' table="true"
+                       size-fields='[4, 2, 2]' label-fields='["Address", "Display", "Access level"]'></object-list></td>
     </tr>
     <tr>
       <td>{{ 'record type' | translate }}</td>