Rating stars on the pop up Rating stars on the pop up
 

News:

cpg1.5.48 Security release - upgrade mandatory!
The Coppermine development team is releasing a security update for Coppermine in order to counter a recently discovered vulnerability. It is important that all users who run version cpg1.5.46 or older update to this latest version as soon as possible.
[more]

Main Menu

Rating stars on the pop up

Started by allvip, September 04, 2015, 09:26:16 AM

Previous topic - Next topic

0 Members and 1 Guest are viewing this topic.

allvip

I want to place the displayimage.php rating stars on the pop up image.
Thanks.

Αndré

With "pop up image" you mean the full-sized view?

allvip


Αndré

This seems to be more complicated than I initially thought. I added the following code to the function "theme_display_fullsize_pic", right after the globals:
    global $CURRENT_PIC_DATA, $CURRENT_ALBUM_DATA;

    $result = cpg_db_query("SELECT title, comments, votes, category, aid FROM {$CONFIG['TABLE_ALBUMS']} WHERE aid='{$CURRENT_PIC_DATA['aid']}' LIMIT 1");

    if (!mysql_num_rows($result)) {
        cpg_die(CRITICAL_ERROR, sprintf($lang_errors['pic_in_invalid_album'], $CURRENT_PIC_DATA['aid']), __FILE__, __LINE__);
    }

    $CURRENT_ALBUM_DATA = mysql_fetch_assoc($result);
    mysql_free_result($result);

    $votes = theme_html_rating_box();



Additionally, I added
script type="text/javascript" src="js/displayimage.js"></script>
to the HTML head.


Currently, the JavaScript part fails, as the js_vars array is missing. It's probably a good idea to copy the rating part out of displayimage.js to a new js file and include this instead of displayimage.js, but I've currently no time to check this.

allvip

Is this ok for the rating.js:



// When the document is ready

$(document).ready(function() {
    // Display the stars
    displayStars();

/**
* This part is the rating part of displayimage.php
*/
function rate(obj) {
    $.get('ratepic.php?rate=' + obj.title + '&pic=' + js_vars.picture_id + '&form_token=' + js_vars.form_token
            + '&timestamp=' + js_vars.timestamp, function(data) {
        //create a JSON object of the returned data
        var json_data = eval('(' + data + ')');
        //check the data and respond upon it
        js_vars.lang_rate_pic = json_data.msg;
        if(json_data.status == 'success') {
            //vote cast, update rating and show user
            js_vars.rating = json_data.new_rating;
            js_vars.can_vote = "false";
            $('#voting_title').html( json_data.new_rating_text );
        }
        displayStars();
    });
}

function changeover(obj) {
    var id = obj.title;
    for(i=0; i<id; i++) {
        $('#' + js_vars.picture_id + '_' + (i+1)).attr('src', js_vars.theme_dir + 'images/rate_new.png');
    }
}

function changeout(obj) {
    var id = obj.title;
    for(i=0; i<id; i++) {
        var img = js_vars.theme_dir + 'images/rate_full.png';
        if(js_vars.rating <= i) {
            img = js_vars.theme_dir + 'images/rate_empty.png';
        }
        $('#' + js_vars.picture_id + '_' + (i+1)).attr('src', img);
    }
}

function displayStars() {
    if(js_vars.stars_amount != 'fallback') {
        $('#star_rating').empty();
        var center = document.createElement('center');
        center.id = 'rs_center';
        if(js_vars.can_vote == 'true') {
            center.innerHTML = js_vars.lang_rate_pic + '<br />';
        }
        center.innerHTML += buildRating();
        $('#star_rating').append(center);
    } else if(js_vars.can_vote == 'false') {
        $('#star_rating').empty();
        var center = document.createElement('center');
        center.id = 'rs_center';
        center.innerHTML += buildRating();
        $('#star_rating').append(center);
    }
}

function buildRating() {
    var rating_stars = '';

    if(!isNumber(js_vars.stars_amount)) {
        //default to 5 stars
        js_vars.stars_amount = 5;
    }
    if (!js_vars.theme_dir) {
        js_vars.theme_dir = '';
    }
    for(i=0; i < js_vars.stars_amount; i++ ) {
        var star11 = 'rate_full';
        var star12 = 'rate_new';
        if(i > js_vars.rating - 1) {
            star11 = star12 = 'rate_empty';
        }
        if(js_vars.can_vote == 'true') {
            rating_stars += '<img style="cursor:pointer" src="' + js_vars.theme_dir + 'images/' + star11 + '.png" id="' + js_vars.picture_id + '_'+(i+1)+'"'
            rating_stars += ' title="' + (i+1) + '" onmouseout="changeout(this)" onmouseover="changeover(this)" onclick="rate(this)" />';
        } else {
            rating_stars += '<img src="' + js_vars.theme_dir + 'images/' + star11 + '.png" alt="' + js_vars.rating + '" title="' + js_vars.rating + '"/>';
        }
    }
    return rating_stars;
}

function isNumber(val) {
    return /^-?((\d+\.?\d?)|(\.\d+))$/.test(val);
}



allvip

For Andre: please, 1000 PLEASE.
Help me with this.

Αndré

No need to bump this topic, I'll have a look as soon as possible.