/* Sympathy module - v0.1
*  Mod author: alexxkur
*  Installation time: 5 minutes
*  Files to modify: /includes/init_bb.php, /viewtopic.php, /templates/default/viewtopic.tpl, 
*					/templates/default/css/main.css, /includes/ucp/usercp_viewprofile.php,
*					/templates/default/usercp_viewprofile.tpl
*/

1.	Run query

			CREATE TABLE IF NOT EXISTS `bb_posts_likes` (
			  `post_id` mediumint(8) unsigned NOT NULL,
			  `author_id` mediumint(8) unsigned NOT NULL,
			  `vote_time` int(11) NOT NULL
			) ENGINE=InnoDB DEFAULT CHARSET=utf8;
	
	Run query
			
			ALTER TABLE  `bb_users` ADD  `user_sympathies` MEDIUMINT( 8 ) NOT NULL
			

2.	Open 

				/includes/init_bb.php
				
	Find ( ~ line 362 )
	
				define('BB_POSTS_HTML', 'bb_posts_html'); 
				
	After add
	
				define('BB_POSTS_LIKES', 'bb_posts_likes');
				

3.	Open 

				/viewtopic.php
	
	Find ( ~ line 381 )
	
				$sql = "
					SELECT
						u.username, u.user_id, u.user_rank, u.user_posts, u.user_from,
						u.user_regdate, u.user_sig,
						u.avatar_ext_id,
						u.user_opt, u.user_gender, u.user_birthday,
						p.*,
						u2.username as mc_username, u2.user_rank as mc_user_rank,
						h.post_html, IF(h.post_html IS NULL, pt.post_text, NULL) AS post_text
					FROM      ". BB_POSTS      ." p
					LEFT JOIN ". BB_USERS      ." u  ON(u.user_id = p.poster_id)
					LEFT JOIN ". BB_POSTS_TEXT ." pt ON(pt.post_id = p.post_id)
					LEFT JOIN ". BB_POSTS_HTML ." h  ON(h.post_id = p.post_id)
					LEFT JOIN ". BB_USERS      ." u2 ON(u2.user_id = p.mc_user_id)
					WHERE p.topic_id = $topic_id
						$limit_posts_time
					GROUP BY p.post_id
					ORDER BY p.post_time $post_order
					LIMIT $start, $posts_per_page
				";
				
	Change to
						
				$sql = "
					SELECT
						u.username, u.user_id, u.user_rank, u.user_posts, u.user_from, u.user_sympathies,
						u.user_regdate, u.user_sig,
						u.avatar_ext_id,
						u.user_opt, u.user_gender, u.user_birthday,
						p.*,
						GROUP_CONCAT(ul.username ORDER BY l.vote_time DESC) as rated_usernames,
						GROUP_CONCAT(ul.avatar_ext_id ORDER BY l.vote_time DESC) as rated_avatars,
						GROUP_CONCAT(l.author_id ORDER BY l.vote_time DESC) as rated_ids,
						u2.username as mc_username, u2.user_rank as mc_user_rank,
						h.post_html, IF(h.post_html IS NULL, pt.post_text, NULL) AS post_text
					FROM      ". BB_POSTS      ." p
					LEFT JOIN ". BB_USERS      ." u  ON(u.user_id = p.poster_id)
					LEFT JOIN ". BB_POSTS_TEXT ." pt ON(pt.post_id = p.post_id)
					LEFT JOIN ". BB_POSTS_HTML ." h  ON(h.post_id = p.post_id)
					LEFT JOIN ". BB_POSTS_LIKES." l  ON(l.post_id = p.post_id)
					LEFT JOIN ". BB_USERS      ." ul ON(ul.user_id = l.author_id)					
					LEFT JOIN ". BB_USERS      ." u2 ON(u2.user_id = p.mc_user_id)
					WHERE p.topic_id = $topic_id
						$limit_posts_time
					GROUP BY p.post_id
					ORDER BY p.post_time $post_order
					LIMIT $start, $posts_per_page
				";
				
	Find ( ~ line 846)
	
				$mc_select_type = array();
				foreach ($lang['MC_COMMENT'] as $key => $value)
				{
					$mc_select_type[$key] = $value['type'];
				}
				
	After add
	
				//Sympathy module
				
				$post_likes_lang = ' ';
				$post_likes_status = 'false';
				$likes_more_lang = FALSE;
				$post_likes_total = 0;
				$likes_HTML = NULL;
				$likes_HTML_more = NULL;
				( $poster == $userdata['username'] ) ? $post_is_creator = TRUE : $post_is_creator = FALSE;
				
				if( isset( $postrow[$i]['rated_ids'] ) )
				{
					//$post_likes_array = array_combine( explode( ',', $postrow[$i]['rated_ids'] ), explode( ',', $postrow[$i]['rated_usernames'] ) );
					$likers_ids = explode( ',', $postrow[$i]['rated_ids']);
					$likers_usrnames = explode( ',', $postrow[$i]['rated_usernames'] );
					$likers_avatars = explode( ',', $postrow[$i]['rated_avatars'] );
					$post_likes_array = array();
					
					foreach( $likers_ids as $id => $value ) {
						$post_likes_array[$value]['username'] = $likers_usrnames[$id];
						$post_likes_array[$value]['avatar'] = ( $likers_avatars[$id] != 0 ) ? '/images/avatars/' . get_avatar_path ( $value, $likers_avatars[$id] ) : '/images/avatars/gallery/noavatar.png';
					}
					
					
					$post_likes_total = count( $post_likes_array );
					
					$post_likes_show = TRUE;
					$likes_show_count = 4;
					$inc = 0;
					
					if( isset( $post_likes_array[$userdata['user_id']] ) )
					{
						unset( $post_likes_array[$userdata['user_id']] );
						$post_likes_array = array( $userdata['username'] => array( 'username' => '' ) ) + $post_likes_array;
						$post_likes_lang = '  ';
						$post_likes_status = 'true';
						
					}
					
					if( $post_likes_total > $likes_show_count) {
						$post_likes_left = $post_likes_total - $likes_show_count;
						$likes_more_lang = '<div style="cursor:pointer; float:left" onclick=" likes_more( \'' . $post_id . '\' ); ">   ' . $post_likes_left . '</div>';
					}
					
					foreach ($post_likes_array as $id => $l_data) {
						$inc++;
						
						if( $inc <= $likes_show_count )
						{
							if( $inc == $likes_show_count or $inc == $post_likes_total ) $likes_HTML .= '<div style="float:left; padding-right: 3px"><a href="/' . PROFILE_URL . $id . '">' . $l_data['username'] . '</a></div>';
							else $likes_HTML .= '<div style="float:left; padding-right: 3px"><a href="/' . PROFILE_URL . $id . '">' . $l_data['username'] . '</a>,</div>';
						}
						else $likes_HTML_more .= '<p class="like_list"><span style="background-image: url(' . $l_data['avatar'] . ')" class="cutted_img"></span><a style="color:inherit !important;" href="/' . PROFILE_URL . $id . '">' . $l_data['username'] . '</a></p>';
						
					}
					
				}
				
	Find ( ~ line 886 )
	
				'IP' => $ip_btn,
				
	After add
	
				'POST_LIKES'         => $post_likes_total,
				'POST_LIKES_HTML'    => $likes_HTML,
				'POST_LIKES_MORE'	 => $likes_HTML_more,
				'POST_LIKES_LANG'	 => $post_likes_lang,
				'POST_IS_CREATOR'	 => $post_is_creator,
				'POST_LIKES_ACTIVE'	 => $post_likes_status,
				'THIS_USERNAME'		 => $userdata['username'],
				'THIS_USER_ID'		 => $userdata['user_id'],
				'POST_LIKES_M_LANG'	 => $likes_more_lang,
				'POSTER_SYMPATHIES'  => $postrow[$i]['user_sympathies'],
				

