web/public_php/ams/js/charisma.js

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