TC
/
TeaBag


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352
							<?php
include_once 'auth.php';
//Get information of local data storage from auth.php
$userAccountName = $_SESSION['login']; 
$dataStorage = $sysConfigDir . '/userdata/' .  $_SESSION['login'] . "/"; 
if (!file_exists($dataStorage)){
	//如果使用者是第一次使用 TeaBag，幫他開個新資料夾，並創建用家資料檔
	mkdir($dataStorage,0777,true);
	file_put_contents($dataStorage . "userdata.json",'{"username":"' . $userAccountName .'",
	  "accountCreationTime":"' . time() . '",
	  "invitedByUser":"Admin",
	  "permissionLevel":3,
	  "banned":false
	}');
	include_once("functions/createUserDirectories.php");
}
date_default_timezone_set("Asia/Hong_Kong");
$time = date("Y-m-d H:m:s");

include_once("getUserImage.php"); //Handle user image location. Call with getUserIconpath()
$userIcon = getUserIconPath();

?>
<html>
<head>

<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>TeaBag.tw</title>
<link rel="stylesheet" href="script/tocas/tocas.css">
<script src="script/tocas/tocas.js"></script>
<script src="script/jquery.min.js"></script>
<script>
var activeChat = "";

function showChat(id) {
	//alert(id + "," + activeChat);
	if (activeChat == id){
		$("#chatPop").hide();
		activeChat = "";
	}else{
		$("#chatPop").show();
		activeChat = id;
	}
	refresh();
	document.getElementById("chatTarget").innerHTML = activeChat;
	//Scroll to the bottom of the chat record
    setTimeout(function(){
		$('#chatHistory').scrollTop($('#chatHistory')[0].scrollHeight);
	},500);
} 

function update() {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
		document.getElementById("chatHistory").innerHTML = this.responseText;
    }
  };
  var touser = activeChat;
  var fromuser = "<?php  echo $_SESSION['login'];?>";
  var myText = document.getElementById("message").value;
  if(myText != "" && myText != null)
  {
	xhttp.open("POST", "getChatHistory.php", true);
	xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
	xhttp.send("touser="+touser+"&fromuser="+fromuser+"&message="+myText);
	//Scroll to the bottom of the chat record
	setTimeout(function(){
		$('#chatHistory').scrollTop($('#chatHistory')[0].scrollHeight);
	},500);
    
  }
  document.getElementById("message").value = "";
  
  var objDiv = document.getElementById("chatHistory");
  objDiv.scrollTop = objDiv.scrollHeight;
  
 
}


function refresh() {
	var xhttp = new XMLHttpRequest();
	xhttp.onreadystatechange = function() {
	if (this.readyState == 4 && this.status == 200) {
			document.getElementById("chatHistory").innerHTML = this.responseText;
		}
	};
	
	var touser = activeChat;
	var fromuser = "<?php echo $_SESSION['login']; ?>";
	xhttp.open("POST", "getChatHistory.php", true);
	xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
	xhttp.send("touser="+touser+"&fromuser="+fromuser);
	
}

setInterval(refresh,1000);


</script>
<style>
.extrapadding{
	padding-left:10%;
	padding-right:10%;
}
.removePadding{
	padding:0px !important;
}
.active.item{
	color:#4287f5 !important;
	font-weight: bold !important;
}
.postAvator{
	height:50px !important;
	padding-right:25px;
}
.teabag.card{
	max-width:350px;
}
.nopadding{
	padding:0px !important;
}
.selectable{
	cursor:pointer;
	padding:5px !important;
}
.selectable:hover{
	background-color:#f2f2f2 !important;
}
.online{
	color: #88db99;
}
.linebreak{
	white-space: pre-wrap;
}

.chatroomWindow{
	display:none;
	width:320px !important;
	height:500px !important;
	padding:5px !important;
	position:fixed;
	bottom:0;
	right:0;
	z-index: 99 !important;
	border-style: solid;
	border-width: 1px;
	background-color: white;
}


.chathistory{
	width:305px !important;
	height:300px !important;
	padding:5px !important;
	border: 1px solid #000;
	overflow-y: scroll;
}

.typing {
	border: 1px solid #000;
	padding:5px !important;
	width:305px !important;
}
</style>

<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<link rel="shortcut icon" href="favicon.png">
    
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ" crossorigin="anonymous">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">

<!-- Begin emoji-picker Stylesheets -->
<link href="script/css/emoji.css" rel="stylesheet">
<!-- End emoji-picker Stylesheets -->

