framework7/components/dialog.js

Full featured mobile HTML framework for building iOS & Android apps

(function framework7ComponentLoader(o,e){void 0===e&&(e=!0);var n=document,t=(window,o.$),a=(o.Template7,o.utils),l=(o.device,o.support,o.Class,o.Modal),i=(o.ConstructorMethods,o.ModalMethods),r=function(o){function e(e,l){var i=a.extend({title:e.params.dialog.title,text:void 0,content:"",buttons:[],verticalButtons:!1,onClick:void 0,cssClass:void 0,destroyOnClose:!1,on:{}},l);void 0===i.closeByBackdropClick&&(i.closeByBackdropClick=e.params.dialog.closeByBackdropClick),o.call(this,e,i);var r,s=this,d=i.title,c=i.text,p=i.content,u=i.buttons,g=i.verticalButtons,v=i.cssClass;if(s.params=i,s.params.el)r=t(s.params.el);else{var f=["dialog"];0===u.length&&f.push("dialog-no-buttons"),u.length>0&&f.push("dialog-buttons-"+u.length),g&&f.push("dialog-buttons-vertical"),v&&f.push(v);var m="";u.length>0&&(m='\n          <div class="dialog-buttons">\n            '+u.map(function(o){return'\n              <span class="dialog-button'+(o.bold?" dialog-button-bold":"")+(o.color?" color-"+o.color:"")+(o.cssClass?" "+o.cssClass:"")+'">'+o.text+"</span>\n            "}).join("")+"\n          </div>\n        ");var k='\n        <div class="'+f.join(" ")+'">\n          <div class="dialog-inner">\n            '+(d?'<div class="dialog-title">'+d+"</div>":"")+"\n            "+(c?'<div class="dialog-text">'+c+"</div>":"")+"\n            "+p+"\n          </div>\n          "+m+"\n        </div>\n      ";r=t(k)}if(r&&r.length>0&&r[0].f7Modal)return r[0].f7Modal;if(0===r.length)return s.destroy();var y,C=e.root.children(".dialog-backdrop");function b(o){var e=t(this).index(),n=u[e];n.onClick&&n.onClick(s,o),s.params.onClick&&s.params.onClick(s,e),!1!==n.close&&s.close()}function h(o){var e=o.keyCode;u.forEach(function(t,a){t.keyCodes&&t.keyCodes.indexOf(e)>=0&&(n.activeElement&&n.activeElement.blur(),t.onClick&&t.onClick(s,o),s.params.onClick&&s.params.onClick(s,a),!1!==t.close&&s.close())})}function x(o){var e=o.target;0===t(e).closest(s.el).length&&s.params.closeByBackdropClick&&s.backdropEl&&s.backdropEl===e&&s.close()}return 0===C.length&&(C=t('<div class="dialog-backdrop"></div>'),e.root.append(C)),u&&u.length>0&&(s.on("open",function(){r.find(".dialog-button").each(function(o,e){u[o].keyCodes&&(y=!0),t(e).on("click",b)}),!y||e.device.ios||e.device.android||e.device.cordova||t(n).on("keydown",h)}),s.on("close",function(){r.find(".dialog-button").each(function(o,e){t(e).off("click",b)}),!y||e.device.ios||e.device.android||e.device.cordova||t(n).off("keydown",h),y=!1})),a.extend(s,{app:e,$el:r,el:r[0],$backdropEl:C,backdropEl:C[0],type:"dialog",setProgress:function(o,n){return e.progressbar.set(r.find(".progressbar"),o,n),s},setText:function(o){var e=r.find(".dialog-text");return 0===e.length&&(e=t('<div class="dialog-text"></div>'),void 0!==d?e.insertAfter(r.find(".dialog-title")):r.find(".dialog-inner").prepend(e)),e.html(o),s.params.text=o,s},setTitle:function(o){var e=r.find(".dialog-title");return 0===e.length&&(e=t('<div class="dialog-title"></div>'),r.find(".dialog-inner").prepend(e)),e.html(o),s.params.title=o,s}}),s.on("opened",function(){s.params.closeByBackdropClick&&e.on("click",x)}),s.on("close",function(){s.params.closeByBackdropClick&&e.off("click",x)}),r[0].f7Modal=s,s.params.destroyOnClose&&s.once("closed",function(){setTimeout(function(){s.destroy()},0)}),s}return o&&(e.__proto__=o),e.prototype=Object.create(o&&o.prototype),e.prototype.constructor=e,e}(l),s={name:"dialog",params:{dialog:{title:void 0,buttonOk:"OK",buttonCancel:"Cancel",usernamePlaceholder:"Username",passwordPlaceholder:"Password",preloaderTitle:"Loading... ",progressTitle:"Loading... ",closeByBackdropClick:!1,destroyPredefinedDialogs:!0,keyboardActions:!0}},static:{Dialog:r},create:function(){var o=this;function e(){return o.params.dialog.title||o.name}var n=o.params.dialog.destroyPredefinedDialogs,t=o.params.dialog.keyboardActions;o.dialog=a.extend(i({app:o,constructor:r,defaultSelector:".dialog.modal-in"}),{alert:function(){for(var a,l=[],i=arguments.length;i--;)l[i]=arguments[i];var s=l[0],d=l[1],c=l[2];return 2===l.length&&"function"==typeof l[1]&&(s=(a=l)[0],c=a[1],d=a[2]),new r(o,{title:void 0===d?e():d,text:s,buttons:[{text:o.params.dialog.buttonOk,bold:!0,onClick:c,keyCodes:t?[13,27]:null}],destroyOnClose:n}).open()},prompt:function(){for(var a,l=[],i=arguments.length;i--;)l[i]=arguments[i];var s=l[0],d=l[1],c=l[2],p=l[3],u=l[4];return"function"==typeof l[1]&&(s=(a=l)[0],c=a[1],p=a[2],u=a[3],d=a[4]),u=null==u?"":u,new r(o,{title:void 0===d?e():d,text:s,content:'<div class="dialog-input-field input"><input type="text" class="dialog-input" value="'+u+'"></div>',buttons:[{text:o.params.dialog.buttonCancel,keyCodes:t?[27]:null,color:"aurora"===o.theme?"gray":null},{text:o.params.dialog.buttonOk,bold:!0,keyCodes:t?[13]:null}],onClick:function(o,e){var n=o.$el.find(".dialog-input").val();0===e&&p&&p(n),1===e&&c&&c(n)},destroyOnClose:n}).open()},confirm:function(){for(var a,l=[],i=arguments.length;i--;)l[i]=arguments[i];var s=l[0],d=l[1],c=l[2],p=l[3];return"function"==typeof l[1]&&(s=(a=l)[0],c=a[1],p=a[2],d=a[3]),new r(o,{title:void 0===d?e():d,text:s,buttons:[{text:o.params.dialog.buttonCancel,onClick:p,keyCodes:t?[27]:null,color:"aurora"===o.theme?"gray":null},{text:o.params.dialog.buttonOk,bold:!0,onClick:c,keyCodes:t?[13]:null}],destroyOnClose:n}).open()},login:function(){for(var a,l=[],i=arguments.length;i--;)l[i]=arguments[i];var s=l[0],d=l[1],c=l[2],p=l[3];return"function"==typeof l[1]&&(s=(a=l)[0],c=a[1],p=a[2],d=a[3]),new r(o,{title:void 0===d?e():d,text:s,content:'\n              <div class="dialog-input-field dialog-input-double input">\n                <input type="text" name="dialog-username" placeholder="'+o.params.dialog.usernamePlaceholder+'" class="dialog-input">\n              </div>\n              <div class="dialog-input-field dialog-input-double input">\n                <input type="password" name="dialog-password" placeholder="'+o.params.dialog.passwordPlaceholder+'" class="dialog-input">\n              </div>',buttons:[{text:o.params.dialog.buttonCancel,keyCodes:t?[27]:null,color:"aurora"===o.theme?"gray":null},{text:o.params.dialog.buttonOk,bold:!0,keyCodes:t?[13]:null}],onClick:function(o,e){var n=o.$el.find('[name="dialog-username"]').val(),t=o.$el.find('[name="dialog-password"]').val();0===e&&p&&p(n,t),1===e&&c&&c(n,t)},destroyOnClose:n}).open()},password:function(){for(var a,l=[],i=arguments.length;i--;)l[i]=arguments[i];var s=l[0],d=l[1],c=l[2],p=l[3];return"function"==typeof l[1]&&(s=(a=l)[0],c=a[1],p=a[2],d=a[3]),new r(o,{title:void 0===d?e():d,text:s,content:'\n              <div class="dialog-input-field input">\n                <input type="password" name="dialog-password" placeholder="'+o.params.dialog.passwordPlaceholder+'" class="dialog-input">\n              </div>',buttons:[{text:o.params.dialog.buttonCancel,keyCodes:t?[27]:null,color:"aurora"===o.theme?"gray":null},{text:o.params.dialog.buttonOk,bold:!0,keyCodes:t?[13]:null}],onClick:function(o,e){var n=o.$el.find('[name="dialog-password"]').val();0===e&&p&&p(n),1===e&&c&&c(n)},destroyOnClose:n}).open()},preloader:function(e,t){var l=a[o.theme+"PreloaderContent"]||"";return new r(o,{title:null==e?o.params.dialog.preloaderTitle:e,content:'<div class="preloader'+(t?" color-"+t:"")+'">'+l+"</div>",cssClass:"dialog-preloader",destroyOnClose:n}).open()},progress:function(){for(var e,t,a,l=[],i=arguments.length;i--;)l[i]=arguments[i];var s=l[0],d=l[1],c=l[2];2===l.length?"number"==typeof l[0]?(d=(e=l)[0],c=e[1],s=e[2]):"string"==typeof l[0]&&"string"==typeof l[1]&&(s=(t=l)[0],c=t[1],d=t[2]):1===l.length&&"number"==typeof l[0]&&(d=(a=l)[0],s=a[1],c=a[2]);var p=void 0===d,u=new r(o,{title:void 0===s?o.params.dialog.progressTitle:s,cssClass:"dialog-progress",content:'\n              <div class="progressbar'+(p?"-infinite":"")+(c?" color-"+c:"")+'">\n                '+(p?"":"<span></span>")+"\n              </div>\n            ",destroyOnClose:n});return p||u.setProgress(d),u.open()}})}};if(e){if(o.prototype.modules&&o.prototype.modules[s.name])return;o.use(s),o.instance&&(o.instance.useModuleParams(s,o.instance.params),o.instance.useModule(s))}return s}(Framework7, typeof Framework7AutoInstallComponent === 'undefined' ? undefined : Framework7AutoInstallComponent))