Detect when apps are already installed. Fixes Issue#47

server/views/app_install.html

@@ -36,7 +36,7 @@
           <p>Try this on your FirefoxOS device.</p>
         </div>
         
-        <button data-package-manifest-url="{{version.manifest_url}}" disabled class="install">Install</button>
+        <button data-package-manifest-url="{{version.manifest_url}}" disabled class="install hidden">Install</button>
         <h3>Description</h3>
         <p class="app-description">{{version.shortDescription}}</p>
 

www/css/app_install.css

@@ -65,16 +65,16 @@ h3 {
 
 .version {   line-height: 2em; }
 
-button.install {
+button.install, button.launch {
   color: #FFF;
   background-color: #42cafe;
   border-radius: 5px;
 }
-button.install:hover {
+button.install:hover, button.launch:hover {
   color: #FFF;
   background-color: #67e0fd;
 }
-button.install:active {
+button.install:active, button.launch:active {
   color: #CBCBCB;
   background-color: #559dbd;
 }
@@ -83,4 +83,10 @@ button.install:active {
   width: 100%;
 }
 
-.tinyurl { font-family: monospace; font-size: 1.25em; font-weight: 600; }
+.tinyurl { font-family: monospace; font-size: 1.25em; font-weight: 600; }
+
+#needs-mozapps {
+  background-color: #f54b3c;
+  color: #000;
+  padding: 1em;
+}

www/css/common.css

@@ -76,4 +76,4 @@ strong {
   text-align: center;
   display: flex;
   flex-direction: row;
-}
+}

www/js/app_install.js

@@ -1,24 +1,47 @@
 (function() {
+
+  var installedApps = {};
+
   var install = document.querySelector('button[data-package-manifest-url]');
 
   if (install) {
-    if (!navigator.mozApps || !navigator.mozApps.installPackage) {
+    if (!navigator.mozApps || !navigator.mozApps.installPackage || !navigator.mozApps.getInstalled) {
       document.getElementById('needs-mozapps').classList.remove('hidden');
     } else {
+      install.classList.remove('hidden');
+      var request = window.navigator.mozApps.getInstalled();
+      request.onerror = function(e) {
+        alert("Error calling getInstalled: " + request.error.name);
+      };
+      request.onsuccess = function(e) {
+
+        for (var i = 0; i < request.result.length; i++) {
+          var manifestURL = request.result[i].manifestURL;
+          installedApps[manifestURL] = request.result[i];
+          $('[data-package-manifest-url="' + manifestURL + '"]')
+            .removeClass('install')
+            .addClass('launch')
+            .text('Launch');
+        }
+      };
 
       install.disabled = false;
 
       install.addEventListener('click', function f(e) {
         var url = install.getAttribute('data-package-manifest-url');
-        var request = navigator.mozApps.installPackage(url);
-        request.onsuccess = function() {
-          // if (!this.result || !this.result.manifest) {
-          // 	return alert('Install failed without error');
-          // }
-          // TODO replace "install" button with 'installed' widget
-        };
-        request.onerror = function() {
-          alert(this.error.name);
+        if ($(install).hasClass('install')) {
+          var request = navigator.mozApps.installPackage(url);
+          request.onsuccess = function() {
+            // if (!this.result || !this.result.manifest) {
+            // 	return alert('Install failed without error');
+            // }
+            // TODO replace "install" button with 'installed' widget
+          };
+          request.onerror = function() {
+            alert(this.error.name);
+          }
+        } else if ($(install).hasClass('launch')) {
+          installedApps[url].launch();
         }
       });
     }