diff --git a/index.html b/index.html
index 873e993..e407f7f 100644
--- a/index.html
+++ b/index.html
@@ -9,6 +9,11 @@
     <link rel="stylesheet" href="lib/diff/font-awesome-4.0.3/css/font-awesome.min.css">
     <link rel="stylesheet" href="css/app.css">
   <script src="./lib/cow/lib/dbjs/db.js"></script>
+  <!-- signalR ready-->
+  <script type="text/javascript" src="./lib/cow/lib/jquery-1.9.1/jquery.min.js"></script>
+  <script type="text/javascript" src="./lib/cow/lib/jquery.signalR/jquery.signalR-2.0.2.js"></script>
+  <script type="text/javascript" src="https://srvcis/cow/signalr/hubs"></script> <!-- CHANGE THIS TO CORRECT SIGNALR SERVER URL -->
+  
   <script type="text/javascript" src="./lib/cow/lib/underscore/underscore-min.js" ></script>
   <script type="text/javascript" src="./lib/cow/src/cow2.utils.js" ></script>
   <script type="text/javascript" src="./lib/cow/src/cow2.record.js" ></script>
@@ -18,7 +23,8 @@
   <script type="text/javascript" src="./lib/cow/src/cow2.group.js" ></script>
   <script type="text/javascript" src="./lib/cow/src/cow2.item.js" ></script>
   <script type="text/javascript" src="./lib/cow/src/cow2.project.js" ></script>
-  <script type="text/javascript" src="./lib/cow/src/cow2.websocket.js" ></script>
+  <!--<script type="text/javascript" src="./lib/cow/src/cow2.websocket.js" ></script>-->
+  <script type="text/javascript" src="./lib/cow/src/cow2.signalR.js" ></script>
   <script type="text/javascript" src="./lib/cow/src/cow2.core.js" ></script>
   <script type="text/javascript" src="./lib/cow/lib/polyfill-promise/promise-0.1.1.min.js"></script>
   
