Fixed issues with positioning of userlist

This commit is contained in:
Nick Gordon
2013-11-12 07:41:26 -08:00
parent cd693835ce
commit edcafcc3ce
3 changed files with 20 additions and 4 deletions

View File

@@ -67,8 +67,6 @@
background: white; background: white;
border: 1px solid #a4a4a4; border: 1px solid #a4a4a4;
z-index: 10; z-index: 10;
margin-left: -435px;
margin-top: -355px;
} }
.list-at-user li { .list-at-user li {

View File

@@ -79,7 +79,7 @@ habitrpg.controller("GroupsCtrl", ['$scope', '$rootScope', 'Groups', '$http', 'A
} }
]) ])
.controller('AutocompleteCtrl', ['$scope', 'Groups', 'User', function ($scope,Groups,User) { .controller('AutocompleteCtrl', ['$scope', 'Groups', 'User', 'InputCaret', function ($scope,Groups,User,InputCaret) {
$scope.clearUserlist = function() { $scope.clearUserlist = function() {
$scope.response = []; $scope.response = [];
$scope.usernames = []; $scope.usernames = [];
@@ -102,7 +102,25 @@ habitrpg.controller("GroupsCtrl", ['$scope', '$rootScope', 'Groups', '$http', 'A
} }
} }
$scope.caretChanged = function(newCaretPos) {
var relativeelement = $('.-options');
var textarea = $('.chat-textarea');
var userlist = $('.list-at-user');
var offset = {
x: textarea.offset().left - relativeelement.offset().left,
y: textarea.offset().top - relativeelement.offset().top,
};
if(relativeelement) {
var caretOffset = InputCaret.getPosition(textarea);
userlist.css({
left: caretOffset.left + offset.x,
top: caretOffset.top + offset.y + 16
});
}
}
$scope.$watch('group.chat',$scope.chatChanged); $scope.$watch('group.chat',$scope.chatChanged);
$scope.$watch(function () { return $scope.caretPos; },$scope.caretChanged);
}]) }])
.controller('ChatCtrl', ['$scope', 'Groups', 'User', function($scope, Groups, User){ .controller('ChatCtrl', ['$scope', 'Groups', 'User', function($scope, Groups, User){

View File

@@ -3,7 +3,7 @@ form(ng-submit='postChat(group,_chatMessage)')
//FIXME ng-model makes this painfully slow! using jquery for now, which is really non-angular-like //FIXME ng-model makes this painfully slow! using jquery for now, which is really non-angular-like
.control-group.option-large(ng-controller='AutocompleteCtrl') .control-group.option-large(ng-controller='AutocompleteCtrl')
textarea.chat-textarea.option-content(style='height:6em;', ui-keypress='{13:"postChat(group,_chatMessage)"}', ng-model='_chatMessage', flag='@', at-user, auto-complete) textarea.chat-textarea.option-content(style='height:6em;', ui-keypress='{13:"postChat(group,_chatMessage)"}', ng-model='_chatMessage', flag='@', at-user, auto-complete)
span.user-list(ng-show='!isAtListHidden', auto-follow='true') span.user-list(ng-show='!isAtListHidden')
ul.list-at-user ul.list-at-user
li(ng-repeat='user in users | filter:query.text | limitTo: 5', ng-click='autoComplete(user)') li(ng-repeat='user in users | filter:query.text | limitTo: 5', ng-click='autoComplete(user)')
span.username.label(class='label-contributor-{{user.contributor.level}}') {{user.user}} span.username.label(class='label-contributor-{{user.contributor.level}}') {{user.user}}