From f7236f99e30dfe1f4625149d5ec36e0b38fc7be5 Mon Sep 17 00:00:00 2001
From: Logan Hanks <logan@reddit.com>
Date: Wed, 11 Jul 2012 17:08:17 -0700
Subject: [PATCH] Fade out apps when revoked or deleted.

---
 r2/r2/controllers/api.py           |  2 +-
 r2/r2/public/static/css/reddit.css |  5 +++--
 r2/r2/public/static/js/apps.js     |  8 +++++++
 r2/r2/templates/prefapps.html      | 36 ++++++++++++++++++------------
 4 files changed, 34 insertions(+), 17 deletions(-)

diff --git a/r2/r2/controllers/api.py b/r2/r2/controllers/api.py
index c74417f92..812a82a2e 100755
--- a/r2/r2/controllers/api.py
+++ b/r2/r2/controllers/api.py
@@ -2824,7 +2824,7 @@ class ApiController(RedditController, OAuth2ResourceController):
     @noresponse(VUser(),
                 VModhash(),
                 client=VOAuth2ClientID())
-    def POST_revokeapp(self, form, jquery, client):
+    def POST_revokeapp(self, client):
         if client:
             client.revoke(c.user)
 
diff --git a/r2/r2/public/static/css/reddit.css b/r2/r2/public/static/css/reddit.css
index b125c6352..f89968185 100755
--- a/r2/r2/public/static/css/reddit.css
+++ b/r2/r2/public/static/css/reddit.css
@@ -5836,7 +5836,7 @@ tr.gold-accent + tr > td {
     font-weight: bold;
 }
 
-.developed-app {
+.developed-app, .authorized-app {
     border: solid 1px black;
     margin-left: 20px;
     margin-bottom: 0.5em;
@@ -5871,9 +5871,10 @@ tr.gold-accent + tr > td {
     width: 600px;
 }
 
-.edit-app-button {
+.edit-app-button, .revoke-app-button {
     position: absolute;
     bottom: 0px;
+    width: 200px;
 }
 
 .edit-app { display: none; }
diff --git a/r2/r2/public/static/js/apps.js b/r2/r2/public/static/js/apps.js
index dfe0e1359..e87659447 100644
--- a/r2/r2/public/static/js/apps.js
+++ b/r2/r2/public/static/js/apps.js
@@ -5,3 +5,11 @@ $(function() {
             $(this).parent().parent().find(".edit-app").slideToggle();
         });
 });
+
+function app_revoked(elem, op) {
+    $(elem).closest(".authorized-app").fadeOut();
+}
+
+function app_deleted(elem, op) {
+    $(elem).closest(".developed-app").fadeOut();
+}
diff --git a/r2/r2/templates/prefapps.html b/r2/r2/templates/prefapps.html
index 2a7131e20..41f9d4839 100644
--- a/r2/r2/templates/prefapps.html
+++ b/r2/r2/templates/prefapps.html
@@ -5,28 +5,35 @@
   <h1>${_("authorized applications")}</h1>
 
   %for app in thing.my_apps:
-    <tr>
-      <td>
-      %if app.icon_url:
-        <img src="${ app.icon_url }">
+  <div id="authorized-app-${app._id}" class="authorized-app rounded">
+    %if app.icon_url:
+      <img src="${app.icon_url}">
+    %endif
+    <div class="app-details">
+      <h2>
+      %if app.about_url:
+        <a href="${app.about_url}">${app.name}</a>
+      %else:
+        ${app.name}
       %endif
-      </td>
-      <td><a href="${ app.about_url }">${ app.name }</a></td>
-      <td>${ynbutton(_("revoke access"),
-                     _("revoked"),
-                     "revokeapp",
-                     callback="deleteRow",
-                     hidden_data=dict(client_id=app._id))}</td>
-    </tr>
+      </h2>
+      <div class="app-description">${app.description}</div>
+      ${ynbutton(_("revoke access"),
+                 _("revoked"),
+                 "revokeapp",
+                 callback="app_revoked",
+                 hidden_data=dict(client_id=app._id),
+                 _class="revoke-app-button")}
+    </div>
+  </div>
   %endfor
-  </table>
 %endif
 
 %if thing.developed_apps:
   <h1>${_("developed applications")}</h1>
 
   %for app in thing.developed_apps:
-  <div class="developed-app rounded">
+  <div id="developed-app-${app._id}" class="developed-app rounded">
     %if app.icon_url:
       <img src="${app.icon_url}">
     %endif
@@ -131,6 +138,7 @@
         ${ynbutton(_("delete app"),
                    "deleted",
                    "deleteapp",
+                   callback="app_deleted",
                    hidden_data=dict(client_id=app._id))}
       </div>
     </div>