Dynamically resize conversation page boxes

This commit is contained in:
Pierre 2018-05-20 14:31:46 +02:00
parent 8458c6190d
commit 8777832600
6 changed files with 64 additions and 14 deletions

View File

@ -8,6 +8,10 @@
max-height: 100%; max-height: 100%;
} }
.conversations-page-container .conversations-list-box ul {
max-height: 100%;
}
.conversations-page-container a.selected { .conversations-page-container a.selected {
background: #f7f7f7; background: #f7f7f7;
} }

View File

@ -1156,7 +1156,15 @@ var ComunicWeb = {
*/ */
conversation: { conversation: {
//TODO : implement //TODO : implement
} },
/**
* Conversation page utilities
*/
utils: {
//TODO : implement
},
}, },
/** /**

View File

@ -330,9 +330,7 @@ ComunicWeb.pages.conversations.conversation = {
//Enable / update slimscroll //Enable / update slimscroll
var target = ComunicWeb.pages.conversations.conversation._conv_info.window.messagesTarget; var target = ComunicWeb.pages.conversations.conversation._conv_info.window.messagesTarget;
var scrollBottom = $(target).prop("scrollHeight")+"px"; var scrollBottom = $(target).prop("scrollHeight")+"px";
$(target).slimScroll({ ComunicWeb.pages.conversations.utils.enableSlimScroll(target, ComunicWeb.pages.conversations.utils.getAvailableHeight(), scrollBottom);
scrollTo: scrollBottom
});
}, 100); }, 100);
} }
@ -577,11 +575,12 @@ ComunicWeb.pages.conversations.conversation = {
newScrollPos = oldestMessage.offsetTop - 30; newScrollPos = oldestMessage.offsetTop - 30;
if(newScrollPos < 0) if(newScrollPos < 0)
newScrollPos = 0; newScrollPos = 0;
$(convInfo.window.messagesTarget).slimScroll({ ComunicWeb.pages.conversations.utils.enableSlimScroll(
scrollTo: newScrollPos + "px" convInfo.window.messagesTarget,
ComunicWeb.pages.conversations.utils.getAvailableHeight(),
newScrollPos);
}); });
}); });
}); },
}
}; };

View File

@ -145,19 +145,24 @@ ComunicWeb.pages.conversations.listPane = {
} }
//Enable slimscroll //Enable slimscroll
$(conversationsContainer).slimScroll({ ComunicWeb.pages.conversations.utils.enableSlimScroll(
height: '100%' conversationsContainer,
}); ComunicWeb.pages.conversations.utils.getAvailableHeight(),
0);
//Scroll to selected conversation, if possible //Scroll to selected conversation, if possible
if(args.selected_conversation != null){ if(args.selected_conversation != null){
var newScrollPos = args.selected_conversation.offsetTop - 30; var newScrollPos = args.selected_conversation.offsetTop - 30;
if(newScrollPos < 0) if(newScrollPos < 0)
newScrollPos = 0; newScrollPos = 0;
$(conversationsContainer).slimScroll({
scrollTo: newScrollPos + "px" //Enable slimscroll again
}); ComunicWeb.pages.conversations.utils.enableSlimScroll(
conversationsContainer,
ComunicWeb.pages.conversations.utils.getAvailableHeight() + 55,
newScrollPos);
} }
}, },
/** /**

View File

@ -0,0 +1,33 @@
/**
* Conversation page utilities
*
* @author Pierre HUBERT
*/
ComunicWeb.pages.conversations.utils = {
/**
* Enable slimscroll for the conversation element
*
* @param {HMTLElement} target The target for slimscroll
* @param {Number} height The available height for the element
* @param {Number} pos Scroll position to go to
*/
enableSlimScroll: function(target, height, pos){
$(target).slimScroll({
scrollTo: pos + "px",
height: height + "px",
});
},
/**
* Get the available height for the conversations
*
* @return {Number} The available height, in pixel
*/
getAvailableHeight: function(){
return Number(byId("pageTarget").style.minHeight.replace("px", "")) - 180;
}
}

View File

@ -387,6 +387,7 @@ class Dev {
"js/pages/conversations/main.js", "js/pages/conversations/main.js",
"js/pages/conversations/listPane.js", "js/pages/conversations/listPane.js",
"js/pages/conversations/conversation.js", "js/pages/conversations/conversation.js",
"js/pages/conversations/utils.js",
//User settings page //User settings page
"js/pages/settings/main.js", "js/pages/settings/main.js",