4.	Open 

				/templates/default/viewtopic.tpl	
				
	Find ( ~ line 370 )
	
				<!-- IF postrow.POSTER_POSTS --><p class="posts"><em>{L_POSTS}:</em> {postrow.POSTER_POSTS}</p><!-- ENDIF -->
				
	After add
	
				<!-- IF postrow.POSTER_SYMPATHIES > 0 --><p class="posts"><em>:</em> {postrow.POSTER_SYMPATHIES}</p><!-- ENDIF -->
	
	Find ( ~ line 421 )
				
				<!--/post_body-->
				
	After add
				
				<!-- post_bottom -->
				<div style=" display: table; margin: 8px">
				
					<script type="text/javascript" src="/misc/js/perfect-scrollbar.with-mousewheel.min.js"></script>
					<script type="text/javascript" src="/misc/js/perfect-scrollbar.min.js"></script>
					
					<script type="text/javascript">	
					
					likes_state = new Array();
					more_state = new Array();
					
					//Sending data
					
					 function like( id, active )
					 {
						
						if( likes_state[id] == undefined ) likes_state[id] = active;

						if( likes_state[id] )
						{
							$.ajax({
								url:"/sympathy.php", 
								data: { dislike : id },
								success:function(data){
									likes_state[id] = false;
									$( '#lb_' + id ).html( '[ ]' );
									$('#usrs_' +id).children(":first-child").remove();
									if ( $( '#usrs_' + id ).html() == "" ) $( '#simpathy_container' + id ).html( '' ); 
								}
							});
						}
						else if( !likes_state[id] )
						{		
							$.ajax({
								url:"/sympathy.php", 
								data: { like : id },
								success:function(data){
									likes_state[id] = true;
									$( '#lb_' + id ).html( '[  ]' );
									if ( $( '#usrs_' + id ).length )  $( '#usrs_' + id ).html( '<div style="float:left; padding-right: 3px"><a href="{postrow.THIS_USER_ID}"></a>, </div>' + $( '#usrs_' + id ).html() )
									else $( '#simpathy_container' + id ).html( '<div class="sympathy_container"><div style="float:left; padding-right: 3px" id="usrs_' + id + '"><div><a href="{postrow.THIS_USER_ID}"></a> </div></div><div style="float:left">  </div></div>' );							
								}
							});
						}
						
					 }		
					
					//Showing more sympathies
					
					function likes_more( id )
					{
						if( more_state[id] == undefined ) more_state[id] = false;
					
						if( more_state[id] == false ) { 
							$('#more' + id).show('fast'); 
							more_state[id] = true; 
							setTimeout( function(){ $('.likes_more_wrap').perfectScrollbar('update') }, 200) //So strange
						}
						else { $('#more' + id).hide('fast'); more_state[id] = false; }		
						
					}

					//Custom scroll bar
					
					$(document).ready(function ($) {
						$('.likes_more_wrap').perfectScrollbar({
							wheelSpeed: 2,
							wheelPropagation: false
						});
					});			
					
					</script>
					
					<div style="margin-top:10px; font-family: 'Trebuchet MS',Helvetica,Arial,sans-serif">
						<!-- IF LOGGED_IN and not postrow.POST_IS_CREATOR -->
							<div onclick="like({postrow.POST_ID}, {postrow.POST_LIKES_ACTIVE}); " id="lb_{postrow.POST_ID}" style="margin: 5px 2px; font-size: 11px; color: #006699; cursor: pointer">[{postrow.POST_LIKES_LANG}]</div>
						<!-- ENDIF -->
						<div id="simpathy_container{postrow.POST_ID}">
							<!-- IF postrow.POST_LIKES > 0 -->			
								<div class="sympathy_container">
									<div style="float:left" id="usrs_{postrow.POST_ID}">{postrow.POST_LIKES_HTML}</div>
									<!-- IF postrow.POST_LIKES_MORE -->
										<div style="float:left; padding-right: 3px">
											<div style="display: none; position: absolute; margin-top: 30px; margin-left: 5px" id="more{postrow.POST_ID}">
												<div class="top_arrow"></div>
												<div class="likes_more">
													<div class="likes_more_wrap">
														{postrow.POST_LIKES_MORE}
													</div>
												</div>
											</div>
											{postrow.POST_LIKES_M_LANG}
										</div>
									<!-- ENDIF -->
									<div style="float:left">   </div>
								</div>
							<!-- ENDIF -->
						</div>
					</div>			
				</div>
				<!-- /post_bottom -->				
				

