From 7b3d17a67cd2fff902e8f3e77e2326e8244d4bd9 Mon Sep 17 00:00:00 2001
From: jcass <john.cass77@gmail.com>
Date: Wed, 27 Apr 2016 13:28:11 +0200
Subject: [PATCH] fix:Replace JavaScript prompt with jQuery equivalent.

Fixes #191.
---
 README.rst                                    |  4 +++
 .../static/css/webclient.css                  |  1 +
 mopidy_musicbox_webclient/static/index.html   | 26 +++++++++++++----
 .../static/js/controls.js                     | 28 +++++++++++++------
 mopidy_musicbox_webclient/static/mb.appcache  |  2 +-
 5 files changed, 46 insertions(+), 15 deletions(-)

diff --git a/README.rst b/README.rst
index 22707d4..6fae1c5 100644
--- a/README.rst
+++ b/README.rst
@@ -129,6 +129,8 @@ v2.3.0 (UNRELEASED)
 - Added 'Folder' FontAwesome icon on the Browse pane for browsing the filesystem.
 - New icons for 'PLAY' and 'PLAY_ALL' actions. In general, icons with an empty background will perform an action only
   on the selected track, while icons with a filled background will apply the action to all tracks in the list.
+- Standardize popup dialog layout convention: Sentence fragments have no punctuation, buttons that confirm a
+  destructive action go on the left.
 
 **Fixes**
 
@@ -141,6 +143,8 @@ v2.3.0 (UNRELEASED)
   instead of waiting for the 'Search!' button to be clicked.
 - Fixed an issue where the last track in an album was not grouped properly with the rest of the results, and would have
   a small divider rendered above it. (Fixes: `#196 <https://github.com/pimusicbox/mopidy-musicbox-webclient/issues/196>`_).
+- Replaced JavaScript confirmation prompt on 'Streams' pane with jQuery equivalent.
+  (Fixes: `#191 <https://github.com/pimusicbox/mopidy-musicbox-webclient/issues/191>`_).
 
 v2.2.0 (2016-03-01)
 -------------------
diff --git a/mopidy_musicbox_webclient/static/css/webclient.css b/mopidy_musicbox_webclient/static/css/webclient.css
index 836f064..48d4e5a 100644
--- a/mopidy_musicbox_webclient/static/css/webclient.css
+++ b/mopidy_musicbox_webclient/static/css/webclient.css
@@ -436,6 +436,7 @@
 
 .popupDialog {
     padding: 10px;
+    text-align: center;
 }
 
 /*dont hide clear buttons in text input */
diff --git a/mopidy_musicbox_webclient/static/index.html b/mopidy_musicbox_webclient/static/index.html
index 842ad8e..db57490 100644
--- a/mopidy_musicbox_webclient/static/index.html
+++ b/mopidy_musicbox_webclient/static/index.html
@@ -171,16 +171,16 @@
 
 <div data-role="popup" data-theme="b" id="popupSave" class="popupDialog">
     <form>
-        <p>Save current queue to a playlist.
+        <p>Save Current Queue to a Playlist
         <input id="saveinput" placeholder="Playlist name" class="span2" data-clear-btn="true"
                onkeypress="return controls.savePressed(event.keyCode);" type="text"/>
         <div data-role="controlgroup" data-type="horizontal" align="center">
-            <button class="btn" type="button" onclick="return controls.saveQueue();">
-                Ok
-            </button>
             <button class="btn" type="button" onclick="return $('#popupSave').popup('close');">
                 Cancel
             </button>
+            <button class="btn" type="button" onclick="return controls.saveQueue();">
+                Save
+            </button>
         </div>
     </form>
 </div>
@@ -188,10 +188,10 @@
 
 <div data-role="popup" data-theme="b" id="popupOverwrite" class="popupDialog">
     <form>
-        <p>Overwrite existing playlist with same name?
+        <p>A playlist with the same name already exists. Overwrite?
         <div data-role="controlgroup" data-type="horizontal" align="center">
             <button class="btn" type="button" id="overwriteConfirmBtn">
-                Ok
+                Overwrite
             </button>
             <button class="btn" type="button" onclick="$('#popupOverwrite').popup('close'); return $('#popupSave').popup('open');">
                 Cancel
