Add classes on item dragging, fix local storage upload (#4334)

superdesk · Oct 9, 2023 · 8d3fee8 · 8d3fee8
1 parent 24e7cdc
commit 8d3fee8
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 2 deletions.
diff --git a/scripts/apps/authoring/authoring/directives/ItemCarouselDirective.ts b/scripts/apps/authoring/authoring/directives/ItemCarouselDirective.ts
@@ -186,6 +186,16 @@ export function ItemCarouselDirective(notify, relationsService) {
                 carousel.trigger('to.owl.carousel', [index]);
             };
 
+            const addDragOverClass = () => {
+                elem.find('figure').addClass('dragover');
+                elem.find('button.item-association').addClass('dragover');
+            };
+
+            const removeDragOverClass = () => {
+                elem.find('figure').removeClass('dragover');
+                elem.find('button.item-association').removeClass('dragover');
+            };
+
             function canUploadItems(uploadsCount: number = 0): boolean {
                 const mediaItemsForCurrentField = getAssociationsByFieldId(scope.item.associations, scope.field._id);
                 const currentUploads = mediaItemsForCurrentField.length;
@@ -208,6 +218,11 @@ export function ItemCarouselDirective(notify, relationsService) {
                 elem.on('dragover', (event) => {
                     event.preventDefault();
                     event.stopPropagation();
+                    addDragOverClass();
+                });
+
+                elem.on('dragleave', () => {
+                    removeDragOverClass();
                 });
 
                 elem.on('drop dragdrop', (event) => {
@@ -219,9 +234,13 @@ export function ItemCarouselDirective(notify, relationsService) {
                     event.stopPropagation();
 
                     const type: string = getSuperdeskType(event, false);
-                    const item: IArticle = angular.fromJson(event.originalEvent.dataTransfer.getData(type));
+
+                    const jsonData = event.originalEvent.dataTransfer.getData(type);
+                    const item: IArticle = angular.fromJson(jsonData !== '' ? jsonData : '{}');
+
                     const isWorkflowAllowed: boolean = relationsService.itemHasAllowedStatus(item, scope.field);
 
+                    removeDragOverClass();
                     if (!isWorkflowAllowed) {
                         notify.error(gettext(
                             'The following status is not allowed in this field: {{status}}',

diff --git a/scripts/apps/authoring/views/item-carousel.html b/scripts/apps/authoring/views/item-carousel.html
@@ -1,4 +1,7 @@
-<button tabindex="{{tabindex}}" class="item-association" ng-if="!carouselItems.length"
+<button
+    tabindex="{{tabindex}}"
+    class="item-association"
+    ng-if="!carouselItems.length"
     ng-class="{'item-association--preview': item[item.fieldId], 'item-association--loading': loading}"
     ng-click="associations.isMediaEditable() && !item[item.fieldId] && upload()"
     ng-disabled="!editable"