[frontend] certificate download changes

Author: ssrahul96

frontend/js/app/api.js

@@ -152,6 +152,54 @@ function FileUpload(path, fd) {
     });
 }
 
+//ref : https://codepen.io/chrisdpratt/pen/RKxJNo
+function DownloadFile(verb, path, filename) {
+    return new Promise(function (resolve, reject) {
+        let api_url = '/api/';
+        let url = api_url + path;
+        let token = Tokens.getTopToken();
+
+        $.ajax({
+            url: url,
+            type: verb,
+            crossDomain: true,
+            xhrFields: {
+                withCredentials: true,
+                responseType: 'blob'
+            },
+
+            beforeSend: function (xhr) {
+                xhr.setRequestHeader('Authorization', 'Bearer ' + (token ? token.t : null));
+            },
+
+            success: function (data) {
+                console.log(data)
+                console.log(textStatus)
+                console.log(response)
+                var a = document.createElement('a');
+                var url = window.URL.createObjectURL(data);
+                a.href = url;
+                a.download = filename;
+                document.body.append(a);
+                a.click();
+                a.remove();
+                window.URL.revokeObjectURL(url);
+            },
+
+            error: function (xhr, status, error_thrown) {
+                let code = 400;
+
+                if (typeof xhr.responseJSON !== 'undefined' && typeof xhr.responseJSON.error !== 'undefined' && typeof xhr.responseJSON.error.message !== 'undefined') {
+                    error_thrown = xhr.responseJSON.error.message;
+                    code = xhr.responseJSON.error.code || 500;
+                }
+
+                reject(new ApiError(error_thrown, xhr.responseText, code));
+            }
+        });
+    });
+}
+
 module.exports = {
     status: function () {
         return fetch('get', '');
@@ -638,6 +686,15 @@ module.exports = {
              */
             renew: function (id, timeout = 180000) {
                 return fetch('post', 'nginx/certificates/' + id + '/renew', undefined, {timeout});
+            },
+
+            /**
+             * @param   {Number}  id
+             * @returns {Promise}
+             */
+            download: function (id) {
+                console.log("downloading")
+                return DownloadFile('get', "nginx/certificates/" + id + "/download", "certificate.zip")
             }
         }
     },

frontend/js/app/nginx/certificates/list/item.ejs

@@ -41,6 +41,7 @@
             <span class="dropdown-header"><%- i18n('audit-log', 'certificate') %> #<%- id %></span>
             <% if (provider === 'letsencrypt') { %>
                 <a href="#" class="renew dropdown-item"><i class="dropdown-icon fe fe-refresh-cw"></i> <%- i18n('certificates', 'force-renew') %></a>
+                <a href="#" class="download dropdown-item"><i class="dropdown-icon fe fe-download"></i><%- i18n('certificates', 'download') %></a>
                 <div class="dropdown-divider"></div>
             <% } %>
             <a href="#" class="delete dropdown-item"><i class="dropdown-icon fe fe-trash-2"></i> <%- i18n('str', 'delete') %></a>

frontend/js/app/nginx/certificates/list/item.js

@@ -11,7 +11,8 @@ module.exports = Mn.View.extend({
     ui: {
         host_link: '.host-link',
         renew:     'a.renew',
-        delete:    'a.delete'
+        delete:    'a.delete',
+        download:  'a.download'
     },
 
     events: {
@@ -29,6 +30,10 @@ module.exports = Mn.View.extend({
             e.preventDefault();
             let win = window.open($(e.currentTarget).attr('rel'), '_blank');
             win.focus();
+        },
+        'click @ui.download': function (e) {
+            e.preventDefault();
+            App.Api.Nginx.Certificates.download(this.model.get('id'))
         }
     },
 

frontend/js/i18n/messages.json

@@ -188,6 +188,7 @@
       "other-certificate-key": "Certificate Key",
       "other-intermediate-certificate": "Intermediate Certificate",
       "force-renew": "Renew Now",
+      "download":"Download",
       "renew-title": "Renew Let'sEncrypt Certificate"
     },
     "access-lists": {