diff --git a/src/Umbraco.Web.UI.Client/src/common/resources/media.resource.js b/src/Umbraco.Web.UI.Client/src/common/resources/media.resource.js
index 87e90fbe40..0362012189 100644
--- a/src/Umbraco.Web.UI.Client/src/common/resources/media.resource.js
+++ b/src/Umbraco.Web.UI.Client/src/common/resources/media.resource.js
@@ -57,7 +57,27 @@ function mediaResource($q, $http, umbDataFormatter, umbRequestHelper) {
}),
'Failed to sort content');
},
-
+ /**
+ * @ngdoc method
+ * @name umbraco.resources.mediaResource#getById
+ * @methodOf umbraco.resources.mediaResource
+ *
+ * @description
+ * Gets a media item with a given id
+ *
+ * ##usage
+ *
+ * mediaResource.getById(1234)
+ * .then(function(media) {
+ * var myMedia = media;
+ * alert('its here!');
+ * });
+ *
+ *
+ * @param {Int} id id of media item to return
+ * @returns {Promise} resourcePromise object containing the media item.
+ *
+ */
getById: function (id) {
return umbRequestHelper.resourcePromise(
@@ -68,9 +88,75 @@ function mediaResource($q, $http, umbDataFormatter, umbRequestHelper) {
[{ id: id }])),
'Failed to retreive data for media id ' + id);
},
+ /**
+ * @ngdoc method
+ * @name umbraco.resources.mediaResource#getByIds
+ * @methodOf umbraco.resources.mediaResource
+ *
+ * @description
+ * Gets an array of media items, given a collection of ids
+ *
+ * ##usage
+ *
+ * mediaResource.getByIds( [1234,2526,28262])
+ * .then(function(mediaArray) {
+ * var myDoc = contentArray;
+ * alert('they are here!');
+ * });
+ *
+ *
+ * @param {Array} ids ids of media items to return as an array
+ * @returns {Promise} resourcePromise object containing the media items array.
+ *
+ */
+ getByIds: function (ids) {
+
+ var idQuery = "";
+ _.each(ids, function(item) {
+ idQuery += "ids=" + item + "&";
+ });
- /** returns an empty content object which can be persistent on the content service
- requires the parent id and the alias of the content type to base the scaffold on */
+ return umbRequestHelper.resourcePromise(
+ $http.get(
+ umbRequestHelper.getApiUrl(
+ "mediaApiBaseUrl",
+ "GetByIds",
+ idQuery)),
+ 'Failed to retreive data for media id ' + id);
+ },
+
+ /**
+ * @ngdoc method
+ * @name umbraco.resources.mediaResource#getScaffold
+ * @methodOf umbraco.resources.mediaResource
+ *
+ * @description
+ * Returns a scaffold of an empty media item, given the id of the media item to place it underneath and the media type alias.
+ *
+ * - Parent Id must be provided so umbraco knows where to store the media
+ * - Media Type alias must be provided so umbraco knows which properties to put on the media scaffold
+ *
+ * The scaffold is used to build editors for media that has not yet been populated with data.
+ *
+ * ##usage
+ *
+ * mediaResource.getScaffold(1234, 'folder')
+ * .then(function(scaffold) {
+ * var myDoc = scaffold;
+ * myDoc.name = "My new media item";
+ *
+ * mediaResource.save(myDoc, true)
+ * .then(function(media){
+ * alert("Retrieved, updated and saved again");
+ * });
+ * });
+ *
+ *
+ * @param {Int} parentId id of media item to return
+ * @param {String} alias mediatype alias to base the scaffold on
+ * @returns {Promise} resourcePromise object containing the media scaffold.
+ *
+ */
getScaffold: function (parentId, alias) {
return umbRequestHelper.resourcePromise(
diff --git a/src/Umbraco.Web.UI.Client/src/common/services/util.service.js b/src/Umbraco.Web.UI.Client/src/common/services/util.service.js
index 8cfa220a56..1f3b3c1d59 100644
--- a/src/Umbraco.Web.UI.Client/src/common/services/util.service.js
+++ b/src/Umbraco.Web.UI.Client/src/common/services/util.service.js
@@ -78,8 +78,8 @@ function imageHelper() {
return {
/** Returns the actual image path associated with the image property if there is one */
getImagePropertyVaue: function(options) {
- if (!options && !options.imageModel && !options.scope) {
- throw "The options objet does not contain the required parameters: imageModel, scope";
+ if (!options && !options.imageModel) {
+ throw "The options objet does not contain the required parameters: imageModel";
}
if (options.imageModel.contentTypeAlias.toLowerCase() === "image") {
var imageProp = _.find(options.imageModel.properties, function (item) {
@@ -105,8 +105,8 @@ function imageHelper() {
/** 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 && !options.imageModel) {
+ throw "The options objet does not contain the required parameters: imageModel";
}
var imagePropVal = this.getImagePropertyVaue(options);
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/mediapicker/mediapicker.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/mediapicker/mediapicker.controller.js
index 92a152ac08..30d0f89e40 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/mediapicker/mediapicker.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/mediapicker/mediapicker.controller.js
@@ -1,15 +1,44 @@
//this controller simply tells the dialogs service to open a mediaPicker window
//with a specified callback, this callback will receive an object with a selection on it
angular.module('umbraco').controller("Umbraco.Editors.MediaPickerController",
- function($rootScope, $scope, dialogService, $log){
+ function($rootScope, $scope, dialogService, mediaResource, imageHelper, $log){
//
//$( "#draggable" ).draggable();
-
- $scope.openMediaPicker =function(value){
- var d = dialogService.mediaPicker({scope: $scope, callback: populate});
- };
- function populate(data){
- $scope.model.value = data.selection;
- }
-});
+
+ //saved value contains a list of images with their coordinates a Dot coordinates
+ //this will be $scope.model.value...
+ var sampleData = [
+ {id: 1234, coordinates: {x:123,y:345}, center: {x:123,y:12}},
+ {id: 2234, coordinates: {x:123,y:345}, center: {x:123,y:12}},
+ {id: 2344, coordinates: {x:123,y:345}, center: {x:123,y:12}},
+ ];
+
+ $scope.images = sampleData;
+ $($scope.images).each(function(i,img){
+ mediaResource.getById(img.id).then(function(media){
+ img.media = media;
+
+ //shortcuts
+ img.file = imageHelper.getImagePropertyVaue({imageModel: media});
+ img.thumbnail = imageHelper.getThumbnailFromPath(img.file});
+ });
+ });
+
+ //List of crops with name and size
+ $scope.config = {
+ crops: [
+ {name: "default", x:300,y:400},
+ {name: "header", x:23,y:40},
+ {name: "tiny", x:10,y:10}
+ ]};
+
+
+ $scope.openMediaPicker =function(value){
+ var d = dialogService.mediaPicker({scope: $scope, callback: populate});
+ };
+
+ function populate(data){
+ $scope.model.value = data.selection;
+ }
+ });