Merge pull request #52 from magento-obsessive-owls/MAGETWO-89880-slide-title

[CMS Team 1]  Slide Title

Author: raith-hamzah

app/code/Magento/PageBuilder/view/adminhtml/ui_component/pagebuilder_slide_form.xml

@@ -75,12 +75,14 @@
                 </select>
             </formElements>
         </field>
-        <field name="title" sortOrder="20" formElement="input">
+        <field name="slide_name" sortOrder="20" formElement="input">
             <settings>
-                <label translate="true">Slide Title</label>
+                <label translate="true">Slide Name</label>
                 <validation>
                     <rule name="validate-string" xsi:type="boolean">true</rule>
                 </validation>
+                <dataType>text</dataType>
+                <dataScope>slide_name</dataScope>
             </settings>
         </field>
         <field name="min_height" sortOrder="30" formElement="input">

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

@@ -10,9 +10,6 @@
         paddingLeft: 'calc(25% + ' + previewData.margins_and_padding().padding.left + 'px)',
         paddingRight: 'calc(25% + ' + previewData.margins_and_padding().padding.right + 'px)'}), event: { mouseover: onMouseOverWrapper, mouseout: onMouseOutWrapper }">
         <div class="pagebuilder-collage-overlay" data-bind="style: getOverlayColorStyle()">
-            <!-- ko if: previewData.title() -->
-            <h3 data-bind="text: previewData.title()"></h3>
-            <!-- /ko -->
             <div data-bind="css: {'pagebuilder-empty-slide': isContentEmpty()}, html: getContentHtml()"></div>
             <!-- ko if: previewData.show_button() !== "never_show" -->
                 <a type="button" class="pagebuilder-slide-button" data-bind="css: previewData.button_type(), attr: {'data-link-url': getHref()}, style: getButtonStyles()">

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

@@ -8,9 +8,6 @@
 <div class="pagebuilder-content-type pagebuilder-entity pagebuilder-entity-preview pagebuilder-slide" data-bind="event: { mouseover: onMouseOver, mouseout: onMouseOut }">
     <div data-bind="style: Object.assign(previewStyle(), {paddingRight: 'calc(50% + ' + previewData.margins_and_padding().padding.right + 'px)'}), event: { mouseover: onMouseOverWrapper, mouseout: onMouseOutWrapper }">
         <div class="pagebuilder-collage-overlay" data-bind="style: getOverlayColorStyle()">
-            <!-- ko if: previewData.title() -->
-            <h3 data-bind="text: previewData.title()"></h3>
-            <!-- /ko -->
             <div data-bind="css: {'pagebuilder-empty-slide': isContentEmpty()}, html: getContentHtml()"></div>
             <!-- ko if: previewData.show_button() !== "never_show" -->
             <a type="button" class="pagebuilder-slide-button" data-bind="css: previewData.button_type(), attr: {'data-link-url': getHref()}, style: getButtonStyles()">

app/code/Magento/PageBuilder/view/adminhtml/web/js/master-format/read/slide.js

@@ -8,9 +8,6 @@
 <div class="pagebuilder-content-type pagebuilder-entity pagebuilder-entity-preview pagebuilder-slide" data-bind="event: { mouseover: onMouseOver, mouseout: onMouseOut }">
     <div data-bind="style: Object.assign(previewStyle(), {paddingLeft: 'calc(50% + ' + previewData.margins_and_padding().padding.left + 'px)'}), event: { mouseover: onMouseOverWrapper, mouseout: onMouseOutWrapper }">
         <div class="pagebuilder-collage-overlay" data-bind="style: getOverlayColorStyle()">
-            <!-- ko if: previewData.title() -->
-            <h3 data-bind="text: previewData.title()"></h3>
-            <!-- /ko -->
             <div data-bind="css: {'pagebuilder-empty-slide': isContentEmpty()}, html: getContentHtml()"></div>
             <!-- ko if: previewData.show_button() !== "never_show" -->
                 <a type="button" class="pagebuilder-slide-button" data-bind="css: previewData.button_type(), attr: {'data-link-url': getHref()}, style: getButtonStyles()">

