mirror of
https://github.com/the-djmaze/snappymail.git
synced 2026-08-31 13:09:21 +03:00
Resize for the folder list. (#10)
This commit is contained in:
parent
3c8532b21a
commit
1dc5a45564
10 changed files with 357 additions and 233 deletions
|
|
@ -848,13 +848,13 @@ RainLoopApp.prototype.bootstart = function ()
|
|||
window.SimplePace.set(100);
|
||||
}
|
||||
|
||||
// if (!Globals.bMobileDevice)
|
||||
// {
|
||||
// _.defer(function () {
|
||||
// Utils.initLayoutResizer('#rl-top-resizer-left', '#rl-top-resizer-right', '#rl-center',
|
||||
// 120, 300, 200, 600, Enums.ClientSideKeyName.FolderListSize);
|
||||
// });
|
||||
// }
|
||||
if (!Globals.bMobileDevice)
|
||||
// if (false)
|
||||
{
|
||||
_.defer(function () {
|
||||
Utils.initLayoutResizer('#rl-left', '#rl-right', Enums.ClientSideKeyName.FolderListSize);
|
||||
});
|
||||
}
|
||||
|
||||
}, this));
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1038,89 +1038,127 @@ Utils.setExpandedFolder = function (sFullNameHash, bExpanded)
|
|||
RL.local().set(Enums.ClientSideKeyName.ExpandedFolders, aExpandedList);
|
||||
};
|
||||
|
||||
Utils.initLayoutResizer = function (sLeft, sRight, sParent/*, koSwither*/,
|
||||
iLimitL, iMaxL, iDefL, iLimitR, sClientSideKeyName)
|
||||
Utils.initLayoutResizer = function (sLeft, sRight, sClientSideKeyName)
|
||||
{
|
||||
iLimitL = iLimitL || 300;
|
||||
iMaxL = iMaxL || 500;
|
||||
iDefL = iDefL || (iMaxL - iLimitL / 2);
|
||||
iLimitR = iLimitR || 300;
|
||||
|
||||
var
|
||||
iTemp = 0,
|
||||
oLeft = $(sLeft),
|
||||
oRight = $(sRight),
|
||||
oParent = $(sParent),
|
||||
iLeftWidth = RL.local().get(sClientSideKeyName) || iDefL,
|
||||
fFunction = function (oEvent, oObject, bForce) {
|
||||
|
||||
if (oObject || bForce)
|
||||
mLeftWidth = RL.local().get(sClientSideKeyName) || null,
|
||||
fResizeFunction = function (oEvent, oObject) {
|
||||
if (oObject && oObject.size && oObject.size.width)
|
||||
{
|
||||
var
|
||||
iWidth = oParent.width(),
|
||||
iProc = oObject ? oObject.size.width / iWidth * 100 : null
|
||||
;
|
||||
RL.local().set(sClientSideKeyName, oObject.size.width);
|
||||
|
||||
if (null === iProc && bForce)
|
||||
{
|
||||
iProc = oLeft.width() / iWidth * 100;
|
||||
}
|
||||
|
||||
if (null !== iProc)
|
||||
{
|
||||
oLeft.css({
|
||||
'width': '',
|
||||
'height': '',
|
||||
'right': '' + (100 - iProc) + '%'
|
||||
});
|
||||
|
||||
oRight.css({
|
||||
'width': '',
|
||||
'height': '',
|
||||
'left': '' + iProc + '%'
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
fResiseFunction = function (oEvent, oObject)
|
||||
{
|
||||
if (/*koSwither && koSwither() && */oObject && oObject.element &&
|
||||
oObject.element[0]['id'] && '#' + oObject.element[0]['id'] === '' + sLeft)
|
||||
{
|
||||
var iWidth = oParent.width();
|
||||
iTemp = iWidth - iLimitR;
|
||||
iTemp = iMaxL > iTemp ? iTemp : iMaxL;
|
||||
oLeft.resizable('option', 'maxWidth', iTemp);
|
||||
if (oObject.size && oObject.size.width)
|
||||
{
|
||||
RL.local().set(sClientSideKeyName, oObject.size.width);
|
||||
}
|
||||
|
||||
fFunction(null, null, true);
|
||||
oRight.css({
|
||||
'left': '' + oObject.size.width + 'px'
|
||||
});
|
||||
}
|
||||
}
|
||||
;
|
||||
|
||||
if (iLeftWidth)
|
||||
if (null !== mLeftWidth)
|
||||
{
|
||||
oLeft.width(iLeftWidth);
|
||||
oLeft.css({
|
||||
'width': '' + mLeftWidth + 'px'
|
||||
});
|
||||
|
||||
oRight.css({
|
||||
'left': '' + mLeftWidth + 'px'
|
||||
});
|
||||
}
|
||||
|
||||
iTemp = oParent.width() - iLimitR;
|
||||
iTemp = iMaxL > iTemp ? iTemp : iMaxL;
|
||||
|
||||
oLeft.resizable({
|
||||
'minWidth': iLimitL,
|
||||
'maxWidth': iTemp,
|
||||
'helper': 'ui-resizable-helper',
|
||||
'minWidth': 120,
|
||||
'maxWidth': 400,
|
||||
'handles': 'e',
|
||||
'resize': fFunction,
|
||||
'stop': fFunction
|
||||
'stop': fResizeFunction
|
||||
});
|
||||
|
||||
fFunction(null, null, true);
|
||||
$window.resize(_.throttle(fResiseFunction, 400));
|
||||
};
|
||||
|
||||
//Utils.initLayoutResizer1 = function (sLeft, sRight, sParent/*, koSwither*/,
|
||||
// iLimitL, iMaxL, iDefL, iLimitR, sClientSideKeyName)
|
||||
//{
|
||||
// iLimitL = iLimitL || 300;
|
||||
// iMaxL = iMaxL || 500;
|
||||
// iDefL = iDefL || (iMaxL - iLimitL / 2);
|
||||
// iLimitR = iLimitR || 300;
|
||||
//
|
||||
// var
|
||||
// iTemp = 0,
|
||||
// oLeft = $(sLeft),
|
||||
// oRight = $(sRight),
|
||||
// oParent = $(sParent),
|
||||
// iLeftWidth = RL.local().get(sClientSideKeyName) || iDefL,
|
||||
// fFunction = function (oEvent, oObject, bForce) {
|
||||
//
|
||||
// if (oObject || bForce)
|
||||
// {
|
||||
// var
|
||||
// iWidth = oParent.width(),
|
||||
// iProc = oObject ? oObject.size.width / iWidth * 100 : null
|
||||
// ;
|
||||
//
|
||||
// if (null === iProc && bForce)
|
||||
// {
|
||||
// iProc = oLeft.width() / iWidth * 100;
|
||||
// }
|
||||
//
|
||||
// if (null !== iProc)
|
||||
// {
|
||||
// oLeft.css({
|
||||
// 'width': '',
|
||||
// 'height': '',
|
||||
// 'right': '' + (100 - iProc) + '%'
|
||||
// });
|
||||
//
|
||||
// oRight.css({
|
||||
// 'width': '',
|
||||
// 'height': '',
|
||||
// 'left': '' + iProc + '%'
|
||||
// });
|
||||
// }
|
||||
// }
|
||||
// },
|
||||
// fResiseFunction = function (oEvent, oObject)
|
||||
// {
|
||||
// if (/*koSwither && koSwither() && */oObject && oObject.element &&
|
||||
// oObject.element[0]['id'] && '#' + oObject.element[0]['id'] === '' + sLeft)
|
||||
// {
|
||||
// var iWidth = oParent.width();
|
||||
// iTemp = iWidth - iLimitR;
|
||||
// iTemp = iMaxL > iTemp ? iTemp : iMaxL;
|
||||
// oLeft.resizable('option', 'maxWidth', iTemp);
|
||||
// if (oObject.size && oObject.size.width)
|
||||
// {
|
||||
// RL.local().set(sClientSideKeyName, oObject.size.width);
|
||||
// }
|
||||
//
|
||||
// fFunction(null, null, true);
|
||||
// }
|
||||
// }
|
||||
// ;
|
||||
//
|
||||
// if (iLeftWidth)
|
||||
// {
|
||||
// oLeft.width(iLeftWidth);
|
||||
// }
|
||||
//
|
||||
// iTemp = oParent.width() - iLimitR;
|
||||
// iTemp = iMaxL > iTemp ? iTemp : iMaxL;
|
||||
//
|
||||
// oLeft.resizable({
|
||||
// 'minWidth': iLimitL,
|
||||
// 'maxWidth': iTemp,
|
||||
// 'handles': 'e',
|
||||
// 'resize': fFunction,
|
||||
// 'stop': fFunction
|
||||
// });
|
||||
//
|
||||
// fFunction(null, null, true);
|
||||
// $window.resize(_.throttle(fResiseFunction, 400));
|
||||
//};
|
||||
|
||||
/**
|
||||
* @param {Object} oMessageTextBody
|
||||
*/
|
||||
|
|
|
|||
|
|
@ -35,8 +35,8 @@
|
|||
#rl-left {
|
||||
.g-ui-absolute-reset;
|
||||
|
||||
right: auto;
|
||||
width: @rlLeftWidth;
|
||||
min-width: 120px;
|
||||
}
|
||||
|
||||
#rl-right {
|
||||
|
|
@ -117,15 +117,15 @@ html.ssm-state-tablet {
|
|||
}
|
||||
|
||||
#rl-sub-left {
|
||||
width: 300px;
|
||||
width: 310px;
|
||||
|
||||
.messageList .inputSearch {
|
||||
width: 210px;
|
||||
width: 220px;
|
||||
}
|
||||
}
|
||||
|
||||
#rl-sub-right {
|
||||
left: 300px;
|
||||
left: 310px;
|
||||
}
|
||||
|
||||
.b-compose.modal {
|
||||
|
|
@ -147,15 +147,15 @@ html.ssm-state-mobile {
|
|||
}
|
||||
|
||||
#rl-sub-left {
|
||||
width: 280px;
|
||||
width: 310px;
|
||||
|
||||
.messageList .inputSearch {
|
||||
width: 190px;
|
||||
width: 220px;
|
||||
}
|
||||
}
|
||||
|
||||
#rl-sub-right {
|
||||
left: 280px;
|
||||
left: 310px;
|
||||
}
|
||||
|
||||
.b-compose.modal {
|
||||
|
|
@ -167,6 +167,12 @@ html.ssm-state-mobile {
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
.ui-resizable-helper {
|
||||
border-right: 5px solid #777;
|
||||
border-right-color: rgba(255,255,255,0.7);
|
||||
}
|
||||
|
||||
html.rl-no-preview-pane {
|
||||
|
||||
#rl-sub-left {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue