fixed bug in replacing current app

- removed the feature. instead it will just quit the app
- added additional bit for material back icon

index.html

@@ -15,6 +15,8 @@
                     <span class="mdl-layout-title">Moonlight</span>
                     <!-- Add spacer, to align navigation to the right -->
                     <div class="mdl-layout-spacer"></div>
+                    <!-- Navigation on the right -->
+                    <object type="image/svg+xml" data="static/res/ic_arrow_back_white_24px.svg" id='backIcon'></object>
                 </div>
             </header>
             <main id="main-content" class="mdl-layout__content">
@@ -80,16 +82,16 @@
             </div>
         </dialog>
 
-        <dialog id="replaceAppDialog" class="mdl-dialog">
+        <dialog id="quitAppDialog" class="mdl-dialog">
             <h3 class="mdl-dialog__title">Quit Running App?</h3>
             <div class="mdl-dialog__content">
-                <p id="replaceAppDialogText">
+                <p id="quitAppDialogText">
-                Y is already running. Would you like to quit Y to start X?
+                Y is already running. Would you like to quit Y?
                 </p>
             </div>
             <div class="mdl-dialog__actions">
-                <button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-button--colored" id="cancelReplaceApp">No</button>
+                <button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-button--colored" id="cancelQuitApp">No</button>
-                <button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-button--colored" id="continueReplaceApp">Yes</button>
+                <button type="button" class="mdl-button mdl-js-button mdl-button--raised mdl-button--colored" id="continueQuitApp">Yes</button>
             </div>
         </dialog>
 

static/js/index.js

@@ -19,8 +19,8 @@ function attachListeners() {
     $('#continueAddHost').on('click', continueAddHost);
     $('#forgetHost').on('click', forgetHost);
     $('#cancelPairingDialog').on('click', pairingPopupCanceled);
-    $('#cancelReplaceApp').on('click', cancelReplaceApp);
+    $('#cancelQuitApp').on('click', cancelQuitApp);
-    $('#continueReplaceApp').on('click', continueReplaceApp);
+    $('#continueQuitApp').on('click', continueQuitApp);
     $('#quitGameButton').on('click', stopGame);
     $(window).resize(fullscreenNaclModule);
     chrome.app.window.current().onMaximized.addListener(fullscreenChromeWindow);
@@ -258,8 +258,8 @@ function showAppsMode() {
 
     $("#streamSettings").hide();
     $("#hostSettings").hide();
-    // TODO: grab a material `back` icon to use here
+
-    $(".mdl-layout__header-row").append("<button class='mdl-button mdl-js-button mdl-button--fab mdl-button--mini-fab'><i class='material-icons'>arrow_back</i></button>") 
+    $('#backIcon').show();
     $(".mdl-layout__header").show();
     $("#main-content").children().not("#listener, #loadingSpinner, #naclSpinner").show();
     $("#main-content").removeClass("fullscreen");
@@ -268,7 +268,7 @@ function showAppsMode() {
 }
 
 
-// start the given appID.  if another app is running, offer to quit it and start this one.
+// start the given appID.  if another app is running, offer to quit it.
 // if the given app is already running, just resume it.
 function startGame(sourceEvent) {
     if(!api || !api.paired) {
@@ -279,11 +279,6 @@ function startGame(sourceEvent) {
     if(sourceEvent && sourceEvent.target) {
         appID = parseInt(sourceEvent.target.id.substring('game-'.length));  // parse the AppID from the ID of the grid icon.
         appName = sourceEvent.target.name;
-        if(!appID && appName) {  // ugly hack to allow us to continue parsing the appID from the sourceEvent (part 2 of 2)
-            api.getAppByName(appName).then(function (appToPlay) {
-                appID = appToPlay.id;
-            });
-        }
     } else {
         console.log('Error! failed to parse appID from grid icon! Failing...');
         snackbarLog('An error occurred while parsing the appID from the grid icon.')
@@ -294,12 +289,11 @@ function startGame(sourceEvent) {
     api.refreshServerInfo().then(function (ret) {
         if(api.currentGame != 0 && api.currentGame != appID) {
             api.getAppById(api.currentGame).then(function (currentApp) {
-                var replaceAppDialog = document.querySelector('#replaceAppDialog');
+                var quitAppDialog = document.querySelector('#quitAppDialog');
-                document.getElementById('replaceAppDialogText').innerHTML = 
+                document.getElementById('quitAppDialogText').innerHTML = 
                     currentApp.title + ' is already running. Would you like to quit ' +
-                    currentApp.title + ' to start ' + appName+ '?';
+                    currentApp.title + '?';
-                replaceAppDialog.showModal();
+                quitAppDialog.showModal();
-                $('#continueReplaceApp').attr('name', appName);
                 return;
             }, function (failedCurrentApp) {
                 console.log('ERROR: failed to get the current running app from host!');
@@ -349,18 +343,17 @@ function startGame(sourceEvent) {
     });
 }
 
-function cancelReplaceApp() {
+function cancelQuitApp() {
     showAppsMode();
-    document.querySelector('#replaceAppDialog').close();
+    document.querySelector('#quitAppDialog').close();
     console.log('closing app dialog, and returning');
 }
 
-function continueReplaceApp(sourceEvent) {
+function continueQuitApp(sourceEvent) {
     // I want the sourceEvent's sourceEvent
     console.log('stopping game, and closing app dialog, and returning');
-    stopGame();  // stop the game, then start the selected game once it's done.
+    stopGame();
-    startGame(sourceEvent);
+    document.querySelector('#quitAppDialog').close();
-    document.querySelector('#replaceAppDialog').close();
 }
 
 function playGameMode() {