PageRenderTime 33ms CodeModel.GetById 21ms RepoModel.GetById 0ms app.codeStats 0ms

/dist/js/custom.js

https://gitlab.com/yutdhidev_labs/webku
JavaScript | 202 lines | 138 code | 6 blank | 58 comment | 14 complexity | f00b5a566f39683695de1f68cddebf4e MD5 | raw file
  1. $(function () {
  2. "use strict";
  3. $(function () {
  4. $(".preloader").fadeOut();
  5. });
  6. jQuery(document).on('click', '.mega-dropdown', function (e) {
  7. e.stopPropagation()
  8. });
  9. // ==============================================================
  10. // This is for the top header part and sidebar part
  11. // ==============================================================
  12. var set = function () {
  13. var width = (window.innerWidth > 0) ? window.innerWidth : this.screen.width;
  14. var topOffset = 55;
  15. if (width < 1170) {
  16. $("body").addClass("mini-sidebar");
  17. $('.navbar-brand span').hide();
  18. $(".sidebartoggler i").addClass("ti-menu");
  19. }
  20. else {
  21. $("body").removeClass("mini-sidebar");
  22. $('.navbar-brand span').show();
  23. }
  24. var height = ((window.innerHeight > 0) ? window.innerHeight : this.screen.height) - 1;
  25. height = height - topOffset;
  26. if (height < 1) height = 1;
  27. if (height > topOffset) {
  28. $(".page-wrapper").css("min-height", (height) + "px");
  29. }
  30. };
  31. $(window).ready(set);
  32. $(window).on("resize", set);
  33. // ==============================================================
  34. // Theme options
  35. // ==============================================================
  36. $(".sidebartoggler").on('click', function () {
  37. if ($("body").hasClass("mini-sidebar")) {
  38. $("body").trigger("resize");
  39. $("body").removeClass("mini-sidebar");
  40. $('.navbar-brand span').show();
  41. }
  42. else {
  43. $("body").trigger("resize");
  44. $("body").addClass("mini-sidebar");
  45. $('.navbar-brand span').hide();
  46. }
  47. });
  48. // this is for close icon when navigation open in mobile view
  49. $(".nav-toggler").click(function () {
  50. $("body").toggleClass("show-sidebar");
  51. $(".nav-toggler i").toggleClass("ti-menu");
  52. $(".nav-toggler i").addClass("ti-close");
  53. });
  54. $(".search-box a, .search-box .app-search .srh-btn").on('click', function () {
  55. $(".app-search").toggle(200);
  56. });
  57. // ==============================================================
  58. // Right sidebar options
  59. // ==============================================================
  60. $(".right-side-toggle").click(function () {
  61. $(".right-sidebar").slideDown(50);
  62. $(".right-sidebar").toggleClass("shw-rside");
  63. });
  64. // ==============================================================
  65. // This is for the floating labels
  66. // ==============================================================
  67. $('.floating-labels .form-control').on('focus blur', function (e) {
  68. $(this).parents('.form-group').toggleClass('focused', (e.type === 'focus' || this.value.length > 0));
  69. }).trigger('blur');
  70. // ==============================================================
  71. //tooltip
  72. // ==============================================================
  73. $(function () {
  74. $('[data-toggle="tooltip"]').tooltip()
  75. })
  76. // ==============================================================
  77. //Popover
  78. // ==============================================================
  79. $(function () {
  80. $('[data-toggle="popover"]').popover()
  81. })
  82. // ==============================================================
  83. // Perfact scrollbar
  84. // ==============================================================
  85. $('.scroll-sidebar, .right-side-panel, .message-center, .right-sidebar').perfectScrollbar();
  86. $('#chat, #msg, #comment, #todo').perfectScrollbar();
  87. // ==============================================================
  88. // Resize all elements
  89. // ==============================================================
  90. $("body").trigger("resize");
  91. // ==============================================================
  92. // To do list
  93. // ==============================================================
  94. $(".list-task li label").click(function () {
  95. $(this).toggleClass("task-done");
  96. });
  97. // ==============================================================
  98. // Collapsable cards
  99. // ==============================================================
  100. $('a[data-action="collapse"]').on('click', function (e) {
  101. e.preventDefault();
  102. $(this).closest('.card').find('[data-action="collapse"] i').toggleClass('ti-minus ti-plus');
  103. $(this).closest('.card').children('.card-body').collapse('toggle');
  104. });
  105. // Toggle fullscreen
  106. $('a[data-action="expand"]').on('click', function (e) {
  107. e.preventDefault();
  108. $(this).closest('.card').find('[data-action="expand"] i').toggleClass('mdi-arrow-expand mdi-arrow-compress');
  109. $(this).closest('.card').toggleClass('card-fullscreen');
  110. });
  111. // Close Card
  112. $('a[data-action="close"]').on('click', function () {
  113. $(this).closest('.card').removeClass().slideUp('fast');
  114. });
  115. // ==============================================================
  116. // Color variation
  117. // ==============================================================
  118. var mySkins = [
  119. "skin-default",
  120. "skin-green",
  121. "skin-red",
  122. "skin-blue",
  123. "skin-purple",
  124. "skin-megna",
  125. "skin-default-dark",
  126. "skin-green-dark",
  127. "skin-red-dark",
  128. "skin-blue-dark",
  129. "skin-purple-dark",
  130. "skin-megna-dark"
  131. ]
  132. /**
  133. * Get a prestored setting
  134. *
  135. * @param String name Name of of the setting
  136. * @returns String The value of the setting | null
  137. */
  138. function get(name) {
  139. if (typeof (Storage) !== 'undefined') {
  140. return localStorage.getItem(name)
  141. }
  142. else {
  143. window.alert('Please use a modern browser to properly view this template!')
  144. }
  145. }
  146. /**
  147. * Store a new settings in the browser
  148. *
  149. * @param String name Name of the setting
  150. * @param String val Value of the setting
  151. * @returns void
  152. */
  153. function store(name, val) {
  154. if (typeof (Storage) !== 'undefined') {
  155. localStorage.setItem(name, val)
  156. }
  157. else {
  158. window.alert('Please use a modern browser to properly view this template!')
  159. }
  160. }
  161. /**
  162. * Replaces the old skin with the new skin
  163. * @param String cls the new skin class
  164. * @returns Boolean false to prevent link's default action
  165. */
  166. function changeSkin(cls) {
  167. $.each(mySkins, function (i) {
  168. $('body').removeClass(mySkins[i])
  169. })
  170. $('body').addClass(cls)
  171. store('skin', cls)
  172. return false
  173. }
  174. function setup() {
  175. var tmp = get('skin')
  176. if (tmp && $.inArray(tmp, mySkins)) changeSkin(tmp)
  177. // Add the change skin listener
  178. $('[data-skin]').on('click', function (e) {
  179. if ($(this).hasClass('knob')) return
  180. e.preventDefault()
  181. changeSkin($(this).data('skin'))
  182. })
  183. }
  184. setup()
  185. $("#themecolors").on("click", "a", function () {
  186. $("#themecolors li a").removeClass("working"),
  187. $(this).addClass("working")
  188. })
  189. // For Custom File Input
  190. $('.custom-file-input').on('change',function(){
  191. //get the file name
  192. var fileName = $(this).val();
  193. //replace the "Choose a file" label
  194. $(this).next('.custom-file-label').html(fileName);
  195. })
  196. });