v1.6.0

CHANGELOG.md

@@ -1,3 +1,13 @@
+= 1.6.0 =
+
+Enhancements:
+
+* Allow users to collect extra points for previous months' badges.
+
+Under the hood:
+
+* Ravi's Recommendations are now a custom post type.
+
 = 1.5.0 =
 
 Added these recommendations from Ravi:

assets/css/admin.css

@@ -137,8 +137,6 @@
 			}
 		}
 	}
-
-
 }
 
 .prpl-hidden {
@@ -281,7 +279,6 @@ button.prpl-info-icon {
 	}
 }
 
-
 /*------------------------------------*\
   Buttons
 \*------------------------------------*/
@@ -481,3 +478,33 @@ button.prpl-info-icon {
 	grid-template-columns: repeat(2, 1fr);
 	gap: var(--prpl-padding);
 }
+
+/*------------------------------------*\
+	Loader.
+	See https://cssloaders.github.io/ for more.
+\*------------------------------------*/
+.prpl-loader {
+	width: 48px;
+	height: 48px;
+	border: 5px solid #fff;
+	border-bottom-color: transparent;
+	border-radius: 50%;
+	display: inline-block;
+	box-sizing: border-box;
+	animation: rotation 1s linear infinite;
+	z-index: 20;
+	position: absolute;
+	top: calc(50% - 24px);
+	left: calc(50% - 24px);
+}
+
+@keyframes rotation {
+
+	0% {
+		transform: rotate(0deg);
+	}
+
+	100% {
+		transform: rotate(360deg);
+	}
+}

assets/css/dashboard-widgets/score.css

@@ -3,7 +3,7 @@
 /**
  * Admin widget.
  *
- * Dependencies: progress-planner/web-components/prpl-suggested-task, progress-planner/web-components/prpl-badge
+ * Dependencies: progress-planner/suggested-task, progress-planner/web-components/prpl-badge
  */
 #progress_planner_dashboard_widget_score {
 

assets/css/page-widgets/suggested-tasks.css

@@ -3,7 +3,7 @@
 /**
  * Suggested tasks widget.
  *
- * Dependencies: progress-planner/web-components/prpl-suggested-task, progress-planner/web-components/prpl-badge
+ * Dependencies: progress-planner/suggested-task, progress-planner/web-components/prpl-badge
  */
 
 .prpl-widget-wrapper.prpl-suggested-tasks {
@@ -96,16 +96,19 @@
 
 .prpl-dashboard-widget-suggested-tasks {
 
+	&:not(:has(.prpl-suggested-tasks-loading)):not(:has(.prpl-suggested-tasks-list li)) {
+
+		.prpl-no-suggested-tasks {
+			display: block;
+		}
+	}
+
 	&:has(.prpl-suggested-tasks-list li) {
 
 		.prpl-widget-title {
 			display: flex;
 		}
 
-		.prpl-no-suggested-tasks {
-			display: none;
-		}
-
 		hr {
 			display: block;
 		}
@@ -116,11 +119,16 @@
 		display: none;
 	}
 
-	.prpl-no-suggested-tasks {
-		display: block;
+	.prpl-no-suggested-tasks,
+	.prpl-suggested-tasks-loading {
+		display: none;
 		background-color: var(--prpl-background-green);
 		padding: calc(var(--prpl-padding) / 2);
 	}
+
+	.prpl-suggested-tasks-loading {
+		display: block;
+	}
 }
 
 .prpl-suggested-tasks-list {
@@ -132,11 +140,8 @@
 		border-bottom: none;
 	}
 
-	prpl-suggested-task:nth-child(odd) {
-
-		.prpl-suggested-task {
-			background-color: #f9fafb;
-		}
+	.prpl-suggested-task:nth-child(odd) {
+		background-color: #f9fafb;
 	}
 
 	/* If task has disabled checkbox it's title should be italic. */
@@ -223,7 +228,6 @@
 	flex-direction: column;
 	justify-content: space-between;
 
-
 	.progress-label {
 		display: inline-block;
 	}
@@ -544,7 +548,6 @@
 					}
 				}
 
-
 				/* Checkmark */
 				.prpl-custom-control::after {
 					content: "";

assets/css/page-widgets/todo.css

@@ -1,7 +1,7 @@
 /**
  * TODOs widget.
  *
- * Dependencies: progress-planner/web-components/prpl-suggested-task
+ * Dependencies: progress-planner/suggested-task
  */
 
 .prpl-widget-wrapper.prpl-todo {
@@ -145,7 +145,6 @@
 		}
 	}
 
-
 	#create-todo-item {
 		padding: 0 16px;
 	}
