Edit document, add files, display files

docs-web/src/main/webapp/partial/document.default.html

@@ -0,0 +1,8 @@
+<p class="lead">
+  {{ documents.total }} document{{ documents.total > 1 ? 's' : '' }} in the database
+</p>
+
+<blockquote class="pull-right">
+  <p>There seems to be a kind of order in the universe, in the movement of the stars and the turning of the earth and the changing of the seasons, and even in the cycle of human life. But human life itself is almost pure chaos. Everyone takes his stance, asserts his own rights and feelings, mistaking the motives of others, and his own.</p>
+  <small>Katherine Anne Porter</small>
+</blockquote>

docs-web/src/main/webapp/partial/document.edit.html

@@ -1,18 +1,24 @@
-<form class="form-horizontal">
-  <div class="control-group">
+<form class="form-horizontal" name="documentForm">
+  <div class="control-group" ng-class="{ error: !documentForm.title.$valid }">
     <label class="control-label" for="inputTitle">Title</label>
     <div class="controls">
-      <input class="input-block-level" type="text" id="inputTitle" placeholder="Title" ng-model="document.title" />
+      <input required ng-maxlength="100" class="input-block-level" type="text" id="inputTitle" placeholder="Title" name="title" ng-model="document.title" />
+    </div>
+  </div>
+  <div class="control-group" ng-class="{ error: !documentForm.description.$valid }">
+    <label class="control-label" for="inputDescription">Description</label>
+    <div class="controls">
+      <textarea ng-maxlength="4000" class="input-block-level" rows="5" id="inputDescription" name="description" ng-model="document.description"></textarea>
     </div>
   </div>
   <div class="control-group">
-    <label class="control-label" for="inputDescription">Description</label>
+    <label class="control-label" for="inputFiles">New files</label>
     <div class="controls">
-      <textarea class="input-block-level" rows="5" id="inputDescription" ng-model="document.description"></textarea>
+      <file class="input-block-level" id="inputFiles" multiple="multiple" ng-model="files" accept="image/png,image/jpg,image/jpeg,image/gif" />
     </div>
   </div>
   <div class="form-actions">
-    <button type="submit" class="btn btn-primary" ng-click="edit()">{{ isEdit() ? 'Edit' : 'Add' }}</button>
+    <button type="submit" class="btn btn-primary" ng-disabled="!documentForm.$valid" ng-click="edit()">{{ isEdit() ? 'Edit' : 'Add' }}</button>
     <button type="submit" class="btn" ng-click="cancel()">Cancel</button>
   </div>
 </form>

docs-web/src/main/webapp/partial/document.html

@@ -1,25 +1,28 @@
 <div class="container-fluid">
   <div class="row-fluid">
-    <div class="span5 well">
+    <div class="span4 well">
       <p class="text-center">
         <button class="btn btn-primary" type="button" ng-click="addDocument()">Add a document</button>
       </p>
-      <table class="table table-striped table-hover">
+      <table class="table table-striped table-hover table-documents">
         <thead>
           <tr>
-            <th>Title</th>
-            <th>Creation date</th>
+            <th ng-click="sortDocuments(1)"><span class="icon-chevron-{{ sortColumn == 1 ? (asc ? 'down' : 'up') : '' }}"></span> Title</th>
+            <th ng-click="sortDocuments(3)"><span class="icon-chevron-{{ sortColumn == 3 ? (asc ? 'down' : 'up') : '' }}"></span> Creation date</th>
           </tr>
         </thead>
         <tbody>
-          <tr ng-click="viewDocument(document.id)" ng-repeat="document in documents">
+          <tr ng-click="viewDocument(document.id)" ng-repeat="document in documents.documents">
             <td>{{ document.title }}</td>
             <td>{{ document.create_date | date: 'short' }}</td>
           </tr>
         </tbody>
       </table>
+      <div class="text-center">
+        <pagination num-pages="numPages" max-size="5" current-page="currentPage"></pagination>
+      </div>
     </div>
-    <div class="span7 well">
+    <div class="span8 well">
       <div ui-view="document"></div>
     </div>
   </div>

docs-web/src/main/webapp/partial/document.view.html

@@ -1 +1,26 @@
-View doc
+<div class="text-right">
+  <div class="btn-group">
+    <button class="btn btn-primary" ng-click="editDocument(document.id)"><span class="icon-pencil icon-white"></span> Edit</button>
+  </div>
+</div>
+
+<div class="page-header">
+  <h1>{{ document.title }} <small>{{ document.create_date | date: 'short' }}</small></h1>
+</div>
+
+<p ng-bind-html="document.description | newline"></p>
+
+<ul class="thumbnails" ng-show="files.length > 0">
+  <li class="span2" ng-repeat="file in files" ng-style="{ 'margin-left': $index % 6 == 0 ? '0' : '' }">
+    <div class="thumbnail">
+      <a ng-click="openFile(file)">
+        <img ng-src="api/file/{{ file.id }}/data" tooltip="{{ file.mimetype }}" tooltip-placement="top" />
+      </a>
+      <div class="caption">
+        <p class="text-right">
+          <button class="btn btn-danger" ng-click="deleteFile(file.id)"><span class="icon-trash icon-white"></span></button>
+        </p>
+      </div>
+    </div>
+  </li>
+</ul>

docs-web/src/main/webapp/partial/file.view.html

@@ -0,0 +1,7 @@
+<div class="text-center">
+  <div class="btn-group">
+    <button type="button" class="btn" ng-click="previousFile()">Previous</button>
+    <button type="button" class="btn" ng-click="nextFile()">Next</button>
+  </div>
+</div>
+<img ng-src="api/file/{{ id }}/data" />

docs-web/src/main/webapp/partial/login.html

@@ -1,6 +1,5 @@
 <div class="row-fluid">
   <div class="span4 offset4">
-    <h1 class="text-center">Sismics Docs</h1>
     <form class="form-horizontal">
       <div class="control-group">
         <label class="control-label" for="inputUsername">Username</label>