2 popModal - 1.21 [18.11.15]
4 Github: https://github.com/vadimsva/popModal
8 $.fn.popModal = function (method) {
13 elemClass = 'popModal',
14 overflowContentClass = '',
19 effectOut = 'fadeOut',
30 init: function (params) {
35 onDocumentClickClose: true,
36 onDocumentClickClosePrevent: '',
37 overflowContent: false,
40 beforeLoadingContent: 'Please, wait...',
41 onOkBut: function () {
44 onCancelBut: function () {
48 onClose: function () {
51 _options = $.extend(_defaults, params);
53 if ($('body').find('.' + elemClass).length !== 0 && $('body').find('.' + elemClass).attr('data-popmodal_id') == elem.attr('data-popmodal_id')) {
56 $('html.' + elemClass + 'Open').off('.' + elemClass + 'Event').removeClass(elemClass + 'Open');
57 $('.' + elemClass + '_source').replaceWith($('.' + elemClass + '_content').children());
58 $('.' + elemClass).remove();
60 if (elem.css('position') == 'fixed') {
61 isFixed = 'position:fixed;';
63 if (_options.asMenu) {
64 asMenuClass = ' ' + elemClass + '_asMenu';
67 if (_options.showCloseBut) {
68 closeBut = $('<button type="button" class="close">×</button>');
70 if (_options.overflowContent) {
71 overflowContentClass = ' ' + elemClass + '_contentOverflow';
73 overflowContentClass = '';
77 currentID = new Date().getMilliseconds();
78 elem.attr('data-popmodal_id', currentID);
80 var tooltipContainer = $('<div class="' + elemClass + ' animated" style="' + isFixed + '" data-popmodal_id="' + currentID + '"></div>');
81 var tooltipContent = $('<div class="' + elemClass + '_content' + overflowContentClass + asMenuClass + '"></div>');
82 tooltipContainer.append(closeBut, tooltipContent);
84 if ($.isFunction(_options.html)) {
85 var beforeLoadingContent = _options.beforeLoadingContent;
86 tooltipContent.append(beforeLoadingContent);
87 _options.html(function (loadedContent) {
88 tooltipContent.empty().append(loadedContent);
89 elemObj = $('.' + elemClass);
93 if ($.type(_options.html) == 'object') {
94 _options.html.after($('<div class="popModal_source"></div>'));
96 tooltipContent.append(_options.html);
98 if ($(window).width() <= 500) {
99 _options.inline = true;
102 if (_options.inline) {
103 elem.after(tooltipContainer);
105 $('body').append(tooltipContainer);
108 elemObj = $('.' + elemClass);
109 elemObj.css('height', method.html.outerHeight() + elemObj.marginBottom + elemObj.marginTop + elemObj.borderBottomWidth + elemObj.borderTopWidth + elemObj.paddingBottom + elemObj.paddingTop);
110 var elemObjFooter = elemObj.find('.' + elemClass + '_footer');
111 if (elemObjFooter.length != 0) {
112 elemObj.find('.' + elemClass + '_content').css({marginBottom: elemObjFooter.outerHeight() + 15 + 'px'});
115 if (!$.isFunction(_options.html)) {
117 if ($.type(_options.html) == 'string') {
118 htmlStr = _options.html;
120 htmlStr = _options.html[0].outerHTML;
124 if (_options.onLoad && $.isFunction(_options.onLoad)) {
127 $(_options.html).trigger('load');
129 elemObj.on('destroyed', function () {
130 if (_options.onClose && $.isFunction(_options.onClose)) {
133 $(_options.html).trigger('close');
138 if (_options.onDocumentClickClose) {
139 $('html').on('click.' + elemClass + 'Event', function (event) {
140 $(this).addClass(elemClass + 'Open');
141 if (elemObj.is(':hidden')) {
144 var target = $(event.target);
145 if (!target.parents().andSelf().is('.' + elemClass) && !target.parents().andSelf().is(elem)) {
146 var zIndex = parseInt(target.parents().filter(function () {
147 return $(this).css('zIndex') !== 'auto';
148 }).first().css('zIndex'));
152 if (_options.onDocumentClickClosePrevent !== '' && target.is(_options.onDocumentClickClosePrevent)) {
155 var target_zIndex = target.css('zIndex');
156 if (target_zIndex == 'auto') {
159 if (zIndex < target_zIndex) {
160 zIndex = target_zIndex;
162 if (zIndex <= elemObj.css('zIndex')) {
169 $(window).resize(function () {
173 elemObj.find('.close').on('click', function () {
175 $(this).off('click');
178 elemObj.find('[data-popmodal-but="close"]').unbind('click');
179 elemObj.find('[data-popmodal-but="close"]').on('click', function () {
181 $(this).off('click');
184 elemObj.find('[data-popmodal-but="ok"]').unbind('click');
185 elemObj.find('[data-popmodal-but="ok"]').on('click', function (event) {
187 if (_options.onOkBut && $.isFunction(_options.onOkBut)) {
188 ok = _options.onOkBut(event);
192 $(this).off('click');
193 $(_options.html).trigger('okbut');
197 elemObj.find('[data-popmodal-but="cancel"]').unbind('click');
198 elemObj.find('[data-popmodal-but="cancel"]').on('click', function () {
199 if (_options.onCancelBut && $.isFunction(_options.onCancelBut)) {
200 _options.onCancelBut();
203 $(this).off('click');
204 $(_options.html).trigger('cancelbut');
207 $('html').on('keydown.' + elemClass + 'Event', function (event) {
208 if (event.keyCode == 27) {
221 function getPlacement() {
222 if (_options.inline) {
223 var eLeft = elem.position().left;
224 var eTop = elem.position().top;
226 var eLeft = elem.offset().left;
227 var eTop = elem.offset().top;
230 eMLeft = parseInt(elem.css('marginLeft')),
231 ePLeft = parseInt(elem.css('paddingLeft')),
232 eMTop = parseInt(elem.css('marginTop')),
233 eHeight = elem.outerHeight(),
234 eWidth = elem.outerWidth(),
235 eObjWidth = elemObj.outerWidth(),
236 eObjHeight = elemObj.outerHeight();
239 eOffsetLeft = elem.offset().left,
240 eOffsetRight = $(window).width() - elem.offset().left - eWidth,
241 eOffsetTop = elem.offset().top,
242 deltaL = eOffsetLeft - offset - eObjWidth,
243 deltaBL = eWidth + eOffsetLeft - eObjWidth,
244 deltaR = eOffsetRight - offset - eObjWidth,
245 deltaBR = eWidth + eOffsetRight - eObjWidth,
246 deltaCL = eWidth / 2 + eOffsetLeft - eObjWidth / 2,
247 deltaCR = eWidth / 2 + eOffsetRight - eObjWidth / 2,
248 deltaC = Math.min(deltaCR, deltaCL),
249 deltaCT = eOffsetTop - eObjHeight / 2;
251 function optimalPosition(current) {
253 var maxDelta = Math.max(deltaBL, deltaBR, deltaC);
254 if (isCurrentFits(current)) {
256 } else if (deltaBR > 0 && deltaBR == maxDelta) {
258 } else if (deltaBL > 0 && deltaBL == maxDelta) {
260 } else if (deltaC > 0 && deltaC == maxDelta) {
268 function isCurrentFits(current) {
269 return current == bl ? deltaBR > 0
270 : current == br ? deltaBL > 0
274 if ((/^bottom/).test(_options.placement)) {
275 placement = optimalPosition(_options.placement);
276 } else if ((/^left/).test(_options.placement)) {
278 if (_options.placement == lc && deltaCT > 0) {
284 placement = optimalPosition(bl);
286 } else if ((/^right/).test(_options.placement)) {
288 if (_options.placement == rc && deltaCT > 0) {
294 placement = optimalPosition(br);
298 elemObj.removeAttr('class').addClass(elemClass + ' animated ' + placement);
302 top: eTop + eMTop + eHeight + offset + 'px',
303 left: eLeft + eMLeft + 'px'
304 }).addClass(effectIn + 'Bottom');
308 top: eTop + eMTop + eHeight + offset + 'px',
309 left: eLeft + eMLeft + eWidth - eObjWidth + 'px'
310 }).addClass(effectIn + 'Bottom');
314 top: eTop + eMTop + eHeight + offset + 'px',
315 left: eLeft + eMLeft + (eWidth - eObjWidth) / 2 + 'px'
316 }).addClass(effectIn + 'Bottom');
320 top: eTop + eMTop + 'px',
321 left: eLeft + eMLeft - eObjWidth - offset + 'px'
322 }).addClass(effectIn + 'Left');
326 top: eTop + eMTop + 'px',
327 left: eLeft + eMLeft + eWidth + offset + 'px'
328 }).addClass(effectIn + 'Right');
332 top: eTop + eMTop + eHeight / 2 - eObjHeight / 2 + 'px',
333 left: eLeft + eMLeft - eObjWidth - offset + 'px'
334 }).addClass(effectIn + 'Left');
338 top: eTop + eMTop + eHeight / 2 - eObjHeight / 2 + 'px',
339 left: eLeft + eMLeft + eWidth + offset + 'px'
340 }).addClass(effectIn + 'Right');
345 function popModalClose() {
346 elemObj = $('.' + elemClass);
347 if (elemObj.length) {
350 setTimeout(function () {
351 $('.' + elemClass + '_source').replaceWith($('.' + elemClass + '_content').children());
353 $('html.' + elemClass + 'Open').off('.' + elemClass + 'Event').removeClass(elemClass + 'Open');
358 function getAnimTime() {
360 animTime = elemObj.css('animationDuration');
361 if (animTime !== undefined) {
362 animTime = animTime.replace('s', '') * 1000;
369 function reverseEffect() {
370 var animClassOld = elemObj.attr('class'),
371 animClassNew = animClassOld.replace(effectIn, effectOut);
372 elemObj.removeClass(animClassOld).addClass(animClassNew);
375 if (methods[method]) {
376 return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
377 } else if (typeof method === 'object' || !method) {
378 return methods.init.apply(this, arguments);
383 $('* [data-popmodal-bind]').bind('click', function () {
384 var elemBind = $(this).attr('data-popmodal-bind');
385 var params = {html: $(elemBind)};
386 if ($(this).attr('data-placement') !== undefined) {
387 params['placement'] = $(this).attr('data-placement');
389 if ($(this).attr('data-showclose-but') !== undefined) {
390 params['showCloseBut'] = (/^true$/i).test($(this).attr('data-showclose-but'));
392 if ($(this).attr('data-overflowcontent') !== undefined) {
393 params['overflowContent'] = (/^false$/i).test($(this).attr('data-overflowcontent'));
395 if ($(this).attr('data-ondocumentclick-close') !== undefined) {
396 params['onDocumentClickClose'] = (/^true$/i).test($(this).attr('data-ondocumentclick-close'));
398 if ($(this).attr('data-ondocumentclick-close-prevent') !== undefined) {
399 params['onDocumentClickClosePrevent'] = $(this).attr('data-ondocumentclick-close-prevent');
401 if ($(this).attr('data-inline') !== undefined) {
402 params['inline'] = (/^true$/i).test($(this).attr('data-inline'));
404 if ($(this).attr('data-beforeloading-content') !== undefined) {
405 params['beforeLoadingContent'] = $(this).attr('data-beforeloading-content');
407 $(this).popModal(params);
410 $.event.special.destroyed = {
411 remove: function (o) {
422 $.fn.notifyModal = function (method) {
425 elemClass = 'notifyModal',
431 init: function (params) {
437 onClose: function () {
440 _options = $.extend(_defaults, params);
442 if (_options.overlay) {
443 onTopClass = 'overlay';
446 $('.' + elemClass).remove();
447 var notifyContainer = $('<div class="' + elemClass + ' ' + _options.placement + ' ' + onTopClass + ' ' + _options.type + '"></div>');
448 var notifyContent = $('<div class="' + elemClass + '_content"></div>');
449 var closeBut = $('<button type="button" class="close">×</button>');
450 if (elem[0] === undefined) {
451 elem = elem['selector'];
453 elem = elem[0].innerHTML;
455 notifyContent.append(closeBut, elem);
456 notifyContainer.append(notifyContent);
457 $('body').append(notifyContainer);
459 elemObj = $('.' + elemClass);
462 elemObj.addClass('open');
463 elemObj.click(function () {
466 if (_options.duration != -1) {
467 notifDur = setTimeout(notifyModalClose, _options.duration);
476 function notifyModalClose() {
477 var elemObj = $('.' + elemClass);
478 elemObj.removeClass('open');
479 setTimeout(function () {
481 if (_options.duration != -1) {
482 clearTimeout(notifDur);
484 if (_options.onClose && $.isFunction(_options.onClose)) {
490 function getAnimTime() {
492 animTime = elemObj.css('transitionDuration');
493 if (animTime !== undefined) {
494 animTime = animTime.replace('s', '') * 1000;
501 $('html').keydown(function (event) {
502 if (event.keyCode == 27) {
507 if (methods[method]) {
508 return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
509 } else if (typeof method === 'object' || !method) {
510 return methods.init.apply(this, arguments);
515 $('* [data-notifymodal-bind]').bind('click', function () {
516 var elemBind = $(this).attr('data-notifymodal-bind');
518 if ($(this).attr('data-duration') !== undefined) {
519 params['duration'] = parseInt($(this).attr('data-duration'));
521 if ($(this).attr('data-placement') !== undefined) {
522 params['placement'] = $(this).attr('data-placement');
524 if ($(this).attr('data-ontop') !== undefined) {
525 params['onTop'] = (/^true$/i).test($(this).attr('data-ontop'));
527 $(elemBind).notifyModal(params);
535 $.fn.hintModal = function (method) {
536 $('.hintModal').off();
541 $(this).on('mouseenter', function () {
542 var elem = $(this).find('> .hintModal_container');
543 if (elem[0].textContent.length > 1) {
544 elem.addClass('animated fadeInBottom');
545 getPlacement($(this), elem);
549 $(this).on('mouseleave', function () {
550 var elem = $(this).find('> .hintModal_container');
551 if (elem[0].textContent.length > 1) {
552 elem.removeClass('animated fadeInBottom');
556 function getPlacement(elemObj, elem) {
557 var placementDefault,
558 classDefault = elemObj.attr('class'),
559 eObjWidth = elemObj.outerWidth(),
560 eWidth = elem.outerWidth(),
561 eOffsetLeft = elemObj.offset().left,
562 eOffsetRight = $(window).width() - elemObj.offset().left - eObjWidth,
563 deltaBL = eObjWidth + eOffsetLeft - eWidth,
564 deltaBR = eObjWidth + eOffsetRight - eWidth,
565 deltaCL = eObjWidth / 2 + eOffsetLeft - eWidth / 2,
566 deltaCR = eObjWidth / 2 + eOffsetRight - eWidth / 2,
567 deltaC = Math.min(deltaCR, deltaCL),
572 if (elemObj.hasClass(bl)) {
573 placementDefault = bl;
574 } else if (elemObj.hasClass(bc)) {
575 placementDefault = bc;
576 } else if (elemObj.hasClass(br)) {
577 placementDefault = br;
579 placementDefault = bl;
582 if (elemObj.data('placement') === undefined) {
583 elemObj.data('placement', placementDefault);
586 function optimalPosition(current) {
588 var maxDelta = Math.max(deltaBL, deltaBR, deltaC);
589 if (isCurrentFits(current)) {
591 } else if (deltaBR > 0 && deltaBR == maxDelta) {
593 } else if (deltaBL > 0 && deltaBL == maxDelta) {
595 } else if (deltaC > 0 && deltaC == maxDelta) {
603 function isCurrentFits(current) {
604 return current == bl ? deltaBR > 0
605 : current == br ? deltaBL > 0
609 elemObj.removeAttr('class').addClass(classDefault + ' ' + optimalPosition(elemObj.data('placement')));
615 if (methods[method]) {
616 return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
617 } else if (typeof method === 'object' || !method) {
618 return methods.init.apply(this, arguments);
622 $('.hintModal').hintModal();
623 document.addEventListener("DOMNodeInserted", function (event) {
624 if ($(event.target).hasClass('hintModal')) {
625 $('.hintModal').hintModal();
633 $.fn.dialogModal = function (method) {
636 elemClass = 'dialogModal',
637 prevBut = 'dialogPrev',
638 nextBut = 'dialogNext',
643 init: function (params) {
648 onOkBut: function () {
651 onCancelBut: function () {
653 onLoad: function () {
655 onClose: function () {
657 onChange: function () {
660 _options = $.extend(_defaults, params);
662 $('html.' + elemClass + 'Open').off('.' + elemClass + 'Event').removeClass(elemClass + 'Open');
663 $('.' + elemClass + ' .' + prevBut + ', .' + elemClass + ' .' + nextBut).off('click');
664 $('.' + elemClass).remove();
666 if (_options.type == '') {
669 _options.top = 'calc(' + _options.top + ' + 60px)';
672 var currentDialog = 0,
673 maxDialog = elem.length - 1,
674 dialogMain = $('<div class="' + elemClass + ' ' + _options.type + '" style="top:' + _options.topOffset + 'px"></div>'),
675 dialogContainer = $('<div class="' + elemClass + '_container" style="top:' + _options.top + '"></div>'),
676 dialogTop = $('<div class="' + elemClass + '_top animated"></div>'),
677 dialogHeader = $('<div class="' + elemClass + '_header"></div>'),
678 dialogBody = $('<div class="' + elemClass + '_body animated"></div>'),
679 dialogCloseBut = $('<button type="button" class="close">×</button>');
680 dialogMain.append(dialogContainer);
681 dialogContainer.append(dialogTop, dialogBody);
682 dialogTop.append(dialogHeader);
683 dialogHeader.append(dialogCloseBut);
684 dialogBody.append(elem[currentDialog].innerHTML);
687 dialogHeader.append($('<div class="' + nextBut + '">›</div><div class="' + prevBut + ' notactive">‹</div>'));
689 dialogHeader.append('<span>' + elem.find('.' + elemClass + '_header')[currentDialog].innerHTML + '</span>');
691 $('body').append(dialogMain).addClass(elemClass + 'Open');
692 if (_options.type == '') {
693 var getScrollBarWidth = dialogMain.outerWidth() - dialogMain[0].scrollWidth;
694 dialogTop.css({right: getScrollBarWidth + 'px'});
697 elemObj = $('.' + elemClass);
700 if (_options.onLoad && $.isFunction(_options.onLoad)) {
701 _options.onLoad(elemObj, currentDialog + 1);
703 elem.trigger('load', {el: elemObj, current: currentDialog + 1});
705 elemObj.on('destroyed', function () {
706 if (_options.onClose && $.isFunction(_options.onClose)) {
709 elem.trigger('close');
712 elemObj.addClass('open');
713 setTimeout(function () {
714 if (_options.type != '') {
715 dialogContainer.css({opacity: 1});
717 dialogTop.addClass('fadeInTopBig');
718 dialogBody.addClass('fadeInTopBig');
723 function bindFooterButtons() {
724 elemObj.find('[data-dialogmodal-but="close"]').on('click', function () {
726 $(this).off('click');
729 elemObj.find('[data-dialogmodal-but="ok"]').on('click', function (event) {
731 if (_options.onOkBut && $.isFunction(_options.onOkBut)) {
732 ok = _options.onOkBut(event);
737 $(this).off('click');
738 elem.trigger('okbut');
741 elemObj.find('[data-dialogmodal-but="cancel"]').on('click', function () {
742 if (_options.onCancelBut && $.isFunction(_options.onCancelBut)) {
743 _options.onCancelBut();
746 $(this).off('click');
747 elem.trigger('cancelbut');
750 elemObj.find('[data-dialogmodal-but="prev"]').on('click', function () {
751 elemObj.find('.' + prevBut).click();
754 elemObj.find('[data-dialogmodal-but="next"]').on('click', function () {
755 elemObj.find('.' + nextBut).click();
759 elemObj.find('.' + prevBut).on('click', function () {
760 if (currentDialog > 0) {
762 if (currentDialog < maxDialog) {
763 elemObj.find('.' + nextBut).removeClass('notactive');
765 if (currentDialog === 0) {
766 elemObj.find('.' + prevBut).addClass('notactive');
768 changeDialogContent();
772 elemObj.find('.' + nextBut).on('click', function () {
773 if (currentDialog < maxDialog) {
775 if (currentDialog > 0) {
776 elemObj.find('.' + prevBut).removeClass('notactive');
778 if (currentDialog == maxDialog) {
779 elemObj.find('.' + nextBut).addClass('notactive');
781 changeDialogContent();
785 function changeDialogContent() {
786 dialogBody.empty().append(elem[currentDialog].innerHTML);
787 dialogHeader.find('span').html(elem.find('.' + elemClass + '_header')[currentDialog].innerHTML);
789 if (_options.onChange && $.isFunction(_options.onChange)) {
790 _options.onChange(elemObj, currentDialog + 1);
792 elem.trigger('change', {el: elemObj, current: currentDialog + 1});
795 elemObj.find('.close').on('click', function () {
797 $(this).off('click');
800 $('html').on('keydown.' + elemClass + 'Event', function (event) {
801 if (event.keyCode == 27) {
803 } else if (event.keyCode == 37) {
804 elemObj.find('.' + prevBut).click();
805 } else if (event.keyCode == 39) {
806 elemObj.find('.' + nextBut).click();
816 function dialogModalClose() {
817 var elemObj = $('.' + elemClass);
818 elemObj.removeClass('open');
819 setTimeout(function () {
821 $('body').removeClass(elemClass + 'Open').css({paddingRight: ''});
822 $('html.' + elemClass + 'Open').off('.' + elemClass + 'Event').removeClass(elemClass + 'Open');
823 elemObj.find('.' + prevBut).off('click');
824 elemObj.find('.' + nextBut).off('click');
828 function getAnimTime() {
830 animTime = elemObj.css('transitionDuration');
831 if (animTime !== undefined) {
832 animTime = animTime.replace('s', '') * 1000;
839 if (methods[method]) {
840 return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
841 } else if (typeof method === 'object' || !method) {
842 return methods.init.apply(this, arguments);
847 $('* [data-dialogmodal-bind]').bind('click', function () {
848 var elemBind = $(this).attr('data-dialogmodal-bind');
850 if ($(this).attr('data-topoffset') !== undefined) {
851 params['topOffset'] = $(this).attr('data-topoffset');
853 if ($(this).attr('data-top') !== undefined) {
854 params['top'] = $(this).attr('data-top');
856 if ($(this).attr('data-topoffset') !== undefined) {
857 params['type'] = $(this).attr('data-type');
859 $(elemBind).dialogModal(params);
862 $.event.special.destroyed = {
863 remove: function (o) {
874 $.fn.titleModal = function (method) {
875 $('.titleModal').off();
881 elemClass = 'titleModal',
882 getElem = $('.' + elemClass),
884 effectOut = 'fadeOut';
886 getElem.on('mouseenter', function () {
889 if (elem.attr('title') !== undefined || elem.css('textOverflow') == 'ellipsis' || elem.css('textOverflow') == 'clip') {
890 if (elem.attr('title') !== undefined) {
891 titleAttr = elem.attr('title');
893 titleAttr = elem.text();
895 elem.removeAttr('title');
896 elem.attr('data-title', titleAttr);
897 var titleModal = $('<div class="' + elemClass + '_container animated"></div>');
898 elemObj = $('.' + elemClass + '_container');
899 var placement = elem.attr('data-placement');
900 if (placement === undefined) {
901 placement = 'bottom';
906 elem.append(titleModal.append(titleAttr));
907 getPlacement(placement);
911 getElem.on('mouseleave', function () {
914 if (elem.attr('data-title') !== undefined) {
915 titleAttr = elem.attr('data-title');
916 elem.removeAttr('data-title');
917 elem.attr('title', titleAttr);
923 function getPlacement(placement) {
924 elemObj = $('.' + elemClass + '_container');
926 eMLeft = elem.css('marginLeft'),
927 eMTop = elem.css('marginTop'),
928 eMBottom = elem.css('marginBottom'),
929 eHeight = elem.outerHeight(),
930 eWidth = elem.outerWidth(),
931 eObjMTop = elemObj.css('marginTop'),
932 eObjWidth = elemObj.outerWidth(),
933 eObjHeight = elemObj.outerHeight();
934 if (elem.css('position') == 'fixed' || elem.css('position') == 'absolute') {
938 eLeft = elem.position().left;
939 eTop = elem.position().top;
944 marginTop: parseInt(eObjMTop) - parseInt(eMBottom) + 'px',
945 left: eLeft + parseInt(eMLeft) + (eWidth - eObjWidth) / 2 + 'px'
946 }).addClass(effectIn + 'Bottom');
950 top: eTop + parseInt(eMTop) - eObjHeight + 'px',
951 left: eLeft + parseInt(eMLeft) + (eWidth - eObjWidth) / 2 + 'px'
952 }).addClass('top ' + effectIn + 'Top');
956 top: eTop + parseInt(eMTop) + eHeight / 2 - eObjHeight / 2 + 'px',
957 left: eLeft + parseInt(eMLeft) - eObjWidth - 10 + 'px'
958 }).addClass('left ' + effectIn + 'Left');
962 top: eTop + parseInt(eMTop) + eHeight / 2 - eObjHeight / 2 + 'px',
963 left: eLeft + parseInt(eMLeft) + eWidth + 10 + 'px'
964 }).addClass('right ' + effectIn + 'Right');
969 function reverseEffect() {
970 var animClassOld = elemObj.attr('class'),
971 animClassNew = animClassOld.replace(effectIn, effectOut);
972 elemObj.removeClass(animClassOld).addClass(animClassNew);
978 if (methods[method]) {
979 return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
980 } else if (typeof method === 'object' || !method) {
981 return methods.init.apply(this, arguments);
985 $('.titleModal').titleModal();
986 document.addEventListener("DOMNodeInserted", function (event) {
987 if ($(event.target).hasClass('titleModal')) {
988 $('.titleModal').titleModal();
996 $.fn.confirmModal = function (method) {
999 elemClass = 'confirmModal',
1004 init: function (params) {
1007 onOkBut: function () {
1010 onCancelBut: function () {
1012 onLoad: function () {
1014 onClose: function () {
1017 _options = $.extend(_defaults, params);
1019 $('html.' + elemClass + 'Open').off('.' + elemClass + 'Event').removeClass(elemClass + 'Open');
1020 $('.' + elemClass).remove();
1022 var dialogMain = $('<div class="' + elemClass + '" style="top:' + _options.topOffset + 'px"></div>'),
1023 dialogBody = $('<div class="' + elemClass + '_body animated"></div>');
1024 dialogMain.append(dialogBody);
1025 dialogBody.append(elem[0].innerHTML);
1027 $('body').append(dialogMain).addClass(elemClass + 'Open');
1029 elemObj = $('.' + elemClass);
1032 if (_options.onLoad && $.isFunction(_options.onLoad)) {
1036 elemObj.on('destroyed', function () {
1037 if (_options.onClose && $.isFunction(_options.onClose)) {
1042 elemObj.addClass('open');
1043 setTimeout(function () {
1044 dialogBody.addClass('fadeInTopBig');
1046 setTimeout(function () {
1047 dialogBody.removeClass('fadeInTopBig').addClass('open');
1052 bindFooterButtons();
1054 function bindFooterButtons() {
1055 elemObj.find('[data-confirmmodal-but="close"]').on('click', function () {
1056 confirmModalClose();
1057 $(this).off('click');
1060 elemObj.find('[data-confirmmodal-but="ok"]').on('click', function (event) {
1062 if (_options.onOkBut && $.isFunction(_options.onOkBut)) {
1063 ok = _options.onOkBut(event);
1066 confirmModalClose();
1068 $(this).off('click');
1071 elemObj.find('[data-confirmmodal-but="cancel"]').on('click', function () {
1072 if (_options.onCancelBut && $.isFunction(_options.onCancelBut)) {
1073 _options.onCancelBut();
1075 confirmModalClose();
1076 $(this).off('click');
1080 function needConfirm() {
1081 dialogBody.addClass('needConfirm');
1082 setTimeout(function () {
1083 dialogBody.removeClass('needConfirm');
1087 elemObj.on('click', function (event) {
1088 var target = $(event.target);
1089 if (!target.parents().andSelf().is(dialogBody)) {
1094 $('html').on('keydown.' + elemClass + 'Event', function (event) {
1095 if (event.keyCode == 27) {
1104 confirmModalClose();
1108 function confirmModalClose() {
1109 var elemObj = $('.' + elemClass);
1110 elemObj.removeClass('open');
1111 setTimeout(function () {
1113 $('body').removeClass(elemClass + 'Open').css({paddingRight: ''});
1114 $('html.' + elemClass + 'Open').off('.' + elemClass + 'Event').removeClass(elemClass + 'Open');
1118 function getAnimTime() {
1120 animTime = elemObj.css('transitionDuration');
1121 if (animTime !== undefined) {
1122 animTime = animTime.replace('s', '') * 1000;
1129 if (methods[method]) {
1130 return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
1131 } else if (typeof method === 'object' || !method) {
1132 return methods.init.apply(this, arguments);
1137 $('* [data-confirmmodal-bind]').bind('click', function () {
1138 var elemBind = $(this).attr('data-confirmmodal-bind');
1140 if ($(this).attr('data-topoffset') !== undefined) {
1141 params['topOffset'] = $(this).attr('data-topoffset');
1143 $(elemBind).confirmModal(params);
1146 $.event.special.destroyed = {
1147 remove: function (o) {