Merge branch 'bergquist-export_dashboard_guidence'

openshift · Nov 7, 2018 · 0712c52 · 0712c52
2 parents 0353c9e + c52e91e
commit 0712c52
Show file tree

Hide file tree

Showing 2 changed files with 38 additions and 22 deletions.
diff --git a/public/app/features/dashboard/export/export_modal.html b/public/app/features/dashboard/export/export_modal.html
@@ -1,25 +1,21 @@
-
-<!-- <p> -->
-<!-- 	Exporting will export a cleaned sharable dashboard that can be imported -->
-<!-- 	into another Grafana instance. -->
-<!-- </p> -->
-
 <div class="share-modal-header">
 	<div class="share-modal-big-icon">
 		<i class="fa fa-cloud-upload"></i>
 	</div>
 	<div>
-		<p class="share-modal-info-text">
-			Export the dashboard to a JSON file. The exporter will templatize the
-			dashboard's data sources to make it easy for others to import and reuse.
-			You can share dashboards on <a class="external-link" href="https://grafana.com">Grafana.com</a>
-		</p>
+		<gf-form-switch
+			class="gf-form"
+			label="Export for sharing externally"
+			label-class="width-16"
+			checked="ctrl.shareExternally"
+			tooltip="Useful for sharing dashboard publicly on grafana.com. Will templatize data source names. Can then only be used with the specific dashboard import API.">
+		</gf-form-switch>
 
 		<div class="gf-form-button-row">
-			<button type="button" class="btn gf-form-btn width-10 btn-success" ng-click="ctrl.save()">
+			<button type="button" class="btn gf-form-btn width-10 btn-success" ng-click="ctrl.saveDashboardAsFile()">
 				<i class="fa fa-save"></i> Save to file
 			</button>
-			<button type="button" class="btn gf-form-btn width-10 btn-secondary" ng-click="ctrl.saveJson()">
+			<button type="button" class="btn gf-form-btn width-10 btn-secondary" ng-click="ctrl.viewJson()">
 				<i class="fa fa-file-text-o"></i> View JSON
 			</button>
 			<a class="btn btn-link" ng-click="ctrl.dismiss()">Cancel</a>

diff --git a/public/app/features/dashboard/export/export_modal.ts b/public/app/features/dashboard/export/export_modal.ts
@@ -8,27 +8,47 @@ export class DashExportCtrl {
   dash: any;
   exporter: DashboardExporter;
   dismiss: () => void;
+  shareExternally: boolean;
 
   /** @ngInject */
   constructor(private dashboardSrv, datasourceSrv, private $scope, private $rootScope) {
     this.exporter = new DashboardExporter(datasourceSrv);
 
-    this.exporter.makeExportable(this.dashboardSrv.getCurrent()).then(dash => {
-      this.$scope.$apply(() => {
-        this.dash = dash;
+    this.dash = this.dashboardSrv.getCurrent();
+  }
+
+  saveDashboardAsFile() {
+    if (this.shareExternally) {
+      this.exporter.makeExportable(this.dash).then((dashboardJson: any) => {
+        this.$scope.$apply(() => {
+          this.openSaveAsDialog(dashboardJson);
+        });
       });
-    });
+    } else {
+      this.openSaveAsDialog(this.dash.getSaveModelClone());
+    }
+  }
+
+  viewJson() {
+    if (this.shareExternally) {
+      this.exporter.makeExportable(this.dash).then((dashboardJson: any) => {
+        this.$scope.$apply(() => {
+          this.openJsonModal(dashboardJson);
+        });
+      });
+    } else {
+      this.openJsonModal(this.dash.getSaveModelClone());
+    }
   }
 
-  save() {
-    const blob = new Blob([angular.toJson(this.dash, true)], {
+  private openSaveAsDialog(dash: any) {
+    const blob = new Blob([angular.toJson(dash, true)], {
       type: 'application/json;charset=utf-8',
     });
-    saveAs(blob, this.dash.title + '-' + new Date().getTime() + '.json');
+    saveAs(blob, dash.title + '-' + new Date().getTime() + '.json');
   }
 
-  saveJson() {
-    const clone = this.dash;
+  private openJsonModal(clone: any) {
     const editScope = this.$rootScope.$new();
     editScope.object = clone;
     editScope.enableCopy = true;