mirror of https://github.com/helloxz/onenav.git
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.
321 lines
6.7 KiB
321 lines
6.7 KiB
4 years ago
|
/**
|
||
|
* Toggles
|
||
|
*
|
||
|
* Non-animation
|
||
|
*/
|
||
|
|
||
|
|
||
|
;(function($, window, undefined)
|
||
|
{
|
||
|
"use strict";
|
||
|
|
||
|
$(document).ready(function()
|
||
|
{
|
||
|
|
||
|
// Chat Toggler
|
||
|
$('a[data-toggle="chat"]').each(function(i, el)
|
||
|
{
|
||
|
$(el).on('click', function(ev)
|
||
|
{
|
||
|
ev.preventDefault();
|
||
|
|
||
|
public_vars.$body.toggleClass('chat-open');
|
||
|
|
||
|
if($.isFunction($.fn.perfectScrollbar))
|
||
|
{
|
||
|
setTimeout(function()
|
||
|
{
|
||
|
public_vars.$chat.find('.chat_inner').perfectScrollbar('update');
|
||
|
$(window).trigger('xenon.resize');
|
||
|
}, 1);
|
||
|
}
|
||
|
});
|
||
|
});
|
||
|
|
||
|
|
||
|
// Settings Pane Toggler
|
||
|
$('a[data-toggle="settings-pane"]').each(function(i, el)
|
||
|
{
|
||
|
$(el).on('click', function(ev)
|
||
|
{
|
||
|
ev.preventDefault();
|
||
|
|
||
|
var use_animation = attrDefault($(el), 'animate', false) && ! isxs();
|
||
|
|
||
|
var scroll = {
|
||
|
top: $(document).scrollTop(),
|
||
|
toTop: 0
|
||
|
};
|
||
|
|
||
|
if(public_vars.$body.hasClass('settings-pane-open'))
|
||
|
{
|
||
|
scroll.toTop = scroll.top;
|
||
|
}
|
||
|
|
||
|
TweenMax.to(scroll, (use_animation ? .1 : 0), {top: scroll.toTop, roundProps: ['top'], ease: scroll.toTop < 10 ? null : Sine.easeOut, onUpdate: function()
|
||
|
{
|
||
|
$(window).scrollTop( scroll.top );
|
||
|
},
|
||
|
onComplete: function()
|
||
|
{
|
||
|
if(use_animation)
|
||
|
{
|
||
|
// With Animation
|
||
|
public_vars.$settingsPaneIn.addClass('with-animation');
|
||
|
|
||
|
// Opening
|
||
|
if( ! public_vars.$settingsPane.is(':visible'))
|
||
|
{
|
||
|
public_vars.$body.addClass('settings-pane-open');
|
||
|
|
||
|
var height = public_vars.$settingsPane.outerHeight(true);
|
||
|
|
||
|
public_vars.$settingsPane.css({
|
||
|
height: 0
|
||
|
});
|
||
|
|
||
|
TweenMax.to(public_vars.$settingsPane, .25, {css: {height: height}, ease: Circ.easeInOut, onComplete: function()
|
||
|
{
|
||
|
public_vars.$settingsPane.css({height: ''});
|
||
|
}});
|
||
|
|
||
|
public_vars.$settingsPaneIn.addClass('visible');
|
||
|
}
|
||
|
// Closing
|
||
|
else
|
||
|
{
|
||
|
public_vars.$settingsPaneIn.addClass('closing');
|
||
|
|
||
|
TweenMax.to(public_vars.$settingsPane, .25, {css: {height: 0}, delay: .15, ease: Power1.easeInOut, onComplete: function()
|
||
|
{
|
||
|
public_vars.$body.removeClass('settings-pane-open');
|
||
|
public_vars.$settingsPane.css({height: ''});
|
||
|
public_vars.$settingsPaneIn.removeClass('closing visible');
|
||
|
}});
|
||
|
}
|
||
|
}
|
||
|
else
|
||
|
{
|
||
|
// Without Animation
|
||
|
public_vars.$body.toggleClass('settings-pane-open');
|
||
|
public_vars.$settingsPaneIn.removeClass('visible');
|
||
|
public_vars.$settingsPaneIn.removeClass('with-animation');
|
||
|
}
|
||
|
}
|
||
|
});
|
||
|
});
|
||
|
});
|
||
|
|
||
|
|
||
|
|
||
|
// Sidebar Toggle
|
||
|
$('a[data-toggle="sidebar"]').each(function(i, el)
|
||
|
{
|
||
|
$(el).on('click', function(ev)
|
||
|
{
|
||
|
ev.preventDefault();
|
||
|
|
||
|
|
||
|
if(public_vars.$sidebarMenu.hasClass('collapsed'))
|
||
|
{
|
||
|
public_vars.$sidebarMenu.removeClass('collapsed');
|
||
|
ps_init();
|
||
|
}
|
||
|
else
|
||
|
{
|
||
|
public_vars.$sidebarMenu.addClass('collapsed');
|
||
|
ps_destroy();
|
||
|
}
|
||
|
|
||
|
$(window).trigger('xenon.resize');
|
||
|
});
|
||
|
});
|
||
|
|
||
|
|
||
|
|
||
|
// Mobile Menu Trigger
|
||
|
$('a[data-toggle="mobile-menu"]').on('click', function(ev)
|
||
|
{
|
||
|
ev.preventDefault();
|
||
|
|
||
|
public_vars.$mainMenu.add(public_vars.$sidebarProfile).toggleClass('mobile-is-visible');
|
||
|
ps_destroy();
|
||
|
});
|
||
|
|
||
|
|
||
|
|
||
|
// Mobile Menu Trigger for Horizontal Menu
|
||
|
$('a[data-toggle="mobile-menu-horizontal"]').on('click', function(ev)
|
||
|
{
|
||
|
ev.preventDefault();
|
||
|
|
||
|
public_vars.$horizontalMenu.toggleClass('mobile-is-visible');
|
||
|
|
||
|
});
|
||
|
|
||
|
|
||
|
|
||
|
// Mobile Menu Trigger for Sidebar & Horizontal Menu
|
||
|
$('a[data-toggle="mobile-menu-both"]').on('click', function(ev)
|
||
|
{
|
||
|
ev.preventDefault();
|
||
|
|
||
|
public_vars.$mainMenu.toggleClass('mobile-is-visible both-menus-visible');
|
||
|
public_vars.$horizontalMenu.toggleClass('mobile-is-visible both-menus-visible');
|
||
|
|
||
|
});
|
||
|
|
||
|
|
||
|
|
||
|
// Mobile User Info Menu Trigger
|
||
|
$('a[data-toggle="user-info-menu"]').on('click', function(ev)
|
||
|
{
|
||
|
ev.preventDefault();
|
||
|
|
||
|
public_vars.$userInfoMenu.toggleClass('mobile-is-visible');
|
||
|
|
||
|
});
|
||
|
|
||
|
|
||
|
|
||
|
// Mobile User Info Menu Trigger for Horizontal Menu
|
||
|
$('a[data-toggle="user-info-menu-horizontal"]').on('click', function(ev)
|
||
|
{
|
||
|
ev.preventDefault();
|
||
|
|
||
|
public_vars.$userInfoMenuHor.find('.nav.nav-userinfo').toggleClass('mobile-is-visible');
|
||
|
|
||
|
});
|
||
|
|
||
|
|
||
|
|
||
|
// Panel Close
|
||
|
$('body').on('click', '.panel a[data-toggle="remove"]', function(ev)
|
||
|
{
|
||
|
ev.preventDefault();
|
||
|
|
||
|
var $panel = $(this).closest('.panel'),
|
||
|
$panel_parent = $panel.parent();
|
||
|
|
||
|
$panel.remove();
|
||
|
|
||
|
if($panel_parent.children().length == 0)
|
||
|
{
|
||
|
$panel_parent.remove();
|
||
|
}
|
||
|
});
|
||
|
|
||
|
|
||
|
|
||
|
// Panel Reload
|
||
|
$('body').on('click', '.panel a[data-toggle="reload"]', function(ev)
|
||
|
{
|
||
|
ev.preventDefault();
|
||
|
|
||
|
var $panel = $(this).closest('.panel');
|
||
|
|
||
|
// This is just a simulation, nothing is going to be reloaded
|
||
|
$panel.append('<div class="panel-disabled"><div class="loader-1"></div></div>');
|
||
|
|
||
|
var $pd = $panel.find('.panel-disabled');
|
||
|
|
||
|
setTimeout(function()
|
||
|
{
|
||
|
$pd.fadeOut('fast', function()
|
||
|
{
|
||
|
$pd.remove();
|
||
|
});
|
||
|
|
||
|
}, 500 + 300 * (Math.random() * 5));
|
||
|
});
|
||
|
|
||
|
|
||
|
|
||
|
// Panel Expand/Collapse Toggle
|
||
|
$('body').on('click', '.panel a[data-toggle="panel"]', function(ev)
|
||
|
{
|
||
|
ev.preventDefault();
|
||
|
|
||
|
var $panel = $(this).closest('.panel');
|
||
|
|
||
|
$panel.toggleClass('collapsed');
|
||
|
});
|
||
|
|
||
|
|
||
|
|
||
|
// Loading Text toggle
|
||
|
$('[data-loading-text]').each(function(i, el) // Temporary for demo purpose only
|
||
|
{
|
||
|
var $this = $(el);
|
||
|
|
||
|
$this.on('click', function(ev)
|
||
|
{
|
||
|
$this.button('loading');
|
||
|
|
||
|
setTimeout(function(){ $this.button('reset'); }, 1800);
|
||
|
});
|
||
|
});
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
// Popovers and tooltips
|
||
|
$('[data-toggle="popover"]').each(function(i, el)
|
||
|
{
|
||
|
var $this = $(el),
|
||
|
placement = attrDefault($this, 'placement', 'right'),
|
||
|
trigger = attrDefault($this, 'trigger', 'click'),
|
||
|
popover_class = $this.get(0).className.match(/(popover-[a-z0-9]+)/i);
|
||
|
|
||
|
$this.popover({
|
||
|
placement: placement,
|
||
|
trigger: trigger
|
||
|
});
|
||
|
|
||
|
if(popover_class)
|
||
|
{
|
||
|
$this.removeClass(popover_class[1]);
|
||
|
|
||
|
$this.on('show.bs.popover', function(ev)
|
||
|
{
|
||
|
setTimeout(function()
|
||
|
{
|
||
|
var $popover = $this.next();
|
||
|
$popover.addClass(popover_class[1]);
|
||
|
|
||
|
}, 0);
|
||
|
});
|
||
|
}
|
||
|
});
|
||
|
|
||
|
$('[data-toggle="tooltip"]').each(function(i, el)
|
||
|
{
|
||
|
var $this = $(el),
|
||
|
placement = attrDefault($this, 'placement', 'top'),
|
||
|
trigger = attrDefault($this, 'trigger', 'hover'),
|
||
|
tooltip_class = $this.get(0).className.match(/(tooltip-[a-z0-9]+)/i);
|
||
|
|
||
|
$this.tooltip({
|
||
|
placement: placement,
|
||
|
trigger: trigger
|
||
|
});
|
||
|
|
||
|
if(tooltip_class)
|
||
|
{
|
||
|
$this.removeClass(tooltip_class[1]);
|
||
|
|
||
|
$this.on('show.bs.tooltip', function(ev)
|
||
|
{
|
||
|
setTimeout(function()
|
||
|
{
|
||
|
var $tooltip = $this.next();
|
||
|
$tooltip.addClass(tooltip_class[1]);
|
||
|
|
||
|
}, 0);
|
||
|
});
|
||
|
}
|
||
|
});
|
||
|
|
||
|
});
|
||
|
|
||
|
})(jQuery, window);
|