Create inputbar directive

This commit is contained in:
David Cormier 2013-10-27 16:41:27 -04:00
parent 6055e699ff
commit fcfe8ba4be
3 changed files with 131 additions and 8 deletions

8
directives/input.html Normal file
View File

@ -0,0 +1,8 @@
<form class="form form-horizontal" ng-submit="sendMessage()">
<div class="input-group">
<input id="sendMessage" type="text" class="form-control monospace" autocomplete="off" ng-model="command" autofocus>
<span class="input-group-btn">
<button class="btn btn-default btn-primary">Send</button>
</span>
</div>
</form>

View File

@ -270,14 +270,7 @@ $ openssl req -nodes -newkey rsa:2048 -keyout relay.pem -x509 -days 365 -out rel
</div> </div>
<div id="footer" ng-show="connected"> <div id="footer" ng-show="connected">
<div class="navbar navbar-inverse navbar-fixed-bottom" ng-class="{'withnicklist': showNicklist}"> <div class="navbar navbar-inverse navbar-fixed-bottom" ng-class="{'withnicklist': showNicklist}">
<form class="form form-horizontal" ng-submit="sendMessage()"> <div input-bar></div>
<div class="input-group">
<input id="sendMessage" type="text" class="form-control monospace" autocomplete="off" ng-model="command" autofocus>
<span class="input-group-btn">
<button class="btn btn-default btn-primary">Send</button>
</span>
</div>
</form>
</div> </div>
</body> </body>
</html> </html>

View File

@ -765,3 +765,125 @@ weechat.config(['$routeProvider',
}); });
} }
]); ]);
weechat.directive('inputBar', function() {
return {
templateUrl: 'directives/input.html',
controller: function($rootScope,
$scope,
connection,
models) {
// Focuses itself when active buffer is changed
$rootScope.$on('activeBufferChanged', function() {
angular.element('#sendMessage').focus();
});
$rootScope.completeNick = function() {
// input DOM node
var inputNode = document.getElementById('sendMessage');
// get current input
var inputText = inputNode.value;
// get current caret position
var caretPos = inputNode.selectionStart;
// create flat array of nicks
var activeBuffer = models.getActiveBuffer();
// complete nick
var nickComp = IrcUtils.completeNick(inputText, caretPos,
$rootScope.iterCandidate, activeBuffer.flatNicklist(), ':');
// remember iteration candidate
$rootScope.iterCandidate = nickComp.iterCandidate;
// update current input
$scope.command = nickComp.text;
// update current caret position
inputNode.focus();
inputNode.setSelectionRange(nickComp.caretPos, nickComp.caretPos);
}
// Send the message to the websocket
$scope.sendMessage = function() {
connection.sendMessage($scope.command);
$scope.command = "";
}
// Handle key presses in the input bar
$scope.handleKeyPress = function($event) {
// don't do anything if not connected
if (!$rootScope.connected) {
return true;
}
// Support different browser quirks
var code = $event.keyCode ? $event.keyCode : $event.charCode;
// any other key than Tab resets nick completion iteration
var tmpIterCandidate = $rootScope.iterCandidate;
$rootScope.iterCandidate = null;
// Left Alt+[0-9] -> jump to buffer
if ($event.altKey && !$event.ctrlKey && (code > 47 && code < 58)) {
if (code == 48) {
code = 58;
}
var bufferNumber = code - 48;
var activeBuffer = models.getBufferByIndex(bufferNumber);
if (activeBuffer) {
models.setActiveBuffer(activeBuffer.id);
$event.preventDefault();
}
}
// Tab -> nick completion
if (code == 9 && !$event.altKey && !$event.ctrlKey) {
$event.preventDefault();
$rootScope.iterCandidate = tmpIterCandidate;
$rootScope.completeNick();
return true;
}
// Alt+A -> switch to buffer with activity
if ($event.altKey && (code == 97 || code == 65)) {
$event.preventDefault();
$rootScope.switchToActivityBuffer();
return true;
}
// Alt+L -> focus on input bar
if ($event.altKey && (code == 76 || code == 108)) {
$event.preventDefault();
var inputNode = document.getElementById('sendMessage');
inputNode.focus();
inputNode.setSelectionRange(inputNode.value.length, inputNode.value.length);
return true;
}
// Escape -> disconnect
if (code == 27) {
$event.preventDefault();
connection.disconnect();
return true;
}
// Ctrl+G -> focus on buffer filter input
if ($event.ctrlKey && (code == 103 || code == 71)) {
$event.preventDefault();
document.getElementById('bufferFilter').focus();
return true;
}
}
}
}
});