Change preview pane JS to preview letters as well as emails

This commit is contained in:
Katie Smith
2019-02-14 14:06:31 +00:00
parent 83c10149bd
commit 44781e3b69
3 changed files with 6 additions and 7 deletions

View File

@@ -13,9 +13,8 @@
const $paneWrapper = $('<div class="column-full"></div>');
const $form = $('form');
const $previewPane = $('<iframe src="/_email?' +
buildQueryString(['branding_style', branding_style]) +
'" class="branding-preview"></iframe>');
const previewType = $form.data('previewType');
const $previewPane = $(`<iframe src="/_${previewType}?${buildQueryString(['branding_style', branding_style])}" class="branding-preview"></iframe>`);
function buildQueryString () {
return $.map(arguments, (val, idx) => encodeURI(val[0]) + '=' + encodeURI(val[1])).join('&');
@@ -26,12 +25,12 @@
if ($target.attr('name') == 'branding_style') {
branding_style = $target.val();
}
$previewPane.attr('src', '/_email?' + buildQueryString(['branding_style', branding_style]));
$previewPane.attr('src', `/_${previewType}?${buildQueryString(['branding_style', branding_style])}`);
}
$paneWrapper.append($previewPane);
$form.find('.grid-row').eq(0).prepend($paneWrapper);
$form.attr('action', location.pathname.replace(/set-email-branding$/, 'preview-email-branding'));
$form.attr('action', location.pathname.replace(new RegExp(`set-${previewType}-branding$`), `preview-${previewType}-branding`));
$form.find('button[type="submit"]').text('Save');
$('fieldset').on('change', 'input[name="branding_style"]', setPreviewPane);

View File

@@ -11,7 +11,7 @@
{% block maincolumn_content %}
<h1 class="heading-large">Set email branding</h1>
{% call form_wrapper() %}
{% call form_wrapper(data_kwargs={'preview-type': 'email'}) %}
<div class="grid-row">
<div class="column-full preview-pane">
</div>

View File

@@ -74,7 +74,7 @@ gulp.task('javascripts', () => gulp
paths.src + 'javascripts/errorTracking.js',
paths.src + 'javascripts/preventDuplicateFormSubmissions.js',
paths.src + 'javascripts/fullscreenTable.js',
paths.src + 'javascripts/emailPreviewPane.js',
paths.src + 'javascripts/previewPane.js',
paths.src + 'javascripts/colourPreview.js',
paths.src + 'javascripts/templateFolderForm.js',
paths.src + 'javascripts/main.js'