SaveSongsRegion removed, SimpleMenuRegion for LIFE!

src/js/background/model/clientErrorManager.js

@@ -18,7 +18,11 @@
 
         initialize: function() {
             chrome.runtime.getPlatformInfo(this._onChromeRuntimeGetPlatformInfo.bind(this));
-            window.onerror = this._onWindowError.bind(this);
+
+            //  It's important to bind pre-emptively or attempts to call removeEventListener will fail to find the appropriate reference.
+            this._onWindowError = this._onWindowError.bind(this);
+            window.addEventListener('error', this._onWindowError);
+
             this.listenTo(Streamus.channels.error.commands, 'log:error', this._logError);
             this.listenTo(Streamus.channels.error.vent, 'windowError', this._onWindowError);
         },

src/js/foreground/application.js

@@ -17,7 +17,6 @@
             search: Backbone.Wreqr.radio.channel('search'),
             activeStreamItemArea: Backbone.Wreqr.radio.channel('activeStreamItemArea'),
             element: Backbone.Wreqr.radio.channel('element'),
-            saveSongs: Backbone.Wreqr.radio.channel('saveSongs'),
             listItem: Backbone.Wreqr.radio.channel('listItem'),
             simpleMenu: Backbone.Wreqr.radio.channel('simpleMenu'),
             video: Backbone.Wreqr.radio.channel('video'),

src/js/foreground/model/contextMenu/contextMenuAction.js

@@ -12,7 +12,7 @@
                 isContextMenu: true,
                 top: top,
                 left: left,
-                items: [{
+                simpleMenuItems: [{
                     text: chrome.i18n.getMessage('copyUrl'),
                     onClick: this._copyUrl.bind(this)
                 }, {

src/js/foreground/model/simpleMenu/simpleMenuItem.js

@@ -4,12 +4,10 @@
     var SimpleMenuItem = Backbone.Model.extend({
         defaults: {
             text: '',
-            tooltipText: '',
-            value: '',
-            selected: false,
+            value: null,
             active: false,
             disabled: false,
-            //  TODO: This is a bit odd.
+            fixed: false,
             onClick: _.noop
         }
     });

src/js/foreground/model/song/songsAction.js

@@ -0,0 +1,43 @@
+define(function(require) {
+    'use strict';
+
+    var CreatePlaylistDialogView = require('foreground/view/dialog/createPlaylistDialogView');
+
+    var SongsAction = Backbone.Model.extend({
+        defaults: function() {
+            return {
+                songs: []
+            };
+        },
+
+        showSaveMenu: function(top, left, playlists) {
+            var simpleMenuItems = playlists.map(function(playlist) {
+                return {
+                    active: playlist.get('active'),
+                    text: playlist.get('title'),
+                    value: playlist.get('id'),
+                    onClick: function(model) {
+                        var playlistId = model.get('value');
+                        playlists.get(playlistId).get('items').addSongs(this.get('songs'));
+                    }.bind(this)
+                };
+            }, this);
+
+            Streamus.channels.simpleMenu.commands.trigger('show:simpleMenu', {
+                top: top,
+                left: left,
+                simpleMenuItems: simpleMenuItems,
+                fixedMenuItem: {
+                    text: chrome.i18n.getMessage('createPlaylist'),
+                    onClick: function() {
+                        Streamus.channels.dialog.commands.trigger('show:dialog', CreatePlaylistDialogView, {
+                            songs: this.get('songs')
+                        });
+                    }.bind(this)
+                }
+            });
+        }
+    });
+
+    return SongsAction;
+});

src/js/foreground/view/element/simpleListItemView.js

@@ -4,7 +4,7 @@
     var SimpleMenuItems = require('foreground/collection/simpleMenu/simpleMenuItems');
     var SimpleMenu = require('foreground/model/simpleMenu/simpleMenu');
     var SimpleMenuView = require('foreground/view/simpleMenu/simpleMenuView');
-    var SimpleListItemTemplate = require('text!template/simpleMenu/simpleListItem.html');
+    var SimpleListItemTemplate = require('text!template/element/simpleListItem.html');
 
     var SimpleListItemView = Marionette.LayoutView.extend({
         className: 'simpleListItem listItem listItem--medium listItem--clickable',
@@ -32,10 +32,6 @@
             'change:value': '_onChangeValue'
         },
 
-        childEvents: {
-            'click:simpleMenuItem': '_onClickSimpleMenuItem'
-        },
-
         onRender: function() {
             this._setPrettyValue(this.model.get('value'));
         },
@@ -60,26 +56,20 @@
                     return {
                         active: this.model.get('value') === option,
                         text: chrome.i18n.getMessage(option),
-                        value: option
+                        value: option,
+                        onClick: function(model) {
+                            this.model.set('value', model.get('value'));
+                        }.bind(this)
                     };
                 }, this));
 
-                //  Since I'm building this inside of a click event and click events can close the menu I need to let the event finish before showing the menu
-                //  otherwise it'll close immediately.
-                _.defer(function() {
-                    this.showChildView('simpleMenu', new SimpleMenuView({
-                        model: new SimpleMenu({
-                            simpleMenuItems: simpleMenuItems,
-                            listItemHeight: this.$el.height()
-                        })
-                    }));
-                }.bind(this));
+                this.showChildView('simpleMenu', new SimpleMenuView({
+                    model: new SimpleMenu({
+                        simpleMenuItems: simpleMenuItems,
+                        listItemHeight: this.$el.height()
+                    })
+                }));
             }
-        },
-
-        _onClickSimpleMenuItem: function(model, eventArgs) {
-            var activeItem = eventArgs.model.get('simpleMenuItems').getActive();
-            this.model.set('value', activeItem.get('value'));
         }
     });
 

