download link downloads all plots, fix weird angular undefined variables issues, fixes #15

beat/web/reports/static/reports/app/directives/downloadLink.js

@@ -30,30 +30,34 @@ angular.module('reportApp')
 	return {
 		scope: {
 			getDownloadHref: '&',
-			domId: '=',
-			imgName: '='
+			domId: '@',
+			imgName: '@'
 		},
 		link: function(scope){
-			scope.downloadLinkId = `${scope.domId}-download`;
+			scope.downloadLinkId = () => `${scope.domId}-download`;
+
 			scope.setupDownloadLinkTest = (event) => {
-				const a = document.querySelector(`#${scope.downloadLinkId}`);
-				const href = scope.getDownloadHref()();
+				const a = document.querySelector(`#${scope.downloadLinkId()}`);
+				const hrefs = scope.getDownloadHref()();
 
-				if(!href){
-					event.preventDefault();
-					return false;
-				}
+				event.preventDefault();
 
-				a.href = href;
+				hrefs.forEach((href, i) => {
+					a.href = href;
+					a.download = `${scope.imgName}-${i}.png`;
+					a.click();
+					a.href = '';
+					a.download = '';
+				})
+				;
 			};
 		},
 		template: `
 <a
-	id='{{ downloadLinkId }}'
+	id='{{ downloadLinkId() }}'
 	style='color: white;'
 	class='btn btn-primary'
-	ng-click='setupDownloadLinkTest()'
-	download='img.png'>
+	ng-click='setupDownloadLinkTest($event)'>
 	<i class='fa fa-download fa-lg'></i>
 	Download
 </a>

beat/web/reports/static/reports/app/directives/edit/plotItem.js

@@ -84,12 +84,13 @@ angular.module('reportApp')
 			);
 
 			scope.exportSrcFunc = () => () => {
-				const el = document.querySelector(`#${scope.renderDivId} img`);
-				if(!el){
-					return false;
-				}
+				const el = document.querySelectorAll(`#${scope.renderDivId} img`);
+				const srcs = Array.from(el)
+				.map(e => e.src)
+				//.map(src => src.replace(/^data:undefined/, 'data:application/octet-stream'));
+				;
 
-				return el.src;
+				return srcs;
 			};
 		},
 		template: `
@@ -118,8 +119,8 @@ angular.module('reportApp')
 			</span>
 		</div>
 		<download-link
-			domId='domId'
-			imgName='"test.png"'
+			dom-id='{{ domId }}'
+			img-name='{{ renderDivId }}'
 			get-download-href='exportSrcFunc()'
 			>
 			</download-link>

beat/web/reports/static/reports/app/directives/view/plotItem.js

@@ -43,19 +43,20 @@ angular.module('reportApp')
 			});
 
 			scope.exportSrcFunc = () => () => {
-				const el = document.querySelector(`#${scope.renderDivId} img`);
-				if(!el){
-					return false;
-				}
+				const el = document.querySelectorAll(`#${scope.renderDivId} img`);
+				const srcs = Array.from(el)
+				.map(e => e.src)
+				//.map(src => src.replace(/^data:undefined/, 'data:application/octet-stream'));
+				;
 
-				return el.src;
+				return srcs;
 			};
 		},
 		template: `
 <download-link
 	class='pull-right'
-	domId='domId'
-	imgName='"test.png"'
+	dom-id='{{ domId }}'
+	img-name='{{ renderDivId }}'
 	get-download-href='exportSrcFunc()'
 	>
 	</download-link>