赵强大数据vip课_强大的聊天系统–第8课

于 2020-08-04 14:55:43 发布
阅读量366 收藏
点赞数
文章标签： html js jquery php bootstrap ViewUI
原文链接：https://www.script-tutorials.com/powerful-chat-system-lesson-8/
版权

赵强大数据vip课

Powerful Chat System
Powerful Chat System

Powerful Chat System – Lesson 8 Today we continue a series of articles on the creation of powerful chat system. In our eighth lesson I added several features: I gave right to block (and unblock) members for admins and moderators (now, they can perform normal moderation – they can ban members), and I added rates to our members. Now, every active member can put his vote for another members.

强大的聊天系统–第8课今天，我们继续撰写有关创建强大的聊天系统的系列文章。 在第八课中，我添加了几个功能：我授予了阻止(和取消阻止)管理员和版主成员的权限(现在，他们可以执行正常的审核–他们可以禁止成员)，并且向成员添加了费率。 现在，每个活跃成员都可以投票给另一个成员。

Today I will publish updated sources of our growing project. All project is well structured: system classes is in ‘classes’ folder, all javascript files in ‘js’ folder, stylesheets in ‘css’ folder, all custom avatars in ‘data’ folder, images in ‘images’ folder, template files in ‘templates’ folder.

今天，我将发布我们不断发展的项目的更新资源。 所有项目的结构都井井有条：系统类位于“类”文件夹中，所有javascript文件位于“ js”文件夹中，样式表位于“ css”文件夹中，所有自定义头像都位于“数据”文件夹中，图像位于“图像”文件夹中，模板文件位于“模板”文件夹。

现场演示
打包下载

Now – download the source files and lets start coding !

现在–下载源文件并开始编码！

步骤1. SQL (Step 1. SQL)

I added one new table into database ‘cs_profiles_vote_track’. This table keeps records voting (track). Please execute next SQL:

我在数据库“ cs_profiles_vote_track”中添加了一个新表。 该表保持记录投票(跟踪)。 请执行下一个SQL： 


CREATE TABLE `cs_profiles_vote_track` (
  `pid` int(11) unsigned NOT NULL default '0',
  `ip` varchar(20) default NULL,
  `date` datetime default NULL,
  KEY `uip` (`ip`,`pid`)
) ENGINE=MyISAM DEFAULT CHARSET=utf8;


CREATE TABLE `cs_profiles_vote_track` (
  `pid` int(11) unsigned NOT NULL default '0',
  `ip` varchar(20) default NULL,
  `date` datetime default NULL,
  KEY `uip` (`ip`,`pid`)
) ENGINE=MyISAM DEFAULT CHARSET=utf8;

步骤2. HTML (Step 2. HTML)

I updated template of our profile page. Now it contains extra button (block feature) and rate block:

我更新了个人资料页面的模板。 现在，它包含额外的按钮(阻止功能)和评分阻止：

templates / profile_page.html (templates/profile_page.html)


<html lang="en" >
<head>
    <title>Powerful Chat System - Lesson 8</title>
    <link href="css/main.css" rel="stylesheet" type="text/css" />
    <script src="http://code.jquery.com/jquery-latest.min.js"></script>
    <script src="js/customizer.js"></script>
    <style>
        .container {
            {custom_styles}
        }
    </style>
