Add send message button

This commit is contained in:
Jeremy Zhang 2019-02-25 17:59:58 +00:00
parent 01bf4ccd43
commit b9091d4293
3 changed files with 39 additions and 2 deletions

View File

@ -915,7 +915,7 @@ p.mentioned span.chatmessage {
.wdt-emoji-picker { .wdt-emoji-picker {
bottom: 13px; bottom: 13px;
right: 10px; right: 41px;
} }
#wdt-emoji-search, #wdt-emoji-search:focus { #wdt-emoji-search, #wdt-emoji-search:focus {
@ -930,6 +930,10 @@ p.mentioned span.chatmessage {
#upload-file-btn { #upload-file-btn {
display: none; display: none;
} }
#send-msg-btn {
display: none;
}
} }
@media only screen and (min-width: 321px) { @media only screen and (min-width: 321px) {
@ -940,12 +944,16 @@ p.mentioned span.chatmessage {
#upload-file-btn { #upload-file-btn {
display: block; display: block;
} }
#send-msg-btn {
display: block;
}
} }
#upload-file-btn { #upload-file-btn {
position: absolute; position: absolute;
bottom: 5px; bottom: 5px;
right: 38px; right: 67px;
color: gray; color: gray;
padding: 1px; padding: 1px;
transition: .3s ease-out; transition: .3s ease-out;
@ -955,6 +963,19 @@ p.mentioned span.chatmessage {
color: white; color: white;
} }
#send-msg-btn {
position: absolute;
bottom: 7px;
right: 6px;
width: 30px;
height: 30px;
}
#send-msg-btn > i {
position: relative;
top: -13px;
}
#fileinput { #fileinput {
display: none; display: none;
} }

View File

@ -289,6 +289,9 @@
} }
} }
$("#upload-file-btn").hide();
$("#send-msg-btn").hide();
$('select').material_select(); $('select').material_select();
$("#loginmodal").modal({ $("#loginmodal").modal({
@ -608,12 +611,14 @@
$("#emoji-tray-toggle").hide(); $("#emoji-tray-toggle").hide();
$(".wdt-emoji-picker").hide(); $(".wdt-emoji-picker").hide();
$("#upload-file-btn").hide(); $("#upload-file-btn").hide();
$("#send-msg-btn").hide();
} else { } else {
$("#visitor_mode_message").hide(); $("#visitor_mode_message").hide();
$("#messagebox").show(); $("#messagebox").show();
$("#emoji-tray-toggle").show(); $("#emoji-tray-toggle").show();
$(".wdt-emoji-picker").show(); $(".wdt-emoji-picker").show();
$("#upload-file-btn").show(); $("#upload-file-btn").show();
$("#send-msg-btn").show();
} }
} }
@ -820,6 +825,7 @@
$("#messagebox").prop('disabled', true); $("#messagebox").prop('disabled', true);
$("#messagebox").prop('placeholder', "NO TEXT CHANNELS"); $("#messagebox").prop('placeholder', "NO TEXT CHANNELS");
$("#upload-file-btn").hide(); $("#upload-file-btn").hide();
$("#send-msg-btn").hide();
Materialize.toast("You find yourself in a strange place. You don't have access to any text channels, or there are none in this server.", 20000); Materialize.toast("You find yourself in a strange place. You don't have access to any text channels, or there are none in this server.", 20000);
return; return;
} }
@ -830,11 +836,13 @@
$("#messagebox").prop('disabled', false); $("#messagebox").prop('disabled', false);
$("#messagebox").prop('placeholder', "Enter message"); $("#messagebox").prop('placeholder', "Enter message");
$("#upload-file-btn").show(); $("#upload-file-btn").show();
$("#send-msg-btn").show();
$(".wdt-emoji-picker").show(); $(".wdt-emoji-picker").show();
} else { } else {
$("#messagebox").prop('disabled', true); $("#messagebox").prop('disabled', true);
$("#messagebox").prop('placeholder', "Messaging is disabled in this channel."); $("#messagebox").prop('placeholder', "Messaging is disabled in this channel.");
$("#upload-file-btn").hide(); $("#upload-file-btn").hide();
$("#send-msg-btn").hide();
$(".wdt-emoji-picker").hide(); $(".wdt-emoji-picker").hide();
} }
if (this_channel.attach_files) { if (this_channel.attach_files) {
@ -1989,6 +1997,7 @@
$("#messagebox-filemodal").attr('readonly', true); $("#messagebox-filemodal").attr('readonly', true);
$("#proceed_fileupload_btn").attr("disabled", true); $("#proceed_fileupload_btn").attr("disabled", true);
$("#messagebox").attr('readonly', true); $("#messagebox").attr('readonly', true);
$("#send-msg-btn").attr("disabled", true);
var emojiConvertor = new EmojiConvertor(); var emojiConvertor = new EmojiConvertor();
emojiConvertor.init_env(); emojiConvertor.init_env();
emojiConvertor.replace_mode = "unified"; emojiConvertor.replace_mode = "unified";
@ -2027,6 +2036,7 @@
$("#messagebox-filemodal").attr('readonly', false); $("#messagebox-filemodal").attr('readonly', false);
$("#proceed_fileupload_btn").attr("disabled", false); $("#proceed_fileupload_btn").attr("disabled", false);
$("#filemodalprogress").hide(); $("#filemodalprogress").hide();
$("#send-msg-btn").attr("disabled", false);
if ($("#filemodal").is(":visible")) { if ($("#filemodal").is(":visible")) {
$("#messagebox-filemodal").focus(); $("#messagebox-filemodal").focus();
} else { } else {
@ -2057,6 +2067,11 @@
$("#messagebox").trigger(jQuery.Event("keydown", { keyCode: 13 } )); $("#messagebox").trigger(jQuery.Event("keydown", { keyCode: 13 } ));
} }
}); });
$("#send-msg-btn").click(function () {
$("#messagebox").focus();
$("#messagebox").trigger(jQuery.Event("keydown", { keyCode: 13 } ));
});
$('#guild-btn').sideNav({ $('#guild-btn').sideNav({
menuWidth: 300, // Default is 300 menuWidth: 300, // Default is 300

View File

@ -80,6 +80,7 @@
<textarea placeholder="Enter message" id="messagebox" type="text" class="materialize-textarea wdt-emoji-open-on-colon" rows="1"></textarea> <textarea placeholder="Enter message" id="messagebox" type="text" class="materialize-textarea wdt-emoji-open-on-colon" rows="1"></textarea>
<span id="visitor_mode_message" style="display:none;"><span id="visitor_mode_message_note">{{ _("Please login to post a message.") }}</span> <a id="visitor_login_btn" class="waves-effect waves-light btn">{{ _("Login") }}</a></span> <span id="visitor_mode_message" style="display:none;"><span id="visitor_mode_message_note">{{ _("Please login to post a message.") }}</span> <a id="visitor_login_btn" class="waves-effect waves-light btn">{{ _("Login") }}</a></span>
<a id="upload-file-btn" class="btn-flat"><i class="material-icons">file_upload</i></a> <a id="upload-file-btn" class="btn-flat"><i class="material-icons">file_upload</i></a>
<a id="send-msg-btn" class="btn-floating btn-large waves-effect waves-light"><i class="material-icons">send</i></a>
</div> </div>
</div> </div>
</footer> </footer>