Added 'Send' button

This commit is contained in:
Mattias Erming 2014-09-21 08:21:26 -07:00
parent a837ed270b
commit 0607516872
4 changed files with 41 additions and 10 deletions

View File

@ -685,7 +685,6 @@ button {
left: 0; left: 0;
position: absolute; position: absolute;
right: 0px; right: 0px;
/*z-index: 1;*/
} }
#form input { #form input {
border: 1px solid #cfdae1; border: 1px solid #cfdae1;
@ -693,7 +692,7 @@ button {
border-radius: 2px; border-radius: 2px;
height: 100%; height: 100%;
outline: none; outline: none;
padding: 0 12px; padding: 0 10px;
-webkit-appearance: none; -webkit-appearance: none;
width: 100%; width: 100%;
} }
@ -704,11 +703,29 @@ button {
right: 7px; right: 7px;
top: 6px; top: 6px;
} }
#form .input {
left: 0;
height: 34px;
margin-right: 60px;
position: relative;
}
#form #submit { #form #submit {
height: 0; background: #f4f4f4;
margin-left: -9999px; background-image: linear-gradient(#f4f4f4, #ececec);
border: 1px solid #d7d7d7;
border-bottom-color: #b7b7b7;
border-radius: 2px;
font: 12px Lato, sans-serif;
color: #555;
height: 34px;
opacity: .5;
position: absolute; position: absolute;
width: 0; right: 0;
transition: opacity .3s;
width: 54px;
}
#form #submit.enabled {
opacity: 1;
} }
/** /**

View File

@ -235,8 +235,13 @@
</div> </div>
<form id="form" action=""> <form id="form" action="">
<div class="inner"> <div class="inner">
<input id="submit" tabindex="-1" type="submit"> <!--<input id="submit" tabindex="-1" type="submit">-->
<input id="input" class="mousetrap"> <button id="submit" type="submit">
Send
</button>
<div class="input">
<input id="input" class="mousetrap">
</div>
</div> </div>
</form> </form>
</div> </div>

View File

@ -332,19 +332,28 @@ $(function() {
.history() .history()
.tab(complete, {hint: false}); .tab(complete, {hint: false});
var form = $("#form").on("submit", function(e) { var form = $("#form");
var submit = $("#submit");
form.on("submit", function(e) {
e.preventDefault(); e.preventDefault();
var text = input.val(); var text = input.val();
input.val(""); input.val("");
if (text.indexOf("/clear") === 0) { if (text.indexOf("/clear") === 0) {
return clear(); clear();
return;
} }
submit.removeClass("enabled");
socket.emit("input", { socket.emit("input", {
target: chat.data("id"), target: chat.data("id"),
text: text text: text
}); });
}); });
form.on("input", "#input", function() {
submit.toggleClass("enabled", $(this).val() != "");
});
chat.on("click", focus); chat.on("click", focus);
$(window).on("focus", focus); $(window).on("focus", focus);

View File

@ -1,7 +1,7 @@
{ {
"name": "shout", "name": "shout",
"description": "A web IRC client", "description": "A web IRC client",
"version": "0.31.6", "version": "0.31.7",
"author": "Mattias Erming", "author": "Mattias Erming",
"preferGlobal": true, "preferGlobal": true,
"bin": { "bin": {