Notes with Ravinder on Badging System Development Part II

Neo · January 1, 2019, 4:31am

Part II: Current PHP file Beta 73 Not Optimized:

<?php
$version = 73;
$query = "SELECT * FROM " . TABLE_PREFIX . "user WHERE userid='" . $uid . "'";
$usertable = $db->query_read_slave($query);
$modaluser = $db->fetch_array($usertable);
$modaluser['joindate_formatted'] = gmdate("d F Y", $modaluser['joindate']);
$modaluser['checking_formatted'] = number_format($modaluser['credits']);
$modaluser['savings_formatted'] = number_format($modaluser['credits_saved']);
$total_bits = $modaluser['credits'] + $modaluser['credits_saved'];
$modaluser['total_bits_formatted'] = number_format($total_bits);
$modaluser['total_thanks_formatted'] = number_format($modaluser['post_thanks_thanked_times']);
$modaluser['total_thanks_given_formatted'] = number_format($modaluser['post_thanks_user_amount']);
$modaluser['total_thanked_posts_formatted'] = number_format($modaluser['post_thanks_thanked_posts']);
$f_query = "SELECT * FROM " . TABLE_PREFIX . "userfield WHERE userid='" . $uid . "'";
$userfields = $db->query_read_slave($f_query);
$modaluserfields = $db->fetch_array($userfields);

$query_csa = "SELECT * FROM " . TABLE_PREFIX . "neo_csa_session_manager WHERE user_id='" . $uid . "'";
$user_csa_row = $db->query_read_slave($query_csa);
$usercsa = $db->fetch_array($user_csa_row);

if ($usercsa['country'] == '') {
    if ($modaluser['country_iso2'] != '') {
        $usercsa['country'] = $modaluser['country_iso2'] . " (Legacy)";
    } else {
        $usercsa['country'] = 'TBD - Waiting for Update';
    }
}
if ($usercsa['ip_address'] == '') {
    if ($modaluser['ipaddress'] != '') {
        $usercsa['ip_address'] = $modaluser['ipaddress'] . " (Legacy)";
    } else {
        $usercsa['ip_address'] = 'TBD - Waiting for Update';
    }
}

if ($usercsa['user_agent'] == '') {
    $usercsa['user_agent'] = 'TBD - Waiting for Update';
}

if ($usercsa[riskscore] == '') {
    $usercsa[riskscore] = 'TBD';
}

if ($usercsa[hitcount] == '') {
    $usercsa[hitcount] = 'TBD';
}

$a_query = "SELECT SUM(visible) AS totalpics FROM album WHERE userid='" . $uid . "'";
$pics = $db->query_read_slave($a_query);
$userpics = $db->fetch_array($pics);

$at_query = "SELECT COUNT(attachmentid) AS totalattachments FROM attachment WHERE userid='" . $uid . "'";
$attachs = $db->query_read_slave($at_query);
$userattachments = $db->fetch_array($attachs);

$pm_query = 'SELECT COUNT(pmtextid) AS count ' .
    'FROM ' . pm .
    ' WHERE userid = "' . $uid . '"';
$userpm = $vbulletin->db->query_first($pm_query);

$sub_query = 'SELECT COUNT(threadid) AS count ' .
    'FROM ' . subscribethread .
    ' WHERE userid = "' . $uid . '"';
$usersubs = $vbulletin->db->query_first($sub_query);
$color = array();
$mbclass = array();

if ($modaluser['posts'] > 1000) {
    $color['fauser'] = 'black';
} elseif ($modaluser['posts'] > 500) {
    $color['fauser'] = 'indigo';
} elseif ($modaluser['posts'] > 100) {
    $color['fauser'] = 'blue';
} elseif ($modaluser['posts'] > 10) {
    $color['fauser'] = 'limegreen';
} else {
    $color['fauser'] = 'lightgray';
}

/******************************* REFERENCE ONLY NOT USED  CAN  DELETE
if ($modaluser['posts'] > 1000) {
    $mbclass['fauser'] = 'mb-4';
} elseif ($modaluser['posts'] > 500) {
    $mbclass['fauser'] = 'mb-3';
} elseif ($modaluser['posts'] > 100) {
    $mbclass['fauser'] = 'mb-3';
} elseif ($modaluser['posts'] > 10) {
    $mbclass['fauser'] = 'mb-1';
} else {
    $mbclass['fauser'] = 'mb-0';
}
*****************************/


$color['faaward'] = 'lightgray';
if ($modaluser['posts'] > 0) {
    $color['faaward'] = 'limegreen';
}

$color['fajediorder'] = 'lightgray';
if ($modaluser['posts'] > 99) {
    $color['fajediorder'] = 'blue';
}

$color['faphoenix'] = 'lightgray';
if ($modaluser['posts'] > 499) {
    $color['faphoenix'] = 'indigo';
}

$color['fajedi'] = 'lightgray';
if ($modaluser['posts'] > 999) {
    $color['fajedi'] = 'black';
}

$color['faatom'] = 'lightgray';
if ($modaluser['posts'] > 9999) {
    $color['faatom'] = 'black';
}

$mods = array('6', '10');
$banned = '11';
$color['fascale'] = 'lightgray';
if (in_array($modaluser['usergroupid'], $mods)) {
    $color['fascale'] = 'black';
} elseif ($modaluser['usergroupid'] == $banned) {
    $color['fascale'] = 'red';
} else {
    $color['fascale'] = 'lightgray';
}

