mirrors/h5ai
1
0
Fork 0
mirror of https://github.com/lrsjng/h5ai.git synced 2025-05-31 15:28:19 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Add sidebar.

Browse source
This commit is contained in:
Lars Jung 2014-06-16 00:41:27 +02:00
parent d6cef5c787
commit 506c93340a
17 changed files with 214 additions and 255 deletions
Download patch file Download diff file Expand all files Collapse all files

67
src/_h5ai/client/js/inc/ext/l10n.js
View file

@ -11,8 +11,8 @@ modulejs.define('ext/l10n', ['_', '$', 'core/settings', 'core/langs', 'core/form
isoCode: 'en',
lang: 'english',
details: 'details',
list: "list",
grid: "grid",
list: 'list',
grid: 'grid',
icons: 'icons',
name: 'Name',
lastModified: 'Last modified',
@ -28,11 +28,8 @@ modulejs.define('ext/l10n', ['_', '$', 'core/settings', 'core/langs', 'core/form
'delete': 'delete'
},
template = '<span id="langSelector">' +
'<span class="l10n-isoCode"/> - <span class="l10n-lang"/>' +
'<span class="langOptions"><ul/></span>' +
'</span>',
langOptionTemplate = '<li class="langOption"/>',
blockTemplate = '<div class="block"><div class="select"><select id="langs"/></div></div>',
optionTemplate = '<option/>',
storekey = 'ext/l10n',
@ -47,12 +44,14 @@ modulejs.define('ext/l10n', ['_', '$', 'core/settings', 'core/langs', 'core/form
currentLang = lang;
}
$('#langs option')
.removeAttr('selected').removeProp('selected')
.filter('.' + currentLang.isoCode)
.attr('selected', 'selected').prop('selected', 'selected');
$.each(currentLang, function (key, value) {
$('.l10n-' + key).text(value);
});
$('.langOption').removeClass('current');
$('.langOption.' + currentLang.isoCode).addClass('current');
format.setDefaultDateFormat(currentLang.dateFormat);
$('#items .item .date').each(function () {
@ -107,46 +106,24 @@ modulejs.define('ext/l10n', ['_', '$', 'core/settings', 'core/langs', 'core/form
initLangSelector = function (langs) {
var $langSelector = $(template).appendTo('#bottombar .right'),
$langOptions = $langSelector.find('.langOptions'),
$ul = $langOptions.find('ul'),
isoCodes = [];
$.each(langs, function (isoCode) {
isoCodes.push(isoCode);
});
isoCodes.sort();
$.each(isoCodes, function (idx, isoCode) {
$(langOptionTemplate)
.addClass(isoCode)
.text(isoCode + ' - ' + (_.isString(langs[isoCode]) ? langs[isoCode] : langs[isoCode].lang))
.appendTo($ul)
.click(function () {
var isoCodes = _.keys(langs).sort(),
$block = $(blockTemplate),
$select = $block.find('select')
.on('change', function (event) {
var isoCode = event.target.value;
store.put(storekey, isoCode);
localize(langs, isoCode, false);
});
$.each(isoCodes, function (idx, isoCode) {
$(optionTemplate)
.attr('value', isoCode)
.addClass(isoCode)
.text(isoCode + ' - ' + (_.isString(langs[isoCode]) ? langs[isoCode] : langs[isoCode].lang))
.appendTo($select);
});
$langOptions
.append($ul)
.scrollpanel();
$langSelector.hover(
function () {
$langOptions
.css('top', '-' + $langOptions.outerHeight() + 'px')
.stop(true, true)
.fadeIn();
// needs to be updated twice for initial fade in rendering :/
$langOptions.scrollpanel('update').scrollpanel('update');
},
function () {
$langOptions
.stop(true, true)
.fadeOut();
}
);
$block.appendTo('#settings');
},
init = function () {

2
src/_h5ai/client/js/inc/ext/select.js
View file

@ -172,7 +172,7 @@ modulejs.define('ext/select', ['_', '$', 'core/settings', 'core/resource', 'core
$document
.on('mousedown', '.noSelection', noSelection)
.on('mousedown', '.noSelectionUnlessCtrl,input,a', noSelectionUnlessCtrl)
.on('mousedown', '.noSelectionUnlessCtrl,input,select,a', noSelectionUnlessCtrl)
.on('mousedown', selectionStart);
};

75
src/_h5ai/client/js/inc/view/viewmode.js
View file

@ -10,20 +10,24 @@ modulejs.define('view/viewmode', ['_', '$', 'core/settings', 'core/resource', 'c
}, allsettings.view),
storekey = 'viewmode',
menuIsVisible = false,
template = '<li id="view-[MODE]" class="view">' +
'<a href="#">' +
'<img src="' + resource.image('view-[MODE]') + '" alt="view-[MODE]"/>' +
'<span class="l10n-[MODE]"/>' +
'</a>' +
'</li>',
sidebarToggleTemplate =
'<li id="menu-toggle" class="view">' +
'<a href="#">' +
'<img src="' + resource.image('settings') + '" alt="settings"/>' +
'</a>' +
'</li>',
sizeTemplate = '<li id="view-[SIZE]" class="view">' +
'<a href="#">' +
'<img src="' + resource.image('size') + '" alt="size"/>' +
'<span>[SIZE]</span>' +
'</a>' +
'</li>',
modeTemplate =
'<div id="view-[MODE]" class="view">' +
'<a href="#">' +
'<img src="' + resource.image('view-[MODE]') + '" alt="view-[MODE]"/>' +
'</a>' +
'</div>',
sizeTemplate =
'<input id="view-size" type="range" min="0" max="0" value="0">',
adjustSpacing = function () {
@ -57,29 +61,44 @@ modulejs.define('view/viewmode', ['_', '$', 'core/settings', 'core/resource', 'c
_.each(sizes, function (s) {
if (s === size) {
$('#view-' + s).addClass('current');
$view.addClass('size-' + s).show();
} else {
$('#view-' + s).removeClass('current');
$view.removeClass('size-' + s);
}
});
$('#view-size').val(_.indexOf(_.intersection(sizes, settings.sizes), size));
adjustSpacing();
},
init = function () {
var $navbar = $('#navbar');
var $sidebar = $('#sidebar'),
$settings = $('#settings'),
$viewBlock = $('<div class="block"/>'),
max;
$(sidebarToggleTemplate)
.on('click', 'a', function (event) {
menuIsVisible = !menuIsVisible;
$sidebar.stop().animate({
right: menuIsVisible ? 0 : -$sidebar.outerWidth()-1
});
event.preventDefault();
})
.appendTo('#navbar');
settings.modes = _.intersection(settings.modes, modes);
if (settings.modes.length > 1) {
_.each(modes.slice(0).reverse(), function (mode) {
_.each(modes, function (mode) {
if (_.contains(settings.modes, mode)) {
$(template.replace(/\[MODE\]/g, mode))
.appendTo($navbar)
$(modeTemplate.replace(/\[MODE\]/g, mode))
.appendTo($viewBlock)
.on('click', 'a', function (event) {
update(mode);
event.preventDefault();
});
@ -88,18 +107,18 @@ modulejs.define('view/viewmode', ['_', '$', 'core/settings', 'core/resource', 'c
}
if (settings.sizes.length > 1) {
_.each(sizes.slice(0).reverse(), function (size) {
if (_.contains(settings.sizes, size)) {
$(sizeTemplate.replace(/\[SIZE\]/g, size))
.appendTo($navbar)
.on('click', 'a', function (event) {
update(null, size);
event.preventDefault();
});
}
});
max = settings.sizes.length-1;
$(sizeTemplate)
.prop('max', max).attr('max', max)
.on('input', function (event) {
update(null, settings.sizes[parseInt(event.target.value, 10)]);
})
.appendTo($viewBlock);
}
$viewBlock.appendTo($settings);
update();
event.sub('location.changed', adjustSpacing);