@@ -200,6 +200,20 @@
     </form>
 </div><!--/overwrite existing playlist-->
 
+<div data-role="popup" data-theme="b" id="popupConfirmDelete" class="popupDialog">
+    <form>
+        <p>Are you sure you want to remove <span class="popupStreamName"></span>?
+        <div data-role="controlgroup" data-type="horizontal" align="center">
+            <button class="btn" type="button" onclick="return controls.deleteFavourite();">
+                Remove
+            </button>
+            <button class="btn" type="button" onclick="$('#popupConfirmDelete').popup('close');">
+                Cancel
+            </button>
+        </div>
+    </form>
+</div><!--/confirm delete stream-->
+
 <div data-role="header" data-tap-toggle="false" id="header" data-position="fixed" class="header-breakpoint headerbtn">
     <a id="headermenubtn" href="#panel"><i class="fa fa-align-justify"></i></a>
     <h1 id="contentHeadline">Musicbox</h1>
diff --git a/mopidy_musicbox_webclient/static/js/controls.js b/mopidy_musicbox_webclient/static/js/controls.js
index f13471d..41d5471 100644
--- a/mopidy_musicbox_webclient/static/js/controls.js
+++ b/mopidy_musicbox_webclient/static/js/controls.js
@@ -547,16 +547,26 @@
             })
         },
 
-        deleteFavourite: function (index) {
+        showDeleteStreamPopup: function (index) {
             controls.getFavourites().then(function (favourites) {
                 if (favourites && favourites.tracks && index < favourites.tracks.length) {
                     var name = favourites.tracks[index].name
-                    if (confirm("Are you sure you want to remove '" + name + "'?")) {
-                        favourites.tracks.splice(index, 1)
-                        mopidy.playlists.save({'playlist': favourites}).then(function (s) {
-                            controls.showFavourites()
-                        })
-                    }
+                    $('.popupStreamName').html(favourites.tracks[index].name)
+                    $('#popupConfirmDelete').data('index', index)
+                    $('#popupConfirmDelete').popup('open')
+                }
+            })
+        },
+
+        deleteFavourite: function (index) {
+            index = index || $('#popupConfirmDelete').data('index')
+            controls.getFavourites().then(function (favourites) {
+                if (favourites && favourites.tracks && index < favourites.tracks.length) {
+                    favourites.tracks.splice(index, 1)
+                    mopidy.playlists.save({'playlist': favourites}).then(function (s) {
+                        controls.showFavourites()
+                    })
+                    $('#popupConfirmDelete').popup('close')
                 }
             })
         },
@@ -576,7 +586,9 @@
                 if (favourites.tracks) {
                     var child = ''
                     for (var i = 0; i < favourites.tracks.length; i++) {
-                        child = '<li><span class="ui-icon ui-icon-delete ui-icon-shadow" style="float:right; margin: .5em; margin-top: .8em;"><a href="#" onclick="return controls.deleteFavourite(\'' + i + '\');">&nbsp;</a></span>' +
+                        child =
+                            '<li><span class="ui-icon ui-icon-delete ui-icon-shadow" style="float:right; margin: .5em; margin-top: .8em;">' +
+                            '<a href="#" onclick="return controls.showDeleteStreamPopup(' + i + ');">&nbsp;</a></span>' +
                             '<i class="fa fa-rss" style="float: left; padding: .5em; padding-top: 1em;"></i>' +
                             ' <a style="margin-left: 20px" href="#" onclick="return controls.playStreamUri(\'' + favourites.tracks[i].uri + '\');">'
                         child += '<h1>' + favourites.tracks[i].name + '</h1></a></li>'
diff --git a/mopidy_musicbox_webclient/static/mb.appcache b/mopidy_musicbox_webclient/static/mb.appcache
index 96cac54..3169867 100644
--- a/mopidy_musicbox_webclient/static/mb.appcache
+++ b/mopidy_musicbox_webclient/static/mb.appcache
@@ -1,6 +1,6 @@
 CACHE MANIFEST
 
-# 2016-05-05:v1
+# 2016-05-07:v1
 
 NETWORK:
 *