$orderofthecrab = '37898';

if ($uid == $orderofthecrab) {
    $color['facrab'] = 'black';
} else {
    $color['facrab'] = 'lightgray';
}

$orderofthewizard = array('43551', '302136317');

if (in_array($uid, $orderofthewizard)) {
    $color['fawizard'] = 'black';
} else {
    $color['fawizard'] = 'lightgray';
}

$admins = array('1');
$color['fabuilding'] = 'lightgray';
if (in_array($modaluser['userid'], $admins)) {
    $color['fabuilding'] = 'black';
}

$ug = array('6', '10', '13');
$color['fabishop'] = 'lightgray';
if (in_array($modaluser['usergroupid'], $ug)) {
    $color['fabishop'] = 'black';
}

$devops = array('1', '39016', '302063521');
$color['facity'] = 'lightgray';
if (in_array($modaluser['userid'], $devops)) {
    $color['facity'] = 'black';
}

$forumideas = array('1', '39016', '302063521', '302148617');
$color['faflask'] = 'lightgray';
if (in_array($modaluser['userid'], $forumideas)) {
    $color['faflask'] = 'black';
}

$color['fathumbsup'] = 'lightgray';
$color['fatrophy'] = 'lightgray';
$color['fachalkboardteacher'] = 'lightgray';
$color['fashieldalt'] = 'lightgray';
$color['fastroopwafel'] = 'lightgray';
$color['fafirstorderalt'] = 'lightgray';

if ($modaluser['post_thanks_thanked_times'] > 0) {
    $color['fathumbsup'] = 'limegreen';
}

if ($modaluser['post_thanks_thanked_times'] > 99) {
    $color['fathumbsup'] = 'blue';
    $color['fatrophy'] = 'black';
}

if ($modaluser['post_thanks_thanked_times'] > 999) {
    $color['fathumbsup'] = 'indigo';
    $color['fachalkboardteacher'] = 'black';
}

if ($modaluser['post_thanks_thanked_times'] > 1999) {
    $color['fathumbsup'] = 'black';
    $color['fashieldalt'] = 'black';
}

if ($modaluser['post_thanks_thanked_times'] > 2999) {
    $color['fastroopwafel'] = 'black';
}

if ($modaluser['post_thanks_thanked_times'] > 3999) {
    $color['fafirstorderalt'] = 'black';
}

$idfields = 0;
if ($modaluserfields['field1']) {
    $idfields++;
}
if ($modaluserfields['field2']) {
    $idfields++;
}
if ($modaluserfields['field3']) {
    $idfields++;
}
if ($modaluserfields['field4']) {
    $idfields++;
}

switch ($idfields) {
    case 0:
        $color['faidbadge'] = 'lightgray';
        break;
    case 1:
        $color['faidbadge'] = 'limegreen';
        break;
    case 2:
        $color['faidbadge'] = 'blue';
        break;
    case 3:
        $color['faidbadge'] = 'indigo';
        break;
    case 4:
        $color['faidbadge'] = 'black';
        break;
}

$contacts = 0;
if ($show['pm']) {
    $contacts++;
}
if ($show['email']) {
    $contacts++;
}

if ($modaluser[homepage]) {
    $contacts++;
}

switch ($contacts) {
    case 0:
        $color['faaddressbook'] = 'lightgray';
        break;
    case 1:
        $color['faaddressbook'] = 'limegreen';
        break;
    case 2:
        $color['faaddressbook'] = 'blue';
        break;
    case 3:
        $color['faaddressbook'] = 'black';
        break;
    default:
        $color['faaddressbook'] = 'lightgray';
}

$color['fabtc'] = 'lightgray';
$color['fauniversity'] = 'lightgray';

if ($total_bits < -20000) {
    $color['fabtc'] = 'red';
} elseif ($total_bits < 0) {
    $color['fabtc'] = 'dark orange';
}

if ($total_bits > 0) {
    $color['fabtc'] = 'limegreen';
}

if ($total_bits > 100000) {
    $color['fabtc'] = 'blue';
}

if ($total_bits > 1000000) {
    $color['fabtc'] = 'indigo';
}

if ($total_bits > 10000000) {
    $color['fabtc'] = 'black';
    $color['fauniversity'] = 'blue';
}

if ($total_bits > 100000000) {
    $color['fauniversity'] = 'black';
}

$color['fausergraduate'] = 'lightgray';
$time_inactive = time() - $modaluser['lastactivity'];
$week = 7 * 24 * 60 * 60;
$month = 4 * $week;
$quarter = $week * (52 / 4);
$halfyear = $week * (52 / 2);
$year = $week * 52;
$twoyears = 2 * $year;
$threeyears = 3 * $year;

if ($time_inactive < $week) {
    $color['fausergraduate'] = 'black';
} elseif ($time_inactive < $month) {
    $color['fausergraduate'] = 'indigo';
} elseif ($time_inactive < $quarter) {
    $color['fausergraduate'] = 'blue';
} elseif ($time_inactive < $halfyear) {
    $color['fausergraduate'] = 'limegreen';
} elseif ($time_inactive < $year) {
    $color['fausergraduate'] = 'lightgray';
} elseif ($time_inactive < $twoyears) {
    $color['fausergraduate'] = 'darkorange';
} elseif ($time_inactive < $threeyears) {
    $color['fausergraduate'] = 'red';
}

