MAJ

sequoiar · Feb 29, 2012 · 0b08f26 · 0b08f26
1 parent 49ffc60
commit 0b08f26
Show file tree

Hide file tree

Showing 3 changed files with 76 additions and 17 deletions.
diff --git a/css/global.css b/css/global.css
@@ -0,0 +1,23 @@
+.navbar .nav>li>span{
+	float:none;
+	padding:10px 10px 11px;
+	line-height:19px;
+	color:#999999;
+	text-decoration:none;
+	text-shadow:0 -1px 0 rgba(0, 0, 0, 0.25);
+	cursor: pointer;
+}
+
+.navbar .nav>li>span:hover{
+	color:#ffffff;
+	text-decoration:none;
+	background-color:#222222;
+}
+
+.nav>li>span{
+	display:block;
+}
+
+img {
+	border: 1px solid #999;
+}
diff --git a/index.php b/index.php
@@ -12,11 +12,12 @@
     </head>
 
     <body>
-	
-        <div class="modal hide fade" id="myModal">
-          <div class="modal-header">
-            <h3>WebRTC Sample Connection</h3>
-          </div>
+        
+        <div class="modal hide fade" id="ModalConnection">
+            
+            <div class="modal-header">
+              <h3>WebRTC Sample Connection</h3>
+            </div>
 
             <div class="modal-body">
               <div class="control-group">
@@ -32,6 +33,27 @@
 
         </div>
 
+        <div class="modal hide fade" id="ModalAbout">
+            
+            <div class="modal-header">
+              <h3>About WebRTC</h3>
+            </div>
+
+            <div class="modal-body">
+              <blockquote>
+                <p>Blablabla...</p>
+                <small>Project WebRTC</small>
+              </blockquote>
+            </div>
+
+            <div class="modal-footer">
+            <button id="close" class="btn btn-primary">Close</button>
+            <a class="btn btn-small btn-info" target="_blank" href="http://www.webrtc.org/">
+            <i class="icon-info-sign icon-white"></i>More Info</a>
+            </div>
+
+        </div>
+
         <div class="navbar navbar-fixed-top">
           <div class="navbar-inner">
             <div class="container-fluid">
@@ -40,12 +62,11 @@
                 <span class="icon-bar"></span>
                 <span class="icon-bar"></span>
               </a>
-              <a class="brand" href="#">WebRTC Sample</a>
+              <a class="brand" href="./index.php">WebRTC Sample</a>
               <div class="nav-collapse">
                 <ul class="nav">
-                  <li class="active"><a href="#">Home</a></li>
-                  <li><a href="#about">About</a></li>
-                  <li><a href="#contact">Contact</a></li>
+                  <li class="active"><a href="./index.php">Home</a></li>
+                  <li><span id="about" class="about">About</span></li>
                 </ul>
                 <p class="navbar-text pull-right">Logged in as <a id="username" href="#">username</a></p>
               </div>
@@ -91,18 +112,22 @@
                 
                 <div class="row-fluid" align="center">
                   <div class="span12">
-                    <h2>Content</h2>
-                    <img src="img/ppt.jpg" alt="PPT" width="500" height="500">
+                    <img src="img/ppt.jpg" alt="PPT" width="500" height="500" />
                   </div>
                 </div>
 
                 <br>
 
                 <div class="row-fluid" align="center">
                   <div class="span12">
-                    <div class="well">
-                    <h2>Chat</h2>
-                    </div>
+                      <h2 align="left">Chat</h2>
+                      <form class="well form-inline">
+                      <textarea class="input-xlarge" disabled="disabled" id="textarea" rows="2" style=" width: 820px; height: 40px; ">
+                      </textarea>
+                      <hr>
+                      <input type="text" class="input span8" placeholder="Message">
+                      <button id="send" class="btn btn-primary">Send</button>
+                      </form>
                   </div>
                 </div>
 

diff --git a/js/global.js b/js/global.js
@@ -2,7 +2,7 @@ $(function() {
 
     var nickname = $("#nickname");
 
-    $('#myModal').modal({
+    $('#ModalConnection').modal({
       backdrop: "static",
       keyboard: false
     })
@@ -13,9 +13,20 @@ $(function() {
         nickname.siblings('span').removeClass('hide');
       } else {
         $('#username').text(nickname.val());
-        $('#myModal').modal('hide'); 
+        $('#ModalConnection').modal('hide'); 
         initialize();
       }
     });
-});
 
+    $("#about").on("click", function(){
+      $('#ModalAbout').modal({
+        backdrop: "static",
+        keyboard: false
+      })
+    });
+
+    $("#close").on("click", function(){
+        $('#ModalAbout').modal('hide'); 
+    });
+
+});