From f397ab352bf28a3dd955f3a02b397f2c9c121f29 Mon Sep 17 00:00:00 2001 From: Guy Sartorelli Date: Wed, 25 Jan 2023 10:51:04 +1300 Subject: [PATCH] ENH Prepare correct js/css structure to use webpack --- client/dist/js/LeftAndMain_Subsites.js | 136 +++++++++++++++++ client/dist/js/SubsitesTreeDropdownField.js | 36 +++++ .../styles}/LeftAndMain_Subsites.css | 0 client/javascript/LeftAndMain_Subsites.js | 141 ------------------ .../javascript/SubsitesTreeDropdownField.js | 34 ----- client/javascript/VirtualPage_Subsites.js | 0 src/Extensions/LeftAndMainSubsites.php | 7 +- src/Forms/SubsitesTreeDropdownField.php | 2 +- 8 files changed, 176 insertions(+), 180 deletions(-) create mode 100644 client/dist/js/LeftAndMain_Subsites.js create mode 100644 client/dist/js/SubsitesTreeDropdownField.js rename client/{css => dist/styles}/LeftAndMain_Subsites.css (100%) delete mode 100644 client/javascript/LeftAndMain_Subsites.js delete mode 100644 client/javascript/SubsitesTreeDropdownField.js delete mode 100644 client/javascript/VirtualPage_Subsites.js diff --git a/client/dist/js/LeftAndMain_Subsites.js b/client/dist/js/LeftAndMain_Subsites.js new file mode 100644 index 0000000..c0ee6b5 --- /dev/null +++ b/client/dist/js/LeftAndMain_Subsites.js @@ -0,0 +1,136 @@ +/* jslint browser: true, nomen: true */ +/* global $, window, jQuery */ +(function ($) { + // eslint-disable-next-line no-shadow + $.entwine('ss', ($) => { + $('#SubsitesSelect').entwine({ + onadd() { + this.on('change', function () { + window.location.search = $.query.set('SubsiteID', $(this).val()); + }); + } + }); + + /* + * Reload subsites dropdown when links are processed + */ + $('.cms-container .cms-menu-list li a').entwine({ + onclick(e) { + $('.cms-container').loadFragment('admin/subsite_xhr', 'SubsiteList'); + this._super(e); + } + }); + + /* + * Reload subsites dropdown when the admin area reloads (for deleting sites) + */ + $('.cms-container .SubsiteAdmin .cms-edit-form fieldset.ss-gridfield').entwine({ + onreload(e) { + $('.cms-container').loadFragment('admin/subsite_xhr', 'SubsiteList'); + this._super(e); + } + }); + + /* + * Reload subsites dropdown when subsites are added or names are modified + */ + $('.cms-container .tab.subsite-model').entwine({ + onadd(e) { + $('.cms-container').loadFragment('admin/subsite_xhr', 'SubsiteList'); + this._super(e); + } + }); + + // Subsite tab of Group editor + $('#Form_ItemEditForm_AccessAllSubsites').entwine({ + /** + * Constructor: onmatch + */ + onmatch() { + this.showHideSubsiteList(); + + const ref = this; + $('#Form_ItemEditForm_AccessAllSubsites input').change(() => { + ref.showHideSubsiteList(); + }); + }, + + showHideSubsiteList() { + $('#Form_ItemEditForm_Subsites').parent().parent().css('display', ($('#Form_ItemEditForm_AccessAllSubsites_1').is(':checked') ? 'none' : '')); + } + }); + + $('.cms-edit-form').entwine({ + /** + * TODO: Fix with Entwine API extension. See https://github.com/silverstripe/silverstripe-subsites/pull/125 + */ + getChangeTrackerOptions() { + // Figure out if we're still returning the default value + const isDefault = (this.entwineData('ChangeTrackerOptions') === undefined); + // Get the current options + let opts = this._super(); + + if (isDefault) { + // If it is the default then... + // clone the object (so we don't modify the original), + opts = $.extend({}, opts); + // modify it, + opts.ignoreFieldSelector += ', input[name=IsSubsite]'; + // then set the clone as the value on this element + // (so next call to this method gets this same clone) + this.setChangeTrackerOptions(opts); + } + + return opts; + } + }); + + $('.cms-edit-form input[name=action_copytosubsite]').entwine({ + onclick(e) { + const form = this.closest('form'); + form.trigger('submit', [this]); + } + }); + }); + + // eslint-disable-next-line no-shadow + $.entwine('ss.preview', ($) => { + $('.cms-preview').entwine({ + + /** + * Update links and forms with GET/POST SubsiteID param, so we remaing on the current subsite. + * The initial link for the iframe comes from SiteTreeSubsites::updatePreviewLink. + * + * This is done so we can use the CMS domain for displaying previews so we prevent single-origin + * violations and SSL cert problems that come up when iframing content from a different URL. + */ + onafterIframeAdjustedForPreview(event, doc) { + const subsiteId = $(doc).find('meta[name=x-subsite-id]').attr('content'); + + if (!subsiteId) { + return; + } + + // Inject the SubsiteID into internal links. + $(doc).find('a').each(function () { + const href = $(this).attr('href'); + + if (typeof href !== 'undefined' && !href.match(/^http:\/\//)) { + $(this).attr('href', $.path.addSearchParams(href, { + SubsiteID: subsiteId + })); + } + }); + + // Inject the SubsiteID as a hidden input into all forms submitting to the local site. + $(doc).find('form').each(function () { + const action = $(this).attr('action'); + + if (typeof action !== 'undefined' && !action.match(/^http:\/\//)) { + $(this).append(``); + } + }); + } + }); + }); +}(jQuery)); diff --git a/client/dist/js/SubsitesTreeDropdownField.js b/client/dist/js/SubsitesTreeDropdownField.js new file mode 100644 index 0000000..cddf2d5 --- /dev/null +++ b/client/dist/js/SubsitesTreeDropdownField.js @@ -0,0 +1,36 @@ +/* global jQuery */ +(function ($) { + // eslint-disable-next-line no-shadow + $.entwine('ss', ($) => { + /** + * Choose a subsite from which to select pages. + * Needs to clear tree dropdowns in case selection is changed. + */ + $('select.subsitestreedropdownfield-chooser').entwine({ + onchange() { + // TODO Data binding between two fields + const name = this.attr('name').replace('_SubsiteID', ''); + const field = $(`#Form_EditForm_${name}`).first(); + field.setValue(0); + field.refresh(); + field.trigger('change'); + } + }); + + /** + * Add selected subsite from separate dropdown to the request parameters + * before asking for the tree. + */ + $('.TreeDropdownField.SubsitesTreeDropdownField').entwine({ + getAttributes() { + const fieldName = this.attr('id').replace('Form_EditForm_', ''); + const subsiteID = $(`#Form_EditForm_${fieldName}_SubsiteID option:selected`).val(); + + const attributes = this._super(); + attributes.data.urlTree += `?${fieldName}_SubsiteID=${subsiteID}`; + attributes.data.cacheKey = `${attributes.data.cacheKey.substring(0, 19)}_${subsiteID}`; + return attributes; + } + }); + }); +}(jQuery)); diff --git a/client/css/LeftAndMain_Subsites.css b/client/dist/styles/LeftAndMain_Subsites.css similarity index 100% rename from client/css/LeftAndMain_Subsites.css rename to client/dist/styles/LeftAndMain_Subsites.css diff --git a/client/javascript/LeftAndMain_Subsites.js b/client/javascript/LeftAndMain_Subsites.js deleted file mode 100644 index 8dd2b24..0000000 --- a/client/javascript/LeftAndMain_Subsites.js +++ /dev/null @@ -1,141 +0,0 @@ -/*jslint browser: true, nomen: true*/ -/*global $, window, jQuery*/ -(function($) { - 'use strict'; - $.entwine('ss', function($) { - - $('#SubsitesSelect').entwine({ - onadd:function(){ - this.on('change', function(){ - window.location.search=$.query.set('SubsiteID', $(this).val()); - }); - } - }); - - /* - * Reload subsites dropdown when links are processed - */ - $('.cms-container .cms-menu-list li a').entwine({ - onclick: function(e) { - $('.cms-container').loadFragment('admin/subsite_xhr', 'SubsiteList'); - this._super(e); - } - }); - - /* - * Reload subsites dropdown when the admin area reloads (for deleting sites) - */ - $('.cms-container .SubsiteAdmin .cms-edit-form fieldset.ss-gridfield').entwine({ - onreload: function(e) { - $('.cms-container').loadFragment('admin/subsite_xhr', 'SubsiteList'); - this._super(e); - } - }); - - /* - * Reload subsites dropdown when subsites are added or names are modified - */ - $('.cms-container .tab.subsite-model').entwine({ - onadd: function(e) { - $('.cms-container').loadFragment('admin/subsite_xhr', 'SubsiteList'); - this._super(e); - } - }); - - // Subsite tab of Group editor - $('#Form_ItemEditForm_AccessAllSubsites').entwine({ - /** - * Constructor: onmatch - */ - onmatch: function () { - this.showHideSubsiteList(); - - var ref=this; - $('#Form_ItemEditForm_AccessAllSubsites input').change(function() { - ref.showHideSubsiteList(); - }); - }, - - showHideSubsiteList: function () { - $('#Form_ItemEditForm_Subsites').parent().parent().css('display', ($('#Form_ItemEditForm_AccessAllSubsites_1').is(':checked') ? 'none':'')); - } - }); - - $('.cms-edit-form').entwine({ - /** - * TODO: Fix with Entwine API extension. See https://github.com/silverstripe/silverstripe-subsites/pull/125 - */ - getChangeTrackerOptions: function() { - // Figure out if we're still returning the default value - var isDefault = (this.entwineData('ChangeTrackerOptions') === undefined); - // Get the current options - var opts = this._super(); - - if (isDefault) { - // If it is the default then... - // clone the object (so we don't modify the original), - var opts = $.extend({}, opts); - // modify it, - opts.ignoreFieldSelector +=', input[name=IsSubsite]'; - // then set the clone as the value on this element - // (so next call to this method gets this same clone) - this.setChangeTrackerOptions(opts); - } - - return opts; - } - }); - - $('.cms-edit-form input[name=action_copytosubsite]').entwine({ - onclick: function(e) { - var form = this.closest('form'); - form.trigger('submit', [this]); - } - }); - - }); - - $.entwine('ss.preview', function($){ - - $('.cms-preview').entwine({ - - /** - * Update links and forms with GET/POST SubsiteID param, so we remaing on the current subsite. - * The initial link for the iframe comes from SiteTreeSubsites::updatePreviewLink. - * - * This is done so we can use the CMS domain for displaying previews so we prevent single-origin - * violations and SSL cert problems that come up when iframing content from a different URL. - */ - onafterIframeAdjustedForPreview: function(event, doc) { - var subsiteId = $(doc).find('meta[name=x-subsite-id]').attr('content'); - - if (!subsiteId) { - return; - } - - // Inject the SubsiteID into internal links. - $(doc).find('a').each(function() { - var href = $(this).attr('href'); - - if (typeof href!=='undefined' && !href.match(/^http:\/\//)) { - - $(this).attr('href', $.path.addSearchParams(href, { - 'SubsiteID': subsiteId - })); - - } - }); - - // Inject the SubsiteID as a hidden input into all forms submitting to the local site. - $(doc).find('form').each(function() { - var action = $(this).attr('action'); - - if (typeof action!=='undefined' && !action.match(/^http:\/\//)) { - $(this).append(''); - } - - }); - } - }); - }); -}(jQuery)); diff --git a/client/javascript/SubsitesTreeDropdownField.js b/client/javascript/SubsitesTreeDropdownField.js deleted file mode 100644 index 3964aff..0000000 --- a/client/javascript/SubsitesTreeDropdownField.js +++ /dev/null @@ -1,34 +0,0 @@ -(function($) { - $.entwine('ss', function($) { - /** - * Choose a subsite from which to select pages. - * Needs to clear tree dropdowns in case selection is changed. - */ - $('select.subsitestreedropdownfield-chooser').entwine({ - onchange: function() { - // TODO Data binding between two fields - const name = this.attr('name').replace('_SubsiteID', ''); - let field = $('#Form_EditForm_' + name).first(); - field.setValue(0); - field.refresh(); - field.trigger('change'); - } - }); - - /** - * Add selected subsite from separate dropdown to the request parameters - * before asking for the tree. - */ - $('.TreeDropdownField.SubsitesTreeDropdownField').entwine({ - getAttributes() { - const fieldName = this.attr('id').replace('Form_EditForm_', ''); - const subsiteID = $('#Form_EditForm_' + fieldName + '_SubsiteID option:selected').val(); - - let attributes = this._super(); - attributes.data.urlTree += "?" + fieldName + "_SubsiteID=" + subsiteID; - attributes.data.cacheKey = attributes.data.cacheKey.substring(0, 19) + "_" + subsiteID; - return attributes; - } - }); - }); -})(jQuery); diff --git a/client/javascript/VirtualPage_Subsites.js b/client/javascript/VirtualPage_Subsites.js deleted file mode 100644 index e69de29..0000000 diff --git a/src/Extensions/LeftAndMainSubsites.php b/src/Extensions/LeftAndMainSubsites.php index b56170c..51abfe9 100644 --- a/src/Extensions/LeftAndMainSubsites.php +++ b/src/Extensions/LeftAndMainSubsites.php @@ -41,9 +41,8 @@ class LeftAndMainSubsites extends LeftAndMainExtension public function init() { - Requirements::css('silverstripe/subsites:client/css/LeftAndMain_Subsites.css'); - Requirements::javascript('silverstripe/subsites:client/javascript/LeftAndMain_Subsites.js'); - Requirements::javascript('silverstripe/subsites:client/javascript/VirtualPage_Subsites.js'); + Requirements::css('silverstripe/subsites:client/dist/styles/LeftAndMain_Subsites.css'); + Requirements::javascript('silverstripe/subsites:client/dist/js/LeftAndMain_Subsites.js'); } /** @@ -150,7 +149,7 @@ class LeftAndMainSubsites extends LeftAndMainExtension return false; } - Requirements::javascript('silverstripe/subsites:client/javascript/LeftAndMain_Subsites.js'); + Requirements::javascript('silverstripe/subsites:client/dist/js/LeftAndMain_Subsites.js'); $output = ArrayList::create(); diff --git a/src/Forms/SubsitesTreeDropdownField.php b/src/Forms/SubsitesTreeDropdownField.php index f4b17b5..02291dc 100644 --- a/src/Forms/SubsitesTreeDropdownField.php +++ b/src/Forms/SubsitesTreeDropdownField.php @@ -37,7 +37,7 @@ class SubsitesTreeDropdownField extends TreeDropdownField { $html = parent::Field($properties); - Requirements::javascript('silverstripe/subsites:client/javascript/SubsitesTreeDropdownField.js'); + Requirements::javascript('silverstripe/subsites:client/dist/js/SubsitesTreeDropdownField.js'); return $html; }