darkhelm/notifications-admin
1
0
Fork 0
mirror of https://github.com/GSA/notifications-admin.git synced 2026-05-04 08:01:34 -04:00
Code Issues Packages Projects Releases Wiki Activity

Add JS to embed email preview into page

Browse Source
This commit is contained in:
Tom Byers
2018-08-03 16:22:13 +01:00
parent c7610f359a
commit 386105954e
2 changed files with 44 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
app/assets/javascripts/emailPreviewPane.js Normal file
View File

@@ -0,0 +1,43 @@
(function () {
'use strict';
const root = this,
$ = this.jQuery;
let branding_type = $('.multiple-choice input[name="branding_type"]:checked');
let branding_style = $('.multiple-choice input[name="branding_style"]:checked');
if (!branding_type.length || !branding_style.length) { return; }
branding_type = branding_type.val();
branding_style = branding_style.val();
const $paneWrapper = $('<div class="column-full"></div>');
const $form = $('form');
const $previewPane = $('<iframe src="/_email?' +
buildQueryString(['branding_type', branding_type], ['branding_style', branding_style]) +
'" class="email-branding-preview"></iframe>');
function buildQueryString () {
return $.map(arguments, (val, idx) => encodeURI(val[0]) + '=' + encodeURI(val[1])).join('&');
}
function setPreviewPane (e) {
const $target = $(e.target);
if ($target.attr('name') == 'branding_type') {
branding_type = $target.val();
}
if ($target.attr('name') == 'branding_style') {
branding_style = $target.val();
}
$previewPane.attr('src', '/_email?' + buildQueryString(['branding_type', branding_type], ['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.find('button[type="submit"]').text('Save');
$('fieldset').on('change', 'input[name="branding_type"], input[name="branding_style"]', setPreviewPane);
})();

1
gulpfile.babel.js
View File

@@ -74,6 +74,7 @@ gulp.task('javascripts', () => gulp
paths.src + 'javascripts/preventDuplicateFormSubmissions.js',
paths.src + 'javascripts/fullscreenTable.js',
paths.src + 'javascripts/conditionalRadios.js',
paths.src + 'javascripts/emailPreviewPane.js',
paths.src + 'javascripts/main.js'
])
.pipe(plugins.prettyerror())