mirror of
https://github.com/thelounge/thelounge
synced 2024-11-10 06:34:21 +00:00
Sticky scroll to bottom
This commit is contained in:
parent
7f3656e458
commit
b45a3e09fd
2 changed files with 22 additions and 6 deletions
|
@ -115,14 +115,15 @@ h2 {
|
|||
padding: 0px 8px;
|
||||
}
|
||||
#chat .messages {
|
||||
bottom: 26px;
|
||||
left: 0;
|
||||
overflow-y: auto;
|
||||
padding: 6px 0;
|
||||
position: absolute;
|
||||
right: 160px;
|
||||
top: 36px;
|
||||
word-wrap: break-word;
|
||||
z-index: 0;
|
||||
bottom: 26px;
|
||||
}
|
||||
#chat .messages .message {
|
||||
padding: 0 8px;
|
||||
|
|
|
@ -20,9 +20,6 @@ $(function() {
|
|||
var View = {};
|
||||
|
||||
View.refresh = function(event) {
|
||||
if (event.data == undefined || event.data == []) {
|
||||
return;
|
||||
}
|
||||
chat.html("");
|
||||
event.data.forEach(function(network) {
|
||||
chat.append(Mustache.render(channels, network, {
|
||||
|
@ -30,6 +27,7 @@ $(function() {
|
|||
messages: messages
|
||||
}));
|
||||
});
|
||||
chat.find(".messages").scrollToBottom();
|
||||
sidebar.html(
|
||||
Mustache.render(networks, {
|
||||
networks: event.data
|
||||
|
@ -44,19 +42,23 @@ $(function() {
|
|||
case "user":
|
||||
target = ".users";
|
||||
render = Mustache.render(
|
||||
$("#users").html(), {users: event.data}
|
||||
users, {users: event.data}
|
||||
);
|
||||
break;
|
||||
case "message":
|
||||
target = ".messages";
|
||||
render = Mustache.render(
|
||||
$("#messages").html(), {messages: event.data}
|
||||
messages, {messages: event.data}
|
||||
);
|
||||
break;
|
||||
}
|
||||
if (target != "") {
|
||||
target = $("[data-id='" + event.target + "'] " + target);
|
||||
var keepAtBottom = target.isScrollBottom();
|
||||
target.append(render);
|
||||
if (keepAtBottom) {
|
||||
target.scrollToBottom();
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
|
@ -86,9 +88,22 @@ $(function() {
|
|||
});
|
||||
});
|
||||
|
||||
|
||||
(function() {
|
||||
var highest = 1;
|
||||
$.fn.bringToTop = function() {
|
||||
this.css('z-index', highest++);
|
||||
};
|
||||
|
||||
$.fn.scrollToBottom = function() {
|
||||
this.scrollTop(this.prop("scrollHeight"));
|
||||
};
|
||||
|
||||
$.fn.isScrollBottom = function() {
|
||||
var height = this.outerHeight();
|
||||
var scroll = this.scrollTop();
|
||||
if ((scroll + height + 5) >= this.prop("scrollHeight")) {
|
||||
return true;
|
||||
}
|
||||
};
|
||||
})();
|
||||
|
|
Loading…
Reference in a new issue