diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/editors/media.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/editors/media.controller.js
index 21f9534848..c240d6b37d 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/editors/media.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/editors/media.controller.js
@@ -1,6 +1,6 @@
 angular.module("umbraco")
     .controller("Umbraco.PropertyEditors.Grid.MediaController",
-    function ($scope, $rootScope, $timeout, userService) {
+    function ($scope, $timeout, userService, editorService) {
 
         if (!$scope.model.config.startNodeId) {
             userService.getCurrentUser().then(function (userData) {
@@ -9,38 +9,44 @@ angular.module("umbraco")
             });
         }
 
-        $scope.setImage = function(){
-            $scope.mediaPickerOverlay = {};
-            $scope.mediaPickerOverlay.view = "mediapicker";
-            $scope.mediaPickerOverlay.startNodeId = $scope.model.config && $scope.model.config.startNodeId ? $scope.model.config.startNodeId : undefined;
-            $scope.mediaPickerOverlay.startNodeIsVirtual = $scope.mediaPickerOverlay.startNodeId ? $scope.model.config.startNodeIsVirtual : undefined;
-            $scope.mediaPickerOverlay.cropSize = $scope.control.editor.config && $scope.control.editor.config.size ? $scope.control.editor.config.size : undefined;
-            $scope.mediaPickerOverlay.showDetails = true;
-            $scope.mediaPickerOverlay.disableFolderSelect = true;
-            $scope.mediaPickerOverlay.onlyImages = true;
-            $scope.mediaPickerOverlay.show = true;
-
-            $scope.mediaPickerOverlay.submit = function(model) {
-                var selectedImage = model.selectedImages[0];
-
-                $scope.control.value = {
-                    focalPoint: selectedImage.focalPoint,
-                    id: selectedImage.id,
-                    udi: selectedImage.udi,
-                    image: selectedImage.image,
-                    altText: selectedImage.altText
-                };
-
+        function onInit() {
+            if($scope.control.value){
                 $scope.setUrl();
+            }
+        }
 
-                $scope.mediaPickerOverlay.show = false;
-                $scope.mediaPickerOverlay = null;
-            };
+        $scope.setImage = function(){
+            var startNodeId = $scope.model.config && $scope.model.config.startNodeId ? $scope.model.config.startNodeId : undefined;
+            var startNodeIsVirtual = startNodeId ? $scope.model.config.startNodeIsVirtual : undefined;
 
-            $scope.mediaPickerOverlay.close = function(oldModel) {
-                $scope.mediaPickerOverlay.show = false;
-                $scope.mediaPickerOverlay = null;
-            };
+            var mediaPicker = {
+                startNodeId: startNodeId,
+                startNodeIsVirtual: startNodeIsVirtual,
+                cropSize: $scope.control.editor.config && $scope.control.editor.config.size ? $scope.control.editor.config.size : undefined,
+                showDetails: true,
+                disableFolderSelect: true,
+                onlyImages: true,
+                submit: function(model) {
+                    var selectedImage = model.selectedImages[0];
+                   
+                    $scope.control.value = {
+                        focalPoint: selectedImage.focalPoint,
+                        id: selectedImage.id,
+                        udi: selectedImage.udi,
+                        image: selectedImage.image,
+                        altText: selectedImage.altText
+                    };   
+
+                    $scope.setUrl();
+                    
+                    editorService.close();
+                },
+                close: function() {
+                    editorService.close();
+                }
+            }
+            
+            editorService.mediaPicker(mediaPicker);
         };
 
         $scope.setUrl = function(){
@@ -68,11 +74,6 @@ angular.module("umbraco")
             }
         };
 
-        $timeout(function(){
-            if($scope.control.$initializing){
-                $scope.setImage();
-            }else if($scope.control.value){
-                $scope.setUrl();
-            }
-        }, 200);
+        onInit();
+
 });
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/editors/media.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/editors/media.html
index dd35757397..7ffb26d831 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/editors/media.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/editors/media.html
@@ -14,11 +14,4 @@
         <input type="text" class="caption" ng-model="control.value.caption" localize="placeholder" placeholder="@grid_placeholderImageCaption" />
  	</div>
 
-	<umb-overlay
-		ng-if="mediaPickerOverlay.show"
-		model="mediaPickerOverlay"
-		view="mediaPickerOverlay.view"
-		position="right">
-	</umb-overlay>
-
 </div>