From 8852f33f035ed28c7d4f4139c0ee432ad3dd479c Mon Sep 17 00:00:00 2001
From: witzig <git.witzig@icloud.com>
Date: Mon, 20 Mar 2017 22:32:32 +0100
Subject: [PATCH] Added note about MJML usage

---
 routes/forms.js            | 57 ++++++++++++++++++++++++++------------
 views/lists/forms/edit.hbs | 19 ++++++-------
 2 files changed, 47 insertions(+), 29 deletions(-)

diff --git a/routes/forms.js b/routes/forms.js
index ebc42d16..17c5e896 100644
--- a/routes/forms.js
+++ b/routes/forms.js
@@ -133,83 +133,104 @@ router.get('/:list/edit/:form', passport.csrfProtection, (req, res) => {
                     fieldsHiddenOnManage = helpers.filterCustomFields(customFields, form.fieldsShownOnManage, 'exclude');
                 }
 
+                let helpEmailText = _('The plaintext version for this email');
+                let helpMjmlBase = _('Custom forms use MJML for formatting');
+                let helpMjmlDocLink = _('See the MJML documentation <a class="mjml-documentation">here</a>');
+                let helpMjmlGeneral = helpMjmlBase + ' ' + helpMjmlDocLink;
+
                 let templateOptgroups = [
                     {
-                        label: 'General',
+                        label: _('General'),
                         opts: [{
                             name: 'layout',
                             label: _('Layout'),
                             type: 'mjml',
+                            help: helpMjmlGeneral,
                             isLayout: true
                         }, {
                             name: 'form_input_style',
                             label: _('Form Input Style'),
-                            type: 'css'
+                            type: 'css',
+                            help: _('This CSS stylesheet defines the appearance of form input elements and alerts')
                         }]
                     }, {
                         label: _('Subscribe'),
                         opts: [{
                             name: 'web_subscribe',
                             label: _('Web - Subscribe'),
-                            type: 'mjml'
+                            type: 'mjml',
+                            help: helpMjmlGeneral
                         }, {
                             name: 'web_confirm_notice',
                             label: _('Web - Confirm Notice'),
-                            type: 'mjml'
+                            type: 'mjml',
+                            help: helpMjmlGeneral
                         }, {
                             name: 'mail_confirm_html',
                             label: _('Mail - Confirm Subscription (MJML)'),
-                            type: 'mjml'
+                            type: 'mjml',
+                            help: helpMjmlGeneral
                         }, {
                             name: 'mail_confirm_text',
                             label: _('Mail - Confirm Subscription (Text)'),
-                            type: 'text'
+                            type: 'text',
+                            help: helpEmailText
                         }, {
                             name: 'web_subscribed',
                             label: _('Web - Subscribed Notice'),
-                            type: 'mjml'
+                            type: 'mjml',
+                            help: helpMjmlGeneral
                         }, {
                             name: 'mail_subscription_confirmed_html',
                             label: _('Mail - Subscription Confirmed (MJML)'),
-                            type: 'mjml'
+                            type: 'mjml',
+                            help: helpMjmlGeneral
                         }, {
                             name: 'mail_subscription_confirmed_text',
                             label: _('Mail - Subscription Confirmed (Text)'),
-                            type: 'text'
+                            type: 'text',
+                            help: helpEmailText
                         }]
                     }, {
-                        label: 'Manage',
+                        label: _('Manage'),
                         opts: [{
                             name: 'web_manage',
                             label: _('Web - Manage Preferences'),
-                            type: 'mjml'
+                            type: 'mjml',
+                            help: helpMjmlGeneral
                         }, {
                             name: 'web_manage_address',
                             label: _('Web - Manage Address'),
-                            type: 'mjml'
+                            type: 'mjml',
+                            help: helpMjmlGeneral
                         }, {
                             name: 'web_updated_notice',
                             label: _('Web - Updated Notice'),
-                            type: 'mjml'
+                            type: 'mjml',
+                            help: helpMjmlGeneral
                         }]
                     }, {
-                        label: 'Unsubscribe',
+                        label: _('Unsubscribe'),
                         opts: [{
                             name: 'web_unsubscribe',
                             label: _('Web - Unsubscribe'),
-                            type: 'mjml'
+                            type: 'mjml',
+                            help: helpMjmlGeneral
                         }, {
                             name: 'web_unsubscribe_notice',
                             label: _('Web - Unsubscribe Notice'),
-                            type: 'mjml'
+                            type: 'mjml',
+                            help: helpMjmlGeneral
                         }, {
                             name: 'mail_unsubscribe_confirmed_html',
                             label: _('Mail - Unsubscribe Confirmed (MJML)'),
-                            type: 'mjml'
+                            type: 'mjml',
+                            help: helpMjmlGeneral
                         }, {
                             name: 'mail_unsubscribe_confirmed_text',
                             label: _('Mail - Unsubscribe Confirmed (Text)'),
-                            type: 'text'
+                            type: 'text',
+                            help: helpEmailText
                         }]
                     }
                 ];
diff --git a/views/lists/forms/edit.hbs b/views/lists/forms/edit.hbs
index c46a312f..0ee5acdf 100644
--- a/views/lists/forms/edit.hbs
+++ b/views/lists/forms/edit.hbs
@@ -73,7 +73,6 @@
             <ul class="nav nav-tabs" role="tablist">
                 <li role="presentation" class="active"><a href="#templates" aria-controls="templates" role="tab" data-toggle="tab">{{#translate}}Templates{{/translate}}</a></li>
                 <li role="presentation"><a href="#fields" aria-controls="fields" role="tab" data-toggle="tab">{{#translate}}Fields{{/translate}}</a></li>
-                <li role="presentation"><a href="#help" aria-controls="help" role="tab" data-toggle="tab">{{#translate}}Help{{/translate}}</a></li>
             </ul>
         </div>
     </div>
@@ -121,6 +120,9 @@
                 {{#each opts}}
                     <div class="form-group template {{name}}" {{#unless isLayout}}style="display: none;"{{/unless}}>
                         <div class="col-sm-offset-2 col-sm-10">
+                            <div class="help-block" style="margin-top: -8px;">
+                                <small>{{#if help}}{{{help}}}{{else}}&nbsp;{{/if}}</small>
+                            </div>
                             <div class="code-editor-{{type}}" style="height: 700px; border: 1px solid #ccc;"></div>
                             <input type="hidden" name="{{name}}" value="{{value}}">
                         </div>
@@ -238,16 +240,6 @@
             </div>
         </div>
 
-        <div role="tabpanel" class="tab-pane" id="help">
-            <div class="form-group">
-                <div class="col-sm-offset-2 col-sm-10">
-                    <p>
-                        {{#translate}}The MJML Documentation can be found <a href="https://mjml.io/documentation/" rel="noreferrer" target="_blank">here</a>.{{/translate}}
-                    </p>
-                </div>
-            </div>
-        </div>
-
     </div><!-- end .tab-content -->
 
     <hr>
@@ -282,5 +274,10 @@
             Cookies.set('tmpl', $(this).val(), { expires: 7, path: '' });
         });
 
+        $('a.mjml-documentation')
+            .attr('href', 'https://mjml.io/documentation/')
+            .attr('target', '_blank')
+            .attr('rel', 'noreferrer')
+
     });
 </script>