$color['fabolt'] = 'lightgray';
$activity = floatval($prepared['postsperday']);
if ($activity < 0.02) {
    $color['fabolt'] = 'red';
} elseif ($activity < 0.1) {
    $color['fabolt'] = 'darkorange';
} elseif ($activity < 0.5) {
    $color['fabolt'] = 'limegreen';
} elseif ($activity < 1.0) {
    $color['fabolt'] = 'blue';
} elseif ($activity < 2.0) {
    $color['fabolt'] = 'indigo';
} else {
    $color['fabolt'] = 'black';
}

$queryc = "SELECT COUNT(threadid) AS threadcount FROM thread WHERE postuserid='" . $uid . "'";
$resultsc = $db->query_first_slave($queryc);
if ($resultsc['threadcount'] > 500) {
    $color['faknight'] = 'black';
} elseif ($resultsc['threadcount'] > 250) {
    $color['faknight'] = 'indigo';
} elseif ($resultsc['threadcount'] > 100) {
    $color['faknight'] = 'blue';
} elseif ($resultsc['threadcount'] > 1) {
    $color['faknight'] = 'limegreen';
} else {
    $color['faknight'] = 'lightgray';
}

if ($userattachments['totalattachments'] > 500) {
    $color['fadownload'] = 'black';
} elseif ($userattachments['totalattachments'] > 100) {
    $color['fadownload'] = 'indigo';
} elseif ($userattachments['totalattachments'] > 10) {
    $color['fadownload'] = 'blue';
} elseif ($userattachments['totalattachments'] > 1) {
    $color['fadownload'] = 'limegreen';
} else {
    $color['fadownload'] = 'lightgray';
}

if (true) {
    $queryt = "SELECT COUNT(tagid) AS tagcount FROM tagthread WHERE userid =" . $uid;
    $resultst = $db->query_first_slave($queryt);
    if ($resultst['tagcount'] > 10000) {
        $color['fatags'] = 'black';
    } elseif ($resultst['tagcount'] > 1000) {
        $color['fatags'] = 'indigo';
    } elseif ($resultst['tagcount'] > 100) {
        $color['fatags'] = 'blue';
    } elseif ($resultst['tagcount'] > 1) {
        $color['fatags'] = 'limegreen';
    } else {
        $color['fatags'] = 'lightgray';
    }
}

$query = "SELECT views AS threadhits FROM thread WHERE postuserid=" . $uid . " ORDER BY views DESC  LIMIT 1";
$results = $db->query_first_slave($query);
if ($results['threadhits'] > 100000) {
    $color['faeye'] = 'black';
} elseif ($results['threadhits'] > 50000) {
    $color['faeye'] = 'indigo';
} elseif ($results['threadhits'] > 10000) {
    $color['faeye'] = 'blue';
} elseif ($results['threadhits'] > 1000) {
    $color['faeye'] = 'limegreen';
} else {
    $color['faeye'] = 'lightgray';
}

$queryi = "SELECT ipoints AS infractions FROM user WHERE userid =" . $uid;
$resultsi = $db->query_first_slave($queryi);
if ($resultsi['infractions'] >= 30 || $modaluser['usergroupid'] == 11) {
    $color['fainfraction'] = 'red';
} elseif ($resultsi['infractions'] < 30 && $results['infractions'] >= 10) {
    $color['fainfraction'] = 'orangered';
} elseif ($resultsi['infractions'] < 10 && $results['infractions'] >= 7) {
    $color['fainfraction'] = 'limegreen';
} elseif ($resultsi['infractions'] < 7 && $results['infractions'] >= 5) {
    $color['fainfraction'] = 'blue';
} elseif ($resultsi['infractions'] < 5 && $results['infractions'] > 0) {
    $color['fainfraction'] = 'indigo';
} else {
    $color['fainfraction'] = 'black';
}

if (true) {
    $queryTG = "SELECT post_thanks_user_amount AS thanks_given FROM user WHERE userid =" . $uid;
    $resultsTG = $db->query_first_slave($queryTG);
    if ($resultsTG['thanks_given'] > 0 && $resultsTG['thanks_given'] < 50) {
        $color['fathanks_given'] = 'limegreen';
    } elseif ($resultsTG['thanks_given'] < 500 && $resultsTG['thanks_given'] >= 50) {
        $color['fathanks_given'] = 'blue';
    } elseif ($resultsTG['thanks_given'] < 1000 && $resultsTG['thanks_given'] >= 500) {
        $color['fathanks_given'] = 'indigo';
    } elseif ($resultsTG['thanks_given'] > 1000) {
        $color['fathanks_given'] = 'black';
    } else {
        $color['fathanks_given'] = 'red';
    }
}

