/*! * Author: Abdullah A Almsaeed * Date: 4 Jan 2014 * Description: * This file should be included in all pages !**/ $(function() { "use strict"; //Enable sidebar toggle $("[data-toggle='offcanvas']").click(function(e) { e.preventDefault(); //If window is small enough, enable sidebar push menu if ($(window).width() <= 992) { $('.row-offcanvas').toggleClass('active'); $('.left-side').removeClass("collapse-left"); $(".right-side").removeClass("strech"); $('.row-offcanvas').toggleClass("relative"); } else { //Else, enable content streching $('.left-side').toggleClass("collapse-left"); $(".right-side").toggleClass("strech"); } }); //Add hover support for touch devices $('.btn').bind('touchstart', function() { $(this).addClass('hover'); }).bind('touchend', function() { $(this).removeClass('hover'); }); //Activate tooltips $("[data-toggle='tooltip']").tooltip(); /* * Add collapse and remove events to boxes */ $("[data-widget='collapse']").click(function() { //Find the box parent var box = $(this).parents(".box").first(); //Find the body and the footer var bf = box.find(".box-body, .box-footer"); if (!box.hasClass("collapsed-box")) { box.addClass("collapsed-box"); bf.slideUp(); } else { box.removeClass("collapsed-box"); bf.slideDown(); } }); /* * ADD SLIMSCROLL TO THE TOP NAV DROPDOWNS * --------------------------------------- */ $(".navbar .menu").slimscroll({ height: "200px", alwaysVisible: false, size: "3px" }).css("width","100%"); /* * INITIALIZE BUTTON TOGGLE * ------------------------ */ $('.btn-group[data-toggle="btn-toggle"]').each(function() { var group = $(this); $(this).find(".btn").click(function(e) { group.find(".btn.active").removeClass("active"); $(this).addClass("active"); e.preventDefault(); }); }); $("[data-widget='remove']").click(function() { //Find the box parent var box = $(this).parents(".box").first(); box.slideUp(); }); /* Sidebar tree view */ $(".sidebar .treeview").tree(); /* * Make sure that the sidebar is streched full height * --------------------------------------------- * We are gonna assign a min-height value every time the * wrapper gets resized and upon page load. We will use * Ben Alman's method for detecting the resize event. **/ //alert($(window).height()); function _fix() { //Get window height and the wrapper height var height = $(window).height() - $("body > .header").height(); $(".wrapper").css("min-height", height + "px"); var content = $(".wrapper").height(); //If the wrapper height is greater than the window if (content > height) //then set sidebar height to the wrapper $(".left-side, html, body").css("min-height", content + "px"); else { //Otherwise, set the sidebar to the height of the window $(".left-side, html, body").css("min-height", height + "px"); } } //Fire upon load _fix(); //Fire when wrapper is resized $(".wrapper").resize(function() { _fix(); }); /* * We are gonna initialize all checkbox and radio inputs to * iCheck plugin in. * You can find the documentation at http://fronteed.com/iCheck/ */ $("input[type='checkbox'], input[type='radio']").iCheck({ checkboxClass: 'icheckbox_minimal', radioClass: 'iradio_minimal' }); /* For demo purposes */ var demo = $("
").css({ position: "fixed", top: "150px", right: "0", background: "rgba(0, 0, 0, 0.7)", "border-radius": "5px 0px 0px 5px", padding: "10px 15px", "font-size": "16px", "z-index": "999999", cursor: "pointer", color: "#ddd" }).html("").addClass("no-print"); var demo_settings = $("
").css({ "padding": "10px", position: "fixed", top: "130px", right: "-200px", background: "#fff", border: "3px solid rgba(0, 0, 0, 0.7)", "width": "200px", "z-index": "999999" }).addClass("no-print"); demo_settings.append( "

Layout Options

" + "
" + "
" + "" + "
" + "
" ); demo.click(function() { if (!$(this).hasClass("open")) { $(this).css("right", "200px"); demo_settings.css("right", "0"); $(this).addClass("open"); } else { $(this).css("right", "0"); demo_settings.css("right", "-200px"); $(this).removeClass("open") } }); $("body").append(demo); $("body").append(demo_settings); }); function change_layout() { $("body").toggleClass("fixed"); } /*END DEMO*/ /* * BOX REFRESH BUTTON * ------------------ * This is a custom plugin to use with the compenet BOX. It allows you to add * a refresh button to the box. It converts the box's state to a loading state. * * USAGE: * $("#box-widget").boxRefresh( options ); * */ (function($) { "use strict"; $.fn.boxRefresh = function(options) { // Render options var settings = $.extend({ //Refressh button selector trigger: ".refresh-btn", //File source to be loaded (e.g: ajax/src.php) source: "", //Callbacks onLoadStart: function(box) { }, //Right after the button has been clicked onLoadDone: function(box) { } //When the source has been loaded }, options); //The overlay var overlay = $('
'); return this.each(function() { //if a source is specified if (settings.source === "") { if (console) { console.log("Please specify a source first - boxRefresh()"); } return; } //the box var box = $(this); //the button var rBtn = box.find(settings.trigger).first(); //On trigger click rBtn.click(function(e) { e.preventDefault(); //Add loading overlay start(box); //Perform ajax call box.find(".box-body").load(settings.source, function() { done(box); }); }); }); function start(box) { //Add overlay and loading img box.append(overlay); settings.onLoadStart.call(box); } function done(box) { //Remove overlay and loading img box.find(overlay).remove(); settings.onLoadDone.call(box); } }; })(jQuery); /* * SIDEBAR MENU * ------------ * This is a custom plugin for the sidebar menu. It provides a tree view. * * Usage: * $(".sidebar).tree(); * * Note: This plugin does not accept any options. Instead, it only requires a class * added to the element that contains a sub-menu. * * When used with the sidebar, for example, it would look something like this: *