feat: Copy to clipboard now works in query troubleshooter

This commit is contained in:
Torkel Ödegaard 2017-05-20 14:52:28 +02:00
parent b8aa6a8e47
commit 5e090b84ec
5 changed files with 41 additions and 18 deletions

View File

@ -19,10 +19,18 @@ function (angular, require, coreModule, kbn) {
}; };
}); });
coreModule.default.directive('clipboardButton',function() { coreModule.default.directive('clipboardButton', function() {
return function(scope, elem) { return {
scope: {
getText: '&clipboardButton'
},
link: function(scope, elem) {
require(['vendor/clipboard/dist/clipboard'], function(Clipboard) { require(['vendor/clipboard/dist/clipboard'], function(Clipboard) {
scope.clipboard = new Clipboard(elem[0]); scope.clipboard = new Clipboard(elem[0], {
text: function() {
return scope.getText();
}
});
}); });
scope.$on('$destroy', function() { scope.$on('$destroy', function() {
@ -30,6 +38,7 @@ function (angular, require, coreModule, kbn) {
scope.clipboard.destroy(); scope.clipboard.destroy();
} }
}); });
}
}; };
}); });

View File

@ -86,7 +86,7 @@
<input type="text" data-share-panel-url class="gf-form-input" ng-model="shareUrl"></input> <input type="text" data-share-panel-url class="gf-form-input" ng-model="shareUrl"></input>
</div> </div>
<div class="gf-form"> <div class="gf-form">
<button class="btn btn-inverse" data-clipboard-text="{{shareUrl}}" clipboard-button><i class="fa fa-clipboard"></i> Copy</button> <button class="btn btn-inverse" clipboard-button="getShareUrl()"><i class="fa fa-clipboard"></i> Copy</button>
</div> </div>
</div> </div>
</div> </div>
@ -143,7 +143,7 @@
{{snapshotUrl}} {{snapshotUrl}}
</a> </a>
<br> <br>
<button class="btn btn-inverse" data-clipboard-text="{{snapshotUrl}}" clipboard-button><i class="fa fa-clipboard"></i> Copy Link</button> <button class="btn btn-inverse" clipboard-button="getSnapshotUrl()"><i class="fa fa-clipboard"></i> Copy Link</button>
</div> </div>
</div> </div>
</div> </div>

View File

@ -88,6 +88,10 @@ function (angular, _, $, moment, config) {
$scope.imageUrl += '&tz=UTC' + encodeURIComponent(moment().format("Z")); $scope.imageUrl += '&tz=UTC' + encodeURIComponent(moment().format("Z"));
}; };
$scope.getShareUrl = function() {
return $scope.shareUrl;
};
}); });
}); });

View File

@ -96,6 +96,10 @@ function (angular, _) {
}); });
}; };
$scope.getSnapshotUrl = function() {
return $scope.snapshotUrl;
};
$scope.scrubDashboard = function(dash) { $scope.scrubDashboard = function(dash) {
// change title // change title
dash.title = $scope.snapshot.name; dash.title = $scope.snapshot.name;

View File

@ -14,7 +14,7 @@ const template = `
<a class="pointer" ng-click="ctrl.toggleExpand()" ng-show="ctrl.allNodesExpanded"> <a class="pointer" ng-click="ctrl.toggleExpand()" ng-show="ctrl.allNodesExpanded">
<i class="fa fa-expand"></i> Collapse All <i class="fa fa-expand"></i> Collapse All
</a> </a>
<a class="pointer" data-clipboard-text="adasda" clipboard-button><i class="fa fa-clipboard"></i> Copy to Clipboard</a> <a class="pointer" clipboard-button="ctrl.getClipboardText()"><i class="fa fa-clipboard"></i> Copy to Clipboard</a>
</collapse-box-actions> </collapse-box-actions>
<collapse-box-body> <collapse-box-body>
<div class="query-troubleshooter-json"></div> <div class="query-troubleshooter-json"></div>
@ -62,6 +62,12 @@ export class QueryTroubleshooterCtrl {
} }
} }
getClipboardText() {
if (this.jsonExplorer) {
return JSON.stringify(this.jsonExplorer.json, null, 2);
}
}
onRequestResponse(data) { onRequestResponse(data) {
data = _.cloneDeep(data); data = _.cloneDeep(data);