Skip to content

Commit

Permalink
[js:core] fix Studio-42#2720 implementation of theme changer
Browse files Browse the repository at this point in the history
  • Loading branch information
nao-pon committed Oct 19, 2018
1 parent 11a2023 commit 1cfe57d
Show file tree
Hide file tree
Showing 8 changed files with 348 additions and 41 deletions.
46 changes: 46 additions & 0 deletions css/commands.css
Original file line number Diff line number Diff line change
Expand Up @@ -760,6 +760,52 @@ ul.elfinder-help-integrations a:hover {
margin: 0 -10px;
}

.elfinder-preference .elfinder-preference-taball .elfinder-reference-hide-taball {
display: none;
}

.elfinder-preference-theme fieldset {
margin-bottom: 10px;
}

.elfinder-preference-theme legend a {
font-size: 1.8em;
text-decoration: none;
cursor: pointer;
}

.elfinder-preference-theme dt {
width: 20%;
word-break: break-all;
}

.elfinder-preference-theme dt:after {
content: " :";
}

.elfinder-preference-theme dd {
margin-inline-start: 20%;
}

.elfinder-preference img.elfinder-preference-theme-image {
display: block;
margin-left: auto;
margin-right: auto;
max-width: 90%;
max-height: 200px;
cursor: pointer;
}

.elfinder-preference-theme-btn {
text-align: center;
}

.elfinder-preference-theme button.elfinder-preference-theme-default {
display: inline;
margin: 0 10px;
font-size: 8pt;
}

/********************** COMMAND "INFO" ****************************/
.elfinder-rtl .elfinder-info-title .elfinder-cwd-icon:before {
right: 33px;
Expand Down
15 changes: 14 additions & 1 deletion js/commands/help.js
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,16 @@
sep = '<div class="elfinder-help-separator"/>',
selfUrl = $('base').length? document.location.href.replace(/#.*$/, '') : '',


getTheme = function() {
var src;
if (fm.theme && fm.theme.author) {
src = atpl[r]('elfinder-help-team', 'elfinder-help-team elfinder-help-term-theme')[r](author, fm.i18n(fm.theme.author) + (fm.theme.email? ' &lt;'+fm.theme.email+'&gt;' : ''))[r](work, fm.i18n('theme') + ' ('+fm.i18n(fm.theme.name)+')');
} else {
src = '<div class="elfinder-help-team elfinder-help-term-theme" style="display:none"></div>';
}
return src;
},

about = function() {
html.push('<div id="'+fm.namespace+'-help-about" class="ui-tabs-panel ui-widget-content ui-corner-bottom"><div class="elfinder-help-logo"/>');
html.push('<h3>elFinder</h3>');
Expand Down Expand Up @@ -57,6 +66,8 @@
});
}

html.push(getTheme());

html.push(sep);
html.push('<div class="'+lic+'">'+fm.i18n('icons')+': Pixelmixer, <a href="http://p.yusukekamiyamane.com" target="_blank">Fugue</a>, <a href="https://icons8.com" target="_blank">Icons8</a></div>');

Expand Down Expand Up @@ -285,6 +296,8 @@
}
}
}
}).bind('themechange', function() {
content.find('div.elfinder-help-term-theme').replaceWith(getTheme());
});
}

Expand Down
74 changes: 71 additions & 3 deletions js/commands/preference.js
Original file line number Diff line number Diff line change
Expand Up @@ -21,14 +21,15 @@ elFinder.prototype.commands.preference = function() {
build = function() {
var cats = self.options.categories || {
'language' : ['language'],
'theme' : ['theme'],
'toolbar' : ['toolbarPref'],
'workspace' : ['iconSize','columnPref', 'selectAction', 'makefileTypes', 'useStoredEditor', 'editorMaximized', 'showHidden'],
'dialog' : ['autoFocusDialog'],
'selectionInfo' : ['infoItems', 'hashChecker'],
'reset' : ['clearBrowserData'],
'all' : true
},
forms = self.options.prefs || ['language', 'toolbarPref', 'iconSize', 'columnPref', 'selectAction', 'makefileTypes', 'useStoredEditor', 'editorMaximized', 'showHidden', 'infoItems', 'hashChecker', 'autoFocusDialog', 'clearBrowserData'];
forms = self.options.prefs || ['language', 'theme', 'toolbarPref', 'iconSize', 'columnPref', 'selectAction', 'makefileTypes', 'useStoredEditor', 'editorMaximized', 'showHidden', 'infoItems', 'hashChecker', 'autoFocusDialog', 'clearBrowserData'];

forms = fm.arrayFlip(forms, true);

Expand Down Expand Up @@ -87,6 +88,73 @@ elFinder.prototype.commands.preference = function() {
return langSel.append(optTags.join('')).val(fm.lang);
})());

