diff --git a/shell/contents/views/Desktop.qml b/shell/contents/views/Desktop.qml
index 5804d3bb..7de8069d 100644
--- a/shell/contents/views/Desktop.qml
+++ b/shell/contents/views/Desktop.qml
@@ -19,6 +19,7 @@
  */
 
 import QtQuick 2.0
+import QtGraphicalEffects 1.0
 import org.kde.plasma.core 2.0 as PlasmaCore
 import org.kde.plasma.shell 2.0 as Shell
 import "../components"
@@ -32,22 +33,6 @@ Item {
     property Item wallpaper;
     property var pendingRemovals: [];
     property int notificationId: 0;
-    Timer {
-        id: pendingTimer
-        interval: 5000
-        repeat: false
-        onTriggered: {
-            for (var i = 0; i < pendingRemovals.length; ++i) {
-                var id = pendingRemovals[i];
-                for (var j = 0; j < notificationsModel.count; ++j) {
-                    if (notificationsModel.get(j).id == id) {
-                        notificationsModel.remove(j);
-                    }
-                }
-            }
-            pendingRemovals = [];
-        }
-    }
 
     /*
         Notificadtion data object has the following properties:
@@ -62,7 +47,6 @@ Item {
         appRealName
         configurable
     */
-
     function addNotification(source, data, actions) {
         // Do not show duplicated notifications
         // Remove notifications that are sent again (odd, but true)
@@ -98,6 +82,24 @@ Item {
         }
     }
 
+
+    Timer {
+        id: pendingTimer
+        interval: 5000
+        repeat: false
+        onTriggered: {
+            for (var i = 0; i < pendingRemovals.length; ++i) {
+                var id = pendingRemovals[i];
+                for (var j = 0; j < notificationsModel.count; ++j) {
+                    if (notificationsModel.get(j).id == id) {
+                        notificationsModel.remove(j);
+                    }
+                }
+            }
+            pendingRemovals = [];
+        }
+    }
+
     PlasmaCore.DataSource {
         id: notificationsSource
 
@@ -154,6 +156,33 @@ Item {
         }
     }
 
+    Dialer {
+        id: dialer
+        anchors {
+            left: parent.left
+            top: statusPanel.bottom
+            right: parent.right
+            bottom: parent.bottom
+        }
+        z: 20
+        opacity: 0
+        visible: false
+
+        Behavior on opacity {
+            NumberAnimation { properties: "opacity"; duration: 100 }
+        }
+
+        onVisibleChanged: {
+            opacity = visible ? 0.9 : 0;
+        }
+
+        onCallingChanged: {
+            if (!calling) {
+                opacity = 0;
+            }
+        }
+    }
+
     Rectangle {
         id: statusPanel
         anchors {
@@ -247,7 +276,9 @@ Item {
                 id: phoneIcon
                 svg: stripeIcons
                 elementId: "phone"
-                callback: function() { console.log("Start phone") }
+                callback: function() {
+                    dialer.visible = true;
+                }
             }
 
             HomeLauncherSvg {
diff --git a/shell/contents/views/Dialer.qml b/shell/contents/views/Dialer.qml
index cedf45a5..d8117701 100644
--- a/shell/contents/views/Dialer.qml
+++ b/shell/contents/views/Dialer.qml
@@ -4,7 +4,6 @@ import "../components"
 
 Rectangle {
     id: dialer
-    anchors.fill: parent;
     color: "white"
     opacity: 0.5