5.	Open
				
				/includes/ucp/usercp_viewprofile.php
				
	Find
				
				'TRAF_STATS'           => !(IS_AM || $profile_user_id),
				
	After add ( ~ line 140 )
	
				'USER_SYMPATHIES'      => $profiledata['user_sympathies']
				
		
6.	Open

				/templates/default/usercp_viewprofile.tpl
				
	Find ( ~line 360 )

			<tr>
				<th>{L_TOTAL_POSTS}:</th>
				<td>
					<p>
						<b>{POSTS}</b>
						[ <a href="{U_SEARCH_USER}" class="med">{L_SEARCH_USER_POSTS}</a> ]
						[ <a href="{U_SEARCH_TOPICS}" class="med">{L_SEARCH_USER_TOPICS}</a> ]
						[ <a class="med" href="{U_SEARCH_RELEASES}">{L_SEARCH_RELEASES}</a> ]
						<!-- IF PROFILE_USER -->[ <a class="med" href="{U_WATCHED_TOPICS}">{L_WATCHED_TOPICS}</a> ]<!-- ENDIF -->
					</p>
				</td>
			</tr>

	After add
	
			<script type="text/javascript">
				function recount_sympathies()
				{
					$.ajax({
						url:"/sympathy.php", 
						data: { update : {PROFILE_USER_ID} },
						success:function(data){
							$('#sympathy_button').text('');
							$('#sympathy_container').text(data);
						}
					});					
				}
			</script>
			
			<tr>
				<th>:</th>
				<td>
					<p>
						<b id="sympathy_container">{USER_SYMPATHIES}</b>
						<!-- IF PROFILE_USER or IS_ADMIN -->[ <a href="/sympathy.php?user={PROFILE_USER_ID}" class="med"></a> ]<!-- ENDIF -->
						<!-- IF IS_ADMIN -->[ <a id="sympathy_button" onclick="recount_sympathies()" class="med"> </a> ]<!-- ENDIF -->
					</p>
				</td>
			</tr>

			
