136 lines
4.2 KiB
HTML
136 lines
4.2 KiB
HTML
|
|
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>WebRTC</title>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<meta name="description" content="">
|
|
<meta name="author" content="">
|
|
|
|
<!-- Le styles -->
|
|
<link href="js/bootstrap/css/bootstrap.css" rel="stylesheet">
|
|
<style type="text/css">
|
|
body {
|
|
padding-top: 40px;
|
|
padding-bottom: 40px;
|
|
}
|
|
|
|
video {
|
|
width: 100%;
|
|
height: 100%;
|
|
float: left;
|
|
}
|
|
|
|
.sidebar-nav {
|
|
padding: 9px 0;
|
|
}
|
|
|
|
@media (max-width: 980px) {
|
|
/* Enable use of floated navbar text */
|
|
.navbar-text.pull-right {
|
|
float: none;
|
|
padding-left: 5px;
|
|
padding-right: 5px;
|
|
}
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<div id="main">
|
|
<div class="navbar navbar-inverse navbar-fixed-top">
|
|
<div class="navbar-inner">
|
|
<div class="container-fluid">
|
|
<div class="nav-collapse collapse">
|
|
<ul class="nav">
|
|
<li><a href="#" onclick="talkFunction(false)"><i class="icon-user icon-white"></i> People</a></li>
|
|
<li><a href="#" onclick="talkFunction(true)"><i class="icon-facetime-video icon-white"></i> Talk</a></li>
|
|
</ul>
|
|
<form id="form" class="navbar-form pull-right">
|
|
<input id="user" class="span2" type="text" placeholder="User name">
|
|
<button id="submit" type="submit" class="btn">Sign in</button>
|
|
</form>
|
|
</div><!--/.nav-collapse -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div class="container-fluid">
|
|
<div class="row-fluid">
|
|
<div id="people">
|
|
<div id="people_content">
|
|
<div class="carousel slide span10" id="myPeopleCarousel">
|
|
<div class="carousel-inner people-carousel"></div>
|
|
<a data-slide="prev" href="#myPeopleCarousel" class="left carousel-control">‹</a>
|
|
<a data-slide="next" href="#myPeopleCarousel" class="right carousel-control">›</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="thumbnail span2">
|
|
<video id="sourceSmallvid" autoplay></video>
|
|
</div>
|
|
|
|
<div id="room_content">
|
|
<div class="carousel slide span10" id="myRoomCarousel">
|
|
<div class="carousel-inner rooms-carousel"></div>
|
|
<a data-slide="prev" href="#myRoomCarousel" class="left carousel-control">‹</a>
|
|
<a data-slide="next" href="#myRoomCarousel" class="right carousel-control">›</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="inner"></div><!--/inner-->
|
|
</div><!--/people-->
|
|
|
|
<div id="share" class="span12">
|
|
</div><!--/share-->
|
|
|
|
<div id="me" class="span12">
|
|
</div><!--/me-->
|
|
|
|
</div><!--/row-->
|
|
</div><!--/.fluid-container-->
|
|
</div><!--/.main-->
|
|
|
|
<div id="acceptModal" class="modal hide fade">
|
|
<div class="modal-header">
|
|
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
|
<h3 id="callerTitle"></h3>
|
|
</div>
|
|
<div class="modal-body">
|
|
<p id="caller"></p>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<a id="accept" href="#" class="btn btn-primary">Accept</a>
|
|
<a id="reject" href="#" class="btn">Decline</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="userModal" class="modal hide fade">
|
|
<div class="modal-header">
|
|
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
|
<h3 id="userTitle"></h3>
|
|
</div>
|
|
<div class="modal-body">
|
|
<p id="callerUser"></p>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<a id="acceptNewUser" href="#" class="btn btn-primary">Accept</a>
|
|
<a id="rejectNewUser" href="#" class="btn">Decline</a>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<!--<script src="http://code.jquery.com/jquery.js"></script> -->
|
|
<script src="js/jquery-1.7.2.min.js"></script>
|
|
<script src="js/bootstrap/js/bootstrap.min.js"></script>
|
|
<script src="js/adapter.js"></script>
|
|
<script src="js/bandwidth.js"></script>
|
|
<script src="js/webrtc.js"></script>
|
|
<script src="js/signaling.js"></script>
|
|
<script src="js/main.js"></script>
|
|
</body>
|
|
</html>
|