Merge pull request #918 from txanatan/master

Add a button to the input bar to complete nicks
This commit is contained in:
Lorenz Hübschle-Schneider 2017-03-18 14:56:02 +01:00 committed by GitHub
commit 3847f0f011
7 changed files with 62 additions and 12 deletions

View file

@ -89,6 +89,12 @@ input[type=text], input[type=password], #sendMessage {
margin-bottom: 5px !important; margin-bottom: 5px !important;
} }
.btn-complete-nick {
position: relative;
overflow: hidden;
cursor: pointer;
}
.btn-send-image { .btn-send-image {
position: relative; position: relative;
overflow: hidden; overflow: hidden;

View file

@ -302,7 +302,7 @@ input[type=text], input[type=password], #sendMessage, .badge {
box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.1), 0px 1px 7px 0px rgba(0, 0, 0, 0.2) inset; box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.1), 0px 1px 7px 0px rgba(0, 0, 0, 0.2) inset;
} }
input[type=text], input[type=password], #sendMessage, .btn-send, .btn-send-image { input[type=text], input[type=password], #sendMessage, .btn-send, .btn-send-image, .btn-complete-nick {
color: var(--base05); color: var(--base05);
background: var(--base01); background: var(--base01);
} }
@ -335,12 +335,19 @@ input[type=text]:-moz-placeholder, input[type=password]:-moz-placeholder { /* Fi
background: var(--base08); background: var(--base08);
} }
.btn-send:hover, .btn-send:focus, .is-desktop-ui .btn-complete-nick:hover, .btn-complete-nick:focus,
.btn-send-image:hover, .btn-send-image:focus { .is-desktop-ui .btn-send:hover, .btn-send:focus,
.is-desktop-ui .btn-send-image:hover, .btn-send-image:focus {
background-color: var(--base07); background-color: var(--base07);
color: var(--base01); color: var(--base01);
} }
.is-mobile-ui .btn-complete-nick:hover,
.is-mobile-ui .btn-send:hover,
.is-mobile-ui .btn-send-image:hover {
color: var(--base05);
}
#connection-infos { #connection-infos {
color: var(--base04); color: var(--base04);
} }

View file

@ -88,17 +88,24 @@ input[type=text], input[type=password], #sendMessage, .badge {
border: 1px solid #4a5b6c; border: 1px solid #4a5b6c;
} }
input[type=text], input[type=password], #sendMessage, .badge, .btn-send, .btn-send-image { input[type=text], input[type=password], #sendMessage, .badge, .btn-send, .btn-send-image, .btn-complete-nick {
color: #ccc; color: #ccc;
background: none repeat scroll 0% 0% rgba(0, 0, 0, 0.3); background: none repeat scroll 0% 0% rgba(0, 0, 0, 0.3);
} }
.btn-send:hover, .btn-send:focus, .is-desktop-ui .btn-complete-nick:hover, .btn-complete-nick:focus,
.btn-send-image:hover, .btn-send-image:focus { .is-desktop-ui .btn-send:hover, .btn-send:focus,
.is-desktop-ui .btn-send-image:hover, .btn-send-image:focus {
background-color: #555; background-color: #555;
color: white; color: white;
} }
.is-mobile-ui .btn-complete-nick:hover,
.is-mobile-ui .btn-send:hover,
.is-mobile-ui .btn-send-image:hover {
color: #ccc;
}
.nav-pills li:nth-child(2n) { .nav-pills li:nth-child(2n) {
background: #283244; background: #283244;
} }

View file

@ -82,17 +82,24 @@ input[type=text], input[type=password], #sendMessage, .badge {
box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.1), 0px 1px 7px 0px rgba(0, 0, 0, 0.8) inset; box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.1), 0px 1px 7px 0px rgba(0, 0, 0, 0.8) inset;
} }
input[type=text], input[type=password], #sendMessage, .badge, .btn-send, .btn-send-image { input[type=text], input[type=password], #sendMessage, .badge, .btn-send, .btn-send-image, .btn-complete-nick {
color: #ccc; color: #ccc;
background: none repeat scroll 0% 0% rgba(0, 0, 0, 0.3); background: none repeat scroll 0% 0% rgba(0, 0, 0, 0.3);
} }
.btn-send:hover, .btn-send:focus, .is-desktop-ui .btn-complete-nick:hover, .btn-complete-nick:focus,
.btn-send-image:hover, .btn-send-image:focus { .is-desktop-ui .btn-send:hover, .btn-send:focus,
.is-desktop-ui .btn-send-image:hover, .btn-send-image:focus {
background-color: #555; background-color: #555;
color: white; color: white;
} }
.is-mobile-ui .btn-complete-nick:hover,
.is-mobile-ui .btn-send:hover,
.is-mobile-ui .btn-send-image:hover {
color: #ccc;
}
#connection-infos { #connection-infos {
color: #aaa; color: #aaa;
} }

View file

@ -27,12 +27,19 @@ html {
background: #428BCA; background: #428BCA;
} }
.btn-complete-nick,
.btn-send, .btn-send,
.btn-send-image, { .btn-send-image, {
background: none repeat scroll 0% 0% rgba(255, 255, 255, 0.3); background: none repeat scroll 0% 0% rgba(255, 255, 255, 0.3);
color: #428BCA; color: #428BCA;
} }
.is-mobile-ui .btn-complete-nick:hover,
.is-mobile-ui .btn-send:hover,
.is-mobile-ui .btn-send-image:hover {
color: #428BCA;
}
tr.bufferline:hover { tr.bufferline:hover {
background-color: #efefef; background-color: #efefef;
} }

View file

@ -1,8 +1,9 @@
<form class="form form-horizontal" id="inputform" ng-submit="sendMessage()" imgur-drop> <form class="form form-horizontal" ng-class="utils.isMobileUi() ? 'is-mobile-ui' : 'is-desktop-ui'" id="inputform" ng-submit="sendMessage()" imgur-drop>
<div class="input-group"> <div class="input-group">
<textarea id="{{inputId}}" class="form-control favorite-font" ng-trim="false" rows="1" ng-change="inputChanged()" autocomplete="on" ng-model="command" ng-focus="hideSidebar()"> <textarea id="{{inputId}}" class="form-control favorite-font" ng-trim="false" rows="1" ng-change="inputChanged()" autocomplete="on" ng-model="command" ng-focus="hideSidebar()">
</textarea> </textarea>
<span class="input-group-btn"> <span class="input-group-btn">
<button class="btn btn-complete-nick unselectable" title="Complete nick" ng-hide="!utils.isMobileUi()" ng-click="handleCompleteNickButton($event)"><i class="glyphicon glyphicon-bullhorn"></i></button>
<label class="btn btn-send-image unselectable" for="imgur-upload" title="Send image"> <label class="btn btn-send-image unselectable" for="imgur-upload" title="Send image">
<i class="glyphicon glyphicon-picture"></i> <i class="glyphicon glyphicon-picture"></i>
<input type="file" accept="image/*" multiple title="Send image" id="imgur-upload" class="imgur-upload" file-change="uploadImage($event, files)"> <input type="file" accept="image/*" multiple title="Send image" id="imgur-upload" class="imgur-upload" file-change="uploadImage($event, files)">

View file

@ -14,7 +14,7 @@ weechat.directive('inputBar', function() {
command: '=command' command: '=command'
}, },
controller: ['$rootScope', '$scope', '$element', '$log', 'connection', 'imgur', 'models', 'IrcUtils', 'settings', function($rootScope, controller: ['$rootScope', '$scope', '$element', '$log', 'connection', 'imgur', 'models', 'IrcUtils', 'settings', 'utils', function($rootScope,
$scope, $scope,
$element, //XXX do we need this? don't seem to be using it $element, //XXX do we need this? don't seem to be using it
$log, $log,
@ -22,7 +22,11 @@ weechat.directive('inputBar', function() {
imgur, imgur,
models, models,
IrcUtils, IrcUtils,
settings) { settings,
utils) {
// Expose utils to be able to check if we're on a mobile UI
$scope.utils = utils;
// E.g. Turn :smile: into the unicode equivalent // E.g. Turn :smile: into the unicode equivalent
$scope.inputChanged = function() { $scope.inputChanged = function() {
@ -497,6 +501,17 @@ weechat.directive('inputBar', function() {
return true; return true;
} }
}; };
$scope.handleCompleteNickButton = function($event) {
$event.preventDefault();
$scope.completeNick();
setTimeout(function() {
$scope.getInputNode().focus();
}, 0);
return true;
};
}] }]
}; };
}); });