Skip to content

Commit

Permalink
Merge pull request #124 from Emilia-Capital/refactor/dashboard-widget…
Browse files Browse the repository at this point in the history 
…/score

Refactor the `score` dashboard widget
  • Loading branch information
@aristath
aristath authored Nov 14, 2024
2 parents 44e83b0 + 7c047f4 commit 79e4b82
Show file tree
Hide file tree
Showing 6 changed files with 41 additions and 98 deletions.
8 changes: 8 additions & 0 deletions assets/css/dashboard-widgets/score.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,14 @@
display: grid;
grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
grid-gap: calc(var(--prpl-gap) / 2);

> div {
border: 1px solid var(--prpl-color-gray-2);
border-radius: var(--prpl-border-radius);
font-size: 0.875rem;
text-align: center;
padding-bottom: 1em;
}
}

h3 {
Expand Down
17 changes: 8 additions & 9 deletions classes/admin/class-dashboard-widget-score.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,18 +35,17 @@ protected function get_title() {
*/
public function render_widget() {
// Enqueue stylesheets.
\progress_planner()->get_admin__page()->register_scripts();
\progress_planner()->get_admin__page()->enqueue_styles();
\wp_enqueue_script( 'progress-planner-web-components-gauge' );
\wp_enqueue_script( 'progress-planner-suggested-tasks' );
\wp_enqueue_style(
'prpl-widget-suggested-tasks',
PROGRESS_PLANNER_URL . '/assets/css/page-widgets/suggested-tasks.css',
[],
(string) filemtime( PROGRESS_PLANNER_DIR . '/assets/css/page-widgets/suggested-tasks.css' )
);

foreach ( [ 'badge-streak', 'activity-scores' ] as $handle ) {
$stylesheet = "/assets/css/page-widgets/{$handle}.css";
\wp_enqueue_style(
'prpl-widget-' . $handle,
PROGRESS_PLANNER_URL . $stylesheet,
[],
(string) filemtime( PROGRESS_PLANNER_DIR . $stylesheet )
);
}
\wp_enqueue_style(
'prpl-dashboard-widget-' . $this->id,
PROGRESS_PLANNER_URL . "/assets/css/dashboard-widgets/{$this->id}.css",
Expand Down
9 changes: 0 additions & 9 deletions classes/widgets/class-activity-scores.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -53,15 +53,6 @@ public function get_color( $number, $date ) {
return '#f43f5e';
}

/**
* Print the score gauge.
*
* @return void
*/
public function print_score_gauge() {
\progress_planner()->the_view( 'page-widgets/parts/activity-scores-gauge.php' );
}

/**
* Get the score.
*
Expand Down
80 changes: 20 additions & 60 deletions views/dashboard-widgets/score.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,72 +5,32 @@
* @package Progress_Planner
*/

$prpl_show_badges = (
\progress_planner()->get_admin__dashboard_widget_score()->get_badge_details( 'content' )['progress']['progress'] ||
\progress_planner()->get_admin__dashboard_widget_score()->get_badge_details( 'maintenance' )['progress']['progress']
);

?>
<div class="prpl-dashboard-widget<?php echo ( $prpl_show_badges ) ? ' show-badges' : ''; ?>">
<div class="prpl-score-gauge" style="--background: #fff">
<?php \progress_planner()->get_widgets__activity_scores()->print_score_gauge(); ?>
<div class="prpl-dashboard-widget">
<div>
<prpl-gauge background="#fff" color="var(--prpl-color-accent-orange)" contentFontSize="var(--prpl-font-size-4xl)">
<progress max="<?php echo (int) \Progress_Planner\Badges\Monthly::TARGET_POINTS; ?>" value="<?php echo (float) \progress_planner()->get_admin__page()->get_widget( 'suggested-tasks' )->get_score(); ?>">
<?php \progress_planner()->get_badges()->get_badge( 'monthly-' . gmdate( 'Y' ) . '-m' . (int) gmdate( 'm' ) )->the_icon( true ); ?>
</progress>
</prpl-gauge>
<?php \esc_html_e( 'Monthly badge', 'progress-planner' ); ?>
</div>

<prpl-gauge background="var(--prpl-background-orange)" color="var(--prpl-color-accent-orange)" contentFontSize="var(--prpl-font-size-4xl)">
<progress max="<?php echo (int) \Progress_Planner\Badges\Monthly::TARGET_POINTS; ?>" value="<?php echo (float) \progress_planner()->get_admin__page()->get_widget( 'suggested-tasks' )->get_score(); ?>">
<?php \progress_planner()->get_badges()->get_badge( 'monthly-' . gmdate( 'Y' ) . '-m' . (int) gmdate( 'm' ) )->the_icon( true ); ?>
</progress>
</prpl-gauge>
<div>
<prpl-gauge background="#fff" color="<?php echo esc_attr( \progress_planner()->get_admin__page()->get_widget( 'activity-scores' )->get_gauge_color( \progress_planner()->get_admin__page()->get_widget( 'activity-scores' )->get_score() ) ); ?>">
<progress max="100" value="<?php echo (float) \progress_planner()->get_admin__page()->get_widget( 'activity-scores' )->get_score(); ?>">
<?php echo \esc_html( \progress_planner()->get_admin__page()->get_widget( 'activity-scores' )->get_score() ); ?>
</progress>
</prpl-gauge>
<?php \esc_html_e( 'Website activity score', 'progress-planner' ); ?>
</div>
</div>

<div class="prpl-dashboard-widget-latest-activities">
<h3><?php \esc_html_e( 'Latest activity', 'progress-planner' ); ?></h3>
<hr style="margin: 1em 0">

<?php
$prpl_latest_activities = \progress_planner()->get_query()->get_latest_activities( 2 );
$prpl_activity_type_map = [
'content-publish' => __( 'Published content', 'progress-planner' ),
'content-update' => __( 'Updated content', 'progress-planner' ),
'content-delete' => __( 'Deleted content', 'progress-planner' ),
'maintenance-activate_plugin' => __( 'Activated a plugin', 'progress-planner' ),
'maintenance-deactivate_plugin' => __( 'Deactivated a plugin', 'progress-planner' ),
'maintenance-install_plugin' => __( 'Installed a plugin', 'progress-planner' ),
'maintenance-uninstall_plugin' => __( 'Uninstalled a plugin', 'progress-planner' ),
'maintenance-update_plugin' => __( 'Updated a plugin', 'progress-planner' ),
'maintenance-activate_theme' => __( 'Activated a theme', 'progress-planner' ),
'maintenance-deactivate_theme' => __( 'Deactivated a theme', 'progress-planner' ),
'maintenance-install_theme' => __( 'Installed a theme', 'progress-planner' ),
'maintenance-uninstall_theme' => __( 'Uninstalled a theme', 'progress-planner' ),
'maintenance-update_theme' => __( 'Updated a theme', 'progress-planner' ),
'maintenance-update_core' => __( 'Updated WordPress Core', 'progress-planner' ),
'todo-add' => __( 'Added a task to the to-do list', 'progress-planner' ),
'todo-update' => __( 'Updated a task in the to-do list', 'progress-planner' ),
'todo-delete' => __( 'Deleted a task from the to-do list', 'progress-planner' ),
];
?>
<ul>
<?php foreach ( $prpl_latest_activities as $prpl_activity ) : ?>
<li>
<span class="activity-type">
<?php
if ( isset( $prpl_activity_type_map[ $prpl_activity->category . '-' . $prpl_activity->type ] ) ) {
echo \esc_html( $prpl_activity_type_map[ $prpl_activity->category . '-' . $prpl_activity->type ] );
} elseif ( 'content' === $prpl_activity->category ) {
\esc_html_e( 'Updated content', 'progress-planner' );
} elseif ( 'maintenance' === $prpl_activity->category ) {
\esc_html_e( 'Site maintenance', 'progress-planner' );
} elseif ( 'todo' === $prpl_activity->category ) {
\esc_html_e( 'Updated To-do list', 'progress-planner' );
}
?>
</span>
<span class="activity-date">
<?php echo \esc_html( \date_i18n( \get_option( 'date_format' ), strtotime( $prpl_activity->date->format( 'Y-m-d' ) ) ) ); ?>
</span>
</li>
<?php endforeach; ?>
</ul>
</div>
<h3><?php \esc_html_e( 'Ravi\'s recommendations', 'progress-planner' ); ?></h3>
<ul style="display:none"><?php \progress_planner()->the_view( 'views/suggested-tasks-item.php' ); ?></ul>
<ul class="prpl-suggested-tasks-list"></ul>

<div class="prpl-dashboard-widget-footer">
<img src="<?php echo \esc_attr( PROGRESS_PLANNER_URL . '/assets/images/icon_progress_planner.svg' ); ?>" style="width:1.5em;" alt="" />
Expand Down
6 changes: 5 additions & 1 deletion views/page-widgets/activity-scores.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,11 @@ class="prpl-info-icon"
</h2>

<div style="--background: var(--prpl-background-orange)">
<?php \progress_planner()->the_view( 'page-widgets/parts/activity-scores-gauge.php' ); ?>
<prpl-gauge background="var(--prpl-background-orange)" color="<?php echo esc_attr( $prpl_widget->get_gauge_color( $prpl_widget->get_score() ) ); ?>" contentFontSize="var(--prpl-font-size-6xl)">
<progress max="100" value="<?php echo (float) $prpl_widget->get_score(); ?>">
<?php echo \esc_html( $prpl_widget->get_score() ); ?>
</progress>
</prpl-gauge>
</div>

<hr>
Expand Down
19 changes: 0 additions & 19 deletions views/page-widgets/parts/activity-scores-gauge.php
View file

This file was deleted.

0 comments on commit 79e4b82

Please sign in to comment.