mirror of
https://github.com/10h30/ultimatemember.git
synced 2026-07-11 18:56:10 +09:00
- updated dropdown.js library;
This commit is contained in:
nikitasinelnikov
+173
-64
@@ -1,85 +1,194 @@
|
||||
var um_dropdown_triggers = {};
|
||||
(function ($) {
|
||||
|
||||
function um_init_new_dropdown() {
|
||||
jQuery('.um-new-dropdown').each( function() {
|
||||
var menu = jQuery(this);
|
||||
/**
|
||||
* The constructor of the dropdown object
|
||||
* @param {object} element The menu element.
|
||||
* @returns {object} The dropdown menu object.
|
||||
*/
|
||||
function um_dropdownMenu(element) {
|
||||
|
||||
var is_inited = menu.data( 'um-dropdown-inited' );
|
||||
if ( is_inited ) {
|
||||
return;
|
||||
}
|
||||
var self = {
|
||||
get: function(){
|
||||
return self;
|
||||
},
|
||||
|
||||
var element = menu.data('element');
|
||||
var trigger = menu.data('trigger');
|
||||
show: function () {
|
||||
self.hideAll();
|
||||
|
||||
menu.data( 'um-dropdown-inited', true );
|
||||
/* add dropdown into the <body> */
|
||||
self.$menu = self.$element.find('.um-new-dropdown');
|
||||
if ( !self.$menu.length ) {
|
||||
self.$menu = $('div.um-new-dropdown[data-element="' + self.data.element + '"]').first();
|
||||
}
|
||||
self.$dropdown = self.$menu.clone();
|
||||
self.$dropdown.on('click', 'li a', self.itemHandler); /* add the handler for menu items */
|
||||
$(window).on('resize', self.updatePosition); /* update the position on window resize */
|
||||
$(document.body).append(self.$dropdown);
|
||||
|
||||
if ( -1 === jQuery.inArray( element, um_dropdown_triggers[ trigger ] ) ) {
|
||||
jQuery( document.body ).on( trigger, element, function(e) {
|
||||
var obj = jQuery(this);
|
||||
/* trigger event */
|
||||
self.$element.trigger('um_new_dropdown_render', {
|
||||
dropdown_layout: self.$dropdown,
|
||||
trigger: self.data.trigger,
|
||||
element: self.data.elemen,
|
||||
obj: self.$element
|
||||
});
|
||||
|
||||
if ( obj.data( 'um-new-dropdown-show' ) === true ) {
|
||||
obj.data( 'um-new-dropdown-show', false );
|
||||
obj.find( '.um-new-dropdown' ).hide();
|
||||
} else {
|
||||
jQuery('.um-new-dropdown').hide();
|
||||
jQuery('.um-new-dropdown').parent().data( 'um-new-dropdown-show', false );
|
||||
/* set styles and show */
|
||||
self.$dropdown.css(self.calculatePosition()).show();
|
||||
self.$element.addClass('um-new-dropdown-shown').data('um-new-dropdown-show', true);
|
||||
|
||||
if ( ! obj.find( '.um-new-dropdown' ).length ) {
|
||||
var dropdown_layout = menu.clone();
|
||||
return self;
|
||||
},
|
||||
|
||||
// dropdown_layout.css({
|
||||
// top : '20px',
|
||||
// width: '150px',
|
||||
// right: 0
|
||||
// });
|
||||
|
||||
obj.append( dropdown_layout );
|
||||
|
||||
obj.trigger( 'fmwp_dropdown_render', { dropdown_layout:dropdown_layout, trigger:trigger, element:element, obj:obj} );
|
||||
|
||||
dropdown_layout.show();
|
||||
} else {
|
||||
obj.find( '.um-new-dropdown' )./*css({
|
||||
top : '20px',
|
||||
width: '150px',
|
||||
right: 0
|
||||
}).*/show();
|
||||
hide: function () {
|
||||
if ( self.$dropdown && self.$dropdown.is(':visible') ) {
|
||||
$(window).off('resize', self.updatePosition);
|
||||
self.$dropdown.remove();
|
||||
self.$element.removeClass('um-new-dropdown-shown').data('um-new-dropdown-show', false);
|
||||
}
|
||||
|
||||
obj.data( 'um-new-dropdown-show', true );
|
||||
return self;
|
||||
},
|
||||
|
||||
jQuery( document.body ).bind( 'click', function( event ) {
|
||||
|
||||
if ( jQuery('.um-new-dropdown').find( '.' + jQuery( event.target ).attr('class').trim().replace( ' ', '.' ) ).length === 0 &&
|
||||
|
||||
hideAll: function () {
|
||||
self.hide();
|
||||
$('body > div.um-new-dropdown').remove();
|
||||
$('.um-new-dropdown-shown').removeClass('um-new-dropdown-shown').data('um-new-dropdown-show', false);
|
||||
|
||||
jQuery( '.' + jQuery(event.target).attr('class').trim() ) !== element ) {
|
||||
//event = ev;
|
||||
jQuery('.um-new-dropdown').hide();
|
||||
jQuery('.um-new-dropdown').parent().data( 'um-new-dropdown-show', false );
|
||||
jQuery( document.body ).unbind( event );
|
||||
return self;
|
||||
},
|
||||
|
||||
}
|
||||
});
|
||||
calculatePosition: function () {
|
||||
var offset = self.$element.offset(),
|
||||
rect = self.$element.get(0).getBoundingClientRect(),
|
||||
height = self.$dropdown.innerHeight() || 150,
|
||||
width = self.data.width || 150,
|
||||
place = '';
|
||||
|
||||
var css = {
|
||||
position: 'absolute',
|
||||
width: width + 'px'
|
||||
};
|
||||
|
||||
/* vertical position */
|
||||
if ( window.innerHeight - rect.bottom > height ) {
|
||||
css.top = offset.top + rect.height + 'px';
|
||||
place += 'bottom';
|
||||
} else {
|
||||
place += 'top';
|
||||
css.top = offset.top - height + 'px';
|
||||
}
|
||||
|
||||
/* horisontal position */
|
||||
if ( offset.left > width || offset.left > window.innerWidth / 2 ) {
|
||||
css.left = offset.left + rect.width - width + 'px';
|
||||
place += '-left';
|
||||
} else {
|
||||
css.left = offset.left + 'px';
|
||||
place += '-right';
|
||||
}
|
||||
|
||||
/* border */
|
||||
switch ( place ) {
|
||||
case 'bottom-right':
|
||||
css.borderRadius = '0px 5px 5px 5px';
|
||||
break;
|
||||
case 'bottom-left':
|
||||
css.borderRadius = '5px 0px 5px 5px';
|
||||
break;
|
||||
case 'top-right':
|
||||
css.borderRadius = '5px 5px 5px 0px';
|
||||
break;
|
||||
case 'top-left':
|
||||
css.borderRadius = '5px 5px 0px 5px';
|
||||
break;
|
||||
}
|
||||
|
||||
return css;
|
||||
},
|
||||
|
||||
updatePosition: function () {
|
||||
if ( self.$dropdown && self.$dropdown.is(':visible') ) {
|
||||
self.$dropdown.css(self.calculatePosition());
|
||||
}
|
||||
|
||||
return self;
|
||||
},
|
||||
|
||||
itemHandler: function (e) {
|
||||
e.stopPropagation();
|
||||
|
||||
/* trigger 'click' in the original menu */
|
||||
var attrClass = $(e.currentTarget).attr('class');
|
||||
self.$menu.find('li a[class="' + attrClass + '"]').trigger('click');
|
||||
|
||||
/* hide dropdown */
|
||||
self.hide();
|
||||
},
|
||||
|
||||
triggerHandler: function (e) {
|
||||
e.stopPropagation();
|
||||
|
||||
self.$element = $(e.currentTarget);
|
||||
|
||||
if ( self.$element.data('um-new-dropdown-show') ) {
|
||||
self.hide();
|
||||
} else {
|
||||
self.show();
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
if ( typeof um_dropdown_triggers[ trigger ] == 'undefined' ) {
|
||||
um_dropdown_triggers[ trigger ] = [];
|
||||
}
|
||||
um_dropdown_triggers[ trigger ].push( element );
|
||||
self.$menu = $(element);
|
||||
|
||||
self.data = self.$menu.data();
|
||||
|
||||
self.$element = self.$menu.closest(self.data.element);
|
||||
if ( !self.$element.length ) {
|
||||
self.$element = $(self.data.element).first();
|
||||
}
|
||||
});
|
||||
|
||||
self.$dropdown = $(document.body).children('div[data-element="' + self.data.element + '"]');
|
||||
|
||||
if ( typeof self.data.initted === 'undefined' ) {
|
||||
self.$menu.data('initted', true);
|
||||
$(document.body).on(self.data.trigger, self.data.element, self.triggerHandler);
|
||||
}
|
||||
|
||||
if ( typeof um_dropdownMenu.globalHandlersInitted === 'undefined' ) {
|
||||
um_dropdownMenu.globalHandlersInitted = true;
|
||||
$(document.body).on('click', function (e) {
|
||||
if ( !$(e.target).closest('.um-new-dropdown').length ) {
|
||||
self.hideAll();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
return self;
|
||||
}
|
||||
|
||||
/* Add the method um_dropdownMenu() to the jQuery */
|
||||
$.fn.um_dropdownMenu = function (action) {
|
||||
if ( typeof action === 'string' && action ) {
|
||||
return this.map( function (i, menu) {
|
||||
var obj = um_dropdownMenu( menu );
|
||||
return typeof obj[action] === 'function' ? obj[action]() : obj[action];
|
||||
} ).toArray();
|
||||
} else {
|
||||
return this.each( function (i, menu) {
|
||||
um_dropdownMenu( menu );
|
||||
} );
|
||||
}
|
||||
};
|
||||
|
||||
})(jQuery);
|
||||
|
||||
|
||||
function um_init_new_dropdown() {
|
||||
jQuery('.um-new-dropdown').um_dropdownMenu();
|
||||
}
|
||||
|
||||
/* Init all dropdown menus on page load */
|
||||
jQuery( document ).ready( function($) {
|
||||
um_init_new_dropdown();
|
||||
|
||||
jQuery( document.body ).on( 'click', '.um-new-dropdown a', function(e) {
|
||||
jQuery(this).parents('.um-new-dropdown').hide();
|
||||
jQuery(this).parents('.um-new-dropdown').parent().data( 'um-new-dropdown-show', false );
|
||||
jQuery('body').trigger('click');
|
||||
e.stopPropagation();
|
||||
});
|
||||
});
|
||||
Vendored
+1
-1
@@ -1 +1 @@
|
||||
var um_dropdown_triggers={};function um_init_new_dropdown(){jQuery(".um-new-dropdown").each(function(){var r=jQuery(this);if(!r.data("um-dropdown-inited")){var e=r.data("element"),u=r.data("trigger");r.data("um-dropdown-inited",!0),-1===jQuery.inArray(e,um_dropdown_triggers[u])&&(jQuery(document.body).on(u,e,function(d){var n=jQuery(this);if(!0===n.data("um-new-dropdown-show"))n.data("um-new-dropdown-show",!1),n.find(".um-new-dropdown").hide();else{if(jQuery(".um-new-dropdown").hide(),jQuery(".um-new-dropdown").parent().data("um-new-dropdown-show",!1),n.find(".um-new-dropdown").length)n.find(".um-new-dropdown").show();else{var o=r.clone();n.append(o),n.trigger("fmwp_dropdown_render",{dropdown_layout:o,trigger:u,element:e,obj:n}),o.show()}n.data("um-new-dropdown-show",!0),jQuery(document.body).bind("click",function(d){0===jQuery(".um-new-dropdown").find("."+jQuery(d.target).attr("class").trim().replace(" ",".")).length&&jQuery("."+jQuery(d.target).attr("class").trim())!==e&&(jQuery(".um-new-dropdown").hide(),jQuery(".um-new-dropdown").parent().data("um-new-dropdown-show",!1),jQuery(document.body).unbind(d))})}}),void 0===um_dropdown_triggers[u]&&(um_dropdown_triggers[u]=[]),um_dropdown_triggers[u].push(e))}})}jQuery(document).ready(function(d){um_init_new_dropdown(),jQuery(document.body).on("click",".um-new-dropdown a",function(d){jQuery(this).parents(".um-new-dropdown").hide(),jQuery(this).parents(".um-new-dropdown").parent().data("um-new-dropdown-show",!1),jQuery("body").trigger("click"),d.stopPropagation()})});
|
||||
function um_init_new_dropdown(){jQuery(".um-new-dropdown").um_dropdownMenu()}!function(t){function d(e){var i={get:function(){return i},show:function(){return i.hideAll(),i.$menu=i.$element.find(".um-new-dropdown"),i.$menu.length||(i.$menu=t('div.um-new-dropdown[data-element="'+i.data.element+'"]').first()),i.$dropdown=i.$menu.clone(),i.$dropdown.on("click","li a",i.itemHandler),t(window).on("resize",i.updatePosition),t(document.body).append(i.$dropdown),i.$element.trigger("um_new_dropdown_render",{dropdown_layout:i.$dropdown,trigger:i.data.trigger,element:i.data.elemen,obj:i.$element}),i.$dropdown.css(i.calculatePosition()).show(),i.$element.addClass("um-new-dropdown-shown").data("um-new-dropdown-show",!0),i},hide:function(){return i.$dropdown&&i.$dropdown.is(":visible")&&(t(window).off("resize",i.updatePosition),i.$dropdown.remove(),i.$element.removeClass("um-new-dropdown-shown").data("um-new-dropdown-show",!1)),i},hideAll:function(){return i.hide(),t("body > div.um-new-dropdown").remove(),t(".um-new-dropdown-shown").removeClass("um-new-dropdown-shown").data("um-new-dropdown-show",!1),i},calculatePosition:function(){var e=i.$element.offset(),n=i.$element.get(0).getBoundingClientRect(),t=i.$dropdown.innerHeight()||150,o=i.data.width||150,d="",r={position:"absolute",width:o+"px"};switch(window.innerHeight-n.bottom>t?(r.top=e.top+n.height+"px",d+="bottom"):(d+="top",r.top=e.top-t+"px"),e.left>o||e.left>window.innerWidth/2?(r.left=e.left+n.width-o+"px",d+="-left"):(r.left=e.left+"px",d+="-right"),d){case"bottom-right":r.borderRadius="0px 5px 5px 5px";break;case"bottom-left":r.borderRadius="5px 0px 5px 5px";break;case"top-right":r.borderRadius="5px 5px 5px 0px";break;case"top-left":r.borderRadius="5px 5px 0px 5px"}return r},updatePosition:function(){return i.$dropdown&&i.$dropdown.is(":visible")&&i.$dropdown.css(i.calculatePosition()),i},itemHandler:function(e){e.stopPropagation();var n=t(e.currentTarget).attr("class");i.$menu.find('li a[class="'+n+'"]').trigger("click"),i.hide()},triggerHandler:function(e){e.stopPropagation(),i.$element=t(e.currentTarget),i.$element.data("um-new-dropdown-show")?i.hide():i.show()}};return i.$menu=t(e),i.data=i.$menu.data(),i.$element=i.$menu.closest(i.data.element),i.$element.length||(i.$element=t(i.data.element).first()),i.$dropdown=t(document.body).children('div[data-element="'+i.data.element+'"]'),void 0===i.data.initted&&(i.$menu.data("initted",!0),t(document.body).on(i.data.trigger,i.data.element,i.triggerHandler)),void 0===d.globalHandlersInitted&&(d.globalHandlersInitted=!0,t(document.body).on("click",function(e){t(e.target).closest(".um-new-dropdown").length||i.hideAll()})),i}t.fn.um_dropdownMenu=function(o){return"string"==typeof o&&o?this.map(function(e,n){var t=d(n);return"function"==typeof t[o]?t[o]():t[o]}).toArray():this.each(function(e,n){d(n)})}}(jQuery),jQuery(document).ready(function(e){um_init_new_dropdown()});
|
||||
@@ -109,8 +109,9 @@ $unique_hash = substr( md5( $args['form_id'] ), 10, 5 ); ?>
|
||||
<a href="javascript:void(0);" class="um-member-actions-a">
|
||||
<i class="um-faicon-cog"></i>
|
||||
</a>
|
||||
<?php UM()->member_directory()->dropdown_menu_js( '.um-member-cog', 'click', 'user' ); ?>
|
||||
</div>
|
||||
|
||||
<?php UM()->member_directory()->dropdown_menu_js( '.um-member-cog', 'click', 'user' ); ?>
|
||||
<# } #>
|
||||
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user