github
/
portainer
mirror of https://github.com/portainer/portainer
1
0
Fork 0
Code Issues Releases Wiki Activity

feat(yaml-inspector): add button to expand/collapse yaml inspector (#4007) (#4828) 

* #4007 feat(yaml-inspector): add button to expand/collapse yaml inspector

* feat(yaml-inspector): add button to expand/collapse yaml inspector

Better yamlInspector.html formatting

* feat(yaml-inspector): change name of toggle function

More descriptive name for the function that toggles the expansion of the YAML inspector.
pull/4878/head
Eduardo Brito 2021-02-23 21:02:36 +00:00 committed by GitHub
parent 86ad1c6af1
commit d84a5b9c67
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 10 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/kubernetes/components/yaml-inspector/yamlInspector.html
View File

@ -2,6 +2,8 @@
<code-editor identifier="application-details-yaml" read-only="true" value="$ctrl.data"></code-editor>
<div style="margin: 15px;">
<span class="btn btn-primary btn-sm" ng-click="$ctrl.copyYAML()"><i class="fa fa-copy space-right" aria-hidden="true"></i>Copy to clipboard</span>
<span class="btn btn-primary btn-sm space-left" ng-click="$ctrl.toggleYAMLInspectorExpansion()">
<i class="fa fa-{{ $ctrl.expanded ? 'minus' : 'plus' }} space-right" aria-hidden="true"></i>{{ $ctrl.expanded ? 'Collapse' : 'Expand' }}</span>
<span id="copyNotificationYAML" style="margin-left: 7px; display: none; color: #23ae89;" class="small"> <i class="fa fa-check" aria-hidden="true"></i> copied </span>
</div>
</div>

8
app/kubernetes/components/yaml-inspector/yamlInspectorController.js
View File

@ -5,12 +5,20 @@ class KubernetesYamlInspectorController {
constructor(clipboard) {
this.clipboard = clipboard;
this.expanded = false;
}
copyYAML() {
this.clipboard.copyText(this.data);
$('#copyNotificationYAML').show().fadeOut(2500);
}
toggleYAMLInspectorExpansion() {
let selector = 'kubernetes-yaml-inspector code-editor > div.CodeMirror';
let height = this.expanded ? '500px' : '80vh';
$(selector).css({ height: height });
this.expanded = !this.expanded;
}
}
export default KubernetesYamlInspectorController;