diff --git a/html/ajax_mapview.php b/html/ajax_mapview.php
new file mode 100644
index 0000000000..bfc2d19e0b
--- /dev/null
+++ b/html/ajax_mapview.php
@@ -0,0 +1,7 @@
+<?php
+session_start();
+if (isset($_REQUEST['mapView'])) {
+    $_SESSION['mapView'] = $_REQUEST['mapView'];
+}
+header('Content-type: text/plain');
+echo $_SESSION['mapView'];
\ No newline at end of file
diff --git a/html/css/light.css b/html/css/light.css
index f224ff3cb5..ab40e3bc13 100644
--- a/html/css/light.css
+++ b/html/css/light.css
@@ -94,3 +94,101 @@
   0% { transform: rotate(0deg); transform: rotate(0deg); }
   100% { transform: rotate(360deg); transform: rotate(360deg); }
 }
+
+.device-availability, .service-availability{
+  color:#000000;
+  float:left;
+  width:166px;
+  height:64px;
+  margin:10px;
+  padding:8px;
+  border-radius:5px;
+  text-align:center;
+}
+
+.device-availability.up, .service-availability.up {
+  border:1px solid #5CB85C;
+}
+
+.device-availability.down, .service-availability.down {
+  border:1px solid #D9534F;
+}
+
+.device-availability.warning {
+  border:1px solid #FFB733;
+}
+
+.availability-label{
+  float:right;margin:-8px;
+}
+
+.service-name-label{
+  float:left;margin:-8px;
+}
+
+.report-up {
+  color:#5CB85C;
+}
+
+.report-warning {
+  color:#FFB733;
+}
+
+.report-down {
+  color:#D9534F;
+}
+
+.page-availability-report-entry {
+  text-align:center;
+  width:50px;
+}
+
+.page-availability-title-left {
+  width:50%;
+  float:left;
+  height:60px;
+}
+
+.page-availability-title-right {
+  width:50%;
+  float:left;
+  text-align:right;
+}
+
+.page-availability-title {
+  font-size:26px;
+  font-weight: bold;
+  line-height:40px;
+}
+
+.page-availability-report-select {
+  font-size:24px;
+  font-weight: bold;
+  padding-right:10px;
+}
+
+.page-availability-report-host {
+  float:right;
+  text-align:right;
+  padding-left:10px;
+}
+
+.page-availability-report-service {
+  float:right;
+  text-align:right;
+}
+
+.widget-availability {
+  float:left;
+  margin:2px;
+}
+
+.widget-availability-host {
+  float:left;
+  margin-bottom: 10px;
+}
+
+.widget-availability-service {
+  float:right;
+  margin-bottom: 10px;
+}
\ No newline at end of file
diff --git a/html/includes/common/availability-map.inc.php b/html/includes/common/availability-map.inc.php
index 00656eb43c..decaad5c48 100644
--- a/html/includes/common/availability-map.inc.php
+++ b/html/includes/common/availability-map.inc.php
@@ -4,61 +4,63 @@
  *
  * Copyright (c) 2015 Søren Friis Rosiak <sorenrosiak@gmail.com>
  * Copyright (c) 2016 Jens Langhammer <jens@beryju.org>
+ * Copyright (c) 2016 Cercel Valentin <crc@nuamchefazi.ro>
  * This program is free software: you can redistribute it and/or modify it
  * under the terms of the GNU General Public License as published by the
  * Free Software Foundation, either version 3 of the License, or (at your
  * option) any later version.  Please see LICENSE.txt at the top level of
  * the source code distribution for details.
  */
