feed: adds more fake js to example

node/src/files/examples/feed.css

@@ -47,7 +47,6 @@ body {
   background-color: #333333;
 }
 #feed .left.column > .menu {
-  float: left;
   height: 100%;
 }
 

node/src/files/examples/feed.html

@@ -103,56 +103,56 @@
       </div>
       <div class="ui divided inbox selection list active tab" data-tab="unread">
         <a class="active item">
-          <i class="empty star icon"></i>
+          <i class="empty star link icon"></i>
           Weekly Webcomic Wrapup fought the law, and the law won
           <div class="right floated date">Sep 14, 2013</div>
         </a>
         <a class="item">
-          <i class="empty star icon"></i>
+          <i class="empty star link icon"></i>
           Scientists discover new breed of dog
           <div class="right floated date">Sep 14, 2013</div>
         </a>
         <a class="item">
-          <i class="teal emphasized star icon"></i>
+          <i class="teal emphasized star link icon"></i>
           Dogs start colony in Antarctica
           <div class="right floated date">Sep 10, 2013</div>
         </a>
         <a class="item">
-          <i class="empty star icon"></i>
+          <i class="empty star link icon"></i>
           Famous dog whisperer Chakotay dies today at 104
           <div class="right floated date">Sep 09, 2013</div>
         </a>
         <a class="item">
-          <i class="empty star icon"></i>
+          <i class="empty star link icon"></i>
           Top 10 Things to Know about Labradoodles
           <div class="right floated date">Sep 07, 2013</div>
         </a>
         <a class="item">
-          <i class="empty star icon"></i>
+          <i class="empty star link icon"></i>
           Study shows children enjoy the company of animals
           <div class="right floated date">Sep 05, 2013</div>
         </a>
       </div>
       <div class="ui divided inbox selection list tab" data-tab="saved">
         <a class="item">
-          <i class="teal emphasized star icon"></i>
+          <i class="teal emphasized star link icon"></i>
           Your favorite saved article
           <div class="right floated date">Sep 14, 2013</div>
         </a>
         <a class="item">
-          <i class="teal emphasized star icon"></i>
+          <i class="teal emphasized star link icon"></i>
           Your favorite saved article
           <div class="right floated date">Sep 14, 2013</div>
         </a>
         <a class="item">
-          <i class="teal emphasized star icon"></i>
+          <i class="teal emphasized star link icon"></i>
           Your favorite saved article
           <div class="right floated date">Sep 14, 2013</div>
         </a>
       </div>
       <div class="ui divided inbox selection list tab" data-tab="all">
         <a class="item">
-          <i class="star icon"></i>
+          <i class="star link icon"></i>
           There turns out there is only one article under all.
           <div class="right floated date">Sep 14, 2013</div>
         </a>

node/src/files/examples/feed.js

@@ -1,9 +1,27 @@
 $(document)
   .ready(function() {
 
+    var setActive = function(event) {
+      $(this)
+        .addClass('active')
+        .closest('.ui.menu')
+          .find('.item').not(this)
+          .removeClass('active')
+      ;
+      event.stopPropagation();
+    };
+
     $('.filter.menu .item')
       .tab()
     ;
 
+    $('.left.column .menu .item')
+      .on('click',  setActive)
+    ;
+
+    $('.list .item')
+      .on('click',  setActive)
+    ;
+
   })
 ;