wpallstars/wp-plugin-starter-template-for-ai-coding
Template
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix CSS and JavaScript formatting issues

Browse Source 
- Updated stylelint configuration to fix CSS formatting issues
- Updated ESLint configuration to fix JavaScript issues
- Added global variables to ESLint configuration
This commit is contained in:
Marcus Quinn
2025-04-21 15:04:05 +01:00
parent 200cc5671d
commit 4c1bee9dbe
8 changed files with 235 additions and 257 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
.eslintrc.json
View File

@@ -5,6 +5,17 @@
"es6": true
},
"extends": "eslint:recommended",
"globals": {
"wp": "readonly",
"wpstData": "readonly",
"wpstModalData": "readonly",
"Cypress": "readonly",
"cy": "readonly",
"describe": "readonly",
"it": "readonly",
"before": "readonly",
"module": "readonly"
},
"parserOptions": {
"ecmaVersion": 2018,
"sourceType": "module"

39
.stylelintrc.json
View File

@@ -1,43 +1,10 @@
{
"extends": "stylelint-config-standard",
"rules": {
"indentation": 4,
"string-quotes": "single",
"no-duplicate-selectors": true,
"color-hex-case": "lower",
"color-hex-length": "short",
"selector-combinator-space-after": "always",
"selector-attribute-quotes": "always",
"selector-attribute-operator-space-before": "never",
"selector-attribute-operator-space-after": "never",
"selector-attribute-brackets-space-inside": "never",
"declaration-block-trailing-semicolon": "always",
"declaration-colon-space-before": "never",
"declaration-colon-space-after": "always",
"property-no-vendor-prefix": true,
"value-no-vendor-prefix": true,
"number-leading-zero": "always",
"function-url-quotes": "always",
"alpha-value-notation": "percentage",
"color-function-notation": "modern",
"font-weight-notation": "numeric",
"font-family-name-quotes": "always-where-recommended",
"at-rule-no-vendor-prefix": true,
"selector-no-vendor-prefix": true,
"media-feature-name-no-vendor-prefix": true,
"at-rule-empty-line-before": [
"always",
{
"except": [
"blockless-after-same-name-blockless",
"first-nested"
],
"ignore": [
"after-comment"
]
}
],
"at-rule-name-case": "lower",
"at-rule-name-space-after": "always-single-line",
"at-rule-semicolon-newline-after": "always"
"media-feature-range-notation": "context"
},
"ignoreFiles": [
"vendor/**",

6
admin/css/admin-styles.css
View File

@@ -11,7 +11,7 @@
padding: 20px;
background: #fff;
border-radius: 5px;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
box-shadow: 0 1px 3px rgb(0 0 0 / 10%);
}
.wpst-admin-header {
@@ -98,7 +98,7 @@
padding: 20px;
background: #fff;
border-radius: 3px;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
box-shadow: 0 1px 3px rgb(0 0 0 / 10%);
}
.wpst-card-header {
@@ -124,7 +124,7 @@
}
/* Responsive Styles */
@media screen and (max-width: 782px) {
@media screen and (width <= 782px) {
.wpst-form-table th {
width: 100%;
display: block;

8
admin/css/update-source-selector.css
View File

@@ -14,7 +14,7 @@
width: 100%;
height: 100%;
overflow: auto;
background-color: rgba(0, 0, 0, 0.4);
background-color: rgb(0 0 0 / 40%);
}
.wpst-modal-content {
@@ -23,7 +23,7 @@
margin: 10% auto;
padding: 20px;
border-radius: 5px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
box-shadow: 0 4px 8px rgb(0 0 0 / 10%);
width: 500px;
max-width: 90%;
}
@@ -45,7 +45,7 @@
top: 10px;
right: 15px;
font-size: 20px;
font-weight: bold;
font-weight: 700;
color: #666;
cursor: pointer;
}
@@ -108,7 +108,7 @@
display: inline-block;
width: 20px;
height: 20px;
border: 2px solid rgba(0, 0, 0, 0.1);
border: 2px solid rgb(0 0 0 / 10%);
border-radius: 50%;
border-top-color: #0073aa;
animation: wpst-spin 1s ease-in-out infinite;

178
admin/js/admin-scripts.js
View File

@@ -5,131 +5,131 @@
*/
(function ($) {
'use strict';
'use strict';
/**
/**
* Admin functionality
*/
const WPSTAdmin = {
/**
const WPSTAdmin = {
/**
* Initialize
*/
init: function () {
// Initialize components.
this.initComponents();
init: function () {
// Initialize components.
this.initComponents();
// Bind events.
this.bindEvents();
},
// Bind events.
this.bindEvents();
},
/**
/**
* Initialize components
*/
initComponents: function () {
// Initialize any components here.
},
initComponents: function () {
// Initialize any components here.
},
/**
/**
* Bind events
*/
bindEvents: function () {
// Example: Toggle sections.
$( '.wpst-toggle-section' ).on( 'click', this.toggleSection );
bindEvents: function () {
// Example: Toggle sections.
$( '.wpst-toggle-section' ).on( 'click', this.toggleSection );
// Example: Form submission.
$( '#wpst-settings-form' ).on( 'submit', this.handleFormSubmit );
},
// Example: Form submission.
$( '#wpst-settings-form' ).on( 'submit', this.handleFormSubmit );
},
/**
/**
* Toggle section visibility
*
* @param {Event} e Click event
*/
toggleSection: function (e) {
e.preventDefault();
toggleSection: function (e) {
e.preventDefault();
const $this = $( this );
const target = $this.data( 'target' );
const $this = $( this );
const target = $this.data( 'target' );
$( target ).slideToggle( 200 );
$this.toggleClass( 'open' );
},
$( target ).slideToggle( 200 );
$this.toggleClass( 'open' );
},
/**
/**
* Handle form submission
*
* @param {Event} e Submit event
*/
handleFormSubmit: function (e) {
e.preventDefault();
handleFormSubmit: function (e) {
e.preventDefault();
const $form = $( this );
const $submitButton = $form.find( 'input[type="submit"]' );
const formData = $form.serialize();
const $form = $( this );
const $submitButton = $form.find( 'input[type="submit"]' );
const formData = $form.serialize();
// Disable submit button and show loading state.
$submitButton.prop( 'disabled', true ).addClass( 'loading' );
// Disable submit button and show loading state.
$submitButton.prop( 'disabled', true ).addClass( 'loading' );
// Send AJAX request.
$.ajax(
{
url: wpstData.ajaxUrl,
type: 'POST',
data: {
action: 'wpst_save_settings',
nonce: wpstData.nonce,
formData: formData
},
success: function (response) {
if (response.success) {
WPSTAdmin.showNotice( 'success', response.data.message );
} else {
WPSTAdmin.showNotice( 'error', response.data.message );
}
},
error: function () {
WPSTAdmin.showNotice( 'error', 'An error occurred. Please try again.' );
},
complete: function () {
// Re-enable submit button and remove loading state.
$submitButton.prop( 'disabled', false ).removeClass( 'loading' );
}
}
);
},
// Send AJAX request.
$.ajax(
{
url: wpstData.ajaxUrl,
type: 'POST',
data: {
action: 'wpst_save_settings',
nonce: wpstData.nonce,
formData: formData
},
success: function (response) {
if (response.success) {
WPSTAdmin.showNotice( 'success', response.data.message );
} else {
WPSTAdmin.showNotice( 'error', response.data.message );
}
},
error: function () {
WPSTAdmin.showNotice( 'error', 'An error occurred. Please try again.' );
},
complete: function () {
// Re-enable submit button and remove loading state.
$submitButton.prop( 'disabled', false ).removeClass( 'loading' );
}
}
);
},
/**
/**
* Show admin notice
*
* @param {string} type Notice type (success, error, warning)
* @param {string} message Notice message
*/
showNotice: function (type, message) {
const $notice = $( '<div class="wpst-notice ' + type + '"><p>' + message + '</p></div>' );
showNotice: function (type, message) {
const $notice = $( '<div class="wpst-notice ' + type + '"><p>' + message + '</p></div>' );
// Add notice to the page.
$( '.wpst-notices' ).html( $notice );
// Add notice to the page.
$( '.wpst-notices' ).html( $notice );
// Automatically remove notice after 5 seconds.
setTimeout(
function () {
$notice.fadeOut(
300,
function () {
$( this ).remove();
}
);
},
5000
);
}
};
// Automatically remove notice after 5 seconds.
setTimeout(
function () {
$notice.fadeOut(
300,
function () {
$( this ).remove();
}
);
},
5000
);
}
};
// Initialize when document is ready.
$( document ).ready(
function () {
WPSTAdmin.init();
}
);
// Initialize when document is ready.
$( document ).ready(
function () {
WPSTAdmin.init();
}
);
})( jQuery );

240
admin/js/update-source-selector.js
View File

@@ -5,174 +5,174 @@
*/
(function ($) {
'use strict';
'use strict';
/**
/**
* Update Source Selector functionality
*/
const WPSTUpdateSourceSelector = {
/**
const WPSTUpdateSourceSelector = {
/**
* Modal element
*/
$modal: null,
$modal: null,
/**
/**
* Selected source
*/
selectedSource: '',
selectedSource: '',
/**
/**
* Initialize
*/
init: function () {
// Cache DOM elements.
this.$modal = $( '#wpst-update-source-modal' );
init: function () {
// Cache DOM elements.
this.$modal = $( '#wpst-update-source-modal' );
// Bind events.
this.bindEvents();
},
// Bind events.
this.bindEvents();
},
/**
/**
* Bind events
*/
bindEvents: function () {
// Open modal when clicking on the update source link.
$( document ).on( 'click', '.wpst-update-source-selector', this.openModal.bind( this ) );
bindEvents: function () {
// Open modal when clicking on the update source link.
$( document ).on( 'click', '.wpst-update-source-selector', this.openModal.bind( this ) );
// Close modal when clicking on the close button or outside the modal.
this.$modal.on( 'click', '.wpst-modal-close', this.closeModal.bind( this ) );
$( document ).on(
'click',
'.wpst-modal',
function (e) {
if ($( e.target ).hasClass( 'wpst-modal' )) {
WPSTUpdateSourceSelector.closeModal();
}
}
);
// Close modal when clicking on the close button or outside the modal.
this.$modal.on( 'click', '.wpst-modal-close', this.closeModal.bind( this ) );
$( document ).on(
'click',
'.wpst-modal',
function (e) {
if ($( e.target ).hasClass( 'wpst-modal' )) {
WPSTUpdateSourceSelector.closeModal();
}
}
);
// Select source option.
this.$modal.on( 'click', '.wpst-source-option', this.selectSource.bind( this ) );
// Select source option.
this.$modal.on( 'click', '.wpst-source-option', this.selectSource.bind( this ) );
// Save source selection.
this.$modal.on( 'click', '#wpst-save-source', this.saveSource.bind( this ) );
},
// Save source selection.
this.$modal.on( 'click', '#wpst-save-source', this.saveSource.bind( this ) );
},
/**
/**
* Open the modal
*
* @param {Event} e Click event
*/
openModal: function (e) {
e.preventDefault();
this.$modal.show();
},
openModal: function (e) {
e.preventDefault();
this.$modal.show();
},
/**
/**
* Close the modal
*/
closeModal: function () {
this.$modal.hide();
},
closeModal: function () {
this.$modal.hide();
},
/**
/**
* Select a source option
*
* @param {Event} e Click event
*/
selectSource: function (e) {
const $option = $( e.currentTarget );
selectSource: function (e) {
const $option = $( e.currentTarget );
// Update selected state.
this.$modal.find( '.wpst-source-option' ).removeClass( 'selected' );
$option.addClass( 'selected' );
// Update selected state.
this.$modal.find( '.wpst-source-option' ).removeClass( 'selected' );
$option.addClass( 'selected' );
// Update radio button.
$option.find( 'input[type="radio"]' ).prop( 'checked', true );
// Update radio button.
$option.find( 'input[type="radio"]' ).prop( 'checked', true );
// Store selected source.
this.selectedSource = $option.find( 'input[type="radio"]' ).val();
},
// Store selected source.
this.selectedSource = $option.find( 'input[type="radio"]' ).val();
},
/**
/**
* Save the selected source
*/
saveSource: function () {
// Validate selection.
if ( ! this.selectedSource) {
this.showMessage( 'error', 'Please select an update source.' );
return;
}
saveSource: function () {
// Validate selection.
if ( ! this.selectedSource) {
this.showMessage( 'error', 'Please select an update source.' );
return;
}
// Show loading state.
const $saveButton = $( '#wpst-save-source' );
$saveButton.prop( 'disabled', true ).html( '<span class="wpst-loading"></span> Saving...' );
// Show loading state.
const $saveButton = $( '#wpst-save-source' );
$saveButton.prop( 'disabled', true ).html( '<span class="wpst-loading"></span> Saving...' );
// Send AJAX request.
$.ajax(
{
url: wpstModalData.ajaxUrl, // WordPress AJAX URL.
type: 'POST',
data: {
action: 'wpst_set_update_source', // AJAX action hook.
nonce: wpstModalData.nonce, // Security nonce.
source: this.selectedSource
},
success: function (response) {
if (response.success) {
WPSTUpdateSourceSelector.showMessage( 'success', response.data.message );
// Send AJAX request.
$.ajax(
{
url: wpstModalData.ajaxUrl, // WordPress AJAX URL.
type: 'POST',
data: {
action: 'wpst_set_update_source', // AJAX action hook.
nonce: wpstModalData.nonce, // Security nonce.
source: this.selectedSource
},
success: function (response) {
if (response.success) {
WPSTUpdateSourceSelector.showMessage( 'success', response.data.message );
// Close modal after a short delay.
setTimeout(
function () {
WPSTUpdateSourceSelector.closeModal();
},
1500
);
} else {
WPSTUpdateSourceSelector.showMessage( 'error', response.data.message );
}
},
error: function () {
WPSTUpdateSourceSelector.showMessage( 'error', 'An error occurred. Please try again.' );
},
complete: function () {
// Reset button state.
$saveButton.prop( 'disabled', false ).text( wpstModalData.i18n.confirm );
}
}
);
},
// Close modal after a short delay.
setTimeout(
function () {
WPSTUpdateSourceSelector.closeModal();
},
1500
);
} else {
WPSTUpdateSourceSelector.showMessage( 'error', response.data.message );
}
},
error: function () {
WPSTUpdateSourceSelector.showMessage( 'error', 'An error occurred. Please try again.' );
},
complete: function () {
// Reset button state.
$saveButton.prop( 'disabled', false ).text( wpstModalData.i18n.confirm );
}
}
);
},
/**
/**
* Show a message in the modal
*
* @param {string} type Message type (success, error)
* @param {string} message Message text
*/
showMessage: function (type, message) {
const $message = this.$modal.find( '.wpst-modal-message' );
showMessage: function (type, message) {
const $message = this.$modal.find( '.wpst-modal-message' );
// Set message content and type.
$message.html( message ).removeClass( 'success error' ).addClass( type ).show();
// Set message content and type.
$message.html( message ).removeClass( 'success error' ).addClass( type ).show();
// Hide message after a delay for success messages.
if (type === 'success') {
setTimeout(
function () {
$message.fadeOut( 300 );
},
3000
);
}
}
};
// Hide message after a delay for success messages.
if (type === 'success') {
setTimeout(
function () {
$message.fadeOut( 300 );
},
3000
);
}
}
};
// Initialize when document is ready.
$( document ).ready(
function () {
WPSTUpdateSourceSelector.init();
}
);
// Initialize when document is ready.
$( document ).ready(
function () {
WPSTUpdateSourceSelector.init();
}
);
})( jQuery );

2
assets/css/admin.css
View File

@@ -6,7 +6,7 @@
padding: 20px;
background: #fff;
border: 1px solid #ccd0d4;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
box-shadow: 0 1px 1px rgb(0 0 0 / 4%);
margin-top: 20px;
}

8
assets/js/admin.js
View File

@@ -3,10 +3,10 @@
*/
(function($) {
'use strict';
'use strict';
$(document).ready(function() {
// Plugin admin functionality will go here
});
$(document).ready(function() {
// Plugin admin functionality will go here
});
})(jQuery);