diff --git a/app/client/startup.js b/app/client/startup.js
index 1a3518a..e4d6914 100644
--- a/app/client/startup.js
+++ b/app/client/startup.js
@@ -2,7 +2,7 @@ Tracker.autorun(function () {
   var id = Session.get('controller_id');
   if (id) {
     Meteor.subscribe("sensor_data", id);
-    var hamo = Meteor.subscribe("controller_state", id);
-    console.log(hamo);
+    Meteor.subscribe("controller_state", id);
+    Meteor.subscribe('pictures', id);
   }
 });
diff --git a/app/client/state_details.html b/app/client/state_details.html
index 070059d..b818f86 100644
--- a/app/client/state_details.html
+++ b/app/client/state_details.html
@@ -12,6 +12,7 @@
             <div class="col-md-12 chart">
               <div><strong>Otpusni ventil:</strong> {{pretty_valve state.out_valve }}</div>
               <div><strong>Ulazni ventil/pumpa:</strong> {{pretty_valve state.in_valve }}</div>
+                <div><strong>Dobavlja sliku:</strong> {{picture_requested state }}</div>
               <div><strong>Zadnja komunikacija: {{ last_communication_time }}</strong>
               </div>
               <div><strong>Zadnje zaljevanje: {{ last_out_valve_open }}</strong>
diff --git a/app/client/state_details.js b/app/client/state_details.js
index 17b3e26..35706ba 100644
--- a/app/client/state_details.js
+++ b/app/client/state_details.js
@@ -9,10 +9,13 @@ Template.state_details.helpers({
     return moment(this.time).fromNow();
   },
   last_out_valve_open: function() {
-    return moment(this.significantEvents.lastOutValveOpen).fromNow();
+    return "";
   },
   last_in_valve_open: function() {
-    return moment(this.significantEvents.lastInValveOpen).fromNow();
+    return "";
+  },
+  picture_requested: function(state) {
+    return (state.picture_requested === 'true') ? 'DA' : 'NE';
   }
 });
 
diff --git a/app/client/surveillance.html b/app/client/surveillance.html
new file mode 100644
index 0000000..2750fa9
--- /dev/null
+++ b/app/client/surveillance.html
@@ -0,0 +1,15 @@
+<template name="surveillance">
+    <div>&nbsp;</div>
+    <div class="row">
+        <div class="col-md-12 text-center">
+            Fotografisano: {{ picture_time }}
+            <button id="request_new_picture">Zatraži Novu</button>
+        </div>
+    </div>
+    <div class="row">&nbsp;</div>
+    <div class="row">
+        <div class="col-md-12">
+            <img src="{{ picture_src }}" class="img-responsive center-block" />
+        </div>
+    </div>
+</template>
diff --git a/app/client/surveillance.js b/app/client/surveillance.js
new file mode 100644
index 0000000..d61bd35
--- /dev/null
+++ b/app/client/surveillance.js
@@ -0,0 +1,49 @@
+function controller_state() {
+  var controllerId = Session.get('controller_id');
+  result = ControllerState.findOne({});
+  if (!result) {
+    result = {}
+  };
+  return result;
+};
+
+function picture() {
+  var controllerId = Session.get('controller_id');
+  result = Picture.findOne({
+    controller_id: controllerId
+  });
+  console.log("rez je", result);
+  if (!result) {
+    result = {}
+  };
+  return result;
+};
+
+
+
+Template.surveillance.helpers({
+  controller_state: controller_state,
+  picture_src: function() {
+    var picture_base64 = picture().picture_base64;
+    var picture_src = '/images/noImage.png';
+    if (picture_base64) {
+      picture_src = 'data:image/jpeg;charset=utf-8;base64,' + picture_base64;
+    }
+    return picture_src;
+  },
+  picture_time: function() {
+    var picture_entry = picture();
+    if (picture_entry) {
+      return moment(picture_entry.time).fromNow();
+    } else {
+      return "Nikad!";
+    }
+  }
+});
+
+Template.surveillance.events({
+  'click #request_new_picture': function() {
+    var controller_id = Session.get('controller_id');
+    Meteor.call('requestNewPicture', controller_id)
+  }
+});
diff --git a/app/client/tabs.html b/app/client/tabs.html
index 036106b..accaac7 100644
--- a/app/client/tabs.html
+++ b/app/client/tabs.html
@@ -4,8 +4,8 @@
     <li role="presentation" class="{{ class_for 'start' }}"><a href="#">Stanje</a></li>
     <li role="presentation" class="{{ class_for 'weather' }}"><a href="#">Vrijeme</a></li>
     <li role="presentation" class="{{ class_for 'log' }}"><a href="#">Novosti</a></li>
