| 4113 |
efrain |
1 |
|
|
|
2 |
function initThemeChooser(settings) {
|
|
|
3 |
var isInitialized = false;
|
|
|
4 |
var $currentStylesheet = $();
|
|
|
5 |
var $loading = $('#loading');
|
|
|
6 |
var $systemSelect = $('#theme-system-selector select')
|
|
|
7 |
.on('change', function() {
|
|
|
8 |
setThemeSystem(this.value);
|
|
|
9 |
});
|
|
|
10 |
|
|
|
11 |
setThemeSystem($systemSelect.val());
|
|
|
12 |
|
|
|
13 |
|
|
|
14 |
function setThemeSystem(themeSystem) {
|
|
|
15 |
var $allSelectWraps = $('.selector[data-theme-system]').hide();
|
|
|
16 |
var $selectWrap = $allSelectWraps.filter('[data-theme-system="' + themeSystem +'"]').show();
|
|
|
17 |
var $select = $selectWrap.find('select')
|
|
|
18 |
.off('change') // avoid duplicate handlers :(
|
|
|
19 |
.on('change', function() {
|
|
|
20 |
setTheme(themeSystem, this.value);
|
|
|
21 |
});
|
|
|
22 |
|
|
|
23 |
setTheme(themeSystem, $select.val());
|
|
|
24 |
}
|
|
|
25 |
|
|
|
26 |
|
|
|
27 |
function setTheme(themeSystem, themeName) {
|
|
|
28 |
var stylesheetUrl = generateStylesheetUrl(themeSystem, themeName);
|
|
|
29 |
var $stylesheet;
|
|
|
30 |
|
|
|
31 |
function done() {
|
|
|
32 |
if (!isInitialized) {
|
|
|
33 |
isInitialized = true;
|
|
|
34 |
settings.init(themeSystem);
|
|
|
35 |
}
|
|
|
36 |
else {
|
|
|
37 |
settings.change(themeSystem);
|
|
|
38 |
}
|
|
|
39 |
|
|
|
40 |
showCredits(themeSystem, themeName);
|
|
|
41 |
}
|
|
|
42 |
|
|
|
43 |
if (stylesheetUrl) {
|
|
|
44 |
$stylesheet = $('<link rel="stylesheet" type="text/css" href="' + stylesheetUrl + '"/>').appendTo('head');
|
|
|
45 |
$loading.show();
|
|
|
46 |
|
|
|
47 |
whenStylesheetLoaded($stylesheet[0], function() {
|
|
|
48 |
$currentStylesheet.remove();
|
|
|
49 |
$currentStylesheet = $stylesheet;
|
|
|
50 |
$loading.hide();
|
|
|
51 |
done();
|
|
|
52 |
});
|
|
|
53 |
} else {
|
|
|
54 |
$currentStylesheet.remove();
|
|
|
55 |
$currentStylesheet = $();
|
|
|
56 |
done();
|
|
|
57 |
}
|
|
|
58 |
}
|
|
|
59 |
|
|
|
60 |
|
|
|
61 |
function generateStylesheetUrl(themeSystem, themeName) {
|
|
|
62 |
if (themeSystem === 'jquery-ui') {
|
|
|
63 |
return 'https://code.jquery.com/ui/1.12.1/themes/' + themeName + '/jquery-ui.css';
|
|
|
64 |
}
|
|
|
65 |
else if (themeSystem === 'bootstrap3') {
|
|
|
66 |
if (themeName) {
|
|
|
67 |
return 'https://bootswatch.com/3/' + themeName + '/bootstrap.min.css';
|
|
|
68 |
}
|
|
|
69 |
else { // the default bootstrap theme
|
|
|
70 |
return 'https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css';
|
|
|
71 |
}
|
|
|
72 |
}
|
|
|
73 |
else if (themeSystem === 'bootstrap4') {
|
|
|
74 |
if (themeName) {
|
|
|
75 |
return 'https://bootswatch.com/4/' + themeName + '/bootstrap.min.css';
|
|
|
76 |
}
|
|
|
77 |
else { // the default bootstrap4 theme
|
|
|
78 |
return 'https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css';
|
|
|
79 |
}
|
|
|
80 |
}
|
|
|
81 |
}
|
|
|
82 |
|
|
|
83 |
|
|
|
84 |
function showCredits(themeSystem, themeName) {
|
|
|
85 |
var creditId;
|
|
|
86 |
|
|
|
87 |
if (themeSystem === 'jquery-ui') {
|
|
|
88 |
creditId = 'jquery-ui';
|
|
|
89 |
}
|
|
|
90 |
else if (themeSystem === 'bootstrap3') {
|
|
|
91 |
if (themeName) {
|
|
|
92 |
creditId = 'bootstrap-custom';
|
|
|
93 |
}
|
|
|
94 |
else {
|
|
|
95 |
creditId = 'bootstrap-standard';
|
|
|
96 |
}
|
|
|
97 |
}
|
|
|
98 |
|
|
|
99 |
$('.credits').hide()
|
|
|
100 |
.filter('[data-credit-id="' + creditId + '"]').show();
|
|
|
101 |
}
|
|
|
102 |
|
|
|
103 |
|
|
|
104 |
function whenStylesheetLoaded(linkNode, callback) {
|
|
|
105 |
var isReady = false;
|
|
|
106 |
|
|
|
107 |
function ready() {
|
|
|
108 |
if (!isReady) { // avoid double-call
|
|
|
109 |
isReady = true;
|
|
|
110 |
callback();
|
|
|
111 |
}
|
|
|
112 |
}
|
|
|
113 |
|
|
|
114 |
linkNode.onload = ready; // does not work cross-browser
|
|
|
115 |
setTimeout(ready, 2000); // max wait. also handles browsers that don't support onload
|
|
|
116 |
}
|
|
|
117 |
}
|