src/js/foreground/view/foregroundAreaView.js

@@ -8,7 +8,6 @@
     var LeftPaneRegion = require('foreground/view/leftPane/leftPaneRegion');
     var NotificationRegion = require('foreground/view/notification/notificationRegion');
     var PlaylistsAreaRegion = require('foreground/view/playlist/playlistsAreaRegion');
-    var SaveSongsRegion = require('foreground/view/saveSongs/saveSongsRegion');
     var SearchRegion = require('foreground/view/search/searchRegion');
     var StreamRegion = require('foreground/view/stream/streamRegion');
     var SelectionBarRegion = require('foreground/view/selectionBar/selectionBarRegion');
@@ -77,11 +76,6 @@
                     regionClass: SearchRegion,
                     settings: Streamus.backgroundPage.settings
                 },
-                saveSongs: {
-                    selector: '[data-region=saveSongs]',
-                    regionClass: SaveSongsRegion,
-                    signInManager: Streamus.backgroundPage.signInManager
-                },
                 playlistsArea: {
                     selector: '[data-region=playlistsArea]',
                     regionClass: PlaylistsAreaRegion,

src/js/foreground/view/leftPane/leftPaneRegion.js

@@ -27,16 +27,11 @@
         },
 
         _showLeftPaneView: function() {
-            if (!this._leftPaneViewExists()) {
+            if (!this.hasView()) {
                 this.show(new LeftPaneView({
                     signInManager: Streamus.backgroundPage.signInManager
                 }));
             }
-        },
-
-        //  Returns true if LeftPaneView is currently shown in the region
-        _leftPaneViewExists: function() {
-            return !_.isUndefined(this.currentView);
         }
     });
 

src/js/foreground/view/listItemButton/moreActionsButtonView.js

@@ -5,6 +5,7 @@
     var MoreActionsListItemButtonTemplate = require('text!template/listItemButton/moreActionsListItemButton.html');
     var MoreActionsIconTemplate = require('text!template/icon/moreActionsIcon_18.svg');
 
+    //  TODO: Maybe should be called moreOptions
     var MoreActionsButtonView = Marionette.ItemView.extend({
         template: _.template(MoreActionsListItemButtonTemplate),
         templateHelpers: {
@@ -15,16 +16,14 @@
             'data-tooltip-text': chrome.i18n.getMessage('moreActions')
         },
 
-        events: {
-        },
-
         behaviors: {
             ListItemButton: {
                 behaviorClass: ListItemButton
             }
         },
 
         doOnClickAction: function() {
+            this.triggerMethod('ShowMoreActions');
             this.options.onShowMoreActions();
         }
     });

