Make media collapsible

cqr · Feb 20, 2012 · 233fc8c · 233fc8c
1 parent 009a5b9
commit 233fc8c
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 3 deletions.
diff --git a/assets/css/subway.css b/assets/css/subway.css
@@ -114,6 +114,9 @@ html { overflow: hidden; }
   color: #EEEEEE;
   font-weight: bold;
   border-top: 1px solid #666666;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
 }
 
 #user-box div:first-child{
@@ -122,9 +125,6 @@ html { overflow: hidden; }
 
 #user-box div:last-child{
   border-left: 5px solid #FA6900;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
 }
 
 #user-box div i{

diff --git a/assets/js/views/chat.js b/assets/js/views/chat.js
@@ -28,6 +28,7 @@ var ChatView = Backbone.View.extend({
     this.updateTitle();
     this.handleInput();
     this.handleScroll();
+    this.handleClick();
     $('#chat-input').focus();
     return this;
   },
@@ -173,4 +174,20 @@ var ChatView = Backbone.View.extend({
       }
     });
   },
+
+  handleClick: function() {
+    $('.hide_embed').live("click", function() {
+      var embed_div = $(this).parent().siblings('.embed');
+      embed_div.addClass('hide');
+      $(this).siblings('.show_embed').removeClass('hide');
+      $(this).addClass('hide');
+    });
+
+    $('.show_embed').live("click", function() {
+      var embed_div = $(this).parent().siblings('.embed');
+      embed_div.removeClass('hide');
+      $(this).siblings('.hide_embed').removeClass('hide');
+      $(this).addClass('hide');
+    });
+  },
 });
diff --git a/views/templates.jade b/views/templates.jade
@@ -125,6 +125,11 @@ script(id="link", type="text/html")
   a(target="_blank", href="{{link}}") {{link}}
 
 script(id="image_embed", type="text/html")
+  div
+    a.hide_embed
+      i(class="icon-chevron-up")
+    a.show_embed.hide
+      i(class="icon-chevron-down")
   .embed
     img(src="{{link}}")