peff48bpz/result/views/app-assets/js/scripts/tooltip/tooltip.js

/*=========================================================================================
	File Name: tooltip.js
	Description: Tooltips are an updated version, which don’t rely on images, 
				use CSS3 for animations, and data-attributes for local title storage.
	----------------------------------------------------------------------------------------
	Item Name: Modern Admin - Clean Bootstrap 4 Dashboard HTML Template
	Version: 1.0
	Author: Pixinvent
	Author URL: hhttp://www.themeforest.net/user/pixinvent
==========================================================================================*/
	(function(window, document, $) {
	'use strict';

	/******************/
	// Tooltip events //
	/******************/

	// onShow event
	$('#show-tooltip').tooltip({
		title: 'Tooltip Show Event',
		trigger: 'click',
		placement: 'right'
		}).on('show.bs.tooltip', function() {
			alert('Show event fired.');
	});

	// onShown event
	$('#shown-tooltip').tooltip({
		title: 'Tooltip Shown Event',
		trigger: 'click',
		placement: 'top'
	}).on('shown.bs.tooltip', function() {
		alert('Shown event fired.');
	});

	// onHide event
	$('#hide-tooltip').tooltip({
		title: 'Tooltip Hide Event',
		trigger: 'click',
		placement: 'bottom'
	}).on('hide.bs.tooltip', function() {
		alert('Hide event fired.');
	});

	// onHidden event
	$('#hidden-tooltip').tooltip({
		title: 'Tooltip Hidden Event',
		trigger: 'click',
		placement: 'left'
	}).on('hidden.bs.tooltip', function() {
		alert('Hidden event fired.');
	});


	/*******************/
	// Tooltip methods //
	/*******************/

	// Show method
	$('#show-method').on('click', function() {
		$(this).tooltip('show');
	});
	// Hide method
	$('#hide-method').on('mouseenter', function() {
		$(this).tooltip('show');
	});
	$('#hide-method').on('click', function() {
		$(this).tooltip('hide');
	});
	// Toggle method
	$('#toggle-method').on('click', function() {
		$(this).tooltip('toggle');
	});
	// Dispose method
	$('#dispose').on('click', function() {
		$('#dispose-method').tooltip('dispose');
	});

	/* Trigger*/
	$('.manual').on('click', function() {
		$(this).tooltip('show');
	});
	$('.manual').on('mouseout', function() {
		$(this).tooltip('hide');
	});

	/* Default template */
	$(".template").on('click', function(){
		console.log(
			'<div class="tooltip" role="tooltip">' +
			'<div class="tooltip-arrow"></div>' +
			'<div class="tooltip-inner"></div>' +
			'</div>'
		);
	});

	// Custom Tooltip
	$("[data-popup=tooltip-custom]").on('shown.bs.tooltip', function(){
		var bg = "",
		text = "",
		bgClass = "",
		textClass = "",
		$this = $(this);
		if($this.data("bg-color") !== undefined){
			bg = $this.data("bg-color");
			bgClass = "tooltip-bg-" +bg;
			$('.tooltip').addClass(bgClass);
		}
		if($this.data("text-color") !== undefined){
			text = $this.data("text-color");
			textClass = "tooltip-text-" +text;
			$('.tooltip').addClass(textClass);
		}
	});
	$("[data-popup=tooltip-custom]").on('hidden.bs.tooltip', function(){
		var bg = "",
		text = "",
		bgClass = "",
		textClass = "",
		$this = $(this);
		if($this.data("bg-color") !== undefined){
			bg = $this.data("bg-color");
			bgClass = "tooltip-bg-" +bg;
			$('.tooltip').removeClass(bgClass);
		}
		if($this.data("text-color") !== undefined){
			text = $this.data("text-color");
			textClass = "tooltip-text-" +text;
			$('.tooltip').removeClass(textClass);
		}
	});
})(window, document, jQuery);