Share Module ReaCtions giống fb cho JohnCMS by MrT98 | JohnCMS

Home · Bang hội ·
Đăng Nhập hoặc Đăng Kí để sử dụng hết chức năng của diễn đàn.

Hi, Khách!

Bang hội » Wapmaster » JohnCMS » Share Module ReaCtions giống fb cho JohnCMS by MrT98

Tìm kiếm

» Share Module ReaCtions giống fb cho JohnCMS by MrT98

Pham_loi

Chức vụ:

02:19:19, 23-04-2016

Như các bạn đã biết, facebook đã cho ra tính năng ReaCtions nhằm thay thế nút "Like"....
Tính năng này gồm nhiều các biểu tượng cảm súc khác nhau. Mà nút "Like" không thể thể hiện được.

Tính năng ReaCtions này khá hay, nên mình quyết định share cho ae cùng sài.
Nay JohnCMS cũng có thể có được tính năng này.

Demo: http://phieubac.ga

Hướng dẫn cài đặt.

- Mở /incfiles/classes/functions.php
Thêm các functions sau vào chỗ thích hợp.

<?php
    /** Mod ReaCtions for JohnCMS By MrT98
    * NhanhNao.Xyz Team CMS
    * Copyright by MrT98
    * Mọi thắc mắc và hỗ trợ tại http://nhanhnao.xyz và http://phieubac.ga
    */

    /*Like Validate Check*/
    public static function Like_Check($msg_id, $uid, $reaction_type)
    {
        $msg_id = mysql_real_escape_string($msg_id); // Reactioned message id
        $uid = mysql_real_escape_string($uid);  // Reactioner user id
        $reaction_type = mysql_real_escape_string($reaction_type); // Reaction type
        //Check reaction type for user
        $q = mysql_query("SELECT id FROM forum_thank WHERE  userthank='$uid' and topic='$msg_id' AND reaction_type='$reaction_type'");
        // Output the result
        if(mysql_num_rows($q) != 0) {
            return true;
        } else {
            return false;
        }
    }

    /*Unlike*/
    public static function Unlike($msg_id, $uid,$reaction_type)
    {
        $msg_id=mysql_real_escape_string($msg_id); // Reactioned message id
        $uid=mysql_real_escape_string($uid);  // Reactioner user id
        $q=mysql_query("SELECT id FROM forum_thank WHERE userthank='$uid' and topic='$msg_id'") or die(mysql_error());

        if(mysql_num_rows($q)>0) {
            //If user react the message id then delete the reaction type from forum_thank table
            mysql_query("DELETE FROM forum_thank WHERE topic='$msg_id' and userthank='$uid'") or die(mysql_error());
            //Prepare the statement
            $thongkethank = mysql_query("SELECT COUNT(*) FROM `forum_thank` WHERE `topic`='" . $msg_id . "'");
            $thongkethanks = mysql_result($thongkethank, 0);

            return $thongkethanks;
        } else {
            return false;
        }
    }
    /*Like Message*/
    public static function Like($msg_id, $uid, $reaction_type)
    {
        $msg_id=mysql_real_escape_string($msg_id); // Reactioned message id
        $uid=mysql_real_escape_string($uid); // Reactioner user id
        $reaction_type = mysql_real_escape_string($reaction_type); // Reaction type
        // Select the message id from forum_thank table
        $q=mysql_query("SELECT id FROM forum_thank WHERE  userthank='$uid' and topic='$msg_id'");
        // 1 row means there's a Like already, so Unlike() it.
        if(mysql_num_rows($q)==1) {
            functions::Unlike($msg_id, $uid, $reaction_type);
        }
        $q = mysql_query("SELECT * FROM `forum` WHERE `id` = '$msg_id'");
        $r = mysql_fetch_array($q);
        $ouid = $r['user_id';
        $reid = $r['refid';
        $time = time();
        // then insert the like from message like table
        mysql_query("INSERT INTO `forum_thank` SET `user` = '".$ouid."', `topic` = '".$msg_id."' , `time` = '$time', `userthank` = '$uid', `chude` = '".$reid."', `reaction_type` = '".$reaction_type."' ");
        // Prepare the statement
        $thongkethank = mysql_query("SELECT COUNT(*) FROM `forum_thank` WHERE `topic`='" . $msg_id . "'");
        $thongkethanks = mysql_result($thongkethank, 0);

        return $thongkethanks;
    }
    /*Like Count Test*/
    public static function Like_CountT($msg_id, $uid, $reaction_type)
    {
        $msg_id = mysql_real_escape_string($msg_id);
        $reaction_type = mysql_real_escape_string($reaction_type);
        $q = mysql_query("SELECT COUNT(*) AS reaction_count FROM forum_thank WHERE topic = '$msg_id' AND reaction_type = '$reaction_type'") or die(mysql_error());
        $row = mysql_fetch_array($q);
        if ($row) {
            return $row['reaction_count';
        } else return 0;
    }
    /*Like Count Test*/
    public static function Like_CountTotal($msg_id, $uid, $reaction_type)
    {
        $msg_id = mysql_real_escape_string($msg_id);
        $reaction_type = mysql_real_escape_string($reaction_type);
        $q = mysql_query("SELECT reaction_type, COUNT(*) AS reaction_count FROM forum_thank WHERE topic = '$msg_id' GROUP BY reaction_type") or die(mysql_error());
        $row = mysql_fetch_array($q);
        if ($row) {
            return $row['reaction_count';
        } else return 0;
    }
?>

Copy code

- Mở /incfiles/head.php
Tìm:

<?php
"\n" . '<title>' . $textl . '</title>' .
?>

Copy code

Thêm bên dưới nó:

<?php
"\n" . '<script type="text/javascript" src="/js/jquery-1.11.0.min.js"></script>' .
"\n" . '<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>' .
?>

Copy code

- Tiếp tục...
- Mở style.css (themes bạn đang dùng):
thêm đoạn css này vào.

<?php
/*New Facebook Style Like buttons STARTED*/
.numcount {
    float: left;
}
.like-pit {
    float: left;
    padding: 0px 10px 0px 10px;
    margin-right: 10px;
    height: 30px;
    cursor: pointer;
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
    color: #009688;
}
.lco, .hco , .hico , .wco , .cco, .eco, .lcl{
float:left;
color:#828282;
font-weight:400;
font-size:11px;
}
.reaction_wrap-style {
height:auto !important;
}
@media all and (max-width: 359px) {
  .lco, .hco , .hico , .wco , .cco, .eco, .lcl{
text-indent:6px;
}
}
.likes, .loves, .hahas, .hihis, .wowws, .crys, .angrys{
    float: left;
    height: 35px;
    color: #828282;
    font-size: 12px;
    line-height: 35px;
    text-indent: 15px;
    min-width: 45px;
    margin-right: 4px;
}

.frc {
display:none;
}
.frc:first-child {
display:block;
}
.new_like {
position: relative;
display: inline-block;
}
.new_like:focus {
pointer-events: none;
}

.new_like:focus .new_like_items {
opacity: 1;
display:block;
}

.new_like_items {
pointer-events: auto;
position: absolute;
z-index: 1;
opacity: 0;
display:none;
/*transition: visibility 0.5s;*/
  transition: all 0.2s ease-out;
  -webkit-animation: zoomIn 0.2s ease-in-out 0.2s;
  animation: zoomIn 0.2s ease-in-out 0.2s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.new_like.no-pointer-events {
pointer-events: auto !important;
}

.new_like.no-visibility .new_like_items {
visibility: visible !important;
display: none;
}

.new_like.no-visibility:focus .new_like_items {
display: block;
}

.new_like.no-opacity .new_like_items {
opacity: 1 !important;
}

/*
Eye candy
( colors courtesy of https://kuler.adobe.com/try-color-theme-3350110 )
*/
.new_like {
padding: 0;
margin: 0 0 1em 0;
outline: 0;
}
.new_like_items {
background-color: #ffffff;
min-width: 235px;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
margin-top: -45px;
    margin-left: -74px;
padding-left: 10px;
    padding-bottom: 5px;
    padding-top: 5px;
    padding-right: 5px;
    border-radius:50px;
    transition: all 0.2s ease-out;
    -webkit-animation: zoomIn 0.2s ease-in-out 0.2s;
    animation: zoomIn 0.2s ease-in-out 0.2s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}
.new_like {
  text-align: left;
}
.op-lw {
  float:left;
  margin-right: 8px;
  margin-top: 1px;
}
.like-nb {
border-radius:50px;
width:30px;
height:30px;
background-color:#1e88e5;
}
.love-nb {
border-radius:50px;
width:30px;
height:30px;
background-color:#f50057;
}
/*New Facebook Style Like Buttons FINISHED*/

.who-likes-this-post {
  float: left;
  width: 100%;
  height: 35px;
  color: #828282;
  font-size: 12px;
  line-height: 35px;
  border-top: 1px solid #f0f0f0;
  text-indent: 15px;
  margin-top: 8px;
}

.who-likes-this-post {
    text-indent: 5px !important;
}

.lpos{
margin-left:3px !important;
margin-top:5px !important;

}

.icon-quotes {
float: left;
width:25px;
height:25px;
background: url(/icons/quotes.png) 0 0 no-repeat;
background-size: 25px 25px;
}

.icon-like-blf {
float: left;
width:20px;
height:20px;
background: url(/icons/like_newbtn.png) 0 0 no-repeat;
background-size: 20px 20px;
}
.icon-like-new {
float: left;
width:25px;
height:25px;
background: url(/icons/new_like_btn.gif) 0 0 no-repeat;
background-size: 25px 25px;
}
.icon-love-new {
float: left;
width:25px;
height:25px;
background: url(/icons/new_love_btn.gif) 0 0 no-repeat;
background-size: 25px 25px;
}
.icon-haha-new {
float: left;
width:25px;
height:25px;
background: url(/icons/hahaha.gif) 0 0 no-repeat;
background-size: 25px 25px;
}
.icon-mmmm-new {
float: left;
width:25px;
height:25px;
background: url(/icons/mmmm.gif) 0 0 no-repeat;
background-size: 25px 25px;
}
.icon-wowww-new {
float: left;
width:25px;
height:25px;
background: url(/icons/wowww.gif) 0 0 no-repeat;
background-size: 25px 25px;
}
.icon-crying-new {
float: left;
width:25px;
height:25px;
background: url(/icons/crying.gif)  0 0 no-repeat;
background-size: 25px 25px;
}
.icon-angry-new {
  float: left;
  width:25px;
  height:25px;
  background: url(/icons/angry.gif)  0 0 no-repeat;
  background-size: 25px 25px;
}

.post-like-unlike-comment {
  float: left;
  width: 100%;
  padding: 4px 0px 0px 0px;
  background-color: #ffffff;
  -webkit-border-bottom-right-radius: 3px;
  -webkit-border-bottom-left-radius: 3px;
  -moz-border-radius-bottomright: 3px;
  -moz-border-radius-bottomleft: 3px;
  border-bottom-right-radius: 3px;
  border-bottom-left-radius: 3px;
}
.like-post {
  float: left;
  padding: 7px 10px 0px 10px;
  margin-right: 10px;
  height: 30px;
  cursor: pointer;
}
/*Like unlike Buttons STARTED*/

.like-it {
    float: left;
    padding: 7px 10px 0px 10px;
    margin-right: 10px;
    height: 30px;
    cursor: pointer;
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
    color: #009688;
}
/*Like unlike Buttons FINISHED*/
?>

Copy code

- Và đây là code hiển thị ReaCtions tại forum.
- Mở /forum/index.php
thêm đoạn code sau vào nơi muốn hiện ReaCtions.

<?php
// mrt
$omsg_id = $res['id';
if($user_id){
    // Reaction status check for "Like"
    $like=functions::Like_Check($res['id',$user_id, "Like");
    // If post is not reactioned then show the $like_statusicon = 'icon-like-blf';
    // $like_statusicon working with all reaction status
$like_statusicon = 'icon-like-blf';
// $lostyle will working reaction status
// For example if not reactioned post then the style will be display:none;
$lostyle='display:none;';
if($like) {
//If post liked then show UnLike from the div rel and title
$like_status='UnLike';
// If post liked then show new UnLike icon from the reactions box
$like_statusicon='icon-like-new';
  } else {
  // If post not liked then show UnLike from the div rel and title
  $like_status='Like';
  }
  // Reaction status check for "Love"
   $love=functions::Like_Check($res['id',$user_id, "Love");
  if($love){
  // If post reaction status is UnLove then show UnLove from the div rel and title
  $love_status='UnLove';
  // If post reaction status is UnLove then show Love icon from the reactions box
  $like_statusicon='icon-love-new';
  // If post reaction status is UnLove then reaction div's style to be display:block;
  $lostyle='display:block;';
    } else {
// If post reaction status is not UnLove then show Love from the div rel and title
  $love_status='Love';
     }
   // Reaction status check for "Haha"
  $haha=functions::Like_Check($res['id',$user_id, "Haha");
  if($haha){
  // If post reaction status is UnHaha then show UnHaha from the div rel and title
  $haha_status='UnHaha';
  // If post reaction status is UnHaha then show Haha icon from the reactions box
  $like_statusicon='icon-haha-new';
  // If post reaction status is UnHaha then reaction div's style to be display:block;
  $lostyle='display:block;';
    } else {
  // If post reaction status is not UnHaha then show Haha from the div rel and title
  $haha_status='Haha';
     }
// Reaction status check for "Hihi"
   $hihi=functions::Like_Check($res['id',$user_id, "Hihi");
  if($hihi){
  // If post reaction status is UnHihi then show UnHihi from the div rel and title
  $hihi_status='UnHihi';
  // If post reaction status is UnHihi then show Hihi icon from the reactions box
  $like_statusicon='icon-mmmm-new';
  // If post reaction status is UnHihi then reaction div's style to be display:block;
  $lostyle='display:block;';
    } else {
//If post reaction status is not UnHihi then show Hihi from the div rel and title
  $hihi_status='Hihi';
     }
// Reaction status check for "Woww"
  $woww=functions::Like_Check($res['id',$user_id, "Woww");
  if($woww){
  // If post reaction status is UnWoww then show UnWoww from the div rel and title
  $woww_status='UnWoww';
  // If post reaction status is UnWoww then show Woww icon from the reactions box
  $like_statusicon='icon-wowww-new';
  // If post reaction status is UnWoww then reaction div's style to be display:block;
  $lostyle='display:block;';
    } else {
// If post reaction status is not UnWoww then show Woww from the div rel and title
  $woww_status='Woww';
     }
  // Reaction status check for "Cry"
  $Cry=functions::Like_Check($res['id',$user_id, "Cry");
  if($Cry){
  // If post reaction status is UnCry then show UnCry from the div rel and title
  $cry_status='UnCry';
  // If post reaction status is UnCry then show Cry icon from the reactions box
  $like_statusicon='icon-crying-new';
  // If post reaction status is UnCry then reaction div's style to be display:block;
  $lostyle='display:block;';
    } else {
// If post reaction status is not UnCry then show Cry from the div rel and title
  $cry_status='Cry';
     }
  // Reaction status check for "Angry"
   $angry=functions::Like_Check($res['id',$user_id, "Angry");
  if($angry){
  // If post reaction status is UnAngry then show UnAngry from the div rel and title
  $angry_status='UnAngry';
  // If post reaction status is UNAngry then show Angry icon from the reactions box
  $like_statusicon='icon-angry-new';
  // If post reaction status is UnAngry then reaction div's style to be display:block;
  $lostyle='display:block;';
    } else {
  // If post reaction status is not UnAngry then show Angry from the div rel and title
  $angry_status='Angry';
     }

echo '<div class="post-like-unlike-comment">
    <div class="like-post openCommentArea" id="'.$omsg_id.'" title="Comment" rel="'.$res['id'.'" data-id="'.$res['id'.'">
        <div class="icon-like-comment icon-talk-chat-bubble"></div>
    </div>
    <div class="like-it">
        <div class="new_like" tabindex="0" id="'.$res['id'.'">
            <div class="like-pit first_click">
                <div class="icon-lpn '.$like_statusicon.'" id="ulk'.$res['id'.'"></div>
                <div class="new_like_items first_click_wrap_content">
                    <div class="op-lw like_button" data-id="0" id="like'.$omsg_id.'" rel="'.$like_status.'" title="'.$like_status.'"><div class="icon-newL icon-like-new"></div></div>
                    <div class="op-lw like_button" data-id="1" id="love'.$omsg_id.'" rel="'.$love_status.'" title="'.$love_status.'"><div class="icon-newL icon-love-new"></div></div>
                    <div class="op-lw like_button" data-id="2" id="haha'.$omsg_id.'" rel="'.$haha_status.'" title="'.$haha_status.'"><div class="icon-newL icon-haha-new"></div></div>
                    <div class="op-lw like_button" data-id="3" id="hihi'.$omsg_id.'" rel="'.$hihi_status.'" title="'.$hihi_status.'"><div class="icon-newL icon-mmmm-new"></div></div>
                    <div class="op-lw like_button" data-id="4" id="woww'.$omsg_id.'" rel="'.$woww_status.'" title="'.$woww_status.'"><div class="icon-newL icon-wowww-new"></div></div>
                    <div class="op-lw like_button" data-id="5" id="cry'.$omsg_id.'" rel="'.$cry_status.'" title="'.$cry_status.'"><div class="icon-newL icon-crying-new"></div></div>
                    <div class="op-lw like_button" data-id="6" id="angry'.$omsg_id.'" rel="'.$angry_status.'" title="'.$angry_status.'"><div class="icon-newL icon-angry-new"></div></div>
                </div>
            </div>
        </div>
    </div>';

if ($user_id && $user_id != $res['user_id'){
                        if (($user_id && !$type1['edit' && !$set_forum['upfp' && $set['mod_forum' != 3 && $allow != 4) || ($rights >= 7 && !$set_forum['upfp')){
echo '<div class="like-it">';
                            echo '<a href="/forum/index.php?act=say&id=' . $res['id' . '&start=' . $start . '&cyt"><div class="icon-newL icon-quotes"></div></a>';
echo '</div>';
                        }
}
echo '</div>';

}

$sep = '';
$lstyle = '';
if(functions::Like_CountTotal($res['id', $user_id, in_array($sep, array('Like', 'Love', 'Haha', 'Hihi', 'Woww', 'Cry', 'Angry'))) > 0){
$lstyle="display:block;";
} else {
  //$lstyle="display:none;";
}
echo '<div class="who-likes-this-post likes reaction_wrap-style" id="likess'.$omsg_id.'" style="'.$lstyle.'">';
//Like Started
if(functions::Like_CountT($res['id', $user_id, 'Like')>0) {
       echo '<div class="likes reaction_wrap-style" id="elikes'.$omsg_id.'" style="'.$lstyle.'"><span id="like_count'.$omsg_id.'" class="numcount bbc"><div class="icon-newL icon-like-new lpos" id="clk'.$omsg_id.'"></div><div class="lcl" id="lcl'.$omsg_id.'">'.functions::Like_CountT($res['id', $user_id, 'Like').'</div></span></div>';
    } else {
       echo '<div class="likes reaction_wrap-style" id="elikes'.$omsg_id.'" style="display:none"></div>';
    }
//Love Started
if(functions::Like_CountT($res['id', $user_id, 'Love')){
echo '<div class="loves reaction_wrap-style" id="eloves'.$omsg_id.'" style="'.$lstyle.'"><span id="love_count'.$omsg_id.'" class="numcount bbc "><div class="icon-newL icon-love-new lpos" id="llk'.$omsg_id.'"></div><div class="lco" id="lco'.$omsg_id.'">'.functions::Like_CountT($res['id', $user_id, 'Love').'</div></span></div>';
} else {
   echo '<div class="loves reaction_wrap-style" id="eloves'.$omsg_id.'" style="display:none"></div>';
}
//Haha Started
if(functions::Like_CountT($res['id', $user_id, 'Haha')){
echo '<div class="hahas reaction_wrap-style" id="ehaha'.$omsg_id.'" style="'.$lstyle.'"><span id="haha_count'.$omsg_id.'" class="numcount bbc " id="haha'.$omsg_id.'"><div class="icon-newL icon-haha-new lpos" id="hlk'.$omsg_id.'"></div><div class="hco" id="hco'.$omsg_id.'">'.functions::Like_CountT($res['id', $user_id, 'Haha').'</div></span></div>';
} else {
   echo '<div class="hahas reaction_wrap-style" id="ehaha'.$omsg_id.'" style="display:none"></div>';
}
//Hihi Started
if(functions::Like_CountT($res['id', $user_id, 'Hihi')){
echo '<div class="hihis reaction_wrap-style" id="ehihi'.$omsg_id.'" style="'.$lstyle.'"><span id="hihi_count'.$omsg_id.'" class="numcount bbc " id="hihi'.$omsg_id.'"><div class="icon-newL icon-mmmm-new lpos" id="hilk'.$omsg_id.'"></div><div class="hico" id="hico'.$omsg_id.'">'.functions::Like_CountT($res['id', $user_id, 'Hihi').'</div></span></div>';
} else {
   echo '<div class="hihis reaction_wrap-style" id="ehihi'.$omsg_id.'" style="display:none"></div>';
}
//Woww Started
if(functions::Like_CountT($res['id', $user_id, 'Woww')){
echo '<div class="wowws reaction_wrap-style" id="ewoww'.$omsg_id.'" style="'.$lstyle.'"><span id="woww_count'.$omsg_id.'" class="numcount bbc " id="woww'.$omsg_id.'"><div class="icon-newL icon-wowww-new lpos" id="woow'.$omsg_id.'"></div><div class="wco" id="wco'.$omsg_id.'">'.functions::Like_CountT($res['id', $user_id, 'Woww').'</div></span></div>';
} else {
   echo '<div class="wowws reaction_wrap-style" id="ewoww'.$omsg_id.'" style="display:none"></div>';
}
//Cry Started
if(functions::Like_CountT($res['id', $user_id, 'Cry')){
echo '<div class="crys reaction_wrap-style" id="ecry'.$omsg_id.'" style="'.$lstyle.'"><span id="cry_count'.$omsg_id.'" class="numcount bbc " id="cry'.$omsg_id.'"><div class="icon-newL icon-crying-new lpos" id="cry'.$omsg_id.'"></div><div class="cco" id="cco'.$omsg_id.'">'.functions::Like_CountT($res['id', $user_id, 'Cry').'</div></span></div>';
} else {
   echo '<div class="crys reaction_wrap-style" id="ecry'.$omsg_id.'" style="display:none"></div>';
}
//Angry Started
if(functions::Like_CountT($res['id', $user_id, 'Angry')){
echo '<div class="angrys reaction_wrap-style" id="eangrys'.$omsg_id.'" style="'.$lstyle.'"><span id="angry_count'.$omsg_id.'" class="numcount bbc " id="angrys'.$omsg_id.'"><div class="icon-newL icon-angry-new lpos" id="angry'.$omsg_id.'"></div><div class="eco" id="eco'.$omsg_id.'">'.functions::Like_CountT($res['id', $user_id, 'Angry').'</div></span></div>';
} else {
    echo '<div class="angrys reaction_wrap-style" id="eangrys'.$omsg_id.'" style="display:none"></div>';
}
echo '</div>';

// mrt
?>

Copy code

- Tiếp theo là đến CSDL.
Tôi sử dụng table "forum_thank".

+ Nếu bạn đang sử dụng table "forum_thank" thì nhập file "update_sql.spl" (trong file đính kèm).
+ Nếu bạn chưa mod thank forum hoặc đang sử dụng table không phải "forum_thank" thì nhập khẩu file "sql.sql" (trong file đính kèm).

- Và cuối cùng là tải file đính kèm về... Up nên host (ngang hàng index) và giải nén.

--- Hoặc đọc hướng dẫn trong file đính kèm. ---

-----------------------
Vui lòng tôn trọng bản quyền tác giả.
Copyright by MrT98.
Nguồn: NhanhNao.XyZ
ReaCtions.zip

: 0 ♥

Tổng số: 1

Đăng nhập để trả lời · Cuối cùng

Trực Tuyến: Khách: 1