From a65691106135b63db507037394bbcfb075c3fec8 Mon Sep 17 00:00:00 2001 From: Shannon Date: Tue, 11 Jun 2013 12:16:37 +0200 Subject: [PATCH] Updating media picker to work and look properly --- .gitignore | 2 + .../views/common/dialogs/mediapicker.html | 49 ------------------- .../src/views/common/dialogs/mediapicker.html | 29 ++++++----- .../views/content/contentedit.controller.js | 4 +- .../src/views/media/mediaedit.controller.js | 13 ++++- .../PropertyEditors/FileUploadValueEditor.cs | 45 +++++++++++++---- .../PropertyEditors/Js/FileUploadEditor.js | 46 ++++++++++------- .../Views/FileUploadEditor.html | 7 ++- src/Umbraco.Web.UI/Umbraco.Web.UI.csproj | 4 +- .../Views/common/dialogs/mediapicker.html | 29 ++++++----- 10 files changed, 120 insertions(+), 108 deletions(-) delete mode 100644 src/Umbraco.Web.UI.Client/build/belle/views/common/dialogs/mediapicker.html diff --git a/.gitignore b/.gitignore index a39f26854f..d9e801a39d 100644 --- a/.gitignore +++ b/.gitignore @@ -77,3 +77,5 @@ src/Umbraco.Web.UI/umbraco/Views/**/*.css src/Umbraco.Web.UI/umbraco/Views/**/*.html src/Umbraco.Web.UI/umbraco/assets/* src/Umbraco.Web.UI.Client/build/* +src/Umbraco.Web.UI.Client/build/* +src/Umbraco.Web.UI.Client/build/belle/ diff --git a/src/Umbraco.Web.UI.Client/build/belle/views/common/dialogs/mediapicker.html b/src/Umbraco.Web.UI.Client/build/belle/views/common/dialogs/mediapicker.html deleted file mode 100644 index 3524f1371f..0000000000 --- a/src/Umbraco.Web.UI.Client/build/belle/views/common/dialogs/mediapicker.html +++ /dev/null @@ -1,49 +0,0 @@ -
-
-
-
- - -
-
-
- - -
-
-
-
    -
  • You are here:
    • -
  • Media
    • -
-
-
- - -
-
- - - -
-
- -
- -
\ No newline at end of file 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 3524f1371f..95eed5cee5 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 @@ -29,18 +29,25 @@ - diff --git a/src/Umbraco.Web.UI.Client/src/views/content/contentedit.controller.js b/src/Umbraco.Web.UI.Client/src/views/content/contentedit.controller.js index 757a2224d0..a8bc16e44d 100644 --- a/src/Umbraco.Web.UI.Client/src/views/content/contentedit.controller.js +++ b/src/Umbraco.Web.UI.Client/src/views/content/contentedit.controller.js @@ -28,8 +28,7 @@ angular.module("umbraco") } }; - $scope.saveAndPublish = function (cnt) { - cnt.publishDate = new Date(); + $scope.saveAndPublish = function (cnt) { contentResource.publishContent(cnt, $routeParams.create, $scope.files) .then(function(data) { $scope.content = data; @@ -38,7 +37,6 @@ angular.module("umbraco") }; $scope.save = function (cnt) { - cnt.updateDate = new Date(); contentResource.saveContent(cnt, $routeParams.create, $scope.files) .then(function (data) { $scope.content = data; diff --git a/src/Umbraco.Web.UI.Client/src/views/media/mediaedit.controller.js b/src/Umbraco.Web.UI.Client/src/views/media/mediaedit.controller.js index 9d0f0d8af9..1078f58eee 100644 --- a/src/Umbraco.Web.UI.Client/src/views/media/mediaedit.controller.js +++ b/src/Umbraco.Web.UI.Client/src/views/media/mediaedit.controller.js @@ -25,9 +25,18 @@ function mediaEditController($scope, $routeParams, mediaResource, notificationsS $scope.files.push({ id: propertyId, file: files[i] }); } }; + + //TODO: Clean this up and share this code with the content editor + $scope.saveAndPublish = function (cnt) { + mediaResource.saveMedia(cnt, $routeParams.create, $scope.files) + .then(function (data) { + $scope.content = data; + notificationsService.success("Published", "Media has been saved and published"); + }); + }; - $scope.save = function (cnt) { - cnt.updateDate = new Date(); + //TODO: Clean this up and share this code with the content editor + $scope.save = function (cnt) { mediaResource.saveMedia(cnt, $routeParams.create, $scope.files) .then(function (data) { $scope.content = data; diff --git a/src/Umbraco.Web.UI/App_Plugins/MyPackage/PropertyEditors/FileUploadValueEditor.cs b/src/Umbraco.Web.UI/App_Plugins/MyPackage/PropertyEditors/FileUploadValueEditor.cs index 785a108397..61696e4a52 100644 --- a/src/Umbraco.Web.UI/App_Plugins/MyPackage/PropertyEditors/FileUploadValueEditor.cs +++ b/src/Umbraco.Web.UI/App_Plugins/MyPackage/PropertyEditors/FileUploadValueEditor.cs @@ -1,4 +1,5 @@ -using System; + +using System; using System.Collections.Generic; using System.Globalization; using System.IO; @@ -21,6 +22,9 @@ namespace Umbraco.Web.UI.App_Plugins.MyPackage.PropertyEditors /// internal class FileUploadValueEditor : ValueEditor { + //TODO: This needs to come from pre-values + private const string ThumbnailSizes = "100"; + /// /// Overrides the deserialize value so that we can save the file accordingly /// @@ -106,9 +110,37 @@ namespace Umbraco.Web.UI.App_Plugins.MyPackage.PropertyEditors using (var fileStream = File.OpenRead(file.TempFilePath)) { var umbracoFile = UmbracoFile.Save(fileStream, fileName); - //add this to the persisted values - newValue.Add(JObject.FromObject(new { file = umbracoFile.Url })); + //create json to be saved + var forPersisting = JObject.FromObject(new + { + file = umbracoFile.Url, + isImage = false + }); + + + if (umbracoFile.SupportsResizing) + { + forPersisting["isImage"] = true; + + // make default thumbnail + umbracoFile.Resize(100, "thumb"); + + // additional thumbnails configured as prevalues on the DataType + char sep = (ThumbnailSizes.Contains("") == false && ThumbnailSizes.Contains(",")) ? ',' : ';'; + + foreach (string thumb in ThumbnailSizes.Split(sep)) + { + int thumbSize; + if (thumb != "" && int.TryParse(thumb, out thumbSize)) + { + umbracoFile.Resize(thumbSize, string.Format("thumb_{0}", thumbSize)); + } + } + } + + //add this to the persisted values + newValue.Add(forPersisting); } //now remove the temp file File.Delete(file.TempFilePath); @@ -117,13 +149,6 @@ namespace Umbraco.Web.UI.App_Plugins.MyPackage.PropertyEditors //TODO: We need to remove any files that were previously persisted but are no longer persisted. FOr example, if we // uploaded 5 files before and then only uploaded 3, then the last two should be deleted. - //NOTE: We will save a simple string if there is only one media item, this is mostly for backwards compatibility and for - // the current media pickers to work. - if (newValue.Count == 1) - { - return newValue[0]["file"].ToString(); - } - return newValue.ToString(Formatting.None); } } 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 b976f7bdeb..f6e0dc1920 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 @@ -7,22 +7,42 @@ define(['namespaceMgr'], function () { MyPackage.PropertyEditors.FileUploadEditor = function ($scope, $element, $compile) { + /** Clears the file collections when content is saving (if we need to clear) or after saved */ + function clearFiles() { + //TODO: There should be a better way! We don't want to have to know about the parent scope + //clear the parent files collection (we don't want to upload any!) + $scope.$parent.addFiles($scope.model.id, []); + //clear the current files + $scope.files = []; + } + + //clear the current files + $scope.files = []; //create the property to show the list of files currently saved if ($scope.model.value != "") { //for legacy data, this will not be an array, just a string so convert to an array if (!$scope.model.value.startsWith('[')) { - $scope.model.value = "[{\"file\": \"" + $scope.model.value + "\"}]"; + + //check if it ends with a common image extensions + var lowered = $scope.model.value.toLowerCase(); + var isImage = false; + if (lowered.endsWith(".jpg") || lowered.endsWith(".gif") || lowered.endsWith(".jpeg") || lowered.endsWith(".png")) { + isImage = true; + } + $scope.model.value = "[{\"file\": \"" + $scope.model.value + "\",\"isImage\":" + isImage +"}]"; } - - $scope.persistedFiles = _.map(angular.fromJson($scope.model.value), function (item) { - return item.file; - }); + + $scope.persistedFiles = angular.fromJson($scope.model.value); } else { $scope.persistedFiles = []; } - + + $scope.getThumbnail = function (file) { + var ext = file.file.substr(file.file.lastIndexOf('.')); + return file.file.substr(0, file.file.lastIndexOf('.')) + "_thumb" + ext; + }; $scope.clearFiles = false; @@ -30,24 +50,12 @@ define(['namespaceMgr'], function () { $scope.$watch("clearFiles", function(isCleared) { if (isCleared == true) { $scope.model.value = "{clearFiles: true}"; + clearFiles(); } else { $scope.model.value = ""; } }); - - //listen for the saving event - $scope.$on("contentSaving", function() { - //if clear files is selected then we'll clear all the files that are about - // to be uploaded - if ($scope.clearFiles) { - //TODO: There should be a better way! We don't want to have to know about the parent scope - //clear the parent files collection (we don't want to upload any!) - $scope.$parent.addFiles($scope.model.id, []); - //clear the current files - $scope.files = []; - } - }); //listen for when a file is selected $scope.$on("filesSelected", function (event, args) { diff --git a/src/Umbraco.Web.UI/App_Plugins/MyPackage/PropertyEditors/Views/FileUploadEditor.html b/src/Umbraco.Web.UI/App_Plugins/MyPackage/PropertyEditors/Views/FileUploadEditor.html index a4793fce02..419454f433 100644 --- a/src/Umbraco.Web.UI/App_Plugins/MyPackage/PropertyEditors/Views/FileUploadEditor.html +++ b/src/Umbraco.Web.UI/App_Plugins/MyPackage/PropertyEditors/Views/FileUploadEditor.html @@ -12,7 +12,12 @@

Current files

diff --git a/src/Umbraco.Web.UI/Umbraco.Web.UI.csproj b/src/Umbraco.Web.UI/Umbraco.Web.UI.csproj index 56a01e28ab..6ba2067bf3 100644 --- a/src/Umbraco.Web.UI/Umbraco.Web.UI.csproj +++ b/src/Umbraco.Web.UI/Umbraco.Web.UI.csproj @@ -2566,8 +2566,8 @@ - - + REM CD /D $(SolutionDir)Umbraco.Web.UI.Client\ +REM grunt.cmd build xcopy "$(ProjectDir)"..\packages\SqlServerCE.4.0.0.0\amd64\*.* "$(TargetDir)amd64\" /Y /F /E /D xcopy "$(ProjectDir)"..\packages\SqlServerCE.4.0.0.0\x86\*.* "$(TargetDir)x86\" /Y /F /E /D 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 3524f1371f..95eed5cee5 100644 --- a/src/Umbraco.Web.UI/umbraco/Views/common/dialogs/mediapicker.html +++ b/src/Umbraco.Web.UI/umbraco/Views/common/dialogs/mediapicker.html @@ -29,18 +29,25 @@
-