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