7.	Open 

				/templates/default/css/main.css
				
	Find ( ~ line 764 )
				
				.post_body { margin: 5px 5px 8px; }
	
	Change to
				
				.post_body { margin: 5px 5px 8px;min-height: 140px}
	
	Add in the end
	
				/* SIMPATHY */

				.sympathy_container {
					background: #F0F7FC;
					display: inline-block; 
					padding: 5px 5px; 
					font-size: 12px; 
					border: 1px solid #a5cae4;
					border-radius: 5px
				}
				.likes_more {
					max-height: 120px;
					width: 105px;
					border-radius: 4px;
					position: relative;
					background: rgba(0, 0, 0, 0.9);
					overflow: hidden;
				}
				.like_list {
					margin: 5px 8px;
					color: white;
					overflow: hidden;
					text-overflow: ellipsis;
					white-space: nowrap;
					width: 85px;
				}
				.top_arrow {
					background-image: url(../images/arrow_top.png);
					height: 10px;
					width: 16px;
					position: relative;
					left: 10px;
					opacity: 0.9;
				}
				.likes_more {
					border-radius: 4px;
					position: relative;
					background: rgba(0, 0, 0, 0.9);
					padding: 7px 2px;
					box-shadow: 1px 1px 6px -1px black;
				}
				.likes_more_wrap {
					max-height: 120px;
					width: 107px;
					position: relative;
					overflow: hidden;
				}
				.cutted_img {
					height: 15px;
					width: 15px;
					background-position: center;
					background-size: cover;
					margin-top: 2px;
					margin-right: 5px;
					display: block;
					float: left;
					border-radius: 3px;
				}

				div.sympathy_container {
					float:left;
				}

				/*! perfect-scrollbar - v0.4.10
				* http://noraesae.github.com/perfect-scrollbar/
				* Copyright (c) 2014 Hyeonje Alex Jun; Licensed MIT */

				.ps-container .ps-scrollbar-x-rail{
					position:absolute;
					bottom:3px;
					height:8px;
					-webkit-border-radius:4px;
					-moz-border-radius:4px;
					border-radius:4px;
					opacity:0;
					filter:alpha(opacity=0);
					-o-transition:background-color .2s linear,opacity .2s linear;
					-webkit-transition:background-color .2s linear,opacity .2s linear;
					-moz-transition:background-color .2s linear,opacity .2s linear;
					transition:background-color .2s linear,opacity .2s linear
				}
				.ps-container:hover .ps-scrollbar-x-rail,.ps-container.hover .ps-scrollbar-x-rail{ opacity:.6;filter:alpha(opacity=60)}
				.ps-container .ps-scrollbar-x-rail:hover,.ps-container .ps-scrollbar-x-rail.hover{opacity:.9;filter:alpha(opacity=90)}
				.ps-container .ps-scrollbar-x-rail.in-scrolling{opacity:.9;filter:alpha(opacity=90)}
				.ps-container .ps-scrollbar-y-rail{
					position:absolute;
					right:3px;
					width:8px;
					-webkit-border-radius:4px;
					-moz-border-radius:4px;
					border-radius:4px;opacity:0;
					filter:alpha(opacity=0);
					-o-transition:background-color .2s linear,opacity .2s linear;
					-webkit-transition:background-color .2s linear,opacity .2s linear;
					-moz-transition:background-color .2s linear,opacity .2s linear;
					transition:background-color .2s linear,opacity .2s linear
				}
				.ps-container:hover .ps-scrollbar-y-rail,.ps-container.hover .ps-scrollbar-y-rail{opacity:.6;filter:alpha(opacity=60)}
				.ps-container .ps-scrollbar-y-rail:hover,.ps-container .ps-scrollbar-y-rail.hover{opacity:.9;filter:alpha(opacity=90)}
				.ps-container .ps-scrollbar-y-rail.in-scrolling{opacity:.9;filter:alpha(opacity=90)}
				.ps-container .ps-scrollbar-x{
					position:absolute;
					bottom:0;height:8px;
					background-color:#aaa;
					-webkit-border-radius:4px;
					-moz-border-radius:4px;
					border-radius:4px;
					-o-transition:background-color .2s linear;
					-webkit-transition:background-color.2s linear;
					-moz-transition:background-color .2s linear;
					transition:background-color .2s linear
				}
				.ps-container.ie6 .ps-scrollbar-x{font-size:0}
				.ps-container .ps-scrollbar-x-rail:hover .ps-scrollbar-x,.ps-container .ps-scrollbar-x-rail.hover .ps-scrollbar-x{background-color:#999}
				.ps-container .ps-scrollbar-y{
					position:absolute;
					right:0;width:8px;
					background-color:#aaa;
					-webkit-border-radius:4px;
					-moz-border-radius:4px;
					border-radius:4px;
					-o-transition:background-color .2s linear;
					-webkit-transition:background-color.2s linear;
					-moz-transition:background-color .2s linear;
					transition:background-color .2s linear
				}
				.ps-container.ie6 .ps-scrollbar-y{font-size:0}
				.ps-container .ps-scrollbar-y-rail:hover .ps-scrollbar-y,.ps-container .ps-scrollbar-y-rail.hover .ps-scrollbar-y{background-color:#999}
				.ps-container.ie .ps-scrollbar-x,.ps-container.ie .ps-scrollbar-y{visibility:hidden}
				.ps-container.ie:hover .ps-scrollbar-x,.ps-container.ie:hover .ps-scrollbar-y,.ps-container.ie.hover .ps-scrollbar-x,.ps-container.ie.hover .ps-scrollbar-y{visibility:visible}
				

8. Extract all files from 'upload' folder to your server directory.

	IN FUTURE UPDATES:
		- Updating users' statistic by cron
		- Add social buttons pack
		- Optimise database queries in voting requests
		- Add language supporn
		- Fix some bugs :)