</head>
<body>
    <header>
        <h2>Powerful Chat System - Lesson 8</h2>
        <a href="https://www.script-tutorials.com/powerful-chat-system-lesson-8/" class="stuts">Back to original tutorial on <span>Script Tutorials</span></a>
    </header>
    <div class="clear"></div>
    <div class="container">
        <div class="column">
            <h3>Name: {name}</h3>
            <h3>First name: {fname}</h3>
            <h3>Last name: {lname}</h3>
            <h3>About: {about}</h3>
            <h3>Date Reg: {datereg}</h3>
            <h3>Role: {role}</h3>
            <h3>Avatar: <img src="{avatar}" style="vertical-align:middle" /></h3>
        </div>
        <div class="column">
            <p><a href="index.php">Back to chat</a>
                {actions}
            </p>
        </div>
    </div>
    {rate}
    <div class="container" {cust_visible}>
        <h2>You can customize your profile page</h2>
        <div class="column">
            <canvas id="color_canvas" width="370" height="60"></canvas>
        </div>
        <div class="column">
            <div class="customizer_buttons">
                <div id="preview"></div>
            </div>
            <form action="profile.php" method="GET" target="change_color_result">
                <input type="hidden" value="{id}" name="id">
                <input type="hidden" value="color" name="color" id="color">
                <input type="hidden" value="change_color" name="action">
                <input id="submit" type="submit" name="submit" value="Apply">
            </form>
            <iframe class="avatar_iframe" name="change_color_result"></iframe>
        </div>
    </div>
    <div class="sidebar">
        <div>
            <h2>Online Members Block</h2>
            {online_members}
        </div>
        <div>
            <h2>Last Members</h2>
            {profiles}
        </div>
    </div>
    <div class="priv_dock_wrap"></div>
    {priv_js}
</body>
</html>



<html lang="en" >
<head>
    <title>Powerful Chat System - Lesson 8</title>
    <link href="css/main.css" rel="stylesheet" type="text/css" />
    <script src="http://code.jquery.com/jquery-latest.min.js"></script>
    <script src="js/customizer.js"></script>
    <style>
        .container {
            {custom_styles}
        }
    </style>
</head>
<body>
    <header>
        <h2>Powerful Chat System - Lesson 8</h2>
        <a href="https://www.script-tutorials.com/powerful-chat-system-lesson-8/" class="stuts">Back to original tutorial on <span>Script Tutorials</span></a>
    </header>
    <div class="clear"></div>
    <div class="container">
        <div class="column">
            <h3>Name: {name}</h3>
            <h3>First name: {fname}</h3>
            <h3>Last name: {lname}</h3>
            <h3>About: {about}</h3>
            <h3>Date Reg: {datereg}</h3>
            <h3>Role: {role}</h3>
            <h3>Avatar: <img src="{avatar}" style="vertical-align:middle" /></h3>
        </div>
        <div class="column">
            <p><a href="index.php">Back to chat</a>
                {actions}
            </p>
        </div>
    </div>
    {rate}
    <div class="container" {cust_visible}>
        <h2>You can customize your profile page</h2>
        <div class="column">
            <canvas id="color_canvas" width="370" height="60"></canvas>
        </div>
        <div class="column">
            <div class="customizer_buttons">
                <div id="preview"></div>
            </div>
            <form action="profile.php" method="GET" target="change_color_result">
                <input type="hidden" value="{id}" name="id">
                <input type="hidden" value="color" name="color" id="color">
                <input type="hidden" value="change_color" name="action">
                <input id="submit" type="submit" name="submit" value="Apply">
            </form>
            <iframe class="avatar_iframe" name="change_color_result"></iframe>
        </div>
    </div>
    <div class="sidebar">
        <div>
            <h2>Online Members Block</h2>
            {online_members}
        </div>
        <div>
            <h2>Last Members</h2>
            {profiles}
        </div>
    </div>
    <div class="priv_dock_wrap"></div>
    {priv_js}
</body>
</html>

And, we have one new template for rate block:

而且，我们为费率阻止提供了一个新模板：

templates / vote.html (templates/vote.html)

<link href="css/vote.css" rel="stylesheet" type="text/css" />
<script src="js/vote.js"></script>
<div class="clear"></div>
<div class="container">
    <div class="column">
        <div class="votes_main">
            <div class="votes_gray" style="width:{width}px;">
                <div class="votes_buttons" id="{pid}" cnt="{rate_cnt}" val="{rate_avg}">
                    {votes}
                </div>
                <div class="votes_active" style="width:{act_width}px;"></div>
            </div>
            <span><b>{rate_cnt}</b> votes</span>
        </div>
    </div>
</div>


