Merge pull request #579 from marc1706/ticket/578
[ticket/578] Correctly assign classes to elements upon deleting/moving modules
This commit is contained in:
@@ -13,33 +13,39 @@ phpbb.addAjaxCallback('b3p_move_module_up', function(res) {
|
||||
return;
|
||||
}
|
||||
|
||||
var el = $(this).parents('tr:first'),
|
||||
trSwap = el.prev(),
|
||||
elClass = trSwap.attr('class'),
|
||||
trSwapClass = el.attr('class');
|
||||
var $bottomRow = $(this).parents('tr:first'),
|
||||
$topRow = $bottomRow.prev(),
|
||||
topRowClass = $topRow.attr('class'),
|
||||
bottomRowClass = $bottomRow.attr('class');
|
||||
|
||||
el.insertBefore(trSwap);
|
||||
el.attr('class', elClass);
|
||||
trSwap.attr('class', trSwapClass);
|
||||
$bottomRow.insertBefore($topRow);
|
||||
if (bottomRowClass !== 'row3' && topRowClass !== 'row3') {
|
||||
$bottomRow.attr('class', topRowClass);
|
||||
$topRow.attr('class', bottomRowClass);
|
||||
} else if (bottomRowClass === 'row3') {
|
||||
$topRow.attr('class', (topRowClass === 'row1') ? 'row2' : 'row1');
|
||||
} else if (topRowClass === 'row3') {
|
||||
$bottomRow.attr('class', (bottomRowClass === 'row1') ? 'row2' : 'row1');
|
||||
}
|
||||
|
||||
// Swap images if swap element is first row
|
||||
var swapIsFirstRow = trSwap.find('img[src*="icon_up_disabled"]').parents('span:first').is(':visible');
|
||||
var swapIsFirstRow = $topRow.find('img[src*="icon_up_disabled"]').parents('span:first').is(':visible');
|
||||
|
||||
if (swapIsFirstRow) {
|
||||
trSwap.find('img[src*="icon_up_disabled"]').parents('span:first').toggle();
|
||||
trSwap.find('img[src*="icon_up."]').parents('span:first').toggle();
|
||||
el.find('img[src*="icon_up."]').parents('span:first').toggle();
|
||||
el.find('img[src*="icon_up_disabled"]').parents('span:first').toggle();
|
||||
$topRow.find('img[src*="icon_up_disabled"]').parents('span:first').toggle();
|
||||
$topRow.find('img[src*="icon_up."]').parents('span:first').toggle();
|
||||
$bottomRow.find('img[src*="icon_up."]').parents('span:first').toggle();
|
||||
$bottomRow.find('img[src*="icon_up_disabled"]').parents('span:first').toggle();
|
||||
}
|
||||
|
||||
// Swap images if move element is last row
|
||||
var elIsLastRow = el.find('img[src*="icon_down_disabled"]').parents('span:first').is(':visible');
|
||||
var elIsLastRow = $bottomRow.find('img[src*="icon_down_disabled"]').parents('span:first').is(':visible');
|
||||
|
||||
if (elIsLastRow) {
|
||||
trSwap.find('img[src*="icon_down_disabled"]').parents('span:first').toggle();
|
||||
trSwap.find('img[src*="icon_down."]').parents('span:first').toggle();
|
||||
el.find('img[src*="icon_down."]').parents('span:first').toggle();
|
||||
el.find('img[src*="icon_down_disabled"]').parents('span:first').toggle();
|
||||
$topRow.find('img[src*="icon_down_disabled"]').parents('span:first').toggle();
|
||||
$topRow.find('img[src*="icon_down."]').parents('span:first').toggle();
|
||||
$bottomRow.find('img[src*="icon_down."]').parents('span:first').toggle();
|
||||
$bottomRow.find('img[src*="icon_down_disabled"]').parents('span:first').toggle();
|
||||
}
|
||||
});
|
||||
|
||||
@@ -48,33 +54,39 @@ phpbb.addAjaxCallback('b3p_move_module_down', function(res) {
|
||||
return;
|
||||
}
|
||||
|
||||
var el = $(this).parents('tr:first'),
|
||||
trSwap = el.next(),
|
||||
elClass = trSwap.attr('class'),
|
||||
trSwapClass = el.attr('class');
|
||||
var $topRow = $(this).parents('tr:first'),
|
||||
$bottomRow = $topRow.next(),
|
||||
bottomRowClass = $bottomRow.attr('class'),
|
||||
topRowClass = $topRow.attr('class');
|
||||
|
||||
el.insertAfter(trSwap);
|
||||
el.attr('class', elClass);
|
||||
trSwap.attr('class', trSwapClass);
|
||||
$topRow.insertAfter($bottomRow);
|
||||
if (bottomRowClass !== 'row3' && topRowClass !== 'row3') {
|
||||
$bottomRow.attr('class', topRowClass);
|
||||
$topRow.attr('class', bottomRowClass);
|
||||
} else if (bottomRowClass === 'row3') {
|
||||
$topRow.attr('class', (topRowClass === 'row1') ? 'row2' : 'row1');
|
||||
} else if (topRowClass === 'row3') {
|
||||
$bottomRow.attr('class', (bottomRowClass === 'row1') ? 'row2' : 'row1');
|
||||
}
|
||||
|
||||
// Swap images if swap element is last row
|
||||
var swapIsLastRow = trSwap.find('img[src*="icon_down_disabled"]').parents('span:first').is(':visible');
|
||||
var swapIsLastRow = $bottomRow.find('img[src*="icon_down_disabled"]').parents('span:first').is(':visible');
|
||||
|
||||
if (swapIsLastRow) {
|
||||
trSwap.find('img[src*="icon_down_disabled"]').parents('span:first').toggle();
|
||||
trSwap.find('img[src*="icon_down."]').parents('span:first').toggle();
|
||||
el.find('img[src*="icon_down."]').parents('span:first').toggle();
|
||||
el.find('img[src*="icon_down_disabled"]').parents('span:first').toggle();
|
||||
$bottomRow.find('img[src*="icon_down_disabled"]').parents('span:first').toggle();
|
||||
$bottomRow.find('img[src*="icon_down."]').parents('span:first').toggle();
|
||||
$topRow.find('img[src*="icon_down."]').parents('span:first').toggle();
|
||||
$topRow.find('img[src*="icon_down_disabled"]').parents('span:first').toggle();
|
||||
}
|
||||
|
||||
// Swap images if move element is first row
|
||||
var elIsFirstRow = el.find('img[src*="icon_up_disabled"]').parents('span:first').is(':visible');
|
||||
var elIsFirstRow = $topRow.find('img[src*="icon_up_disabled"]').parents('span:first').is(':visible');
|
||||
|
||||
if (elIsFirstRow) {
|
||||
trSwap.find('img[src*="icon_up_disabled"]').parents('span:first').toggle();
|
||||
trSwap.find('img[src*="icon_up."]').parents('span:first').toggle();
|
||||
el.find('img[src*="icon_up."]').parents('span:first').toggle();
|
||||
el.find('img[src*="icon_up_disabled"]').parents('span:first').toggle();
|
||||
$bottomRow.find('img[src*="icon_up_disabled"]').parents('span:first').toggle();
|
||||
$bottomRow.find('img[src*="icon_up."]').parents('span:first').toggle();
|
||||
$topRow.find('img[src*="icon_up."]').parents('span:first').toggle();
|
||||
$topRow.find('img[src*="icon_up_disabled"]').parents('span:first').toggle();
|
||||
}
|
||||
});
|
||||
|
||||
@@ -83,16 +95,20 @@ phpbb.addAjaxCallback('b3p_delete_module', function(res) {
|
||||
return;
|
||||
}
|
||||
|
||||
var el = $(this).parents('tr:first'),
|
||||
nextEl = el.next();
|
||||
var $deletedRow = $(this).parents('tr:first'),
|
||||
$nextRow = $deletedRow.next();
|
||||
|
||||
el.remove();
|
||||
$deletedRow.remove();
|
||||
|
||||
// Fix classes of next elements
|
||||
while (nextEl !== undefined && nextEl.is('tr')) {
|
||||
var nextElClass = (nextEl.attr('class') === 'row1') ? 'row2' : 'row1';
|
||||
nextEl.attr('class', nextElClass);
|
||||
nextEl = nextEl.next();
|
||||
while ($nextRow !== undefined && $nextRow.is('tr')) {
|
||||
var nextRowClass = ($nextRow.attr('class') === 'row1') ? 'row2' : 'row1';
|
||||
|
||||
if ($nextRow.attr('class') !== 'row3') {
|
||||
$nextRow.attr('class', nextRowClass);
|
||||
}
|
||||
|
||||
$nextRow = $nextRow.next();
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
@@ -18,31 +18,69 @@ var portal_right_width;
|
||||
* the center column but rather right after the last module of the left column.
|
||||
*/
|
||||
phpbb.b3p_fix_right_column_margin = function() {
|
||||
var width = $(window).width();
|
||||
var $portal_right = $('#portal-right');
|
||||
var $portal_left = $('#portal-left');
|
||||
var $portal_center = $('#portal-center');
|
||||
var width = $(window).width(),
|
||||
$portal_right = $('#portal-right'),
|
||||
$portal_left = $('#portal-left'),
|
||||
$portal_center = $('#portal-center'),
|
||||
marginLeft = 'margin-left',
|
||||
marginRight = 'margin-right';
|
||||
|
||||
if ($('body').hasClass('rtl')) {
|
||||
marginLeft = marginRight;
|
||||
marginRight = 'margin-left';
|
||||
}
|
||||
|
||||
|
||||
if (width <= (895 - $.getScrollbarWidth())) {
|
||||
// Get correct margin-left for portal-right and add 10px for padding
|
||||
if ($portal_left.width() > 0) {
|
||||
$portal_right.css('margin-left', - ($portal_right.width() + 1));
|
||||
if (!$portal_center.length && $portal_left.length) {
|
||||
$portal_right.css(marginLeft, 5);
|
||||
$portal_left.css(marginRight, 0);
|
||||
} else {
|
||||
$portal_right.css(marginLeft, - ($portal_right.width() + 1));
|
||||
}
|
||||
$portal_right.css('margin-top', $portal_center.height() + 'px');
|
||||
$portal_left.css('margin-top', $portal_center.height() + 'px');
|
||||
} else {
|
||||
$portal_right.css('margin-left', 0);
|
||||
$portal_right.css(marginLeft, 0);
|
||||
$portal_right.css('margin-top', 0);
|
||||
}
|
||||
} else {
|
||||
$portal_right.css('margin-top', '0px');
|
||||
$portal_right.css('margin-left', -portal_right_width);
|
||||
if (!$portal_center.length && $portal_left.length) {
|
||||
$portal_right.css(marginLeft, 0);
|
||||
} else {
|
||||
$portal_right.css(marginLeft, -portal_right_width);
|
||||
}
|
||||
$portal_right.width(portal_right_width);
|
||||
$portal_left.css('margin-top', 0);
|
||||
phpbb.b3pFixLeftColumnMargin();
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Correctly align left column if center column does not exist
|
||||
*/
|
||||
phpbb.b3pFixLeftColumnMargin = function() {
|
||||
var $portalLeft = $('#portal-left'),
|
||||
marginLeft = 'margin-left',
|
||||
marginRight = 'margin-right';
|
||||
|
||||
if ($('body').hasClass('rtl')) {
|
||||
marginLeft = marginRight;
|
||||
marginRight = 'margin-left';
|
||||
}
|
||||
|
||||
if ($portalLeft.length && !$('#portal-center').length) {
|
||||
$portalLeft.css(marginLeft, '0');
|
||||
$portalLeft.css(marginRight, 10);
|
||||
}
|
||||
};
|
||||
|
||||
$(document).ready(function() {
|
||||
portal_right_width = $('#portal-right').width();
|
||||
portal_right_width = $('#portal-right').attr('data-width');
|
||||
phpbb.b3pFixLeftColumnMargin();
|
||||
phpbb.b3p_fix_right_column_margin();
|
||||
$(window).resize(function() {
|
||||
phpbb.b3p_fix_right_column_margin();
|
||||
|
||||
@@ -71,7 +71,7 @@
|
||||
|
||||
<!-- [+] right module area -->
|
||||
<!-- IF S_RIGHT_COLUMN -->
|
||||
<div id="portal-right" style="width: {S_PORTAL_RIGHT_COLUMN}px; margin-<!-- IF S_CONTENT_DIRECTION eq 'rtl' -->right<!-- ELSE -->left<!-- ENDIF -->: -{S_PORTAL_RIGHT_COLUMN}px;" role="gridcell">
|
||||
<div id="portal-right" style="width: {S_PORTAL_RIGHT_COLUMN}px; margin-<!-- IF S_CONTENT_DIRECTION eq 'rtl' -->right<!-- ELSE -->left<!-- ENDIF -->: -{S_PORTAL_RIGHT_COLUMN}px;" data-width="{S_PORTAL_RIGHT_COLUMN}" role="gridcell">
|
||||
<!-- BEGIN modules_right -->
|
||||
<!-- DEFINE $TEMPLATE_FILE = '{modules_right.TEMPLATE_FILE}' -->
|
||||
<!-- DEFINE $IMAGE_SRC = '{modules_right.IMAGE_SRC}' -->
|
||||
|
||||
Reference in New Issue
Block a user