@@ -192,3 +191,22 @@
 		display: none;
 	}
 }
+
+#todo-list {
+
+	&:has(.prpl-loader) {
+		position: relative;
+
+		&::before {
+			content: "";
+			display: block;
+			width: 100%;
+			height: 100%;
+			background-color: rgba(0, 0, 0, 0.2);
+			position: absolute;
+			top: 0;
+			left: 0;
+			z-index: 10;
+		}
+	}
+}

assets/css/page-widgets/whats-new.css

@@ -25,7 +25,6 @@
 			}
 		}
 
-
 		img {
 			width: 100%;
 		}

assets/css/settings-page.css

@@ -48,8 +48,6 @@
 				padding: var(--prpl-settings-page-gap) var(--prpl-settings-page-gap) 2rem var(--prpl-settings-page-gap);
 			}
 		}
-
-
 	}
 
 	.prpl-settings-section-title {
@@ -108,7 +106,6 @@
 			}
 		}
 
-
 		.item-actions,
 		.prpl-select-page {
 			display: flex;
@@ -251,7 +248,6 @@
 
 }
 
-
 /* License */
 .prpl-column-license {
 
@@ -298,7 +294,6 @@
 
 }
 
-
 /* Grid layout for wrapper for:
 - Valuable post types
 - Default login destination

assets/css/web-components/prpl-suggested-task.css → assets/css/suggested-task.css

@@ -211,8 +211,6 @@
 			}
 
 		}
-
-
 	}
 
 	&[data-task-action="celebrate"] {

assets/css/upgrade-tasks.css

@@ -40,7 +40,6 @@
 		}
 	}
 
-
 	.prpl-onboarding-task-status {
 		display: block;
 		width: 1.5rem;

assets/js/celebrate.js

@@ -4,7 +4,7 @@
  *
  * A script that triggers confetti on the container element.
  *
- * Dependencies: particles-confetti
+ * Dependencies: particles-confetti, progress-planner/suggested-task
  */
 /* eslint-disable camelcase */
 
