diff --git a/.github/workflows/coding-standards.yml b/.github/workflows/coding-standards.yml
index 528847b8..180b4934 100644
--- a/.github/workflows/coding-standards.yml
+++ b/.github/workflows/coding-standards.yml
@@ -5,8 +5,8 @@ on:
types: [ opened, synchronize ]
jobs:
- php:
- name: PHP
+ phpcs:
+ name: phpcs
runs-on: ubuntu-latest
steps:
diff --git a/assets/css/translation-events.css b/assets/css/translation-events.css
index 80683a83..5c43f767 100644
--- a/assets/css/translation-events.css
+++ b/assets/css/translation-events.css
@@ -1,136 +1,135 @@
.translation-event-form label {
- display: inline-block;
- width: 140px;
- vertical-align: top;
+ display: inline-block;
+ width: 140px;
+ vertical-align: top;
}
.translation-event-form #event-title,
.translation-event-form #event-description {
- width: 30%;
+ width: 30%;
}
.translation-event-form input[type="text"],
.translation-event-form input[type="date"] {
- width: 13%;
+ width: 13%;
}
.translation-event-form div {
- margin-top: 1em;
+ margin-top: 1em;
}
.translation-event-form #submit-event {
- margin-left: 10%;
- width: 30%;
- margin-top: 1em;
- display: block;
+ margin-left: 10%;
+ width: 30%;
+ margin-top: 1em;
+ display: block;
}
.event-page-title {
- border-bottom: #d9d8d8 thin solid;
- padding-bottom: .5em;
+ border-bottom: #d9d8d8 thin solid;
+ padding-bottom: .5em;
}
.event-details-page {
- border-bottom: #cfd4d4 thin solid;
- width: 60%;
- margin: 0 auto;
+ border-bottom: #cfd4d4 thin solid;
+ width: 60%;
+ margin: 0 auto;
}
.event-details-left {
- width: 77%;
- float: left;
- border-right: #dadfdf thin solid;
- margin-right: 1%;
- padding-right: 1em;
+ width: 77%;
+ float: left;
+ border-right: #dadfdf thin solid;
+ margin-right: 1%;
+ padding-right: 1em;
}
.event-details-right {
- width: 22%;
- float: left;
- padding: 1em;
+ width: 22%;
+ float: left;
+ padding: 1em;
}
.event-details-stats {
- clear: both;
- margin: 1em;
+ clear: both;
+ margin: 1em;
}
.event-details-stats table, .event-details-stats table td, .event-details-stats table th {
- border: 0.2em solid var(--gp-color-primary);
- padding: 1em;
+ border: 0.2em solid var(--gp-color-primary);
+ padding: 1em;
}
.event-details-stats-totals {
- font-weight: bold;
+ font-weight: bold;
}
.hide-event-url {
- display: none;
+ display: none;
}
.translation-event-form button.save-draft {
- background: #fff;
- color: var(--gp-color-btn-primary-bg);
+ background: #fff;
+ color: var(--gp-color-btn-primary-bg);
}
#event-url span {
- width: 10%;
- display: inline-block;
+ width: 10%;
+ display: inline-block;
}
span.event-list-date {
- display: block;
- color: #939393;
- font-size: .9em;
- font-weight: bold;
+ display: block;
+ color: #939393;
+ font-size: .9em;
+ font-weight: bold;
}
span.event-list-date.events-i-am-attending {
- font-size: .8em;
- font-weight: normal;
+ font-size: .8em;
+ font-weight: normal;
}
.event-list-item a{
- font-weight: bold;
- font-size: 1.2em;
+ font-weight: bold;
+ font-size: 1.2em;
}
li.event-list-item {
- list-style-type: none;
+ list-style-type: none;
}
li.event-list-item p {
- margin-top: 0;
- color: #5a5a5a;
- font-size: .95em;
+ margin-top: 0;
+ color: #5a5a5a;
+ font-size: .95em;
}
h2.event_page_title {
- border-bottom: #e0e0e0 thin solid;
- padding-bottom: 0.5em;
- font-weight: bold;
+ border-bottom: #e0e0e0 thin solid;
+ padding-bottom: 0.5em;
+ font-weight: bold;
}
.event-list-top-bar {
- float: right;
+ float: right;
}
.event-list-nav li {
- display: inline;
- margin-right: 1em;
+ display: inline;
+ margin-right: 1em;
}
.event-left-col {
- width: 70%;
- float: left;
+ width: 70%;
+ float: left;
}
.event-right-col {
- width: 25%;
- float: left;
- padding: 1em;
- border-left: var(--wp--preset--color--cyan-bluish-gray) thin solid;
+ width: 25%;
+ float: left;
+ padding: 1em;
+ border-left: var(--wp--preset--color--cyan-bluish-gray) thin solid;
}
.event-attending-list {
- list-style-type: none;
- padding: 0;
+ list-style-type: none;
+ padding: 0;
}
.event-attending-list li {
- margin-bottom: 1em;
+ margin-bottom: 1em;
}
.event-list-nav li a.button {
- background-color: var(--gp-color-btn-primary-bg) !important;
- color: #fff !important;
+ background-color: var(--gp-color-btn-primary-bg) !important;
+ color: #fff !important;
}
a.event-link-draft {
- color:#80807f;
+ color:#80807f;
}
span.event-label-draft {
- font-weight: 500;
- color:#c05621;
- border: 1px solid #c05621;
- font-size: .7em;
- margin-right: 0.3em;
- width: 6em;
- text-align: center;
- padding: 0.2em 0.5em;
- border-radius: 1em;
- text-transform: capitalize;
-}
-
+ font-weight: 500;
+ color:#c05621;
+ border: 1px solid #c05621;
+ font-size: .7em;
+ margin-right: 0.3em;
+ width: 6em;
+ text-align: center;
+ padding: 0.2em 0.5em;
+ border-radius: 1em;
+ text-transform: capitalize;
+}
diff --git a/assets/js/translation-events.js b/assets/js/translation-events.js
index 28b7bd4b..51e7fdcd 100644
--- a/assets/js/translation-events.js
+++ b/assets/js/translation-events.js
@@ -1,114 +1,154 @@
-( function( $, $gp ) {
-jQuery(document).ready(function($) {
- $gp.notices.init();
- if ( $('#event-timezone').length && ! $('#event-timezone').val() ) {
- selectUserTimezone();
- }
- validateEventDates();
- convertToUserLocalTime();
+(
+ function ( $, $gp ) {
+ jQuery( document ).ready(
+ function ( $ ) {
+ $gp.notices.init();
+ const timezoneElement = $( '#event-timezone' );
+ if ( timezoneElement.length && ! timezoneElement.val() ) {
+ selectUserTimezone();
+ }
+ validateEventDates();
+ convertToUserLocalTime();
- $('.submit-event').on('click', function(e) {
- e.preventDefault();
- if ( $('#event-end').val() <= $('#event-start').val() ) {
- $gp.notices.error( 'Event end date and time must be later than event start date and time.' );
- return;
- }
- var btnClicked = $(this).data('event-status');
- if ( btnClicked == 'publish' && '' == $('#event-id').val() ) {
- var submitPrompt = 'Are you sure you want to publish this event?';
- if ( ! confirm( submitPrompt ) ) {
- return;
- }
- }
- $('#event-form-action').val( btnClicked );
- var $form = $('.translation-event-form');
- var $is_creation = $('#form-name').val() == 'create_event' ? true : false;
+ $( '.submit-event' ).on(
+ 'click',
+ function ( e ) {
+ e.preventDefault();
+ handleSubmit();
+ }
+ );
- $.ajax({
- type: 'POST',
- url: $translation_event.url,
- data:$form.serialize(),
- success: function(response) {
- if ( response.data.eventId ) {
- history.replaceState('','', response.data.eventEditUrl)
- $('#form-name').val('edit_event');
- $('.event-page-title').text('Edit Event');
- $('#event-id').val(response.data.eventId);
- if( btnClicked == 'publish' ) {
- $('button[data-event-status="draft"]').hide();
- $('button[data-event-status="publish"]').text('Update Event');
- }
- if( btnClicked == 'draft' ) {
- $('button[data-event-status="draft"]').text('Update Draft');
- }
- $('#event-url').removeClass('hide-event-url').find('a').attr('href', response.data.eventUrl).text(response.data.eventUrl);
- if ( $is_creation ) {
- $('#delete-button').toggle();
- }
- $gp.notices.success(response.data.message);
- }
- },
- error: function(error) {
- $gp.notices.error(response.data.message);
- }
- });
- });
+ $( '.delete-event' ).on(
+ 'click',
+ function ( e ) {
+ e.preventDefault();
+ handleDelete()
+ }
+ );
+ }
+ );
+
+ function handleSubmit() {
+ if ( $( '#event-end' ).val() <= $( '#event-start' ).val() ) {
+ $gp.notices.error( 'Event end date and time must be later than event start date and time.' );
+ return;
+ }
+ const btnClicked = $( this ).data( 'event-status' );
+ if ( btnClicked === 'publish' && '' === $( '#event-id' ).val() ) {
+ const submitPrompt = 'Are you sure you want to publish this event?';
+ if ( ! confirm( submitPrompt ) ) {
+ return;
+ }
+ }
+ $( '#event-form-action' ).val( btnClicked );
+ const $form = $( '.translation-event-form' );
+ const $is_creation = $( '#form-name' ).val() === 'create_event';
- $('.delete-event').on('click', function(e) {
- e.preventDefault();
+ $.ajax(
+ {
+ type: 'POST',
+ url: $translation_event.url,
+ data:$form.serialize(),
+ success: function ( response ) {
+ if ( response.data.eventId ) {
+ history.replaceState( '', '', response.data.eventEditUrl );
+ $( '#form-name' ).val( 'edit_event' );
+ $( '.event-page-title' ).text( 'Edit Event' );
+ $( '#event-id' ).val( response.data.eventId );
+ if ( btnClicked === 'publish' ) {
+ $( 'button[data-event-status="draft"]' ).hide();
+ $( 'button[data-event-status="publish"]' ).text( 'Update Event' );
+ }
+ if ( btnClicked === 'draft' ) {
+ $( 'button[data-event-status="draft"]' ).text( 'Update Draft' );
+ }
+ $( '#event-url' ).removeClass( 'hide-event-url' ).find( 'a' ).attr( 'href', response.data.eventUrl ).text( response.data.eventUrl );
+ if ( $is_creation ) {
+ $( '#delete-button' ).toggle();
+ }
+ $gp.notices.success( response.data.message );
+ }
+ },
+ error: function ( error ) {
+ $gp.notices.error( response.data.message );
+ }
+ }
+ );
+ }
+
+ function handleDelete() {
if ( ! confirm( 'Are you sure you want to delete this event?' ) ) {
return;
}
- var $form = $('.translation-event-form');
- $('#form-name').val('delete_event');
- $('#event-form-action').val( 'delete' );
- $.ajax({
- type: 'POST',
- url: $translation_event.url,
- data:$form.serialize(),
- success: function(response) {
- window.location = response.data.eventDeleteUrl;
- },
- error: function(error) {
- $gp.notices.error(response.data.message);
- },
- });
- });
- function validateEventDates() {
- var startDateTimeInput = $('#event-start');
- var endDateTimeInput = $('#event-end');
- if ( ! startDateTimeInput.length || ! endDateTimeInput.length ) {
- return;
- }
+ const $form = $( '.translation-event-form' );
+ $( '#form-name' ).val( 'delete_event' );
+ $( '#event-form-action' ).val( 'delete' );
+ $.ajax(
+ {
+ type: 'POST',
+ url: $translation_event.url,
+ data:$form.serialize(),
+ success: function ( response ) {
+ window.location = response.data.eventDeleteUrl;
+ },
+ error: function ( error ) {
+ $gp.notices.error( response.data.message );
+ },
+ }
+ );
+ }
- startDateTimeInput.add(endDateTimeInput).on('input', function () {
- endDateTimeInput.prop('min', startDateTimeInput.val());
- if (endDateTimeInput.val() < startDateTimeInput.val()) {
- endDateTimeInput.val(startDateTimeInput.val());
- }
- });
- }
- function selectUserTimezone() {
- document.querySelector(`#event-timezone option[value="${Intl.DateTimeFormat().resolvedOptions().timeZone}"]`).selected = true
- }
+ function validateEventDates() {
+ const startDateTimeInput = $( '#event-start' );
+ const endDateTimeInput = $( '#event-end' );
+ if ( ! startDateTimeInput.length || ! endDateTimeInput.length ) {
+ return;
+ }
- function convertToUserLocalTime() {
- var timeElements = document.querySelectorAll('time.event-utc-time');
- if ( timeElements.length === 0 ) {
- return;
- }
- timeElements.forEach(function(timeEl) {
- var eventDateObj = new Date( timeEl.getAttribute('datetime') );
- var userTimezoneOffset = new Date().getTimezoneOffset();
- var userTimezoneOffsetMs = userTimezoneOffset * 60 * 1000;
- var userLocalDateTime = new Date(eventDateObj.getTime() - userTimezoneOffsetMs);
+ startDateTimeInput.add( endDateTimeInput ).on(
+ 'input',
+ function () {
+ endDateTimeInput.prop( 'min', startDateTimeInput.val() );
+ if (endDateTimeInput.val() < startDateTimeInput.val()) {
+ endDateTimeInput.val( startDateTimeInput.val() );
+ }
+ }
+ );
+ }
+ function selectUserTimezone() {
+ const timezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
+ // phpcs:disable WordPress.WhiteSpace.OperatorSpacing.NoSpaceBefore
+ // phpcs:disable WordPress.WhiteSpace.OperatorSpacing.NoSpaceAfter
+ document.querySelector( `#event-timezone option[value="${timezone}"]` ).selected = true
+ // phpcs:enable
+ }
- var options = { weekday: 'short', year: 'numeric', month: 'long', day: 'numeric', hour: 'numeric', minute: 'numeric', hour12: true, timeZoneName: 'short' };
+ function convertToUserLocalTime() {
+ const timeElements = document.querySelectorAll( 'time.event-utc-time' );
+ if ( timeElements.length === 0 ) {
+ return;
+ }
+ timeElements.forEach(
+ function ( timeEl ) {
+ const eventDateObj = new Date( timeEl.getAttribute( 'datetime' ) );
+ const userTimezoneOffset = new Date().getTimezoneOffset();
+ const userTimezoneOffsetMs = userTimezoneOffset * 60 * 1000;
+ const userLocalDateTime = new Date( eventDateObj.getTime() - userTimezoneOffsetMs );
- timeEl.textContent = userLocalDateTime.toLocaleString('en-US', options);
- });
- }
+ const options = {
+ weekday: 'short',
+ year: 'numeric',
+ month: 'long',
+ day: 'numeric',
+ hour: 'numeric',
+ minute: 'numeric',
+ hour12: true,
+ timeZoneName: 'short'
+ };
-});
-}( jQuery, $gp )
+ timeEl.textContent = userLocalDateTime.toLocaleString( 'en-US', options );
+ }
+ );
+ }
+ }( jQuery, $gp )
);
diff --git a/phpcs.xml b/phpcs.xml
index f4a862c2..c7904ecf 100644
--- a/phpcs.xml
+++ b/phpcs.xml
@@ -3,8 +3,9 @@