Julian/phpbb_board3-portal_tlw
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request #579 from marc1706/ticket/578

Browse Source 
[ticket/578] Correctly assign classes to elements upon deleting/moving modules
This commit is contained in:
Marc Alexander
2015-06-06 23:03:20 +02:00
parent 55d7991829 24c7950dcb
commit 426af6f844
3 changed files with 104 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

98
adm/style/portal/ajax.js
View File

@@ -13,33 +13,39 @@ phpbb.addAjaxCallback('b3p_move_module_up', function(res) {
return; return;
} }
var el = $(this).parents('tr:first'), var $bottomRow = $(this).parents('tr:first'),
trSwap = el.prev(), $topRow = $bottomRow.prev(),
elClass = trSwap.attr('class'), topRowClass = $topRow.attr('class'),
trSwapClass = el.attr('class'); bottomRowClass = $bottomRow.attr('class');
el.insertBefore(trSwap); $bottomRow.insertBefore($topRow);
el.attr('class', elClass); if (bottomRowClass !== 'row3' && topRowClass !== 'row3') {
trSwap.attr('class', trSwapClass); $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 // 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) { if (swapIsFirstRow) {
trSwap.find('img[src*="icon_up_disabled"]').parents('span:first').toggle(); $topRow.find('img[src*="icon_up_disabled"]').parents('span:first').toggle();
trSwap.find('img[src*="icon_up."]').parents('span:first').toggle(); $topRow.find('img[src*="icon_up."]').parents('span:first').toggle();
el.find('img[src*="icon_up."]').parents('span:first').toggle(); $bottomRow.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();
} }
// Swap images if move element is last row // 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) { if (elIsLastRow) {
trSwap.find('img[src*="icon_down_disabled"]').parents('span:first').toggle(); $topRow.find('img[src*="icon_down_disabled"]').parents('span:first').toggle();
trSwap.find('img[src*="icon_down."]').parents('span:first').toggle(); $topRow.find('img[src*="icon_down."]').parents('span:first').toggle();
el.find('img[src*="icon_down."]').parents('span:first').toggle(); $bottomRow.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();
} }
}); });
@@ -48,33 +54,39 @@ phpbb.addAjaxCallback('b3p_move_module_down', function(res) {
return; return;
} }
var el = $(this).parents('tr:first'), var $topRow = $(this).parents('tr:first'),
trSwap = el.next(), $bottomRow = $topRow.next(),
elClass = trSwap.attr('class'), bottomRowClass = $bottomRow.attr('class'),
trSwapClass = el.attr('class'); topRowClass = $topRow.attr('class');
el.insertAfter(trSwap); $topRow.insertAfter($bottomRow);
el.attr('class', elClass); if (bottomRowClass !== 'row3' && topRowClass !== 'row3') {
trSwap.attr('class', trSwapClass); $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 // 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) { if (swapIsLastRow) {
trSwap.find('img[src*="icon_down_disabled"]').parents('span:first').toggle(); $bottomRow.find('img[src*="icon_down_disabled"]').parents('span:first').toggle();
trSwap.find('img[src*="icon_down."]').parents('span:first').toggle(); $bottomRow.find('img[src*="icon_down."]').parents('span:first').toggle();
el.find('img[src*="icon_down."]').parents('span:first').toggle(); $topRow.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();
} }
// Swap images if move element is first row // 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) { if (elIsFirstRow) {
trSwap.find('img[src*="icon_up_disabled"]').parents('span:first').toggle(); $bottomRow.find('img[src*="icon_up_disabled"]').parents('span:first').toggle();
trSwap.find('img[src*="icon_up."]').parents('span:first').toggle(); $bottomRow.find('img[src*="icon_up."]').parents('span:first').toggle();
el.find('img[src*="icon_up."]').parents('span:first').toggle(); $topRow.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();
} }
}); });
@@ -83,16 +95,20 @@ phpbb.addAjaxCallback('b3p_delete_module', function(res) {
return; return;
} }
var el = $(this).parents('tr:first'), var $deletedRow = $(this).parents('tr:first'),
nextEl = el.next(); $nextRow = $deletedRow.next();
el.remove(); $deletedRow.remove();
// Fix classes of next elements // Fix classes of next elements
while (nextEl !== undefined && nextEl.is('tr')) { while ($nextRow !== undefined && $nextRow.is('tr')) {
var nextElClass = (nextEl.attr('class') === 'row1') ? 'row2' : 'row1'; var nextRowClass = ($nextRow.attr('class') === 'row1') ? 'row2' : 'row1';
nextEl.attr('class', nextElClass);
nextEl = nextEl.next(); if ($nextRow.attr('class') !== 'row3') {
$nextRow.attr('class', nextRowClass);
}
$nextRow = $nextRow.next();
} }
}); });

54
styles/prosilver/template/portal/assets/portal.js
View File

@@ -18,31 +18,69 @@ var portal_right_width;
* the center column but rather right after the last module of the left column. * the center column but rather right after the last module of the left column.
*/ */
phpbb.b3p_fix_right_column_margin = function() { phpbb.b3p_fix_right_column_margin = function() {
var width = $(window).width(); var width = $(window).width(),
var $portal_right = $('#portal-right'); $portal_right = $('#portal-right'),
var $portal_left = $('#portal-left'); $portal_left = $('#portal-left'),
var $portal_center = $('#portal-center'); $portal_center = $('#portal-center'),
marginLeft = 'margin-left',
marginRight = 'margin-right';
if ($('body').hasClass('rtl')) {
marginLeft = marginRight;
marginRight = 'margin-left';
}
if (width <= (895 - $.getScrollbarWidth())) { if (width <= (895 - $.getScrollbarWidth())) {
// Get correct margin-left for portal-right and add 10px for padding // Get correct margin-left for portal-right and add 10px for padding
if ($portal_left.width() > 0) { 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_right.css('margin-top', $portal_center.height() + 'px');
$portal_left.css('margin-top', $portal_center.height() + 'px'); $portal_left.css('margin-top', $portal_center.height() + 'px');
} else { } else {
$portal_right.css('margin-left', 0); $portal_right.css(marginLeft, 0);
$portal_right.css('margin-top', 0); $portal_right.css('margin-top', 0);
} }
} else { } else {
$portal_right.css('margin-top', '0px'); $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_right.width(portal_right_width);
$portal_left.css('margin-top', 0); $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() { $(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(); phpbb.b3p_fix_right_column_margin();
$(window).resize(function() { $(window).resize(function() {
phpbb.b3p_fix_right_column_margin(); phpbb.b3p_fix_right_column_margin();

2
styles/prosilver/template/portal/portal_body.html
View File

@@ -71,7 +71,7 @@
<!-- [+] right module area --> <!-- [+] right module area -->
<!-- IF S_RIGHT_COLUMN --> <!-- 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 --> <!-- BEGIN modules_right -->
<!-- DEFINE $TEMPLATE_FILE = '{modules_right.TEMPLATE_FILE}' --> <!-- DEFINE $TEMPLATE_FILE = '{modules_right.TEMPLATE_FILE}' -->
<!-- DEFINE $IMAGE_SRC = '{modules_right.IMAGE_SRC}' --> <!-- DEFINE $IMAGE_SRC = '{modules_right.IMAGE_SRC}' -->