/*! UIkit 2.21.0 | http://www.getuikit.com | (c) 2014 YOOtheme | MIT License */ (function(UI) { "use strict"; var active = false, activeCount = 0, $html = UI.$html, body; UI.component('modal', { defaults: { keyboard: true, bgclose: true, minScrollHeight: 150, center: false, modal: true }, scrollable: false, transition: false, init: function() { if (!body) body = UI.$('body'); if (!this.element.length) return; var $this = this; this.paddingdir = "padding-" + (UI.langdirection == 'left' ? "right":"left"); this.dialog = this.find(".uk-modal-dialog"); this.active = false; // Update ARIA this.element.attr('aria-hidden', this.element.hasClass("uk-open")); this.on("click", ".uk-modal-close", function(e) { e.preventDefault(); $this.hide(); }).on("click", function(e) { var target = UI.$(e.target); if (target[0] == $this.element[0] && $this.options.bgclose) { $this.hide(); } }); }, toggle: function() { return this[this.isActive() ? "hide" : "show"](); }, show: function() { if (!this.element.length) return; var $this = this; if (this.isActive()) return; if (this.options.modal && active) { active.hide(true); } this.element.removeClass("uk-open").show(); this.resize(); if (this.options.modal) { active = this; } this.active = true; activeCount++; this.element.addClass("uk-open"); $html.addClass("uk-modal-page").height(); // force browser engine redraw // Update ARIA this.element.attr('aria-hidden', 'false'); this.element.trigger("show.uk.modal"); UI.Utils.checkDisplay(this.dialog, true); return this; }, hide: function(force) { if (!force && UI.support.transition) { var $this = this; this.one(UI.support.transition.end, function() { $this._hide(); }).removeClass("uk-open"); } else { this._hide(); } return this; }, resize: function() { var bodywidth = body.width(); this.scrollbarwidth = window.innerWidth - bodywidth; body.css(this.paddingdir, this.scrollbarwidth); this.element.css('overflow-y', this.scrollbarwidth ? 'scroll' : 'auto'); if (!this.updateScrollable() && this.options.center) { var dh = this.dialog.outerHeight(), pad = parseInt(this.dialog.css('margin-top'), 10) + parseInt(this.dialog.css('margin-bottom'), 10); if ((dh + pad) < window.innerHeight) { this.dialog.css({'top': (window.innerHeight/2 - dh/2) - pad }); } else { this.dialog.css({'top': ''}); } } }, updateScrollable: function() { // has scrollable? var scrollable = this.dialog.find('.uk-overflow-container:visible:first'); if (scrollable.length) { scrollable.css("height", 0); var offset = Math.abs(parseInt(this.dialog.css("margin-top"), 10)), dh = this.dialog.outerHeight(), wh = window.innerHeight, h = wh - 2*(offset < 20 ? 20:offset) - dh; scrollable.css("height", h < this.options.minScrollHeight ? "":h); return true; } return false; }, _hide: function() { this.active = false; activeCount--; this.element.hide().removeClass("uk-open"); // Update ARIA this.element.attr('aria-hidden', 'true'); if (!activeCount) { $html.removeClass("uk-modal-page"); body.css(this.paddingdir, ""); } if(active===this) active = false; this.trigger("hide.uk.modal"); }, isActive: function() { return this.active; } }); UI.component('modalTrigger', { boot: function() { // init code UI.$html.on("click.modal.uikit", "[data-uk-modal]", function(e) { var ele = UI.$(this); if (ele.is("a")) { e.preventDefault(); } if (!ele.data("modalTrigger")) { var modal = UI.modalTrigger(ele, UI.Utils.options(ele.attr("data-uk-modal"))); modal.show(); } }); // close modal on esc button UI.$html.on('keydown.modal.uikit', function (e) { if (active && e.keyCode === 27 && active.options.keyboard) { // ESC e.preventDefault(); active.hide(); } }); UI.$win.on("resize orientationchange", UI.Utils.debounce(function(){ if (active) active.resize(); }, 150)); }, init: function() { var $this = this; this.options = UI.$.extend({ "target": $this.element.is("a") ? $this.element.attr("href") : false }, this.options); this.modal = UI.modal(this.options.target, this.options); this.on("click", function(e) { e.preventDefault(); $this.show(); }); //methods this.proxy(this.modal, "show hide isActive"); } }); UI.modal.dialog = function(content, options) { var modal = UI.modal(UI.$(UI.modal.dialog.template).appendTo("body"), options); modal.on("hide.uk.modal", function(){ if (modal.persist) { modal.persist.appendTo(modal.persist.data("modalPersistParent")); modal.persist = false; } modal.element.remove(); }); setContent(content, modal); return modal; }; UI.modal.dialog.template = '
'; UI.modal.alert = function(content, options) { options = UI.$.extend(true, {bgclose:false, keyboard:false, modal:false, labels:UI.modal.labels}, options); var modal = UI.modal.dialog(([ '
'+String(content)+'
', '' ]).join(""), options); modal.on('show.uk.modal', function(){ setTimeout(function(){ modal.element.find('button:first').focus(); }, 50); }); modal.show(); }; UI.modal.confirm = function(content, onconfirm, options) { onconfirm = UI.$.isFunction(onconfirm) ? onconfirm : function(){}; options = UI.$.extend(true, {bgclose:false, keyboard:false, modal:false, labels:UI.modal.labels}, options); var modal = UI.modal.dialog(([ '
'+String(content)+'
', '' ]).join(""), options); modal.element.find(".js-modal-confirm").on("click", function(){ onconfirm(); modal.hide(); }); modal.on('show.uk.modal', function(){ setTimeout(function(){ modal.element.find('button:first').focus(); }, 50); }); modal.show(); }; UI.modal.prompt = function(text, value, onsubmit, options) { onsubmit = UI.$.isFunction(onsubmit) ? onsubmit : function(value){}; options = UI.$.extend(true, {bgclose:false, keyboard:false, modal:false, labels:UI.modal.labels}, options); var modal = UI.modal.dialog(([ text ? '
'+String(text)+'
':'', '

', '' ]).join(""), options), input = modal.element.find("input[type='text']").val(value || '').on('keyup', function(e){ if (e.keyCode == 13) { modal.element.find(".js-modal-ok").trigger('click'); } }); modal.element.find(".js-modal-ok").on("click", function(){ if (onsubmit(input.val())!==false){ modal.hide(); } }); modal.on('show.uk.modal', function(){ setTimeout(function(){ input.focus(); }, 50); }); modal.show(); }; UI.modal.blockUI = function(content, options) { var modal = UI.modal.dialog(([ '
'+String(content || '
...
')+'
' ]).join(""), UI.$.extend({bgclose:false, keyboard:false, modal:false}, options)); modal.content = modal.element.find('.uk-modal-content:first'); modal.show(); return modal; }; UI.modal.labels = { 'Ok': 'Ok', 'Cancel': 'Cancel' }; // helper functions function setContent(content, modal){ if(!modal) return; if (typeof content === 'object') { // convert DOM object to a jQuery object content = content instanceof jQuery ? content : UI.$(content); if(content.parent().length) { modal.persist = content; modal.persist.data("modalPersistParent", content.parent()); } }else if (typeof content === 'string' || typeof content === 'number') { // just insert the data as innerHTML content = UI.$('
').html(content); }else { // unsupported data type! content = UI.$('
').html('UIkit.modal Error: Unsupported data type: ' + typeof content); } content.appendTo(modal.element.find('.uk-modal-dialog')); return modal; } })(UIkit);