<link href="css/vote.css" rel="stylesheet" type="text/css" />
<script src="js/vote.js"></script>
<div class="clear"></div>
<div class="container">
    <div class="column">
        <div class="votes_main">
            <div class="votes_gray" style="width:{width}px;">
                <div class="votes_buttons" id="{pid}" cnt="{rate_cnt}" val="{rate_avg}">
                    {votes}
                </div>
                <div class="votes_active" style="width:{act_width}px;"></div>
            </div>
            <span><b>{rate_cnt}</b> votes</span>
        </div>
    </div>
</div>

步骤3. CSS (Step 3. CSS)

I added new css file to keep styles of our vote element:

我添加了新的css文件来保留我们表决元素的样式：

css / vote.css (css/vote.css)

.votes_main {
    margin: 10px auto;
    overflow: hidden;
    width: 450px;
}
.votes_gray {
    background-image: url("../images/star_gray.png");
    float: left;
    height: 64px;
    position: relative;
}
.votes_active {
    background-image: url("../images/star.png");
    height: 64px;
    left: 0;
    position: absolute;
    top: 0;
    z-index: 1;
}
.votes_buttons {
    left: 0;
    position: absolute;
    top: 0;
    z-index: 2;
}
.votes_button {
    border: medium none;
    height: 64px;
    margin: 0;
    padding: 0;
    width: 64px;
}
.votes_main span {
    color: #333333;
    display: block;
    float: left;
    font-weight: bold;
    font-size: 18px;
    line-height: 64px;
    margin-left: 10px;
}


.votes_main {
    margin: 10px auto;
    overflow: hidden;
    width: 450px;
}
.votes_gray {
    background-image: url("../images/star_gray.png");
    float: left;
    height: 64px;
    position: relative;
}
.votes_active {
    background-image: url("../images/star.png");
    height: 64px;
    left: 0;
    position: absolute;
    top: 0;
    z-index: 1;
}
.votes_buttons {
    left: 0;
    position: absolute;
    top: 0;
    z-index: 2;
}
.votes_button {
    border: medium none;
    height: 64px;
    margin: 0;
    padding: 0;
    width: 64px;
}
.votes_main span {
    color: #333333;
    display: block;
    float: left;
    font-weight: bold;
    font-size: 18px;
    line-height: 64px;
    margin-left: 10px;
}

步骤4. PHP (Step 4. PHP)

Profile page file was updated, I added only few lines at the bottom (into array), it isn’t necessary to publish whole file, but I will give you updated array:

个人资料页面文件已更新，我在底部仅添加了几行(到数组中)，没有必要发布整个文件，但我将为您提供更新的数组：

profile.php (profile.php)

// draw common page
$aKeys = array(
    '{id}' => $iPid,
    '{name}' => $sName,
    '{fname}' => $sFName,
    '{lname}' => $sLName,
    '{about}' => $sAbout,
    '{datereg}' => $sDate,
    '{role}' => $sRole,
    '{avatar}' => $sAvatar,
    '{custom_styles}' => $sCustomBG,
    '{cust_visible}' => ($_SESSION['member_id'] == $iPid) ? '' : 'style="display:none"',
    '{profiles}' => $sProfiles,
    '{online_members}' => $sOnlineMembers,
    '{priv_js}' => $sPrivChatJs,
    '{actions}' => $GLOBALS['CProfiles']->getBlockMemberAction($iPid),
    '{rate}' => $GLOBALS['CProfiles']->getBlockRate($iPid),
);


// draw common page
$aKeys = array(
    '{id}' => $iPid,
    '{name}' => $sName,
    '{fname}' => $sFName,
    '{lname}' => $sLName,
    '{about}' => $sAbout,
    '{datereg}' => $sDate,
    '{role}' => $sRole,
    '{avatar}' => $sAvatar,
    '{custom_styles}' => $sCustomBG,
    '{cust_visible}' => ($_SESSION['member_id'] == $iPid) ? '' : 'style="display:none"',
    '{profiles}' => $sProfiles,
    '{online_members}' => $sOnlineMembers,
    '{priv_js}' => $sPrivChatJs,
    '{actions}' => $GLOBALS['CProfiles']->getBlockMemberAction($iPid),
    '{rate}' => $GLOBALS['CProfiles']->getBlockRate($iPid),
);

