--- a/client/app/annotationclient.html	Thu Oct 09 12:17:28 2014 +0200
+++ b/client/app/annotationclient.html	Thu Oct 09 14:34:14 2014 +0200
@@ -19,7 +19,7 @@
     <div class="row">
       <div class="col-md-12">
         <form role="form">
-          <autocomplete ng-model="yourchoice" data="allCatLabels" on-type="onAutocompleteType" attr-input-class="form-control" attr-placeholder="Catégories..." on-select="onSelect" ></autocomplete>
+          <autocomplete ng-model="yourchoice" data="allCatLabels" attr-input-class="form-control" attr-placeholder="Catégories..." ></autocomplete>
         </form>
       </div>
     </div>
@@ -71,6 +71,9 @@
       </div>
     </div>
     <footer>
+	  <div class="row">
+	    <pre id="log" style="height: 20em; overflow-y: scroll; background-color: #faa; text-align: left;"></pre>
+      </div>
       <div class="row">
         <div class="col-md-12 text-center">
             mons vBeta - ©IRI-2014
@@ -82,12 +85,13 @@
   <!--script type="text/javascript" src="{{ pre_static_path }}static/js/templates.js"></script-->
   <script type="text/javascript" src="{{ pre_static_path }}static/js/app.js"></script>
   <script type="text/javascript">
-      angular.module("mons")
-          .value('context', {
-              urls: {
-                  dataUrl: "{{ pre_static_path }}static/data/categories.json"
-              }
-          });
+      
+    angular.module("mons")
+        .value('context', {
+            urls: {
+                dataUrl: "{{ pre_static_path }}static/data/categories.json"
+            }
+        });
 
   </script>
 </body>

--- a/client/app/app.js	Thu Oct 09 12:17:28 2014 +0200
+++ b/client/app/app.js	Thu Oct 09 14:34:14 2014 +0200
@@ -22,8 +22,9 @@
             //console.log('dataModel',this,dataApi);
             this.data = dataApi.dataResource.get();
         })
-        .controller('homeCtrl', function($scope, $location, dataModel){
-            console.log('homeCtrl 1', $scope, $location);
+        .controller('homeCtrl', function($scope, $location, dataModel, context){
+            //console.log('homeCtrl 1', $scope, $location, context);
+            console.log('homeCtrl 2', context);
             $scope.data = dataModel.data;
             
             dataModel.data.$promise.then(function(data) {
@@ -46,12 +47,53 @@
             
             $scope.selectedlevel = false;
             
-            //console.log('homeCtrl 1-3', dataModel.data.categories);
-            //$scope.selectedlevel = $scope.data.categories;
-            //console.log('homeCtrl 2', $scope.selectedLevel, $scope.data);
+            
+            
+
+            // Socket management
+            var sock = null;
+            var ellog = null;
+            
+            ellog = document.getElementById('log');
             
+            function log(m) {
+                ellog.innerHTML += m + '\n';
+                ellog.scrollTop = ellog.scrollHeight;
+            }
+
+            var wsuri;
+            if (window.location.protocol === 'file:') {
+                wsuri = 'ws://127.0.0.1:8090/annot';
+            } else {
+                wsuri = 'ws://' + window.location.hostname + ':8090/annot';
+            }
+            wsuri = wsuri + '?event=test';
+
+            if ('WebSocket' in window) {
+                sock = new WebSocket(wsuri);
+            } else if ('MozWebSocket' in window) {
+                sock = new window.MozWebSocket(wsuri);
+            } else {
+                log('Browser does not support WebSocket!');
+                window.location = 'http://autobahn.ws/unsupportedbrowser';
+            }
+            console.log('hi 1', sock);
+            if (sock) {
+                sock.onopen = function() {
+                    log('Connected to ' + wsuri);
+                };
+
+                sock.onclose = function(e) {
+                    log('Connection closed (wasClean = ' + e.wasClean + ', code = ' + e.code + ', reason = "' + e.reason + '")');
+                    sock = null;
+                };
+
+                sock.onmessage = function(e) {
+                    log('Got message: ' + e.data);
+                };
+            }
+
             $scope.sendAnnotation = function(eventCode){
-                console.log('ntm', $scope.username);
                 if($scope.username==='' || typeof $scope.username==='undefined'){
                     alert('Vous devez indiquer un nom d\'utilisateur.');
                     return;
@@ -61,9 +103,20 @@
                     return;
                 }
                 // Send query
-                alert('annotation envoyée ! eventCode = ' + eventCode);
+                if (sock) {
+                    var new_annot = {
+                            categories : eventCode,
+                            user : 'admin'
+                    };
+                    sock.send(JSON.stringify(new_annot));
+                    log('Sent: ' + JSON.stringify(new_annot));
+                } else {
+                    log('Not connected.');
+                }
+                //alert('annotation envoyée ! eventCode = ' + eventCode);
             };
             
+            // Interface management
             $scope.selectLevel = function(i, eventCode){
                 if(i===false){
                     $scope.returnVisStyle = {visibility:'hidden'};
@@ -80,13 +133,6 @@
                 }
             };
             
-            $scope.onSelect = function(suggestion){
-                console.log('ON SELECT',suggestion);
-            };
-            
-            $scope.onAutocompleteType = function(){
-                console.log('onAutocompleteType');
-            };
         });
 
 })();

--- a/client/gulpfile.js	Thu Oct 09 12:17:28 2014 +0200
+++ b/client/gulpfile.js	Thu Oct 09 14:34:14 2014 +0200
@@ -140,4 +140,4 @@
 }));
 
 //gulp.task('default',['connect','scripts','templates','css','copy-index','copy-data','copy-img','vendorJS','vendorCSS','vendorFonts','watch']);
-gulp.task('default',['connect','scripts','css','copy-index','copy-data','copy-img','vendorJS','vendorCSS','vendorFonts','watch']);
+gulp.task('default',['scripts','css','copy-index','copy-data','copy-img','vendorJS','vendorCSS','vendorFonts','watch']);