Adjust image cropper crops (#8557)

This commit is contained in:
Bjarne Fyrstenborg
2020-08-26 19:10:14 +02:00
committed by GitHub
parent 0320f40249
commit 636dcecb62
4 changed files with 56 additions and 48 deletions

View File

@@ -38,7 +38,6 @@ angular.module("umbraco").controller("Umbraco.PrevalueEditors.MultiValuesControl
$scope.add = function (evt) {
evt.preventDefault();
if ($scope.newItem) {
if (!_.contains($scope.model.value, $scope.newItem)) {
$scope.model.value.push({ value: $scope.newItem });
@@ -79,7 +78,7 @@ angular.module("umbraco").controller("Umbraco.PrevalueEditors.MultiValuesControl
if (event.keyCode == 13) {
$scope.add(event);
}
}
};
function getElementIndexByPrevalueText(value) {
for (var i = 0; i < $scope.model.value.length; i++) {

View File

@@ -1,7 +1,7 @@
<div class="umb-property-editor umb-prevalues-multivalues" ng-controller="Umbraco.PrevalueEditors.MultiValuesController">
<div class="control-group umb-prevalues-multivalues__add">
<div class="umb-prevalues-multivalues__left">
<input overlay-submit-on-enter="false" name="newItem" focus-when="{{focusOnNew}}" ng-keydown="createNew($event)" type="text" ng-model="newItem" val-highlight="{{hasError}}" />
<input type="text" name="newItem" focus-when="{{focusOnNew}}" ng-keydown="createNew($event)" ng-model="newItem" val-highlight="{{hasError}}" overlay-submit-on-enter="false" />
</div>
<div class="umb-prevalues-multivalues__right">
<button type="button" class="btn btn-info" ng-click="add($event)"><localize key="general_add">Add</localize></button>

View File

@@ -33,17 +33,16 @@ angular.module("umbraco").controller("Umbraco.PrevalueEditors.CropSizesControlle
$scope.change = function () {
// Listen to the change event and set focus 2 false
if($scope.setFocus){
if ($scope.setFocus) {
$scope.setFocus = false;
return;
}
}
};
$scope.add = function (evt) {
evt.preventDefault();
$scope.editMode = false;
$scope.setFocus = true;
if ($scope.newItem && $scope.newItem.alias &&
@@ -70,7 +69,17 @@ angular.module("umbraco").controller("Umbraco.PrevalueEditors.CropSizesControlle
$scope.hasError = true;
};
$scope.sortableOptions = {
axis: 'y'
}
$scope.createNew = function (event) {
if (event.keyCode == 13) {
$scope.add(event);
}
};
$scope.sortableOptions = {
axis: 'y',
containment: 'parent',
cursor: 'move',
tolerance: 'pointer'
};
});

View File

@@ -4,55 +4,55 @@
<div class="umb-cropsizes__input-wrap">
<label for="addcropalias"><localize key="general_alias">Alias</localize></label>
<input
id="addcropalias"
name="newItem.alias"
type="text"
ng-model="newItem.alias"
class="umb-cropsizes__input"
val-highlight="{{hasError}}"
localize="placeholder"
placeholder="@general_alias"
focus-when="{{setFocus}}"
ng-change="change()"
/>
<input type="text"
id="addcropalias"
name="newItem.alias"
ng-model="newItem.alias"
class="umb-cropsizes__input"
val-highlight="{{hasError}}"
localize="placeholder"
placeholder="@general_alias"
focus-when="{{setFocus}}"
ng-change="change()"
ng-keydown="createNew($event)"
overlay-submit-on-enter="false" />
</div>
<div class="umb-cropsizes__input-wrap umb-cropsizes__input-wrap--narrow">
<label for="addcropwidth"><localize key="general_width">Width</localize></label>
<input
name="newItem.width"
type="number"
localize="placeholder"
placeholder="@general_width"
ng-model="newItem.width"
class="umb-cropsizes__input"
val-highlight="{{hasError}}"
id="addcropwidth"
min="0"
pattern="[0-9]*"
/>
<input type="number"
name="newItem.width"
localize="placeholder"
placeholder="@general_width"
ng-model="newItem.width"
class="umb-cropsizes__input"
val-highlight="{{hasError}}"
id="addcropwidth"
min="0"
pattern="[0-9]*"
ng-keydown="createNew($event)"
overlay-submit-on-enter="false" />
</div>
<div class="umb-cropsizes__input-wrap umb-cropsizes__input-wrap--narrow">
<label for="addcropheight"><localize key="general_height">Height</localize></label>
<input
name="newItem.height"
type="number"
localize="placeholder"
placeholder="@general_height"
ng-model="newItem.height"
class="umb-cropsizes__input"
val-highlight="{{hasError}}"
id="addcropheight"
min="0"
pattern="[0-9]*"
/>
<input type="number"
name="newItem.height"
localize="placeholder"
placeholder="@general_height"
ng-model="newItem.height"
class="umb-cropsizes__input"
val-highlight="{{hasError}}"
id="addcropheight"
min="0"
pattern="[0-9]*"
ng-keydown="createNew($event)"
overlay-submit-on-enter="false" />
</div>
<div class="umb-cropsizes__controls">
<button class="btn btn-info add" ng-hide="editMode" ng-click="add($event)"><localize key="general_add">Add</localize></button>
<button class="btn btn-info add" ng-show="editMode" ng-click="add($event)"><localize key="general_update">Update</localize></button>
<button type="button" class="btn btn-info add" ng-hide="editMode" ng-click="add($event)"><localize key="general_add">Add</localize></button>
<button type="button" class="btn btn-info add" ng-show="editMode" ng-click="add($event)"><localize key="general_update">Update</localize></button>
<button type="button" class="btn btn-link" ng-show="editMode" ng-click="cancel($event)"><localize key="general_cancel">Cancel</localize></button>
</div>
@@ -60,7 +60,7 @@
<div ui-sortable="sortableOptions" class="umb-cropsizes__sortable" ng-model="model.value">
<div class="control-group umb-prevalues-multivalues__listitem" ng-repeat="item in model.value">
<i class="icon icon-navigation handle"></i>
<i class="icon icon-navigation handle" aria-hidden="true"></i>
<div class="umb-prevalues-multivalues__left">
<p><span>{{item.alias}}</span> <small>({{item.width}}px &times; {{item.height}}px)</small></p>
</div>