@@ -13,7 +13,7 @@ document.addEventListener( 'prpl/celebrateTasks', ( event ) => {
 	/**
 	 * Trigger the confetti on the container element.
 	 */
-	const containerElement = event.detail?.element
+	const containerEl = event.detail?.element
 		? event.detail.element.closest( '.prpl-suggested-tasks-list' )
 		: document.querySelector(
 				'.prpl-widget-wrapper.prpl-suggested-tasks .prpl-suggested-tasks-list'
@@ -30,14 +30,14 @@ document.addEventListener( 'prpl/celebrateTasks', ( event ) => {
 
 	const prplRenderAttemptshoot = () => {
 		// Get the tasks list position
-		const origin = containerElement
+		const origin = containerEl
 			? {
 					x:
-						( containerElement.getBoundingClientRect().left +
-							containerElement.offsetWidth / 2 ) /
+						( containerEl.getBoundingClientRect().left +
+							containerEl.offsetWidth / 2 ) /
 						window.innerWidth,
 					y:
-						( containerElement.getBoundingClientRect().top + 50 ) /
+						( containerEl.getBoundingClientRect().top + 50 ) /
 						window.innerHeight,
 			  }
 			: { x: 0.5, y: 0.3 }; // fallback if list not found
@@ -83,75 +83,23 @@ document.addEventListener( 'prpl/celebrateTasks', ( event ) => {
 	setTimeout( prplRenderAttemptshoot, 0 );
 	setTimeout( prplRenderAttemptshoot, 100 );
 	setTimeout( prplRenderAttemptshoot, 200 );
-
-	/**
-	 * Strike completed tasks.
-	 */
-	document.dispatchEvent( new CustomEvent( 'prpl/strikeCelebratedTasks' ) );
-
-	// Remove celebrated tasks and add them to the completed tasks.
-	setTimeout( () => {
-		document.dispatchEvent(
-			new CustomEvent( 'prpl/markTasksAsCompleted' )
-		);
-	}, 2000 );
-} );
-
-/**
- * Mark tasks as completed.
- */
-document.addEventListener( 'prpl/markTasksAsCompleted', ( event ) => {
-	const taskList = event.detail?.taskList || 'prplSuggestedTasks';
-	document
-		.querySelectorAll( '.prpl-suggested-task-celebrated' )
-		.forEach( ( item ) => {
-			const task_id = item.getAttribute( 'data-task-id' );
-			const providerID = item.getAttribute( 'data-task-provider-id' );
-			const category = item.getAttribute( 'data-task-category' );
-			const el = document.querySelector(
-				`.prpl-suggested-task[data-task-id="${ task_id }"]`
-			);
-
-			if ( el ) {
-				el.parentElement.remove();
-			}
-
-			// Get the task index.
-			let taskIndex = false;
-			window[ taskList ].tasks.forEach( ( taskItem, index ) => {
-				if ( taskItem.task_id === task_id ) {
-					taskIndex = index;
-				}
-			} );
-
-			// Mark the task as completed.
-			if ( false !== taskIndex ) {
-				window[ taskList ].tasks[ taskIndex ].status = 'completed';
-			}
-
-			// Refresh the list.
-			document.dispatchEvent(
-				new CustomEvent( 'prpl/suggestedTask/maybeInjectItem', {
-					detail: {
-						task_id,
-						providerID,
-						category,
-					},
-				} )
-			);
-		} );
 } );
 
 /**
- * Strike completed tasks.
+ * Remove tasks from the DOM.
+ * The task will be striked through, before removed, if it has points.
  */
-document.addEventListener( 'prpl/strikeCelebratedTasks', () => {
+document.addEventListener( 'prpl/removeCelebratedTasks', () => {
 	document
 		.querySelectorAll(
 			'.prpl-suggested-task[data-task-action="celebrate"]'
 		)
 		.forEach( ( item ) => {
+			// Triggers the strikethrough animation.
 			item.classList.add( 'prpl-suggested-task-celebrated' );
+
+			// Remove the item from the DOM.
+			setTimeout( () => item.remove(), 2000 );
 		} );
 } );
 
@@ -163,9 +111,7 @@ document.addEventListener( 'prpl/celebrateTasks', () => {
 		'#adminmenu #toplevel_page_progress-planner .update-plugins'
 	);
 	if ( points ) {
-		points.forEach( ( point ) => {
-			point.remove();
-		} );
+		points.forEach( ( point ) => point.remove() );
 	}
 } );
 

assets/js/external-link-accessibility-helper.js

@@ -118,9 +118,9 @@ prplDocumentReady( () => {
 } );
 
 // Recheck the accessibility of the page when a new task is injected.
-document.addEventListener( 'prpl/suggestedTask/injectItem', () => {
+document.addEventListener( 'prpl/suggestedTask/itemInjected', () => {
 	// Wait for the new task to be added to the DOM.
 	setTimeout( () => {
 		externalLinkHelper.applyAccessibility();
-	}, 500 );
+	}, 10 );
 } );