-
 if (defined('show_settings')) {
     $current_mode = isset($widget_settings['mode']) ? $widget_settings['mode'] : 0;
     $current_width = isset($widget_settings['tile_width']) ? $widget_settings['tile_width'] : 10;
-    $common_output[] = '
-    <form class="form-horizontal" onsubmit="return widget_settings(this)">
-        <div class="form-group">
-            <label for="tile_width" class="col-sm-4 control-label">Tile width</label>
-            <div class="col-sm-6">
-                <input class="form-control" name="tile_width" placeholder="I.e 10" value="'.$current_width.'">
-            </div>
-        </div>
-        <div class="form-group">
-            <label for="show_services" class="col-sm-4 control-label">Show</label>
-            <div class="col-sm-6">
-                <select class="form-control" name="mode">
-                    <option value="0" '.($current_mode == 0 ? 'selected':'').'>Only Devices</option>
-                    <option value="1"' .($current_mode == 1 ? 'selected':'').'>Only Services</option>
-                    <option value="2"' .($current_mode == 2 ? 'selected':'').'>Devices and Services</option>
-                </select>
-            </div>
-        </div>
-        <div class="form-group">
-            <div class="col-sm-offset-6 col-sm-4">
-                <button type="submit" class="btn btn-primary">Set</button>
-            </div>
-        </div>
-    </form>
-    ';
-}
-else {
+
+    $common_output[] = '<form class="form-horizontal" onsubmit="return widget_settings(this)">';
+    $common_output[] = '<div class="form-group">';
+    $common_output[] = '<label for="tile_width" class="col-sm-4 control-label">Tile width</label>';
+    $common_output[] = '<div class="col-sm-6">';
+    $common_output[] = '<input class="form-control" name="tile_width" placeholder="I.e 10" value="'.$current_width.'">';
+    $common_output[] = '</div>';
+    $common_output[] = '</div>';
+    $common_output[] = '<div class="form-group">';
+    $common_output[] = '<label for="show_services" class="col-sm-4 control-label">Show</label>';
+    $common_output[] = '<div class="col-sm-6">';
+    $common_output[] = '<select class="form-control" name="mode">';
+    $common_output[] = '<option value="0" '.($current_mode == 0 ? 'selected':'').'>only devices</option>';
+    $common_output[] = '<option value="1"' .($current_mode == 1 ? 'selected':'').'>only services</option>';
+    $common_output[] = '<option value="2"' .($current_mode == 2 ? 'selected':'').'>devices and services</option>';
+    $common_output[] = '</select>';
+    $common_output[] = '</div>';
+    $common_output[] = '</div>';
+    $common_output[] = '<div class="form-group">';
+    $common_output[] = '<div class="col-sm-offset-6 col-sm-4">';
+    $common_output[] = '<button type="submit" class="btn btn-primary">Set</button>';
+    $common_output[] = '</div>';
+    $common_output[] = '</div>';
+    $common_output[] = '</form>';
+
+} else {
     require_once 'includes/object-cache.inc.php';
-    $mode = isset($widget_settings['mode']) ? $widget_settings['mode'] : 0;
+    $mode = isset($_SESSION["mapView"]) ? $_SESSION["mapView"] : 0;
+
+    $widget_mode = isset($widget_settings['mode']) ? $widget_settings['mode'] : 0;
     $tile_width = isset($widget_settings['tile_width']) ? $widget_settings['tile_width'] : 10;
 
-    $up_count = 0;
-    $warn_count = 0;
-    $down_count = 0;
+    $host_up_count = 0;
+    $host_warn_count = 0;
+    $host_down_count = 0;
+    $service_up_count = 0;
+    $service_down_count = 0;
 
     if ($mode == 0 || $mode == 2) {
         // Only show devices if mode is 0 or 2 (Only Devices or both)
-        $sql = 'SELECT `D`.`hostname`,`D`.`device_id`,`D`.`status`,`D`.`uptime` FROM `devices` AS `D`';
+        $sql = 'SELECT `D`.`hostname`,`D`.`device_id`,`D`.`status`,`D`.`uptime`, `D`.`os` FROM `devices` AS `D`';
         if (is_normal_user() === true) {
             $sql .= ' , `devices_perms` AS P WHERE D.`device_id` = P.`device_id` AND P.`user_id` = ? AND';
             $param = array(
                 $_SESSION['user_id']
-                );
-        }
-        else {
+            );
+        } else {
             $sql .= ' WHERE';
         }
         $sql .= " `D`.`ignore` = '0' AND `D`.`disabled` = '0' ORDER BY `hostname`";
@@ -67,49 +69,135 @@ else {
         foreach (dbFetchRows($sql, $param) as $device) {
             if ($device['status'] == '1') {
                 if (($device['uptime'] < $config['uptime_warning']) && ($device['uptime'] != '0')) {
-                    $btn_type = 'btn-warning';
-                    $warn_count++;
+                    $deviceState = 'warning';
+                    $deviceLabel = 'label-warning';
+                    $host_warn_count++;
+                } else {
+                    $deviceState = 'up';
+                    $deviceLabel = 'label-success';
+                    $host_up_count++;
                 }
-                else {
-                    $btn_type = 'btn-success';
-                    $up_count ++;
-                }
-            }
-            else {
-                $btn_type = 'btn-danger';
-                $down_count++;
+            } else {
+                $deviceState = 'down';
+                $deviceLabel = 'label-danger';
+                $host_down_count++;
+            }
+
+            if($directpage == "yes")
+            {
+                $deviceIcon = getImage($device);
+                $temp_output[] = '<a href="' . generate_url(array('page' => 'device', 'device' => $device['device_id'])) . '" ';
+                $temp_output[] = 'title="' . $device['hostname'] . " - " . formatUptime($device['uptime']) . '">';
+                $temp_output[] = '<div class="device-availability ' . $deviceState . '">';
+                $temp_output[] = '<label class="availability-label label ' . $deviceLabel . '">' . $deviceState . '</label>';
+                $temp_output[] = '<span class="device-icon">' . $deviceIcon . '</span><br>';
+                $temp_output[] = '<span class="small">' . $device["hostname"] . '</span>';
+                $temp_output[] = '</div></a>';
+            } else {
+                $temp_output[] = '<a href="' . generate_url(array('page' => 'device', 'device' => $device['device_id'])) . '" ';
+                $temp_output[] = 'title="' . $device['hostname'] . " - " . formatUptime($device['uptime']) . '">';
+                $temp_output[] = '<label class="label '.$deviceLabel.' widget-availability">'.$deviceState.'</label>';
+                $temp_output[] = '</a>';
             }
 
-            $temp_output[] = '<a href="' . generate_url(array(
-                'page' => 'device',
-                'device' => $device['device_id']
-                )) . '" role="button" class="btn ' . $btn_type . ' btn-xs" title="' . $device['hostname'] . " - " . formatUptime($device['uptime']) . '" style="min-height:' . $tile_width . 'px; min-width: ' . $tile_width . 'px; border-radius:0px; margin:0px; padding:0px;"></a>';
         }
     }
 
     if ($mode == 1 || $mode == 2) {
-        $service_query = 'select `S`.`service_type`, `S`.`service_id`, `S`.`service_desc`, `S`.`service_status`, `D`.`hostname`, `D`.`device_id` from services S, devices D where `S`.`device_id` = `D`.`device_id`;';
+        $service_query = 'select `S`.`service_type`, `S`.`service_id`, `S`.`service_desc`, `S`.`service_status`, `D`.`hostname`, `D`.`device_id`, `D`.`os` from services S, devices D where `S`.`device_id` = `D`.`device_id`;';
         foreach (dbFetchRows($service_query) as $service) {
             if ($service['service_status'] == '0') {
-                $btn_type = 'btn-success';
-                $up_count ++;
-            }
-            else {
-                $btn_type = 'btn-danger';
-                $down_count += 1;
+                $serviceLabel = "label-success";
+                $serviceState = "up";
+                $service_up_count++;
+            } else {
+                $serviceLabel = "label-danger";
+                $serviceState = "down";
+                $service_down_count += 1;
             }
 
-            $temp_output[] = '<a href="' . generate_url(array(
-                'page' => 'device',
-                'tab' => 'services',
-                'device' => $service['device_id']
-                )) . '" role="button" class="btn ' . $btn_type . ' btn-xs" title="' .$service['hostname']." - ".$service['service_type']." - ".$service['service_desc'] . '" style="min-height:' . $tile_width . 'px; min-width: ' . $tile_width . 'px; border-radius:0px; margin:0px; padding:0px;"></a>';
+            if($directpage == "yes")
+            {
+                $deviceIcon = getImage($service);
+                $temp_output[] = '<a href="' . generate_url(array('page' => 'device', 'tab' => 'services', 'device' => $service['device_id'])) . '"';
+                $temp_output[] = 'title="' . $service['hostname'] . " - " . $service['service_type'] . " - " . $service['service_desc'] . '">';
+                $temp_output[] = '<div class="service-availability ' . $serviceState . '">';
+                $temp_output[] = '<label class="service-name-label label ' . $serviceLabel . '">' . $service["service_type"] . '</label>';
+                $temp_output[] = '<label class="availability-label label ' . $serviceLabel . '">' . $serviceState . '</label>';
+                $temp_output[] = '<span class="device-icon">' . $deviceIcon . '</span><br>';
+                $temp_output[] = '<span class="small">' . $service["hostname"] . '</span>';
+                $temp_output[] = '</div></a>';
+            } else {
+                $temp_output[] = '<a href="' . generate_url(array('page' => 'device', 'tab' => 'services', 'device' => $service['device_id'])) . '"';
+                $temp_output[] = 'title="' . $service['hostname'] . " - " . $service['service_type'] . " - " . $service['service_desc'] . '">';
+                $temp_output[] = '<label class="label '.$serviceLabel.' widget-availability">'.$service['service_type'].' - '.$serviceState.'</label>';
+                $temp_output[] = '</a>';
+            }
         }
     }
 
-    $temp_output[] = '</div>';
-    $temp_header   = array(
-        '<div style="margin-left:auto; margin-right:auto;"><center><h5><i class="fa fa-check" style="color:green">'.$up_count.' </i> <i class="fa fa-exclamation-triangle" style="color:orange"> '.$warn_count.'</i> <i class="fa fa-exclamation-circle" style="color:red"> '.$down_count.'</i></h5></center><br />'
-        );
+    if($directpage == "yes")
+    {
+        $temp_header[] = '<div class="page-availability-title-left">';
+        $temp_header[] = '<span class="page-availability-title">Availability map for</span>';
+        $temp_header[] = '<select id="mode" class="page-availability-report-select" name="mode">';
+        $temp_header[] = '<option value="0" ' . ($mode == 0 ? 'selected' : '') . '>devices</option>';
+        $temp_header[] = '<option value="1"' . ($mode == 1 ? 'selected' : '') . '>services</option>';
+        $temp_header[] = '<option value="2"' . ($mode == 2 ? 'selected' : '') . '>devices and services</option>';
+        $temp_header[] = '</select></div>';
+        $temp_header[] = '<div class="page-availability-title-right">';
+
+    }
+
+
+    if ($mode == 0 || $mode == 2)
+    {
+        if($directpage == "yes")
+        {
+            $temp_header[] = '<div class="page-availability-report-host">';
+            $temp_header[] = '<span>Hosts report:</span>';
+            $temp_header[] = '<div style="float:right;">';
+            $temp_header[] = '<div class="small page-availability-report-entry"><label class="label label-success">up</label></div>';
+            $temp_header[] = '<div class="small page-availability-report-entry"><span>' . $host_up_count . '</span></div>';
+            $temp_header[] = '</div>';
+            $temp_header[] = '<div style="float:right;">';
+            $temp_header[] = '<div class="small page-availability-report-entry"><label class="label label-warning">warning</label></div>';
+            $temp_header[] = '<div class="small page-availability-report-entry"><span>' . $host_warn_count . '</span></div>';
+            $temp_header[] = '</div>';
+            $temp_header[] = '<div style="float:right;">';
+            $temp_header[] = '<div class="small page-availability-report-entry"><label class="label label-danger">down</label></div>';
+            $temp_header[] = '<div class="small page-availability-report-entry"><span>' . $host_down_count . '</span></div>';
+            $temp_header[] = '</div>';
+            $temp_header[] = '</div>';
+        } else {
+            $temp_header[] = '<div class="widget-availability-host">Total hosts <label class="label label-success">up</label> '.$host_up_count.' <label class="label label-warning">warning</label> '.$host_warn_count.' <label class="label label-danger">down</label> '.$host_down_count.'</div>';
+        }
+
+    }
+
+    if ($mode == 1 || $mode == 2)
+    {
+        if($directpage == "yes")
+        {
+
+            $temp_header[] = '<div class="page-availability-report-service">';
+            $temp_header[] = '<span>Services report:</span>';
+            $temp_header[] = '<div style="float:right;">';
+            $temp_header[] = '<div class="small page-availability-report-entry"><label class="label label-success">up</label></div>';
+            $temp_header[] = '<div class="small page-availability-report-entry"><span>' . $service_up_count . '</span></div>';
+            $temp_header[] = '</div>';
+            $temp_header[] = '<div style="float:right;">';
+            $temp_header[] = '<div class="small page-availability-report-entry"><label class="label label-danger">down</label></div>';
+            $temp_header[] = '<div class="small page-availability-report-entry"><span>' . $service_down_count . '</span></div>';
+            $temp_header[] = '</div>';
+            $temp_header[] = '</div>';
+        } else {
+            $temp_header[] = '<div class="widget-availability-service">Total services <label class="label label-success">up</label> '.$service_up_count.' <label class="label label-danger">down</label> '.$service_down_count.'</div>';
+        }
+    }
+
+    $temp_header[] = '</div>';
+    $temp_header[] = '<br style="clear:both;"/>';
+
     $common_output = array_merge($temp_header, $temp_output);
-}
+}
\ No newline at end of file
diff --git a/html/js/librenms.js b/html/js/librenms.js
index f103ea29b0..84cc1b6694 100644
--- a/html/js/librenms.js
+++ b/html/js/librenms.js
@@ -225,6 +225,17 @@ $(document).on("click", '.collapse-neighbors', function(event)
 });
 
 
+$(document).on("change", '#mode', function() {
+    $.post('ajax_mapview.php',
+        {
+            mapView: $(this).val()
+        },
+        function(data) {
+                location.reload();
+        },'json'
+    );
+});
+
 $(document).ready(function() {
     var lines = 'on';
     $("#linenumbers").button().click(function() {
@@ -243,4 +254,4 @@ $(document).ready(function() {
             });
         }
     });
-});
+});
\ No newline at end of file
diff --git a/html/pages/availability-map.inc.php b/html/pages/availability-map.inc.php
index b5ede4e144..2b86db8361 100644
--- a/html/pages/availability-map.inc.php
+++ b/html/pages/availability-map.inc.php
@@ -1,6 +1,5 @@
-<h3> Availability Map </h3>
-<hr>
 <?php
+$directpage = "yes";
 $pagetitle[] = 'Availability Map';
 include_once 'includes/common/availability-map.inc.php';
 echo implode('',$common_output);