$badgejs = '<script>';
$badgejs .= 'var badge = [];';
$badgejs .= 'badge["posts"] = "' . $color[fauser] . '";';
$badgejs .= 'badge["firstpost"] = "' . $color[faaward] . '";';
$badgejs .= 'badge["100posts"] = "' . $color[fajediorder] . '";';
$badgejs .= 'badge["500posts"] = "' . $color[faphoenix] . '";';
$badgejs .= 'badge["1000posts"] = "' . $color[fajedi] . '";';
$badgejs .= 'badge["10000posts"] = "' . $color[faatom] . '";';
$badgejs .= 'badge["mod"] = "' . $color[fascale] . '";';
$badgejs .= 'badge["admin"] = "' . $color[fabuilding] . '";';
$badgejs .= 'badge["ug"] = "' . $color[fabishop] . '";';
$badgejs .= 'badge["devops"] = "' . $color[facity] . '";';
$badgejs .= 'badge["formulator"] = "' . $color[faflask] . '";';
$badgejs .= 'badge["totalposts"] = "' . number_format($modaluser[posts]) . '";';
$badgejs .= 'badge["thanked"] = "' . $color['fathumbsup'] . '";';
$badgejs .= 'badge["100thanked"] = "' . $color['fatrophy'] . '";';
$badgejs .= 'badge["1000thanked"] = "' . $color['fachalkboardteacher'] . '";';
$badgejs .= 'badge["2000thanked"] = "' . $color['fashieldalt'] . '";';
$badgejs .= 'badge["3000thanked"] = "' . $color['fastroopwafel'] . '";';
$badgejs .= 'badge["4000thanked"] = "' . $color['fafirstorderalt'] . '";';
$badgejs .= 'badge["profile"] = "' . $color['faidbadge'] . '";';
$badgejs .= 'badge["contact"] = "' . $color['faaddressbook'] . '";';
$badgejs .= 'badge["contacttotal"] = "' . $contacts . '";';
$badgejs .= 'badge["profilenumber"] = "' . $idfields . '";';
$badgejs .= 'badge["fabtc"] = "' . $color['fabtc'] . '";';
$badgejs .= 'badge["fauniversity"] = "' . $color['fauniversity'] . '";';
$badgejs .= 'badge["bits"] = "' . number_format($total_bits) . '";';
$badgejs .= 'badge["activity"] = "' . $color['fausergraduate'] . '";';
$badgejs .= 'badge["ppd"] = "' . $color['fabolt'] . '";';
$badgejs .= 'badge["ppdval"] = "' . $activity . '";';
$badgejs .= 'badge["starter"] = "' . $color['faknight'] . '";';
$badgejs .= 'badge["starterval"] = "' . $resultsc['threadcount'] . '";';
$badgejs .= 'badge["fadownload"] = "' . $color['fadownload'] . '";';
$badgejs .= 'badge["fadownloadval"] = "' . $userattachments['totalattachments'] . '";';
$badgejs .= 'badge["fatags"] = "' . $color['fatags'] . '";';
$badgejs .= 'badge["fatagsval"] = "' . number_format($resultst['tagcount']) . '";';
$badgejs .= 'badge["faeye"] = "' . $color['faeye'] . '";';
$badgejs .= 'badge["faeyeval"] = "' . number_format($results['threadhits']) . '";';
$badgejs .= 'badge["facrab"] = "' . $color['facrab'] . '";';
$badgejs .= 'badge["fawizard"] = "' . $color['fawizard'] . '";';
$badgejs .= 'badge["fainfraction"] = "' . $color['fainfraction'] . '";';
$badgejs .= 'badge["fainfractionval"] = "' . number_format($resultsi['infractions']) . '";';
$badgejs .= 'badge["fathanks_given"] = "' . $color['fathanks_given'] . '";';
$badgejs .= 'badge["fathanks_givenval"] = "' . number_format($resultsTG['thanks_given']) . '";';
$badgejs .= '</script>';

Neo · January 1, 2019, 4:34am

Part II: Current HTML grid for Beta 73 and Link to jQuery file:

jQuery:

https://www.unix.com/scripts/js/badge.js?v=73

HTML Grid file: fa-badges-grid

<style>
  .fa-badge-grid {
    font-size:1.5em;
 
  }
.row{
margin:10px 0px 10px 0px;
}

</style>
 <div class="container fa-badge-grid">
    <div class="row">
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-address-book fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fab fa-apple fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-atom fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-award fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-balance-scale  fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-code-branch fa-stack-1x"></i>
        </div>
    </div>

    <div class="row">
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="far fa-eye fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-bolt fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-hat-wizard fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fab fa-btc fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-bug fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-building fa-stack-1x"></i>
        </div>
    </div>


    <div class="row">
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-chalkboard-teacher fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-chess-bishop fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-chess-rook fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-chess-knight fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto mb-posts" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-child fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-city fa-stack-1x"></i>
        </div>
    </div>

    <div class="row">
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-code fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-cogs fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-comment fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-database fa-stack-1x"></i>
        </div>
         <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-desktop fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-download fa-stack-1x"></i>
        </div>
    </div>


    <div class="row">
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-keyboard fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fab fa-first-order-alt fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-pastafarianism fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-flask fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-crow fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-id-badge fa-stack-1x"></i>
        </div>
    </div>


    <div class="row">
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-dragon fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-jedi fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fab fa-jedi-order fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-laptop-code fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-hippo fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-birthday-cake fa-stack-1x"></i>
        </div>
    </div>

    <div class="row">
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-terminal fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-spider fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fab fa-phoenix-squadron fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-project-diagram fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-puzzle-piece fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-tags fa-stack-1x"></i>
        </div>
    </div>

    <div class="row">
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-shield-alt fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-stroopwafel fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-thumbs-up fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-trophy fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-university fa-stack-1x"></i>
        </div>
        <div class="fa-stack col p-auto" style="vertical-align: top;">
            <i class="far fa-circle fa-stack-2x"></i>
            <i class="fas fa-user-graduate fa-stack-1x"></i>
        </div>
    </div>

