adjust visual chatbox and update trivial things

lovelle · Jun 18, 2015 · 70ff0b9 · 70ff0b9
1 parent 18a79a3
commit 70ff0b9
Show file tree

Hide file tree

Showing 6 changed files with 43 additions and 23 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1 +1,2 @@
 server/node_modules/
+server/npm-debug.log
diff --git a/chat.jquery.json b/chat.jquery.json
@@ -3,14 +3,14 @@
     "title": "jQuery Chat",
     "description": "100% pure javascript realtime chat (client and server) facebook/gmail style web chat.",
     "keywords": [
-    "javascript",
-    "chat",
-    "html5",
-    "websocket",
-    "jquery",
-    "realtime"
+        "javascript",
+        "chat",
+        "html5",
+        "websocket",
+        "jquery",
+        "realtime"
     ],
-    "version": "1.2.1",
+    "version": "1.0.1",
     "author": {
         "name": "Ezequiel Lovelle",
         "email": "ezequiellovelle@gmail.com",

diff --git a/css/chat.css b/css/chat.css
@@ -234,12 +234,20 @@ body {
 	display: none;
 }
 
+#iswriting {
+	margin-right: 4px;
+	margin-bottom: 4px;
+}
+
+.no-content-border {
+	border: 0px;
+}
+
 #progressbar-char {
-	width: 55px;
-	float: left;
-    margin-top: 1.2em;
-    margin-bottom: 0.4em;
-    height: 6px;
+	width: 30%;
+	margin-left: 4px;
+	margin-bottom: 4px;
+	height: 6px;
 }
 
 #istalking {

diff --git a/index.html b/index.html
@@ -31,7 +31,7 @@ <h1 align='center'>My website :-)</h1>
     <!--<iframe src='http://www.google.com' width='100%' height='97%'></iframe>-->
 
     <div id='' title='' user='' style="width: 240px" class="no-display">
-      <div class='box box-info direct-chat direct-chat-info'>
+      <div class='box box-info direct-chat direct-chat-info ui-widget-content'>
       <!-- box box-primary direct-chat direct-chat-info direct-chat-primary -->
         <div class='box-header with-border'>
           <h3 class='box-title'>" + user + "</h3>
@@ -88,9 +88,12 @@ <h3 class='box-title'>" + user + "</h3>
             </ul>
           </div>
         </div>
-        <div id='iswriting'><i class='fa fa-pencil'></i><small id='iswriting-text'>Bla is writing...</small></div>
-        <div id='progressbar-char'></div>
-        <div class='box-footer'>
+        <div id='iswriting' class='pull-right'>
+          <i class='fa fa-pencil'></i>
+          <small id='iswriting-text'>Bla is writing...</small>
+        </div>
+        <div id='progressbar-char' class='pull-left'></div>
+        <div class='small-box-footer'>
           <textarea id='textarea_msg' class='form-control' name='message' placeholder='Type Message ...'></textarea>
         </div>
       </div>

diff --git a/js/jquery.main.js b/js/jquery.main.js
@@ -962,7 +962,8 @@
       if ( $( "#Dialog" + id ).length == 0 ) {
         $( "body" ).append( "\
           <div id='Dialog" + id + "' title='' user='" + user + "'>\
-            <div class='box box-info direct-chat direct-chat-info'>\
+                                                                              <!-- MUST CHANGE -->\
+            <div class='box box-info direct-chat direct-chat-info ui-widget-content no-content-border'>\
               <div class='box-header with-border'>\
                 <h4 class='box-title'><small>" + user + "</small></h4>\
                 <div class='box-tools pull-right'>\
@@ -978,9 +979,12 @@
                 <div class='direct-chat-messages'>\
                 </div>\
               </div>\
-              <div id='iswriting'><i class='fa fa-pencil'></i><small id='iswriting-text'></small></div>\
-              <div id='progressbar-char'></div>\
-              <div class='box-footer'>\
+              <div id='iswriting' class='pull-right'>\
+                <i class='fa fa-pencil'></i>\
+                <small id='iswriting-text'></small>\
+              </div>\
+              <div id='progressbar-char' class='pull-left'></div>\
+              <div class='small-box-footer'>\
                 <textarea id='textarea_msg' class='form-control' name='message' placeholder='Type Message ...'></textarea>\
               </div>\
             </div>\

diff --git a/views/new-dialog.sample b/views/new-dialog.sample
@@ -1,5 +1,5 @@
 <div id='' title='' user=''>\
-  <div class='box box-info direct-chat direct-chat-info'>\
+  <div class='box box-info direct-chat direct-chat-info ui-widget-content'>\
     <div class='box-header with-border'>\
       <h3 class='box-title'>" + user + "</h3>\
       <div class='box-tools pull-right'>\
@@ -47,8 +47,12 @@
         </ul>\
       </div>\
     </div>\
-    <div class='box-footer'>\
-      <div id='iswriting'><i class='fa fa-pencil'></i><small id='iswriting-text'></small></div>\
+    <div class='small-box-footer'>\
+      <div id='iswriting' class='pull-right'>\
+        <i class='fa fa-pencil'></i>\
+        <small id='iswriting-text'>Bla is writing...</small>\
+      </div>\
+      <div id='progressbar-char' class='pull-left'></div>\
       <textarea id='textarea_msg' class='form-control' name='message' placeholder='Type Message ...'></textarea>\
     </div>\
   </div>\