+    <li role="presentation" class="{{ class_for 'surveillance' }}"><a href="#">Videonadzor</a></li>
     <li role="presentation" class="controller_selection">  <input type="number" id="controller" name="controller"  value="{{ selected_controller }}" min="1" max="99999"> <button id="switch" name="switch">Prebaci</button>
     </li>
   </ul>
-
 </template>
diff --git a/app/client/tabs.js b/app/client/tabs.js
index 0de0d4b..ff1bd86 100644
--- a/app/client/tabs.js
+++ b/app/client/tabs.js
@@ -26,10 +26,12 @@ Template.tabs.events({
   'click .log': function() {
     Session.set('templateName', 'log');
   },
+  'click .surveillance': function() {
+    Session.set('templateName', 'surveillance');
+  },
   'click .settings': function() {
     Session.set('templateName', 'settings');
   },
-
   'click #switch': function() {
     var instance = Template.instance();
     controller_id = instance.$('#controller').val();
diff --git a/app/server/api.js b/app/server/api.js
index a13ea58..56d1473 100644
--- a/app/server/api.js
+++ b/app/server/api.js
@@ -130,21 +130,6 @@ Api.addRoute('picture/:id', {
         'time': new Date()
       }
     });
-  },
-  get: function() {
-    var id = this.urlParams.id;
-    var res = this.response;
-    var picture_src = "/images/noImage.png";
-    var pictureEntry = Picture.findOne({
-      controller_id: id
-    });
-    if (pictureEntry) {
-      var imageData = pictureEntry.picture_base64;
-      picture_src = "data:image/jpeg;charset=utf-8;base64," + imageData;
-    }
-    return {
-      picture: picture_src
-    };
   }
 });
 
diff --git a/app/server/methods.js b/app/server/methods.js
index 16d71cb..4459f77 100644
--- a/app/server/methods.js
+++ b/app/server/methods.js
@@ -52,6 +52,17 @@ function setInValveTo(controller_id, nextState) {
 
 }
 
+function requestNewPicture(controller_id) {
+  var state = controller_state(controller_id);
+  ControllerState.update(state._id, {
+    '$set': {
+      'state.picture_requested': 'true',
+      'time': new Date(),
+      'set_by': 'server'
+    }
+  });
+};
+
 function openInValve(controller_id) {
   var state = controller_state(controller_id);
   var config = state.config;
@@ -174,5 +185,6 @@ Meteor.methods({
   openInValve: openInValve,
   closeInValve: closeInValve,
   clearLog: clearLog,
-  saveControllerConfig: saveControllerConfig
+  saveControllerConfig: saveControllerConfig,
+  requestNewPicture: requestNewPicture
 });
diff --git a/app/server/publications.js b/app/server/publications.js
index cd14e21..30ae624 100644
--- a/app/server/publications.js
+++ b/app/server/publications.js
@@ -16,3 +16,11 @@ Meteor.publish("controller_state", function(controllerId) {
     controller_id: controllerId
   });
 });
+
+
+// This code only runs on the server
+Meteor.publish("pictures", function(controllerId) {
+  return Picture.find({
+    controller_id: controllerId
+  });
+});