error status management in client annotation
authorcavaliet
Fri, 17 Oct 2014 15:55:51 +0200
changeset 36 5d392dea4f49
parent 35 139737335c8a
child 37 2d0e6a207048
error status management in client annotation
.hgignore
annot-server/webapp/templates/annotationclient.html
client/app/annotationclient.html
client/app/app.css
client/app/app.js
--- a/.hgignore	Fri Oct 17 13:52:24 2014 +0200
+++ b/.hgignore	Fri Oct 17 15:55:51 2014 +0200
@@ -21,3 +21,6 @@
 ^annot-server/static/js/lib
 ^annot-server/static/data
 ^annot-server/templates/annotationclient.html$
+
+syntax: regexp
+^annot-server/webapp/templates/annotationclient\.html$
\ No newline at end of file
--- a/annot-server/webapp/templates/annotationclient.html	Fri Oct 17 13:52:24 2014 +0200
+++ /dev/null	Thu Jan 01 00:00:00 1970 +0000
@@ -1,102 +0,0 @@
-<!doctype html>
-<html>
-<head>
-  <meta charset="utf-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <title>Mons by IRI</title>
-  <link rel="stylesheet" href="{{ config['STATIC_URL'] }}/css/lib.css">
-  <link rel="stylesheet" href="{{ config['STATIC_URL'] }}/css/app.css">
-</head>
-<body ng-controller="homeCtrl" ng-app="mons" ng-cloak>
-  <div class="container">
-    <div class="row">
-      <div class="col-md-12">
-      <form role="form">
-        <input class="form-control" placeholder="Nom d'utilisateur" ng-model="username"/>
-      </form>
-      </div>
-    </div>
-    <div class="row">
-      <div class="col-md-12">
-        <form role="form">
-          <autocomplete ng-model="yourchoice" data="allCatLabels" attr-input-class="form-control" attr-placeholder="Catégories..." ></autocomplete>
-        </form>
-      </div>
-    </div>
-    <div class="row mons-content">
-        <div class="mons-button hand return" ng-style="returnVisStyle" ng-click="selectLevel()" ng-init="returnVisStyle={visibility:'hidden'}">
-          <div class="content">
-              <div class="table">
-                <div class="table-cell">
-                  <p class="large-cat">RETOUR</p>
-                </div>
-              </div>
-          </div>
-        </div>
-        <div class="mons-button hand send" id="sendButton" ng-click="sendAnnotation(yourchoice)" ng-class="{'success-border':sendBtnSuccess}">
-          <div class="content">
-              <div class="table">
-                <div class="table-cell">
-                  <p class="large-cat">ENVOYER</p>
-                  <p class="normal-cat">la catégorie saisie</p>
-                </div>
-              </div>
-          </div>
-        </div>
-    </div>
-    <div class="mons-content">
-      <div ng-show="!selectedlevel">
-          <div class="mons-button hand" ng-repeat="c in data.categories" style="background-color: {{ '{{' }} c.color {{ '}}' }}"
-                                        ng-click="selectLevel(c.label, c.code, c)" ng-class="{'success-border':c.sendSuccess}">
-            <div class="content">
-                <div class="table">
-                  <div class="table-cell">
-                    <p class="large-cat">{{ '{{' }} c.label {{ '}}' }}</p>
-                    <p class="normal-cat">{{ '{{' }} c.full_label {{ '}}' }}</p>
-                  </div>
-                </div>
-            </div>
-          </div>
-      </div>
-      <div ng-show="selectedlevel">
-          <div class="mons-button hand" ng-repeat="c in selectedlevel" style="background-color: {{ '{{' }} c.color {{ '}}' }}"
-                                        ng-click="sendAnnotation(c.label, c.code, c)" ng-class="{'success-border':c.sendSuccess}">
-            <div class="content">
-                <div class="table">
-                  <div class="table-cell">
-                    <p class="large-cat">{{ '{{' }} c.label {{ '}}' }}</p>
-                    <p class="normal-cat">{{ '{{' }} c.full_label {{ '}}' }}</p>
-                  </div>
-                </div>
-            </div>
-          </div>
-      </div>
-    </div>
-    <footer>
-	  {% if logging %}<div class="row">
-	    <pre id="log" style="height: 20em; overflow-y: scroll; background-color: #faa; text-align: left;"></pre>
-      </div>{% endif %}
-      <div class="row">
-        <div class="col-md-12 text-center">
-            mons vBeta - ©IRI-2014
-        </div>
-      </div>
-    </footer>
-    <div class="row messages">
-      <div class="alert" ng-class="{'alert-success':showSuccessAlert, 'alert-danger':!showSuccessAlert}" role="alert" ng-show="showAlertDiv">{{ '{{' }} alertMessage {{ '}}' }}</div>
-    </div>
-  </div>
-  <script type="text/javascript" src="{{ config['STATIC_URL'] }}/js/lib.js"></script>
-  <!--script type="text/javascript" src="{{ pre_static_path }}static/js/templates.js"></script-->
-  <script type="text/javascript" src="{{ config['STATIC_URL'] }}/js/app.js"></script>
-  <script type="text/javascript">
-    angular.module("mons")
-        .value('context', {
-            {% if logging %}logging: true,{% endif %}
-            urls: {
-                dataUrl: "{{ config['STATIC_URL'] }}/data/categories.json"
-            }
-        });
-  </script>
-</body>
-</html>
--- a/client/app/annotationclient.html	Fri Oct 17 13:52:24 2014 +0200
+++ b/client/app/annotationclient.html	Fri Oct 17 15:55:51 2014 +0200
@@ -33,7 +33,7 @@
               </div>
           </div>
         </div>
