Merge branch 'elias2' into unstable

annotations/bower.json

@@ -9,7 +9,8 @@
     "angular-loader": "~1.2.x",
     "angular-resource": "~1.2.x",
     "bootstrap": "~3.x",
-    "angular-cookies": "1.2"
+    "angular-cookies": "1.2",
+    "bootstrap-select": "silviomoreto/bootstrap-select#~1.7.3"
   },
   "resolutions": {
     "angular": "~1.2.x"

annotations/static/annotations/activelists.js

+(function () {
+  'use strict';
+
+  var annotationsAppActiveLists = angular.module('annotationsAppActiveLists', []);
+
+  annotationsAppActiveLists.controller('ActiveListsController',
+    ['$scope', '$rootScope', '$timeout',
+    function ($scope, $rootScope, $timeout) {
+
+      $scope.activeListsChange = function() {
+        var selected = $('.selectpicker option:selected').val();
+        var newActive = {};
+        $('.selectpicker option:selected').each(function(item, value) {
+          var id = value.id.split("---", 2)[1];
+          newActive[id] = value.value;
+        });
+        $rootScope.activeLists = newActive;
+      };
+
+      $rootScope.$watchCollection('activeLists', function (newValue, oldValue) {
+        if (newValue === undefined) return;
+        $timeout(function() {
+          $('.selectpicker').selectpicker('refresh');
+        });
+      });
+
+      $rootScope.$watchCollection('lists', function (newValue, oldValue) {
+        if (newValue === undefined) return;
+        // reformat lists to allListsSelect
+        var allListsSelect = [];
+        angular.forEach($rootScope.lists, function(value, key) {
+          this.push({
+            'id': key,
+            'label': value
+          });
+          // initialize activeLists with the MiamList by default
+          if (value == 'MiamList') {
+            $rootScope.activeLists = {};
+            $rootScope.activeLists[key] = value;
+          }
+        }, allListsSelect);
+
+        $rootScope.allListsSelect = allListsSelect;
+
+        $timeout(function() {
+          $('.selectpicker').selectpicker();
+          $('.selectpicker').selectpicker('val', ['MiamList']);
+        });
+      });
+
+    }]);
+
+
+})(window);

annotations/static/annotations/app.css

@@ -2,8 +2,10 @@
 
 /*
 * Class names corresponding to server-side list names
-* To display another list name, please add a new class under this
+* To display another list name, add a new class under this
 */
+
+
 .MiamList {
   color: black;
   background-color: rgba(60, 118, 61, 0.5);
@@ -44,24 +46,31 @@
 }
 
 .main-panel, .text-panel, .words-panel {
-  height: 800px;
   margin: 10px 0;
 }
 
+#annotationsApp {
+  min-width: 780px;
+}
+
+.words-panel {
+  min-width: 220px;
+}
+
 .text-panel {
   overflow-y: auto;
+  min-width: 400px;
 }
 
 .words-list {
   margin-bottom: 5px;
-  height: 250px;
 }
 
 .keyword-text {
   word-break: break-all;
 }
 
