fjy8018/VANTEN
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

.

Browse Source
This commit is contained in:
FJY
2017-10-29 23:12:34 +08:00
parent 01602e09d9
commit 2e2b37022b
38 changed files with 6226 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

108
WebRoot/chartroom/index.html Normal file
View File

@@ -0,0 +1,108 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<meta name="description" content="">
<meta name="author" content="">
<title>Off Canvas Template for Bootstrap</title>
<!-- Bootstrap core CSS -->
<link href="../css/bootstrap.css" rel="stylesheet">
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<link href="../css/ie10-viewport-bug-workaround.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="offcanvas.css" rel="stylesheet">
<!-- Just for debugging purposes. Don't actually copy these 2 lines! -->
<!--[if lt IE 9]><script src="../../assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
<script src="../js/ie-emulation-modes-warning.js"></script>
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<nav class="navbar navbar-fixed-top navbar-inverse">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Project name</a>
</div>
<div id="navbar" class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
</div><!-- /.nav-collapse -->
</div><!-- /.container -->
</nav><!-- /.navbar -->
<div class="container">
<div class="row row-offcanvas row-offcanvas-right">
<div class="col-xs-12 col-sm-9">
<p class="pull-right visible-xs">
<button type="button" class="btn btn-primary btn-xs" data-toggle="offcanvas">Toggle nav</button>
</p>
<div class="row">
<div class="col-xs-6 col-lg-4">
<h2>Heading</h2>
<p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
<p><a class="btn btn-default" href="#" role="button">View details &raquo;</a></p>
</div>
</div>
</div>
</div><!--/.col-xs-12.col-sm-9-->
<div class="col-xs-6 col-sm-3 sidebar-offcanvas" id="sidebar">
<div class="list-group">
<a href="#" class="list-group-item active" id="online">在线人员列表</a>
<a href="#" class="list-group-item">Link</a>
<a href="#" class="list-group-item">Link</a>
<a href="#" class="list-group-item">Link</a>
<a href="#" class="list-group-item">Link</a>
<a href="#" class="list-group-item">Link</a>
<a href="#" class="list-group-item">Link</a>
<a href="#" class="list-group-item">Link</a>
<a href="#" class="list-group-item">Link</a>
<a href="#" class="list-group-item">Link</a>
</div>
</div><!--/.sidebar-offcanvas-->
</div><!--/row-->
<hr>
<footer>
<p>&copy; 2016 Company, Inc.</p>
</footer>
</div><!--/.container-->
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="../../assets/js/vendor/jquery.min.js"><\/script>')</script>
<script src="../js/bootstrap.min.js"></script>
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<script src="../js/ie10-viewport-bug-workaround.js"></script>
<script src="offcanvas.js"></script>
</body>
</html>

16
WebRoot/chartroom/main.jsp
View File

@@ -10,7 +10,7 @@
<link href="../css/chart_style.css" rel="stylesheet">
<link href="../css/bootstrap.css" rel="stylesheet">
<script language="javascript" src="../js/AjaxRequest.js"></script>
<link rel="stylesheet" href="。。/css/emoji.css">
<link rel="stylesheet" href="../css/emoji.css">
<script language="javascript">
window.setInterval("showContent();", 1000);
window.setInterval("showOnline();", 10000);
@@ -55,15 +55,15 @@ function set(selectPerson){ //
}
}
</script>
<script language="jscript">
window.onbeforeunload = function() { //当用户单击浏览器中的“关闭”按钮时，执行退出操作
if (event.clientY < 0 && event.clientX > document.body.scrollmax - width) {
Exit(); //执行退出操作
}
}
<script language="javascript">
$(window).on('beforeunload', function() {
return '您的视频时间尚未结束，现在退出将无法回到视频';
})
</script>
</head>
<body onLoad="showContent();showOnline();set('所有人');" onbeforeunload="Exit()">
<body onLoad="showContent();showOnline();set('所有人');">
<div class="container">
<div class="row">
<div class="chatTop"></div>

191
WebRoot/chartroom/main2.html Normal file
View File

