Skip to content

Commit

Permalink
Fixed messy centering issue with fixed entries.
Browse files Browse the repository at this point in the history
  • Loading branch information
kasparszarinovs committed Jul 1, 2012
1 parent 13d6d66 commit c6745c4
Show file tree
Hide file tree
Showing 4 changed files with 59 additions and 35 deletions.
2 changes: 1 addition & 1 deletion engine/js/BertaEditor.js
Original file line number Diff line number Diff line change
Expand Up @@ -666,7 +666,7 @@ var BertaEditor = new Class({
mainColumn_margin_padding = parseInt(mainColumn.getStyle('padding-left')) + parseInt(mainColumn.getStyle('margin-left'));
}

if(this.container.hasClass('xCentered')) {
if(this.container.hasClass('xCentered') && !(entry.getParent().hasClass('xFixed'))) {
var dropdownBoxLeftPos = dropdownPos.x - dropdownBoxSize.width + parseInt(dropdownSize.x/2+1) - mainColumn_margin_padding - entryPos - ((window.getSize().x - this.container.getSize().x) / 2);
} else {
var dropdownBoxLeftPos = dropdownPos.x - dropdownBoxSize.width + parseInt(dropdownSize.x/2+1) - mainColumn_margin_padding - entryPos;
Expand Down
17 changes: 15 additions & 2 deletions engine/js/BertaEditorBase.js
Original file line number Diff line number Diff line change
Expand Up @@ -395,7 +395,7 @@ var BertaEditorBase = new Class({
});

xGuideLineX.inject(document.body);
if(document.body.getElement('#contentContainer.xCentered')) {
if(document.body.getElement('#contentContainer.xCentered') && !(el.hasClass('xFixed'))) {
xGuideLineY.inject(document.body.getElement('#contentContainer'));
} else {
xGuideLineY.inject(document.body);
Expand Down Expand Up @@ -492,7 +492,12 @@ var BertaEditorBase = new Class({
});

}else{
var value = parseInt(el.getStyle('left')) + ',' + parseInt(el.getStyle('top'));
if(this.container.hasClass('xCentered') && el.hasClass('xFixed')) {
var left = parseInt(el.getStyle('left')) - (window.getSize().x - this.container.getSize().x) / 2;
} else {
var left = parseInt(el.getStyle('left'));
}
var value = left + ',' + parseInt(el.getStyle('top'));
this.elementEdit_save(null, el, null, null, value, value);
}
dragAll = false;
Expand Down Expand Up @@ -562,8 +567,16 @@ var BertaEditorBase = new Class({
var entry = el.getParent('.xEntry');
if (value=="1"){
entry.addClass('xFixed');
if(this.container.hasClass('xCentered')) {
var left = parseInt(entry.getStyle('left')) + (window.getSize().x - this.container.getSize().x) / 2;
entry.setStyle('left', left + 'px');
}
}else{
entry.removeClass('xFixed');
if(this.container.hasClass('xCentered')) {
var left = parseInt(entry.getStyle('left')) - (window.getSize().x - this.container.getSize().x) / 2;
entry.setStyle('left', left + 'px');
}
}
}

Expand Down
69 changes: 40 additions & 29 deletions templates/messy-0.4.0/mess.js
Original file line number Diff line number Diff line change
Expand Up @@ -111,37 +111,48 @@ var MessyMess = new Class({
var container = $('contentContainer');
var centeredLayout = container.hasClass('xCentered') ? true : false;

if(centeredLayout && bertaGlobalOptions.environment == 'engine') {
document.body.setStyle('overflow-y', 'scroll');

var guidesColor = container.getClassStoredValue('xCenteringGuides') == 'dark' ? 'rgba(0,0,0,0.5)' : 'rgba(255,255,255,0.5)';
var w = (window.getSize().x - container.getSize().x) / 2;
var el1 = new Element('div', {
'styles': {
'background-color': guidesColor,
'position': 'fixed',
'left': 0,
'height': '100%',
'width': w + 'px'
}
});
var el2 = new Element('div', {
'styles': {
'background-color': guidesColor,
'position': 'fixed',
'right': 0,
'height': '100%',
'width': w + 'px'
}
});
el1.inject(document.body, 'top');
el2.inject(document.body, 'top');
if(centeredLayout) {
var fixedItems = container.getElements('.xFixed');
if(fixedItems.length > 0) {
var guidesWidth = (window.getSize().x - container.getSize().x) / 2;
fixedItems.each(function(item) {
var wF = guidesWidth + parseInt(item.getStyle('left'));
item.setStyle('left', wF + 'px');
});
}

window.addEvent('resize', function() {
if(bertaGlobalOptions.environment == 'engine') {
document.body.setStyle('overflow-y', 'scroll');

var guidesColor = container.getClassStoredValue('xCenteringGuides') == 'dark' ? 'rgba(0,0,0,0.5)' : 'rgba(255,255,255,0.5)';
var w = (window.getSize().x - container.getSize().x) / 2;
el1.setStyle('width', w + 'px');
el2.setStyle('width', w + 'px');
});
var el1 = new Element('div', {
'styles': {
'background-color': guidesColor,
'position': 'fixed',
'left': 0,
'height': '100%',
'width': w + 'px'
}
});
var el2 = new Element('div', {
'styles': {
'background-color': guidesColor,
'position': 'fixed',
'right': 0,
'height': '100%',
'width': w + 'px'
}
});
el1.inject(document.body, 'top');
el2.inject(document.body, 'top');

window.addEvent('resize', function() {
var w = (window.getSize().x - container.getSize().x) / 2;
el1.setStyle('width', w + 'px');
el2.setStyle('width', w + 'px');
});
}
}
},

Expand Down
6 changes: 3 additions & 3 deletions templates/messy-0.4.0/template.tpl
Original file line number Diff line number Diff line change
Expand Up @@ -215,9 +215,9 @@
<!-- PAGE HEADING -->
{ if ($berta.environment == 'site' && $berta.settings.navigation.landingSectionMenuVisible=='yes') || $berta.environment == 'engine' || ($berta.environment == 'site' && $berta.settings.navigation.landingSectionMenuVisible=='no' && $berta.sectionName != $berta.sections|@key) }
{ if $berta.settings.heading.image }
<h1 class="{ messClasses property='siteHeadingXY' }" style="{ messStyles xy=$siteHeadingXY }"><a href="{ bertaLink }"><img src="{ $berta.options.MEDIA_ABS_ROOT }{ $berta.settings.heading.image }" /></a></h1>
<h1 class="{ messClasses property='siteHeadingXY' }{ if $berta.settings.heading.position == 'fixed' } xFixed{ /if }" style="{ messStyles xy=$siteHeadingXY }"><a href="{ bertaLink }"><img src="{ $berta.options.MEDIA_ABS_ROOT }{ $berta.settings.heading.image }" /></a></h1>
{ else }
<h1 class="{ messClasses property='siteHeadingXY' }" style="{ messStyles xy=$siteHeadingXY }">
<h1 class="{ messClasses property='siteHeadingXY' }{ if $berta.settings.heading.position == 'fixed' } xFixed{ /if }" style="{ messStyles xy=$siteHeadingXY }">
<span class="xEditable xProperty-siteHeading">
{ if $berta.environment == "engine" }
{ $siteHeading }
Expand All @@ -234,7 +234,7 @@
{ assign var="currentSectionName" value=$berta.sectionName }
{ foreach $berta.publishedSections as $sName => $section }
{ if $section.type != 'shopping_cart' }
<div class="menuItem xSection-{ $sName } { messClasses property='positionXY' } { if $currentSectionName == $section.name }menuItemSelected{ /if }" style="{ messStyles xy=$section.positionXY }">
<div class="menuItem xSection-{ $sName } { messClasses property='positionXY' } { if $currentSectionName == $section.name }menuItemSelected{ /if }{ if $berta.settings.menu.position == 'fixed' } xFixed{ /if }" style="{ messStyles xy=$section.positionXY }">
<a href="{ bertaLink section=$sName }" target="{ bertaTarget section=$sName }">{ $section.title }</a>

{ if $berta.settings.tagsMenu.hidden=='no' && (!empty($berta.tags.$sName) && ($berta.settings.tagsMenu.alwaysOpen=='yes' || $berta.sectionName==$sName)) }
Expand Down

0 comments on commit c6745c4

Please sign in to comment.