diff --git a/dist/jBox.all.js b/dist/jBox.all.js index 1b44c9f..b2eaed0 100755 --- a/dist/jBox.all.js +++ b/dist/jBox.all.js @@ -135,6 +135,7 @@ function jBoxWrapper(jQuery) { onPosition: null, // Fired when jBox is positioned onCreated: null, // Fired when jBox is created and availible in DOM onOpen: null, // Fired when jBox opens + onOpenComplete: null, // Fired when jBox is completely open (when fading is finished) onClose: null, // Fired when jBox closes onCloseComplete: null, // Fired when jBox is completely closed (when fading is finished) onDragStart: null, // Fired when dragging starts @@ -798,6 +799,7 @@ function jBoxWrapper(jQuery) { var translate = position ? item[1].replace('%XY', this._getXY(position).toUpperCase()) : item[1]; animations[this.options.animation[ev]].positions && (translate = translate.replace('%V', animations[this.options.animation[ev]].positions[position][item[0]])); keyframe_css += item[0] + ' {transform:' + translate + ';}'; + }.bind(this)); keyframe_css += '}'; @@ -864,7 +866,9 @@ function jBoxWrapper(jQuery) { ev == 'close' && (animationDuration = Math.min(animationDuration, this.options.fade)); // Remove animation classes when animation is finished - setTimeout(function () { this.wrapper.removeClass(classnames); }.bind(this), animationDuration); + setTimeout(function () { + this.wrapper && this.wrapper.removeClass(classnames); + }.bind(this), animationDuration); }; @@ -1350,7 +1354,7 @@ function jBoxWrapper(jQuery) { adjustWrapper += (this.pointer.align != options.position[this._getOpp(options.outside)]) ? // If pointer align is different to position align - (this.dimensions[this._getOpp(options.outside)] * (jQuery.inArray(this.pointer.align, ['top', 'left']) !== -1 ? 1 : -1)) + ((this.pointer.dimensions[this._getOpp(options.outside)] / 2) * (jQuery.inArray(this.pointer.align, ['top', 'left']) !== -1 ? -1 : 1)) : + (jBoxDimensions[this._getOpp(options.outside)] * (jQuery.inArray(this.pointer.align, ['top', 'left']) !== -1 ? 1 : -1)) + ((this.pointer.dimensions[this._getOpp(options.outside)] / 2) * (jQuery.inArray(this.pointer.align, ['top', 'left']) !== -1 ? -1 : 1)) : // If pointer align is same as position align (this.pointer.dimensions[this._getOpp(options.outside)] / 2) * (jQuery.inArray(this.pointer.align, ['top', 'left']) !== -1 ? 1 : -1); @@ -1742,6 +1746,9 @@ function jBoxWrapper(jQuery) { this.isOpening = true; this.wrapper.css({display: 'block'}); }.bind(this), + complete: function () { + this._fireEvent('onOpenComplete'); + }.bind(this), always: function () { this.isOpening = false; @@ -1752,6 +1759,7 @@ function jBoxWrapper(jQuery) { } else { this.wrapper.css({display: 'block', opacity: 1}); this.positionOnFadeComplete && this.position() && (this.positionOnFadeComplete = false); + this._fireEvent('onOpenComplete'); } } }.bind(this); @@ -2091,51 +2099,6 @@ function jBoxWrapper(jQuery) { return this; }; - - // Apply custom animations to jBox - - jBox._animationSpeeds = { - 'tada': 1000, - 'tadaSmall': 1000, - 'flash': 500, - 'shake': 400, - 'pulseUp': 250, - 'pulseDown': 250, - 'popIn': 250, - 'popOut': 250, - 'fadeIn': 200, - 'fadeOut': 200, - 'slideUp': 400, - 'slideRight': 400, - 'slideLeft': 400, - 'slideDown': 400 - }; - - jBox.prototype.animate = function (animation, options) - { - // Options are required - !options && (options = {}); - - // Timout needs to be an object - !this.animationTimeout && (this.animationTimeout = {}); - - // Use jBox wrapper by default - !options.element && (options.element = this.wrapper); - - // Give the element an unique id - !options.element.data('jBox-animating-id') && options.element.data('jBox-animating-id', jBox._getUniqueElementID()); - - // Abort if element is animating - if (options.element.data('jBox-animating')) { - options.element.removeClass(options.element.data('jBox-animating')).data('jBox-animating', null); - this.animationTimeout[options.element.data('jBox-animating-id')] && clearTimeout(this.animationTimeout[options.element.data('jBox-animating-id')]); - } - - // Animate the element - options.element.addClass('jBox-animated-' + animation).data('jBox-animating', 'jBox-animated-' + animation); - this.animationTimeout[options.element.data('jBox-animating-id')] = setTimeout((function() { options.element.removeClass(options.element.data('jBox-animating')).data('jBox-animating', null); options.complete && options.complete(); }), jBox._animationSpeeds[animation]); - }; - // https://gist.github.com/AlexEmashev/ee8302b5036b01362f63dab35948401f jBox.prototype.swipeDetector = function (swipeTarget, options) { // States: 0 - no swipe, 1 - swipe started, 2 - swipe released diff --git a/dist/jBox.all.min.js b/dist/jBox.all.min.js index b0bae73..b0669a8 100755 --- a/dist/jBox.all.min.js +++ b/dist/jBox.all.min.js @@ -1 +1 @@ -function jBoxWrapper(b){function h(t,i){return this.options={id:null,width:"auto",height:"auto",minWidth:null,minHeight:null,maxWidth:null,maxHeight:null,responsiveWidth:!0,responsiveHeight:!0,responsiveMinWidth:100,responsiveMinHeight:100,attach:null,trigger:"click",preventDefault:!1,content:null,getContent:null,title:null,getTitle:null,footer:null,isolateScroll:!0,ajax:{url:null,data:"",reload:!1,getURL:"data-url",getData:"data-ajax",setContent:!0,loadingClass:!0,spinner:!0,spinnerDelay:300,spinnerReposition:!0},cancelAjaxOnClose:!0,target:null,position:{x:"center",y:"center"},outside:null,offset:0,attributes:{x:"left",y:"top"},fixed:!1,adjustPosition:!0,adjustTracker:!1,adjustDistance:5,reposition:!0,repositionOnOpen:!0,repositionOnContent:!0,holdPosition:!0,pointer:!1,pointTo:"target",fade:180,animation:null,theme:"Default",addClass:null,overlay:!1,overlayClass:null,zIndex:1e4,delayOpen:0,delayClose:0,closeOnEsc:!1,closeOnClick:!1,closeOnMouseleave:!1,closeButton:!1,appendTo:b("body"),createOnInit:!1,blockScroll:!1,blockScrollAdjust:!0,draggable:!1,dragOver:!0,autoClose:!1,delayOnHover:!1,showCountdown:!1,preloadAudio:!0,audio:null,volume:100,onInit:null,onAttach:null,onPosition:null,onCreated:null,onOpen:null,onClose:null,onCloseComplete:null,onDragStart:null,onDragEnd:null},this._pluginOptions={Tooltip:{getContent:"title",trigger:"mouseenter",position:{x:"center",y:"top"},outside:"y",pointer:!0},Mouse:{responsiveWidth:!1,responsiveHeight:!1,adjustPosition:"flip",target:"mouse",trigger:"mouseenter",position:{x:"right",y:"bottom"},outside:"xy",offset:5},Modal:{target:b(window),fixed:!0,blockScroll:!0,closeOnEsc:!0,closeOnClick:"overlay",closeButton:!0,overlay:!0,animation:"zoomIn"}},this.options=b.extend(!0,this.options,this._pluginOptions[t]||h._pluginOptions[t],i),"string"==b.type(t)&&(this.type=t),this.isTouchDevice=function(){var t=" -webkit- -moz- -o- -ms- ".split(" ");if("ontouchstart"in window||window.DocumentTouch&&document instanceof DocumentTouch)return!0;var i,t=["(",t.join("touch-enabled),("),"heartz",")"].join("");return i=t,window.matchMedia(i).matches}(),this.isTouchDevice&&"mouseenter"===this.options.trigger&&!1===this.options.closeOnClick&&(this.options.closeOnClick="body"),this._fireEvent=function(t,i){this.options["_"+t]&&this.options["_"+t].bind(this)(i),this.options[t]&&this.options[t].bind(this)(i)},null===this.options.id&&(this.options.id="jBox"+h._getUniqueID()),this.id=this.options.id,("center"==this.options.position.x&&"x"==this.options.outside||"center"==this.options.position.y&&"y"==this.options.outside)&&(this.options.outside=null),"target"!=this.options.pointTo||this.options.outside&&"xy"!=this.options.outside||(this.options.pointer=!1),"object"!=b.type(this.options.offset)?this.options.offset={x:this.options.offset,y:this.options.offset}:this.options.offset=b.extend({x:0,y:0},this.options.offset),"object"!=b.type(this.options.adjustDistance)?this.options.adjustDistance={top:this.options.adjustDistance,right:this.options.adjustDistance,bottom:this.options.adjustDistance,left:this.options.adjustDistance}:this.options.adjustDistance=b.extend({top:5,left:5,right:5,bottom:5},this.options.adjustDistance),this.outside=!(!this.options.outside||"xy"==this.options.outside)&&this.options.position[this.options.outside],this.align=this.outside||("center"!=this.options.position.y&&"number"!=b.type(this.options.position.y)?this.options.position.x:"center"!=this.options.position.x&&"number"!=b.type(this.options.position.x)?this.options.position.y:this.options.attributes.x),h.zIndexMax=Math.max(h.zIndexMax||0,"auto"===this.options.zIndex?1e4:this.options.zIndex),"auto"===this.options.zIndex&&(this.adjustZIndexOnOpen=!0,h.zIndexMax+=2,this.options.zIndex=h.zIndexMax,this.trueModal=this.options.overlay),this._getOpp=function(t){return{left:"right",right:"left",top:"bottom",bottom:"top",x:"y",y:"x"}[t]},this._getXY=function(t){return{left:"x",right:"x",top:"y",bottom:"y",center:"x"}[t]},this._getTL=function(t){return{left:"left",right:"left",top:"top",bottom:"top",center:"left",x:"left",y:"top"}[t]},this._getInt=function(t,i){return"auto"==t?"auto":t&&"string"==b.type(t)&&"%"==t.slice(-1)?b(window)["height"==i?"innerHeight":"innerWidth"]()*parseInt(t.replace("%",""))/100:t},this._createSVG=function(t,i){var o=document.createElementNS("http://www.w3.org/2000/svg",t);return b.each(i,function(t,i){o.setAttribute(i[0],i[1]||"")}),o},this._isolateScroll=function(e){e&&e.length&&e.on("DOMMouseScroll.jBoxIsolateScroll mousewheel.jBoxIsolateScroll",function(t){var i=t.wheelDelta||t.originalEvent&&t.originalEvent.wheelDelta||-t.detail,o=0<=this.scrollTop+e.outerHeight()-this.scrollHeight,s=this.scrollTop<=0;(i<0&&o||0",{id:this.id,class:"jBox-wrapper"+(this.type?" jBox-"+this.type:"")+(this.options.theme?" jBox-"+this.options.theme:"")+(this.options.addClass?" "+this.options.addClass:"")}).css({position:this.options.fixed?"fixed":"absolute",display:"none",opacity:0,zIndex:this.options.zIndex}).data("jBox",this),this.options.closeOnMouseleave&&this.wrapper.on("mouseleave",function(t){!this.source||t.relatedTarget!=this.source[0]&&-1===b.inArray(this.source[0],b(t.relatedTarget).parents("*"))&&this.close()}.bind(this)),"box"==this.options.closeOnClick&&this.wrapper.on("click tap",function(){this.close({ignoreDelay:!0})}.bind(this)),this.container=b('
').appendTo(this.wrapper),this.content=b('
').appendTo(this.container),this.options.footer&&(this.footer=b('