</div>
<script>
$(function() {
  $(window).on("resize", neoBadgeGrid);
  neoBadgeGrid();
  function neoBadgeGrid() {
    var myWidth = $(window).width();
    if (myWidth > 900) {
        $(".fa-badge-grid").css({ "font-size": "2em" });
      }
    else if (myWidth < 600) {
      $(".fa-badge-grid").css({ "font-size": "1em" });
    } else  {
      $(".fa-badge-grid").css({ "font-size": "1.5em" });
    }
  }
$('.col').find('.far, .fas, .fab').css({"color":"LightGray"});
});

</script>

Neo · January 1, 2019, 7:29am

Just created a Patreon sponsorship badge for the forums, which is for current VIP members and future Patreon sponsors.

In addition, after we finishing the badging page I going to set of a Patreon grid for all qualified forum members who have Patreon accounts.

<?php
$vipgroups = array('14', '17');
$patreonBlack = array();
$patreonIndigo = array();
$patreonBlue = array();
$patreonLimeGreen = array();
if (in_array($modaluser['usergroupid'], $vipgroups) || in_array($modaluser['userid'], $patreonBlue)) {
    $color['fapatreon'] = 'blue';
} elseif (in_array($modaluser['userid'], $patreonLimeGreen)) {
    $color['fapatreon'] = 'limegreen';
} elseif (in_array($modaluser['userid'], $patreonBlack)) {
    $color['fapatreon'] = 'blue';
} elseif (in_array($modaluser['userid'], $patreonIndigo)) {
    $color['fapatreon'] = 'indigo';
} elseif (in_array($modaluser['userid'], $patreonBlack)) {
    $color['fapatreon'] = 'black';
} else {
    $color['fapatreon'] = 'lightgray';
}

$('.fa-patreon').css("color",badge["fapatreon"]);
$('.fa-patreon').css("cursor","pointer").attr("title",  "Patreon Sponsor or VIP Member");
$('.fa-patreon').closest('div').find('.fa-circle').css("color",badge["fapatreon"];

)

13 prototype badges out of 48 done..... 12 left.

RavinderSingh13 · January 1, 2019, 11:53am

Hello Neo,

I have created code snippet for badge for a user completing anniversary on forums. I have put a condition here which validates that if a user is NOT ACTIVE from last 1 year OR user has NOT completed a year itself, then only he should be other than RED badge. Also I have made use of your previously used variable named $time_inactive along with $year here too.

<?php
$query = "SELECT TIME_TO_SEC(TIMEDIFF(NOW(), FROM_UNIXTIME('jointime')))/(3600*24) AS 'join_time' FROM users WHERE userid =" . $uid;
$results = $db->query_first_slave($query);
if ($time_inactive < $year){
  if ($results['join_time'] > 0 && $results['join_time']<1) { 
        $color['fajoin_time'] = 'orangered'; 
  } elseif ($results['join_time']<2 && $results['join_time']>=1) {
        $color['fajoin_time'] = 'darkorange';
  } elseif ($results['join_time']<3 && $results['join_time']>=2) {
        $color['fajoin_time'] = 'lightgray';
  } elseif ($results['join_time']<4 && $results['join_time']>=3) {
        $color['fajoin_time'] = 'limegreen';
  }
    elseif ($results['join_time']<5 && $results['join_time']>=4) {
        $color['fajoin_time'] = 'blue';
  }
    elseif ($results['join_time']<10 && $results['join_time']>=5) {
        $color['fajoin_time'] = 'indigo';
  }
    elseif ($results['join_time']>=10) {
        $color['fajoin_time'] = 'black';
  }
  else  { 
    $color['fajoin_time'] = 'red'; 
  }
}
else  { 
    $color['fajoin_time'] = 'red'; 
}


$badgejs .= 'badge["fajoin_time"] = "' . $color['fajoin_time'] . '";';  
$badgejs .= 'badge["fajoin_timeval"] = "' . number_format($results['join_time']) . '";';

jQuery: I haven't changed "chess-rook" name here, you could please select it as per availability of icons.

