app.min.js 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335
  1. /*
  2. Template Name: Skote - Admin & Dashboard Template
  3. Author: Themesbrand
  4. Version: 4.0.0.
  5. Website: https://themesbrand.com/
  6. Contact: themesbrand@gmail.com
  7. File: Main Js File
  8. */
  9. (function ($) {
  10. 'use strict';
  11. var language = localStorage.getItem('language');
  12. // Default Language
  13. var default_lang = 'en';
  14. function setLanguage(lang) {
  15. if (document.getElementById("header-lang-img")) {
  16. if (lang == 'en') {
  17. document.getElementById("header-lang-img").src = "assets/images/flags/us.jpg";
  18. } else if (lang == 'sp') {
  19. document.getElementById("header-lang-img").src = "assets/images/flags/spain.jpg";
  20. }
  21. else if (lang == 'gr') {
  22. document.getElementById("header-lang-img").src = "assets/images/flags/germany.jpg";
  23. }
  24. else if (lang == 'it') {
  25. document.getElementById("header-lang-img").src = "assets/images/flags/italy.jpg";
  26. }
  27. else if (lang == 'ru') {
  28. document.getElementById("header-lang-img").src = "assets/images/flags/russia.jpg";
  29. }
  30. localStorage.setItem('language', lang);
  31. language = localStorage.getItem('language');
  32. getLanguage();
  33. }
  34. }
  35. // Multi language setting
  36. function getLanguage() {
  37. (language == null) ? setLanguage(default_lang) : false;
  38. $.getJSON('assets/lang/' + language + '.json', function (lang) {
  39. $('html').attr('lang', language);
  40. $.each(lang, function (index, val) {
  41. (index === 'head') ? $(document).attr("title", val['title']) : false;
  42. $("[key='" + index + "']").text(val);
  43. });
  44. });
  45. }
  46. function initMetisMenu() {
  47. //metis menu
  48. $("#side-menu").metisMenu();
  49. }
  50. function initLeftMenuCollapse() {
  51. $('#vertical-menu-btn').on('click', function (event) {
  52. event.preventDefault();
  53. $('body').toggleClass('sidebar-enable');
  54. if ($(window).width() >= 992) {
  55. $('body').toggleClass('vertical-collpsed');
  56. } else {
  57. $('body').removeClass('vertical-collpsed');
  58. }
  59. });
  60. }
  61. function initActiveMenu() {
  62. // === following js will activate the menu in left side bar based on url ====
  63. $("#sidebar-menu a").each(function () {
  64. var pageUrl = window.location.href.split(/[?#]/)[0];
  65. if (this.href == pageUrl) {
  66. $(this).addClass("active");
  67. $(this).parent().addClass("mm-active"); // add active to li of the current link
  68. $(this).parent().parent().addClass("mm-show");
  69. $(this).parent().parent().prev().addClass("mm-active"); // add active class to an anchor
  70. $(this).parent().parent().parent().addClass("mm-active");
  71. $(this).parent().parent().parent().parent().addClass("mm-show"); // add active to li of the current link
  72. $(this).parent().parent().parent().parent().parent().addClass("mm-active");
  73. }
  74. });
  75. }
  76. function initMenuItemScroll() {
  77. // focus active menu in left sidebar
  78. $(document).ready(function () {
  79. if ($("#sidebar-menu").length > 0 && $("#sidebar-menu .mm-active .active").length > 0) {
  80. var activeMenu = $("#sidebar-menu .mm-active .active").offset().top;
  81. if (activeMenu > 300) {
  82. activeMenu = activeMenu - 300;
  83. $(".vertical-menu .simplebar-content-wrapper").animate({ scrollTop: activeMenu }, "slow");
  84. }
  85. }
  86. });
  87. }
  88. function initHoriMenuActive() {
  89. $(".navbar-nav a").each(function () {
  90. var pageUrl = window.location.href.split(/[?#]/)[0];
  91. if (this.href == pageUrl) {
  92. $(this).addClass("active");
  93. $(this).parent().addClass("active");
  94. $(this).parent().parent().addClass("active");
  95. $(this).parent().parent().parent().addClass("active");
  96. $(this).parent().parent().parent().parent().addClass("active");
  97. $(this).parent().parent().parent().parent().parent().addClass("active");
  98. $(this).parent().parent().parent().parent().parent().parent().addClass("active");
  99. }
  100. });
  101. }
  102. function initFullScreen() {
  103. $('[data-bs-toggle="fullscreen"]').on("click", function (e) {
  104. e.preventDefault();
  105. $('body').toggleClass('fullscreen-enable');
  106. if (!document.fullscreenElement && /* alternative standard method */ !document.mozFullScreenElement && !document.webkitFullscreenElement) { // current working methods
  107. if (document.documentElement.requestFullscreen) {
  108. document.documentElement.requestFullscreen();
  109. } else if (document.documentElement.mozRequestFullScreen) {
  110. document.documentElement.mozRequestFullScreen();
  111. } else if (document.documentElement.webkitRequestFullscreen) {
  112. document.documentElement.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
  113. }
  114. } else {
  115. if (document.cancelFullScreen) {
  116. document.cancelFullScreen();
  117. } else if (document.mozCancelFullScreen) {
  118. document.mozCancelFullScreen();
  119. } else if (document.webkitCancelFullScreen) {
  120. document.webkitCancelFullScreen();
  121. }
  122. }
  123. });
  124. document.addEventListener('fullscreenchange', exitHandler);
  125. document.addEventListener("webkitfullscreenchange", exitHandler);
  126. document.addEventListener("mozfullscreenchange", exitHandler);
  127. function exitHandler() {
  128. if (!document.webkitIsFullScreen && !document.mozFullScreen && !document.msFullscreenElement) {
  129. console.log('pressed');
  130. $('body').removeClass('fullscreen-enable');
  131. }
  132. }
  133. }
  134. function initRightSidebar() {
  135. // right side-bar toggle
  136. $('.right-bar-toggle').on('click', function (e) {
  137. $('body').toggleClass('right-bar-enabled');
  138. });
  139. $(document).on('click', 'body', function (e) {
  140. if ($(e.target).closest('.right-bar-toggle, .right-bar').length > 0) {
  141. return;
  142. }
  143. $('body').removeClass('right-bar-enabled');
  144. return;
  145. });
  146. }
  147. function initDropdownMenu() {
  148. if (document.getElementById("topnav-menu-content")) {
  149. var elements = document.getElementById("topnav-menu-content").getElementsByTagName("a");
  150. for (var i = 0, len = elements.length; i < len; i++) {
  151. elements[i].onclick = function (elem) {
  152. if (elem.target.getAttribute("href") === "#") {
  153. elem.target.parentElement.classList.toggle("active");
  154. elem.target.nextElementSibling.classList.toggle("show");
  155. }
  156. }
  157. }
  158. window.addEventListener("resize", updateMenu);
  159. }
  160. }
  161. function updateMenu() {
  162. var elements = document.getElementById("topnav-menu-content").getElementsByTagName("a");
  163. for (var i = 0, len = elements.length; i < len; i++) {
  164. if (elements[i].parentElement.getAttribute("class") === "nav-item dropdown active") {
  165. elements[i].parentElement.classList.remove("active");
  166. if (elements[i].nextElementSibling !== null) {
  167. elements[i].nextElementSibling.classList.remove("show");
  168. }
  169. }
  170. }
  171. }
  172. function initComponents() {
  173. var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'))
  174. var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
  175. return new bootstrap.Tooltip(tooltipTriggerEl)
  176. });
  177. var popoverTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="popover"]'))
  178. var popoverList = popoverTriggerList.map(function (popoverTriggerEl) {
  179. return new bootstrap.Popover(popoverTriggerEl)
  180. });
  181. var offcanvasElementList = [].slice.call(document.querySelectorAll('.offcanvas'))
  182. var offcanvasList = offcanvasElementList.map(function (offcanvasEl) {
  183. return new bootstrap.Offcanvas(offcanvasEl)
  184. })
  185. }
  186. function initPreloader() {
  187. $(window).on('load', function () {
  188. $('#status').fadeOut();
  189. $('#preloader').delay(350).fadeOut('slow');
  190. });
  191. }
  192. function initSettings() {
  193. if (window.sessionStorage) {
  194. var alreadyVisited = sessionStorage.getItem("is_visited");
  195. if (!alreadyVisited) {
  196. if ($('html').attr('dir') === 'rtl' && $('body').attr('data-layout-mode') === 'dark') {
  197. $("#dark-rtl-mode-switch").prop('checked', true);
  198. $("#light-mode-switch").prop('checked', false);
  199. sessionStorage.setItem("is_visited", "dark-rtl-mode-switch");
  200. updateThemeSetting(alreadyVisited);
  201. }else if ($('html').attr('dir') === 'rtl') {
  202. $("#rtl-mode-switch").prop('checked', true);
  203. $("#light-mode-switch").prop('checked', false);
  204. sessionStorage.setItem("is_visited", "rtl-mode-switch");
  205. updateThemeSetting(alreadyVisited);
  206. }else if ($('body').attr('data-layout-mode') === 'dark') {
  207. $("#dark-mode-switch").prop('checked', true);
  208. $("#light-mode-switch").prop('checked', false);
  209. sessionStorage.setItem("is_visited", "dark-mode-switch");
  210. updateThemeSetting(alreadyVisited);
  211. } else {
  212. sessionStorage.setItem("is_visited", "light-mode-switch");
  213. }
  214. } else {
  215. $(".right-bar input:checkbox").prop('checked', false);
  216. $("#" + alreadyVisited).prop('checked', true);
  217. updateThemeSetting(alreadyVisited);
  218. }
  219. }
  220. $("#light-mode-switch, #dark-mode-switch, #rtl-mode-switch, #dark-rtl-mode-switch").on("change", function (e) {
  221. updateThemeSetting(e.target.id);
  222. });
  223. // show password input value
  224. $("#password-addon").on('click', function () {
  225. if ($(this).siblings('input').length > 0) {
  226. $(this).siblings('input').attr('type') == "password" ? $(this).siblings('input').attr('type', 'input') : $(this).siblings('input').attr('type', 'password');
  227. }
  228. })
  229. }
  230. function updateThemeSetting(id) {
  231. if ($("#light-mode-switch").prop("checked") == true && id === "light-mode-switch") {
  232. $("html").removeAttr("dir");
  233. $("#dark-mode-switch").prop("checked", false);
  234. $("#rtl-mode-switch").prop("checked", false);
  235. $("#dark-rtl-mode-switch").prop("checked", false);
  236. $("#bootstrap-style").attr('href', '/assets/css/bootstrap.min.css');
  237. $('body').attr('data-layout-mode', 'light');
  238. $("#app-style").attr('href', '/assets/css/app.min.css');
  239. sessionStorage.setItem("is_visited", "light-mode-switch");
  240. } else if ($("#dark-mode-switch").prop("checked") == true && id === "dark-mode-switch") {
  241. $("html").removeAttr("dir");
  242. $("#light-mode-switch").prop("checked", false);
  243. $("#rtl-mode-switch").prop("checked", false);
  244. $("#dark-rtl-mode-switch").prop("checked", false);
  245. $('body').attr('data-layout-mode', 'dark');
  246. sessionStorage.setItem("is_visited", "dark-mode-switch");
  247. } else if ($("#rtl-mode-switch").prop("checked") == true && id === "rtl-mode-switch") {
  248. $("#light-mode-switch").prop("checked", false);
  249. $("#dark-mode-switch").prop("checked", false);
  250. $("#dark-rtl-mode-switch").prop("checked", false);
  251. $("#bootstrap-style").attr('href', 'assets/css/bootstrap-rtl.min.css');
  252. $("#app-style").attr('href', '/assets/css/app-rtl.min.css');
  253. $("html").attr("dir", 'rtl');
  254. $('body').attr('data-layout-mode', 'light');
  255. sessionStorage.setItem("is_visited", "rtl-mode-switch");
  256. }
  257. else if ($("#dark-rtl-mode-switch").prop("checked") == true && id === "dark-rtl-mode-switch") {
  258. $("#light-mode-switch").prop("checked", false);
  259. $("#rtl-mode-switch").prop("checked", false);
  260. $("#dark-mode-switch").prop("checked", false);
  261. $("#bootstrap-style").attr('href', '/assets/css/bootstrap-rtl.min.css');
  262. $("#app-style").attr('href', '/assets/css/app-rtl.min.css');
  263. $("html").attr("dir", 'rtl');
  264. $('body').attr('data-layout-mode', 'dark');
  265. sessionStorage.setItem("is_visited", "dark-rtl-mode-switch");
  266. }
  267. }
  268. function initLanguage() {
  269. // Auto Loader
  270. if (language != null && language !== default_lang)
  271. setLanguage(language);
  272. $('.language').on('click', function (e) {
  273. setLanguage($(this).attr('data-lang'));
  274. });
  275. }
  276. function initCheckAll() {
  277. $('#checkAll').on('change', function () {
  278. $('.table-check .form-check-input').prop('checked', $(this).prop("checked"));
  279. });
  280. $('.table-check .form-check-input').change(function () {
  281. if ($('.table-check .form-check-input:checked').length == $('.table-check .form-check-input').length) {
  282. $('#checkAll').prop('checked', true);
  283. } else {
  284. $('#checkAll').prop('checked', false);
  285. }
  286. });
  287. }
  288. function init() {
  289. initMetisMenu();
  290. initLeftMenuCollapse();
  291. initActiveMenu();
  292. initMenuItemScroll();
  293. initHoriMenuActive();
  294. initFullScreen();
  295. initRightSidebar();
  296. initDropdownMenu();
  297. initComponents();
  298. initSettings();
  299. initLanguage();
  300. initPreloader();
  301. Waves.init();
  302. initCheckAll();
  303. }
  304. init();
  305. })(jQuery)