-.list-group-item {
+.keyword-group-item {
   display: inline-block;
   float: left;
   padding: 5px;
@@ -139,3 +148,7 @@
   border-right: solid thin #CCC;
   margin-right: 5px;
 }
+
+.float-right {
+  float: right;
+}

annotations/static/annotations/document.js

+(function () {
+  'use strict';
+
+  var annotationsAppDocument = angular.module('annotationsAppDocument', ['annotationsAppHttp']);
+
+  annotationsAppDocument.controller('DocController',
+    ['$scope', '$rootScope', '$timeout', 'NgramListHttpService', 'DocumentHttpService',
+    function ($scope, $rootScope, $timeout, NgramListHttpService, DocumentHttpService) {
+      $rootScope.documentResource = DocumentHttpService.get(
+        {'docId': $rootScope.docId},
+        function(data, responseHeaders) {
+          $scope.authors = data.authors;
+          $scope.journal = data.journal;
+          $scope.publication_date = data.publication_date;
+          //$scope.current_page_number = data.current_page_number;
+          //$scope.last_page_number = data.last_page_number;
+          $rootScope.title = data.title;
+          $rootScope.docId = data.id;
+          $rootScope.full_text = data.full_text;
+          $rootScope.abstract_text = data.abstract_text;
+          // GET the annotationss
+          NgramListHttpService.get(
+            {
+              'corpusId': $rootScope.corpusId,
+              'docId': $rootScope.docId
+            },
+            function(data) {
+              $rootScope.annotations = data[$rootScope.corpusId.toString()][$rootScope.docId.toString()];
+              $rootScope.lists = data[$rootScope.corpusId.toString()].lists;
+            },
+            function(data) {
+              console.error("unable to get the list of ngrams");
+            }
+          );
+
+      });
+      // TODO setup article pagination
+      $scope.onPreviousClick = function () {
+        DocumentHttpService.get($scope.docId - 1);
+      };
+      $scope.onNextClick = function () {
+        DocumentHttpService.get($scope.docId + 1);
+      };
+  }]);
+
+  annotationsAppDocument.controller('DocFavoriteController',
+    ['$scope', '$rootScope', 'DocumentHttpService',
+    function ($scope, $rootScope, DocumentHttpService) {
+      $scope.onStarClick = function($event) {
+        console.log("TODO");
+      };
+      $scope.isFavorite = false;
+  }]);
+
+})(window);

annotations/static/annotations/main.js

@@ -19,6 +19,7 @@ var S = window.STATIC_URL;
 $script([
   S + 'bower_components/angular/angular.min.js',
   S + 'bower_components/bootstrap/dist/js/bootstrap.min.js',
+  S + 'bower_components/bootstrap-select/dist/js/bootstrap-select.min.js',
   S + 'bower_components/angular-loader/angular-loader.min.js',
   S + 'bower_components/underscore/underscore-1.5.2.js',
   //'bower_components/angular-route/angular-route.js',
@@ -26,7 +27,10 @@ $script([
   $script([
     S + 'bower_components/angular-cookies/angular-cookies.min.js',
     S + 'bower_components/angular-resource/angular-resource.min.js'], function() {
-    $script([S + 'annotations/http.js', S + 'annotations/app.js'], function() {
+    $script([S + 'annotations/http.js', S + 'annotations/highlight.js',
+      S + 'annotations/document.js', S + 'annotations/ngramlist.js',
+      S + 'annotations/activelists.js', S + 'annotations/ngramlist.js',
+      S + 'annotations/utils.js', S + 'annotations/app.js'], function() {
       // when all is done, execute bootstrap angular application (replace ng-app directive)
       angular.bootstrap(document.getElementById("annotationsApp"), ['annotationsApp']);
     });

annotations/static/annotations/ngramlist.js

+(function () {
+  'use strict';
+
+  var annotationsAppNgramList = angular.module('annotationsAppNgramList', ['annotationsAppHttp']);
+
+  /*
+  * Controls one Ngram displayed in the flat lists (called "extra-text")
+  */
+  annotationsAppNgramList.controller('NgramController',
+    ['$scope', '$rootScope', 'NgramHttpService', 'NgramListHttpService',
+    function ($scope, $rootScope, NgramHttpService, NgramListHttpService) {
+      /*
+      * Click on the 'delete' cross button
+      */
+      $scope.onDeleteClick = function () {
+        NgramHttpService.delete({
+          'listId': $scope.keyword.list_id,
+          'ngramId': $scope.keyword.uuid
+        }, function(data) {
+          // Refresh the annotationss
+          NgramListHttpService.get(
+            {
+              'corpusId': $rootScope.corpusId,
+              'docId': $rootScope.docId
+            },
+            function(data) {
+              $rootScope.annotations = data[$rootScope.corpusId.toString()][$rootScope.docId.toString()];
+              $rootScope.refreshDisplay();
+            },
+            function(data) {
+              console.error("unable to refresh the list of ngrams");
+            }
+          );
+        }, function(data) {
+          console.error("unable to remove the Ngram " + $scope.keyword.text);
+        });
+      };
+    }]);
+
+  /*
+  * Controller for the list panel displaying extra-text ngram
+  */
+  annotationsAppNgramList.controller('NgramListPaginationController',
+    ['$scope', '$rootScope', function ($scope, $rootScope) {
+
+    $rootScope.$watchCollection('extraNgramList', function (newValue, oldValue) {
+      $scope.currentListPage = 0;
+      $scope.pageSize = 15;
+
+      $scope.nextListPage = function() {
+        $scope.currentListPage = $scope.currentListPage + 1;
+      };
+
+      $scope.previousListPage = function() {
+        $scope.currentListPage = $scope.currentListPage - 1;
+      };
+
+      $scope.totalListPages = function(listId) {
+        if ($rootScope.extraNgramList[listId] === undefined) return 0;
+        return Math.ceil($rootScope.extraNgramList[listId].length / $scope.pageSize);
+      };
+    });
+  }]);
+
+  /*
+  * Template of the ngram element displayed in the flat lists
+  */
+  annotationsAppNgramList.directive('keywordTemplate', function () {
+    return {
+      templateUrl: function ($element, $attributes) {
+        return S + 'annotations/keyword_tpl.html';
+      }
+    };
+  });
+  /*
+  * new NGram from the user input
+  */
+  annotationsAppNgramList.controller('NgramInputController',
+    ['$scope', '$rootScope', '$element', 'NgramHttpService', 'NgramListHttpService',
+    function ($scope, $rootScope, $element, NgramHttpService, NgramListHttpService) {
+    /*
+    * Add a new NGram from the user input in the extra-text list
+    */
+    $scope.onListSubmit = function ($event, listId) {
+      var inputEltId = "#"+ listId +"-input";
+      if ($event.keyCode !== undefined && $event.keyCode != 13) return;
+
+      var value = angular.element(inputEltId).val().trim();
+      if (value === "") return;
+
+      NgramHttpService.post(
+        {
+          'listId': listId,
+          'ngramId': 'create'
+        },
+        {
+          'text': value
+        },
+        function(data) {
+          // on success
+          if (data) {
+            angular.element(inputEltId).val("");
+            // Refresh the annotationss
+            NgramListHttpService.get(
+              {
+                'corpusId': $rootScope.corpusId,
+                'docId': $rootScope.docId
+              },
+              function(data) {
+                $rootScope.annotations = data[$rootScope.corpusId.toString()][$rootScope.docId.toString()];
+                $rootScope.refreshDisplay();
+              },
+              function(data) {
+                console.error("unable to get the list of ngrams");
+              }
+            );
+          }
+        }, function(data) {
+          // on error
+          angular.element(inputEltId).parent().addClass("has-error");
+          console.error("error adding Ngram "+ value);
+        }
+      );
+    };
+  }]);
+
+})(window);

annotations/static/annotations/utils.js

+(function () {
+  'use strict';
+
+  var annotationsAppUtils = angular.module('annotationsAppUtils', []);
+
+  /*
+  * Filter used in lists pagination (extra-text panel)
+  */
+  annotationsAppUtils.filter('startFrom', function () {
+    return function (input, start) {
+      if (input === undefined) return;
+      start = +start; //parse to int
+      return input.slice(start);
+    };
+  });
+
+})(window);

annotations/static/bower_components/bootstrap-select/dist/css/bootstrap-select.min.css

+/*!
+ * Bootstrap-select v1.7.3 (http://silviomoreto.github.io/bootstrap-select)
+ *
+ * Copyright 2013-2015 bootstrap-select
+ * Licensed under MIT (https://github.com/silviomoreto/bootstrap-select/blob/master/LICENSE)
+ */.bootstrap-select{width:220px \0}.bootstrap-select>.dropdown-toggle{width:100%;padding-right:25px}.error .bootstrap-select .dropdown-toggle,.has-error .bootstrap-select .dropdown-toggle{border-color:#b94a48}.bootstrap-select.fit-width{width:auto!important}.bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn){width:220px}.bootstrap-select .dropdown-toggle:focus{outline:thin dotted #333!important;outline:5px auto -webkit-focus-ring-color!important;outline-offset:-2px}.bootstrap-select.form-control{margin-bottom:0;padding:0;border:none}.bootstrap-select.form-control:not([class*=col-]){width:100%}.bootstrap-select.form-control.input-group-btn{z-index:auto}.bootstrap-select.btn-group:not(.input-group-btn),.bootstrap-select.btn-group[class*=col-]{float:none;display:inline-block;margin-left:0}.bootstrap-select.btn-group.dropdown-menu-right,.bootstrap-select.btn-group[class*=col-].dropdown-menu-right,.row .bootstrap-select.btn-group[class*=col-].dropdown-menu-right{float:right}.form-group .bootstrap-select.btn-group,.form-horizontal .bootstrap-select.btn-group,.form-inline .bootstrap-select.btn-group{margin-bottom:0}.form-group-lg .bootstrap-select.btn-group.form-control,.form-group-sm .bootstrap-select.btn-group.form-control{padding:0}.form-inline .bootstrap-select.btn-group .form-control{width:100%}.bootstrap-select.btn-group.disabled,.bootstrap-select.btn-group>.disabled{cursor:not-allowed}.bootstrap-select.btn-group.disabled:focus,.bootstrap-select.btn-group>.disabled:focus{outline:0!important}.bootstrap-select.btn-group .dropdown-toggle .filter-option{display:inline-block;overflow:hidden;width:100%;text-align:left}.bootstrap-select.btn-group .dropdown-toggle .caret{position:absolute;top:50%;right:12px;margin-top:-2px;vertical-align:middle}.bootstrap-select.btn-group[class*=col-] .dropdown-toggle{width:100%}.bootstrap-select.btn-group .dropdown-menu{min-width:100%;z-index:1035;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.bootstrap-select.btn-group .dropdown-menu.inner{position:static;float:none;border:0;padding:0;margin:0;border-radius:0;-webkit-box-shadow:none;box-shadow:none}.bootstrap-select.btn-group .dropdown-menu li{position:relative}.bootstrap-select.btn-group .dropdown-menu li.active small{color:#fff}.bootstrap-select.btn-group .dropdown-menu li.disabled a{cursor:not-allowed}.bootstrap-select.btn-group .dropdown-menu li a{cursor:pointer}.bootstrap-select.btn-group .dropdown-menu li a.opt{position:relative;padding-left:2.25em}.bootstrap-select.btn-group .dropdown-menu li a span.check-mark{display:none}.bootstrap-select.btn-group .dropdown-menu li a span.text{display:inline-block}.bootstrap-select.btn-group .dropdown-menu li small{padding-left:.5em}.bootstrap-select.btn-group .dropdown-menu .notify{position:absolute;bottom:5px;width:96%;margin:0 2%;min-height:26px;padding:3px 5px;background:#f5f5f5;border:1px solid #e3e3e3;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.05);box-shadow:inset 0 1px 1px rgba(0,0,0,.05);pointer-events:none;opacity:.9;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.bootstrap-select.btn-group .no-results{padding:3px;background:#f5f5f5;margin:0 5px;white-space:nowrap}.bootstrap-select.btn-group.fit-width .dropdown-toggle .filter-option{position:static}.bootstrap-select.btn-group.fit-width .dropdown-toggle .caret{position:static;top:auto;margin-top:-1px}.bootstrap-select.btn-group.show-tick .dropdown-menu li.selected a span.check-mark{position:absolute;display:inline-block;right:15px;margin-top:5px}.bootstrap-select.btn-group.show-tick .dropdown-menu li a span.text{margin-right:34px}.bootstrap-select.show-menu-arrow.open>.dropdown-toggle{z-index:1036}.bootstrap-select.show-menu-arrow .dropdown-toggle:before{content:'';border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid rgba(204,204,204,.2);position:absolute;bottom:-4px;left:9px;display:none}.bootstrap-select.show-menu-arrow .dropdown-toggle:after{content:'';border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:6px solid #fff;position:absolute;bottom:-4px;left:10px;display:none}.bootstrap-select.show-menu-arrow.dropup .dropdown-toggle:before{bottom:auto;top:-3px;border-top:7px solid rgba(204,204,204,.2);border-bottom:0}.bootstrap-select.show-menu-arrow.dropup .dropdown-toggle:after{bottom:auto;top:-3px;border-top:6px solid #fff;border-bottom:0}.bootstrap-select.show-menu-arrow.pull-right .dropdown-toggle:before{right:12px;left:auto}.bootstrap-select.show-menu-arrow.pull-right .dropdown-toggle:after{right:13px;left:auto}.bootstrap-select.show-menu-arrow.open>.dropdown-toggle:after,.bootstrap-select.show-menu-arrow.open>.dropdown-toggle:before{display:block}.bs-actionsbox,.bs-donebutton,.bs-searchbox{padding:4px 8px}.bs-actionsbox{float:left;width:100%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.bs-actionsbox .btn-group button{width:50%}.bs-donebutton{float:left;width:100%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.bs-donebutton .btn-group button{width:100%}.bs-searchbox+.bs-actionsbox{padding:0 8px 4px}.bs-searchbox .form-control{margin-bottom:0;width:100%}select.bs-select-hidden,select.selectpicker{display:none!important}select.mobile-device{position:absolute!important;top:0;left:0;display:block!important;width:100%;height:100%!important;opacity:0}
\ No newline at end of file

annotations/templates/annotations/main.html

@@ -13,15 +13,17 @@
         <meta name="description" content="Gargantext">
         <meta name="viewport" content="width=device-width, initial-scale=1">
         <link rel="stylesheet" href="{% static 'bower_components/bootstrap/dist/css/bootstrap.min.css' %}">
+        <link rel="stylesheet" href="{% static 'bower_components/bootstrap-select/dist/css/bootstrap-select.min.css' %}">
+
         <link rel="stylesheet" href="{% static 'bower_components/angular/angular-csp.css' %}">
         <link rel="stylesheet" href="{% static 'annotations/app.css' %}">
         <script src="{% static 'bower_components/jquery/dist/jquery.min.js' %}"></script>
     </head>
     <body>
     <!-- TODO integrate this later into the any other django template -->
-    <div id="annotationsApp">
+    <div id="annotationsApp" ng-cloak>
       <div class="container-fluid">
-        <div class="row-fluid main-panel" ng-controller="IntraTextController">
+        <div class="row-fluid main-panel" ng-controller="NGramHighlightController">
           <div class="col-md-4 col-xs-4 tabbable words-panel">
             <ul class="nav nav-pills nav-justified">
               <li ng-repeat="(listId, listName) in activeLists" ng-class="{active: $first == true}">
@@ -29,65 +31,78 @@
               </li>
             </ul>
             <div class="tab-content">
-              <div ng-controller="ExtraTextPaginationController" ng-repeat="(listId, listName) in activeLists" ng-class="{active: $first == true}" class="tab-pane" id="tab-{[{listId}]}">
+              <div ng-controller="NgramListPaginationController" ng-repeat="(listId, listName) in activeLists" ng-class="{active: $first == true}" class="tab-pane" id="tab-{[{listId}]}">
                 <div ng-if="extraNgramList[listId].length == 0" class="alert alert-info" role="alert">
                   Input any keyword you want to link to this article and the list named '{[{listName}]}'
                 </div>
 
                 <ul class="list-group words-list clearfix">
-                  <li ng-repeat="keyword in extraNgramList[listId] | startFrom:currentListPage * pageSize | limitTo:pageSize" class="list-group-item">
-                    <div ng-controller="ExtraAnnotationController" keyword-template class="keyword-container"></div>
+                  <li ng-repeat="keyword in extraNgramList[listId] | startFrom:currentListPage * pageSize | limitTo:pageSize" class="keyword-group-item">
+                    <div ng-controller="NgramController" keyword-template class="keyword-container"></div>
                   </li>
                 </ul>
 
-                <nav ng-class="{invisible: totalListPages - 1 == 0}" class="clearfix">
+                <nav ng-class="{invisible: totalListPages(listId) - 1 == 0}" class="clearfix">
                   <ul class="pagination pagination-s pull-right words-pagination">
-                    <li ng-class="{disabled: currentListPage == 0}"><a ng-click="previousListPage()" class="glyphicon glyphicon-backward"></a></li>
-                    <li ng-class="{disabled: currentListPage >= totalListPages - 1}"><a ng-click="nextListPage()" class="glyphicon glyphicon-forward"></a></li>
+                    <li ng-class="{'disabled': currentListPage == 0}"><a ng-click="previousListPage()" class="glyphicon glyphicon-backward"></a></li>
+                    <li ng-class="{'disabled': currentListPage >= totalListPages(listId) - 1}"><a ng-click="nextListPage()" class="glyphicon glyphicon-forward"></a></li>
                   </ul>
                 </nav>
 
-                <div class="form-group">
-                  <input type="text" class="form-control" id="{[{ listId }]}-input" ng-keypress="onListSubmit($event, listId)">
+                <div class="form-group" ng-controller="NgramInputController">
+                  <input autosave="search" maxlength="240" placeholder="Add any text" type="text" class="form-control" id="{[{listId}]}-input" ng-keypress="onListSubmit($event, listId)">
                   <button type="submit" class="form-control btn btn-default btn-primary" ng-click="onListSubmit($event, listId)">Add to {[{listName}]}</button>
                 </div>
               </div>
             </div>
+            <div>
+              <h5>Select lists</h5>
+              <select class="selectpicker" multiple ng-change="activeListsChange()" ng-model="lists" ng-controller="ActiveListsController">
+                  <option ng-repeat="item in allListsSelect" id="list---{[{item.id}]}" ng-disabled="{[{ item.label == 'MiamList' }]}">{[{item.label}]}</option>
+              </select>
+            </div>
           </div>
           <div class="col-md-8 col-xs-8 text-panel" ng-controller="DocController" id="document">
             <div class="row-fluid clearfix">
-            <div class="col-md-7 col-xs-7">
+            <div class="col-md-10 col-xs-10">
               <h3 class="text-container" id="title">{[{title}]}</h3>
             </div>
-            <div class="col-md-5 col-xs-5">
-              <nav>
+            <div class="col-md-2 col-xs-2 clearfix">
+                <button ng-controller="DocFavoriteController" type="button" class="btn btn-default float-right" ng-click="onStarClick($event)">
+                  <span class="glyphicon" ng-class="{'glyphicon-star-empty': isFavorite == false, 'glyphicon-star': isFavorite == true}"></span>
+                </button>
+              <!--<nav>
                 <ul class="pager">
                   <li ng-if="current_page_number > 1"><a ng-click="onPreviousClick()" href="#">Previous</a></li>
                   <li ng-if="current_page_number < last_page_number"><a ng-click="onNextClick()" href="#">Next</a></li>
                 </ul>
-              </nav>
+            </nav>-->
             </div>
             </div>
-            <div class="row-fluid cleafix">
-              <ul class="breadcrumb">
-                <li>{[{authors}]}</li>
-                <li>{[{journal}]}</li>
-                <li class="active pull-right">{[{publication_date}]}</li>
+            <div class="row-fluid">
+              <ul class="list-group clearfix">
+                <li class="list-group-item small"><span class="badge">journal</span>{[{journal}]}</li>
+                <li class="list-group-item small"><span class="badge">authors</span>{[{authors}]}</li>
+                <li class="list-group-item small"><span class="badge">date</span>{[{publication_date}]}</li>
               </ul>
             </div>
-            <h4 ng-if="abstract_text != null">Abstract</h4>
+            <div ng-if="abstract_text != null">
+                <span class="badge">abstract</span>
+            </div>
             <p id="abstract-text" class="text-container">
-                <div ng-if="abstract_text == null" class="alert alert-info" role="alert">Empty abstract text</div>
+                <div ng-if="abstract_text == null" class="alert alert-info small" role="alert">Empty abstract text</div>
             </p>
-            <h4 ng-if="full_text != null">Full Article</h4>
+            <div ng-if="full_text != null">
+                <span class="badge">full article</span>
+            </div>
             <p id="full-text" class="text-container">
-                <div ng-if="full_text == null" class="alert alert-info" role="alert">Empty full text</div>
+                <div ng-if="full_text == null" class="alert alert-info small" role="alert">Empty full text</div>
             </p>
           </div>
         </div> <!-- end of the main row -->
       </div>
       <!-- this menu is over the text on mouse selection -->
-      <div ng-controller="AnnotationMenuController" id="selection" class="selection-menu">
+      <div ng-controller="TextSelectionMenuController" id="selection" class="selection-menu">
         <ul class="noselection">
           <li ng-repeat="item in menuItems" class="{[{item.listName}]}" ng-click="onMenuClick($event, item.action, item.listId)">{[{item.verb}]} {[{item.listName}]}</li>
         </ul>

annotations/urls.py

@@ -5,6 +5,7 @@ from annotations import views
 urlpatterns = patterns('',
     url(r'^document/(?P<doc_id>[0-9]+)$', views.Document.as_view()), # document view
     url(r'^corpus/(?P<corpus_id>[0-9]+)/document/(?P<doc_id>[0-9]+)$', views.NgramList.as_view()), # the list associated with an ngram
-    url(r'^lists/(?P<list_id>[0-9]+)/ngrams(?:/(?P<ngram_id>[0-9]+))?$', views.NgramEdit.as_view()), #
-    url(r'^lists/(?P<list_id>[0-9]+)/multiple?$', views.deleteMultiple ), #
+    url(r'^lists/(?P<list_id>[0-9]+)/ngrams/(?P<ngram_id>[0-9]+)$', views.NgramEdit.as_view()), #
+    url(r'^lists/(?P<list_id>[0-9]+)/ngrams/create$', views.NgramCreate.as_view()), #
+    url(r'^lists/(?P<list_id>[0-9]+)/multiple?$', views.deleteMultiple ), # FIXME What's this ?
 )

annotations/views.py

@@ -17,7 +17,6 @@ from node.models import Node
 from gargantext_web.db import *
 from ngram.lists import listIds, listNgramIds, ngramList
 from gargantext_web.api import JsonHttpResponse
-import json
 
 
 @login_required
@@ -45,12 +44,8 @@ class NgramList(APIView):
             list_id = listIds(user_id=request.user.id, corpus_id=int(corpus_id), typeList=list_type)
             lists["%s" % list_id[0][0]] = list_type
 
-        # ngrams of list_id of corpus_id:
-        doc_ngram_list = listNgramIds(corpus_id=corpus_id, doc_id=doc_id, user_id=request.user.id)
-        doc_ngram_list = [(i, 'miam', i, 1931) for i in range(500)]
-        doc_ngram_list += [(i, 'stop', i, 1932) for i in range(501, 600)]
-        # doc_ngram_list = [(1, 'miam', 2, 1931), (2, 'stop', 2, 1932), (3, 'Potassium channels', 4, 1931)]
-
+        # ngrams for the corpus_id (ignoring doc_id for the moment):
+        doc_ngram_list = listNgramIds(corpus_id=corpus_id, doc_id=None, user_id=request.user.id)
         data = { '%s' % corpus_id : {
             '%s' % doc_id : [
                 {
@@ -67,50 +62,83 @@ class NgramList(APIView):
 
 class NgramEdit(APIView):
     """
-    Actions on one Ngram in one list
+    Actions on one existing Ngram in one list
     """
     renderer_classes = (JSONRenderer,)
     authentication_classes = (SessionAuthentication, BasicAuthentication)
 
     def post(self, request, list_id, ngram_id):
         """
-        Add a ngram in a list
+        Edit an existing NGram in a given list
+        """
+        list_id = int(list_id)
+        ngram_id = int(ngram_id)
+        # TODO remove the node_ngram from another conflicting list
+        # FIXME session.query(Node_Ngram).filter(Node_Ngram.ngram_id==ngram_id).delete()
+        # add the ngram to the list
+        node_ngram = Node_Ngram(node_id=list_id, ngram_id=ngram_id, weight=1.0)
+        session.add(node_ngram)
+        session.commit()
+
+        # return the response
+        return Response({
+            'uuid': ngram_id,
+            'list_id': list_id,
+        })
+
+    def delete(self, request, list_id, ngram_id):
+        """
+        Delete a ngram from a list
+        """
+        session.query(Node_Ngram).filter(Node_Ngram.node_id==list_id).filter(Node_Ngram.ngram_id==ngram_id).delete()
+        session.commit()
+        return Response(None, 204)
+
+
+class NgramCreate(APIView):
+    """
+    Create a new Ngram in one list
+    """
+    renderer_classes = (JSONRenderer,)
+    authentication_classes = (SessionAuthentication, BasicAuthentication)
+
+    def post(self, request, list_id):
+        """
+        create NGram in a given list
         """
-        # TODO - if Ngram is in miam-list, and adding it to stop-list,
-        #   then remove it from the previous list
         list_id = int(list_id)
         # format the ngram's text
-        ngram_text = request.data.get('annotation', {}).get('text', None)
+        ngram_text = request.data.get('text', None)
+        if ngram_text is None:
+            raise APIException("Could not create a new Ngram without one \
+                text key in the json body")
+
         ngram_text = ngram_text.strip().lower()
         ngram_text = ' '.join(ngram_text.split())
-        # retrieve the ngram's id
+        # check if the ngram exists with the same terms
         ngram = session.query(Ngram).filter(Ngram.terms == ngram_text).first()
         if ngram is None:
             ngram = Ngram(n=len(ngram_text.split()), terms=ngram_text)
-            session.add(ngram)
-            session.commit()
+        else:
+            # make sure the n value is correct
+            ngram.n = len(ngram_text.split())
+
+        session.add(ngram)
+        session.commit()
         ngram_id = ngram.id
-        # add the ngram to the list if not already done
-        node_ngram = session.query(Node_Ngram).filter(Node_Ngram.node_id==list_id).filter(Node_Ngram.ngram_id==ngram_id).first()
-        if node_ngram is None:
-            node_ngram = Node_Ngram(node_id=list_id, ngram_id=ngram_id, weight=1.0)
-            session.add(node_ngram)
-            session.commit()
-        ngram_occurrences = node_ngram.weight
+        # create the new node_ngram relation
+        # TODO check existing Node_Ngram ?
+        node_ngram = Node_Ngram(node_id=list_id, ngram_id=ngram_id, weight=1.0)
+        session.add(node_ngram)
+        session.commit()
+
         # return the response
         return Response({
             'uuid': ngram_id,
             'text': ngram_text,
-            'occurrences': ngram_occurrences,
             'list_id': list_id,
         })
 
-    def delete(self, request, list_id, ngram_id):
-        """
-        Delete a ngram from a list
-        """
-        session.query(Node_Ngram).filter(Node_Ngram.node_id==list_id).filter(Node_Ngram.ngram_id==ngram_id).delete()
-        return Response(None, 204)
 
 def deleteMultiple(request, list_id):
     results = ["hola","mundo"]

ngram/lists.py

@@ -103,6 +103,7 @@ def listNgramIds(list_id=None, typeList=None,
             .group_by(Ngram.id, ListNgram.node_id)
             )
 
+    # FIXME this is only used to filter on 1 document
     if doc_id is not None:
         Doc      = aliased(Node)
         DocNgram = aliased(NodeNgram)