Progress bar

[ruudvh]

This is not an issue, more like an enhancement.
But a progress bar for the project, probably based on the task added vs tasks completed, would be a great enhancement to the project.

Something like this.
PHP:

/**
* Count all tasks for specific project and display a progressbar
*/
function cp_progressbar_tasks( $project_id = 0 ){
    global $wpdb;
    $meta_key = '_cp-project-id';
    $meta_value = $project_id;
    $post_type = 'cp-tasks';

    $completedtasks_sql = "SELECT p.ID
    FROM $wpdb->postmeta pm
    JOIN $wpdb->posts p ON (p.ID = pm.post_id)
    WHERE pm.meta_key = '$meta_key'
    AND pm.meta_value = '$meta_value'
    AND p.post_type = '$post_type'
    AND p.post_status = 'publish';
    ";
    $completedtasks = $wpdb->get_col($wpdb->prepare($completedtasks_sql));

    $task_status_list = array();
    foreach ( $completedtasks as $item ) {
        $task_status = cp_get_task_status( $item );
        $task_status_list[] = $task_status;
    }

    $totaltasks = count ($task_status_list);
    $completedtasks = count( array_keys( $task_status_list, "complete" ));

    if ( $totaltasks > 0 AND $completedtasks !== $totaltasks ) {
        $result = '<div id="progress-bar" class="all-rounded">';
        $result .= '<div id="progress-bar-percentage" class="all-rounded" style="width: ';
        $result .= (($completedtasks / $totaltasks) * 100);
        $result .= '%">';
        $result .= '<span>';
        $result .= (($completedtasks / $totaltasks) * 100);
        $result .= '%</span>';
        $result .= '</div></div>';
        echo $result;
    } elseif ( $totaltasks > 0 AND $completedtasks == $totaltasks ) {
        $result = '<div id="progress-bar" class="all-rounded">';
        $result .= '<div id="progress-bar-percentage" class="all-rounded" style="width: 100%">';
        $result .= '<span>All task have been completed!</span>';
        $result .= '</div></div>';
        echo $result;
    }
}

CSS:

/* Progress Bar ---------------------------------------- */
.project-progress {
    float: right;
    margin: 1.71429rem 0;
    width: 275px;
    margin-bottom: 10px;
}
.project-progress-dashboard {
    width: 100px;
    margin-bottom: -5px;
}
.all-rounded {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}
.spacer {
    display: block;
}
#progress-bar {
    width: 100%;
    background: #cccccc;
    position: relative;
}
#progress-bar-percentage {
    background: #3063A5;
    color: #FFF;
    text-align: center;
    height: 20px;
}
#progress-bar-percentage span {
    display: inline-block;
    position: absolute;
    width: 100%;
    left: 0;
}

I'm not a programmer, so please excuse my mistakes.

[ruudvh]

For one who wants to stay with jQuery UI.

Include the progress bar:

<div id="progressbar"></div>

Initialize the progress bar:

//Progress bar
$( "#progressbar" ).progressbar({
    value: <?php cp_count_complete_tasks( cp_get_project_id() ); ?>,
    max: <?php cp_count_tasks( cp_get_project_id() ); ?>
});

Count all task and tasklist:

/**
* Count all tasks for specific project
*/
function cp_count_tasks( $project_id = 0 ){
    global $wpdb;
    $meta_key = '_cp-project-id';
    $meta_value = $project_id;
    $post_type = 'cp-tasks';

    $completedtasks_sql = "SELECT p.ID
    FROM $wpdb->postmeta pm
    JOIN $wpdb->posts p ON (p.ID = pm.post_id)
    WHERE pm.meta_key = '$meta_key'
    AND pm.meta_value = '$meta_value'
    AND p.post_type = '$post_type'
    AND p.post_status = 'publish';
    ";
    $completedtasks = $wpdb->get_col($wpdb->prepare($completedtasks_sql));

    $task_status_list = array();
    foreach ( $completedtasks as $item ) {
        $task_status = cp_get_task_status( $item );
        $task_status_list[] = $task_status;
    }

    $totaltasks = count ($task_status_list);
    echo $totaltasks;
}

/**
* Count all completed tasks for specific project
*/
function cp_count_complete_tasks( $project_id = 0 ){
    global $wpdb;
    $meta_key = '_cp-project-id';
    $meta_value = $project_id;
    $post_type = 'cp-tasks';

    $completedtasks_sql = "SELECT p.ID
    FROM $wpdb->postmeta pm
    JOIN $wpdb->posts p ON (p.ID = pm.post_id)
    WHERE pm.meta_key = '$meta_key'
    AND pm.meta_value = '$meta_value'
    AND p.post_type = '$post_type'
    AND p.post_status = 'publish';
    ";
    $completedtasks = $wpdb->get_col($wpdb->prepare($completedtasks_sql));

    $task_status_list = array();
    foreach ( $completedtasks as $item ) {
        $task_status = cp_get_task_status( $item );
        $task_status_list[] = $task_status;
    }

    $completedtasks = count( array_keys( $task_status_list, "complete" ));
    echo $completedtasks;
}

[williamsba]

Thanks for the contribution! I would highly suggest using WP_Query vs a custom database query.

http://codex.wordpress.org/Class_Reference/WP_Query

[ruudvh]

Thank you!
I was thinking about using WP_Query, but doesn't WP_Query pull the entire post? If true, this seem a bit unnecessary?

[williamsba]

True. If all you want is post IDs you could use get_posts() and specify the parameter 'fields' => 'ID'. That will only return IDs, and not the entire post data.

[boonebgorges]

The performance hit from loading all post data in this case will be very
minimal, as the page will be loaded very infrequently (as opposed to a
public-facing page).

It's a good idea to use WP_Query where possible for a number of reasons.
In this case, the notable reason is that WP will then take care of all
necessary caching (both persistent caching and the slurping up of
metadata and terms that are needed by CP), which is likely to outweigh
any decrease in overhead you get from doing a direct query. :)

On 06/24/13 10:46, Brad Williams wrote:

True. If all you want is post IDs you could use get_posts() and specify
the parameter 'fields' => 'ID'. That will only return IDs, and not the
entire post data.

—
Reply to this email directly or view it on GitHub
#88 (comment).

[Fund2Me]

Hi everyone, thanks for the contribution. But somehow i can't get it working. I have tried both codes in my content-single-project.php and also added the css definitions in new.css, without success. Could you give me a hint?!