Implement rightclick menu for terminal text copy

This commit is contained in:
Johannes Zellner
2017-08-22 16:23:06 +02:00
parent c61808f4c6
commit 91f3318879
3 changed files with 54 additions and 0 deletions

View File

@@ -1137,3 +1137,12 @@ footer {
}
}
}
.contextMenuBackdrop {
display: none;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

View File

@@ -76,3 +76,11 @@
</div>
<div class="logs-and-term-container"></div>
<div class="contextMenuBackdrop">
<ul class="dropdown-menu" id="terminalContextMenu" style="position: absolute; display:none;">
<li><a href="" ng-click="terminalCopy()">Copy</a></li>
<li role="separator" class="divider"></li>
<li><a href="" ng-click="terminalClear()">Clear</a></li>
</ul>
</div>

View File

@@ -289,6 +289,43 @@ angular.module('Application').controller('DebugController', ['$scope', '$locatio
}
});
// terminal right click handling
$scope.terminalClear = function () {
if (!$scope.terminal) return;
$scope.terminal.clear();
$scope.terminal.focus();
};
$scope.terminalCopy = function () {
if (!$scope.terminal) return;
// execCommand('copy') would copy any selection from the page, so do this only if terminal has a selection
if (!$scope.terminal.getSelection()) return;
document.execCommand('copy');
$scope.terminal.focus();
};
$('.contextMenuBackdrop').on('click', function (e) {
$('#terminalContextMenu').hide();
$('.contextMenuBackdrop').hide();
});
$('.logs-and-term-container').on('contextmenu', function (e) {
if (!$scope.terminal) return true;
e.preventDefault();
$('.contextMenuBackdrop').show();
$('#terminalContextMenu').css({
display: 'block',
left: e.pageX,
top: e.pageY
});
return false;
});
// setup all the dialog focus handling
['downloadFileModal'].forEach(function (id) {
$('#' + id).on('shown.bs.modal', function () {