ulysia/szurubooru
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Improved aligning post lists to their containers

Browse source
This commit is contained in:
Marcin Kurczewski 2014-07-25 14:31:39 +02:00
parent c7f077d89a
commit aa20251ee5
7 changed files with 118 additions and 109 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
data/config.ini
View file

@ -39,8 +39,8 @@ postsPerPage=20
logsPerPage=250
tagsPerPage=100
tagsRelated=15
thumbnailWidth=150
thumbnailHeight=150
thumbnailWidth=175
thumbnailHeight=175
thumbnailStyle=outside
endlessScrollingDefault=1
showPostTagTitlesDefault=0

5
public_html/media/css/comment-list.css
View file

@ -1,3 +1,8 @@
.post .thumb {
width: 150px;
height: 150px;
}
.comment-group .post-wrapper {
float: left;
}

27
public_html/media/css/post-small.css
View file

@ -17,10 +17,13 @@
.post-type-3gp:after,
.post-type-flv:after {
position: absolute;
right: 1px; /* border */
top: 1px; /* border */
width: 150px;
height: 150px;
/* border */
right: 1px;
top: 1px;
bottom: 1px;
left: 1px;
background-size: contain;
background-repeat: no-repeat;
content: ' ';
pointer-events: none;
}
@ -33,13 +36,13 @@
.post-type-flv {
border-color: red;
}
.post-type-swf:after { background: url('../img/thumb-overlay-swf.png'); }
.post-type-youtube:after { background: url('../img/thumb-overlay-yt.png'); }
.post-type-mp4:after { background: url('../img/thumb-overlay-mp4.png'); }
.post-type-webm:after { background: url('../img/thumb-overlay-webm.png'); }
.post-type-ogg:after { background: url('../img/thumb-overlay-ogg.png'); }
.post-type-3gp:after { background: url('../img/thumb-overlay-3gp.png'); }
.post-type-flv:after { background: url('../img/thumb-overlay-flv.png'); }
.post-type-swf:after { background-image: url('../img/thumb-overlay-swf.png'); }
.post-type-youtube:after { background-image: url('../img/thumb-overlay-yt.png'); }
.post-type-mp4:after { background-image: url('../img/thumb-overlay-mp4.png'); }
.post-type-webm:after { background-image: url('../img/thumb-overlay-webm.png'); }
.post-type-ogg:after { background-image: url('../img/thumb-overlay-ogg.png'); }
.post-type-3gp:after { background-image: url('../img/thumb-overlay-3gp.png'); }
.post-type-flv:after { background-image: url('../img/thumb-overlay-flv.png'); }
.post .toggle-tag {
@ -86,8 +89,6 @@
}
.post img.thumb {
display: inline-block;
width: 150px;
height: 150px;
vertical-align: top;
}

69
public_html/media/js/core.js
View file

@ -204,32 +204,11 @@ $(function()
{
$(window).resize(function()
{
fixSize();
if ($('body').width() == $('body').data('last-width'))
return;
$('body').data('last-width', $('body').width());
$('body').trigger('dom-update');
});
$('body').bind('dom-update', processSidebar);
fixSize();
});
var fixedEvenOnce = false;
function fixSize()
{
if ($('#small-screen').is(':visible'))
return;
var multiply = 168;
var oldWidth = $('.main-wrapper:eq(0)').width();
$('.main-wrapper:eq(0)').width('');
var newWidth = $('.main-wrapper:eq(0)').width();
if (oldWidth != newWidth || !fixedEvenOnce)
{
$('.main-wrapper').width(multiply * Math.floor(newWidth / multiply));
fixedEvenOnce = true;
}
}
//autocomplete
@ -416,40 +395,40 @@ Mousetrap.bind = function(key, func, args)
$(function()
{
Mousetrap.bind('q', function()
{
$('#top-nav input').focus();
return false;
}, 'keyup');
{
$('#top-nav input').focus();
return false;
}, 'keyup');
Mousetrap.bind('w', function()
{
$('body,html').animate({scrollTop: '-=150px'}, 200);
});
{
$('body,html').animate({scrollTop: '-=150px'}, 200);
});
Mousetrap.bind('s', function()
{
$('body,html').animate({scrollTop: '+=150px'}, 200);
});
{
$('body,html').animate({scrollTop: '+=150px'}, 200);
});
Mousetrap.bind('a', function()
{
var url = $('.paginator:visible .prev:not(.disabled) a').attr('href');
if (typeof url !== 'undefined')
window.location.href = url;
}, 'keyup');
{
var url = $('.paginator:visible .prev:not(.disabled) a').attr('href');
if (typeof url !== 'undefined')
window.location.href = url;
}, 'keyup');
Mousetrap.bind('d', function()
{
var url = $('.paginator:visible .next:not(.disabled) a').attr('href');
if (typeof url !== 'undefined')
window.location.href = url;
}, 'keyup');
{
var url = $('.paginator:visible .next:not(.disabled) a').attr('href');
if (typeof url !== 'undefined')
window.location.href = url;
}, 'keyup');
Mousetrap.bind('p', function()
{
$('.post a').eq(0).focus();
return false;
}, 'keyup');
{
$('.post a').eq(0).focus();
return false;
}, 'keyup');
});

