You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
2464 lines
93 KiB
2464 lines
93 KiB
2 years ago
|
/**
|
||
|
Core script to handle the entire theme and core functions
|
||
|
**/
|
||
|
var App = function () {
|
||
|
|
||
|
// IE mode
|
||
|
var isRTL = false;
|
||
|
var isIE8 = false;
|
||
|
var isIE9 = false;
|
||
|
var isIE10 = false;
|
||
|
|
||
|
var resizeHandlers = [];
|
||
|
|
||
|
var basePath = '../';
|
||
|
|
||
|
var globalImgPath = '3rd/AdminLTE/dist/img/';
|
||
|
|
||
|
var globalPluginsPath = 'base/plugins/';
|
||
|
|
||
|
var globalCssPath = 'global/css/';
|
||
|
|
||
|
// theme layout color set
|
||
|
|
||
|
var brandColors = {
|
||
|
'blue': '#89C4F4',
|
||
|
'red': '#F3565D',
|
||
|
'green': '#1bbc9b',
|
||
|
'purple': '#9b59b6',
|
||
|
'grey': '#95a5a6',
|
||
|
'yellow': '#F8CB00',
|
||
|
'lightblue': '364150'
|
||
|
};
|
||
|
|
||
|
// initializes main settings
|
||
|
var handleInit = function () {
|
||
|
|
||
|
if ($('body').css('direction') === 'rtl') {
|
||
|
isRTL = true;
|
||
|
}
|
||
|
|
||
|
isIE8 = !!navigator.userAgent.match(/MSIE 8.0/);
|
||
|
isIE9 = !!navigator.userAgent.match(/MSIE 9.0/);
|
||
|
isIE10 = !!navigator.userAgent.match(/MSIE 10.0/);
|
||
|
|
||
|
if (isIE10) {
|
||
|
$('html').addClass('ie10'); // detect IE10 version
|
||
|
}
|
||
|
|
||
|
if (isIE10 || isIE9 || isIE8) {
|
||
|
$('html').addClass('ie'); // detect IE10 version
|
||
|
}
|
||
|
};
|
||
|
|
||
|
// runs callback functions set by App.addResponsiveHandler().
|
||
|
var _runResizeHandlers = function () {
|
||
|
// reinitialize other subscribed elements
|
||
|
for (var i = 0; i < resizeHandlers.length; i++) {
|
||
|
var each = resizeHandlers[i];
|
||
|
each.call();
|
||
|
}
|
||
|
};
|
||
|
|
||
|
//初始化iframe内容页高度
|
||
|
var handleIframeContent = function () {
|
||
|
var ht = $(window).height();//获取浏览器窗口的整体高度;
|
||
|
|
||
|
var $footer = $(".main-footer");
|
||
|
var $header = $(".main-header");
|
||
|
var $tabs = $(".content-tabs");
|
||
|
|
||
|
var height = App.getViewPort().height - $footer.outerHeight() - $header.outerHeight();
|
||
|
if ($tabs.is(":visible")) {
|
||
|
height = height - $tabs.outerHeight(true)-5;//原来-5 modify by xue lei on 2019-3-19
|
||
|
}
|
||
|
height = height - 1;
|
||
|
$(".tab_iframe").css({
|
||
|
height: height,
|
||
|
width: "100%"
|
||
|
});
|
||
|
|
||
|
//var width = App.getViewPort().width- $(".page-sidebar-menu").width();
|
||
|
/*$(".tab_iframe").css({
|
||
|
});*/
|
||
|
};
|
||
|
//初始化内容页layout组件高度
|
||
|
var handleIframeLayoutHeight = function () {
|
||
|
|
||
|
var height = App.getViewPort().height - $('.page-footer').outerHeight() - $('.page-header').outerHeight() - $(".content-tabs").height();
|
||
|
// $("#layout").css({ "height": height });
|
||
|
return height;
|
||
|
};
|
||
|
|
||
|
var handleSiderBarmenu = function () {
|
||
|
jQuery('.page-sidebar-menu').on('click', ' li > a.iframeOpen', function (e) {
|
||
|
e.preventDefault();
|
||
|
App.scrollTop();
|
||
|
$("#iframe-main").attr("src", $(this).attr('href'));
|
||
|
});
|
||
|
};
|
||
|
|
||
|
var isFullScreen = false;
|
||
|
|
||
|
var requestFullScreen = function () {
|
||
|
var de = document.documentElement;
|
||
|
|
||
|
if (de.requestFullscreen) {
|
||
|
de.requestFullscreen();
|
||
|
} else if (de.mozRequestFullScreen) {
|
||
|
de.mozRequestFullScreen();
|
||
|
} else if (de.webkitRequestFullScreen) {
|
||
|
de.webkitRequestFullScreen();
|
||
|
}
|
||
|
else if (de.msRequestFullscreen)
|
||
|
{
|
||
|
de.msRequestFullscreen();
|
||
|
}
|
||
|
else {
|
||
|
App.alert({message: "该浏览器不支持全屏!", type: "danger"});
|
||
|
}
|
||
|
|
||
|
};
|
||
|
|
||
|
var requestFullScreen2 = function (element) {
|
||
|
// 判断各种浏览器,找到正确的方法
|
||
|
var requestMethod = element.requestFullScreen || //W3C
|
||
|
element.webkitRequestFullScreen || //Chrome等
|
||
|
element.mozRequestFullScreen || //FireFox
|
||
|
element.msRequestFullScreen; //IE11
|
||
|
if (requestMethod) {
|
||
|
requestMethod.call(element);
|
||
|
}
|
||
|
else if (typeof window.ActiveXObject !== "undefined" || "ActiveXObject" in window) {//for Internet Explorer
|
||
|
var wscript = new ActiveXObject("WScript.Shell");
|
||
|
if (wscript !== null) {
|
||
|
wscript.SendKeys("{F11}");
|
||
|
}
|
||
|
}
|
||
|
};
|
||
|
|
||
|
//退出全屏 判断浏览器种类
|
||
|
var exitFull = function () {
|
||
|
// 判断各种浏览器,找到正确的方法
|
||
|
var exitMethod = document.exitFullscreen || //W3C
|
||
|
document.mozCancelFullScreen || //Chrome等
|
||
|
document.webkitExitFullscreen || //FireFox
|
||
|
document.webkitExitFullscreen; //IE11
|
||
|
if (exitMethod) {
|
||
|
exitMethod.call(document);
|
||
|
}
|
||
|
else if (typeof window.ActiveXObject !== "undefined") {//for Internet Explorer
|
||
|
var wscript = new ActiveXObject("WScript.Shell");
|
||
|
if (wscript !== null) {
|
||
|
wscript.SendKeys("{F11}");
|
||
|
}
|
||
|
}
|
||
|
};
|
||
|
|
||
|
// handle the layout reinitialization on window resize
|
||
|
var handleOnResize = function () {
|
||
|
var resize;
|
||
|
if (isIE8) {
|
||
|
var currheight;
|
||
|
$(window).resize(function () {
|
||
|
if (currheight == document.documentElement.clientHeight) {
|
||
|
return; //quite event since only body resized not window.
|
||
|
}
|
||
|
if (resize) {
|
||
|
clearTimeout(resize);
|
||
|
}
|
||
|
resize = setTimeout(function () {
|
||
|
_runResizeHandlers();
|
||
|
handleIframeContent();
|
||
|
}, 50); // wait 50ms until window resize finishes.
|
||
|
currheight = document.documentElement.clientHeight; // store last body client height
|
||
|
});
|
||
|
} else {
|
||
|
$(window).resize(function () {
|
||
|
if (resize) {
|
||
|
clearTimeout(resize);
|
||
|
}
|
||
|
resize = setTimeout(function () {
|
||
|
_runResizeHandlers();
|
||
|
handleIframeContent();
|
||
|
}, 50); // wait 50ms until window resize finishes.
|
||
|
});
|
||
|
}
|
||
|
};
|
||
|
|
||
|
// Handles portlet tools & actions
|
||
|
var handlePortletTools = function () {
|
||
|
// handle portlet remove
|
||
|
$('body').on('click', '.portlet > .portlet-title > .tools > a.remove', function (e) {
|
||
|
e.preventDefault();
|
||
|
var portlet = $(this).closest(".portlet");
|
||
|
|
||
|
if ($('body').hasClass('page-portlet-fullscreen')) {
|
||
|
$('body').removeClass('page-portlet-fullscreen');
|
||
|
}
|
||
|
|
||
|
portlet.find('.portlet-title .fullscreen').tooltip('destroy');
|
||
|
portlet.find('.portlet-title > .tools > .reload').tooltip('destroy');
|
||
|
portlet.find('.portlet-title > .tools > .remove').tooltip('destroy');
|
||
|
portlet.find('.portlet-title > .tools > .config').tooltip('destroy');
|
||
|
portlet.find('.portlet-title > .tools > .collapse, .portlet > .portlet-title > .tools > .expand').tooltip('destroy');
|
||
|
|
||
|
portlet.remove();
|
||
|
});
|
||
|
|
||
|
// handle portlet fullscreen
|
||
|
$('body').on('click', '.portlet > .portlet-title .fullscreen', function (e) {
|
||
|
e.preventDefault();
|
||
|
var portlet = $(this).closest(".portlet");
|
||
|
if (portlet.hasClass('portlet-fullscreen')) {
|
||
|
$(this).removeClass('on');
|
||
|
portlet.removeClass('portlet-fullscreen');
|
||
|
$('body').removeClass('page-portlet-fullscreen');
|
||
|
portlet.children('.portlet-body').css('height', 'auto');
|
||
|
} else {
|
||
|
var height = App.getViewPort().height -
|
||
|
portlet.children('.portlet-title').outerHeight() -
|
||
|
parseInt(portlet.children('.portlet-body').css('padding-top')) -
|
||
|
parseInt(portlet.children('.portlet-body').css('padding-bottom'));
|
||
|
|
||
|
$(this).addClass('on');
|
||
|
portlet.addClass('portlet-fullscreen');
|
||
|
$('body').addClass('page-portlet-fullscreen');
|
||
|
portlet.children('.portlet-body').css('height', height);
|
||
|
}
|
||
|
});
|
||
|
|
||
|
$('body').on('click', '.portlet > .portlet-title > .tools > a.reload', function (e) {
|
||
|
e.preventDefault();
|
||
|
var el = $(this).closest(".portlet").children(".portlet-body");
|
||
|
var url = $(this).attr("data-url");
|
||
|
var error = $(this).attr("data-error-display");
|
||
|
if (url) {
|
||
|
App.blockUI({
|
||
|
target: el,
|
||
|
animate: true,
|
||
|
overlayColor: 'none'
|
||
|
});
|
||
|
$.ajax({
|
||
|
type: "GET",
|
||
|
cache: false,
|
||
|
url: url,
|
||
|
dataType: "html",
|
||
|
success: function (res) {
|
||
|
App.unblockUI(el);
|
||
|
el.html(res);
|
||
|
App.initAjax() // reinitialize elements & plugins for newly loaded content
|
||
|
},
|
||
|
error: function (xhr, ajaxOptions, thrownError) {
|
||
|
App.unblockUI(el);
|
||
|
var msg = 'Error on reloading the content. Please check your connection and try again.';
|
||
|
if (error == "toastr" && toastr) {
|
||
|
toastr.error(msg);
|
||
|
} else if (error == "notific8" && $.notific8) {
|
||
|
$.notific8('zindex', 11500);
|
||
|
$.notific8(msg, {
|
||
|
theme: 'ruby',
|
||
|
life: 3000
|
||
|
});
|
||
|
} else {
|
||
|
alert(msg);
|
||
|
}
|
||
|
}
|
||
|
});
|
||
|
} else {
|
||
|
// for demo purpose
|
||
|
App.blockUI({
|
||
|
target: el,
|
||
|
animate: true,
|
||
|
overlayColor: 'none'
|
||
|
});
|
||
|
window.setTimeout(function () {
|
||
|
App.unblockUI(el);
|
||
|
}, 1000);
|
||
|
}
|
||
|
});
|
||
|
|
||
|
// load ajax data on page init
|
||
|
$('.portlet .portlet-title a.reload[data-load="true"]').click();
|
||
|
|
||
|
$('body').on('click', '.portlet > .portlet-title > .tools > .collapse, .portlet .portlet-title > .tools > .expand', function (e) {
|
||
|
e.preventDefault();
|
||
|
var el = $(this).closest(".portlet").children(".portlet-body");
|
||
|
if ($(this).hasClass("collapse")) {
|
||
|
$(this).removeClass("collapse").addClass("expand");
|
||
|
el.slideUp(200);
|
||
|
} else {
|
||
|
$(this).removeClass("expand").addClass("collapse");
|
||
|
el.slideDown(200);
|
||
|
}
|
||
|
});
|
||
|
};
|
||
|
|
||
|
// Handles custom checkboxes & radios using jQuery Uniform plugin
|
||
|
var handleUniform = function () {
|
||
|
if (!$().uniform) {
|
||
|
return;
|
||
|
}
|
||
|
var test = $("input[type=checkbox]:not(.toggle, .md-check, .md-radiobtn, .make-switch, .icheck), input[type=radio]:not(.toggle, .md-check, .md-radiobtn, .star, .make-switch, .icheck)");
|
||
|
if (test.size() > 0) {
|
||
|
test.each(function () {
|
||
|
if ($(this).parents(".checker").size() === 0) {
|
||
|
$(this).show();
|
||
|
$(this).uniform();
|
||
|
}
|
||
|
});
|
||
|
}
|
||
|
};
|
||
|
|
||
|
// Handlesmaterial design checkboxes
|
||
|
var handleMaterialDesign = function () {
|
||
|
|
||
|
// Material design ckeckbox and radio effects
|
||
|
$('body').on('click', '.md-checkbox > label, .md-radio > label', function () {
|
||
|
var the = $(this);
|
||
|
// find the first span which is our circle/bubble
|
||
|
var el = $(this).children('span:first-child');
|
||
|
|
||
|
// add the bubble class (we do this so it doesnt show on page load)
|
||
|
el.addClass('inc');
|
||
|
|
||
|
// clone it
|
||
|
var newone = el.clone(true);
|
||
|
|
||
|
// add the cloned version before our original
|
||
|
el.before(newone);
|
||
|
|
||
|
// remove the original so that it is ready to run on next click
|
||
|
$("." + el.attr("class") + ":last", the).remove();
|
||
|
});
|
||
|
|
||
|
if ($('body').hasClass('page-md')) {
|
||
|
// Material design click effect
|
||
|
// credit where credit's due; http://thecodeplayer.com/walkthrough/ripple-click-effect-google-material-design
|
||
|
var element, circle, d, x, y;
|
||
|
$('body').on('click', 'a.btn, button.btn, input.btn, label.btn', function (e) {
|
||
|
element = $(this);
|
||
|
|
||
|
if (element.find(".md-click-circle").length == 0) {
|
||
|
element.prepend("<span class='md-click-circle'></span>");
|
||
|
}
|
||
|
|
||
|
circle = element.find(".md-click-circle");
|
||
|
circle.removeClass("md-click-animate");
|
||
|
|
||
|
if (!circle.height() && !circle.width()) {
|
||
|
d = Math.max(element.outerWidth(), element.outerHeight());
|
||
|
circle.css({height: d, width: d});
|
||
|
}
|
||
|
|
||
|
x = e.pageX - element.offset().left - circle.width() / 2;
|
||
|
y = e.pageY - element.offset().top - circle.height() / 2;
|
||
|
|
||
|
circle.css({top: y + 'px', left: x + 'px'}).addClass("md-click-animate");
|
||
|
|
||
|
setTimeout(function () {
|
||
|
circle.remove();
|
||
|
}, 1000);
|
||
|
});
|
||
|
}
|
||
|
|
||
|
// Floating labels
|
||
|
var handleInput = function (el) {
|
||
|
if (el.val() != "") {
|
||
|
el.addClass('edited');
|
||
|
} else {
|
||
|
el.removeClass('edited');
|
||
|
}
|
||
|
}
|
||
|
|
||
|
$('body').on('keydown', '.form-md-floating-label .form-control', function (e) {
|
||
|
handleInput($(this));
|
||
|
});
|
||
|
$('body').on('blur', '.form-md-floating-label .form-control', function (e) {
|
||
|
handleInput($(this));
|
||
|
});
|
||
|
|
||
|
$('.form-md-floating-label .form-control').each(function () {
|
||
|
if ($(this).val().length > 0) {
|
||
|
$(this).addClass('edited');
|
||
|
}
|
||
|
});
|
||
|
};
|
||
|
|
||
|
// Handles custom checkboxes & radios using jQuery iCheck plugin
|
||
|
var handleiCheck = function () {
|
||
|
if (!$().iCheck) {
|
||
|
return;
|
||
|
}
|
||
|
|
||
|
$('.icheck').each(function () {
|
||
|
var checkboxClass = $(this).attr('data-checkbox') ? $(this).attr('data-checkbox') : 'icheckbox_minimal-grey';
|
||
|
var radioClass = $(this).attr('data-radio') ? $(this).attr('data-radio') : 'iradio_minimal-grey';
|
||
|
|
||
|
if (checkboxClass.indexOf('_line') > -1 || radioClass.indexOf('_line') > -1) {
|
||
|
$(this).iCheck({
|
||
|
checkboxClass: checkboxClass,
|
||
|
radioClass: radioClass,
|
||
|
insert: '<div class="icheck_line-icon"></div>' + $(this).attr("data-label")
|
||
|
});
|
||
|
} else {
|
||
|
$(this).iCheck({
|
||
|
checkboxClass: checkboxClass,
|
||
|
radioClass: radioClass
|
||
|
});
|
||
|
}
|
||
|
});
|
||
|
};
|
||
|
|
||
|
// Handles Bootstrap switches
|
||
|
var handleBootstrapSwitch = function () {
|
||
|
if (!$().bootstrapSwitch) {
|
||
|
return;
|
||
|
}
|
||
|
$('.make-switch').bootstrapSwitch();
|
||
|
};
|
||
|
|
||
|
// Handles Bootstrap confirmations
|
||
|
var handleBootstrapConfirmation = function () {
|
||
|
if (!$().confirmation) {
|
||
|
return;
|
||
|
}
|
||
|
$('[data-toggle=confirmation]').confirmation({
|
||
|
container: 'body',
|
||
|
btnOkClass: 'btn btn-sm btn-success',
|
||
|
btnCancelClass: 'btn btn-sm btn-danger'
|
||
|
});
|
||
|
};
|
||
|
|
||
|
// Handles Bootstrap Accordions.
|
||
|
var handleAccordions = function () {
|
||
|
$('body').on('shown.bs.collapse', '.accordion.scrollable', function (e) {
|
||
|
App.scrollTo($(e.target));
|
||
|
});
|
||
|
};
|
||
|
|
||
|
// Handles Bootstrap Tabs.
|
||
|
var handleTabs = function () {
|
||
|
//activate tab if tab id provided in the URL
|
||
|
if (location.hash) {
|
||
|
var tabid = encodeURI(location.hash.substr(1));
|
||
|
$('a[href="#' + tabid + '"]').parents('.tab-pane:hidden').each(function () {
|
||
|
var tabid = $(this).attr("id");
|
||
|
$('a[href="#' + tabid + '"]').click();
|
||
|
});
|
||
|
$('a[href="#' + tabid + '"]').click();
|
||
|
}
|
||
|
|
||
|
if ($().tabdrop) {
|
||
|
$('.tabbable-tabdrop .nav-pills, .tabbable-tabdrop .nav-tabs').tabdrop({
|
||
|
text: '<i class="fa fa-ellipsis-v"></i> <i class="fa fa-angle-down"></i>'
|
||
|
});
|
||
|
}
|
||
|
};
|
||
|
|
||
|
// Handles Bootstrap Modals.
|
||
|
var handleModals = function () {
|
||
|
// fix stackable modal issue: when 2 or more modals opened, closing one of modal will remove .modal-open class.
|
||
|
$('body').on('hide.bs.modal', function () {
|
||
|
if ($('.modal:visible').size() > 1 && $('html').hasClass('modal-open') === false) {
|
||
|
$('html').addClass('modal-open');
|
||
|
} else if ($('.modal:visible').size() <= 1) {
|
||
|
$('html').removeClass('modal-open');
|
||
|
}
|
||
|
});
|
||
|
|
||
|
// fix page scrollbars issue
|
||
|
$('body').on('show.bs.modal', '.modal', function () {
|
||
|
if ($(this).hasClass("modal-scroll")) {
|
||
|
$('body').addClass("modal-open-noscroll");
|
||
|
}
|
||
|
});
|
||
|
|
||
|
// fix page scrollbars issue
|
||
|
$('body').on('hide.bs.modal', '.modal', function () {
|
||
|
$('body').removeClass("modal-open-noscroll");
|
||
|
});
|
||
|
|
||
|
// remove ajax content and remove cache on modal closed
|
||
|
$('body').on('hidden.bs.modal', '.modal:not(.modal-cached)', function () {
|
||
|
$(this).removeData('bs.modal');
|
||
|
});
|
||
|
};
|
||
|
|
||
|
// Handles Bootstrap Tooltips.
|
||
|
var handleTooltips = function () {
|
||
|
// global tooltips
|
||
|
$('.tooltips').tooltip();
|
||
|
|
||
|
// portlet tooltips
|
||
|
$('.portlet > .portlet-title .fullscreen').tooltip({
|
||
|
container: 'body',
|
||
|
title: 'Fullscreen'
|
||
|
});
|
||
|
$('.portlet > .portlet-title > .tools > .reload').tooltip({
|
||
|
container: 'body',
|
||
|
title: 'Reload'
|
||
|
});
|
||
|
$('.portlet > .portlet-title > .tools > .remove').tooltip({
|
||
|
container: 'body',
|
||
|
title: 'Remove'
|
||
|
});
|
||
|
$('.portlet > .portlet-title > .tools > .config').tooltip({
|
||
|
container: 'body',
|
||
|
title: 'Settings'
|
||
|
});
|
||
|
$('.portlet > .portlet-title > .tools > .collapse, .portlet > .portlet-title > .tools > .expand').tooltip({
|
||
|
container: 'body',
|
||
|
title: 'Collapse/Expand'
|
||
|
});
|
||
|
};
|
||
|
|
||
|
// Handles Bootstrap Dropdowns
|
||
|
var handleDropdowns = function () {
|
||
|
/*
|
||
|
Hold dropdown on click
|
||
|
*/
|
||
|
$('body').on('click', '.dropdown-menu.hold-on-click', function (e) {
|
||
|
e.stopPropagation();
|
||
|
});
|
||
|
};
|
||
|
|
||
|
var handleAlerts = function () {
|
||
|
$('body').on('click', '[data-close="alert"]', function (e) {
|
||
|
$(this).parent('.alert').hide();
|
||
|
$(this).closest('.note').hide();
|
||
|
e.preventDefault();
|
||
|
});
|
||
|
|
||
|
$('body').on('click', '[data-close="note"]', function (e) {
|
||
|
$(this).closest('.note').hide();
|
||
|
e.preventDefault();
|
||
|
});
|
||
|
|
||
|
$('body').on('click', '[data-remove="note"]', function (e) {
|
||
|
$(this).closest('.note').remove();
|
||
|
e.preventDefault();
|
||
|
});
|
||
|
};
|
||
|
|
||
|
// Handle Hower Dropdowns
|
||
|
var handleDropdownHover = function () {
|
||
|
$('[data-hover="dropdown"]').not('.hover-initialized').each(function () {
|
||
|
$(this).dropdownHover();
|
||
|
$(this).addClass('hover-initialized');
|
||
|
});
|
||
|
};
|
||
|
|
||
|
// Handle textarea autosize
|
||
|
var handleTextareaAutosize = function () {
|
||
|
if (typeof(autosize) == "function") {
|
||
|
autosize(document.querySelector('textarea.autosizeme'));
|
||
|
}
|
||
|
};
|
||
|
|
||
|
// Handles Bootstrap Popovers
|
||
|
|
||
|
// last popep popover
|
||
|
var lastPopedPopover;
|
||
|
|
||
|
var handlePopovers = function () {
|
||
|
$('.popovers').popover();
|
||
|
|
||
|
// close last displayed popover
|
||
|
|
||
|
$(document).on('click.bs.popover.data-api', function (e) {
|
||
|
if (lastPopedPopover) {
|
||
|
lastPopedPopover.popover('hide');
|
||
|
}
|
||
|
});
|
||
|
};
|
||
|
|
||
|
// Handles scrollable contents using jQuery SlimScroll plugin.
|
||
|
var handleScrollers = function () {
|
||
|
App.initSlimScroll('.scroller');
|
||
|
};
|
||
|
|
||
|
// Handles Image Preview using jQuery Fancybox plugin
|
||
|
var handleFancybox = function () {
|
||
|
if (!jQuery.fancybox) {
|
||
|
return;
|
||
|
}
|
||
|
|
||
|
if ($(".fancybox-button").size() > 0) {
|
||
|
$(".fancybox-button").fancybox({
|
||
|
groupAttr: 'data-rel',
|
||
|
prevEffect: 'none',
|
||
|
nextEffect: 'none',
|
||
|
closeBtn: true,
|
||
|
helpers: {
|
||
|
title: {
|
||
|
type: 'inside'
|
||
|
}
|
||
|
}
|
||
|
});
|
||
|
}
|
||
|
};
|
||
|
|
||
|
// Handles counterup plugin wrapper
|
||
|
var handleCounterup = function () {
|
||
|
if (!$().counterUp) {
|
||
|
return;
|
||
|
}
|
||
|
|
||
|
$("[data-counter='counterup']").counterUp({
|
||
|
delay: 10,
|
||
|
time: 1000
|
||
|
});
|
||
|
};
|
||
|
|
||
|
// Fix input placeholder issue for IE8 and IE9
|
||
|
var handleFixInputPlaceholderForIE = function () {
|
||
|
//fix html5 placeholder attribute for ie7 & ie8
|
||
|
if (isIE8 || isIE9) { // ie8 & ie9
|
||
|
// this is html5 placeholder fix for inputs, inputs with placeholder-no-fix class will be skipped(e.g: we need this for password fields)
|
||
|
$('input[placeholder]:not(.placeholder-no-fix), textarea[placeholder]:not(.placeholder-no-fix)').each(function () {
|
||
|
var input = $(this);
|
||
|
|
||
|
if (input.val() === '' && input.attr("placeholder") !== '') {
|
||
|
input.addClass("placeholder").val(input.attr('placeholder'));
|
||
|
}
|
||
|
|
||
|
input.focus(function () {
|
||
|
if (input.val() == input.attr('placeholder')) {
|
||
|
input.val('');
|
||
|
}
|
||
|
});
|
||
|
|
||
|
input.blur(function () {
|
||
|
if (input.val() === '' || input.val() == input.attr('placeholder')) {
|
||
|
input.val(input.attr('placeholder'));
|
||
|
}
|
||
|
});
|
||
|
});
|
||
|
}
|
||
|
};
|
||
|
|
||
|
// Handle Select2 Dropdowns
|
||
|
var handleSelect2 = function () {
|
||
|
if ($().select2) {
|
||
|
$.fn.select2.defaults.set("theme", "bootstrap");
|
||
|
$('.select2me').select2({
|
||
|
placeholder: "Select",
|
||
|
width: 'auto',
|
||
|
allowClear: true
|
||
|
});
|
||
|
}
|
||
|
};
|
||
|
|
||
|
// handle group element heights
|
||
|
var handleHeight = function () {
|
||
|
$('[data-auto-height]').each(function () {
|
||
|
var parent = $(this);
|
||
|
var items = $('[data-height]', parent);
|
||
|
var height = 0;
|
||
|
var mode = parent.attr('data-mode');
|
||
|
var offset = parseInt(parent.attr('data-offset') ? parent.attr('data-offset') : 0);
|
||
|
|
||
|
items.each(function () {
|
||
|
if ($(this).attr('data-height') == "height") {
|
||
|
$(this).css('height', '');
|
||
|
} else {
|
||
|
$(this).css('min-height', '');
|
||
|
}
|
||
|
|
||
|
var height_ = (mode == 'base-height' ? $(this).outerHeight() : $(this).outerHeight(true));
|
||
|
if (height_ > height) {
|
||
|
height = height_;
|
||
|
}
|
||
|
});
|
||
|
|
||
|
height = height + offset;
|
||
|
|
||
|
items.each(function () {
|
||
|
if ($(this).attr('data-height') == "height") {
|
||
|
$(this).css('height', height);
|
||
|
} else {
|
||
|
$(this).css('min-height', height);
|
||
|
}
|
||
|
});
|
||
|
|
||
|
if (parent.attr('data-related')) {
|
||
|
$(parent.attr('data-related')).css('height', parent.height());
|
||
|
}
|
||
|
});
|
||
|
};
|
||
|
|
||
|
//* END:CORE HANDLERS *//
|
||
|
|
||
|
return {
|
||
|
//add by xue lei on 2018-3-18
|
||
|
resize: function () {
|
||
|
handleOnResize();
|
||
|
},
|
||
|
//main function to initiate the theme
|
||
|
init: function () {
|
||
|
//IMPORTANT!!!: Do not modify the core handlers call order.
|
||
|
|
||
|
//Core handlers
|
||
|
handleInit(); // initialize core variables
|
||
|
handleOnResize(); // set and handle responsive
|
||
|
|
||
|
//UI Component handlers
|
||
|
handleMaterialDesign(); // handle material design
|
||
|
handleUniform(); // hanfle custom radio & checkboxes
|
||
|
handleiCheck(); // handles custom icheck radio and checkboxes
|
||
|
handleBootstrapSwitch(); // handle bootstrap switch plugin
|
||
|
handleScrollers(); // handles slim scrolling contents
|
||
|
handleFancybox(); // handle fancy box
|
||
|
handleSelect2(); // handle custom Select2 dropdowns
|
||
|
handlePortletTools(); // handles portlet action bar functionality(refresh, configure, toggle, remove)
|
||
|
handleAlerts(); //handle closabled alerts
|
||
|
handleDropdowns(); // handle dropdowns
|
||
|
handleTabs(); // handle tabs
|
||
|
handleTooltips(); // handle bootstrap tooltips
|
||
|
handlePopovers(); // handles bootstrap popovers
|
||
|
handleAccordions(); //handles accordions
|
||
|
handleModals(); // handle modals
|
||
|
handleBootstrapConfirmation(); // handle bootstrap confirmations
|
||
|
handleTextareaAutosize(); // handle autosize textareas
|
||
|
handleCounterup(); // handle counterup instances
|
||
|
|
||
|
handleSiderBarmenu();
|
||
|
//Handle group element heights
|
||
|
this.addResizeHandler(handleHeight); // handle auto calculating height on window resize
|
||
|
|
||
|
// Hacks
|
||
|
handleFixInputPlaceholderForIE(); //IE8 & IE9 input placeholder issue fix
|
||
|
},
|
||
|
|
||
|
//main function to initiate core javascript after ajax complete
|
||
|
initAjax: function () {
|
||
|
handleUniform(); // handles custom radio & checkboxes
|
||
|
handleiCheck(); // handles custom icheck radio and checkboxes
|
||
|
handleBootstrapSwitch(); // handle bootstrap switch plugin
|
||
|
handleDropdownHover(); // handles dropdown hover
|
||
|
handleScrollers(); // handles slim scrolling contents
|
||
|
handleSelect2(); // handle custom Select2 dropdowns
|
||
|
handleFancybox(); // handle fancy box
|
||
|
handleDropdowns(); // handle dropdowns
|
||
|
handleTooltips(); // handle bootstrap tooltips
|
||
|
handlePopovers(); // handles bootstrap popovers
|
||
|
handleAccordions(); //handles accordions
|
||
|
handleBootstrapConfirmation(); // handle bootstrap confirmations
|
||
|
},
|
||
|
handleFullScreen: function () {
|
||
|
if (isFullScreen) {
|
||
|
exitFull();
|
||
|
isFullScreen = false;
|
||
|
} else {
|
||
|
requestFullScreen2(document.documentElement);
|
||
|
isFullScreen = true;
|
||
|
}
|
||
|
},
|
||
|
fixIframeTab: function () {
|
||
|
handleIframeContent();
|
||
|
},
|
||
|
getIframeLayoutHeight: function () {
|
||
|
return handleIframeLayoutHeight();
|
||
|
},
|
||
|
//init main components
|
||
|
initComponents: function () {
|
||
|
this.initAjax();
|
||
|
},
|
||
|
fixIframeCotent: function () {
|
||
|
setTimeout(function () {
|
||
|
//_runResizeHandlers();
|
||
|
handleIframeContent();
|
||
|
}, 50);
|
||
|
},
|
||
|
//public function to remember last opened popover that needs to be closed on click
|
||
|
setLastPopedPopover: function (el) {
|
||
|
lastPopedPopover = el;
|
||
|
},
|
||
|
|
||
|
//public function to add callback a function which will be called on window resize
|
||
|
addResizeHandler: function (func) {
|
||
|
resizeHandlers.push(func);
|
||
|
},
|
||
|
|
||
|
//public functon to call _runresizeHandlers
|
||
|
runResizeHandlers: function () {
|
||
|
_runResizeHandlers();
|
||
|
},
|
||
|
|
||
|
// wrApper function to scroll(focus) to an element
|
||
|
scrollTo: function (el, offeset) {
|
||
|
var pos = (el && el.size() > 0) ? el.offset().top : 0;
|
||
|
|
||
|
if (el) {
|
||
|
if ($('body').hasClass('page-header-fixed')) {
|
||
|
pos = pos - $('.page-header').height();
|
||
|
} else if ($('body').hasClass('page-header-top-fixed')) {
|
||
|
pos = pos - $('.page-header-top').height();
|
||
|
} else if ($('body').hasClass('page-header-menu-fixed')) {
|
||
|
pos = pos - $('.page-header-menu').height();
|
||
|
}
|
||
|
pos = pos + (offeset ? offeset : -1 * el.height());
|
||
|
}
|
||
|
|
||
|
$('html,body').animate({
|
||
|
scrollTop: pos
|
||
|
}, 'slow');
|
||
|
},
|
||
|
|
||
|
initSlimScroll: function (el) {
|
||
|
$(el).each(function () {
|
||
|
if ($(this).attr("data-initialized")) {
|
||
|
return; // exit
|
||
|
}
|
||
|
|
||
|
var height;
|
||
|
|
||
|
if ($(this).attr("data-height")) {
|
||
|
height = $(this).attr("data-height");
|
||
|
} else {
|
||
|
height = $(this).css('height');
|
||
|
}
|
||
|
|
||
|
$(this).slimScroll({
|
||
|
allowPageScroll: true, // allow page scroll when the element scroll is ended
|
||
|
size: '7px',
|
||
|
color: ($(this).attr("data-handle-color") ? $(this).attr("data-handle-color") : '#bbb'),
|
||
|
wrapperClass: ($(this).attr("data-wrapper-class") ? $(this).attr("data-wrapper-class") : 'slimScrollDiv'),
|
||
|
railColor: ($(this).attr("data-rail-color") ? $(this).attr("data-rail-color") : '#eaeaea'),
|
||
|
position: isRTL ? 'left' : 'right',
|
||
|
height: height,
|
||
|
alwaysVisible: ($(this).attr("data-always-visible") == "1" ? true : false),
|
||
|
railVisible: ($(this).attr("data-rail-visible") == "1" ? true : false),
|
||
|
disableFadeOut: true
|
||
|
});
|
||
|
|
||
|
$(this).attr("data-initialized", "1");
|
||
|
});
|
||
|
},
|
||
|
|
||
|
destroySlimScroll: function (el) {
|
||
|
$(el).each(function () {
|
||
|
if ($(this).attr("data-initialized") === "1") { // destroy existing instance before updating the height
|
||
|
$(this).removeAttr("data-initialized");
|
||
|
$(this).removeAttr("style");
|
||
|
|
||
|
var attrList = {};
|
||
|
|
||
|
// store the custom attribures so later we will reassign.
|
||
|
if ($(this).attr("data-handle-color")) {
|
||
|
attrList["data-handle-color"] = $(this).attr("data-handle-color");
|
||
|
}
|
||
|
if ($(this).attr("data-wrapper-class")) {
|
||
|
attrList["data-wrapper-class"] = $(this).attr("data-wrapper-class");
|
||
|
}
|
||
|
if ($(this).attr("data-rail-color")) {
|
||
|
attrList["data-rail-color"] = $(this).attr("data-rail-color");
|
||
|
}
|
||
|
if ($(this).attr("data-always-visible")) {
|
||
|
attrList["data-always-visible"] = $(this).attr("data-always-visible");
|
||
|
}
|
||
|
if ($(this).attr("data-rail-visible")) {
|
||
|
attrList["data-rail-visible"] = $(this).attr("data-rail-visible");
|
||
|
}
|
||
|
|
||
|
$(this).slimScroll({
|
||
|
wrapperClass: ($(this).attr("data-wrapper-class") ? $(this).attr("data-wrapper-class") : 'slimScrollDiv'),
|
||
|
destroy: true
|
||
|
});
|
||
|
|
||
|
var the = $(this);
|
||
|
|
||
|
// reassign custom attributes
|
||
|
$.each(attrList, function (key, value) {
|
||
|
the.attr(key, value);
|
||
|
});
|
||
|
|
||
|
}
|
||
|
});
|
||
|
},
|
||
|
|
||
|
// function to scroll to the top
|
||
|
scrollTop: function () {
|
||
|
App.scrollTo();
|
||
|
},
|
||
|
|
||
|
// wrApper function to block element(indicate loading)
|
||
|
blockUI: function (options) {
|
||
|
options = $.extend(true, {}, options);
|
||
|
var html = '';
|
||
|
if (options.animate) {
|
||
|
html = '<div class="loading-message ' + (options.boxed ? 'loading-message-boxed' : '') + '">' + '<div class="block-spinner-bar"><div class="bounce1"></div><div class="bounce2"></div><div class="bounce3"></div></div>' + '</div>';
|
||
|
} else if (options.iconOnly) {
|
||
|
html = '<div class="loading-message ' + (options.boxed ? 'loading-message-boxed' : '') + '"><img src="' + this.getGlobalImgPath() + 'loading/loading-spinner-grey.gif" align=""></div>';
|
||
|
} else if (options.textOnly) {
|
||
|
html = '<div class="loading-message ' + (options.boxed ? 'loading-message-boxed' : '') + '"><span> ' + (options.message ? options.message : 'LOADING...') + '</span></div>';
|
||
|
} else {
|
||
|
html = '<div class="loading-message ' + (options.boxed ? 'loading-message-boxed' : '') + '"><img src="' + this.getGlobalImgPath() + 'loading/loading-spinner-grey.gif" align=""><span> ' + (options.message ? options.message : 'LOADING...') + '</span></div>';
|
||
|
}
|
||
|
|
||
|
if (options.target) { // element blocking
|
||
|
var el = $(options.target);
|
||
|
if (el.height() <= ($(window).height())) {
|
||
|
options.cenrerY = true;
|
||
|
}
|
||
|
el.block({
|
||
|
message: html,
|
||
|
baseZ: options.zIndex ? options.zIndex : 1000,
|
||
|
centerY: options.cenrerY !== undefined ? options.cenrerY : false,
|
||
|
css: {
|
||
|
top: '10%',
|
||
|
border: '0',
|
||
|
padding: '0',
|
||
|
backgroundColor: 'none'
|
||
|
},
|
||
|
overlayCSS: {
|
||
|
backgroundColor: options.overlayColor ? options.overlayColor : '#555',
|
||
|
opacity: options.boxed ? 0.05 : 0.1,
|
||
|
cursor: 'wait'
|
||
|
}
|
||
|
});
|
||
|
} else { // page blocking
|
||
|
$.blockUI({
|
||
|
message: html,
|
||
|
baseZ: options.zIndex ? options.zIndex : 1000,
|
||
|
css: {
|
||
|
border: '0',
|
||
|
padding: '0',
|
||
|
backgroundColor: 'none'
|
||
|
},
|
||
|
overlayCSS: {
|
||
|
backgroundColor: options.overlayColor ? options.overlayColor : '#555',
|
||
|
opacity: options.boxed ? 0.05 : 0.1,
|
||
|
cursor: 'wait'
|
||
|
}
|
||
|
});
|
||
|
}
|
||
|
},
|
||
|
|
||
|
// wrApper function to un-block element(finish loading)
|
||
|
unblockUI: function (target) {
|
||
|
if (target) {
|
||
|
$(target).unblock({
|
||
|
onUnblock: function () {
|
||
|
$(target).css('position', '');
|
||
|
$(target).css('zoom', '');
|
||
|
|
||
|
}
|
||
|
});
|
||
|
} else {
|
||
|
$.unblockUI();
|
||
|
}
|
||
|
},
|
||
|
|
||
|
startPageLoading: function (options) {
|
||
|
if (options && options.animate) {
|
||
|
$('.page-spinner-bar').remove();
|
||
|
$('body').append('<div class="page-spinner-bar"><div class="bounce1"></div><div class="bounce2"></div><div class="bounce3"></div></div>');
|
||
|
} else {
|
||
|
$('.page-loading').remove();
|
||
|
$('body').append('<div class="page-loading"><img src="' + this.getGlobalImgPath() + 'loading/loading-spinner-grey.gif"/> <span>' + (options && options.message ? options.message : 'Loading...') + '</span></div>');
|
||
|
}
|
||
|
},
|
||
|
|
||
|
stopPageLoading: function () {
|
||
|
$('.page-loading, .page-spinner-bar').remove();
|
||
|
},
|
||
|
|
||
|
alert: function (options) {
|
||
|
|
||
|
options = $.extend(true, {
|
||
|
container: "", // alerts parent container(by default placed after the page breadcrumbs)
|
||
|
place: "append", // "append" or "prepend" in container
|
||
|
type: 'success', // alert's type
|
||
|
message: "", // alert's message
|
||
|
close: true, // make alert closable
|
||
|
reset: true, // close all previouse alerts first
|
||
|
focus: true, // auto scroll to the alert after shown
|
||
|
closeInSeconds: 0, // auto close after defined seconds
|
||
|
icon: "" // put icon before the message
|
||
|
}, options);
|
||
|
|
||
|
var id = App.getUniqueID("App_alert");
|
||
|
|
||
|
var html = '<div id="' + id + '" class="custom-alerts alert alert-' + options.type + ' fade in">' + (options.close ? '<button type="button" class="close" data-dismiss="alert" aria-hidden="true"></button>' : '') + (options.icon !== "" ? '<i class="fa-lg fa fa-' + options.icon + '"></i> ' : '') + options.message + '</div>';
|
||
|
|
||
|
if (options.reset) {
|
||
|
$('.custom-alerts').remove();
|
||
|
}
|
||
|
|
||
|
if (!options.container) {
|
||
|
if ($('.page-fixed-main-content').size() === 1) {
|
||
|
$('.page-fixed-main-content').prepend(html);
|
||
|
} else if (($('body').hasClass("page-container-bg-solid") || $('body').hasClass("page-content-white")) && $('.page-head').size() === 0) {
|
||
|
$('.page-title').after(html);
|
||
|
} else {
|
||
|
if ($('.page-bar').size() > 0) {
|
||
|
$('.page-bar').after(html);
|
||
|
} else {
|
||
|
$('.page-breadcrumb, .breadcrumbs').after(html);
|
||
|
}
|
||
|
}
|
||
|
} else {
|
||
|
if (options.place == "append") {
|
||
|
$(options.container).append(html);
|
||
|
} else {
|
||
|
$(options.container).prepend(html);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
if (options.focus) {
|
||
|
App.scrollTo($('#' + id));
|
||
|
}
|
||
|
|
||
|
if (options.closeInSeconds > 0) {
|
||
|
setTimeout(function () {
|
||
|
$('#' + id).remove();
|
||
|
}, options.closeInSeconds * 1000);
|
||
|
}
|
||
|
|
||
|
return id;
|
||
|
},
|
||
|
|
||
|
// initializes uniform elements
|
||
|
initUniform: function (els) {
|
||
|
if (els) {
|
||
|
$(els).each(function () {
|
||
|
if ($(this).parents(".checker").size() === 0) {
|
||
|
$(this).show();
|
||
|
$(this).uniform();
|
||
|
}
|
||
|
});
|
||
|
} else {
|
||
|
handleUniform();
|
||
|
}
|
||
|
},
|
||
|
|
||
|
//wrApper function to update/sync jquery uniform checkbox & radios
|
||
|
updateUniform: function (els) {
|
||
|
$.uniform.update(els); // update the uniform checkbox & radios UI after the actual input control state changed
|
||
|
},
|
||
|
|
||
|
//public function to initialize the fancybox plugin
|
||
|
initFancybox: function () {
|
||
|
handleFancybox();
|
||
|
},
|
||
|
|
||
|
//public helper function to get actual input value(used in IE9 and IE8 due to placeholder attribute not supported)
|
||
|
getActualVal: function (el) {
|
||
|
el = $(el);
|
||
|
if (el.val() === el.attr("placeholder")) {
|
||
|
return "";
|
||
|
}
|
||
|
return el.val();
|
||
|
},
|
||
|
|
||
|
//public function to get a paremeter by name from URL
|
||
|
getURLParameter: function (paramName) {
|
||
|
var searchString = window.location.search.substring(1),
|
||
|
i, val, params = searchString.split("&");
|
||
|
|
||
|
for (i = 0; i < params.length; i++) {
|
||
|
val = params[i].split("=");
|
||
|
if (val[0] == paramName) {
|
||
|
return unescape(val[1]);
|
||
|
}
|
||
|
}
|
||
|
return null;
|
||
|
},
|
||
|
|
||
|
// check for device touch support
|
||
|
isTouchDevice: function () {
|
||
|
try {
|
||
|
document.createEvent("TouchEvent");
|
||
|
return true;
|
||
|
} catch (e) {
|
||
|
return false;
|
||
|
}
|
||
|
},
|
||
|
|
||
|
// To get the correct viewport width based on http://andylangton.co.uk/articles/javascript/get-viewport-size-javascript/
|
||
|
getViewPort: function () {
|
||
|
var e = window,
|
||
|
a = 'inner';
|
||
|
if (!('innerWidth' in window)) {
|
||
|
a = 'client';
|
||
|
e = document.documentElement || document.body;
|
||
|
}
|
||
|
|
||
|
return {
|
||
|
width: e[a + 'Width'],
|
||
|
height: e[a + 'Height']
|
||
|
};
|
||
|
},
|
||
|
|
||
|
getUniqueID: function (prefix) {
|
||
|
return 'prefix_' + Math.floor(Math.random() * (new Date()).getTime());
|
||
|
},
|
||
|
|
||
|
// check IE8 mode
|
||
|
isIE8: function () {
|
||
|
return isIE8;
|
||
|
},
|
||
|
|
||
|
// check IE9 mode
|
||
|
isIE9: function () {
|
||
|
return isIE9;
|
||
|
},
|
||
|
|
||
|
//check RTL mode
|
||
|
isRTL: function () {
|
||
|
return isRTL;
|
||
|
},
|
||
|
|
||
|
// check IE8 mode
|
||
|
isAngularJsApp: function () {
|
||
|
return (typeof angular == 'undefined') ? false : true;
|
||
|
},
|
||
|
|
||
|
getbasePath: function () {
|
||
|
return basePath;
|
||
|
},
|
||
|
|
||
|
setbasePath: function (path) {
|
||
|
basePath = path;
|
||
|
},
|
||
|
|
||
|
setGlobalImgPath: function (path) {
|
||
|
globalImgPath = path;
|
||
|
},
|
||
|
|
||
|
getGlobalImgPath: function () {
|
||
|
return basePath + globalImgPath;
|
||
|
},
|
||
|
|
||
|
setGlobalPluginsPath: function (path) {
|
||
|
globalPluginsPath = path;
|
||
|
},
|
||
|
|
||
|
getGlobalPluginsPath: function () {
|
||
|
return basePath + globalPluginsPath;
|
||
|
},
|
||
|
|
||
|
getGlobalCssPath: function () {
|
||
|
return basePath + globalCssPath;
|
||
|
},
|
||
|
|
||
|
// get layout color code by color name
|
||
|
getBrandColor: function (name) {
|
||
|
if (brandColors[name]) {
|
||
|
return brandColors[name];
|
||
|
} else {
|
||
|
return '';
|
||
|
}
|
||
|
},
|
||
|
|
||
|
getResponsiveBreakpoint: function (size) {
|
||
|
// bootstrap responsive breakpoints
|
||
|
var sizes = {
|
||
|
'xs': 480, // extra small
|
||
|
'sm': 768, // small
|
||
|
'md': 992, // medium
|
||
|
'lg': 1200 // large
|
||
|
};
|
||
|
|
||
|
return sizes[size] ? sizes[size] : 0;
|
||
|
}
|
||
|
};
|
||
|
|
||
|
}();
|
||
|
|
||
|
jQuery(document).ready(function () {
|
||
|
//App.init(); // init metronic core componets
|
||
|
App.resize();
|
||
|
|
||
|
});
|
||
|
/*
|
||
|
* Context.js
|
||
|
* Copyright Jacob Kelley
|
||
|
* MIT License
|
||
|
*
|
||
|
* Modified by Joshua Christman
|
||
|
*/
|
||
|
|
||
|
context = (function () {
|
||
|
|
||
|
var options = {
|
||
|
fadeSpeed: 100,
|
||
|
filter: function ($obj) {
|
||
|
// Modify $obj, Do not return
|
||
|
},
|
||
|
above: 'auto',
|
||
|
left: 'auto',
|
||
|
preventDoubleContext: true,
|
||
|
compress: false
|
||
|
};
|
||
|
|
||
|
function initialize(opts) {
|
||
|
|
||
|
options = $.extend({}, options, opts);
|
||
|
|
||
|
$(document).on('click', function () {
|
||
|
$('.dropdown-context').fadeOut(options.fadeSpeed, function () {
|
||
|
$('.dropdown-context').css({display: ''}).find('.drop-left').removeClass('drop-left');
|
||
|
});
|
||
|
});
|
||
|
if (options.preventDoubleContext) {
|
||
|
$(document).on('contextmenu', '.dropdown-context', function (e) {
|
||
|
e.preventDefault();
|
||
|
});
|
||
|
}
|
||
|
$(document).on('mouseenter', '.dropdown-submenu', function () {
|
||
|
var $sub = $(this).find('.dropdown-context-sub:first'),
|
||
|
subWidth = $sub.width(),
|
||
|
subLeft = $sub.offset().left,
|
||
|
collision = (subWidth + subLeft) > window.innerWidth;
|
||
|
if (collision) {
|
||
|
$sub.addClass('drop-left');
|
||
|
}
|
||
|
});
|
||
|
|
||
|
}
|
||
|
|
||
|
function updateOptions(opts) {
|
||
|
options = $.extend({}, options, opts);
|
||
|
}
|
||
|
|
||
|
function buildMenu(data, id, subMenu) {
|
||
|
var subClass = (subMenu) ? ' dropdown-context-sub' : '',
|
||
|
compressed = options.compress ? ' compressed-context' : '',
|
||
|
$menu = $('<ul class="dropdown-menu dropdown-context' + subClass + compressed + '" id="dropdown-' + id + '"></ul>');
|
||
|
|
||
|
return buildMenuItems($menu, data, id, subMenu);
|
||
|
}
|
||
|
|
||
|
function buildMenuItems($menu, data, id, subMenu, addDynamicTag) {
|
||
|
var linkTarget = '';
|
||
|
for (var i = 0; i < data.length; i++) {
|
||
|
if (typeof data[i].divider !== 'undefined') {
|
||
|
var divider = '<li class="divider';
|
||
|
divider += (addDynamicTag) ? ' dynamic-menu-item' : '';
|
||
|
divider += '"></li>';
|
||
|
$menu.append(divider);
|
||
|
} else if (typeof data[i].header !== 'undefined') {
|
||
|
var header = '<li class="nav-header';
|
||
|
header += (addDynamicTag) ? ' dynamic-menu-item' : '';
|
||
|
header += '">' + data[i].header + '</li>';
|
||
|
$menu.append(header);
|
||
|
} else if (typeof data[i].menu_item_src !== 'undefined') {
|
||
|
var funcName;
|
||
|
if (typeof data[i].menu_item_src === 'function') {
|
||
|
if (data[i].menu_item_src.name === "") { // The function is declared like "foo = function() {}"
|
||
|
for (var globalVar in window) {
|
||
|
if (data[i].menu_item_src == window[globalVar]) {
|
||
|
funcName = globalVar;
|
||
|
break;
|
||
|
}
|
||
|
}
|
||
|
} else {
|
||
|
funcName = data[i].menu_item_src.name;
|
||
|
}
|
||
|
} else {
|
||
|
funcName = data[i].menu_item_src;
|
||
|
}
|
||
|
$menu.append('<li class="dynamic-menu-src" data-src="' + funcName + '"></li>');
|
||
|
} else {
|
||
|
if (typeof data[i].href == 'undefined') {
|
||
|
data[i].href = '#';
|
||
|
}
|
||
|
if (typeof data[i].target !== 'undefined') {
|
||
|
linkTarget = ' target="' + data[i].target + '"';
|
||
|
}
|
||
|
if (typeof data[i].subMenu !== 'undefined') {
|
||
|
var sub_menu = '<li class="dropdown-submenu';
|
||
|
sub_menu += (addDynamicTag) ? ' dynamic-menu-item' : '';
|
||
|
sub_menu += '"><a tabindex="-1" href="' + data[i].href + '">' + data[i].text + '</a></li>'
|
||
|
$sub = (sub_menu);
|
||
|
} else {
|
||
|
var element = '<li';
|
||
|
element += (addDynamicTag) ? ' class="dynamic-menu-item"' : '';
|
||
|
element += '><a tabindex="-1" href="' + data[i].href + '"' + linkTarget + '>';
|
||
|
if (typeof data[i].icon !== 'undefined')
|
||
|
element += '<span class="glyphicon ' + data[i].icon + '"></span> ';
|
||
|
element += data[i].text + '</a></li>';
|
||
|
$sub = $(element);
|
||
|
}
|
||
|
if (typeof data[i].action !== 'undefined') {
|
||
|
$action = data[i].action;
|
||
|
$sub
|
||
|
.find('a')
|
||
|
.addClass('context-event')
|
||
|
.on('click', createCallback($action));
|
||
|
}
|
||
|
$menu.append($sub);
|
||
|
if (typeof data[i].subMenu != 'undefined') {
|
||
|
var subMenuData = buildMenu(data[i].subMenu, id, true);
|
||
|
$menu.find('li:last').append(subMenuData);
|
||
|
}
|
||
|
}
|
||
|
if (typeof options.filter == 'function') {
|
||
|
options.filter($menu.find('li:last'));
|
||
|
}
|
||
|
}
|
||
|
return $menu;
|
||
|
}
|
||
|
|
||
|
function addContext(selector, data) {
|
||
|
if (typeof data.id !== 'undefined' && typeof data.data !== 'undefined') {
|
||
|
var id = data.id;
|
||
|
$menu = $('body').find('#dropdown-' + id)[0];
|
||
|
if (typeof $menu === 'undefined') {
|
||
|
$menu = buildMenu(data.data, id);
|
||
|
$('body').append($menu);
|
||
|
}
|
||
|
} else {
|
||
|
var d = new Date(),
|
||
|
id = d.getTime(),
|
||
|
$menu = buildMenu(data, id);
|
||
|
$('body').append($menu);
|
||
|
}
|
||
|
|
||
|
//右键事件
|
||
|
$(selector).on('contextmenu', function (e) {
|
||
|
e.preventDefault();
|
||
|
e.stopPropagation();
|
||
|
|
||
|
rightClickEvent = e;
|
||
|
currentContextSelector = $(this);
|
||
|
|
||
|
$('.dropdown-context:not(.dropdown-context-sub)').hide();
|
||
|
|
||
|
$dd = $('#dropdown-' + id);
|
||
|
|
||
|
$dd.find('.dynamic-menu-item').remove(); // Destroy any old dynamic menu items
|
||
|
$dd.find('.dynamic-menu-src').each(function (idx, element) {
|
||
|
var menuItems = window[$(element).data('src')]($(selector));
|
||
|
$parentMenu = $(element).closest('.dropdown-menu.dropdown-context');
|
||
|
$parentMenu = buildMenuItems($parentMenu, menuItems, id, undefined, true);
|
||
|
});
|
||
|
|
||
|
if (typeof options.above == 'boolean' && options.above) {
|
||
|
$dd.addClass('dropdown-context-up').css({
|
||
|
top: e.pageY - 20 - $('#dropdown-' + id).height(),
|
||
|
left: e.pageX - 13
|
||
|
}).fadeIn(options.fadeSpeed);
|
||
|
} else if (typeof options.above == 'string' && options.above == 'auto') {
|
||
|
$dd.removeClass('dropdown-context-up');
|
||
|
var autoH = $dd.height() + 12;
|
||
|
if ((e.pageY + autoH) > $('html').height()) {
|
||
|
$dd.addClass('dropdown-context-up').css({
|
||
|
top: e.pageY - 20 - autoH,
|
||
|
left: e.pageX - 13
|
||
|
}).fadeIn(options.fadeSpeed);
|
||
|
} else {
|
||
|
$dd.css({
|
||
|
top: e.pageY + 10,
|
||
|
left: e.pageX - 13
|
||
|
}).fadeIn(options.fadeSpeed);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
if (typeof options.left == 'boolean' && options.left) {
|
||
|
$dd.addClass('dropdown-context-left').css({
|
||
|
left: e.pageX - $dd.width()
|
||
|
}).fadeIn(options.fadeSpeed);
|
||
|
} else if (typeof options.left == 'string' && options.left == 'auto') {
|
||
|
$dd.removeClass('dropdown-context-left');
|
||
|
var autoL = $dd.width() - 12;
|
||
|
if ((e.pageX + autoL) > $('html').width()) {
|
||
|
$dd.addClass('dropdown-context-left').css({
|
||
|
left: e.pageX - $dd.width() + 13
|
||
|
});
|
||
|
}
|
||
|
}
|
||
|
});
|
||
|
}
|
||
|
|
||
|
function destroyContext(selector) {
|
||
|
$(document).off('contextmenu', selector).off('click', '.context-event');
|
||
|
}
|
||
|
|
||
|
return {
|
||
|
init: initialize,
|
||
|
settings: updateOptions,
|
||
|
attach: addContext,
|
||
|
destroy: destroyContext
|
||
|
};
|
||
|
})();
|
||
|
|
||
|
var createCallback = function (func) {
|
||
|
return function (event) {
|
||
|
func(event, currentContextSelector,rightClickEvent)
|
||
|
};
|
||
|
};
|
||
|
|
||
|
var currentContextSelector = undefined;
|
||
|
var rightClickEvent = undefined;
|
||
|
|
||
|
/*! Copyright (c) 2011 Piotr Rochala (http://rocha.la)
|
||
|
* Dual licensed under the MIT (http://www.opensource.org/licenses/mit-license.php)
|
||
|
* and GPL (http://www.opensource.org/licenses/gpl-license.php) licenses.
|
||
|
*
|
||
|
* Version: 1.3.8
|
||
|
*
|
||
|
*/
|
||
|
(function($) {
|
||
|
|
||
|
$.fn.extend({
|
||
|
slimScroll: function(options) {
|
||
|
|
||
|
var defaults = {
|
||
|
|
||
|
// width in pixels of the visible scroll area
|
||
|
width : 'auto',
|
||
|
|
||
|
// height in pixels of the visible scroll area
|
||
|
height : '250px',
|
||
|
|
||
|
// width in pixels of the scrollbar and rail
|
||
|
size : '7px',
|
||
|
|
||
|
// scrollbar color, accepts any hex/color value
|
||
|
color: '#000',
|
||
|
|
||
|
// scrollbar position - left/right
|
||
|
position : 'right',
|
||
|
|
||
|
// distance in pixels between the side edge and the scrollbar
|
||
|
distance : '1px',
|
||
|
|
||
|
// default scroll position on load - top / bottom / $('selector')
|
||
|
start : 'top',
|
||
|
|
||
|
// sets scrollbar opacity
|
||
|
opacity : .4,
|
||
|
|
||
|
// enables always-on mode for the scrollbar
|
||
|
alwaysVisible : false,
|
||
|
|
||
|
// check if we should hide the scrollbar when user is hovering over
|
||
|
disableFadeOut : false,
|
||
|
|
||
|
// sets visibility of the rail
|
||
|
railVisible : false,
|
||
|
|
||
|
// sets rail color
|
||
|
railColor : '#333',
|
||
|
|
||
|
// sets rail opacity
|
||
|
railOpacity : .2,
|
||
|
|
||
|
// whether we should use jQuery UI Draggable to enable bar dragging
|
||
|
railDraggable : true,
|
||
|
|
||
|
// defautlt CSS class of the slimscroll rail
|
||
|
railClass : 'slimScrollRail',
|
||
|
|
||
|
// defautlt CSS class of the slimscroll bar
|
||
|
barClass : 'slimScrollBar',
|
||
|
|
||
|
// defautlt CSS class of the slimscroll wrapper
|
||
|
wrapperClass : 'slimScrollDiv',
|
||
|
|
||
|
// check if mousewheel should scroll the window if we reach top/bottom
|
||
|
allowPageScroll : false,
|
||
|
|
||
|
// scroll amount applied to each mouse wheel step
|
||
|
wheelStep : 20,
|
||
|
|
||
|
// scroll amount applied when user is using gestures
|
||
|
touchScrollStep : 200,
|
||
|
|
||
|
// sets border radius
|
||
|
borderRadius: '7px',
|
||
|
|
||
|
// sets border radius of the rail
|
||
|
railBorderRadius : '7px'
|
||
|
};
|
||
|
|
||
|
var o = $.extend(defaults, options);
|
||
|
|
||
|
// do it for every element that matches selector
|
||
|
this.each(function(){
|
||
|
|
||
|
var isOverPanel, isOverBar, isDragg, queueHide, touchDif,
|
||
|
barHeight, percentScroll, lastScroll,
|
||
|
divS = '<div></div>',
|
||
|
minBarHeight = 30,
|
||
|
releaseScroll = false;
|
||
|
|
||
|
// used in event handlers and for better minification
|
||
|
var me = $(this);
|
||
|
|
||
|
// ensure we are not binding it again
|
||
|
if (me.parent().hasClass(o.wrapperClass))
|
||
|
{
|
||
|
// start from last bar position
|
||
|
var offset = me.scrollTop();
|
||
|
|
||
|
// find bar and rail
|
||
|
bar = me.siblings('.' + o.barClass);
|
||
|
rail = me.siblings('.' + o.railClass);
|
||
|
|
||
|
getBarHeight();
|
||
|
|
||
|
// check if we should scroll existing instance
|
||
|
if ($.isPlainObject(options))
|
||
|
{
|
||
|
// Pass height: auto to an existing slimscroll object to force a resize after contents have changed
|
||
|
if ( 'height' in options && options.height == 'auto' ) {
|
||
|
me.parent().css('height', 'auto');
|
||
|
me.css('height', 'auto');
|
||
|
var height = me.parent().parent().height();
|
||
|
me.parent().css('height', height);
|
||
|
me.css('height', height);
|
||
|
} else if ('height' in options) {
|
||
|
var h = options.height;
|
||
|
me.parent().css('height', h);
|
||
|
me.css('height', h);
|
||
|
}
|
||
|
|
||
|
if ('scrollTo' in options)
|
||
|
{
|
||
|
// jump to a static point
|
||
|
offset = parseInt(o.scrollTo);
|
||
|
}
|
||
|
else if ('scrollBy' in options)
|
||
|
{
|
||
|
// jump by value pixels
|
||
|
offset += parseInt(o.scrollBy);
|
||
|
}
|
||
|
else if ('destroy' in options)
|
||
|
{
|
||
|
// remove slimscroll elements
|
||
|
bar.remove();
|
||
|
rail.remove();
|
||
|
me.unwrap();
|
||
|
return;
|
||
|
}
|
||
|
|
||
|
// scroll content by the given offset
|
||
|
scrollContent(offset, false, true);
|
||
|
}
|
||
|
|
||
|
return;
|
||
|
}
|
||
|
else if ($.isPlainObject(options))
|
||
|
{
|
||
|
if ('destroy' in options)
|
||
|
{
|
||
|
return;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
// optionally set height to the parent's height
|
||
|
o.height = (o.height == 'auto') ? me.parent().height() : o.height;
|
||
|
|
||
|
// wrap content
|
||
|
var wrapper = $(divS)
|
||
|
.addClass(o.wrapperClass)
|
||
|
.css({
|
||
|
position: 'relative',
|
||
|
overflow: 'hidden',
|
||
|
width: o.width,
|
||
|
height: o.height
|
||
|
});
|
||
|
|
||
|
// update style for the div
|
||
|
me.css({
|
||
|
overflow: 'hidden',
|
||
|
width: o.width,
|
||
|
height: o.height
|
||
|
});
|
||
|
|
||
|
// create scrollbar rail
|
||
|
var rail = $(divS)
|
||
|
.addClass(o.railClass)
|
||
|
.css({
|
||
|
width: o.size,
|
||
|
height: '100%',
|
||
|
position: 'absolute',
|
||
|
top: 0,
|
||
|
display: (o.alwaysVisible && o.railVisible) ? 'block' : 'none',
|
||
|
'border-radius': o.railBorderRadius,
|
||
|
background: o.railColor,
|
||
|
opacity: o.railOpacity,
|
||
|
zIndex: 90
|
||
|
});
|
||
|
|
||
|
// create scrollbar
|
||
|
var bar = $(divS)
|
||
|
.addClass(o.barClass)
|
||
|
.css({
|
||
|
background: o.color,
|
||
|
width: o.size,
|
||
|
position: 'absolute',
|
||
|
top: 0,
|
||
|
opacity: o.opacity,
|
||
|
display: o.alwaysVisible ? 'block' : 'none',
|
||
|
'border-radius' : o.borderRadius,
|
||
|
BorderRadius: o.borderRadius,
|
||
|
MozBorderRadius: o.borderRadius,
|
||
|
WebkitBorderRadius: o.borderRadius,
|
||
|
zIndex: 99
|
||
|
});
|
||
|
|
||
|
// set position
|
||
|
var posCss = (o.position == 'right') ? { right: o.distance } : { left: o.distance };
|
||
|
rail.css(posCss);
|
||
|
bar.css(posCss);
|
||
|
|
||
|
// wrap it
|
||
|
me.wrap(wrapper);
|
||
|
|
||
|
// append to parent div
|
||
|
me.parent().append(bar);
|
||
|
me.parent().append(rail);
|
||
|
|
||
|
// make it draggable and no longer dependent on the jqueryUI
|
||
|
if (o.railDraggable){
|
||
|
bar.bind("mousedown", function(e) {
|
||
|
var $doc = $(document);
|
||
|
isDragg = true;
|
||
|
t = parseFloat(bar.css('top'));
|
||
|
pageY = e.pageY;
|
||
|
|
||
|
$doc.bind("mousemove.slimscroll", function(e){
|
||
|
currTop = t + e.pageY - pageY;
|
||
|
bar.css('top', currTop);
|
||
|
scrollContent(0, bar.position().top, false);// scroll content
|
||
|
});
|
||
|
|
||
|
$doc.bind("mouseup.slimscroll", function(e) {
|
||
|
isDragg = false;hideBar();
|
||
|
$doc.unbind('.slimscroll');
|
||
|
});
|
||
|
return false;
|
||
|
}).bind("selectstart.slimscroll", function(e){
|
||
|
e.stopPropagation();
|
||
|
e.preventDefault();
|
||
|
return false;
|
||
|
});
|
||
|
}
|
||
|
|
||
|
// on rail over
|
||
|
rail.hover(function(){
|
||
|
showBar();
|
||
|
}, function(){
|
||
|
hideBar();
|
||
|
});
|
||
|
|
||
|
// on bar over
|
||
|
bar.hover(function(){
|
||
|
isOverBar = true;
|
||
|
}, function(){
|
||
|
isOverBar = false;
|
||
|
});
|
||
|
|
||
|
// show on parent mouseover
|
||
|
me.hover(function(){
|
||
|
isOverPanel = true;
|
||
|
showBar();
|
||
|
hideBar();
|
||
|
}, function(){
|
||
|
isOverPanel = false;
|
||
|
hideBar();
|
||
|
});
|
||
|
|
||
|
// support for mobile
|
||
|
me.bind('touchstart', function(e,b){
|
||
|
if (e.originalEvent.touches.length)
|
||
|
{
|
||
|
// record where touch started
|
||
|
touchDif = e.originalEvent.touches[0].pageY;
|
||
|
}
|
||
|
});
|
||
|
|
||
|
me.bind('touchmove', function(e){
|
||
|
// prevent scrolling the page if necessary
|
||
|
if(!releaseScroll)
|
||
|
{
|
||
|
e.originalEvent.preventDefault();
|
||
|
}
|
||
|
if (e.originalEvent.touches.length)
|
||
|
{
|
||
|
// see how far user swiped
|
||
|
var diff = (touchDif - e.originalEvent.touches[0].pageY) / o.touchScrollStep;
|
||
|
// scroll content
|
||
|
scrollContent(diff, true);
|
||
|
touchDif = e.originalEvent.touches[0].pageY;
|
||
|
}
|
||
|
});
|
||
|
|
||
|
// set up initial height
|
||
|
getBarHeight();
|
||
|
|
||
|
// check start position
|
||
|
if (o.start === 'bottom')
|
||
|
{
|
||
|
// scroll content to bottom
|
||
|
bar.css({ top: me.outerHeight() - bar.outerHeight() });
|
||
|
scrollContent(0, true);
|
||
|
}
|
||
|
else if (o.start !== 'top')
|
||
|
{
|
||
|
// assume jQuery selector
|
||
|
scrollContent($(o.start).position().top, null, true);
|
||
|
|
||
|
// make sure bar stays hidden
|
||
|
if (!o.alwaysVisible) { bar.hide(); }
|
||
|
}
|
||
|
|
||
|
// attach scroll events
|
||
|
attachWheel(this);
|
||
|
|
||
|
function _onWheel(e)
|
||
|
{
|
||
|
// use mouse wheel only when mouse is over
|
||
|
if (!isOverPanel) { return; }
|
||
|
|
||
|
var e = e || window.event;
|
||
|
|
||
|
var delta = 0;
|
||
|
if (e.wheelDelta) { delta = -e.wheelDelta/120; }
|
||
|
if (e.detail) { delta = e.detail / 3; }
|
||
|
|
||
|
var target = e.target || e.srcTarget || e.srcElement;
|
||
|
if ($(target).closest('.' + o.wrapperClass).is(me.parent())) {
|
||
|
// scroll content
|
||
|
scrollContent(delta, true);
|
||
|
}
|
||
|
|
||
|
// stop window scroll
|
||
|
if (e.preventDefault && !releaseScroll) { e.preventDefault(); }
|
||
|
if (!releaseScroll) { e.returnValue = false; }
|
||
|
}
|
||
|
|
||
|
function scrollContent(y, isWheel, isJump)
|
||
|
{
|
||
|
releaseScroll = false;
|
||
|
var delta = y;
|
||
|
var maxTop = me.outerHeight() - bar.outerHeight();
|
||
|
|
||
|
if (isWheel)
|
||
|
{
|
||
|
// move bar with mouse wheel
|
||
|
delta = parseInt(bar.css('top')) + y * parseInt(o.wheelStep) / 100 * bar.outerHeight();
|
||
|
|
||
|
// move bar, make sure it doesn't go out
|
||
|
delta = Math.min(Math.max(delta, 0), maxTop);
|
||
|
|
||
|
// if scrolling down, make sure a fractional change to the
|
||
|
// scroll position isn't rounded away when the scrollbar's CSS is set
|
||
|
// this flooring of delta would happened automatically when
|
||
|
// bar.css is set below, but we floor here for clarity
|
||
|
delta = (y > 0) ? Math.ceil(delta) : Math.floor(delta);
|
||
|
|
||
|
// scroll the scrollbar
|
||
|
bar.css({ top: delta + 'px' });
|
||
|
}
|
||
|
|
||
|
// calculate actual scroll amount
|
||
|
percentScroll = parseInt(bar.css('top')) / (me.outerHeight() - bar.outerHeight());
|
||
|
delta = percentScroll * (me[0].scrollHeight - me.outerHeight());
|
||
|
|
||
|
if (isJump)
|
||
|
{
|
||
|
delta = y;
|
||
|
var offsetTop = delta / me[0].scrollHeight * me.outerHeight();
|
||
|
offsetTop = Math.min(Math.max(offsetTop, 0), maxTop);
|
||
|
bar.css({ top: offsetTop + 'px' });
|
||
|
}
|
||
|
|
||
|
// scroll content
|
||
|
me.scrollTop(delta);
|
||
|
|
||
|
// fire scrolling event
|
||
|
me.trigger('slimscrolling', ~~delta);
|
||
|
|
||
|
// ensure bar is visible
|
||
|
showBar();
|
||
|
|
||
|
// trigger hide when scroll is stopped
|
||
|
hideBar();
|
||
|
}
|
||
|
|
||
|
function attachWheel(target)
|
||
|
{
|
||
|
if (window.addEventListener)
|
||
|
{
|
||
|
target.addEventListener('DOMMouseScroll', _onWheel, false );
|
||
|
target.addEventListener('mousewheel', _onWheel, false );
|
||
|
}
|
||
|
else
|
||
|
{
|
||
|
document.attachEvent("onmousewheel", _onWheel)
|
||
|
}
|
||
|
}
|
||
|
|
||
|
function getBarHeight()
|
||
|
{
|
||
|
// calculate scrollbar height and make sure it is not too small
|
||
|
barHeight = Math.max((me.outerHeight() / me[0].scrollHeight) * me.outerHeight(), minBarHeight);
|
||
|
bar.css({ height: barHeight + 'px' });
|
||
|
|
||
|
// hide scrollbar if content is not long enough
|
||
|
var display = barHeight == me.outerHeight() ? 'none' : 'block';
|
||
|
bar.css({ display: display });
|
||
|
}
|
||
|
|
||
|
function showBar()
|
||
|
{
|
||
|
// recalculate bar height
|
||
|
getBarHeight();
|
||
|
clearTimeout(queueHide);
|
||
|
|
||
|
// when bar reached top or bottom
|
||
|
if (percentScroll == ~~percentScroll)
|
||
|
{
|
||
|
//release wheel
|
||
|
releaseScroll = o.allowPageScroll;
|
||
|
|
||
|
// publish approporiate event
|
||
|
if (lastScroll != percentScroll)
|
||
|
{
|
||
|
var msg = (~~percentScroll == 0) ? 'top' : 'bottom';
|
||
|
me.trigger('slimscroll', msg);
|
||
|
}
|
||
|
}
|
||
|
else
|
||
|
{
|
||
|
releaseScroll = false;
|
||
|
}
|
||
|
lastScroll = percentScroll;
|
||
|
|
||
|
// show only when required
|
||
|
if(barHeight >= me.outerHeight()) {
|
||
|
//allow window scroll
|
||
|
releaseScroll = true;
|
||
|
return;
|
||
|
}
|
||
|
bar.stop(true,true).fadeIn('fast');
|
||
|
if (o.railVisible) { rail.stop(true,true).fadeIn('fast'); }
|
||
|
}
|
||
|
|
||
|
function hideBar()
|
||
|
{
|
||
|
// only hide when options allow it
|
||
|
if (!o.alwaysVisible)
|
||
|
{
|
||
|
queueHide = setTimeout(function(){
|
||
|
if (!(o.disableFadeOut && isOverPanel) && !isOverBar && !isDragg)
|
||
|
{
|
||
|
bar.fadeOut('slow');
|
||
|
rail.fadeOut('slow');
|
||
|
}
|
||
|
}, 1000);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
});
|
||
|
|
||
|
// maintain chainability
|
||
|
return this;
|
||
|
}
|
||
|
});
|
||
|
|
||
|
$.fn.extend({
|
||
|
slimscroll: $.fn.slimScroll
|
||
|
});
|
||
|
|
||
|
})(jQuery);
|
||
|
|
||
|
//保存页面id的field
|
||
|
var pageIdField = "data-pageId";
|
||
|
|
||
|
function getPageId(element) {
|
||
|
if (element instanceof jQuery) {
|
||
|
return element.attr(pageIdField);
|
||
|
} else {
|
||
|
return $(element).attr(pageIdField);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
function findTabTitle(pageId) {
|
||
|
var $ele = null;
|
||
|
$(".page-tabs-content").find("a.menu_tab").each(function () {
|
||
|
var $a = $(this);
|
||
|
if ($a.attr(pageIdField) == pageId) {
|
||
|
$ele = $a;
|
||
|
return false;//退出循环
|
||
|
}
|
||
|
});
|
||
|
return $ele;
|
||
|
}
|
||
|
|
||
|
function findTabPanel(pageId) {
|
||
|
var $ele = null;
|
||
|
$("#tab-content").find("div.tab-pane").each(function () {
|
||
|
var $div = $(this);
|
||
|
if ($div.attr(pageIdField) == pageId) {
|
||
|
$ele = $div;
|
||
|
return false;//退出循环
|
||
|
}
|
||
|
});
|
||
|
return $ele;
|
||
|
}
|
||
|
|
||
|
function findIframeById(pageId) {
|
||
|
return findTabPanel(pageId).children("iframe");
|
||
|
}
|
||
|
|
||
|
function getActivePageId() {
|
||
|
var $a = $('.page-tabs-content').find('.active');
|
||
|
return getPageId($a);
|
||
|
}
|
||
|
|
||
|
function canRemoveTab(pageId) {
|
||
|
return findTabTitle(pageId).find('.fa-remove').length > 0;
|
||
|
}
|
||
|
|
||
|
//添加tab
|
||
|
var addTabs = function (options) {
|
||
|
var defaultTabOptions = {
|
||
|
id: Math.random() * 200,
|
||
|
urlType: "relative",
|
||
|
title: "新页面"
|
||
|
};
|
||
|
|
||
|
options = $.extend(true, defaultTabOptions, options);
|
||
|
|
||
|
if (options.urlType === "relative") {
|
||
|
// var url = window.location.protocol + '//' + window.location.host + "/";
|
||
|
var basePath = window.location.pathname + "/../";
|
||
|
options.url = basePath + options.url;
|
||
|
}
|
||
|
|
||
|
var pageId = options.id;
|
||
|
|
||
|
//判断这个id的tab是否已经存在,不存在就新建一个
|
||
|
if (findTabPanel(pageId) === null) {
|
||
|
|
||
|
//创建新TAB的title
|
||
|
// title = '<a id="tab_' + pageId + '" data-id="' + pageId + '" class="menu_tab" >';
|
||
|
|
||
|
var $title = $('<a href="javascript:void(0);"></a>').attr(pageIdField, pageId).addClass("menu_tab");
|
||
|
|
||
|
var $text = $("<span class='page_tab_title'></span>").text(options.title).appendTo($title);
|
||
|
// title += '<span class="page_tab_title">' + options.title + '</span>';
|
||
|
|
||
|
//是否允许关闭
|
||
|
if (options.close) {
|
||
|
var $i = $("<i class='fa fa-remove page_tab_close' style='cursor: pointer' onclick='closeTab(this);'></i>").attr(pageIdField, pageId).appendTo($title);
|
||
|
// title += ' <i class="fa fa-remove page_tab_close" style="cursor: pointer;" data-id="' + pageId + '" onclick="closeTab(this)"></i>';
|
||
|
}
|
||
|
|
||
|
//加入TABS
|
||
|
$(".page-tabs-content").append($title);
|
||
|
|
||
|
|
||
|
var $tabPanel = $('<div role="tabpanel" class="tab-pane"></div>').attr(pageIdField, pageId);
|
||
|
|
||
|
if (options.content) {
|
||
|
//是否指定TAB内容
|
||
|
$tabPanel.append(options.content);
|
||
|
} else {
|
||
|
//没有内容,使用IFRAME打开链接
|
||
|
|
||
|
App.blockUI({
|
||
|
target: '#tab-content',
|
||
|
boxed: true,
|
||
|
message: '加载中......'//,
|
||
|
// animate: true
|
||
|
});
|
||
|
|
||
|
var $iframe = $("<iframe></iframe>").attr("src", options.url).css("width", "100%").attr("frameborder", "no").attr("id", "iframe_" + pageId).addClass("tab_iframe").attr(pageIdField, pageId);
|
||
|
//frameborder="no" border="0" marginwidth="0" marginheight="0" scrolling="yes" allowtransparency="yes"
|
||
|
|
||
|
//iframe 加载完成事件
|
||
|
//$iframe.load(function () {
|
||
|
// App.unblockUI('#tab-content');//解锁界面
|
||
|
// App.fixIframeCotent();//修正高度
|
||
|
//});
|
||
|
//$().load改成$().on('load',function(){})
|
||
|
$iframe.on('load',function () {
|
||
|
App.unblockUI('#tab-content');//解锁界面
|
||
|
App.fixIframeCotent();//修正高度
|
||
|
});
|
||
|
|
||
|
$tabPanel.append($iframe);
|
||
|
|
||
|
}
|
||
|
|
||
|
// $tab = $(content);
|
||
|
$("#tab-content").append($tabPanel);
|
||
|
|
||
|
//iframe 加载完成事件
|
||
|
/*$tab.find("iframe").load(function () {
|
||
|
App.fixIframeCotent();
|
||
|
});*/
|
||
|
}
|
||
|
|
||
|
activeTabByPageId(pageId);
|
||
|
|
||
|
};
|
||
|
|
||
|
//关闭tab
|
||
|
var closeTab = function (item) {
|
||
|
//item可以是a标签,也可以是i标签
|
||
|
//它们都有data-id属性,获取完成之后就没事了
|
||
|
var pageId = getPageId(item);
|
||
|
closeTabByPageId(pageId);
|
||
|
};
|
||
|
|
||
|
function closeTabByPageId(pageId) {
|
||
|
var $title = findTabTitle(pageId);//有tab的标题
|
||
|
var $tabPanel = findTabPanel(pageId);//装有iframe
|
||
|
|
||
|
if ($title.hasClass("active")) {
|
||
|
//要关闭的tab处于活动状态
|
||
|
//要把active class传递给其它tab
|
||
|
|
||
|
//优先传递给后面的tab,没有的话就传递给前一个
|
||
|
var $nextTitle = $title.next();
|
||
|
var activePageId;
|
||
|
if ($nextTitle.length > 0) {
|
||
|
activePageId = getPageId($nextTitle);
|
||
|
} else {
|
||
|
activePageId = getPageId($title.prev());
|
||
|
}
|
||
|
|
||
|
setTimeout(function () {
|
||
|
//某种bug,需要延迟执行
|
||
|
activeTabByPageId(activePageId);
|
||
|
}, 100);
|
||
|
|
||
|
} else {
|
||
|
//要关闭的tab不处于活动状态
|
||
|
//直接移除就可以了,不用传active class
|
||
|
|
||
|
}
|
||
|
|
||
|
$title.remove();
|
||
|
$tabPanel.remove();
|
||
|
// scrollToTab($('.menu_tab.active')[0]);
|
||
|
|
||
|
}
|
||
|
|
||
|
function closeTabOnly(pageId) {
|
||
|
var $title = findTabTitle(pageId);//有tab的标题
|
||
|
var $tabPanel = findTabPanel(pageId);//装有iframe
|
||
|
$title.remove();
|
||
|
$tabPanel.remove();
|
||
|
}
|
||
|
|
||
|
var closeCurrentTab = function () {
|
||
|
var pageId = getActivePageId();
|
||
|
if (canRemoveTab(pageId)) {
|
||
|
closeTabByPageId(pageId);
|
||
|
}
|
||
|
};
|
||
|
|
||
|
function refreshTabById(pageId) {
|
||
|
var $iframe = findIframeById(pageId);
|
||
|
var url = $iframe.attr('src');
|
||
|
|
||
|
if (url.indexOf(top.document.domain) < 0) {
|
||
|
$iframe.attr("src", url);// 跨域状况下,重新设置url
|
||
|
} else {
|
||
|
$iframe[0].contentWindow.location.reload(true);//带参数刷新
|
||
|
}
|
||
|
|
||
|
App.blockUI({
|
||
|
target: '#tab-content',
|
||
|
boxed: true,
|
||
|
message: '加载中......'//,
|
||
|
// animate: true
|
||
|
});
|
||
|
}
|
||
|
|
||
|
var refreshTab = function () {
|
||
|
//刷新当前tab
|
||
|
var pageId = getActivePageId();
|
||
|
refreshTabById(pageId);
|
||
|
};
|
||
|
|
||
|
function getTabUrlById(pageId) {
|
||
|
var $iframe = findIframeById(pageId);
|
||
|
return $iframe[0].contentWindow.location.href;
|
||
|
}
|
||
|
|
||
|
function getTabUrl(element) {
|
||
|
var pageId = getPageId(element);
|
||
|
getTabUrlById(pageId);
|
||
|
}
|
||
|
|
||
|
|
||
|
/**
|
||
|
* 编辑tab的标题
|
||
|
* @param pageId
|
||
|
* @param title
|
||
|
*/
|
||
|
function editTabTitle(pageId, title) {
|
||
|
var $title = findTabTitle(pageId);//有tab的标题
|
||
|
var $span = $title.children("span.page_tab_title");
|
||
|
$span.text(title);
|
||
|
}
|
||
|
|
||
|
//计算多个jq对象的宽度和
|
||
|
var calSumWidth = function (element) {
|
||
|
var width = 0;
|
||
|
$(element).each(function () {
|
||
|
width += $(this).outerWidth(true);
|
||
|
});
|
||
|
return width;
|
||
|
};
|
||
|
//滚动到指定选项卡
|
||
|
var scrollToTab = function (element) {
|
||
|
//element是tab(a标签),装有标题那个
|
||
|
//div.content-tabs > div.page-tabs-content
|
||
|
var marginLeftVal = calSumWidth($(element).prevAll()),//前面所有tab的总宽度
|
||
|
marginRightVal = calSumWidth($(element).nextAll());//后面所有tab的总宽度
|
||
|
//一些按钮(向左,向右滑动)的总宽度
|
||
|
var tabOuterWidth = calSumWidth($(".content-tabs").children().not(".menuTabs"));
|
||
|
// tab(a标签)显示区域的总宽度
|
||
|
var visibleWidth = $(".content-tabs").outerWidth(true) - tabOuterWidth;
|
||
|
//将要滚动的长度
|
||
|
var scrollVal = 0;
|
||
|
if ($(".page-tabs-content").outerWidth() < visibleWidth) {
|
||
|
//所有的tab都可以显示的情况
|
||
|
scrollVal = 0;
|
||
|
} else if (marginRightVal <= (visibleWidth - $(element).outerWidth(true) - $(element).next().outerWidth(true))) {
|
||
|
//向右滚动
|
||
|
//marginRightVal(后面所有tab的总宽度)小于可视区域-(当前tab和下一个tab的宽度)
|
||
|
if ((visibleWidth - $(element).next().outerWidth(true)) > marginRightVal) {
|
||
|
scrollVal = marginLeftVal;
|
||
|
var tabElement = element;
|
||
|
while ((scrollVal - $(tabElement).outerWidth()) > ($(".page-tabs-content").outerWidth() - visibleWidth)) {
|
||
|
scrollVal -= $(tabElement).prev().outerWidth();
|
||
|
tabElement = $(tabElement).prev();
|
||
|
}
|
||
|
}
|
||
|
} else if (marginLeftVal > (visibleWidth - $(element).outerWidth(true) - $(element).prev().outerWidth(true))) {
|
||
|
//向左滚动
|
||
|
scrollVal = marginLeftVal - $(element).prev().outerWidth(true);
|
||
|
}
|
||
|
//执行动画
|
||
|
$('.page-tabs-content').animate({
|
||
|
marginLeft: 0 - scrollVal + 'px'
|
||
|
}, "fast");
|
||
|
};
|
||
|
//滚动条滚动到左边
|
||
|
var scrollTabLeft = function () {
|
||
|
var marginLeftVal = Math.abs(parseInt($('.page-tabs-content').css('margin-left')));
|
||
|
var tabOuterWidth = calSumWidth($(".content-tabs").children().not(".menuTabs"));
|
||
|
var visibleWidth = $(".content-tabs").outerWidth(true) - tabOuterWidth;
|
||
|
var scrollVal = 0;
|
||
|
if ($(".page-tabs-content").width() < visibleWidth) {
|
||
|
return false;
|
||
|
} else {
|
||
|
var tabElement = $(".menu_tab:first");
|
||
|
var offsetVal = 0;
|
||
|
while ((offsetVal + $(tabElement).outerWidth(true)) <= marginLeftVal) {
|
||
|
offsetVal += $(tabElement).outerWidth(true);
|
||
|
tabElement = $(tabElement).next();
|
||
|
}
|
||
|
offsetVal = 0;
|
||
|
if (calSumWidth($(tabElement).prevAll()) > visibleWidth) {
|
||
|
while ((offsetVal + $(tabElement).outerWidth(true)) < (visibleWidth) && tabElement.length > 0) {
|
||
|
offsetVal += $(tabElement).outerWidth(true);
|
||
|
tabElement = $(tabElement).prev();
|
||
|
}
|
||
|
scrollVal = calSumWidth($(tabElement).prevAll());
|
||
|
}
|
||
|
}
|
||
|
$('.page-tabs-content').animate({
|
||
|
marginLeft: 0 - scrollVal + 'px'
|
||
|
}, "fast");
|
||
|
};
|
||
|
//滚动条滚动到右边
|
||
|
var scrollTabRight = function () {
|
||
|
var marginLeftVal = Math.abs(parseInt($('.page-tabs-content').css('margin-left')));
|
||
|
var tabOuterWidth = calSumWidth($(".content-tabs").children().not(".menuTabs"));
|
||
|
var visibleWidth = $(".content-tabs").outerWidth(true) - tabOuterWidth;
|
||
|
var scrollVal = 0;
|
||
|
if ($(".page-tabs-content").width() < visibleWidth) {
|
||
|
return false;
|
||
|
} else {
|
||
|
var tabElement = $(".menu_tab:first");
|
||
|
var offsetVal = 0;
|
||
|
while ((offsetVal + $(tabElement).outerWidth(true)) <= marginLeftVal) {
|
||
|
offsetVal += $(tabElement).outerWidth(true);
|
||
|
tabElement = $(tabElement).next();
|
||
|
}
|
||
|
offsetVal = 0;
|
||
|
while ((offsetVal + $(tabElement).outerWidth(true)) < (visibleWidth) && tabElement.length > 0) {
|
||
|
offsetVal += $(tabElement).outerWidth(true);
|
||
|
tabElement = $(tabElement).next();
|
||
|
}
|
||
|
scrollVal = calSumWidth($(tabElement).prevAll());
|
||
|
if (scrollVal > 0) {
|
||
|
$('.page-tabs-content').animate({
|
||
|
marginLeft: 0 - scrollVal + 'px'
|
||
|
}, "fast");
|
||
|
}
|
||
|
}
|
||
|
};
|
||
|
|
||
|
//关闭其他选项卡
|
||
|
var closeOtherTabs = function (isAll) {
|
||
|
if (isAll) {
|
||
|
//关闭全部
|
||
|
$('.page-tabs-content').children("[" + pageIdField + "]").find('.fa-remove').parents('a').each(function () {
|
||
|
var $a = $(this);
|
||
|
var pageId = getPageId($a);
|
||
|
closeTabOnly(pageId);
|
||
|
|
||
|
// closeTab($a);
|
||
|
/*$('#' + $(this).data('id')).remove();
|
||
|
$(this).remove();*/
|
||
|
});
|
||
|
var firstChild = $(".page-tabs-content").children().eq(0); //选中那些删不掉的第一个菜单
|
||
|
if (firstChild) {
|
||
|
//激活这个选项卡
|
||
|
activeTabByPageId(getPageId(firstChild));
|
||
|
|
||
|
/*$('#' + firstChild.data('id')).addClass('active');
|
||
|
firstChild.addClass('active');*/
|
||
|
}
|
||
|
} else {
|
||
|
//除此之外全部删除
|
||
|
$('.page-tabs-content').children("[" + pageIdField + "]").find('.fa-remove').parents('a').not(".active").each(function () {
|
||
|
var $a = $(this);
|
||
|
var pageId = getPageId($a);
|
||
|
closeTabOnly(pageId);
|
||
|
|
||
|
// closeTab($a);
|
||
|
/*$('#' + $(this).data('id')).remove();
|
||
|
$(this).remove();*/
|
||
|
});
|
||
|
|
||
|
}
|
||
|
};
|
||
|
|
||
|
//激活Tab,通过id
|
||
|
function activeTabByPageId(pageId) {
|
||
|
$(".menu_tab").removeClass("active");
|
||
|
$("#tab-content").find(".active").removeClass("active");
|
||
|
//激活TAB
|
||
|
var $title = findTabTitle(pageId).addClass('active');
|
||
|
findTabPanel(pageId).addClass("active");
|
||
|
// scrollToTab($('.menu_tab.active'));
|
||
|
scrollToTab($title[0]);
|
||
|
}
|
||
|
|
||
|
$(function () {
|
||
|
var $tabs = $(".menuTabs");
|
||
|
//点击选项卡的时候就激活tab
|
||
|
$tabs.on("click", ".menu_tab", function () {
|
||
|
var pageId = getPageId(this);
|
||
|
activeTabByPageId(pageId);
|
||
|
});
|
||
|
|
||
|
//双击选项卡刷新页面
|
||
|
$tabs.on("dblclick", ".menu_tab", function () {
|
||
|
// console.log("dbclick");
|
||
|
var pageId = getPageId(this);
|
||
|
refreshTabById(pageId);
|
||
|
});
|
||
|
|
||
|
//选项卡右键菜单
|
||
|
function findTabElement(target) {
|
||
|
var $ele = $(target);
|
||
|
if (!$ele.is("a")) {
|
||
|
$ele = $ele.parents("a.menu_tab");
|
||
|
}
|
||
|
return $ele;
|
||
|
}
|
||
|
|
||
|
context.init({
|
||
|
preventDoubleContext: false,//不禁用原始右键菜单
|
||
|
compress: true//元素更少的padding
|
||
|
});
|
||
|
context.attach('.page-tabs-content', [
|
||
|
// {header: 'Options'},
|
||
|
{
|
||
|
text: '刷新',
|
||
|
action: function (e, $selector, rightClickEvent) {
|
||
|
//e是点击菜单的事件
|
||
|
//$selector就是$(".page-tabs-content")
|
||
|
//rightClickEvent就是右键打开菜单的事件
|
||
|
|
||
|
var pageId = getPageId(findTabElement(rightClickEvent.target));
|
||
|
refreshTabById(pageId);
|
||
|
|
||
|
}
|
||
|
},
|
||
|
{
|
||
|
text: "在新窗口打开",
|
||
|
action: function (e, $selector, rightClickEvent) {
|
||
|
|
||
|
var pageId = getPageId(findTabElement(rightClickEvent.target));
|
||
|
var url = getTabUrlById(pageId);
|
||
|
window.open(url);
|
||
|
|
||
|
}
|
||
|
}
|
||
|
// {text: 'Open in new Window', href: '#'},
|
||
|
// {divider: true},
|
||
|
// {text: 'Copy', href: '#'},
|
||
|
// {text: 'Dafuq!?', href: '#'}
|
||
|
]);
|
||
|
|
||
|
});
|
||
|
/*!
|
||
|
* jQuery blockUI plugin
|
||
|
* Version 2.70.0-2014.11.23
|
||
|
* Requires jQuery v1.7 or later
|
||
|
*
|
||
|
* Examples at: http://malsup.com/jquery/block/
|
||
|
* Copyright (c) 2007-2013 M. Alsup
|
||
|
* Dual licensed under the MIT and GPL licenses:
|
||
|
* http://www.opensource.org/licenses/mit-license.php
|
||
|
* http://www.gnu.org/licenses/gpl.html
|
||
|
*
|
||
|
* Thanks to Amir-Hossein Sobhi for some excellent contributions!
|
||
|
*/
|
||
|
!function(){"use strict";function e(e){function t(t,n){var s,h,k=t==window,y=n&&void 0!==n.message?n.message:void 0;if(n=e.extend({},e.blockUI.defaults,n||{}),!n.ignoreIfBlocked||!e(t).data("blockUI.isBlocked")){if(n.overlayCSS=e.extend({},e.blockUI.defaults.overlayCSS,n.overlayCSS||{}),s=e.extend({},e.blockUI.defaults.css,n.css||{}),n.onOverlayClick&&(n.overlayCSS.cursor="pointer"),h=e.extend({},e.blockUI.defaults.themedCSS,n.themedCSS||{}),y=void 0===y?n.message:y,k&&p&&o(window,{fadeOut:0}),y&&"string"!=typeof y&&(y.parentNode||y.jquery)){var m=y.jquery?y[0]:y,v={};e(t).data("blockUI.history",v),v.el=m,v.parent=m.parentNode,v.display=m.style.display,v.position=m.style.position,v.parent&&v.parent.removeChild(m)}e(t).data("blockUI.onUnblock",n.onUnblock);var g,I,w,U,x=n.baseZ;g=e(r||n.forceIframe?'<iframe class="blockUI" style="z-index:'+x++ +';display:none;border:none;margin:0;padding:0;position:absolute;width:100%;height:100%;top:0;left:0" src="'+n.iframeSrc+'"></iframe>':'<div class="blockUI" style="display:none"></div>'),I=e(n.theme?'<div class="blockUI blockOverlay ui-widget-overlay" style="z-index:'+x++ +';display:none"></div>':'<div class="blockUI blockOverlay" style="z-index:'+x++ +';display:none;border:none;margin:0;padding:0;width:100%;height:100%;top:0;left:0"></div>'),n.theme&&k?(U='<div class="blockUI '+n.blockMsgClass+' blockPage ui-dialog ui-widget ui-corner-all" style="z-index:'+(x+10)+';display:none;position:fixed">',n.title&&(U+='<div class="ui-widget-header ui-dialog-titlebar ui-corner-all blockTitle">'+(n.title||" ")+"</div>"),U+='<div class="ui-widget-content ui-dialog-content"></div>',U+="</div>"):n.theme?(U='<div class="blockUI '+n.blockMsgClass+' blockElement ui-dialog ui-widget ui-corner-all" style="z-index:'+(x+10)+';display:none;position:absolute">',n.title&&(U+='<div class="ui-widget-header ui-dialog-titlebar ui-corner-all blockTitle">'+(n.title||" ")+"</div>"),U+='<div class="ui-widget-content ui-dialog-content"></div>',U+="</div>"):U=k?'<div class="blockUI '+n.blockMsgClass+' blockPage" style="z-index:'+(x+10)+';display:none;position:fixed"></div>':'<div class="blockUI '+n.blockMsgClass+' blockElement" style="z-index:'+(x+10)+';display:none;position:absolute"></div>',w=e(U),y&&(n.theme?(w.css(h),w.addClass("ui-widget-content")):w.css(s)),n.theme||I.css(n.overlayCSS),I.css("position",k?"fixed":"absolute"),(r||n.forceIframe)&&g.css("opacity",0);var C=[g,I,w],S=e(k?"body":t);e.each(C,function(){this.appendTo(S)}),n.theme&&n.draggable&&e.fn.draggable&&w.draggable({handle:".ui-dialog-titlebar",cancel:"li"});var O=f&&(!e.support.boxModel||e("object,embed",k?null:t).length>0);if(u||O){if(k&&n.allowBodyStretch&&e.support.boxModel&&e("html,body").css("height","100%"),(u||!e.support.boxModel)&&!k)var E=d(t,"borderTopWidth"),T=d(t,"borderLeftWidth"),M=E?"(0 - "+E+")":0,B=T?"(0 - "+T+")":0;e.each(C,function(e,t){var o=t[0].style;if(o.position="absolute",2>e)k?o.setExpression("height","Math.max(document.body.scrollHeight, document.body.offsetHeight) - (jQuery.support.boxModel?0:"+n.quirksmodeOffsetHack+') + "px"'):o.setExpression("height",'this.parentNode.offsetHeight + "px"'),k?o.setExpression("width",'jQuery.support.boxModel && document.documentElement.clientWidth || document.body.clientWidth + "px"'):o.setExpression("width",'this.parentNode.offsetWidth + "px"'),B&&o.setExpression("left",B),M&&o.setExpression("top",M);else if(n.centerY)k&&o.setExpression("top",'(document.documentElement.clientHeight || document.body.clientHeight) / 2 - (this.offsetHeight / 2) + (blah = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop) + "px"'),o.marginTop=0;else if(!n.centerY&&k){var i=n.css&&n.css.top?parseInt(n.css.top,10):0,s="((document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop) + "+i+') + "px"';o.setExpression("top",s)}})}if(y&&(n.theme?w.find(".ui-widget-content").append(y):w.append(y),(y.jquery||y.nodeType)&&e(y).show()),(r||n.forceIframe)&&n.showOverlay&&g.show(),n.fadeIn){var j=n.onBlock?n.onBlock:c,H=n
|
||
|
(function ($) {
|
||
|
$.fn.sidebarMenu = function (options) {
|
||
|
options = $.extend({}, $.fn.sidebarMenu.defaults, options || {});
|
||
|
var $menu_ul = $(this);
|
||
|
var level = 0;
|
||
|
// target.addClass('nav');
|
||
|
// target.addClass('nav-list');
|
||
|
if (options.data) {
|
||
|
init($menu_ul, options.data, level);
|
||
|
}
|
||
|
else {
|
||
|
if (!options.url) return;
|
||
|
$.getJSON(options.url, options.param, function (data) {
|
||
|
|
||
|
init($menu_ul, data, level);
|
||
|
});
|
||
|
}
|
||
|
|
||
|
function init($menu_ul, data, level) {
|
||
|
$.each(data, function (i, item) {
|
||
|
//如果标签是isHeader
|
||
|
var $header = $('<li class="header"></li>');
|
||
|
if (item.isHeader !== null && item.isHeader === true) {
|
||
|
$header.append(item.text);
|
||
|
$menu_ul.append($header);
|
||
|
return;
|
||
|
}
|
||
|
|
||
|
//如果不是header
|
||
|
//var li = $('<li class="treeview " data-level="' + level + '"></li>');
|
||
|
var li = $('<li class="treeview "></li>');
|
||
|
//a标签
|
||
|
var $a;
|
||
|
if (level > 0) {
|
||
|
//$a = $('<a style="padding-left:' + (level * 20) + 'px"></a>');
|
||
|
$a = $('<a></a>');
|
||
|
} else {
|
||
|
$a = $('<a></a>');
|
||
|
}
|
||
|
|
||
|
//图标
|
||
|
var $icon = $('<i></i>');
|
||
|
$icon.addClass(item.icon);
|
||
|
|
||
|
//标题
|
||
|
var $title = $('<span class="title"></span>');
|
||
|
$title.addClass('menu-text').text(item.text);
|
||
|
|
||
|
$a.append($icon);
|
||
|
$a.append($title);
|
||
|
$a.addClass("nav-link");
|
||
|
|
||
|
var isOpen = item.isOpen;
|
||
|
|
||
|
if (isOpen === true) {
|
||
|
li.addClass("active");
|
||
|
}
|
||
|
if (item.children && item.children.length > 0) {
|
||
|
var pullSpan = $('<span class="pull-right-container"></span>');
|
||
|
var pullIcon = $('<i class="fa fa-angle-left pull-right"></i>');
|
||
|
pullSpan.append(pullIcon);
|
||
|
$a.append(pullSpan);
|
||
|
li.append($a);
|
||
|
|
||
|
var menus = $('<ul></ul>');
|
||
|
menus.addClass('treeview-menu');
|
||
|
if (isOpen === true) {
|
||
|
menus.css("display", "block");
|
||
|
menus.addClass("menu-open");
|
||
|
} else {
|
||
|
menus.css("display", "none");
|
||
|
}
|
||
|
init(menus, item.children, level + 1);
|
||
|
li.append(menus);
|
||
|
}
|
||
|
else {
|
||
|
|
||
|
if (item.targetType != null && item.targetType === "blank") //代表打开新页面
|
||
|
{
|
||
|
$a.attr("href", item.url);
|
||
|
$a.attr("target", "_blank");
|
||
|
}
|
||
|
else if (item.targetType != null && item.targetType === "ajax") { //代表ajax方式打开页面
|
||
|
$a.attr("href", item.url);
|
||
|
$a.addClass("ajaxify");
|
||
|
}
|
||
|
else if (item.targetType != null && item.targetType === "iframe-tab") {
|
||
|
item.urlType = item.urlType ? item.urlType : 'relative';
|
||
|
var href = 'addTabs({id:\'' + item.id + '\',title: \'' + item.text + '\',close: true,url: \'' + item.url + '\',urlType: \'' + item.urlType + '\'});';
|
||
|
$a.attr('onclick', href);
|
||
|
}
|
||
|
else if (item.targetType != null && item.targetType === "iframe") { //代表单iframe页面
|
||
|
$a.attr("href", item.url);
|
||
|
$a.addClass("iframeOpen");
|
||
|
$("#iframe-main").addClass("tab_iframe");
|
||
|
} else {
|
||
|
$a.attr("href", item.url);
|
||
|
$a.addClass("iframeOpen");
|
||
|
$("#iframe-main").addClass("tab_iframe");
|
||
|
}
|
||
|
$a.addClass("nav-link");
|
||
|
var badge = $("<span></span>");
|
||
|
// <span class="badge badge-success">1</span>
|
||
|
//comment by xue lei
|
||
|
if (item.tip != null && item.tip > 0) {
|
||
|
badge.addClass("label").addClass("label-success").text(item.tip);
|
||
|
}
|
||
|
$a.append(badge);
|
||
|
li.append($a);
|
||
|
}
|
||
|
$menu_ul.append(li);
|
||
|
});
|
||
|
}
|
||
|
|
||
|
//另外绑定菜单被点击事件,做其它动作
|
||
|
$menu_ul.on("click", "li.treeview a", function () {
|
||
|
var $a = $(this);
|
||
|
|
||
|
if ($a.next().length == 0) {//如果size>0,就认为它是可以展开的
|
||
|
//if ($(window).width() < $.AdminLTE.options.screenSizes.sm) {//小屏幕
|
||
|
// //触发左边菜单栏按钮点击事件,关闭菜单栏
|
||
|
// $($.AdminLTE.options.sidebarToggleSelector).click();
|
||
|
//}
|
||
|
}
|
||
|
});
|
||
|
};
|
||
|
|
||
|
$.fn.sidebarMenu.defaults = {
|
||
|
url: null,
|
||
|
param: null,
|
||
|
data: null,
|
||
|
isHeader: false
|
||
|
};
|
||
|
})(jQuery);
|
||
|
|
||
|
//sidebar - menu组件封装
|
||
|
//在页面上面直接调用sidebar - menu的方法
|