</head>
	<body>
	<div class="ts tabbed menu extrapadding">
		<a class="item" href="index.php"><img src="img/minilogo.png" style="height:25px;"></a>
		<a class="active item" href="home.php"><i class="home icon"></i> Following</a>
		<a class="item" href="index.php"><i class="user outline icon"></i>Timeline</a>
		<a class="item" href="fdList.php"><i class="users outline icon"></i>Friend List</a>
		<div class="right item removePadding">
		<a class="item" href="logout.php"><i class="log out icon"></i>Logout</a>
		</div>
	</div>
	<div class="ts container">
	<div class="ts grid">
    <div class="four wide column">
		<div class="ts teabag card">
			<div class="image">
				<img src="<?php echo $userIcon;?>" style="max-width:300px;">
			</div>
			<div class="content">
				<div class="ts comments">
					<div class="comment">
						<div class="avatar">
							<img src="<?php echo $userIcon; ?>">
						</div>
						<div class="content">
							<a class="author"><?php include_once("functions/getUserName.php");?></a>
							<div class="text">@<?php echo $_SESSION['login']; ?></div>
						</div>
					</div>
				</div>
				<button class="ts basic mini button" onClick='$("#changeIconDiv").slideToggle();'>Change Icon</button>
				<div id="changeIconDiv" style="display:none;">
					<iframe src="uploadIcon.php">
					
					</iframe>
				</div>
			</div>
		</div>
		<!-- Advertisment -->
		<div class="ts segment" style='height:300px; overflow-y:auto;'>
			<?php 
				include_once("loadads.php");
				$adspath = initAds();
				echo '<img class="ts fluid image" src="'. $adspath .'"/>';
			?>
			
		</div>
		<!-- Chatroom List--> 
		<div class="ts segment" style='height:300px; overflow-y:auto;'>
		<?php
		$query = "select * from following where followerName = '".$_SESSION['login']. "'";
		include_once("requestDB.php"); //Handle all Database access, see the query command below
		$followerResult = query($query,"teabag");
		foreach ($followerResult as $chat){
			echo '
			<div class="ts nopadding comments">
				<div class="comment selectable">
					<a class="avatar">
						<img src="img/dummy.png">
					</a>
					<div class="content">
						<a class="author">'.$chat["targetName"].'</a>
						<div class="inline text">
							現時在線
						</div>
						<div class="middoted actions">
							<a id="'.$chat["targetName"].'" onClick="showChat(this.id);">
								<i class="comment online icon"></i> 打開聊天室
							</a>
						</div>
					</div>
				</div>
				</div>
				';
		}	
				?>
<!--
			<div class="ts nopadding comments">
				<div class="comment selectable">
					<a class="avatar">
						<img src="img/dummy.png">
					</a>
					<div class="content">
						<a class="author">小白</a>
						<div class="inline text">
							現時在線
						</div>
						<div class="middoted actions">
							<a>
								<i class="comment online icon"></i> 打開聊天室
							</a>
						</div>
					</div>
				</div>
				<div class="comment selectable">
					<a class="avatar">
						<img src="img/dummy.png">
					</a>
					<div class="content">
						<a class="author">小綠</a>
						<div class="inline text">
							10分鐘前在線
						</div>
						<div class="middoted actions">
							<a>
								<i class="comment icon"></i> 留言
							</a>
						</div>
					</div>
				</div>
			</div>
-->
		</div>
	</div>
    <div class="twelve wide column">
		<?php
			//Show all the other's post in this page
			include_once("requestDB.php"); //Handle all Database access, see the query command below
			$username = $_SESSION['login'];
			$postData = query("select * from post where (username IN (SELECT `targetName` FROM `following` WHERE `followerName`='" . $username . "')) OR username='" . $username . "'  ORDER BY postid DESC","teabag");
			include_once("getUserImage.php");
			foreach ($postData as $post){
				//Get the number of comments on this object
				$pid = $post["postid"];
				$commentLength = query("SELECT COUNT(*) FROM comments WHERE postid='" . $pid . "'","teabag");
				$commentNumber = $commentLength[0]["COUNT(*)"];
				echo '
				<div class="ts card" style="margin-bottom:0px; !important">
					<div class="content">
						<div class="header"><img class="ts image postAvator" src="' . getUserIconPathByUsername($post["username"]) .'" style="margin-right:-20px;width:80px;height:80px;">' . $post["username"] . '</div>
						<div class="meta">
							<a>@ '.$post["posttime"].'</a>
						</div>
						<div class="description">
							<p>'.$post["content"].'</p>
						</div>
					</div>
				</div>
				';

				if ($commentNumber > 0){
					//There is comment on this post
					echo '<div class="ts primary attached message" style="margin-top:0px; !important">
						<p>' . $commentNumber . ' people has commented this post. <a href="comment.php?post=' . $pid . '">CLICK HERE to share yours?</a></p>
					</div>';
				}else{
					echo '<div class="ts attached message" style="margin-top:0px; !important">
						<a href="comment.php?post=' . $pid . '">Leave a comment</a>
					</div>';
				}
			}
		?>
	</div>
	</div>
</div>

</div>

<div class="chatroomWindow" id="chatPop" style="position:fixed;right:0px;bottom:0px;z-index:999;">
<script>
refresh();
</script>
<div id="chatHistory" class="chathistory"></div>
<form name="message" method="post">
	<a id="chatTarget" class="author"></a><br/>
    <p class="lead emoji-picker-container"><textarea rows="4" placeholder="Write something here to chat!" name="message" cols="40" class="typing" id="message" data-emojiable="true"></textarea></p>
	<input type="button" onclick="update()" class="ts primary fluid button" value="Send">
</form>
</div>
	</body>
</html>