yv01p/Umbraco-CMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Started working on the media picker config

Browse Source
This commit is contained in:
Per Ploug Krogslund
2013-08-28 21:30:22 +02:00
parent c6211c2aab
commit 74339f9a55
3 changed files with 131 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

92
src/Umbraco.Web.UI.Client/src/common/resources/media.resource.js
View File

@@ -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
* <pre>
* mediaResource.getById(1234)
* .then(function(media) {
* var myMedia = media;
* alert('its here!');
* });
* </pre>
*
* @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
* <pre>
* mediaResource.getByIds( [1234,2526,28262])
* .then(function(mediaArray) {
* var myDoc = contentArray;
* alert('they are here!');
* });
* </pre>
*
* @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
* <pre>
* 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");
* });
* });
* </pre>
*
* @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(

8
src/Umbraco.Web.UI.Client/src/common/services/util.service.js
View File

@@ -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);

47
src/Umbraco.Web.UI.Client/src/views/propertyeditors/mediapicker/mediapicker.controller.js
View File

@@ -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;
}
});