demo-b97417bd701199e19db23ddc2ce043c26169396fbb0fef550d53fca19b868f9c.js 7.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180
  1. /**
  2. Demo script to handle the theme demo
  3. **/
  4. var Demo = function () {
  5. // Handle Theme Settings
  6. var handleTheme = function () {
  7. var panel = $('.theme-panel');
  8. if ($('.page-head > .container-fluid').size() === 1) {
  9. $('.theme-setting-layout', panel).val("fluid");
  10. } else {
  11. $('.theme-setting-layout', panel).val("boxed");
  12. }
  13. if ($('.top-menu li.dropdown.dropdown-dark').size() > 0) {
  14. $('.theme-setting-top-menu-style', panel).val("dark");
  15. } else {
  16. $('.theme-setting-top-menu-style', panel).val("light");
  17. }
  18. if ($('body').hasClass("page-header-top-fixed")) {
  19. $('.theme-setting-top-menu-mode', panel).val("fixed");
  20. } else {
  21. $('.theme-setting-top-menu-mode', panel).val("not-fixed");
  22. }
  23. if ($('.hor-menu.hor-menu-light').size() > 0) {
  24. $('.theme-setting-mega-menu-style', panel).val("light");
  25. } else {
  26. $('.theme-setting-mega-menu-style', panel).val("dark");
  27. }
  28. if ($('body').hasClass("page-header-menu-fixed")) {
  29. $('.theme-setting-mega-menu-mode', panel).val("fixed");
  30. } else {
  31. $('.theme-setting-mega-menu-mode', panel).val("not-fixed");
  32. }
  33. //handle theme layout
  34. var resetLayout = function () {
  35. $("body").
  36. removeClass("page-header-top-fixed").
  37. removeClass("page-header-menu-fixed");
  38. $('.page-header-top > .container-fluid').removeClass("container-fluid").addClass('container');
  39. $('.page-header-menu > .container-fluid').removeClass("container-fluid").addClass('container');
  40. $('.page-head > .container-fluid').removeClass("container-fluid").addClass('container');
  41. $('.page-content > .container-fluid').removeClass("container-fluid").addClass('container');
  42. $('.page-prefooter > .container-fluid').removeClass("container-fluid").addClass('container');
  43. $('.page-footer > .container-fluid').removeClass("container-fluid").addClass('container');
  44. };
  45. var setLayout = function () {
  46. var layoutMode = $('.theme-setting-layout', panel).val();
  47. var headerTopMenuStyle = $('.theme-setting-top-menu-style', panel).val();
  48. var headerTopMenuMode = $('.theme-setting-top-menu-mode', panel).val();
  49. var headerMegaMenuStyle = $('.theme-setting-mega-menu-style', panel).val();
  50. var headerMegaMenuMode = $('.theme-setting-mega-menu-mode', panel).val();
  51. resetLayout(); // reset layout to default state
  52. if (layoutMode === "fluid") {
  53. $('.page-header-top > .container').removeClass("container").addClass('container-fluid');
  54. $('.page-header-menu > .container').removeClass("container").addClass('container-fluid');
  55. $('.page-head > .container').removeClass("container").addClass('container-fluid');
  56. $('.page-content > .container').removeClass("container").addClass('container-fluid');
  57. $('.page-prefooter > .container').removeClass("container").addClass('container-fluid');
  58. $('.page-footer > .container').removeClass("container").addClass('container-fluid');
  59. //App.runResizeHandlers();
  60. }
  61. if (headerTopMenuStyle === 'dark') {
  62. $(".top-menu > .navbar-nav > li.dropdown").addClass("dropdown-dark");
  63. } else {
  64. $(".top-menu > .navbar-nav > li.dropdown").removeClass("dropdown-dark");
  65. }
  66. if (headerTopMenuMode === 'fixed') {
  67. $("body").addClass("page-header-top-fixed");
  68. } else {
  69. $("body").removeClass("page-header-top-fixed");
  70. }
  71. if (headerMegaMenuStyle === 'light') {
  72. $(".hor-menu").addClass("hor-menu-light");
  73. } else {
  74. $(".hor-menu").removeClass("hor-menu-light");
  75. }
  76. if (headerMegaMenuMode === 'fixed') {
  77. $("body").addClass("page-header-menu-fixed");
  78. } else {
  79. $("body").removeClass("page-header-menu-fixed");
  80. }
  81. };
  82. // handle theme colors
  83. var setColor = function (color) {
  84. var color_ = (App.isRTL() ? color + '-rtl' : color);
  85. $('#style_color').attr("href", Layout.getLayoutCssPath() + 'themes/' + color_ + ".min.css");
  86. $('.page-logo img').attr("src", Layout.getLayoutImgPath() + 'logo-' + color + '.png');
  87. };
  88. $('.theme-colors > li', panel).click(function () {
  89. var color = $(this).attr("data-theme");
  90. setColor(color);
  91. $('.theme-colors > li', panel).removeClass("active");
  92. $(this).addClass("active");
  93. });
  94. $('.theme-setting-top-menu-mode', panel).change(function(){
  95. var headerTopMenuMode = $('.theme-setting-top-menu-mode', panel).val();
  96. var headerMegaMenuMode = $('.theme-setting-mega-menu-mode', panel).val();
  97. if (headerMegaMenuMode === "fixed") {
  98. alert("The top menu and mega menu can not be fixed at the same time.");
  99. $('.theme-setting-mega-menu-mode', panel).val("not-fixed");
  100. headerTopMenuMode = 'not-fixed';
  101. }
  102. });
  103. $('.theme-setting-mega-menu-mode', panel).change(function(){
  104. var headerTopMenuMode = $('.theme-setting-top-menu-mode', panel).val();
  105. var headerMegaMenuMode = $('.theme-setting-mega-menu-mode', panel).val();
  106. if (headerTopMenuMode === "fixed") {
  107. alert("The top menu and mega menu can not be fixed at the same time.");
  108. $('.theme-setting-top-menu-mode', panel).val("not-fixed");
  109. headerTopMenuMode = 'not-fixed';
  110. }
  111. });
  112. $('.theme-setting', panel).change(setLayout);
  113. };
  114. // handle theme style
  115. var setThemeStyle = function(style) {
  116. var file = (style === 'rounded' ? 'components-rounded' : 'components');
  117. file = (App.isRTL() ? file + '-rtl' : file);
  118. $('#style_components').attr("href", App.getGlobalCssPath() + file + ".min.css");
  119. if (typeof Cookies !== "undefined") {
  120. Cookies.set('layout-style-option', style);
  121. }
  122. };
  123. return {
  124. //main function to initiate the theme
  125. init: function() {
  126. // handles style customer tool
  127. handleTheme();
  128. // handle layout style change
  129. $('.theme-panel .theme-setting-style').change(function() {
  130. setThemeStyle($(this).val());
  131. });
  132. // set layout style from cookie
  133. if (typeof Cookies !== "undefined" && Cookies.get('layout-style-option') === 'rounded') {
  134. setThemeStyle(Cookies.get('layout-style-option'));
  135. $('.theme-panel .layout-style-option').val(Cookies.get('layout-style-option'));
  136. }
  137. }
  138. };
  139. }();
  140. if (App.isAngularJsApp() === false) {
  141. jQuery(document).ready(function() {
  142. Demo.init();
  143. });
  144. }