From a39e57f4d9108957825f3bce4e127e53894279ac Mon Sep 17 00:00:00 2001 From: Shannon Date: Tue, 11 Jun 2013 13:12:54 +0200 Subject: [PATCH] added null check for prop editors, got the RTE media picker working properly with correct styles and using the server data. --- .../common/dialogs/mediapicker.controller.js | 15 +++++++-- .../umbraco/rte/rte.controller.js | 6 +++- .../src/common/services/utill.service.js | 33 +++++++++++++++++++ .../common/dialogs/mediapicker.controller.js | 15 +++++++-- .../src/views/common/dialogs/mediapicker.html | 8 ++--- .../umbraco/rte/rte.controller.js | 6 +++- .../PropertyEditors/Js/FileUploadEditor.js | 5 ++- .../Views/common/dialogs/mediapicker.html | 8 ++--- src/Umbraco.Web/Editors/ContentController.cs | 10 +++++- src/Umbraco.Web/Editors/MediaController.cs | 10 +++++- 10 files changed, 93 insertions(+), 23 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/build/belle/views/common/dialogs/mediapicker.controller.js b/src/Umbraco.Web.UI.Client/build/belle/views/common/dialogs/mediapicker.controller.js index 159a470985..bfc82d153a 100644 --- a/src/Umbraco.Web.UI.Client/build/belle/views/common/dialogs/mediapicker.controller.js +++ b/src/Umbraco.Web.UI.Client/build/belle/views/common/dialogs/mediapicker.controller.js @@ -1,20 +1,29 @@ //used for the media picker dialog angular.module("umbraco") .controller("Umbraco.Dialogs.MediaPickerController", - function($scope, mediaResource) { + function ($scope, mediaResource, umbImageHelper) { mediaResource.rootMedia() .then(function(data) { $scope.images = data; + //update the thumbnail property + _.each($scope.images, function(img) { + img.thumbnail = umbImageHelper.getThumbnail({ imageModel: img, scope: $scope }); + }); }); - + $scope.selectMediaItem = function(image) { if (image.contentTypeAlias.toLowerCase() == 'folder') { mediaResource.getChildren(image.id) .then(function(data) { $scope.images = data; + //update the thumbnail property + _.each($scope.images, function (img) { + img.thumbnail = umbImageHelper.getThumbnail({ imageModel: img, scope: $scope }); + }); }); - } else if (image.contentTypeAlias.toLowerCase() == 'image') { + } + else if (image.contentTypeAlias.toLowerCase() == 'image') { $scope.select(image); } }; diff --git a/src/Umbraco.Web.UI.Client/build/belle/views/propertyeditors/umbraco/rte/rte.controller.js b/src/Umbraco.Web.UI.Client/build/belle/views/propertyeditors/umbraco/rte/rte.controller.js index 3b13634e3b..861c0a9155 100644 --- a/src/Umbraco.Web.UI.Client/build/belle/views/propertyeditors/umbraco/rte/rte.controller.js +++ b/src/Umbraco.Web.UI.Client/build/belle/views/propertyeditors/umbraco/rte/rte.controller.js @@ -37,8 +37,12 @@ angular.module("umbraco") return item.alias == 'umbracoFile'; }); + var imageData = $scope.$eval(imageProperty.value); + var data = { - src: imageProperty != null ? imageProperty.value : "nothing.jpg", + src: (imageData != null && imageData.length && imageData.length > 0) + ? imageData[0].file + : "nothing.jpg", style: 'width: 100px; height: 100px', id: '__mcenew' }; diff --git a/src/Umbraco.Web.UI.Client/src/common/services/utill.service.js b/src/Umbraco.Web.UI.Client/src/common/services/utill.service.js index 28b4a1d94d..05f7736994 100644 --- a/src/Umbraco.Web.UI.Client/src/common/services/utill.service.js +++ b/src/Umbraco.Web.UI.Client/src/common/services/utill.service.js @@ -1,5 +1,38 @@ /*Contains multiple services for various helper tasks */ +/** +* @ngdoc factory +* @name umbraco.services:umbImageHelper +* @description A helper object used for parsing image paths +**/ +function umbImageHelper() { + return { + /** formats the display model used to display the content to the model used to save the content */ + getThumbnail: function (options) { + + if (!options && !options.imageModel && !options.scope) { + throw "The options objet does not contain the required parameters: imageModel, scope"; + } + + if (options.imageModel.contentTypeAlias.toLowerCase() == "image") { + var imageProp = _.find(options.imageModel.properties, function (item) { + return item.alias == 'umbracoFile'; + }); + var imageVal = options.scope.$eval(imageProp.value); + if (imageVal.length && imageVal.length >0 && imageVal[0].isImage) { + return this.getThumbnailFromPath(imageVal[0].file); + } + } + return ""; + }, + getThumbnailFromPath: function(imagePath) { + var ext = imagePath.substr(imagePath.lastIndexOf('.')); + return imagePath.substr(0, imagePath.lastIndexOf('.')) + "_thumb" + ext; + } + }; +} +angular.module('umbraco.services').factory('umbImageHelper', umbImageHelper); + /** * @ngdoc factory * @name umbraco.services:umbRequestHelper diff --git a/src/Umbraco.Web.UI.Client/src/views/common/dialogs/mediapicker.controller.js b/src/Umbraco.Web.UI.Client/src/views/common/dialogs/mediapicker.controller.js index 159a470985..bfc82d153a 100644 --- a/src/Umbraco.Web.UI.Client/src/views/common/dialogs/mediapicker.controller.js +++ b/src/Umbraco.Web.UI.Client/src/views/common/dialogs/mediapicker.controller.js @@ -1,20 +1,29 @@ //used for the media picker dialog angular.module("umbraco") .controller("Umbraco.Dialogs.MediaPickerController", - function($scope, mediaResource) { + function ($scope, mediaResource, umbImageHelper) { mediaResource.rootMedia() .then(function(data) { $scope.images = data; + //update the thumbnail property + _.each($scope.images, function(img) { + img.thumbnail = umbImageHelper.getThumbnail({ imageModel: img, scope: $scope }); + }); }); - + $scope.selectMediaItem = function(image) { if (image.contentTypeAlias.toLowerCase() == 'folder') { mediaResource.getChildren(image.id) .then(function(data) { $scope.images = data; + //update the thumbnail property + _.each($scope.images, function (img) { + img.thumbnail = umbImageHelper.getThumbnail({ imageModel: img, scope: $scope }); + }); }); - } else if (image.contentTypeAlias.toLowerCase() == 'image') { + } + else if (image.contentTypeAlias.toLowerCase() == 'image') { $scope.select(image); } }; diff --git a/src/Umbraco.Web.UI.Client/src/views/common/dialogs/mediapicker.html b/src/Umbraco.Web.UI.Client/src/views/common/dialogs/mediapicker.html index 95eed5cee5..f02ff6308c 100644 --- a/src/Umbraco.Web.UI.Client/src/views/common/dialogs/mediapicker.html +++ b/src/Umbraco.Web.UI.Client/src/views/common/dialogs/mediapicker.html @@ -37,11 +37,9 @@ ng-click="selectMediaItem(image)" prevent-default> -
- {{image.name}} - - - +
+ {{image.name}} +
{{image.name}} diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/umbraco/rte/rte.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/umbraco/rte/rte.controller.js index 3b13634e3b..861c0a9155 100644 --- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/umbraco/rte/rte.controller.js +++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/umbraco/rte/rte.controller.js @@ -37,8 +37,12 @@ angular.module("umbraco") return item.alias == 'umbracoFile'; }); + var imageData = $scope.$eval(imageProperty.value); + var data = { - src: imageProperty != null ? imageProperty.value : "nothing.jpg", + src: (imageData != null && imageData.length && imageData.length > 0) + ? imageData[0].file + : "nothing.jpg", style: 'width: 100px; height: 100px', id: '__mcenew' }; diff --git a/src/Umbraco.Web.UI/App_Plugins/MyPackage/PropertyEditors/Js/FileUploadEditor.js b/src/Umbraco.Web.UI/App_Plugins/MyPackage/PropertyEditors/Js/FileUploadEditor.js index f6e0dc1920..8f87d2864e 100644 --- a/src/Umbraco.Web.UI/App_Plugins/MyPackage/PropertyEditors/Js/FileUploadEditor.js +++ b/src/Umbraco.Web.UI/App_Plugins/MyPackage/PropertyEditors/Js/FileUploadEditor.js @@ -5,7 +5,7 @@ define(['namespaceMgr'], function () { Umbraco.Sys.registerNamespace("MyPackage.PropertyEditors"); - MyPackage.PropertyEditors.FileUploadEditor = function ($scope, $element, $compile) { + MyPackage.PropertyEditors.FileUploadEditor = function ($scope, $element, $compile, umbImageHelper) { /** Clears the file collections when content is saving (if we need to clear) or after saved */ function clearFiles() { @@ -40,8 +40,7 @@ define(['namespaceMgr'], function () { } $scope.getThumbnail = function (file) { - var ext = file.file.substr(file.file.lastIndexOf('.')); - return file.file.substr(0, file.file.lastIndexOf('.')) + "_thumb" + ext; + return umbImageHelper.getThumbnailFromPath(file.file); }; $scope.clearFiles = false; diff --git a/src/Umbraco.Web.UI/umbraco/Views/common/dialogs/mediapicker.html b/src/Umbraco.Web.UI/umbraco/Views/common/dialogs/mediapicker.html index 95eed5cee5..f02ff6308c 100644 --- a/src/Umbraco.Web.UI/umbraco/Views/common/dialogs/mediapicker.html +++ b/src/Umbraco.Web.UI/umbraco/Views/common/dialogs/mediapicker.html @@ -37,11 +37,9 @@ ng-click="selectMediaItem(image)" prevent-default> -
- {{image.name}} - - - +
+ {{image.name}} +
{{image.name}} diff --git a/src/Umbraco.Web/Editors/ContentController.cs b/src/Umbraco.Web/Editors/ContentController.cs index 9bb6ac0cd9..757a84722b 100644 --- a/src/Umbraco.Web/Editors/ContentController.cs +++ b/src/Umbraco.Web/Editors/ContentController.cs @@ -4,6 +4,7 @@ using System.Net; using System.Net.Http; using System.Web.Http; using System.Web.Http.ModelBinding; +using Umbraco.Core.Logging; using Umbraco.Core.Models; using Umbraco.Core.Models.Editors; using Umbraco.Web.Models.ContentEditing; @@ -125,7 +126,14 @@ namespace Umbraco.Web.Editors var data = new ContentPropertyData(p.Value, d); //get the deserialized value from the property editor - dboProperty.Value = p.PropertyEditor.ValueEditor.DeserializeValue(data, dboProperty.Value); + if (p.PropertyEditor == null) + { + LogHelper.Warn("No property editor found for property " + p.Alias); + } + else + { + dboProperty.Value = p.PropertyEditor.ValueEditor.DeserializeValue(data, dboProperty.Value); + } } //save the item diff --git a/src/Umbraco.Web/Editors/MediaController.cs b/src/Umbraco.Web/Editors/MediaController.cs index b3c56d77cb..edd08753c8 100644 --- a/src/Umbraco.Web/Editors/MediaController.cs +++ b/src/Umbraco.Web/Editors/MediaController.cs @@ -3,6 +3,7 @@ using System.Net; using System.Net.Http; using System.Web.Http; using System.Web.Http.ModelBinding; +using Umbraco.Core.Logging; using Umbraco.Core.Models; using Umbraco.Core.Models.Editors; using Umbraco.Web.Models.ContentEditing; @@ -123,7 +124,14 @@ namespace Umbraco.Web.Editors var data = new ContentPropertyData(p.Value, d); //get the deserialized value from the property editor - dboProperty.Value = p.PropertyEditor.ValueEditor.DeserializeValue(data, dboProperty.Value); + if (p.PropertyEditor == null) + { + LogHelper.Warn("No property editor found for property " + p.Alias); + } + else + { + dboProperty.Value = p.PropertyEditor.ValueEditor.DeserializeValue(data, dboProperty.Value); + } } //save the item