mirror of
https://github.com/GSA/notifications-admin.git
synced 2026-02-06 11:23:48 -05:00
4e47b62aa3
The previewPane JS used selectors that targeted the old form of radios HTML. The JS tests also contained selectors like this and fragments of HTML, used for fixtures, modelled on the old radios HTML.
37 lines
1.3 KiB
JavaScript
37 lines
1.3 KiB
JavaScript
(function (global) {
|
|
|
|
'use strict';
|
|
|
|
$ = global.jQuery;
|
|
|
|
let branding_style = $('.govuk-radios__item input[name="branding_style"]:checked');
|
|
|
|
if (!branding_style.length) { return; }
|
|
|
|
branding_style = branding_style.val();
|
|
|
|
const $paneWrapper = $('<div class="govuk-grid-column-full"></div>');
|
|
const $form = $('form');
|
|
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('&');
|
|
}
|
|
|
|
function setPreviewPane (e) {
|
|
const $target = $(e.target);
|
|
if ($target.attr('name') == 'branding_style') {
|
|
branding_style = $target.val();
|
|
}
|
|
$previewPane.attr('src', `/_${previewType}?${buildQueryString(['branding_style', branding_style])}`);
|
|
}
|
|
|
|
$paneWrapper.append($previewPane);
|
|
$form.find('.govuk-grid-row').eq(0).prepend($paneWrapper);
|
|
$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);
|
|
})(window);
|