diff --git a/lib/cow b/lib/cow
index bd1900d..1890b9c 160000
--- a/lib/cow
+++ b/lib/cow
@@ -1 +1 @@
-Subproject commit bd1900d85f3d0d63bd961e9cc0540df8ac95f32b
+Subproject commit 1890b9cc82a7f0e0eda1bbee85b57535979059ce
diff --git a/src/controllers/leafletCtrl.js b/src/controllers/leafletCtrl.js
index a5b328d..e928ec1 100644
--- a/src/controllers/leafletCtrl.js
+++ b/src/controllers/leafletCtrl.js
@@ -7,6 +7,29 @@ icm.controller('LeafletController', [ '$scope','$http','$timeout','Core', 'Utils
     }
     var core = Core;
     
+    /** Some time functionality **/
+    $scope.chronos = false;
+    $scope.timeDisplay = 'none';
+    $scope.mytime = new Date();
+    $scope.hstep = 1;
+    $scope.mstep = 15;
+    $scope.ismeridian = true;
+    $scope.time = Date.now();
+    $scope.timechanged = function () {
+        console.log('Time changed to: ' + $scope.mytime);
+        $scope.time = new Date($scope.mytime).getTime();
+        populateFeatures();
+    };
+    $scope.setNow = function() {
+        var d = new Date();
+        $scope.mytime = d;
+        $scope.timechanged();
+    };
+    $scope.toggleChronos = function(){
+        populateFeatures();
+    };
+    /** end of time **/
+    
     $scope.core = core; //DEBUG
     tmp = $scope; //DEBUG
     var controls= {};
@@ -84,90 +107,94 @@ icm.controller('LeafletController', [ '$scope','$http','$timeout','Core', 'Utils
     });
     
     var editmenu = function(feat,container, element, event){
-        var menu = new Cow_utils.menu(feat,event, container, element, {
-            menuconfig: Cow_utils.menuconfig
-        });
-        /* Menu listeners */
-        menu.on('delete', function(d){
-            if (confirm('Verwijderen?')) {
-                var key = d.fid;
-                Core.project().items(key).deleted('true').sync();
-            } else {
-                // Do nothing!
-            }
-        });
-        menu.on('edit.geom', function(d){
-            drawControl.options.edit.featureGroup.addData(d.layer);
-            controls.editcontrol.enable();
-         });
-        menu.on('edit.text', function(d){
-            var feat = d.layer;
-            var fid = d.fid;
-            var item = $scope.core.project().items(fid);
-            var entity = d.obj;
-            var bbox = entity.getBBox();
-            var fe = d3.select('.leaflet-popup-pane')
-                .attr('draggable',"true")
-                .append('div')
-                .classed('popup panel panel-primary',true)
-                .style('position', 'absolute')
-                .style('left', function(){return bbox.x + 35 + 'px';})
-                .style('top', function(){return bbox.y + 35 + 'px';})
-                .style("width", '400px')
-                //.style("height", '200px')
-                .on('click', function(){
-                    //d3.event.stopPropagation();//Prevent the map from firing click event as well
-                });
+        if ($scope.chronos){
+            return null;
+        }
+        else {
+            var menu = new Cow_utils.menu(feat,event, container, element, {
+                menuconfig: Cow_utils.menuconfig
+            });
+            /* Menu listeners */
+            menu.on('delete', function(d){
+                if (confirm('Verwijderen?')) {
+                    var key = d.fid;
+                    Core.project().items(key).deleted('true').sync();
+                } else {
+                    // Do nothing!
+                }
+            });
+            menu.on('edit.geom', function(d){
+                drawControl.options.edit.featureGroup.addData(d.layer);
+                controls.editcontrol.enable();
+             });
+            menu.on('edit.text', function(d){
+                var feat = d.layer;
+                var fid = d.fid;
+                var item = $scope.core.project().items(fid);
+                var entity = d.obj;
+                var bbox = entity.getBBox();
+                var fe = d3.select('.leaflet-popup-pane')
+                    .attr('draggable',"true")
+                    .append('div')
+                    .classed('popup panel panel-primary',true)
+                    .style('position', 'absolute')
+                    .style('left', function(){return bbox.x + 35 + 'px';})
+                    .style('top', function(){return bbox.y + 35 + 'px';})
+                    .style("width", '400px')
+                    //.style("height", '200px')
+                    .on('click', function(){
+                        d3.event.stopPropagation();//Prevent the map from firing click event as well
+                    });
+                    
+                var desc = feat.properties.desc || "";
+                var name = feat.properties.name || "";
+                var creator = feat.properties.creator || "";
+                var owner = feat.properties.owner || "";
+                var created = new Date(item.created()).toLocaleString();
+                var updated = new Date(item.timestamp()).toLocaleString();
+                desc = desc.replace(/\r\n?|\n/g, '<br />');
                 
-            var desc = feat.properties.desc || "";
-            var name = feat.properties.name || "";
-            var creator = feat.properties.creator || "";
-            var owner = feat.properties.owner || "";
-            var created = new Date(item.created()).toLocaleString();
-            var updated = new Date(item.timestamp()).toLocaleString();
-            desc = desc.replace(/\r\n?|\n/g, '<br />');
-            
-            
-            var sheader = fe.append('div')
-                .classed('panel-heading', true)
-                .attr('contenteditable','true')
-                .html(name);
-
-            var scontent = fe.append('div')
-                .classed('panel-body', true);
-            
-            
-            var editdiv = scontent.append('div')
-                .attr('contenteditable','true')
-                .attr('id','descfield')
-                .classed('well well-sm', true)
-                .style('height','80px')
-                .html(desc);
-            var html = '<small>Gemaakt door: ' + creator + ' op ' +  created + '<br> Bewerkt door: ' + owner + ' op ' + updated + '</small>'; 
-            scontent.append('div').html(html);
-            scontent.append('span')
-                .html('Opslaan')
-                .classed('btn btn-success', true)
-                .on('click',function(z){
-                    feat.properties.name = sheader.html();
-                    feat.properties.desc = editdiv.html();
-                    $scope.core.project().items(fid).data('feature',feat).sync();
-                    fe.remove();
-                });
-            scontent.append('span')
-                .html('Annuleren')
-                .classed('btn btn-danger pull-right', true)
-                .on('click',function(z){
-                    fe.remove();
-                });
-        });
-        
+                
+                var sheader = fe.append('div')
+                    .classed('panel-heading', true)
+                    .attr('contenteditable','true')
+                    .html(name);
+    
+                var scontent = fe.append('div')
+                    .classed('panel-body', true);
+                
+                
+                var editdiv = scontent.append('div')
+                    .attr('contenteditable','true')
+                    .attr('id','descfield')
+                    .classed('well well-sm', true)
+                    .style('height','80px')
+                    .html(desc);
+                var html = '<small>Gemaakt door: ' + creator + ' op ' +  created + '<br> Bewerkt door: ' + owner + ' op ' + updated + '</small>'; 
+                scontent.append('div').html(html);
+                scontent.append('span')
+                    .html('Opslaan')
+                    .classed('btn btn-success', true)
+                    .on('click',function(z){
+                        feat.properties.name = sheader.html();
+                        feat.properties.desc = editdiv.html();
+                        $scope.core.project().items(fid).data('feature',feat).sync();
+                        fe.remove();
+                    });
+                scontent.append('span')
+                    .html('Annuleren')
+                    .classed('btn btn-danger pull-right', true)
+                    .on('click',function(z){
+                        fe.remove();
+                    });
+            });
+        }
     };
     
     var featureLayer = new L.GeoJSON.d3(dummyCollection, {
         //core: Core,
         onClick: editmenu,
-        onMouseover: Cow_utils.textbox,
+        //onMouseover: Cow_utils.textbox,
         labels: true,
         labelconfig: {
             field: "name",
@@ -183,7 +210,7 @@ icm.controller('LeafletController', [ '$scope','$http','$timeout','Core', 'Utils
             opacity: 0.5
         }
     });
-    
+    $scope.featureLayer = featureLayer;
     
     /* Initiate the marker icons */
     //$http({method: 'POST', url: './images/mapicons/imoov_list_subset.js'}).
@@ -254,7 +281,7 @@ icm.controller('LeafletController', [ '$scope','$http','$timeout','Core', 'Utils
         handleNewExtent(e.leafletEvent); 
     });
     $scope.$on('leafletDirectiveMap.click', function(event,e){
-        //d3.selectAll('.popup').remove();//Remove all popups on map
+        d3.selectAll('.popup').remove();//Remove all popups on map
         controls.editcontrol.save();
         controls.editcontrol.disable();
         identify(e);
@@ -305,12 +332,16 @@ icm.controller('LeafletController', [ '$scope','$http','$timeout','Core', 'Utils
       var viewCollection = {"type":"FeatureCollection","features":[]};
       for (i=0;i<items.length;i++){
 		    var item = items[i];
-			var feature = item.data('feature');
-            if(feature === undefined) {
-                console.warn('old item type');
-                return false;
-            }
-            else{
+		    var t;
+		    if ($scope.chronos){
+		        t = $scope.time;
+		    }
+		    else {
+		        t = Date.now();
+		    }
+			//var feature = item.data('feature');
+            if(item.data_on(t) && item.data_on(t).feature) {
+                var feature = item.data_on(t).feature;
                 //Add feature
                 var opacity = 1;
                 feature.id = item.id();
@@ -498,24 +529,17 @@ icm.controller('LeafletController', [ '$scope','$http','$timeout','Core', 'Utils
                 .data('feature', feature)
                 //TODO: add permissions here
                 .sync();
-            //populateFeatures();
+
         });
         
         /** Bind layer reload on storechanged **/
         var itemstore = core.project().itemStore();
         var peerstore = core.peerStore();
-        //itemstore.off('datachange');
-        itemstore.on('datachange',function() {
-             populateFeatures();
-        });
-       // peerstore.off('datachange');
-        peerstore.on('datachange',function() {
-            populatePeers();
-        });
-        
-        var center = $scope.leafletService.center();
-        //map.setView([center.lat, center.lng],center.zoom);
-        
+
+        itemstore.off('datachange',populateFeatures);
+        itemstore.on('datachange',populateFeatures);
+        peerstore.off('datachange',populatePeers);
+        peerstore.on('datachange',populatePeers);
         
         //Initialize first time features
         populateFeatures();
diff --git a/src/factories.js b/src/factories.js
index e7c3868..131308f 100644
--- a/src/factories.js
+++ b/src/factories.js
@@ -65,7 +65,8 @@ icm.factory('Beelden', ['$rootScope', function( $rootScope ) {
 icm.factory('Core', ['$rootScope', function($rootScope) {
    
    var cow = new Cow.core({
-          wsUrl: 'wss://websocket.geodan.nl:443/icms'
+          //wsUrl: 'wss://websocket.geodan.nl:443/icms'
+          wsUrl: 'https://srvcis/cow/signalr'
         });   
     cow.userStore().loaded.then(function(){
         if (!cow.users('1')){
diff --git a/src/services.js b/src/services.js
index 1a0833c..5f61665 100644
--- a/src/services.js
+++ b/src/services.js
@@ -5,10 +5,10 @@ icm.factory('LeafletService',['$rootScope','Core',function($rootScope, Core) {
     instance.layers = {};
     instance.center = function(center){
         if (!center){
-            console.log('Getting center: ', instance._center);
+            //console.log('Getting center: ', instance._center);
         }
         else{
-            console.log('setting center: ', center);
+            //console.log('setting center: ', center);
         }
         return instance._center = center || instance._center;
     };
diff --git a/src/state.js b/src/state.js
index 57856cd..36f21b1 100644
--- a/src/state.js
+++ b/src/state.js
@@ -1,7 +1,7 @@
 var icm = angular.module('icm', ["ui.router",'ui.bootstrap',"leaflet-directive",'ngSanitize', 'textAngular'])
     .run(
-      [        '$rootScope', '$state', '$stateParams',
-      function ($rootScope,   $state,   $stateParams) {
+      [        '$rootScope', '$state', '$stateParams','Utils',
+      function ($rootScope,   $state,   $stateParams, Utils) {
 
         // It's very handy to add references to $state and $stateParams to the $rootScope
         // so that you can access them from any scope within your applications.For example,
@@ -9,21 +9,16 @@ var icm = angular.module('icm', ["ui.router",'ui.bootstrap',"leaflet-directive",
         // 'contacts.list' or one of its decendents is active.
         $rootScope.$state = $state;
         $rootScope.$stateParams = $stateParams;
-      
       }])
     .config(
-        [          '$stateProvider', '$urlRouterProvider',
-            function ($stateProvider, $urlRouterProvider) {
+        ['$stateProvider', '$urlRouterProvider',function ($stateProvider, $urlRouterProvider) {
   
   
       $urlRouterProvider
-       
-
-      //bij foute url stuur naar het begin
+        //bij foute url stuur naar het begin
         .otherwise("/");
       
       $stateProvider
-
         // Hier moet IAAA stuff komen, maar voorlopig moet je een username invullen voor
         // COW
         .state("login", {
diff --git a/templates/kaart.html b/templates/kaart.html
index 7e7b0a2..a6590ab 100644
--- a/templates/kaart.html
+++ b/templates/kaart.html
@@ -71,6 +71,13 @@ <h3>Lagen</h3>
             </li>
         </ul>
       </span>
+      <button type="button" class="btn btn-primary" ng-model="chronos" ng-change="toggleChronos()" btn-checkbox btn-checkbox-true="true" btn-checkbox-false="false">
+        Chronologie
+      </button>
+      <span ng-model="mytime" ng-change="timechanged()" ng-show="chronos" style="display:inline-block;">
+        <timepicker hour-step="hstep" minute-step="mstep" show-meridian="ismeridian"></timepicker>
+      </span>
+      <button class="btn btn-default" ng-click="setNow()" ng-show="chronos">Huidig</button>
       <leaflet center="initcenter" defaults="defaults" height="800px" width="100%" markers="markers" paths='paths' layers="layers" events="events"></leaflet>
       </div>
       </div>