Merge pull request #572 from magento/514_content-snapshot-category-admin-page_refactor

#514: User sees content snapshot on Category Page in Admin Panel - refactoring

Author: omiroshnichenko

app/code/Magento/PageBuilder/view/adminhtml/web/js/config.js

@@ -21,6 +21,7 @@ define([
             $uploadArea: null,
             isShowImageUploadInstructions: true,
             isShowImageUploadOptions: false,
+            visibleControls: true,
             classes: {
                 dragging: 'dragging',
                 draggingInside: 'dragging-inside',
@@ -45,6 +46,9 @@ define([
                 or: $t('or'),
                 uploadImage: $t('Upload Image'),
                 uploadNewImage: $t('Upload New Image')
+            },
+            tracks: {
+                visibleControls: true
             }
         },
 

app/code/Magento/PageBuilder/view/adminhtml/web/js/content-type/banner/preview.js

@@ -57,7 +57,7 @@ define([
         initObservable: function () {
             this._super()
                 .observe('isComponentInitialized visiblePageBuilder wysiwygConfigData loading transition ' +
-                    'transitionOut');
+                    'transitionOut overlayMouseover');
 
             return this;
         },
@@ -100,10 +100,6 @@ define([
                     selector: this.stageSelector
                 }, this.disableDomObserver.bind(this));
 
-                if (!this.wysiwygConfigData()['pagebuilder_button']) {
-                    this.visiblePageBuilder(true);
-                }
-
                 if (!this.wysiwygConfigData()['pagebuilder_button'] ||
                     this.wysiwygConfigData()['pagebuilder_content_snapshot']) {
                     this.visiblePageBuilder(true);
@@ -153,34 +149,14 @@ define([
             }
         },
 
-        /**
-         * Overlay MouseOver
-         */
-        onOverlayMouseOver: function () {
-            if (!this.overlayMouseover && !$(this.overlaySelector).hasClass('_hover')) {
-                $(this.overlaySelector).addClass('_hover');
-            }
-            this.overlayMouseover = true;
-        },
-
-        /**
-         * Overlay MouseOut
-         */
-        onOverlayMouseOut: function () {
-            if (this.overlayMouseover && $(this.overlaySelector).hasClass('_hover')) {
-                $(this.overlaySelector).removeClass('_hover');
-            }
-            this.overlayMouseover = false;
-        },
-
         /**
          * Press Enter key on Overlay
          */
         onOverlayKeyDown: function (context, event) {
             if (event.which === 13 || event.keyCode === 13) {
                 this.pageBuilderEditButtonClick(context, event);
             }
-            
+
             return true;
         },
 
@@ -189,7 +165,7 @@ define([
          */
         toggleFullScreen: function () {
             events.trigger('stage:' + this.pageBuilder.id + ':toggleFullscreen', {
-                animate: false
+                animate: !!this.wysiwygConfigData()['pagebuilder_content_snapshot']
             });
         },