From 9d3c29516973c256d7ba1617aa58782c82328296 Mon Sep 17 00:00:00 2001
From: Jaden Diefenbaugh <blakcap@users.noreply.github.com>
Date: Thu, 20 Apr 2017 17:05:25 +0200
Subject: [PATCH] add download button for figures, generate download in js
---
.../reports/app/directives/downloadLink.js | 62 +++++++++++++++++++
.../reports/app/directives/edit/plotItem.js | 15 +++++
.../reports/app/directives/view/plotItem.js | 16 +++++
.../web/reports/templates/reports/report.html | 1 +
4 files changed, 94 insertions(+)
create mode 100644 beat/web/reports/static/reports/app/directives/downloadLink.js
diff --git a/beat/web/reports/static/reports/app/directives/downloadLink.js b/beat/web/reports/static/reports/app/directives/downloadLink.js
new file mode 100644
index 000000000..213e368e0
--- /dev/null
+++ b/beat/web/reports/static/reports/app/directives/downloadLink.js
@@ -0,0 +1,62 @@
+/*
+ * Copyright (c) 2016 Idiap Research Institute, http://www.idiap.ch/
+ * Contact: beat.support@idiap.ch
+ *
+ * This file is part of the beat.web module of the BEAT platform.
+ *
+ * Commercial License Usage
+ * Licensees holding valid commercial BEAT licenses may use this file in
+ * accordance with the terms contained in a written agreement between you
+ * and Idiap. For further information contact tto@idiap.ch
+ *
+ * Alternatively, this file may be used under the terms of the GNU Affero
+ * Public License version 3 as published by the Free Software and appearing
+ * in the file LICENSE.AGPL included in the packaging of this file.
+ * The BEAT platform is distributed in the hope that it will be useful, but
+ * WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY
+ * or FITNESS FOR A PARTICULAR PURPOSE.
+ *
+ * You should have received a copy of the GNU Affero Public License along
+ * with the BEAT platform. If not, see http://www.gnu.org/licenses/.
+ */
+
+/*
+ * downloadLink
+ * Desc:
+ * A button to download the content of the report item
+ */
+angular.module('reportApp')
+.directive("downloadLink", [function(){
+ return {
+ scope: {
+ getDownloadHref: '&',
+ domId: '=',
+ imgName: '='
+ },
+ link: function(scope){
+ scope.downloadLinkId = `${scope.domId}-download`;
+ scope.setupDownloadLinkTest = (event) => {
+ const a = document.querySelector(`#${scope.downloadLinkId}`);
+ const href = scope.getDownloadHref()();
+
+ if(!href){
+ event.preventDefault();
+ return false;
+ }
+
+ a.href = href;
+ };
+ },
+ template: `
+<a
+ id='{{ downloadLinkId }}'
+ style='color: white;'
+ class='btn btn-primary'
+ ng-click='setupDownloadLinkTest()'
+ download='img.png'>
+ <i class='fa fa-download fa-lg'></i>
+ Download
+</a>
+`
+ };
+}]);
diff --git a/beat/web/reports/static/reports/app/directives/edit/plotItem.js b/beat/web/reports/static/reports/app/directives/edit/plotItem.js
index 138d6b90f..8c85a6044 100644
--- a/beat/web/reports/static/reports/app/directives/edit/plotItem.js
+++ b/beat/web/reports/static/reports/app/directives/edit/plotItem.js
@@ -65,6 +65,15 @@ angular.module('reportApp')
}
}
);
+
+ scope.exportSrcFunc = () => () => {
+ const el = document.querySelector(`#${scope.renderDivId} img`);
+ if(!el){
+ return false;
+ }
+
+ return el.src;
+ };
},
template: `
<div id="{{domId}}-heading" class="panel-heading" role="tab">
@@ -91,6 +100,12 @@ angular.module('reportApp')
<i class='fa fa-arrows fa-lg'></i>
</span>
</div>
+ <download-link
+ domId='domId'
+ imgName='"test.png"'
+ get-download-href='exportSrcFunc()'
+ >
+ </download-link>
</h4>
</div>
<div id="collapse-{{domId}}"
diff --git a/beat/web/reports/static/reports/app/directives/view/plotItem.js b/beat/web/reports/static/reports/app/directives/view/plotItem.js
index 96cd0055e..2b268fffc 100644
--- a/beat/web/reports/static/reports/app/directives/view/plotItem.js
+++ b/beat/web/reports/static/reports/app/directives/view/plotItem.js
@@ -41,8 +41,24 @@ angular.module('reportApp')
$timeout(function() {
PlotService.addPlot(scope.group, scope.id, scope.renderDivId);
});
+
+ scope.exportSrcFunc = () => () => {
+ const el = document.querySelector(`#${scope.renderDivId} img`);
+ if(!el){
+ return false;
+ }
+
+ return el.src;
+ };
},
template: `
+<download-link
+ class='pull-right'
+ domId='domId'
+ imgName='"test.png"'
+ get-download-href='exportSrcFunc()'
+ >
+ </download-link>
<div id='{{ renderDivId }}'></div>
`
};
diff --git a/beat/web/reports/templates/reports/report.html b/beat/web/reports/templates/reports/report.html
index 9b4ec10f2..10670d5f7 100644
--- a/beat/web/reports/templates/reports/report.html
+++ b/beat/web/reports/templates/reports/report.html
@@ -99,6 +99,7 @@
<!-- new -->
<script src="{% fingerprint "reports/app/directives/tableItem.js" %}" type="text/javascript" charset="utf-8"></script>
+ <script src="{% fingerprint "reports/app/directives/downloadLink.js" %}" type="text/javascript" charset="utf-8"></script>
<!-- edit view -->
{% if not report_number and report.get_status_display == 'Editable' and owner %}
--
GitLab