This is our next updated file. There are three new functions (you can add them at the bottom of our class:

这是我们的下一个更新文件。 新增了三个功能(您可以在类的底部添加它们：

classes / CProfiles.php (classes/CProfiles.php)

// get block member action button
function getBlockMemberAction($iPid) {
    if ($_SESSION['member_id'] != $iPid && $_SESSION['member_status'] == 'active' && in_array($_SESSION['member_role'], array(4, 5))) {
        $aMyInfo = $this->getProfileInfo($_SESSION['member_id']);
        $aInfo = $this->getProfileInfo($iPid);
        if ($aMyInfo['role'] > $aInfo['role']) {
            $sStatus = $aInfo['status'];
            $sDescDesc = ($sStatus == 'active') ? 'Block this member' : 'Unblock this member';
            return '<font style="float:right"><button id="block" pid="'.$iPid.'">'.$sDescDesc.'</button></font><script src="js/admin_utils.js"></script>';
        }
    }
}
// block member
function blockMember($iPid) {
    if ($iPid) {
        $aInfo = $this->getProfileInfo($iPid);
        $sStatus = $aInfo['status'];
        $sUpStatus = ($sStatus == 'active') ? 'passive' : 'active';
        $sSQL = "
            UPDATE `cs_profiles` SET
            `status` = '{$sUpStatus}'
            WHERE `id` = '{$iPid}'
        ";
        $GLOBALS['MySQL']->res($sSQL);
        return ($sStatus == 'active') ? 2 : 1;
    }
    return;
}
// get block member action button
function getBlockRate($iPid) {
    if ($_SESSION['member_id'] != $iPid && $_SESSION['member_status'] == 'active') {
        // $aMyInfo = $this->getProfileInfo($_SESSION['member_id']);
        $aInfo = $this->getProfileInfo($iPid);
        // vote element
        $iIconSize = 64;
        $iMax = 5;
        $iRate = $aInfo['rate'];
        $iRateCnt = $aInfo['rate_count'];
        $fRateAvg = ($iRate && $iRateCnt) ? $iRate / $iRateCnt : 0;
        $iWidth = $iIconSize*$iMax;
        $iActiveWidth = round($fRateAvg*($iMax ? $iWidth/$iMax : 0));
        $sVot = '';
        for ($i=1 ; $i<=$iMax ; $i++) {
            $sVot .= '<a href="#" id="'.$i.'"><img class="votes_button" src="images/empty.gif" alt="" /></a>';
        }
        $aKeys = array(
            '{pid}' => $iPid,
            '{width}' => $iWidth,
            '{rate_cnt}' => $iRateCnt,
            '{rate_avg}' => $fRateAvg,
            '{votes}' => $sVot,
            '{act_width}' => $iActiveWidth,
        );
        return strtr(file_get_contents('templates/vote.html'), $aKeys);
    }
}


// get block member action button
function getBlockMemberAction($iPid) {
    if ($_SESSION['member_id'] != $iPid && $_SESSION['member_status'] == 'active' && in_array($_SESSION['member_role'], array(4, 5))) {
        $aMyInfo = $this->getProfileInfo($_SESSION['member_id']);
        $aInfo = $this->getProfileInfo($iPid);
        if ($aMyInfo['role'] > $aInfo['role']) {
            $sStatus = $aInfo['status'];
            $sDescDesc = ($sStatus == 'active') ? 'Block this member' : 'Unblock this member';
            return '<font style="float:right"><button id="block" pid="'.$iPid.'">'.$sDescDesc.'</button></font><script src="js/admin_utils.js"></script>';
        }
    }
}
// block member
function blockMember($iPid) {
    if ($iPid) {
        $aInfo = $this->getProfileInfo($iPid);
        $sStatus = $aInfo['status'];
        $sUpStatus = ($sStatus == 'active') ? 'passive' : 'active';
        $sSQL = "
            UPDATE `cs_profiles` SET
            `status` = '{$sUpStatus}'
            WHERE `id` = '{$iPid}'
        ";
        $GLOBALS['MySQL']->res($sSQL);
        return ($sStatus == 'active') ? 2 : 1;
    }
    return;
}
// get block member action button
function getBlockRate($iPid) {
    if ($_SESSION['member_id'] != $iPid && $_SESSION['member_status'] == 'active') {
        // $aMyInfo = $this->getProfileInfo($_SESSION['member_id']);
        $aInfo = $this->getProfileInfo($iPid);
        // vote element
        $iIconSize = 64;
        $iMax = 5;
        $iRate = $aInfo['rate'];
        $iRateCnt = $aInfo['rate_count'];
        $fRateAvg = ($iRate && $iRateCnt) ? $iRate / $iRateCnt : 0;
        $iWidth = $iIconSize*$iMax;
        $iActiveWidth = round($fRateAvg*($iMax ? $iWidth/$iMax : 0));
        $sVot = '';
        for ($i=1 ; $i<=$iMax ; $i++) {
            $sVot .= '<a href="#" id="'.$i.'"><img class="votes_button" src="images/empty.gif" alt="" /></a>';
        }
        $aKeys = array(
            '{pid}' => $iPid,
            '{width}' => $iWidth,
            '{rate_cnt}' => $iRateCnt,
            '{rate_avg}' => $fRateAvg,
            '{votes}' => $sVot,
            '{act_width}' => $iActiveWidth,
        );
        return strtr(file_get_contents('templates/vote.html'), $aKeys);
    }
}

First one function getBlockMemberAction returns one little button for profile page. Clicking at this page will force block / unblock members. This function available only for moderators and admins. And, moderator can’t block admin, only admin can block moderator. Second one function blockMember updates profile status (block). And, last one – getBlockRate returns block with rate object (stars), where we can vote for members.

第一个函数getBlockMemberAction返回个人资料页面的一个小按钮。 单击此页面将强制阻止/取消阻止成员。 此功能仅适用于主持人和管理员。 而且，版主不能阻止管理员，只有管理员可以阻止版主。 第二个功能块成员会更新配置文件状态(块)。 并且，最后一个– getBlockRate返回带有速率对象(星号)的块，我们可以在其中投票给成员。

In order to perform different actions, I added one new PHP file:

为了执行不同的操作，我添加了一个新PHP文件：

actions.php (actions.php)

<?php
// set error reporting level
if (version_compare(phpversion(), '5.3.0', '>=') == 1)
  error_reporting(E_ALL & ~E_NOTICE & ~E_DEPRECATED);
else
  error_reporting(E_ALL & ~E_NOTICE);
require_once('classes/CMySQL.php');
require_once('classes/CLogin.php');
require_once('classes/CProfiles.php');
// for logged-in members only
if ($_SESSION['member_id'] && $_SESSION['member_status'] == 'active') {
    if (in_array($_SESSION['member_role'], array(4, 5))) { // for moderators and admins only
        if ($_POST['action'] == 'block') { // Block action
            $iRes = $GLOBALS['CProfiles']->blockMember((int)$_POST['pid']);
            header('Content-Type: text/html; charset=utf-8');
            echo $iRes;
            exit;
        }
    }
    if ($_POST['action'] == 'put_vote') { // Put vote action
        $iPid = (int)$_POST['id'];
        $iVote = (int)$_POST['vote'];
        $sIp = getVisitorIP();
        // we can vote once per week (protection)
        $iOldId = $GLOBALS['MySQL']->getOne("SELECT `pid` FROM `cs_profiles_vote_track` WHERE `pid` = '{$iPid}' AND `ip` = '{$sIp}' AND (`date` >= NOW() - INTERVAL 7 DAY) LIMIT 1");
        if (! $iOldId) {
            $GLOBALS['MySQL']->res("INSERT INTO `cs_profiles_vote_track` SET `pid` = '{$iPid}', `ip` = '{$sIp}', `date` = NOW()");
            $GLOBALS['MySQL']->res("UPDATE `cs_profiles` SET `rate` = `rate` + {$iVote}, `rate_count` = `rate_count` + 1 WHERE `id` = '{$iPid}'");
            header('Content-Type: text/html; charset=utf-8');
            echo 1;
            exit;
        }
    }
}
function getVisitorIP() {
    $ip = "0.0.0.0";
    if( ( isset( $_SERVER['HTTP_X_FORWARDED_FOR'] ) ) && ( !empty( $_SERVER['HTTP_X_FORWARDED_FOR'] ) ) ) {
        $ip = $_SERVER['HTTP_X_FORWARDED_FOR'];
    } elseif( ( isset( $_SERVER['HTTP_CLIENT_IP'])) && (!empty($_SERVER['HTTP_CLIENT_IP'] ) ) ) {
        $ip = explode(".",$_SERVER['HTTP_CLIENT_IP']);
        $ip = $ip[3].".".$ip[2].".".$ip[1].".".$ip[0];
    } elseif((!isset( $_SERVER['HTTP_X_FORWARDED_FOR'])) || (empty($_SERVER['HTTP_X_FORWARDED_FOR']))) {
        if ((!isset( $_SERVER['HTTP_CLIENT_IP'])) && (empty($_SERVER['HTTP_CLIENT_IP']))) {
            $ip = $_SERVER['REMOTE_ADDR'];
        }
    }
    return $ip;
}


<?php
// set error reporting level
if (version_compare(phpversion(), '5.3.0', '>=') == 1)
  error_reporting(E_ALL & ~E_NOTICE & ~E_DEPRECATED);
else
  error_reporting(E_ALL & ~E_NOTICE);
require_once('classes/CMySQL.php');
require_once('classes/CLogin.php');
require_once('classes/CProfiles.php');
// for logged-in members only
if ($_SESSION['member_id'] && $_SESSION['member_status'] == 'active') {
    if (in_array($_SESSION['member_role'], array(4, 5))) { // for moderators and admins only
        if ($_POST['action'] == 'block') { // Block action
            $iRes = $GLOBALS['CProfiles']->blockMember((int)$_POST['pid']);
            header('Content-Type: text/html; charset=utf-8');
            echo $iRes;
            exit;
        }
    }
    if ($_POST['action'] == 'put_vote') { // Put vote action
        $iPid = (int)$_POST['id'];
        $iVote = (int)$_POST['vote'];
        $sIp = getVisitorIP();
        // we can vote once per week (protection)
        $iOldId = $GLOBALS['MySQL']->getOne("SELECT `pid` FROM `cs_profiles_vote_track` WHERE `pid` = '{$iPid}' AND `ip` = '{$sIp}' AND (`date` >= NOW() - INTERVAL 7 DAY) LIMIT 1");
        if (! $iOldId) {
            $GLOBALS['MySQL']->res("INSERT INTO `cs_profiles_vote_track` SET `pid` = '{$iPid}', `ip` = '{$sIp}', `date` = NOW()");
            $GLOBALS['MySQL']->res("UPDATE `cs_profiles` SET `rate` = `rate` + {$iVote}, `rate_count` = `rate_count` + 1 WHERE `id` = '{$iPid}'");
            header('Content-Type: text/html; charset=utf-8');
            echo 1;
            exit;
        }
    }
}
function getVisitorIP() {
    $ip = "0.0.0.0";
    if( ( isset( $_SERVER['HTTP_X_FORWARDED_FOR'] ) ) && ( !empty( $_SERVER['HTTP_X_FORWARDED_FOR'] ) ) ) {
        $ip = $_SERVER['HTTP_X_FORWARDED_FOR'];
    } elseif( ( isset( $_SERVER['HTTP_CLIENT_IP'])) && (!empty($_SERVER['HTTP_CLIENT_IP'] ) ) ) {
        $ip = explode(".",$_SERVER['HTTP_CLIENT_IP']);
        $ip = $ip[3].".".$ip[2].".".$ip[1].".".$ip[0];
    } elseif((!isset( $_SERVER['HTTP_X_FORWARDED_FOR'])) || (empty($_SERVER['HTTP_X_FORWARDED_FOR']))) {
        if ((!isset( $_SERVER['HTTP_CLIENT_IP'])) && (empty($_SERVER['HTTP_CLIENT_IP']))) {
            $ip = $_SERVER['REMOTE_ADDR'];
        }
    }
    return $ip;
}

Since today, I will use this file to perform different hidden actions. Now, I use this file to perform member blocking and to accept votes for members.

从今天开始，我将使用该文件执行不同的隐藏操作。 现在，我使用此文件执行成员阻止并接受成员的投票。

步骤5. Javascript (Step 5. Javascript)

I added new JS file which will perform different admin’s service methods. First of them is blocking of members

我添加了新的JS文件，它将执行不同的管理员服务方法。 首先是阻止成员

js / admin_utils.js (js/admin_utils.js)

$(function() {
    // block member
    $('#block').click(function(event) {
        var oBtn = $(this);
        $.post('actions.php', { pid: oBtn.attr('pid'), action: 'block' },
            function(data){
                if (data != undefined) {
                    oBtn[0].innerHTML = (data == 2) ? 'Unblock this member' : 'Block this member';
                }
            }
        );
    });
});


$(function() {
    // block member
    $('#block').click(function(event) {
        var oBtn = $(this);
        $.post('actions.php', { pid: oBtn.attr('pid'), action: 'block' },
            function(data){
                if (data != undefined) {
                    oBtn[0].innerHTML = (data == 2) ? 'Unblock this member' : 'Block this member';
                }
            }
        );
    });
});

Another one JS file to work with rate object

另一个JS文件与rate对象一起使用

js / vote.js (js/vote.js)

$(function(){
    var width = 0;
    $('.votes_buttons a').hover(
        function () {
            width = $(this).attr('id') * 64;
            $('.votes_active').width(width + 'px');
        },
        function () {
            width = $(this).parent().attr('val') * 64;
            $('.votes_active').width(width + 'px');
        }
    );
    $('.votes_buttons a').click(function () {
        var idVal = $(this).parent().attr('id');
        var iCnt = $(this).parent().attr('cnt');
        var voteVal = $(this).attr('id');
        var iSelWidth = voteVal * 64;
        $.post('actions.php', { id: idVal, vote: voteVal, action: 'put_vote' },
            function(data){
                if (data == 1) {
                    width = iSelWidth;
                    $('.votes_active').width(iSelWidth + 'px');
                    iCnt = parseInt(iCnt) + 1;
                    $('.votes_main span b').text(iCnt);
                    $('.votes_buttons').attr('val', voteVal);
                }
            }
        );
    });
});


$(function(){
    var width = 0;
    $('.votes_buttons a').hover(
        function () {
            width = $(this).attr('id') * 64;
            $('.votes_active').width(width + 'px');
        },
        function () {
            width = $(this).parent().attr('val') * 64;
            $('.votes_active').width(width + 'px');
        }
    );
    $('.votes_buttons a').click(function () {
        var idVal = $(this).parent().attr('id');
        var iCnt = $(this).parent().attr('cnt');
        var voteVal = $(this).attr('id');
        var iSelWidth = voteVal * 64;
        $.post('actions.php', { id: idVal, vote: voteVal, action: 'put_vote' },
            function(data){
                if (data == 1) {
                    width = iSelWidth;
                    $('.votes_active').width(iSelWidth + 'px');
                    iCnt = parseInt(iCnt) + 1;
                    $('.votes_main span b').text(iCnt);
                    $('.votes_buttons').attr('val', voteVal);
                }
            }
        );
    });
});
现场演示
存档下载

结论 (Conclusion)

I hope that our new series of articles of chat system creation is very useful and interesting for you. If you want to share your ideas, or you noticed any weakness – don’t hesitate to contact us. Good luck and welcome back!

我希望我们有关聊天系统创建的新系列文章对您非常有用和有趣。 如果您想分享自己的想法，或者发现任何弱点，请随时与我们联系。 祝你好运，欢迎回来！

翻译自: https://www.script-tutorials.com/powerful-chat-system-lesson-8/

赵强大数据vip课

cuke3186
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值