use infinite media picker in grid media picker

This commit is contained in:
Mads Rasmussen
2018-08-22 13:35:35 +02:00
parent 46dc0baf86
commit c165226688
2 changed files with 38 additions and 44 deletions

View File

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

View File

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