mirror of
https://github.com/thelounge/thelounge.git
synced 2024-05-17 05:36:36 +02:00
Added tab completion
This commit is contained in:
Mattias Erming
parent
e0a004259a
commit
dd4c9a400a
|
|
@ -180,6 +180,7 @@ h2 {
|
|||
padding: 0 8px;
|
||||
}
|
||||
#chat .messages {
|
||||
border-left: 8px solid #f0f0f0;
|
||||
bottom: 30px;
|
||||
left: 0;
|
||||
overflow-y: auto;
|
||||
|
|
@ -192,7 +193,7 @@ h2 {
|
|||
}
|
||||
#chat .message {
|
||||
line-height: 1.4em;
|
||||
padding: 0 6px;
|
||||
padding: 0 8px;
|
||||
}
|
||||
#chat .message div {
|
||||
display: inline;
|
||||
|
|
@ -203,6 +204,7 @@ h2 {
|
|||
#chat .message .user {
|
||||
color: #f00;
|
||||
}
|
||||
#chat .message .type,
|
||||
#chat .message .text {
|
||||
color: inherit;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,24 +1,24 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
|
||||
|
||||
<title>Chat</title>
|
||||
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no">
|
||||
|
||||
|
||||
<link rel="stylesheet" href="/css/bootstrap.css">
|
||||
<link rel="stylesheet" href="/css/style.css">
|
||||
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div id="wrap">
|
||||
<div id="viewport">
|
||||
|
||||
|
||||
<aside id="sidebar">
|
||||
<header class="header">
|
||||
|
||||
|
||||
<ul class="nav nav-tabs">
|
||||
<li class="active"><a href="#list" data-toggle="tab">Channels</a></li>
|
||||
<li><a href="#settings" data-toggle="tab">Settings</a></li>
|
||||
|
|
@ -26,7 +26,7 @@
|
|||
|
||||
</header>
|
||||
<div class="tab-content">
|
||||
|
||||
|
||||
<div id="list" class="tab-pane active"></div>
|
||||
<div id="settings" class="tab-pane">
|
||||
<div class="panel panel-default">
|
||||
|
|
@ -41,7 +41,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</aside>
|
||||
<div id="chat">
|
||||
|
|
@ -53,7 +53,7 @@
|
|||
</div>
|
||||
|
||||
<div id="scripts">
|
||||
|
||||
|
||||
<script type="text/html" id="network">
|
||||
{{#networks}}
|
||||
<div id="network-{{id}}" class="network list-group">
|
||||
|
|
@ -61,7 +61,6 @@
|
|||
</div>
|
||||
{{/networks}}
|
||||
</script>
|
||||
|
||||
<script type="text/html" id="channel">
|
||||
{{#channels}}
|
||||
<a href="{{name}}" id="channel-{{id}}" class="channel list-group-item">
|
||||
|
|
@ -70,7 +69,6 @@
|
|||
</a>
|
||||
{{/channels}}
|
||||
</script>
|
||||
|
||||
<script type="text/html" id="window">
|
||||
{{#channels}}
|
||||
<div id="window-{{id}}" class="window {{type}}">
|
||||
|
|
@ -97,7 +95,6 @@
|
|||
</div>
|
||||
{{/channels}}
|
||||
</script>
|
||||
|
||||
<script type="text/html" id="user">
|
||||
{{#users}}
|
||||
<a href="{{name}}" class="user">
|
||||
|
|
@ -105,13 +102,13 @@
|
|||
</a>
|
||||
{{/users}}
|
||||
</script>
|
||||
|
||||
<script type="text/html" id="message">
|
||||
{{#messages}}
|
||||
<div class="message {{type}}">
|
||||
<div class="time">{{time}}</div>
|
||||
<div class="user">{{from}}</div>
|
||||
<div class="text">{{type}} {{message}}</div>
|
||||
<div class="type">{{type}}</div>
|
||||
<div class="text">{{message}}</div>
|
||||
</div>
|
||||
{{/messages}}
|
||||
</script>
|
||||
|
|
@ -122,11 +119,12 @@
|
|||
<script src="//cdnjs.cloudflare.com/ajax/libs/URI.js/1.11.2/URI.min.js"></script>
|
||||
|
||||
<script src="/socket.io/socket.io.js"></script>
|
||||
<script src="/js/lib/jquery.scrollGlue.js"></script>
|
||||
<script src="/js/lib/bootstrap.js"></script>
|
||||
<script src="/js/lib/jquery.scrollGlue.js"></script>
|
||||
<script src="/js/lib/jquery.tabComplete.js"></script>
|
||||
<script src="/js/chat.js"></script>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,24 @@
|
|||
$(function() {
|
||||
var commands = [
|
||||
"/connect",
|
||||
"/deop",
|
||||
"/devoice",
|
||||
"/disconnect",
|
||||
"/join",
|
||||
"/kick",
|
||||
"/leave",
|
||||
"/mode",
|
||||
"/nick",
|
||||
"/op",
|
||||
"/part",
|
||||
"/query",
|
||||
"/quit",
|
||||
"/server",
|
||||
"/topic",
|
||||
"/voice",
|
||||
"/whois",
|
||||
];
|
||||
|
||||
var socket = io.connect("");
|
||||
$.each(["network", "channel", "message", "user"], function(i, type) {
|
||||
socket.on(type, function(json) {
|
||||
|
|
@ -46,8 +66,12 @@ $(function() {
|
|||
|
||||
chat.find(".messages").scrollGlue({animate: 400}).scrollToBottom();
|
||||
chat.find(".window")
|
||||
.find("input")
|
||||
.tabComplete(commands)
|
||||
.end()
|
||||
.first()
|
||||
.bringToTop();
|
||||
.bringToTop()
|
||||
.end();
|
||||
break;
|
||||
|
||||
case "channel":
|
||||
|
|
@ -69,9 +93,13 @@ $(function() {
|
|||
render("#window", {channels: json.data})
|
||||
).find(".window")
|
||||
.last()
|
||||
.find("input")
|
||||
.tabComplete(commands)
|
||||
.end()
|
||||
.bringToTop()
|
||||
.find(".messages")
|
||||
.scrollGlue({animate: 400});
|
||||
.scrollGlue({animate: 400})
|
||||
.end();
|
||||
break;
|
||||
|
||||
case "user":
|
||||
|
|
|
|||
2000
client/js/lib/URI.js
2000
client/js/lib/URI.js
File diff suppressed because it is too large
Load diff
51
client/js/lib/jquery.tabComplete.js
Normal file
51
client/js/lib/jquery.tabComplete.js
Normal file
|
|
@ -0,0 +1,51 @@
|
|||
/*!
|
||||
* jquery-tab-complete
|
||||
* https://github.com/erming/jquery-tab-complete
|
||||
*
|
||||
* Copyright (c) 2014 Mattias Erming <mattias@mattiaserming.com>
|
||||
* Licensed under the MIT License.
|
||||
*
|
||||
* Version 0.1.0
|
||||
*/
|
||||
|
||||
(function($) {
|
||||
$.fn.tabComplete = function(list) {
|
||||
var self = this;
|
||||
if (self.size() > 1) {
|
||||
return self.each(function() {
|
||||
$(this).tabComplete(list);
|
||||
});
|
||||
}
|
||||
|
||||
var match = [];
|
||||
self.on('keydown', function(e) {
|
||||
var key = e.which;
|
||||
if (key != 9) {
|
||||
match = [];
|
||||
return;
|
||||
}
|
||||
|
||||
var text = self.val().split(' ');
|
||||
var last = text.splice(-1)[0];
|
||||
|
||||
if (!match.length) {
|
||||
match = $.grep(list, function(w) {
|
||||
return last != '' && w.indexOf(last) !== -1;
|
||||
});
|
||||
}
|
||||
|
||||
var i = match.indexOf(last) + 1;
|
||||
if (i == match.length) {
|
||||
i = 0;
|
||||
}
|
||||
|
||||
if (match.length) {
|
||||
last = match[i];
|
||||
}
|
||||
|
||||
text.push(last);
|
||||
self.val(text.join(' '));
|
||||
return false;
|
||||
});
|
||||
};
|
||||
})(jQuery);
|
||||
|
|
@ -195,20 +195,6 @@ function event(event, data) {
|
|||
});
|
||||
break;
|
||||
|
||||
case "part":
|
||||
var chan = channels.findWhere({name: data[0].channels[0]});
|
||||
if (data[0].nick == this.get("client").me) {
|
||||
channels.remove(chan);
|
||||
return;
|
||||
}
|
||||
var users = chan.get("users");
|
||||
users.remove(users.findWhere({name: data[0].nick}));
|
||||
chan.addMessage({
|
||||
from: data[0].nick,
|
||||
type: "part",
|
||||
});
|
||||
break;
|
||||
|
||||
case "kick":
|
||||
var chan = channels.findWhere({name: data[0].channel});
|
||||
var users = chan.get("users");
|
||||
|
|
@ -281,6 +267,20 @@ function event(event, data) {
|
|||
channels.first().addMessage(data[0]);
|
||||
break;
|
||||
|
||||
case "part":
|
||||
var chan = channels.findWhere({name: data[0].channels[0]});
|
||||
if (data[0].nick == this.get("client").me) {
|
||||
channels.remove(chan);
|
||||
return;
|
||||
}
|
||||
var users = chan.get("users");
|
||||
users.remove(users.findWhere({name: data[0].nick}));
|
||||
chan.addMessage({
|
||||
from: data[0].nick,
|
||||
type: "part",
|
||||
});
|
||||
break;
|
||||
|
||||
case "quit":
|
||||
channels.each(function(chan) {
|
||||
var users = chan.get("users");
|
||||
|
|
|
|||
Loading…
Reference in a new issue