$('.fa-chess-rook').css("color",badge["fajoin_time"]);
$('.fa-chess-rook').css("cursor","pointer").attr("title", badge["fajoin_time"] + " Days in UNIX.com forums");
$('.fa-chess-rook').closest('div').find('.fa-circle').css("color",badge["fajoin_time]);

I have checked php code's syntax on online syntax checker in link PHP Code Checker - Syntax Check for Common PHP Mistakes and it didn't find ay issues in it.

NOTE: To validate query stuff I created a dummy schema and table in my vmware test machine and filled some dummy data entry in it to check query mentioned and looked ok there.

Thanks,
R. Singh

Neo · January 1, 2019, 12:12pm

Thank Ravinder. FYI, this code gives a MySQL error:

invalid SQL:
SELECT TIME_TO_SEC(TIMEDIFF(NOW(), FROM_UNIXTIME('jointime')))/(3600*24) AS 'join_time' FROM users WHERE userid =1;

Neo · January 1, 2019, 12:14pm

OK, I see the problem... your table name should be user and not users :

mysql> SELECT TIME_TO_SEC(TIMEDIFF(NOW(), FROM_UNIXTIME('jointime')))/(3600*24) AS 'join_time' FROM user WHERE userid =1;
+-----------+
| join_time |
+-----------+
|   34.9583 |
+-----------+
1 row in set, 2 warnings (0.00 sec)

Neo · January 1, 2019, 12:33pm

Hey Ravinder,

I installed your code with a Font Awesome clock for now .... something is wrong with your fancy query... it gives 35 for everyone I tried, LOL

<?php
$query = "SELECT TIME_TO_SEC(TIMEDIFF(NOW(), FROM_UNIXTIME('jointime')))/(3600*24) AS 'join_time' FROM user WHERE userid =" . $uid; 
$results = $db->query_first_slave($query); 
if ($time_inactive < $year) { 
    if ($results['join_time'] > 0 && $results['join_time'] < 1) { 
        $color['fajoin_time'] = 'orangered'; 
    } elseif ($results['join_time'] < 2 && $results['join_time'] >= 1) { 
        $color['fajoin_time'] = 'darkorange'; 
    } elseif ($results['join_time'] < 3 && $results['join_time'] >= 2) { 
        $color['fajoin_time'] = 'lightgray'; 
    } elseif ($results['join_time'] < 4 && $results['join_time'] >= 3) { 
        $color['fajoin_time'] = 'limegreen'; 
    } elseif ($results['join_time'] < 5 && $results['join_time'] >= 4) { 
        $color['fajoin_time'] = 'blue'; 
    } elseif ($results['join_time'] < 10 && $results['join_time'] >= 5) { 
        $color['fajoin_time'] = 'indigo'; 
    } elseif ($results['join_time'] >= 10) { 
        $color['fajoin_time'] = 'black'; 
    } else { 
        $color['fajoin_time'] = 'red'; 
    } 
} else { 
    $color['fajoin_time'] = 'red'; 

$badgejs .= 'badge["fajoin_time"] = "' . $color['fajoin_time'] . '";';   
$badgejs .= 'badge["fajoin_timeval"] = "' . number_format($results['join_time']) . '";'; 
}

jQuery:

$('.fa-clock').css("color",badge["fajoin_time"]);
$('.fa-clock').css("cursor","pointer").attr("title",  badge["fajoin_timeval"] + " Days Active at UNIX.COM");
$('.fa-clock').closest('div').find('.fa-circle').css("color",badge["fajoin_time"]);

Neo · January 1, 2019, 12:42pm

Hey Ravinder,

Your fancy query is broken... even I I put xxxxx as the field in the query, I get the same wrong answer:

mysql> SELECT TIME_TO_SEC(TIMEDIFF(NOW(), FROM_UNIXTIME('xxxxx')))/(3600*24) AS 'join_time' FROM user WHERE userid =1;
+-----------+
| join_time |
+-----------+
|   34.9583 |
+-----------+
1 row in set, 2 warnings (0.00 sec)

mysql> SELECT TIME_TO_SEC(TIMEDIFF(NOW(), FROM_UNIXTIME('WHAT_THE_F')))/(3600*24) AS 'join_time' FROM user WHERE userid =1;
+-----------+
| join_time |
+-----------+
|   34.9583 |
+-----------+
1 row in set, 2 warnings (0.00 sec)

This is why I write SQL queries that a 12 year old can understand. LOL

Yours looks really clever, but is broken.

I kindly suggest you rewrite your query to perform the logic outside of the SQL query; but it is up to you. I will wait for your next attempt.

Thanks and good try!

PS: You might earn your Dev Ops Team Badge sooner than I thought .. Haha

Neo · January 1, 2019, 12:53pm

Anyway.. Ravinder,

I don't think you should try to convert the UNIXTIME to a DATE format.

Just take time() minus the joindate from the table (in UNIXTIME) and subtract them and divide by the number of days in seconds to get the number of days. No need to convert to DATE format.

Or whatever you like, but your query is broken... try again

PS: There is no field in the user table called " jointime " as in your original query. Please check your table definition. Hint:

mysql> select joindate from user where userid =1;
+-----------+
| joindate  |
+-----------+
| 968947200 |
+-----------+
1 row in set (0.00 sec)

Neo · January 1, 2019, 1:04pm

Hey Ravinder.

If I were you, I would do this query:

mysql> select joindate from user where userid =1;

Take that result subtracted from today in UNIXTIME and divide by the number of seconds in year.

That gives you the number of years a person has been a member.

You don't need that fancy MySQL query with all the date / time functions for such a trivial requirement.

As you are beginner in programming, keep it simple... well, I suggest you keep it simple all your life; it's easier to debug or change when you look at the code in 10 years..... keep it simple. Do not be seduced by fancy queries and logic which look cool.... like many programmers and tech people do.

Keep it simple so that a 10th grader can understand it.

Neo · January 1, 2019, 1:19pm

One more clue before I sleep ...

$modaluser['joindate']

You do not need a new SQL query for this badge

Neo · January 1, 2019, 1:55pm

Hey Ravinder,

I already fixed and rearranged your code and it is working now:

$time_join = time() - $modaluser['joindate'];
$years_a_member = $time_join / $year;

if ($time_inactive < $year) { 
    if ($years_a_member > 0 && $time_inactive < 1) { 
        $color['fajoin_time'] = 'orangered'; 
    } elseif ($years_a_member < 2 && $years_a_member  >= 1) { 
        $color['fajoin_time'] = 'darkorange'; 
    } elseif ($years_a_member < 3 && $years_a_member  >= 2) { 
        $color['fajoin_time'] = 'lightgray'; 
    } elseif ($years_a_member < 4 && $years_a_member  >= 3) { 
        $color['fajoin_time'] = 'limegreen'; 
    } elseif ($years_a_member < 5 && $years_a_member  >= 4) { 
        $color['fajoin_time'] = 'blue'; 
    } elseif ($years_a_member < 10 && $years_a_member >= 5) { 
        $color['fajoin_time'] = 'indigo'; 
    } elseif ($years_a_member >= 10) { 
        $color['fajoin_time'] = 'black'; 
    } else { 
        $color['fajoin_time'] = 'red'; 
    } 
} else { 
    $color['fajoin_time'] = 'red'; 
} 

$badgejs .= 'badge["fajoin_time"] = "' . $color['fajoin_time'] . '";';   
$badgejs .= 'badge["fajoin_timeval"] = "' . number_format($years_a_member) . '";';

jQuery:

$('.fa-clock').css("color",badge["fajoin_time"]);
$('.fa-clock').css("cursor","pointer").attr("title",  badge["fajoin_timeval"] + " Years Active at UNIX.COM");
$('.fa-clock').closest('div').find('.fa-circle').css("color",badge["fajoin_time"]);

This is a great badge you came up with. I really like it. Very useful too. Only 11 more to go for this phase of rapid prototype development!

Thanks for trying on this (you were close!) . ... I look forward to your next badge!

What is the next, great, Ravinder Singh idea for a badge?

RavinderSingh13 · January 1, 2019, 7:38pm

neo:

Hey Ravinder,
I already fixed and rearranged your code and it is working now:

$time_join = time() - $modaluser['joindate'];
$years_a_member = $time_join / $year;
if ($time_inactive < $year) { 
   if ($years_a_member > 0 && $time_inactive < 1) { 
   $color['fajoin_time'] = 'orangered'; 
   } elseif ($years_a_member < 2 && $years_a_member  >= 1) { 
   $color['fajoin_time'] = 'darkorange'; 
   } elseif ($years_a_member < 3 && $years_a_member  >= 2) { 
   $color['fajoin_time'] = 'lightgray'; 
   } elseif ($years_a_member < 4 && $years_a_member  >= 3) { 
   $color['fajoin_time'] = 'limegreen'; 
   } elseif ($years_a_member < 5 && $years_a_member  >= 4) { 
   $color['fajoin_time'] = 'blue'; 
   } elseif ($years_a_member < 10 && $years_a_member >= 5) { 
   $color['fajoin_time'] = 'indigo'; 
   } elseif ($years_a_member >= 10) { 
   $color['fajoin_time'] = 'black'; 
   } else { 
   $color['fajoin_time'] = 'red'; 
   } 
} else { 
   $color['fajoin_time'] = 'red'; 
} 

$badgejs .= 'badge["fajoin_time"] = "' . $color['fajoin_time'] . '";';   
$badgejs .= 'badge["fajoin_timeval"] = "' . number_format($years_a_member) . '";';

jQuery:

$('.fa-clock').css("color",badge["fajoin_time"]);
$('.fa-clock').css("cursor","pointer").attr("title",  badge["fajoin_timeval"] + " Years Active at UNIX.COM");
$('.fa-clock').closest('div').find('.fa-circle').css("color",badge["fajoin_time"]);

This is a great badge you came up with. I really like it. Very useful too. Only 11 more to go for this phase of rapid prototype development!
Thanks for trying on this (you were close!) . ... I look forward to your next badge!
What is the next, great, Ravinder Singh idea for a badge?

Thanks a TON Neo for fixing it. Thanks for appreciation on badge it boosted me up now. Will let you/all know once I get another thought of badge

Thanks,
R. Singh

Neo · January 1, 2019, 11:20pm

Hi Ravinder,

Please keep in mind that this also will work, is easier to read, and it a lot shorter:

$time_join = time() - $modaluser['joindate'];
$years_a_member = $time_join / $year;

if ($time_inactive < $year) { 
    if ($years_a_member >= 10) { 
        $color['fajoin_time'] = 'black'; 
    } 
    elseif ($years_a_member >= 5) { 
        $color['fajoin_time'] = 'indigo'; 
    }
    elseif ($years_a_member  >= 4) { 
        $color['fajoin_time'] = 'blue'; 
    }
    elseif ($years_a_member  >= 3) { 
        $color['fajoin_time'] = 'limegreen'; 
    }
    elseif ($years_a_member  >= 2) { 
        $color['fajoin_time'] = 'lightgray'; 
    }
    elseif ($years_a_member  >= 1) { 
        $color['fajoin_time'] = 'darkorange'; 
    } 
     else { 
        $color['fajoin_time'] = 'red'; 
    } 
} else { 
    $color['fajoin_time'] = 'red'; 
} 

$badgejs .= 'badge["fajoin_time"] = "' . $color['fajoin_time'] . '";';   
$badgejs .= 'badge["fajoin_timeval"] = "' . number_format($years_a_member) . '";';

At this point, I am thinking that soon we should move to a new phase of rapid prototype development if we cannot easily think of new badges. No need to waste time on the final 20% when when are 80% there, more-or-less.

So, if we do not have any ideas for additional badges now, we can just leave the as-is (reserved) and move on.

Or maybe you have some more badge ideas?

So far, it is only you and me with badge ideas, so no need to wait for other UG members to come up with badge logic

Neo · January 1, 2019, 11:25pm

OBTW, I got Bootstrap tooltips working in the modal for the grid:

RavinderSingh13 · January 1, 2019, 11:42pm

Hello Neo,

Yes, I do have 3 to 4 thoughts as follows but thinking of logic of them as of now.

1- On THANKS per post ratio, lets say 1 person is getting every 1.1 post 1 THANKS so as per that ratio badges.
2- On continuously logging days in forums one(not sure if we are keeping some information save in tables here?).
3- Monthly top thanks getting people badges(here also we need to save information somewhere, you could please let me know if we are saving this somewhere in forums?).

May be more to come

Thanks,
R. Singh

Neo · January 2, 2019, 12:01am

Thanks / Post ratio is easy, obviously since we have that data already in the grid. But this badge may not be a good idea because it could discourage people to post if they are not posting in main forums. Plus, the number of posts and thanks is already in other badges, so I'm not really keen on just badging a ratio between the two.
Tracking consecutive days with forum activity may require a new DB field or a localStorage JS var in the users browser. I am guessing it is best to to this in PHP and create some new PHP logic on the DB side.
Tracking monthly thanks may is easy... see next post for example query:

Neo · January 2, 2019, 4:48am

Hey Ravinder, we can do your badge about monthly thanks based on this query!!

No need to add more backend PHP code or DB fields!

Examples:

mysql> select SUM(post_thanks_amount) from post where userid=1 and dateline > (UNIX_TIMESTAMP() -3600*24*30);
+-------------------------+
| SUM(post_thanks_amount) |
+-------------------------+
|                     128 |
+-------------------------+
1 row in set (0.01 sec)

mysql> select SUM(post_thanks_amount) from post where userid=302122727 and dateline > (UNIX_TIMESTAMP() -3600*24*30);
+-------------------------+
| SUM(post_thanks_amount) |
+-------------------------+
|                      29 |
+-------------------------+
1 row in set (0.00 sec)

You did not have this table:

mysql> describe post;
+--------------------+----------------------+------+-----+---------+----------------+
| Field              | Type                 | Null | Key | Default | Extra          |
+--------------------+----------------------+------+-----+---------+----------------+
| postid             | int(10) unsigned     | NO   | PRI | NULL    | auto_increment |
| threadid           | int(10) unsigned     | NO   | MUL | 0       |                |
| username           | varchar(100)         | NO   |     |         |                |
| userid             | int(10) unsigned     | NO   | MUL | 0       |                |
| title              | varchar(250)         | NO   | MUL |         |                |
| dateline           | int(11)              | NO   | MUL | 0       |                |
| pagetext           | mediumtext           | YES  |     | NULL    |                |
| allowsmilie        | smallint(6)          | NO   |     | 0       |                |
| showsignature      | smallint(6)          | NO   |     | 0       |                |
| ipaddress          | varchar(45)          | NO   | MUL | NULL    |                |
| iconid             | smallint(5) unsigned | NO   |     | 0       |                |
| visible            | smallint(6)          | NO   | MUL | 0       |                |
| topic              | int(3)               | NO   |     | 0       |                |
| parentid           | int(10) unsigned     | NO   |     | 0       |                |
| attach             | smallint(5) unsigned | NO   |     | 0       |                |
| infraction         | smallint(5) unsigned | NO   |     | 0       |                |
| reportthreadid     | int(10) unsigned     | NO   |     | 0       |                |
| post_thanks_amount | int(10) unsigned     | NO   |     | 0       |                |
| b8rating           | float                | YES  |     | NULL    |                |
| postkeywords       | varchar(128)         | YES  |     | NULL    |                |
| description        | varchar(256)         | YES  |     | NULL    |                |
| googlebotlastvisit | int(11)              | NO   |     | 0       |                |
| bingbotlastvisit   | int(11)              | NO   |     | 0       |                |
+--------------------+----------------------+------+-----+---------+----------------+
23 rows in set (0.00 sec)

Neo · January 2, 2019, 4:59am

Ravinder, maybe we can badge this "posts in the last month, or week) query;

What do you think?

mysql> select COUNT(postid) from post where userid=1 and dateline > (UNIX_TIMESTAMP() -3600*24*30);
+---------------+
| COUNT(postid) |
+---------------+
|           378 |
+---------------+
1 row in set (0.01 sec)

mysql> select COUNT(postid) from post where userid=302093876 and dateline > (UNIX_TIMESTAMP() -3600*24*30);
+---------------+
| COUNT(postid) |
+---------------+
|             7 |
+---------------+
1 row in set (0.01 sec)

Neo · January 2, 2019, 5:02am

Or maybe this query, the number of threads started in the past month:

mysql> select COUNT(threadid) from thread where postuserid=1 and dateline > (UNIX_TIMESTAMP() -3600*24*30);
+-----------------+
| COUNT(threadid) |
+-----------------+
|              49 |
+-----------------+
1 row in set (0.00 sec)