Visit The New, Modern Unix Linux Community


Notes with Ravinder on Badging System Development Part II


 
Thread Tools Search this Thread
Top Forums Web Development Notes with Ravinder on Badging System Development Part II
# 1  
Notes with Ravinder on Badging System Development Part II

Part II: Current PHP file Beta 73 Not Optimized:

Code:
<?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>';

This User Gave Thanks to Neo For This Post:
# 2  
Part II: Current HTML grid for Beta 73 and Link to jQuery file:

jQuery:

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

HTML Grid file: fa-badges-grid

Code:
<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>

# 3  
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.

Code:
<?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';
}

Code:
$('.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.
# 4  
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.

Code:
<?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
# 5  
Thank Ravinder. FYI, this code gives a MySQL error:

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

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

Code:
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)

# 7  
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

Code:
<?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:

Code:
$('.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"]);


Previous Thread | Next Thread
Thread Tools Search this Thread
Search this Thread:
Advanced Search

Test Your Knowledge in Computers #142
Difficulty: Easy
Version 4 Unix was rewritten in C in 1977.
True or False?

3 More Discussions You Might Find Interesting

1. What is on Your Mind?

Badging System: UNIX.COM Bug Hunter Badge (New)

I have moved the bug badge out of reserve and into the main stream. Basically, I will assign a color level like the others, based on who has made a good actionable bug report for UNIX.COM. "Good" means screenshots, links, and even details from web dev tools our the HTML source code. So far,... (0 Replies)
Discussion started by: Neo
0 Replies

2. What is on Your Mind?

Status of Badging System - Beta 1

Dear All, Here is the current status of the badging system: The Beta 1 phase of the new badging system is close to completion. 42 prototype badges have been "allocated" 6 prototype badge slots are held in reserve The "alert you have new badges" prototype is running and is currently... (4 Replies)
Discussion started by: Neo
4 Replies

3. What is on Your Mind?

New Badging System - Badges Prototype Beta 1 (Badges Only)

Today I mapped out the new badging system using FA icons, Beta 1 in no particular order except a 6 x 8 grid: https://www.unix.com/members/1-albums215-picture991.png The prototype HTML code for this layout: <style> .fa-badge-grid { font-size: 1.5em; } .row { ... (38 Replies)
Discussion started by: Neo
38 Replies

Featured Tech Videos