@@ -0,0 +1,191 @@
<%@ page contentType="text/html; charset=gb2312" language="java"
import="java.sql.*"%>
<%
request.setCharacterEncoding("gb2312");
%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>聊天室</title>
<link href="../css/chart_style.css" rel="stylesheet">
<link href="../css/bootstrap.css" rel="stylesheet">
<script language="javascript" src="../js/AjaxRequest.js"></script>
<link rel="stylesheet" href="../css/emoji.css">
<!-- <script language="javascript">
window.setInterval("showContent();", 1000);
window.setInterval("showOnline();", 10000);
//此处需要加&nocache="+new Date().getTime()，否则将出现在线人员列表不更新的情况
function showOnline() {
var loader = new net.AjaxRequest("online.jsp?nocache=" + new Date().getTime(), deal_online, onerror, "GET");
}
function showContent() {
var loader1 = new net.AjaxRequest("content.jsp?nocache=" + new Date().getTime(), deal_content, onerror, "GET");
}
function onerror() {
alert("很抱歉，服务器出现错误，当前窗口将关闭！");
window.opener = null;
window.close();
}
function deal_online() {
online.innerHTML = this.req.responseText;
}
function deal_content() {
content.innerHTML = this.req.responseText;
}
</script> -->
<!-- <script language="javascript">
function check() { //验证聊天信息
if (form1.tempuser.value == "") {
alert("请选择聊天对象！");return false;
}
if (form1.message.value == "") {
alert("发送信息不可以为空！");form1.message.focus();return false;
}
}
function Exit() {
window.location.href = "leave.jsp";
}
</script>
<script language="javascript">
function set(selectPerson){ //自动添加聊天对象
if(selectPerson!="<%=session.getAttribute("actualuser")%>"){
form1.tempuser.value=selectPerson;
}else{
alert("请重新选择聊天对象！");
}
}
</script>
<script language="javascript">
$(window).on('beforeunload', function() {
return '您的视频时间尚未结束，现在退出将无法回到视频';
})
</script> -->
</head>
<body onLoad="showContent();showOnline();set('所有人');">
<div class="container">
<div class="row">
<div class="chatTop"></div>
</div>
<div class="row">
<div id="online" class="col-xs-3 col-sm-3 list">在线人员列表</div>
<div id="content" class="col-xs-9 col-sm-9 chat">聊天内容</div>
</div>
<div class="row">
<div class="chatsent">
<form role="form" action="send.jsp" name="form1" method="post"
onSubmit="return check()">
<p>
<span class="emotion glyphicon glyphicon-heart"></span>
</p>
<div class="chatsentinput">
[<%=session.getAttribute("actualuser")%>
]对 <input name="tempuser" type="text" value="" size="35"
readonly="readonly"> 表情 <select name="select"
class="wenbenkuang">
<option value="无表情的">无表情的</option>
<option value="微笑着" selected>微笑着</option>
<option value="笑呵呵地">笑呵呵地</option>
<option value="热情的">热情的</option>
<option value="温柔的">温柔的</option>
<option value="红着脸">红着脸</option>
<option value="幸福的">幸福的</option>
<option value="嘟着嘴">嘟着嘴</option>
<option value="热泪盈眶的">热泪盈眶的</option>
<option value="依依不舍的">依依不舍的</option>
<option value="得意的">得意的</option>
<option value="神秘兮兮的">神秘兮兮的</option>
<option value="恶狠狠的">恶狠狠的</option>
<option value="大声的">大声的</option>
<option value="生气的">生气的</option>
<option value="幸灾乐祸的">幸灾乐祸的</option>
<option value="同情的">同情的</option>
<option value="遗憾的">遗憾的</option>
<option value="正义凛然的">正义凛然的</option>
<option value="严肃的">严肃的</option>
<option value="慢条斯理的">慢条斯理的</option>
<option value="无精打采的">无精打采的</option>
</select> 说： <input id="message" name="message" type="text" width="100px">
字体颜色： <select name="color" size="1" class="wenbenkuang"
id="select">
<option selected>默认颜色</option>
<option style="color:#FF0000" value="FF0000">红色热情</option>
<option style="color:#0000FF" value="0000ff">蓝色开朗</option>
<option style="color:#ff00ff" value="ff00ff">桃色浪漫</option>
<option style="color:#009900" value="009900">绿色青春</option>
<option style="color:#009999" value="009999">青色清爽</option>
<option style="color:#990099" value="990099">紫色拘谨</option>
<option style="color:#990000" value="990000">暗夜兴奋</option>
<option style="color:#000099" value="000099">深蓝忧郁</option>
<option style="color:#999900" value="999900">卡其制服</option>
<option style="color:#ff9900" value="ff9900">镏金岁月</option>
<option style="color:#0099ff" value="0099ff">湖波荡漾</option>
<option style="color:#9900ff" value="9900ff">发亮蓝紫</option>
<option style="color:#ff0099" value="ff0099">爱的暗示</option>
<option style="color:#006600" value="006600">墨绿深沉</option>
<option style="color:#999999" value="999999">烟雨蒙蒙</option>
</select> <input name="Submit2" type="submit" class="btn btn-default send"
value="发送">
</div>
<input name="button_exit" type="button" class="btn_orange"
value="退出聊天室" onClick="Exit()">
</form>
</div>
</div>
</div>
</body>
<script src="../js/jquery.min.js"></script>
<script type="text/javascript" src="../js/jquery.qqFace.js"></script>
<script type="text/javascript">
$(function(){
$('.emotion').qqFace({
id : 'facebox',
assign:'message',
path:'arclist/' //表情存放的路径
});
$(".send").click(function(){
var str = $("#message").val();
$("#show").html(replace_em(str));
});
});
//查看结果
function replace_em(str){
str = str.replace(/\</g,'&lt;');
str = str.replace(/\>/g,'&gt;');
str = str.replace(/\n/g,'<br/>');
str = str.replace(/\[em_([0-9]*)\]/g,'<img src="arclist/$1.gif" border="0" />');
return str;
}
</script>
</html>

59
WebRoot/chartroom/offcanvas.css Normal file
View File

@@ -0,0 +1,59 @@
/*
* Style tweaks
* --------------------------------------------------
*/
html,
body {
overflow-x: hidden; /* Prevent scroll on narrow devices */
}
body {
padding-top: 70px;
}
footer {
padding: 30px 0;
}
/*
* Off Canvas
* --------------------------------------------------
*/
@media screen and (max-width: 767px) {
.row-offcanvas {
position: relative;
-webkit-transition: all .25s ease-out;
-o-transition: all .25s ease-out;
transition: all .25s ease-out;
}
.row-offcanvas-right {
right: 0;
}
.row-offcanvas-left {
left: 0;
}
.row-offcanvas-right
.sidebar-offcanvas {
right: -50%; /* 6 columns */
}
.row-offcanvas-left
.sidebar-offcanvas {
left: -50%; /* 6 columns */
}
.row-offcanvas-right.active {
right: 50%; /* 6 columns */
}
.row-offcanvas-left.active {
left: 50%; /* 6 columns */
}
.sidebar-offcanvas {
position: absolute;
top: 0;
width: 50%; /* 6 columns */
}
}

5
WebRoot/chartroom/offcanvas.js Normal file
View File

@@ -0,0 +1,5 @@
$(document).ready(function () {
$('[data-toggle="offcanvas"]').click(function () {
$('.row-offcanvas').toggleClass('active')
});
});