Resize for the folder list. (#10)

This commit is contained in:
RainLoop Team 2014-01-03 17:32:25 +04:00
parent 3c8532b21a
commit 1dc5a45564
10 changed files with 357 additions and 233 deletions

View file

@ -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));
}

View file

@ -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
*/

View file

@ -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 {

View file

@ -2,7 +2,7 @@
"name": "RainLoop",
"title": "RainLoop Webmail",
"version": "1.6.0",
"release": "623",
"release": "624",
"description": "Simple, modern & fast web-based email client",
"homepage": "http://rainloop.net",
"main": "Gruntfile.js",

View file

@ -5989,8 +5989,8 @@ html.mobile * {
margin: 0;
border: 0;
z-index: 0;
right: auto;
width: 200px;
min-width: 120px;
}
#rl-right {
position: absolute;
@ -6056,13 +6056,13 @@ html.ssm-state-tablet #rl-right {
left: 150px;
}
html.ssm-state-tablet #rl-sub-left {
width: 300px;
width: 310px;
}
html.ssm-state-tablet #rl-sub-left .messageList .inputSearch {
width: 210px;
width: 220px;
}
html.ssm-state-tablet #rl-sub-right {
left: 300px;
left: 310px;
}
html.ssm-state-tablet .b-compose.modal {
width: 800px;
@ -6077,13 +6077,13 @@ html.ssm-state-mobile #rl-right {
left: 120px;
}
html.ssm-state-mobile #rl-sub-left {
width: 280px;
width: 310px;
}
html.ssm-state-mobile #rl-sub-left .messageList .inputSearch {
width: 190px;
width: 220px;
}
html.ssm-state-mobile #rl-sub-right {
left: 280px;
left: 310px;
}
html.ssm-state-mobile .b-compose.modal {
width: 800px;
@ -6091,6 +6091,10 @@ html.ssm-state-mobile .b-compose.modal {
html.ssm-state-mobile .b-contacts-content.modal {
width: 800px;
}
.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 {
right: 5px !important;
width: inherit;

File diff suppressed because one or more lines are too long

View file

@ -1650,89 +1650,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
*/

File diff suppressed because one or more lines are too long

View file

@ -1650,89 +1650,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
*/
@ -17167,13 +17205,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));
}

File diff suppressed because one or more lines are too long