framework7/components/actions.js

Full featured mobile HTML framework for building iOS & Android apps

(function framework7ComponentLoader(o,n){void 0===n&&(n=!0);var e=document,t=window,a=o.$,i=(o.Template7,o.utils),r=(o.device,o.support,o.Class,o.Modal),s=(o.ConstructorMethods,o.ModalMethods),c=function(o){function n(n,r){var s=i.extend({on:{}},n.params.actions,r);o.call(this,n,s);var c,l,p,d=this;if(d.params=s,d.params.buttons&&(c=d.params.buttons,Array.isArray(c[0])||(c=[c])),d.groups=c,d.params.el?l=a(d.params.el).eq(0):d.params.content?l=a(d.params.content).filter((function(o,n){return 1===n.nodeType})).eq(0):d.params.buttons&&(d.params.convertToPopover&&(d.popoverHtml=d.renderPopover()),d.actionsHtml=d.render()),l&&l.length>0&&l[0].f7Modal)return l[0].f7Modal;if(l&&0===l.length&&!d.actionsHtml&&!d.popoverHtml)return d.destroy();d.params.backdrop&&d.params.backdropEl?p=a(d.params.backdropEl):d.params.backdrop&&0===(p=n.root.children(".actions-backdrop")).length&&(p=a('<div class="actions-backdrop"></div>'),n.root.append(p));var u,v=d.open,m=d.close;function f(o){var n,e,t=a(this);if(t.hasClass("list-button")||t.hasClass("item-link")?(n=t.parents("li").index(),e=t.parents(".list").index()):(n=t.index(),e=t.parents(".actions-group").index()),void 0!==c){var i=c[e][n];i.onClick&&i.onClick(d,o),d.params.onClick&&d.params.onClick(d,o),!1!==i.close&&d.close()}}function b(o){var e=o.target,i=a(e);!n.device.desktop&&n.device.cordova&&(t.Keyboard&&t.Keyboard.isVisible||t.cordova.plugins&&t.cordova.plugins.Keyboard&&t.cordova.plugins.Keyboard.isVisible)||0===i.closest(d.el).length&&(d.params.closeByBackdropClick&&d.params.backdrop&&d.backdropEl&&d.backdropEl===e?d.close():d.params.closeByOutsideClick&&d.close())}function h(o){27===o.keyCode&&d.params.closeOnEscape&&d.close()}return d.open=function(o){var e=!1,t=d.params,r=t.targetEl,s=t.targetX,c=t.targetY,l=t.targetWidth,p=t.targetHeight;return d.params.convertToPopover&&(r||void 0!==s&&void 0!==c)&&(d.params.forceToPopover||n.device.ios&&n.device.ipad||n.width>=768||n.device.desktop&&"aurora"===n.theme)&&(e=!0),e&&d.popoverHtml?((u=n.popover.create({content:d.popoverHtml,backdrop:d.params.backdrop,targetEl:r,targetX:s,targetY:c,targetWidth:l,targetHeight:p})).open(o),u.once("popoverOpened",(function(){u.$el.find(".list-button, .item-link").each((function(o,n){a(n).on("click",f)}))})),u.once("popoverClosed",(function(){u.$el.find(".list-button, .item-link").each((function(o,n){a(n).off("click",f)})),i.nextTick((function(){u.destroy(),u=void 0}))}))):(d.$el=d.actionsHtml?a(d.actionsHtml):d.$el,d.$el[0].f7Modal=d,d.groups&&(d.$el.find(".actions-button").each((function(o,n){a(n).on("click",f)})),d.once("actionsClosed",(function(){d.$el.find(".actions-button").each((function(o,n){a(n).off("click",f)}))}))),d.el=d.$el[0],v.call(d,o)),d},d.close=function(o){return u?u.close(o):m.call(d,o),d},i.extend(d,{app:n,$el:l,el:l?l[0]:void 0,$backdropEl:p,backdropEl:p&&p[0],type:"actions"}),d.params.closeOnEscape&&(d.on("open",(function(){a(e).on("keydown",h)})),d.on("close",(function(){a(e).off("keydown",h)}))),d.on("opened",(function(){(d.params.closeByBackdropClick||d.params.closeByOutsideClick)&&n.on("click",b)})),d.on("close",(function(){(d.params.closeByBackdropClick||d.params.closeByOutsideClick)&&n.off("click",b)})),l&&(l[0].f7Modal=d),d}return o&&(n.__proto__=o),n.prototype=Object.create(o&&o.prototype),n.prototype.constructor=n,n.prototype.render=function(){if(this.params.render)return this.params.render.call(this,this);var o=this.groups;return('\n      <div class="actions-modal'+(this.params.grid?" actions-grid":"")+'">\n        '+o.map((function(o){return'<div class="actions-group">\n            '+o.map((function(o){var n=["actions-"+(o.label?"label":"button")],e=o.color,t=o.bg,a=o.bold,i=o.disabled,r=o.label,s=o.text,c=o.icon;return e&&n.push("color-"+e),t&&n.push("bg-color-"+t),a&&n.push("actions-button-bold"),i&&n.push("disabled"),r?'<div class="'+n.join(" ")+'">'+s+"</div>":('\n                <div class="'+n.join(" ")+'">\n                  '+(c?'<div class="actions-button-media">'+c+"</div>":"")+'\n                  <div class="actions-button-text">'+s+"</div>\n                </div>").trim()})).join("")+"\n          </div>"})).join("")+"\n      </div>\n    ").trim()},n.prototype.renderPopover=function(){return this.params.renderPopover?this.params.renderPopover.call(this,this):('\n      <div class="popover popover-from-actions">\n        <div class="popover-inner">\n          '+this.groups.map((function(o){return'\n            <div class="list">\n              <ul>\n                '+o.map((function(o){var n=[],e=o.color,t=o.bg,a=o.bold,i=o.disabled,r=o.label,s=o.text,c=o.icon;return e&&n.push("color-"+e),t&&n.push("bg-color-"+t),a&&n.push("popover-from-actions-bold"),i&&n.push("disabled"),r?(n.push("popover-from-actions-label"),'<li class="'+n.join(" ")+'">'+s+"</li>"):c?(n.push("item-link item-content"),'\n                      <li>\n                        <a class="'+n.join(" ")+'">\n                          <div class="item-media">\n                            '+c+'\n                          </div>\n                          <div class="item-inner">\n                            <div class="item-title">\n                              '+s+"\n                            </div>\n                          </div>\n                        </a>\n                      </li>\n                    "):(n.push("list-button"),'\n                    <li>\n                      <a class="'+n.join(" ")+'">'+s+"</a>\n                    </li>\n                  ")})).join("")+"\n              </ul>\n            </div>\n          "})).join("")+"\n        </div>\n      </div>\n    ").trim()},n}(r),l={name:"actions",params:{actions:{convertToPopover:!0,forceToPopover:!1,backdrop:!0,backdropEl:void 0,closeByBackdropClick:!0,closeOnEscape:!1,render:null,renderPopover:null}},static:{Actions:c},create:function(){this.actions=s({app:this,constructor:c,defaultSelector:".actions-modal.modal-in"})},clicks:{".actions-open":function(o,n){void 0===n&&(n={});this.actions.open(n.actions,n.animate)},".actions-close":function(o,n){void 0===n&&(n={});this.actions.close(n.actions,n.animate)}}};if(n){if(o.prototype.modules&&o.prototype.modules[l.name])return;o.use(l),o.instance&&(o.instance.useModuleParams(l,o.instance.params),o.instance.useModule(l))}return l}(Framework7, typeof Framework7AutoInstallComponent === 'undefined' ? undefined : Framework7AutoInstallComponent))