From feb00567e4f08970be67f75ccee8df7940b9067a Mon Sep 17 00:00:00 2001 From: anuprulez Date: Sun, 19 Jun 2016 15:44:20 +0200 Subject: [PATCH] Adjusted the vertical position of gravatar icons --- .../communication/template/communication.css | 14 ++++++-- .../communication/template/communication.js | 33 ++++++++++++------- 2 files changed, 33 insertions(+), 14 deletions(-) diff --git a/scripts/communication/template/communication.css b/scripts/communication/template/communication.css index 9ec6ebde9b0..2b57d1b6ed4 100644 --- a/scripts/communication/template/communication.css +++ b/scripts/communication/template/communication.css @@ -73,10 +73,12 @@ ul, li, .date_time { font-style: italic; + padding-right: 0px; + font-size: 11px; } .message { - padding-top: 5px; + padding-top: 2px; } .tab-content { @@ -157,10 +159,16 @@ a:hover, a:visited { } .scroller-right { - float: right; + float: right; } .scroller-left { - float: left; + float: left; } +.message-height { + padding-right: 0px; +} + + + diff --git a/scripts/communication/template/communication.js b/scripts/communication/template/communication.js index 36a93c70f8a..835f31150c6 100644 --- a/scripts/communication/template/communication.js +++ b/scripts/communication/template/communication.js @@ -14,15 +14,16 @@ var events_module = { // builds the message to be displayed message = utils.build_message( msg ); - + // append only for non empty messages if (msg.data.length > 0) { utils.append_message( $el_all_messages, message ); + utils.vertical_center_align_gravatar( '#all_messages' ); // adding message to build full chat history - utils.store_append_message( uid, message ); + utils.store_append_message( uid, $el_all_messages.html() ); } // updates the user session storage with all the messages - sessionStorage['broadcast'] = $el_all_messages.html(); + sessionStorage[uid] = $el_all_messages.html(); // show the last item by scrolling to the end utils.fancyscroll_to_last( $("#all_chat_tab") ); // Alert user if needed @@ -71,6 +72,7 @@ var events_module = { var room = utils.check_room_by_roomname( click_events.connected_room, msg.chatroom ); $el_room_msg = $( '#all_messages_' + room.id ); utils.append_message( $el_room_msg, utils.build_message( msg ) ); + utils.vertical_center_align_gravatar( '#all_messages_' + room.id ); utils.fancyscroll_to_last( $( "#galaxy_tabroom_" + room.id ) ); // if the pushed message is for some other user, show notification if (uid !== msg.data) { @@ -368,7 +370,7 @@ var utils = { '
' + user.username + '
' + - '
' + + '
' + this.get_time() + '
' + '
' + @@ -377,10 +379,10 @@ var utils = { ''; if ( user.username === "me" ){ return '
' + - '
' + + '
' + message_col_content + '
' + - '
' + + '
' + gravatar_col_content + '
' + '
'; @@ -392,10 +394,10 @@ var utils = { '
'; } else { return '
' + - '
' + + '
' + gravatar_col_content + '
' + - '
' + + '
' + message_col_content + '
' + '
'; @@ -518,12 +520,13 @@ var utils = { }, // save chat logs store_append_message: function( key, data ) { - if (!localStorage[key]) { + /*if (!localStorage[key]) { localStorage[key] = data; } else { localStorage[key] = localStorage[key] + data; - } + }*/ + localStorage[key] = data; }, create_global_chatroom_links: function() { // global_rooms @@ -660,6 +663,14 @@ var utils = { // scrolls the fancy scroll to the last element fancyscroll_to_last: function( $el ) { $el.mCustomScrollbar( "scrollTo", "bottom" ); + }, + vertical_center_align_gravatar: function( parent ) { + var usermsg_length = $( parent + ' .message-height' ).length, + usermsg_height = ( $( $( parent + ' .message-height' )[ usermsg_length-1 ] ).height() / 2 ), + gravatar_length = $( parent + ' .vertical-align' ).length, + gravatar_height = ( $( $( parent + ' .vertical-align' )[ gravatar_length-1 ] ).height() / 2 ); + // sets the vertical height of gravatar icon + $( $( parent + ' .vertical-align img' )[ gravatar_length-1 ] ).css( 'padding-top', usermsg_height - gravatar_height); } } // this event fires when all the resources of the page @@ -698,7 +709,7 @@ $(window).load(function() { // updates online status text // by checking if user was connected or not utils.checks_session_storage(); - utils.fill_messages(sessionStorage['broadcast']); + utils.fill_messages(sessionStorage[uid]); // sets focus to the textarea utils.set_focus_textarea( $el_textarea ); // sets smooth transition