app/code/Magento/PageBuilder/view/adminhtml/web/template/content-type/slide/collage-centered/preview.html

@@ -10,9 +10,6 @@
         <div class="pagebuilder-slide-wrapper pagebuilder-mobile-only" data-bind="style: getSlideStyles('mobileImage')">
             <div class="pagebuilder-overlay pagebuilder-poster-overlay" data-bind="attr: getOverlayAttributes(), style: getOverlayStyles()">
                 <div class="pagebuilder-poster-content">
-                    <!-- ko if: getData().title -->
-                    <h3 data-bind="text: getData().title"></h3>
-                    <!-- /ko -->
                     <div data-bind="html: getContentHtml()"></div>
                     <!-- ko if: getData().show_button !== "never_show" -->
                     <button type="button" class="pagebuilder-slide-button" data-bind="text: getData().button_text, style: getButtonStyle(), css: getData().button_type"></button>
@@ -23,9 +20,6 @@ <h3 data-bind="text: getData().title"></h3>
         <div class="pagebuilder-slide-wrapper" data-bind="style: getSlideStyles('image'), css: {'pagebuilder-mobile-hidden': getData().mobile_image}">
             <div class="pagebuilder-overlay pagebuilder-poster-overlay" data-bind="attr: getOverlayAttributes(), style: getOverlayStyles()">
                 <div class="pagebuilder-poster-content">
-                    <!-- ko if: getData().title -->
-                    <h3 data-bind="text: getData().title"></h3>
-                    <!-- /ko -->
                     <div data-bind="html: getContentHtml()"></div>
                     <!-- ko if: getData().show_button !== "never_show" -->
                     <button type="button" class="pagebuilder-slide-button" data-bind="text: getData().button_text, style: getButtonStyle(), css: getData().button_type"></button>

app/code/Magento/PageBuilder/view/adminhtml/web/template/content-type/slide/collage-left/preview.html

@@ -5,13 +5,10 @@
  */
 -->
 
-<div class="pagebuilder-content-type pagebuilder-entity pagebuilder-entity-preview pagebuilder-slide" data-bind="event: { mouseover: onMouseOver, mouseout: onMouseOut }">
+<div class="pagebuilder-content-type pagebuilder-entity pagebuilder-entity-preview pagebuilder-slide" data-bind="event: { mouseover: onMouseOver, mouseout: onMouseOut }, attr: {'data-slide-name': previewData.slide_name()}">
     <div class="pagebuilder-slide-wrapper" data-bind="style: Object.assign(previewStyle(), getBackgroundStyles()), event: { mouseover: onMouseOverWrapper, mouseout: onMouseOutWrapper }">
         <div class="pagebuilder-poster-overlay" data-bind="style: getOverlayStyles()">
             <div class="pagebuilder-poster-content">
-                <!-- ko if: previewData.title() -->
-                <h3 data-bind="text: previewData.title()"></h3>
-                <!-- /ko -->
                 <div data-bind="html: getContentHtml(), css: {'pagebuilder-empty-slide': isContentEmpty()}"></div>
                 <!-- ko if: previewData.show_button() !== "never_show" -->
                 <a type="button" class="pagebuilder-slide-button" data-bind="css: previewData.button_type(), attr: {'data-link-url': getHref()}, style: getButtonStyles()">

app/code/Magento/PageBuilder/view/adminhtml/web/template/content-type/slide/collage-right/preview.html

@@ -19,8 +19,8 @@
                     <!-- ko template: getOptions().template --><!-- /ko -->
                 <!-- /ko -->
                 <a class="navigation-dot-anchor" href="#" data-bind="click: function () { $parent.navigateToSlide($index()); $parent.setFocusedSlide($index()); }"></a>
-                <!-- ko if: preview.previewData.title() !== "" -->
-                <span class="tooltip-content" role="tooltip" data-bind="text: preview.previewData.title()"></span>
+                <!-- ko if: preview.previewData.slide_name() !== "" -->
+                <span class="tooltip-content" role="tooltip" data-bind="text: preview.previewData.slide_name()"></span>
                 <!-- /ko -->
             </div>
         </div>