forms.theme && (forms.theme = (function() {
if (!fm.options.themes || !Object.keys(fm.options.themes).length) {
return null;
}
var themeSel = $('<select/>').on('change', function() {
var theme = $(this).val();
fm.changeTheme(theme).storage('theme', theme);
}),
optTags = [],
tpl = {
image: '<img class="elfinder-preference-theme elfinder-preference-theme-image" src="$2" />',
link: '<a href="$1" target="_blank" title="$3">$2</a>',
data: '<dt>$1</dt><dd><span class="elfinder-preference-theme elfinder-preference-theme-$0">$2</span></dd>'
},
items = ['image', 'description', 'author', 'email', 'license'],
render = function(key, data) {
},
defBtn = $('<button class="ui-button ui-corner-all ui-widget elfinder-preference-theme-default"/>').text(fm.i18n('default')).on('click', function(e) {
themeSel.val('default').trigger('change');
}),
list = $('<div class="elfinder-reference-hide-taball"/>').on('click', 'button', function() {
var val = $(this).data('themeid')
themeSel.val(val).trigger('change');
});

themeSel.append('<option value="default">'+fm.i18n('default')+'</option>');
$.each(fm.options.themes, function(id, val) {
var opt = $('<option class="elfinder-theme-option-'+id+'" value="'+id+'">'+fm.i18n(id)+'</option>'),
dsc = $('<fieldset class="ui-widget ui-widget-content ui-corner-all elfinder-theme-list-'+id+'"><legend>'+fm.i18n(id)+'</legend><div><span class="elfinder-spinner"/></div></fieldset>'),
tm;
themeSel.append(opt);
list.append(dsc);
tm = setTimeout(function() {
dsc.find('span.elfinder-spinner').replaceWith(fm.i18n(['errRead', id]));
}, 10000);
fm.getTheme(id).always(function() {
tm && clearTimeout(tm);
}).done(function(data) {
var link, val = $(), dl = $('<dl/>');
link = data.link? tpl.link.replace(/\$1/g, data.link).replace(/\$3/g, fm.i18n('website')) : '$2';
if (data.name) {
opt.html(fm.i18n(data.name));
}
dsc.children('legend').html(link.replace(/\$2/g, fm.i18n(data.name) || id));
$.each(items, function(i, key) {
var t = tpl[key] || tpl.data,
elm;
if (data[key]) {
elm = t.replace(/\$0/g, fm.escape(key)).replace(/\$1/g, fm.i18n(key)).replace(/\$2/g, fm.i18n(data[key]));
if (key === 'image' && data.link) {
elm = $(elm).on('click', function() {
themeSel.val(id).trigger('change');
}).attr('title', fm.i18n('select'));
}
dl.append(elm);
}
});
val = val.add(dl);
val = val.add($('<div class="elfinder-preference-theme-btn"/>').append($('<button class="ui-button ui-corner-all ui-widget"/>').data('themeid', id).html(fm.i18n('select'))));
dsc.find('span.elfinder-spinner').replaceWith(val);
}).fail(function() {
dsc.find('span.elfinder-spinner').replaceWith(fm.i18n(['errRead', id]));
});
});
return $('<div/>').append(themeSel.val(fm.theme && fm.theme.id? fm.theme.id : 'default'), defBtn, list);
})());

forms.toolbarPref && (forms.toolbarPref = (function() {
var pnls = $.map(fm.options.uiOptions.toolbar, function(v) {
return $.isArray(v)? v : null;
Expand Down Expand Up @@ -440,9 +508,9 @@ elFinder.prototype.commands.preference = function() {
t.removeClass('ui-state-hover').parent().addClass('ui-tabs-selected ui-state-active');

if (h.match(/all$/)) {
tabs.children().show();
tabs.addClass('elfinder-preference-taball').children().show();
} else {
tabs.children().hide();
tabs.removeClass('elfinder-preference-taball').children().hide();
$(h).show();
}
});
Expand Down
Loading

0 comments on commit 1cfe57d

Please sign in to comment.