Merge remote-tracking branch 'origin/february_release' into february_release

Conflicts:
	app/client/scripts/events.js
	app/client/stylesheets/app.css

app/client/scripts/onCreated.js

@@ -127,6 +127,7 @@ Template.room.onCreated(function () {
             }
         }
     });
+
     Session.set("reportSong", false);
     Session.set("reportTitle", false);
     Session.set("reportAuthor", false);
@@ -152,6 +153,7 @@ Template.room.onCreated(function () {
 
     var currentSong = undefined;
     var currentSongR = undefined;
+    var type = Session.get("type");
 
     function getTimeElapsed() {
         if (currentSong !== undefined) {

app/client/stylesheets/app.css

@@ -183,10 +183,42 @@ textarea{
   padding-top: 15px;
 }
 
+#thumbs_up, #thumbs_down {
+  color: white;
+  cursor: pointer;
+}
+
+#thumbs_up:hover {
+  color: #00bfa5;
+}
+
+#thumbs_down:hover {
+  color: #e53935;
+}
+
 .feedback-message{
     word-wrap: break-word;
 }
 
+.brand-logo{
+	font-weight:900;
+}
+
+.dropdown-content {
+  background-color: #FFFFFF;
+  margin: 0;
+  display: none;
+  min-width: 300px; /* Changed this to accomodate content width */
+  height: 100vh;
+	margin-left: -1px; /* Add this to keep dropdown in line with edge of navbar */
+  overflow: hidden; /* Changed this from overflow-y:auto; to overflow:hidden; */
+  opacity: 0;
+  position: absolute;
+  white-space: nowrap;
+  z-index: 1;
+  will-change: width, height;
+}
+
 .video-import-thumbnail {
     position: absolute;
     height: 150px;

app/client/templates/room.html

@@ -6,15 +6,43 @@
                 <div class="nav-wrapper teal accent-4">
                     <ul class="left hide-on-med-and-down">
                         <li><a href="/"><i class="material-icons">home</i></a></li>
-                        <li><a href="#add_song_modal"><i class="material-icons">playlist_add</i></a></li>
+                        <li><a href="#add_song_modal" id="add-song-button"><i class="material-icons">playlist_add</i></a></li>
                         <li><a href="#bug_report_modal"><i class="material-icons">bug_report</i></a></li>
                         <li><a href="#vote_to_skip" id="skip_vote"><i class="material-icons">skip_next</i></a></li>
                     </ul>
                     <span class="brand-logo center">{{type}}</span>
                     <ul class="right hide-on-med-and-down">
                         <li><a href="#"><i class="material-icons">queue_music</i></a></li>
-                        <li><a href="#"><i class="material-icons">chat</i></a></li>
+                        <li><a href="#" data-activates="chat" class="dropdown-button"><i class="material-icons">chat</i></a></li>
                     </ul>
+                    <div id='chat' class='dropdown-content right'>
+                      <ul id="chat-ul">
+                                {{#each chat}}
+                                    {{#emojione}}
+                                        <li class="chat-message"><small class="rank-{{this.rawrank}}">{{this.rank}}</small> <a style="text-decoration: none" href="/u/{{this.username}}" target="_blank"><b class="bold">{{this.username}}</b></a> <span title="{{time}}" style="float: right;">{{rtime time}}</span> <br/>
+                                        {{#if this.isMentioned}}
+                                            {{#if this.curUserMention}}
+                                                <span style="background-color: lightblue">{{this.message}}</span>
+                                            {{else}}
+                                                {{this.message}}
+                                            {{/if}}
+                                        {{else}}
+                                            {{this.message}}
+                                        {{/if}}
+                                        </li>
+                                    {{/emojione}}
+                                    <hr>
+                                {{/each}}
+                            </ul>
+                            <div id="chat-input-div">
+                                {{#if currentUser}}
+                                    <textarea id="chat-input" placeholder="Type a message..."></textarea>
+                                {{else}}
+                                    <input id="chat-input" placeholder="Please register and login to chat." disabled>
+                                {{/if}}
+                                <div id="submit"><button class="btn btn-primary btn-block">Submit<i id="submit-message" class="fa fa-paper-plane-o"></i></button></div>
+                            </div>
+                    </div>
                 </div>
             </nav>
         </header>
@@ -40,8 +68,8 @@
                                   </form>
                                   <div class="right col s4 m2 l2">
                                     <ul>
-                                      <li class="left"><a href="#add_song_modal"><i class="material-icons black-text">thumb_up</i></a></li>
-                                      <li class="right"><a href="#bug_report_modal"><i class="material-icons black-text">thumb_down</i></a></li>
+                                      <li class="left"><i id="thumbs_up" class="material-icons">thumb_up</i></li>
+                                      <li class="right"><i id="thumbs_down" class="material-icons">thumb_down</i></li>
                                     </ul>
                                   </div>
                                 </div>
@@ -54,6 +82,64 @@
                     </div>
                 </div>
             </div>
+            <div id="add_song_modal" class="modal">
+              <div class="center modal-content container">
+                <div class="row">
+                  <form class="black-text" id="search-info">
+                    <div class="row">
+                      <div class="input-field">
+                        <select>
+                          <option value="" disabled selected>Select import type</option>
+                          <option value="singleSong">Single Song</option>
+                          <option value="importPlaylist">Import Playlist</option>
+                        </select>
+                      </div>
+                    </div>
+                    <div class="row">
+                      <div class="input-field">
+                        <input id="song-input" type="text" class="validate">
+                        <label for="search_for_song">Search for song</label>
+                      </div>
+                    </div>
+                    <div class="row">
+                      <a class="waves-effect waves-light btn" id="search-song"><i class="material-icons left">search</i>Search</a>
+                    </div>
+                  </form>
+                  <div id="song-results"></div>
+                </div>
+                <div class="row">
+                  <form class="black-text hide" id="add-info">
+                    <div class="row">
+                      <div class="input-field">
+                        <input id="song-id" type="text" class="validate">
+                        <label for="song-id">Song ID</label>
+                      </div>
+                    </div>
+                    <div class="row">
+                      <a class="waves-effect waves-light btn" id="add-song-button"><i class="material-icons left">playlist_add</i>Request Song</a>
+                    </div>
+                  </form>
+                </div>
+              </div>
+
+              <div class="divider"></div>
+              <div class="modal-footer">
+                <a href="#!" class="modal-action modal-close waves-effect btn">Close</a>
+              </div>
+            </div>
         </main>
+        <script>
+          $("#add-song-button").leanModal({
+            dismissible: true,
+            opacity: .5,
+            in_duration: 500,
+            out_duration: 200
+          });
+          $(".dropdown-button").dropdown({
+            belowOrigin: true,
+            alignment: 'right'
+          });
+          $('select').material_select();
+        </script>
     {{/if}}
 </template>