-        <div class="mons-button hand send" id="sendButton" ng-click="sendAnnotation(yourchoice)" ng-class="{'success-border':sendBtnSuccess}">
+        <div class="mons-button hand send" id="sendButton" ng-click="sendAnnotation(yourchoice)" ng-class="{'success-border':sendBtnSuccess, 'error-border':sendBtnError}">
           <div class="content">
               <div class="table">
                 <div class="table-cell">
@@ -47,7 +47,7 @@
     <div class="mons-content">
       <div ng-show="!selectedlevel">
           <div class="mons-button hand" ng-repeat="c in data.categories" style="background-color: {{ '{{' }} c.color {{ '}}' }}"
-                                        ng-click="selectLevel(c.label, c.code, c)" ng-class="{'success-border':c.sendSuccess}">
+                                        ng-click="selectLevel(c.label, c.code, c)" ng-class="{'success-border':c.sendSuccess, 'error-border':c.sendError}">
             <div class="content">
                 <div class="table">
                   <div class="table-cell">
@@ -60,7 +60,7 @@
       </div>
       <div ng-show="selectedlevel">
           <div class="mons-button hand" ng-repeat="c in selectedlevel" style="background-color: {{ '{{' }} c.color {{ '}}' }}"
-                                        ng-click="sendAnnotation(c.label, c.code, c)" ng-class="{'success-border':c.sendSuccess}">
+                                        ng-click="sendAnnotation(c.label, c.code, c)" ng-class="{'success-border':c.sendSuccess, 'error-border':c.sendError}">
             <div class="content">
                 <div class="table">
                   <div class="table-cell">
--- a/client/app/app.css	Fri Oct 17 13:52:24 2014 +0200
+++ b/client/app/app.css	Fri Oct 17 15:55:51 2014 +0200
@@ -84,6 +84,9 @@
 .success-border{
     border: 10px solid #3c763d;
 }
+.error-border{
+    border: 10px solid #cb4442;
+}
 
 /*.ng-scope{
     border: red 1px solid;
--- a/client/app/app.js	Fri Oct 17 13:52:24 2014 +0200
+++ b/client/app/app.js	Fri Oct 17 15:55:51 2014 +0200
@@ -95,7 +95,7 @@
             if(typeof eventCode==='undefined' || eventCode===''){
                 eventCode = getURLParameter('event');
                 if(typeof eventCode==='undefined' || eventCode===''){
-                    alert('le code de l\'événement doit être indiqué dans l\'url selon "?event=CODE_EVENEMENT".');
+                    alert('le code de l\'événement doit être indiqué dans l\'url selon ?event=CODE_EVENEMENT.');
                     return;
                 }
             }
@@ -128,24 +128,29 @@
                 };
 
                 sock.onmessage = function(e) {
+                    var data_json = JSON.parse(e.data);
+                    //console.log('1', data_json);
                     if(context.logging){
-                        log('Got message: ', e.data);
+                        log('Got message: ' + e.data);
                     }
-                    //var data_json = JSON.parse(e.data);
                     //showAlert('Annotation bien reçue.', true);
                     //console.log('2 message', $scope.annotPile.length);
                     if($scope.annotPile.length>0){
                         var c = $scope.annotPile.shift();
                         //console.log('3 message', c);
+                        //console.log('2',data_json.status,data_json.status==='OK');
+                        var ok = data_json.status==='OK';
                         var i;
                         if(c===false){
                             //showAlert('Annotation envoyée.', true);
-                            $scope.sendBtnSuccess = true;
-                            i = $interval(function(){ $interval.cancel(i); $scope.sendBtnSuccess = false; }, 2000, 1);
+                            $scope.sendBtnSuccess = ok;
+                            $scope.sendBtnError = !ok;
+                            i = $interval(function(){ $interval.cancel(i); $scope.sendBtnSuccess = false; $scope.sendBtnError = false; }, 2000, 1);
                         }
                         else{
-                            c.sendSuccess = true;
-                            i = $interval(function(){ $interval.cancel(i); c.sendSuccess = false; }, 2000, 1);
+                            c.sendSuccess = ok;
+                            c.sendError = !ok;
+                            i = $interval(function(){ $interval.cancel(i); c.sendSuccess = false; c.sendError = false; }, 2000, 1);
                         }
                         if(!$scope.$$phase) {
                             $scope.$apply();