aboutsummaryrefslogtreecommitdiffstats
path: root/library/fullcalendar/examples/js/theme-chooser.js
diff options
context:
space:
mode:
Diffstat (limited to 'library/fullcalendar/examples/js/theme-chooser.js')
-rw-r--r--library/fullcalendar/examples/js/theme-chooser.js141
1 files changed, 141 insertions, 0 deletions
diff --git a/library/fullcalendar/examples/js/theme-chooser.js b/library/fullcalendar/examples/js/theme-chooser.js
new file mode 100644
index 000000000..92a7c4753
--- /dev/null
+++ b/library/fullcalendar/examples/js/theme-chooser.js
@@ -0,0 +1,141 @@
+
+function initThemeChooser(settings) {
+ var isInitialized = false;
+ var currentThemeSystem; // don't set this directly. use setThemeSystem
+ var currentStylesheetEl;
+ var loadingEl = document.getElementById('loading');
+ var systemSelectEl = document.querySelector('#theme-system-selector select');
+ var themeSelectWrapEls = Array.prototype.slice.call( // convert to real array
+ document.querySelectorAll('.selector[data-theme-system]')
+ );
+
+ systemSelectEl.addEventListener('change', function() {
+ setThemeSystem(this.value);
+ });
+
+ setThemeSystem(systemSelectEl.value);
+
+ themeSelectWrapEls.forEach(function(themeSelectWrapEl) {
+ var themeSelectEl = themeSelectWrapEl.querySelector('select');
+
+ themeSelectWrapEl.addEventListener('change', function() {
+ setTheme(
+ currentThemeSystem,
+ themeSelectEl.options[themeSelectEl.selectedIndex].value
+ );
+ });
+ });
+
+
+ function setThemeSystem(themeSystem) {
+ var selectedTheme;
+
+ currentThemeSystem = themeSystem;
+
+ themeSelectWrapEls.forEach(function(themeSelectWrapEl) {
+ var themeSelectEl = themeSelectWrapEl.querySelector('select');
+
+ if (themeSelectWrapEl.getAttribute('data-theme-system') === themeSystem) {
+ selectedTheme = themeSelectEl.options[themeSelectEl.selectedIndex].value;
+ themeSelectWrapEl.style.display = 'inline-block';
+ } else {
+ themeSelectWrapEl.style.display = 'none';
+ }
+ });
+
+ setTheme(themeSystem, selectedTheme);
+ }
+
+
+ function setTheme(themeSystem, themeName) {
+ var stylesheetUrl = generateStylesheetUrl(themeSystem, themeName);
+ var stylesheetEl;
+
+ function done() {
+ if (!isInitialized) {
+ isInitialized = true;
+ settings.init(themeSystem);
+ }
+ else {
+ settings.change(themeSystem);
+ }
+
+ showCredits(themeSystem, themeName);
+ }
+
+ if (stylesheetUrl) {
+ stylesheetEl = document.createElement('link');
+ stylesheetEl.setAttribute('rel', 'stylesheet');
+ stylesheetEl.setAttribute('href', stylesheetUrl);
+ document.querySelector('head').appendChild(stylesheetEl);
+
+ loadingEl.style.display = 'inline';
+
+ whenStylesheetLoaded(stylesheetEl, function() {
+ if (currentStylesheetEl) {
+ currentStylesheetEl.parentNode.removeChild(currentStylesheetEl);
+ }
+ currentStylesheetEl = stylesheetEl;
+ loadingEl.style.display = 'none';
+ done();
+ });
+ } else {
+ if (currentStylesheetEl) {
+ currentStylesheetEl.parentNode.removeChild(currentStylesheetEl);
+ currentStylesheetEl = null
+ }
+ done();
+ }
+ }
+
+
+ function generateStylesheetUrl(themeSystem, themeName) {
+ if (themeSystem === 'bootstrap') {
+ if (themeName) {
+ return 'https://bootswatch.com/4/' + themeName + '/bootstrap.min.css';
+ }
+ else { // the default bootstrap theme
+ return 'https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css';
+ }
+ }
+ }
+
+
+ function showCredits(themeSystem, themeName) {
+ var creditId;
+
+ if (themeSystem.match('bootstrap')) {
+ if (themeName) {
+ creditId = 'bootstrap-custom';
+ }
+ else {
+ creditId = 'bootstrap-standard';
+ }
+ }
+
+ Array.prototype.slice.call( // convert to real array
+ document.querySelectorAll('.credits')
+ ).forEach(function(creditEl) {
+ if (creditEl.getAttribute('data-credit-id') === creditId) {
+ creditEl.style.display = 'block';
+ } else {
+ creditEl.style.display = 'none';
+ }
+ })
+ }
+
+
+ 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
+ }
+}