Add tooltip to editor previw

[MAILPOET-976]

assets/css/src/newsletter_editor/common.styl

@@ -179,6 +179,10 @@ select.mailpoet_font-size
   width: 100%
   box-sizing: border-box
 
+.tooltip-help-send-preview
+  position: absolute
+  right: 15px
+
 .mailpoet_button_primary
   border-color: $button-primary-border-color
   background-color: $button-primary-background-color

assets/js/src/newsletter_editor/components/sidebar.js

@@ -369,6 +369,11 @@ define([
       sidebarView = new SidebarView();
 
     App._appView.showChildView('sidebarRegion', sidebarView);
+
+    MailPoet.helpTooltip.show(document.getElementById("tooltip-send-preview"), {
+      tooltipId: "tooltip-editor-send-preview",
+      tooltip: MailPoet.I18n.t('helpTooltipSendPreview'),
+    });
   });
 
   return Module;

views/newsletter/editor.html

@@ -321,6 +321,9 @@
 <% endblock %>
 
 <% block translations %>
+  <% set helpTooltipSendPreview = __("Didn't receive the test email? Read our [link]quick guide[/link] to sending issues. <br><br>A MailPoet logo will appear in the footer of all emails sent with the free version of MailPoet. <br><br>Links in footer don't work in email previews!")
+  |replaceLinkTags('http://beta.docs.mailpoet.com/article/146-my-newsletters-are-not-being-received', {'target' : '_blank'})
+  |escape('js') %>'
   <%= localize({
     'failedToFetchAvailablePosts': __('Failed to fetch available posts'),
     'failedToFetchRenderedPosts': __('Failed to fetch rendered posts'),
@@ -329,6 +332,7 @@
     'newsletterPreviewEmailMissing': __('Enter an email address to send the preview newsletter to.'),
     'newsletterPreviewSent': __('Your test email has been sent!'),
     'templateNameMissing': __('Please add a template name'),
+    'helpTooltipSendPreview': helpTooltipSendPreview,
     'templateDescriptionMissing': __('Please add a template description'),
     'templateSaved': __('Template has been saved.'),
     'templateSaveFailed': __('Template has not been saved, please try again'),

views/newsletter/templates/components/sidebar/preview.hbs

@@ -12,6 +12,7 @@
 
       <div class="mailpoet_form_field">
         <input type="submit" id="mailpoet_send_preview" class="button button-primary mailpoet_button_full" value="<%= __('Send preview') %>" />
+        <span id="tooltip-send-preview" class="tooltip-help-send-preview"></span>
       </div>
     </ofmr>