src/js/foreground/view/listItemButton/saveSongButtonView.js

@@ -2,6 +2,7 @@
     'use strict';
 
     var ListItemButton = require('foreground/view/behavior/listItemButton');
+    var SongsAction = require('foreground/model/song/songsAction');
     var SaveListItemButtonTemplate = require('text!template/listItemButton/saveListItemButton.html');
     var SaveIconTemplate = require('text!template/icon/saveIcon_18.svg');
 
@@ -29,13 +30,14 @@
         },
 
         doOnClickAction: function() {
+            var songsAction = new SongsAction({
+                songs: [this.model]
+            });
+
             var offset = this.$el.offset();
+            var playlists = this.signInManager.get('signedInUser').get('playlists');
 
-            Streamus.channels.saveSongs.commands.trigger('show:simpleMenu', {
-                songs: [this.model],
-                top: offset.top,
-                left: offset.left
-            });
+            songsAction.showSaveMenu(offset.top, offset.left, playlists);
         },
 
         _onSignInManagerChangeSignedInUser: function() {

src/js/foreground/view/notification/notificationRegion.js

@@ -16,12 +16,13 @@
         },
 
         _onElementClick: function() {
-            if (!_.isUndefined(this.currentView)) {
+            if (this.hasView()) {
                 this._hideNotification();
             }
         },
 
         _showNotification: function(notificationOptions) {
+            //  TODO: Push this defer onto notificationView.
             //  It's important to defer showing notification because they're often shown via user click events.
             //  Since a click with a notification shown will cause the notification to hide -- need to wait until after click event
             //  finishes propagating before showing a notification.

src/js/foreground/view/playlist/playlistView.js

@@ -74,11 +74,12 @@
             var isEmpty = this.model.get('items').isEmpty();
 
             //  TODO: Do I want tooltips for disabled?
+            //  TODO: Combine into ContextMenuAction.
             Streamus.channels.simpleMenu.commands.trigger('show:simpleMenu', {
                 isContextMenu: true,
                 top: top,
                 left: left,
-                items: [{
+                simpleMenuItems: [{
                     text: chrome.i18n.getMessage('edit'),
                     onClick: this._showEditPlaylistDialog.bind(this)
                 }, {

src/js/foreground/view/playlist/playlistsAreaRegion.js

@@ -28,7 +28,7 @@
         _showPlaylistsArea: function() {
             //  It's possibly that the user might want to show playlistsArea before it has been created (i.e. before Application is idle)
             //  If so, just create it now so that it can be shown.
-            if (!this._playlistsAreaViewExists()) {
+            if (!this.hasView()) {
                 var signedInUser = this.signInManager.get('signedInUser');
                 this._createPlaylistsAreaView(signedInUser.get('playlists'));
             }
@@ -38,18 +38,13 @@
 
         _hidePlaylistsArea: function() {
             //  A hide command can be emitted by the application when the user is not signed in. In this scenario, currentView doesn't exist.
-            if (this._playlistsAreaViewExists()) {
+            if (this.hasView()) {
                 this.currentView.hide();
             }
         },
 
-        //  Returns true if PlaylistsAreaView is currently shown in the region.
-        _playlistsAreaViewExists: function() {
-            return !_.isUndefined(this.currentView);
-        },
-
         _createPlaylistsAreaView: function(playlists) {
-            if (!this._playlistsAreaViewExists()) {
+            if (!this.hasView()) {
                 var playlistsAreaView = new PlaylistsAreaView({
                     playlists: playlists
                 });
@@ -63,7 +58,7 @@
             if (signedInUser !== null) {
                 this.empty();
                 this._createPlaylistsAreaView(signedInUser.get('playlists'));
-            } else if (this._playlistsAreaViewExists()) {
+            } else if (this.hasView()) {
                 this.currentView.hide();
             }
         }