charisma.js 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439
  1. $(document).ready(function () {
  2. //themes, change CSS with JS
  3. //default theme(CSS) is cerulean, change it if needed
  4. var defaultTheme = 'cerulean';
  5. var currentTheme = $.cookie('currentTheme') == null ? defaultTheme : $.cookie('currentTheme');
  6. var msie = navigator.userAgent.match(/msie/i);
  7. $.browser = {};
  8. $.browser.msie = {};
  9. switchTheme(currentTheme);
  10. $('.navbar-toggle').click(function (e) {
  11. e.preventDefault();
  12. $('.nav-sm').html($('.navbar-collapse').html());
  13. $('.sidebar-nav').toggleClass('active');
  14. $(this).toggleClass('active');
  15. });
  16. var $sidebarNav = $('.sidebar-nav');
  17. // Hide responsive navbar on clicking outside
  18. $(document).mouseup(function (e) {
  19. if (!$sidebarNav.is(e.target) // if the target of the click isn't the container...
  20. && $sidebarNav.has(e.target).length === 0
  21. && !$('.navbar-toggle').is(e.target)
  22. && $('.navbar-toggle').has(e.target).length === 0
  23. && $sidebarNav.hasClass('active')
  24. )// ... nor a descendant of the container
  25. {
  26. e.stopPropagation();
  27. $('.navbar-toggle').click();
  28. }
  29. });
  30. $('#themes a').click(function (e) {
  31. e.preventDefault();
  32. currentTheme = $(this).attr('data-value');
  33. $.cookie('currentTheme', currentTheme, {expires: 365});
  34. switchTheme(currentTheme);
  35. });
  36. function switchTheme(themeName) {
  37. if (themeName == 'classic') {
  38. $('#bs-css').attr('href', 'bower_components/bootstrap/dist/css/bootstrap.min.css');
  39. } else {
  40. $('#bs-css').attr('href', 'css/bootstrap-' + themeName + '.min.css');
  41. }
  42. $('#themes i').removeClass('glyphicon glyphicon-ok whitespace').addClass('whitespace');
  43. $('#themes a[data-value=' + themeName + ']').find('i').removeClass('whitespace').addClass('glyphicon glyphicon-ok');
  44. }
  45. //ajax menu checkbox
  46. var isAjaxObj = $('#is-ajax');
  47. isAjaxObj.click(function (e) {
  48. $.cookie('is-ajax', $(this).prop('checked'), {expires: 365});
  49. });
  50. isAjaxObj.prop('checked', $.cookie('is-ajax') === 'true' ? true : false);
  51. //disbaling some functions for Internet Explorer
  52. if (msie) {
  53. isAjaxObj.prop('checked', false);
  54. $('#for-is-ajax').hide();
  55. $('#toggle-fullscreen').hide();
  56. $('.login-box').find('.input-large').removeClass('span10');
  57. }
  58. //highlight current / active link
  59. $('ul.main-menu li a').each(function () {
  60. if ($($(this))[0].href == String(window.location))
  61. $(this).parent().addClass('active');
  62. });
  63. //establish history variables
  64. var
  65. History = window.History, // Note: We are using a capital H instead of a lower h
  66. State = History.getState(),
  67. $log = $('#log');
  68. //bind to State Change
  69. History.Adapter.bind(window, 'statechange', function () { // Note: We are using statechange instead of popstate
  70. var State = History.getState(); // Note: We are using History.getState() instead of event.state
  71. $.ajax({
  72. url: State.url,
  73. success: function (msg) {
  74. $('#content').html($(msg).find('#content').html());
  75. $('#loading').remove();
  76. $('#content').fadeIn();
  77. var newTitle = $(msg).filter('title').text();
  78. $('title').text(newTitle);
  79. docReady();
  80. }
  81. });
  82. });
  83. //ajaxify menus
  84. $('a.ajax-link').click(function (e) {
  85. if (msie) e.which = 1;
  86. var isChecked = isAjaxObj.prop('checked');
  87. var isActive = $(this).parent().hasClass('active');
  88. if (e.which != 1 || !isChecked || isActive) return;
  89. e.preventDefault();
  90. $('.sidebar-nav').removeClass('active');
  91. $('.navbar-toggle').removeClass('active');
  92. $('#loading').remove();
  93. $('#content').fadeOut().parent().append('<div id="loading" class="center">Loading...<div class="center"></div></div>');
  94. var $clink = $(this);
  95. History.pushState(null, null, $clink.attr('href'));
  96. $('ul.main-menu li.active').removeClass('active');
  97. $clink.parent('li').addClass('active');
  98. });
  99. $('.accordion > a').click(function (e) {
  100. e.preventDefault();
  101. var $ul = $(this).siblings('ul');
  102. var $li = $(this).parent();
  103. if ($ul.is(':visible')) $li.removeClass('active');
  104. else $li.addClass('active');
  105. $ul.slideToggle();
  106. });
  107. $('.accordion li.active:first').parents('ul').slideDown();
  108. //other things to do on document ready, separated for ajax calls
  109. docReady();
  110. });
  111. function docReady() {
  112. //prevent # links from moving to top
  113. $('a[href="#"][data-top!=true]').click(function (e) {
  114. e.preventDefault();
  115. });
  116. //notifications
  117. $('.noty').click(function (e) {
  118. e.preventDefault();
  119. var options = $.parseJSON($(this).attr('data-noty-options'));
  120. noty(options);
  121. });
  122. //chosen - improves select
  123. $('[data-rel="chosen"],[rel="chosen"]').chosen();
  124. //tabs
  125. $('#myTab a:first').tab('show');
  126. $('#myTab a').click(function (e) {
  127. e.preventDefault();
  128. $(this).tab('show');
  129. });
  130. //tooltip
  131. $('[data-toggle="tooltip"]').tooltip();
  132. //auto grow textarea
  133. $('textarea.autogrow').autogrow();
  134. //popover
  135. $('[data-toggle="popover"]').popover();
  136. //iOS / iPhone style toggle switch
  137. $('.iphone-toggle').iphoneStyle();
  138. //star rating
  139. $('.raty').raty({
  140. score: 4 //default stars
  141. });
  142. //uploadify - multiple uploads
  143. $('#file_upload').uploadify({
  144. 'swf': 'misc/uploadify.swf',
  145. 'uploader': 'misc/uploadify.php'
  146. // Put your options here
  147. });
  148. //gallery controls container animation
  149. $('ul.gallery li').hover(function () {
  150. $('img', this).fadeToggle(1000);
  151. $(this).find('.gallery-controls').remove();
  152. $(this).append('<div class="well gallery-controls">' +
  153. '<p><a href="#" class="gallery-edit btn"><i class="glyphicon glyphicon-edit"></i></a> <a href="#" class="gallery-delete btn"><i class="glyphicon glyphicon-remove"></i></a></p>' +
  154. '</div>');
  155. $(this).find('.gallery-controls').stop().animate({'margin-top': '-1'}, 400);
  156. }, function () {
  157. $('img', this).fadeToggle(1000);
  158. $(this).find('.gallery-controls').stop().animate({'margin-top': '-30'}, 200, function () {
  159. $(this).remove();
  160. });
  161. });
  162. //gallery image controls example
  163. //gallery delete
  164. $('.thumbnails').on('click', '.gallery-delete', function (e) {
  165. e.preventDefault();
  166. //get image id
  167. //alert($(this).parents('.thumbnail').attr('id'));
  168. $(this).parents('.thumbnail').fadeOut();
  169. });
  170. //gallery edit
  171. $('.thumbnails').on('click', '.gallery-edit', function (e) {
  172. e.preventDefault();
  173. //get image id
  174. //alert($(this).parents('.thumbnail').attr('id'));
  175. });
  176. //gallery colorbox
  177. $('.thumbnail a').colorbox({
  178. rel: 'thumbnail a',
  179. transition: "elastic",
  180. maxWidth: "95%",
  181. maxHeight: "95%",
  182. slideshow: true
  183. });
  184. //gallery fullscreen
  185. $('#toggle-fullscreen').button().click(function () {
  186. var button = $(this), root = document.documentElement;
  187. if (!button.hasClass('active')) {
  188. $('#thumbnails').addClass('modal-fullscreen');
  189. if (root.webkitRequestFullScreen) {
  190. root.webkitRequestFullScreen(
  191. window.Element.ALLOW_KEYBOARD_INPUT
  192. );
  193. } else if (root.mozRequestFullScreen) {
  194. root.mozRequestFullScreen();
  195. }
  196. } else {
  197. $('#thumbnails').removeClass('modal-fullscreen');
  198. (document.webkitCancelFullScreen ||
  199. document.mozCancelFullScreen ||
  200. $.noop).apply(document);
  201. }
  202. });
  203. //tour
  204. if ($('.tour').length && typeof(tour) == 'undefined') {
  205. var tour = new Tour();
  206. tour.addStep({
  207. element: "#content", /* html element next to which the step popover should be shown */
  208. placement: "top",
  209. title: "Custom Tour", /* title of the popover */
  210. content: "You can create tour like this. Click Next." /* content of the popover */
  211. });
  212. tour.addStep({
  213. element: ".theme-container",
  214. placement: "left",
  215. title: "Themes",
  216. content: "You change your theme from here."
  217. });
  218. tour.addStep({
  219. element: "ul.main-menu a:first",
  220. title: "Dashboard",
  221. content: "This is your dashboard from here you will find highlights."
  222. });
  223. tour.addStep({
  224. element: "#for-is-ajax",
  225. title: "Ajax",
  226. content: "You can change if pages load with Ajax or not."
  227. });
  228. tour.addStep({
  229. element: ".top-nav a:first",
  230. placement: "bottom",
  231. title: "Visit Site",
  232. content: "Visit your front end from here."
  233. });
  234. tour.restart();
  235. }
  236. //datatable
  237. $('.datatable').dataTable({
  238. "sDom": "<'row'<'col-md-6'l><'col-md-6'f>r>t<'row'<'col-md-12'i><'col-md-12 center-block'p>>",
  239. "sPaginationType": "bootstrap",
  240. "oLanguage": {
  241. "sLengthMenu": "_MENU_ records per page"
  242. }
  243. });
  244. $('.btn-close').click(function (e) {
  245. e.preventDefault();
  246. $(this).parent().parent().parent().fadeOut();
  247. });
  248. $('.btn-minimize').click(function (e) {
  249. e.preventDefault();
  250. var $target = $(this).parent().parent().next('.box-content');
  251. if ($target.is(':visible')) $('i', $(this)).removeClass('glyphicon-chevron-up').addClass('glyphicon-chevron-down');
  252. else $('i', $(this)).removeClass('glyphicon-chevron-down').addClass('glyphicon-chevron-up');
  253. $target.slideToggle();
  254. });
  255. $('.btn-setting').click(function (e) {
  256. e.preventDefault();
  257. $('#myModal').modal('show');
  258. });
  259. $('#calendar').fullCalendar({
  260. header: {
  261. left: 'prev,next today',
  262. center: 'title',
  263. right: 'month,agendaWeek,agendaDay'
  264. },
  265. defaultDate: '2014-06-12',
  266. events: [
  267. {
  268. title: 'All Day Event',
  269. start: '2014-06-01'
  270. },
  271. {
  272. title: 'Long Event',
  273. start: '2014-06-07',
  274. end: '2014-06-10'
  275. },
  276. {
  277. id: 999,
  278. title: 'Repeating Event',
  279. start: '2014-06-09T16:00:00'
  280. },
  281. {
  282. id: 999,
  283. title: 'Repeating Event',
  284. start: '2014-06-16T16:00:00'
  285. },
  286. {
  287. title: 'Meeting',
  288. start: '2014-06-12T10:30:00',
  289. end: '2014-06-12T12:30:00'
  290. },
  291. {
  292. title: 'Lunch',
  293. start: '2014-06-12T12:00:00'
  294. },
  295. {
  296. title: 'Birthday Party',
  297. start: '2014-06-13T07:00:00'
  298. },
  299. {
  300. title: 'Click for Google',
  301. url: 'http://google.com/',
  302. start: '2014-06-28'
  303. }
  304. ]
  305. });
  306. }
  307. //additional functions for data table
  308. $.fn.dataTableExt.oApi.fnPagingInfo = function (oSettings) {
  309. return {
  310. "iStart": oSettings._iDisplayStart,
  311. "iEnd": oSettings.fnDisplayEnd(),
  312. "iLength": oSettings._iDisplayLength,
  313. "iTotal": oSettings.fnRecordsTotal(),
  314. "iFilteredTotal": oSettings.fnRecordsDisplay(),
  315. "iPage": Math.ceil(oSettings._iDisplayStart / oSettings._iDisplayLength),
  316. "iTotalPages": Math.ceil(oSettings.fnRecordsDisplay() / oSettings._iDisplayLength)
  317. };
  318. }
  319. $.extend($.fn.dataTableExt.oPagination, {
  320. "bootstrap": {
  321. "fnInit": function (oSettings, nPaging, fnDraw) {
  322. var oLang = oSettings.oLanguage.oPaginate;
  323. var fnClickHandler = function (e) {
  324. e.preventDefault();
  325. if (oSettings.oApi._fnPageChange(oSettings, e.data.action)) {
  326. fnDraw(oSettings);
  327. }
  328. };
  329. $(nPaging).addClass('pagination').append(
  330. '<ul class="pagination">' +
  331. '<li class="prev disabled"><a href="#">&larr; ' + oLang.sPrevious + '</a></li>' +
  332. '<li class="next disabled"><a href="#">' + oLang.sNext + ' &rarr; </a></li>' +
  333. '</ul>'
  334. );
  335. var els = $('a', nPaging);
  336. $(els[0]).bind('click.DT', { action: "previous" }, fnClickHandler);
  337. $(els[1]).bind('click.DT', { action: "next" }, fnClickHandler);
  338. },
  339. "fnUpdate": function (oSettings, fnDraw) {
  340. var iListLength = 5;
  341. var oPaging = oSettings.oInstance.fnPagingInfo();
  342. var an = oSettings.aanFeatures.p;
  343. var i, j, sClass, iStart, iEnd, iHalf = Math.floor(iListLength / 2);
  344. if (oPaging.iTotalPages < iListLength) {
  345. iStart = 1;
  346. iEnd = oPaging.iTotalPages;
  347. }
  348. else if (oPaging.iPage <= iHalf) {
  349. iStart = 1;
  350. iEnd = iListLength;
  351. } else if (oPaging.iPage >= (oPaging.iTotalPages - iHalf)) {
  352. iStart = oPaging.iTotalPages - iListLength + 1;
  353. iEnd = oPaging.iTotalPages;
  354. } else {
  355. iStart = oPaging.iPage - iHalf + 1;
  356. iEnd = iStart + iListLength - 1;
  357. }
  358. for (i = 0, iLen = an.length; i < iLen; i++) {
  359. // remove the middle elements
  360. $('li:gt(0)', an[i]).filter(':not(:last)').remove();
  361. // add the new list items and their event handlers
  362. for (j = iStart; j <= iEnd; j++) {
  363. sClass = (j == oPaging.iPage + 1) ? 'class="active"' : '';
  364. $('<li ' + sClass + '><a href="#">' + j + '</a></li>')
  365. .insertBefore($('li:last', an[i])[0])
  366. .bind('click', function (e) {
  367. e.preventDefault();
  368. oSettings._iDisplayStart = (parseInt($('a', this).text(), 10) - 1) * oPaging.iLength;
  369. fnDraw(oSettings);
  370. });
  371. }
  372. // add / remove disabled classes from the static elements
  373. if (oPaging.iPage === 0) {
  374. $('li:first', an[i]).addClass('disabled');
  375. } else {
  376. $('li:first', an[i]).removeClass('disabled');
  377. }
  378. if (oPaging.iPage === oPaging.iTotalPages - 1 || oPaging.iTotalPages === 0) {
  379. $('li:last', an[i]).addClass('disabled');
  380. } else {
  381. $('li:last', an[i]).removeClass('disabled');
  382. }
  383. }
  384. }
  385. }
  386. });