80
public_html/media/js/post-list.js
View file

@ -1,35 +1,57 @@
function bindToggleTag()
{
$('.post a.toggle-tag').bindOnce('toggle-tag', 'click', toggleTagEventHandler);
}
function toggleTagEventHandler(e)
{
e.preventDefault();
var aDom = $(this);
if (aDom.hasClass('inactive'))
return;
aDom.addClass('inactive');
var enable = !aDom.parents('.post').hasClass('tagged');
var url = $(this).attr('href');
url = url.replace(/\/[01]\/?$/, '/' + (enable ? '1' : '0'));
postJSON({ url: url }).success(function(data)
{
aDom.removeClass('inactive');
aDom.parents('.post').removeClass('tagged');
if (enable)
aDom.parents('.post').addClass('tagged');
aDom.text(enable
? aDom.attr('data-text-tagged')
: aDom.attr('data-text-untagged'));
}).error(function(xhr)
{
alert(xhr.responseJSON
? xhr.responseJSON.message
: 'Fatal error');
aDom.removeClass('inactive');
});
}
function alignPosts()
{
var samplePost = $('.posts .post:last-child');
var container = $('.posts');
samplePost.find('.thumb').css('width', thumbnailWidth + 'px');
var containerWidth = container.width();
var thumbnailOuterWidth = samplePost.outerWidth(true);
var thumbnailInnerWidth = samplePost.find('.thumb').outerWidth();
var margin = thumbnailOuterWidth - thumbnailInnerWidth;
var numberOfThumbnailsToFitInRow = Math.ceil(containerWidth / thumbnailOuterWidth);
var newThumbnailWidth = Math.floor(containerWidth / numberOfThumbnailsToFitInRow) - margin;
container.find('.thumb').css('width', newThumbnailWidth + 'px');
}
$(function()
{
$('body').bind('dom-update', function()
{
$('.post a.toggle-tag').bindOnce('toggle-tag', 'click', function(e)
{
e.preventDefault();
var aDom = $(this);
if (aDom.hasClass('inactive'))
return;
aDom.addClass('inactive');
var enable = !aDom.parents('.post').hasClass('tagged');
var url = $(this).attr('href');
url = url.replace(/\/[01]\/?$/, '/' + (enable ? '1' : '0'));
postJSON({ url: url }).success(function(data)
{
aDom.removeClass('inactive');
aDom.parents('.post').removeClass('tagged');
if (enable)
aDom.parents('.post').addClass('tagged');
aDom.text(enable
? aDom.attr('data-text-tagged')
: aDom.attr('data-text-untagged'));
}).error(function(xhr)
{
alert(xhr.responseJSON
? xhr.responseJSON.message
: 'Fatal error');
aDom.removeClass('inactive');
});
});
bindToggleTag();
alignPosts();
});
});

40
public_html/media/js/post-view.js
View file

@ -135,30 +135,30 @@ $(function()
});
Mousetrap.bind('a', function()
{
var a = $('#sidebar .left a');
var url = a.attr('href');
if (typeof url !== 'undefined')
{
var a = $('#sidebar .left a');
var url = a.attr('href');
if (typeof url !== 'undefined')
{
a.click();
window.location.href = url;
}
}, 'keyup');
a.click();
window.location.href = url;
}
}, 'keyup');
Mousetrap.bind('d', function()
{
var a = $('#sidebar .right a');
var url = a.attr('href');
if (typeof url !== 'undefined')
{
var a = $('#sidebar .right a');
var url = a.attr('href');
if (typeof url !== 'undefined')
{
a.click();
window.location.href = url;
}
}, 'keyup');
a.click();
window.location.href = url;
}
}, 'keyup');
Mousetrap.bind('e', function()
{
$('a.edit-post').trigger('click');
return false;
}, 'keyup');
{
$('a.edit-post').trigger('click');
return false;
}, 'keyup');
});

2
src/Views/layout-normal.phtml
View file

@ -31,6 +31,8 @@ if (!empty(Core::getConfig()->appearance->extraStylesheets))
isset($this->context->transport->lastSearchQuery)
? $this->context->transport->lastSearchQuery
:'') ?>;
var thumbnailWidth = <?= Core::getConfig()->browsing->thumbnailWidth ?>;
var thumbnailHeight = <?= Core::getConfig()->browsing->thumbnailHeight ?>;
</script>
<nav id="top-nav">