// Datepicker.js
function dateAria(){
var ariavalue;
var ariamonth = $('th.datepicker-switch').html();
$('div.datepicker td').each(function(){
ariavalue = $(this).html() + " " + ariamonth;
$(this).attr("aria-label",ariavalue);
});
$('div.datepicker th').each(function(){
ariavalue = $(this).html();
$(this).attr("aria-label",ariavalue);
});
$('div.datepicker thead tr:nth-child(2) th.prev').attr("aria-label","Previous Month");
$('div.datepicker thead tr:nth-child(2) th.next').attr("aria-label","Next Month");
}
// Tablesorter Accessibility
function tableAccess(){
var inputattr;
var thnth;
$(".tablesorter").each(function(){
var x = 0;
var numcols = $(".tablesorter th").length - 1;
while (x < numcols){
x++;
thnth = "th:nth-child(" + x + ")";
tdnth = "td:nth-child(" + x + ")";
inputattr = $(".tablesorter-headerRow").find(thnth).find(".tablesorter-header-inner").text();
if((jQuery.trim( inputattr )).length==0){
inputattr = "Criteria"
}
inputattr = "Search " + inputattr;
$(".tablesorter-filter-row").find(tdnth).find("input").attr("aria-label",inputattr);
}
});
}
var ariaOwnsNum = 0;
Selectize.define('accessibility', function(options){
var self = this;
ariaOwnsNum ++;
var ariaOwnsvar = "aria-selectize-dropdown" + ariaOwnsNum;
var inputIDvar = "select-input" + ariaOwnsNum;
self.setup = (function(){
var original = self.setup;
return function(){
original.apply(self, arguments);
self.$wrapper.attr({'role': 'application'});
self.$dropdown.attr({'id': ariaOwnsvar, 'role': 'listbox'});
self.$control_input.attr({
'aria-owns' : ariaOwnsvar,
'aria-haspopup' : 'true',
'role' : 'combobox',
'aria-autocomplete': 'list',
'id' : inputIDvar
});
};
})();
});
//Radio Button Group
$(document).ready(setRBG);
$(".radio-btn-group .btn").on("keyup keypress blur change", setRBG);
function setRBG() {
var radioButton = $(".radio-btn-group .btn");
var radioInputActive = $(".radio-btn-group .btn input:checked");
radioButton.removeClass("active");
$(this).addClass("active");
radioInputActive.closest(".btn").addClass("active");
}
$(function() {
// Minimalize menu when screen is less than 992px
if ($(this).width() < 992) {
$('body').addClass('hide-sidebar');
$('body').removeClass('show-sidebar docked-sidebar');
$('.btn-toggle-menu').removeClass('close-icon').addClass('menu-icon');
} else {
//chill
}
//Smooth Scrolling for page anchor tags/links
$(document).ready(function(){
$('.smooth-scroll').on('click',function (e) {
e.preventDefault();
var target = this.hash;
var $target = $(target);
$('html, body').stop().animate({
'scrollTop': $target.offset().top
}, 900, 'swing');
setTimeout(function(){
$(target).attr("tabindex","0");
$(target).focus();
},900);
});
});
// Google Material ripple effect
// invokes material.min.js
// https://github.com/FezVrasta/bootstrap-material-design#materialjs
$.material.init();
// Check if transparent navbar needs colour on scroll
// function in material-kit.js
$(window).on('scroll', materialKit.checkScrollForTransparentNavbar);
// Override default browser scrollbars
// Calling SlimScroll.js plugin on all elements with the 'scrollable' class
$('.scrollable').slimScroll({
height: '100%',
width: '100%',
size: '8px',
distance: '2px',
color: '#CCCCCC'
});
// Archived, x-axis scroll
//$('.quick-view-items-overflow .quick-item-list').slimScroll({
// height: '65px',
// width: '100%',
// color: '#CCCCCC',
// axis: 'x'
//});
// Making SlimScroll.js keyboard accessible
var scrollPosition;
$('.scrollable').keydown(function(e){
scrollPosition = 0;
if (e.keyCode === 37) {
// If Left Arrow is pressed
(e).preventDefault();
scrollPosition = $(this).scrollLeft() - 10;
$(this).scrollLeft(scrollPosition);
} else if (e.keyCode === 38) {
// If Up Arrow is pressed
(e).preventDefault();
scrollPosition = $(this).scrollTop() - 10;
$(this).scrollTop(scrollPosition);
} else if (e.keyCode === 39) {
// If Right Arrow is presse
(e).preventDefault();
scrollPosition = $(this).scrollLeft() + 10;
$(this).scrollLeft(scrollPosition);
} else if (e.keyCode === 40) {
// If Down Arrow is pressed
(e).preventDefault();
scrollPosition = $(this).scrollTop() + 10;
$(this).scrollTop(scrollPosition);
} else if (e.keyCode === 36) {
// If Home button is pressed
(e).preventDefault();
$(this).scrollTop(scrollPosition);
} else if (e.keyCode === 35) {
// If End button is pressed
(e).preventDefault();
$(this).children().each(function(){
scrollPosition = scrollPosition + $(this).outerHeight(true);
});
$(this).scrollTop(scrollPosition);
} else if (e.keyCode === 33) {
// If Page Up button is pressed
(e).preventDefault();
scrollPosition = $(this).scrollTop() - $(this).height();
$(this).scrollTop(scrollPosition);
} else if (e.keyCode === 34) {
// If Page Down button is pressed
(e).preventDefault();
scrollPosition = $(this).scrollTop() + $(this).height();
$(this).scrollTop(scrollPosition);
}
});
// Pagination Accessibility
$('.pagination a').keydown(function(e){
if (e.keyCode === 37) {
// If Left Arrow is pressed and there are elements before this element
(e).preventDefault();
if (!($(this).parent('li').is(':first-child'))){
$(this).parent('li').prev().find('a').focus();
}
} else if (e.keyCode === 39) {
// If Right Arrow is pressed and there are elements after this element
(e).preventDefault();
if (!($(this).parent('li').is(':last-child'))){
$(this).parent('li').next().find('a').focus();
}
}
});
// Filterable Table
$('.tablesorter-pager span.pagedisplay').each(function(){
var spanLabel = $(this).html();
spanLabel = spanLabel.replace ("-","to");
spanLabel = spanLabel.replace ("/","of");
spanLabel = spanLabel.replace ("(","results. There are ");
spanLabel = spanLabel.replace (")"," results when unfiltered.");
$(this).attr("aria-label",spanLabel);
});
$('.selectize').selectize({
create: true,
sortField: {
field: 'text',
direction: 'asc'
},
plugins: {
'accessibility': {}
},
render: {
option: function($item, escape){
return '
' + $item.text + '
';
}
},
onInitialize: function(){
setTimeout(function(){
$('.selectize-control').each(function(){
var selectizeID = $(this).find("input").attr("id");
$(this).parents('.form-group').find('label').attr("for",selectizeID);
});
},10);
}
});
// Moving focus to next area when alert closed
$('.alert').on('close.bs.alert',function(){
$(this).next().attr("tabindex","0").focus();
});
// Making the links that look like buttons act via keyboard as a button would
$('a.btn').keydown(function(e){
if ((e.keyCode === 0) || (e.keyCode === 32)){
e.preventDefault();
var linkhref = $(this).attr('href');
var linktar = $(this).attr('target');
if ($(this).hasClass('smooth-scroll')){
var target = this.hash;
var $target = $(target);
$('html, body').stop().animate({
'scrollTop': $target.offset().top
}, 900, 'swing');
$(target).attr("tabindex","0");
$(target).focus();
} else if($(this).hasClass('dropdown-toggle')){
$(this).dropdown();
} else {
if (linktar){
window.open(linkhref,linktar);
} else {
window.location = $(this).attr('href');
}
}
}
});
// Adjusting additional WAI-ARIA on dropdowns
$('.dropdown').on('shown.bs.dropdown', function(){
$(this).find('ul').attr('aria-hidden','false');
});
$('.dropdown').on('hidden.bs.dropdown', function(){
$(this).find('ul').attr('aria-hidden','true');
});
// Navs and Tabbed Content accessibility scripting
$('a[data-toggle="tab"]').on('shown.bs.tab', function(){
$(this).attr("tabindex","").attr("aria-selected","true");
});
$('a[data-toggle="tab"]').on('hidden.bs.tab', function(){
$(this).attr("tabindex","-1").attr("aria-selected","false");
});
$('a[data-toggle="tab"]').keydown(function(e){
if ((e.keyCode === 37) || (e.keyCode === 38)) {
// If Left Arrow or Up Arrow are pressed and there are elements before this element
(e).preventDefault();
if (!($(this).parent('li').is(':first-child'))){
$(this).parent('li').prev().find('a').attr("tabindex","").attr("aria-selected","true").focus().tab('show');
$(this).attr("tabindex","-1").attr("aria-selected","false");
}
} else if ((e.keyCode === 39) || (e.keyCode === 40)) {
// If Right Arrow or Down Arrow are pressed and there are elements after this element
(e).preventDefault();
if (!($(this).parent('li').is(':last-child'))){
$(this).parent('li').next().find('a').attr("tabindex","").attr("aria-selected","true").focus().tab('show');
$(this).attr("tabindex","-1").attr("aria-selected","false");
}
} else if ((e.keyCode === 36)) {
// If Home button is pressed and there are elements before this element
(e).preventDefault();
if (!($(this).parent('li').is(':first-child'))){
$(this).parent('li').parent('ul').find('li:first a').attr("tabindex","").attr("aria-selected","true").focus().tab('show');
$(this).attr("tabindex","-1").attr("aria-selected","false");
}
} else if ((e.keyCode === 35)) {
// If End button is pressed and there are elements after this element
(e).preventDefault();
if (!($(this).parent('li').is(':last-child'))){
$(this).parent('li').parent('ul').find('li:last a').attr("tabindex","").attr("aria-selected","true").focus().tab('show');
$(this).attr("tabindex","-1").attr("aria-selected","false");
}
}
});
// User status toggle
$('.user-status-toggle').on('click', function (e) {
$('body').toggleClass('user-status-in');
if ( $('body').hasClass('user-status-in') ) {
$('.user-status-text').text("Available");
} else {
$('body').removeClass('user-status-in');
$('.user-status-text').text("Not Available");
}
});
// Sidebar panel toggles
$('.btn-toggle-menu').on('click', function (e) {
if (!$('body').hasClass('docked-sidebar') ) {
$('body').removeClass('show-apps-sidebar').addClass('hide-apps-sidebar');
$('body').toggleClass('show-sidebar hide-sidebar');
$(this).toggleClass('close-icon menu-icon');
$(this).focus();
$('.toggle-apps-menu.open').removeClass('open');
$('.toggle-recent-menu.open').removeClass('open');
$('.toggle-menu-default').toggleClass('open');
} else {
$('body').addClass('show-sidebar hide-apps-sidebar').removeClass('hide-sidebar show-apps-sidebar');
$(this).removeClass("open");
}
});
$('.toggle-apps-menu').on('click', function (e) {
if (!$('body').hasClass('docked-sidebar') ) {
$('body').removeClass('show-sidebar').addClass('hide-sidebar');
$('body').toggleClass('show-apps-sidebar hide-apps-sidebar');
$('.btn-toggle-menu').removeClass('close-icon').addClass('menu-icon');
$(this).focus();
$('.toggle-menu-default.open').removeClass('open');
$('.toggle-recent-menu.open').removeClass('open');
$('.toggle-apps-menu').toggleClass('open');
} else {
$('body').toggleClass('hide-apps-sidebar show-apps-sidebar');
$(this).removeClass("open");
}
});
/* When Apps Menu is open, move focus to it on down arrow */
$(".toggle-apps-menu").keydown(function(e){
if ($(this).hasClass("open")){
if (e.keyCode === 40) {
(e).preventDefault();
$('.sidebar#apps-menu a:first').focus();
}
}
});
/* When Menu is open, move focus to it on down arrow */
$(".btn-toggle-menu").keydown(function(e){
if ($(this).hasClass("open")){
if (e.keyCode === 40) {
(e).preventDefault();
$('.sidebar#WC-primary-menu a:first').focus();
}
}
});
$('#content-wrapper').on('click', function (e) {
$('.btn-toggle-menu, .toggle-apps-menu').removeClass('open');
if (!$('body').hasClass('docked-sidebar') ) {
$('body').addClass('hide-sidebar hide-apps-sidebar').removeClass('show-sidebar show-apps-sidebar');
$('.btn-toggle-menu').removeClass('close-icon').addClass('menu-icon');
} else {
$('body').addClass('show-sidebar hide-apps-sidebar').removeClass('hide-sidebar show-apps-sidebar');
$('.btn-toggle-menu').removeClass('menu-icon').addClass('close-icon');
}
});
$('.dark-overlay').on('click', function (e) {
if ( $('body').is('.show-sidebar, .show-apps-sidebar') ) {
$('body').removeClass('show-sidebar show-apps-sidebar').addClass('hide-sidebar hide-apps-sidebar');
$('.btn-toggle-menu, .toggle-apps-menu').removeClass('open');
$('.btn-toggle-menu').removeClass('close-icon').addClass('menu-icon');
}
if ( $('body').hasClass('panel-open') ) {
$('body').removeClass('panel-open');
$('.sidebar-right').removeClass('sidebar-active');
$('#navbar-collapse-section li').removeClass('open');
}
});
// Switch the Menu to docked
$('.toggle-docked-menu').on('click', function (e) {
$('body').toggleClass('docked-sidebar');
});
// Form with Active/Floating Labels
$('.form-active-labels input, .form-active-labels textarea, .form-active-labels select').each(function(){
var validVal = $(this).val();
if ( validVal ) {
$(this).addClass('filled-input');
}
});
$('.form-active-labels input, .form-active-labels textarea, .form-active-labels select').blur(function() {
if( $(this).val() ) {
$(this).addClass('filled-input');
} else {
$(this).removeClass('filled-input');
}
});
// Selectize in a form with Active/Floating Labels
$('.selectize-input input').each(function(){
if( $(this).parent().hasClass('full') ) {
$(this).closest('.form-control').addClass('filled-input');
} else {
$(this).closest('.form-control').removeClass('filled-input');
}
});
$('.selectize-input input').blur(function() {
if( $(this).parent().hasClass('has-items') ) {
$(this).closest('.form-control').addClass('filled-input');
} else {
$(this).closest('.form-control').removeClass('filled-input');
}
});
});
// If user resizes the browser window...
$(window).bind("resize", function () {
if ($(this).width() < 1420) {
$('body').removeClass('docked-sidebar');
$('.toggle-docked-menu').removeClass('toggle-on');
}
if ($(this).width() < 992) {
$('body').addClass('hide-sidebar');
$('body').removeClass('show-sidebar');
$('.btn-toggle-menu').removeClass('close-icon').addClass('menu-icon');
} else {
//chill
}
});
// Sidebars and Panels functionality
(function ( $ ) {
$.fn.closePanels = function() {
$('#navbar-collapse-section li').not($(this).parent()).removeClass('open');
$('#sm-n-n li').removeClass('open');
$('body').removeClass('panel-open');
$('.sidebar-right').removeClass('sidebar-active');
$('.sidebar-right').find('a, button, input, select').attr('tabindex','-1');
return this;
};
var body = $('body');
/* Trigger sidebar toggles */
$('.sidebar-quick-create-toggle').on('click', function (e) {
$(this).closePanels();
if ( !$(this).parent().hasClass('open') ) {
$(this).parent().addClass('open');
$('#quick-create-sidebar').addClass('sidebar-active');
$('#quick-create-sidebar').find('a, button, input, select').attr('tabindex','0');
body.addClass('panel-open');
$(this).focus();
} else {
$(this).parent().removeClass('open');
$('#quick-create-sidebar').removeClass('sidebar-active');
}
});
$('.sidebar-task-toggle').on('click', function (e) {
$(this).closePanels();
if ( !$(this).parent().hasClass('open') ) {
$(this).parent().addClass('open');
$('#task-sidebar').addClass('sidebar-active');
$('#task-sidebar').find('a, button, input, select').attr('tabindex','0');
body.addClass('panel-open');
$(this).focus();
} else {
$(this).parent().removeClass('open');
$('#task-sidebar').removeClass('sidebar-active');
}
});
$('.sidebar-notification-toggle').on('click', function (e) {
$(this).closePanels();
if ( !$(this).parent().hasClass('open') ) {
$(this).parent().addClass('open');
$('#notification-sidebar').addClass('sidebar-active');
$('#notification-sidebar').find('a, button, input, select').attr('tabindex','0');
body.addClass('panel-open');
$(this).focus();
} else {
$(this).parent().removeClass('open');
$('#notification-sidebar').removeClass('sidebar-active');
}
});
$('.sidebar-profile-toggle').on('click', function (e) {
$(this).closePanels();
if ( !$(this).parent().hasClass('open') ) {
$(this).parent().addClass('open');
$('#profile-sidebar').addClass('sidebar-active');
$('#profile-sidebar').find('a, button, input, select').attr('tabindex','0');
body.addClass('panel-open');
$(this).focus();
} else {
$(this).parent().removeClass('open');
$('#profile-sidebar').removeClass('sidebar-active');
}
});
/* Toggle Task Sidebar By Click */
$('.toggle-task-sidebar').on('click', function (e) {
$('.task-sidebar').toggleClass('sidebar-active');
});
/* Toggle Task Sidebar By Keyboard */
$('a.toggle-task-sidebar').keydown(function(e){
if (((e.keyCode === 0) || (e.keyCode === 32)) || (e.keyCode === 13)){
(e).preventDefault();
$('.task-sidebar').toggleClass('sidebar-active');
if ($('.task-sidebar').hasClass('sidebar-active')){
$('.task-sidebar').find('a, button, input, select').attr('tabindex','');
$('.task-sidebar').find('a:first').focus();
} else {
$('.task-sidebar').find('a, button, input, select').attr('tabindex','-1');
$('.sidebar-active .list-group').find('a:first').focus();
}
}
});
$(".sidebar-quick-create-toggle, .sidebar-task-toggle, .sidebar-notification-toggle, .sidebar-profile-toggle").keydown(function(e){
if ($(this).parent('li').hasClass("open")){
if (e.keyCode === 40) {
(e).preventDefault();
$('.sidebar.sidebar-active a:first').focus();
}
}
});
//Tasks: Dismiss task
$('.btn.ack').on('click', function (e) {
$(this).closest( ".list-group-item" ).addClass('acknowledged').html('').delay(4000).fadeOut("slow");
});
// Datepicker
$('input.datepicker').focus(function(){
$(this).attr("aria-expanded","true");
}).blur(function(){
$(this).attr("aria-expanded","false");
}).on('keyup',function(evt){
if ((((evt.keyCode === 37) || (evt.keyCode === 38)) || (evt.keyCode === 39)) || (evt.keyCode === 40)){
dateAria();
}
});
$('.datepicker').on('show', function() {
dateAria();
})
.on('changeDate',function(){
dateAria();
})
.on('changeMonth',function(){
dateAria();
})
.on('changeYear',function(){
dateAria();
})
.on('changeDecade',function(){
dateAria();
})
.on('changeCentury',function(){
dateAria();
})
.on('clearDate',function(){
dateAria();
});
}( jQuery ));
// If user presses Escape the slideout menus and panels close
$(document).on('keyup',function(evt) {
if (evt.keyCode === 27) {
if ($('body').hasClass('show-sidebar')){
$('body').removeClass('show-sidebar').addClass('hide-sidebar');
$('button.close-icon').focus();
} else if ($('body').hasClass('show-apps-sidebar')) {
$('body').removeClass('show-apps-sidebar').addClass('hide-apps-sidebar');
$('button.toggle-apps-menu').focus();
}
$('.btn-toggle-menu.close-icon').removeClass('close-icon').addClass('menu-icon');
$('body').removeClass('panel-open');
$('.sidebar').removeClass('sidebar-active');
$('li.nav-item.open button').focus();
$('li.nav-item.open, .toggle-recent-menu, .toggle-apps-menu, .toggle-menu-default').removeClass('open');
}
});
// Hiding navbar on scroll down
var didScroll;
var lastScrollTop = 0;
var delta = 5;
var navbarHeight = $("#header .navbar").outerHeight();
function hasScrolled() {
var st = $(this).scrollTop();
if (Math.abs(lastScrollTop - st) <= delta){
return;
}
// If current position > last position AND scrolled past navbar...
if (st > lastScrollTop && st > navbarHeight){
// Scroll Down
$("#header:not(.header-example)").addClass("scrolled");
$('#header:not(.header-example)').css("top",-(navbarHeight));
$(".sidebar").addClass("scrolled");
} else {
// Scroll Up
// If did not scroll past the document (possible on mac)...
if(st + $(window).height() < $(document).height()) {
$('#header.scrolled').css("top","");
$("#header").removeClass("scrolled");
$(".sidebar").removeClass("scrolled");
}
}
lastScrollTop = st;
}
// on scroll, let the interval function know the user has scrolled
$(window).scroll(function(event){
didScroll = true;
});
// run hasScrolled() and reset didScroll status
setInterval(function() {
if (didScroll) {
hasScrolled();
didScroll = false;
}
}, 250);
// Show Scroll To Top Button
$(window).scroll(function() {
if ($(document).scrollTop() > 100) {
$("#scroll-to-top").addClass("scrolled");
} else {
$("#scroll-to-top").removeClass("scrolled");
}
});
$("#scroll-to-top button").click(function(){
$('html, body').animate({
'scrollTop': 0
}, 600, 'swing');
setTimeout(function(){
$('.container').attr("tabindex","0").focus();
},300);
});