From 8812742bb9b94e794635b7301a91aa26adb3dbaa Mon Sep 17 00:00:00 2001
From: flyingrub <flyinggrub@gmail.com>
Date: Wed, 30 Mar 2016 20:37:12 +0200
Subject: [PATCH] [FIX] Review * Squash listenTo * Replace id by class

---
 app/views/player.js           |  6 ++++--
 app/views/popupPlaylists.js   | 14 ++++----------
 app/views/templates/track.jst | 18 +++++++++---------
 app/views/track.js            | 20 ++++++++++----------
 4 files changed, 27 insertions(+), 31 deletions(-)

diff --git a/app/views/player.js b/app/views/player.js
index 4359083..a68a1bc 100644
--- a/app/views/player.js
+++ b/app/views/player.js
@@ -34,8 +34,10 @@ const Player = Mn.LayoutView.extend({
     },
 
     initialize() {
-        this.listenTo(application.channel,'reset:UpNext', this.render);
-        this.listenTo(application.channel, 'player:next', this.next)
+        this.listenTo(application.channel, {
+            'reset:UpNext': this.render,
+            'player:next': this.next
+        });
         this.listenTo(application.appState, 'change:currentTrack',
             function(appState, currentTrack) {
                 if (currentTrack) {
diff --git a/app/views/popupPlaylists.js b/app/views/popupPlaylists.js
index 24ea43f..2915050 100644
--- a/app/views/popupPlaylists.js
+++ b/app/views/popupPlaylists.js
@@ -25,16 +25,10 @@ const PopupPlaylists = Mn.CompositeView.extend({
     },
 
     initialize() {
-        this.listenTo(
-            application.channel,
-            'playlistPopup:show',
-            this.showPopup
-        );
-        this.listenTo(
-            application.channel,
-            'playlistPopup:hide',
-            this.hidePopup
-        );
+        this.listenTo(application.channel, {
+            'playlistPopup:show': this.showPopup,
+            'playlistPopup:hide': this.hidePopup
+        });
     },
 
     showPopup(model) {
diff --git a/app/views/templates/track.jst b/app/views/templates/track.jst
index af5abe0..a167ede 100644
--- a/app/views/templates/track.jst
+++ b/app/views/templates/track.jst
@@ -9,20 +9,20 @@
 <div class="album-column-cell" role="gridcell"><%- album %>
     <div class="actions">
         <% if (type != 'upNext') { %>
-        <button id="add-to-upnext">
+        <button class="add-to-upnext">
             <p class="help">Add To Up Next</p>
             <svg>
                 <use xlink:href="<%= require('../../assets/icons/add-to-playlist-sm.svg') %>"/>
             </svg>
         </button>
         <% } else { %>
-        <button id="delete-from-upnext">
+        <button class="delete-from-upnext">
             <svg>
                 <use xlink:href="<%= require('../../assets/icons/cross-sm.svg') %>"/>
             </svg>
         </button>
         <% } %>
-        <button id="menu">
+        <button class="menu">
             <svg>
                 <use xlink:href="<%= require('../../assets/icons/more-sm.svg') %>"/>
             </svg>
@@ -32,7 +32,7 @@
 <div class="length-column-cell" role="gridcell"><%- duration %></div>
 <div id="popup-menu" class="popup-menu">
     <ul>
-        <li id="add-to-playlist">
+        <li class="add-to-playlist">
             <svg>
                 <use xlink:href="<%= require('../../assets/icons/plus-sm.svg') %>"/>
             </svg>
@@ -40,29 +40,29 @@
             <svg class="small">
                 <use xlink:href="<%= require('../../assets/icons/play-sm.svg') %>"/>
             </svg>
-            <div id="playlist-popup-container">
+            <div class="playlist-popup-container">
         </li>
         <% if (type == 'playlist') { %>
-        <li id="remove-from-playlist">
+        <li class="remove-from-playlist">
             <svg>
                 <use xlink:href="<%= require('../../assets/icons/cross-sm.svg') %>"/>
             </svg>
             Remove from Playlist
         </li>
         <% } %>
-        <li id="album-to-upnext">
+        <li class="album-to-upnext">
             <svg>
                 <use xlink:href="<%= require('../../assets/icons/add-to-playlist-sm.svg') %>"/>
             </svg>
             Add This Album to Up Next
         </li>
-        <li id="edit-details">
+        <li class="edit-details">
             <svg>
                 <use xlink:href="<%= require('../../assets/icons/edit-sm.svg') %>"/>
             </svg>
             Edit Details
         </li>
-        <li id="delete">
+        <li class="delete">
             <svg>
                 <use xlink:href="<%= require('../../assets/icons/trash-sm.svg') %>"/>
             </svg>
diff --git a/app/views/track.js b/app/views/track.js
index 895ab1d..2f3c0be 100644
--- a/app/views/track.js
+++ b/app/views/track.js
@@ -10,25 +10,25 @@ const TrackView = Mn.LayoutView.extend({
     tagName: 'li',
 
     ui: {
-        'menu': '#menu',
+        'menu': '.menu',
         'popupMenu': '#popup-menu',
     },
 
     regions: {
-        playlistPopup: '#playlist-popup-container',
+        playlistPopup: '.playlist-popup-container',
     },
 
     events: {
         'click': 'play',
         'click @ui.menu': 'toggleMenu',
-        'click #add-to-upnext':'addToUpNext',
-        'mouseenter #add-to-playlist':'showPlaylist',
-        'mouseleave #add-to-playlist':'hidePlaylist',
-        'click #album-to-upnext':'albumToUpNext',
-        'click #edit-details':'editDetails',
-        'click #delete':'delete',
-        'click #delete-from-upnext': 'deleteFromUpNext',
-        'click #remove-from-playlist': 'removeFromPlaylist',
+        'click .add-to-upnext':'addToUpNext',
+        'mouseenter .add-to-playlist':'showPlaylist',
+        'mouseleave .add-to-playlist':'hidePlaylist',
+        'click .album-to-upnext':'albumToUpNext',
+        'click .edit-details':'editDetails',
+        'click .delete':'delete',
+        'click .delete-from-upnext': 'deleteFromUpNext',
+        'click .remove-from-playlist': 'removeFromPlaylist',
         'mouseleave #popup-menu': 'hidePopupMenu',
     },