From 9aa5df43bf4ed90e2ee02dc3bad6803c17676cd3 Mon Sep 17 00:00:00 2001
From: Shannon <sdeminick@gmail.com>
Date: Wed, 18 Mar 2015 19:14:47 +1100
Subject: [PATCH] Fixes: U4-5956 Feature request: Enhance the preview mode with
 labels clearly explaining the current view

---
 .../src/canvasdesigner/canvasdesigner.controller.js  | 12 ++++++------
 .../src/canvasdesigner/index.html                    |  2 +-
 2 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/canvasdesigner/canvasdesigner.controller.js b/src/Umbraco.Web.UI.Client/src/canvasdesigner/canvasdesigner.controller.js
index 403a05a5e1..127d5882dc 100644
--- a/src/Umbraco.Web.UI.Client/src/canvasdesigner/canvasdesigner.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/canvasdesigner/canvasdesigner.controller.js
@@ -15,12 +15,12 @@ var app = angular.module("Umbraco.canvasdesigner", ['colorpicker', 'ui.slider',
     $scope.pageUrl = "../dialogs/Preview.aspx?id=" + $location.search().id;
     $scope.valueAreLoaded = false;
     $scope.devices = [
-        { name: "desktop", css: "desktop", icon: "icon-display" },
-        { name: "laptop - 1366px", css: "laptop border", icon: "icon-laptop" },
-        { name: "iPad portrait - 768px", css: "iPad-portrait border", icon: "icon-ipad" },
-        { name: "iPad landscape - 1024px", css: "iPad-landscape border", icon: "icon-ipad flip" },
-        { name: "smartphone portrait - 480px", css: "smartphone-portrait border", icon: "icon-iphone" },
-        { name: "smartphone landscape  - 320px", css: "smartphone-landscape border", icon: "icon-iphone flip" }
+        { name: "desktop", css: "desktop", icon: "icon-display", title: "Desktop" },
+        { name: "laptop - 1366px", css: "laptop border", icon: "icon-laptop", title: "Laptop" },
+        { name: "iPad portrait - 768px", css: "iPad-portrait border", icon: "icon-ipad", title: "Tablet portrait" },
+        { name: "iPad landscape - 1024px", css: "iPad-landscape border", icon: "icon-ipad flip", title: "Tablet landscape" },
+        { name: "smartphone portrait - 480px", css: "smartphone-portrait border", icon: "icon-iphone", title: "Smartphone portrait" },
+        { name: "smartphone landscape  - 320px", css: "smartphone-landscape border", icon: "icon-iphone flip", title: "Smartphone landscape" }
     ];
     $scope.previewDevice = $scope.devices[0];
 
diff --git a/src/Umbraco.Web.UI.Client/src/canvasdesigner/index.html b/src/Umbraco.Web.UI.Client/src/canvasdesigner/index.html
index 0e150965d6..3db48d1940 100644
--- a/src/Umbraco.Web.UI.Client/src/canvasdesigner/index.html
+++ b/src/Umbraco.Web.UI.Client/src/canvasdesigner/index.html
@@ -25,7 +25,7 @@
 
             <ul class="sections" ng-class="{selected: showDevicesPreview}">
                 <li ng-repeat="device in devices" ng-class="{ current:previewDevice==device }" ng-click="updatePreviewDevice(device)">
-                    <a href="#"><i class="icon {{device.icon}}"></i><span></span></a>
+                    <a href="#"><i class="icon {{device.icon}}" title="{{device.title}}"></i><span></span></a>
                 </li>
                 <li ng-click="closePreviewDevice()" ng-if="enableCanvasdesigner > 0">
                     <a href="" class="more-options">