(chore): js formatting

OpenWebconcept · Aug 19, 2024 · f317b40 · f317b40
1 parent 11e3f1f
commit f317b40
Show file tree

Hide file tree

Showing 6 changed files with 174 additions and 207 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,11 @@
 # CHANGELOG
 
+## Version [3.12.2] (2024-08-19)
+
+### Feat
+
+- Refractor the validation JavaScript of the post 2 post connections.
+
 ## Version [3.12.1] (2024-06-20)
 
 ### Feat

diff --git a/js/limit-group-connections.js b/js/limit-group-connections.js
@@ -1,81 +1,68 @@
-document.addEventListener('DOMContentLoaded', () => {
-    const selectors = {
-        groupCategoryMetaboxWrapper: '#p2p-to-pdc-category_to_pdc-group',
-        groupSubcategoryMetaboxWrapper: '#p2p-to-pdc-subcategory_to_pdc-group',
+document.addEventListener( 'DOMContentLoaded', () => {
+	const groupCategoryMetaboxWrapper = '#p2p-to-pdc-category_to_pdc-group';
+	const groupSubcategoryMetaboxWrapper = '#p2p-to-pdc-subcategory_to_pdc-group';
 
-        groupCategoryMetabox: 'div[data-p2p_type="pdc-category_to_pdc-group"]',
-		groupSubcategoryMetabox: 'div[data-p2p_type="pdc-subcategory_to_pdc-group"]',
+	const groupCategoryMetabox = 'div[data-p2p_type="pdc-category_to_pdc-group"]';
+	const groupSubcategoryMetabox = 'div[data-p2p_type="pdc-subcategory_to_pdc-group"]';
 
-        groupCategoryConnectionTableRow: 'div[data-p2p_type="pdc-category_to_pdc-group"] > table.p2p-connections > tbody > tr',
-        groupSubcategoryConnectionTableRow: 'div[data-p2p_type="pdc-subcategory_to_pdc-group"] > table.p2p-connections > tbody > tr',
+	const groupCategoryConnectionTableRow = 'div[data-p2p_type="pdc-category_to_pdc-group"] > table.p2p-connections > tbody > tr';
+	const groupSubcategoryConnectionTableRow = 'div[data-p2p_type="pdc-subcategory_to_pdc-group"] > table.p2p-connections > tbody > tr';
 
-        postPublishButton: 'div.edit-post-header__settings > button.editor-post-publish-button__button',
-    };
+	const postPublishButton = 'div.edit-post-header__settings > button.editor-post-publish-button__button';
 
-	const {
-        groupCategoryMetaboxWrapper,
-        groupSubcategoryMetaboxWrapper,
-        groupCategoryMetabox,
-        groupSubcategoryMetabox,
-        groupCategoryConnectionTableRow,
-        groupSubcategoryConnectionTableRow,
-        postPublishButton,
-    } = selectors;
+	// Monitor changes to metaboxes
+	observeMetaboxChanges( groupCategoryMetabox, groupCategoryMetaboxWrapper, groupCategoryConnectionTableRow, groupSubcategoryConnectionTableRow, postPublishButton );
+	observeMetaboxChanges( groupSubcategoryMetabox, groupSubcategoryMetaboxWrapper, groupSubcategoryConnectionTableRow, groupCategoryConnectionTableRow, postPublishButton );
 
-    // Monitor changes to metaboxes
-    observeMetaboxChanges(groupCategoryMetabox, groupCategoryMetaboxWrapper, groupCategoryConnectionTableRow, groupSubcategoryConnectionTableRow, postPublishButton);
-    observeMetaboxChanges(groupSubcategoryMetabox, groupSubcategoryMetaboxWrapper, groupSubcategoryConnectionTableRow, groupCategoryConnectionTableRow, postPublishButton);
-
-    // Validate connections on page load
-    validateConnectionsOnLoad({
+	// Validate connections on page load
+	validateConnectionsOnLoad( {
 		groupCategoryMetaboxWrapper,
-        groupSubcategoryMetaboxWrapper,
-        groupCategoryConnectionTableRow,
-        groupSubcategoryConnectionTableRow,
-        postPublishButton,
-    });
-});
-
-function observeMetaboxChanges(metabox, metaboxWrapper, mainConnectionTableRow, subConnectionTableRow, postPublishButton) {
-    const observer = new MutationObserver(() => {
-        validateConnectionState({ metaboxWrapper, mainConnectionTableRow, subConnectionTableRow, postPublishButton });
-    });
-
-    const targetNode = document.querySelector(metabox);
-    if (targetNode) {
-        observer.observe(targetNode, { childList: true, subtree: true });
-    }
+		groupSubcategoryMetaboxWrapper,
+		groupCategoryConnectionTableRow,
+		groupSubcategoryConnectionTableRow,
+		postPublishButton,
+	} );
+} );
+
+function observeMetaboxChanges( metabox, metaboxWrapper, mainConnectionTableRow, subConnectionTableRow, postPublishButton ) {
+	const observer = new MutationObserver( () => {
+		validateConnectionState( { metaboxWrapper, mainConnectionTableRow, subConnectionTableRow, postPublishButton } );
+	} );
+
+	const targetNode = document.querySelector( metabox );
+	if ( targetNode ) {
+		observer.observe( targetNode, { childList: true, subtree: true } );
+	}
 }
 
-function validateConnectionsOnLoad({ groupCategoryMetaboxWrapper, groupSubcategoryMetaboxWrapper, groupCategoryConnectionTableRow, groupSubcategoryConnectionTableRow,  postPublishButton }) {
-    setTimeout(() => {
-        validateConnectionState({ metaboxWrapper: groupCategoryMetaboxWrapper, mainConnectionTableRow: groupCategoryConnectionTableRow });
-        validateConnectionState({ metaboxWrapper: groupSubcategoryMetaboxWrapper, mainConnectionTableRow: groupSubcategoryConnectionTableRow });
-        validatePublishButtonState({ groupCategoryConnectionTableRow, groupSubcategoryConnectionTableRow, postPublishButton });
-    }, 1000);
+function validateConnectionsOnLoad( { groupCategoryMetaboxWrapper, groupSubcategoryMetaboxWrapper, groupCategoryConnectionTableRow, groupSubcategoryConnectionTableRow, postPublishButton } ) {
+	setTimeout( () => {
+		validateConnectionState( { metaboxWrapper: groupCategoryMetaboxWrapper, mainConnectionTableRow: groupCategoryConnectionTableRow } );
+		validateConnectionState( { metaboxWrapper: groupSubcategoryMetaboxWrapper, mainConnectionTableRow: groupSubcategoryConnectionTableRow } );
+		validatePublishButtonState( { groupCategoryConnectionTableRow, groupSubcategoryConnectionTableRow, postPublishButton } );
+	}, 2000 );
 }
 
-function validateConnectionState({ metaboxWrapper, mainConnectionTableRow, subConnectionTableRow, postPublishButton }) {
-    const mainConnectionExists = document.querySelectorAll(mainConnectionTableRow).length >= 1;
-    const subConnectionExists = subConnectionTableRow ? document.querySelectorAll(subConnectionTableRow).length >= 1 : true;
+function validateConnectionState( { metaboxWrapper, mainConnectionTableRow, subConnectionTableRow, postPublishButton } ) {
+	const mainConnectionExists = document.querySelectorAll( mainConnectionTableRow ).length >= 1;
 
-    toggleMetaboxBorder(metaboxWrapper, mainConnectionExists);
-    validatePublishButtonState({ groupCategoryConnectionTableRow: mainConnectionTableRow, groupSubcategoryConnectionTableRow: subConnectionTableRow, postPublishButton });
+	toggleMetaboxBorder( metaboxWrapper, mainConnectionExists );
+	validatePublishButtonState( { groupCategoryConnectionTableRow: mainConnectionTableRow, groupSubcategoryConnectionTableRow: subConnectionTableRow, postPublishButton } );
 }
 
-function toggleMetaboxBorder(metaboxWrapper, connectionExists) {
-    const wrapper = document.querySelector(metaboxWrapper);
-    if (!wrapper) return;
+function toggleMetaboxBorder( metaboxWrapper, connectionExists ) {
+	const wrapper = document.querySelector( metaboxWrapper );
+	if ( ! wrapper ) return;
 
-    wrapper.style.border = connectionExists ? '' : '1px solid red';
+	wrapper.style.border = connectionExists ? '' : '1px solid red';
 }
 
-function validatePublishButtonState({ groupCategoryConnectionTableRow, groupSubcategoryConnectionTableRow, postPublishButton }) {
-    const categoryConnectionExists = document.querySelectorAll(groupCategoryConnectionTableRow).length >= 1;
-    const subcategoryConnectionExists = groupSubcategoryConnectionTableRow ? document.querySelectorAll(groupSubcategoryConnectionTableRow).length >= 1 : true;
+function validatePublishButtonState( { groupCategoryConnectionTableRow, groupSubcategoryConnectionTableRow, postPublishButton } ) {
+	const categoryConnectionExists = document.querySelectorAll( groupCategoryConnectionTableRow ).length >= 1;
+	const subcategoryConnectionExists = groupSubcategoryConnectionTableRow ? document.querySelectorAll( groupSubcategoryConnectionTableRow ).length >= 1 : true;
 
-    const button = document.querySelector(postPublishButton);
-    if (!button) return;
+	const button = document.querySelector( postPublishButton );
+	if ( ! button ) return;
 
-    button.disabled = !(categoryConnectionExists && subcategoryConnectionExists);
+	button.disabled = ! ( categoryConnectionExists && subcategoryConnectionExists );
 }
diff --git a/js/limit-item-connections.js b/js/limit-item-connections.js
@@ -1,113 +1,97 @@
-document.addEventListener('DOMContentLoaded', () => {
-    const selectors = {
-        itemCategoryMetaboxWrapper: '#p2p-from-pdc-item_to_pdc-category',
-        itemSubcategoryMetaboxWrapper: '#p2p-from-pdc-item_to_pdc-subcategory',
-        itemGroupMetaboxWrapper: '#p2p-from-pdc-item_to_pdc-group',
-
-        itemCategoryMetabox: 'div[data-p2p_type="pdc-item_to_pdc-category"]',
-        itemSubcategoryMetabox: 'div[data-p2p_type="pdc-item_to_pdc-subcategory"]',
-        itemGroupMetabox: 'div[data-p2p_type="pdc-item_to_pdc-group"]',
-
-        itemCategoryConnectionTableRow: 'div[data-p2p_type="pdc-item_to_pdc-category"] > table.p2p-connections > tbody > tr',
-        itemSubcategoryConnectionTableRow: 'div[data-p2p_type="pdc-item_to_pdc-subcategory"] > table.p2p-connections > tbody > tr',
-        itemGroupConnectionTableRow: 'div[data-p2p_type="pdc-item_to_pdc-group"] > table.p2p-connections > tbody > tr',
-
-        postPublishButton: 'div.edit-post-header__settings > button.editor-post-publish-button__button',
-    };
-
-    const {
-        itemCategoryMetaboxWrapper,
-        itemSubcategoryMetaboxWrapper,
-        itemGroupMetaboxWrapper,
-        itemCategoryMetabox,
-        itemSubcategoryMetabox,
-        itemGroupMetabox,
-        itemCategoryConnectionTableRow,
-        itemSubcategoryConnectionTableRow,
-        itemGroupConnectionTableRow,
-        postPublishButton,
-    } = selectors;
-
-    // Monitor changes to metaboxes
-    observeMetaboxChanges(itemCategoryMetabox, itemCategoryMetaboxWrapper, itemCategoryConnectionTableRow, itemSubcategoryConnectionTableRow, postPublishButton);
-    observeMetaboxChanges(itemSubcategoryMetabox, itemSubcategoryMetaboxWrapper, itemSubcategoryConnectionTableRow, itemCategoryConnectionTableRow, postPublishButton);
-    observeGroupMetaboxChanges(itemGroupMetabox, itemGroupConnectionTableRow);
-
-    // Validate connections on page load
-    validateConnectionsOnLoad({
-        itemCategoryMetaboxWrapper,
-        itemSubcategoryMetaboxWrapper,
-        itemGroupMetaboxWrapper,
-        itemCategoryConnectionTableRow,
-        itemSubcategoryConnectionTableRow,
-        itemGroupConnectionTableRow,
-        itemGroupMetabox,
-        postPublishButton,
-    });
-});
-
-function observeMetaboxChanges(metabox, metaboxWrapper, mainConnectionTableRow, subConnectionTableRow, postPublishButton) {
-    const observer = new MutationObserver(() => {
-        validateConnectionState({ metaboxWrapper, mainConnectionTableRow, subConnectionTableRow, postPublishButton });
-    });
-
-    const targetNode = document.querySelector(metabox);
-    if (targetNode) {
-        observer.observe(targetNode, { childList: true, subtree: true });
-    }
+document.addEventListener( 'DOMContentLoaded', () => {
+	const itemCategoryMetaboxWrapper = '#p2p-from-pdc-item_to_pdc-category';
+	const itemSubcategoryMetaboxWrapper = '#p2p-from-pdc-item_to_pdc-subcategory';
+	const itemGroupMetaboxWrapper = '#p2p-from-pdc-item_to_pdc-group';
+
+	const itemCategoryMetabox = 'div[data-p2p_type="pdc-item_to_pdc-category"]';
+	const itemSubcategoryMetabox = 'div[data-p2p_type="pdc-item_to_pdc-subcategory"]';
+	const itemGroupMetabox = 'div[data-p2p_type="pdc-item_to_pdc-group"]';
+
+	const itemCategoryConnectionTableRow = 'div[data-p2p_type="pdc-item_to_pdc-category"] > table.p2p-connections > tbody > tr';
+	const itemSubcategoryConnectionTableRow = 'div[data-p2p_type="pdc-item_to_pdc-subcategory"] > table.p2p-connections > tbody > tr';
+	const itemGroupConnectionTableRow = 'div[data-p2p_type="pdc-item_to_pdc-group"] > table.p2p-connections > tbody > tr';
+
+	const postPublishButton = 'div.edit-post-header__settings > button.editor-post-publish-button__button';
+
+	// Monitor changes to metaboxes
+	observeMetaboxChanges( itemCategoryMetabox, itemCategoryMetaboxWrapper, itemCategoryConnectionTableRow, itemSubcategoryConnectionTableRow, postPublishButton );
+	observeMetaboxChanges( itemSubcategoryMetabox, itemSubcategoryMetaboxWrapper, itemSubcategoryConnectionTableRow, itemCategoryConnectionTableRow, postPublishButton );
+	observeGroupMetaboxChanges( itemGroupMetabox, itemGroupConnectionTableRow );
+
+	// Validate connections on page load
+	validateConnectionsOnLoad( {
+		itemCategoryMetaboxWrapper,
+		itemSubcategoryMetaboxWrapper,
+		itemGroupMetaboxWrapper,
+		itemCategoryConnectionTableRow,
+		itemSubcategoryConnectionTableRow,
+		itemGroupConnectionTableRow,
+		itemGroupMetabox,
+		postPublishButton,
+	} );
+} );
+
+function observeMetaboxChanges( metabox, metaboxWrapper, mainConnectionTableRow, subConnectionTableRow, postPublishButton ) {
+	const observer = new MutationObserver( () => {
+		validateConnectionState( { metaboxWrapper, mainConnectionTableRow, subConnectionTableRow, postPublishButton } );
+	} );
+
+	const targetNode = document.querySelector( metabox );
+	if ( targetNode ) {
+		observer.observe( targetNode, { childList: true, subtree: true } );
+	}
 }
 
-function observeGroupMetaboxChanges(metabox, mainConnectionTableRow) {
-    const observer = new MutationObserver(() => {
-        toggleGroupConnectionVisibility(metabox, mainConnectionTableRow);
-    });
+function observeGroupMetaboxChanges( metabox, mainConnectionTableRow ) {
+	const observer = new MutationObserver( () => {
+		toggleGroupConnectionVisibility( metabox, mainConnectionTableRow );
+	} );
 
-    const targetNode = document.querySelector(metabox);
-    if (targetNode) {
-        observer.observe(targetNode, { childList: true, subtree: true });
-    }
+	const targetNode = document.querySelector( metabox );
+	if ( targetNode ) {
+		observer.observe( targetNode, { childList: true, subtree: true } );
+	}
 }
 
-function validateConnectionsOnLoad({ itemCategoryMetaboxWrapper, itemSubcategoryMetaboxWrapper, itemGroupMetaboxWrapper, itemCategoryConnectionTableRow, itemSubcategoryConnectionTableRow, itemGroupConnectionTableRow, itemGroupMetabox, postPublishButton }) {
-    setTimeout(() => {
-        validateConnectionState({ metaboxWrapper: itemCategoryMetaboxWrapper, mainConnectionTableRow: itemCategoryConnectionTableRow });
-        validateConnectionState({ metaboxWrapper: itemSubcategoryMetaboxWrapper, mainConnectionTableRow: itemSubcategoryConnectionTableRow });
-        toggleGroupConnectionVisibility(itemGroupMetabox, itemGroupConnectionTableRow);
-        validatePublishButtonState({ itemCategoryConnectionTableRow, itemSubcategoryConnectionTableRow, postPublishButton });
-    }, 1000);
+function validateConnectionsOnLoad( { itemCategoryMetaboxWrapper, itemSubcategoryMetaboxWrapper, itemGroupMetaboxWrapper, itemCategoryConnectionTableRow, itemSubcategoryConnectionTableRow, itemGroupConnectionTableRow, itemGroupMetabox, postPublishButton } ) {
+	setTimeout( () => {
+		validateConnectionState( { metaboxWrapper: itemCategoryMetaboxWrapper, mainConnectionTableRow: itemCategoryConnectionTableRow } );
+		validateConnectionState( { metaboxWrapper: itemSubcategoryMetaboxWrapper, mainConnectionTableRow: itemSubcategoryConnectionTableRow } );
+		toggleGroupConnectionVisibility( itemGroupMetabox, itemGroupConnectionTableRow );
+		validatePublishButtonState( { itemCategoryConnectionTableRow, itemSubcategoryConnectionTableRow, postPublishButton } );
+	}, 2000 );
 }
 
-function validateConnectionState({ metaboxWrapper, mainConnectionTableRow, subConnectionTableRow, postPublishButton }) {
-    const mainConnectionExists = document.querySelectorAll(mainConnectionTableRow).length >= 1;
-    const subConnectionExists = subConnectionTableRow ? document.querySelectorAll(subConnectionTableRow).length >= 1 : true;
+function validateConnectionState( { metaboxWrapper, mainConnectionTableRow, subConnectionTableRow, postPublishButton } ) {
+	const mainConnectionExists = document.querySelectorAll( mainConnectionTableRow ).length >= 1;
 
-    toggleMetaboxBorder(metaboxWrapper, mainConnectionExists);
-    validatePublishButtonState({ itemCategoryConnectionTableRow: mainConnectionTableRow, itemSubcategoryConnectionTableRow: subConnectionTableRow, postPublishButton });
+	toggleMetaboxBorder( metaboxWrapper, mainConnectionExists );
+	validatePublishButtonState( { itemCategoryConnectionTableRow: mainConnectionTableRow, itemSubcategoryConnectionTableRow: subConnectionTableRow, postPublishButton } );
 }
 
-function toggleMetaboxBorder(metaboxWrapper, connectionExists) {
-    const wrapper = document.querySelector(metaboxWrapper);
-    if (!wrapper) return;
+function toggleMetaboxBorder( metaboxWrapper, connectionExists ) {
+	const wrapper = document.querySelector( metaboxWrapper );
+	if ( ! wrapper ) return;
 
-    wrapper.style.border = connectionExists ? '' : '1px solid red';
+	wrapper.style.border = connectionExists ? '' : '1px solid red';
 }
 
 // Enforces that only one group connection can be made. Not sure why this is necessary, but it was in the original code.
-function toggleGroupConnectionVisibility(metabox, mainConnectionTableRow) {
-    const createConnectionsElement = document.querySelector(`${metabox} > div.p2p-create-connections`);
-    const connectionExists = document.querySelectorAll(mainConnectionTableRow).length === 1;
+function toggleGroupConnectionVisibility( metabox, mainConnectionTableRow ) {
+	const createConnectionsElement = document.querySelector( `${ metabox } > div.p2p-create-connections` );
+	const connectionExists = document.querySelectorAll( mainConnectionTableRow ).length === 1;
 
-    if (!createConnectionsElement) return;
+	if ( ! createConnectionsElement ) return;
 
-    createConnectionsElement.classList.toggle('hidden', connectionExists);
+	createConnectionsElement.classList.toggle( 'hidden', connectionExists );
 }
 
-function validatePublishButtonState({ itemCategoryConnectionTableRow, itemSubcategoryConnectionTableRow, postPublishButton }) {
-    const categoryConnectionExists = document.querySelectorAll(itemCategoryConnectionTableRow).length >= 1;
-    const subcategoryConnectionExists = itemSubcategoryConnectionTableRow ? document.querySelectorAll(itemSubcategoryConnectionTableRow).length >= 1 : true;
+function validatePublishButtonState( { itemCategoryConnectionTableRow, itemSubcategoryConnectionTableRow, postPublishButton } ) {
+	const categoryConnectionExists = document.querySelectorAll( itemCategoryConnectionTableRow ).length >= 1;
+	const subcategoryConnectionExists = itemSubcategoryConnectionTableRow ? document.querySelectorAll( itemSubcategoryConnectionTableRow ).length >= 1 : true;
 
-    const button = document.querySelector(postPublishButton);
-    if (!button) return;
+	const button = document.querySelector( postPublishButton );
+	if ( ! button ) return;
 
-    button.disabled = !(categoryConnectionExists && subcategoryConnectionExists);
+	button.disabled = ! ( categoryConnectionExists && subcategoryConnectionExists );
 }