framework7
Version:
Full featured mobile HTML framework for building iOS & Android apps
2 lines (1 loc) • 10.8 kB
JavaScript
(function framework7ComponentLoader(e,s){void 0===s&&(s=!0);var a=e.$,t=e.utils,r=(e.getDevice,e.getSupport,e.Class),o=(e.Modal,e.ConstructorMethods),i=(e.ModalMethods,e.$jsx),n=t.extend,g=t.deleteProps;function l(e){this.wrapped=e}function m(e){var s,a;function t(s,a){try{var o=e[s](a),i=o.value,n=i instanceof l;Promise.resolve(n?i.wrapped:i).then((function(e){n?t("return"===s?"return":"next",e):r(o.done?"return":"normal",e)}),(function(e){t("throw",e)}))}catch(e){r("throw",e)}}function r(e,r){switch(e){case"return":s.resolve({value:r,done:!0});break;case"throw":s.reject(r);break;default:s.resolve({value:r,done:!1})}(s=s.next)?t(s.key,s.arg):a=null}this._invoke=function(e,r){return new Promise((function(o,i){var n={key:e,arg:r,resolve:o,reject:i,next:null};a?a=a.next=n:(s=a=n,t(e,r))}))},"function"!=typeof e.return&&(this.return=void 0)}function d(){return d=Object.assign||function(e){for(var s=1;s<arguments.length;s++){var a=arguments[s];for(var t in a)Object.prototype.hasOwnProperty.call(a,t)&&(e[t]=a[t])}return e},d.apply(this,arguments)}m.prototype["function"==typeof Symbol&&Symbol.asyncIterator||"@@asyncIterator"]=function(){return this},m.prototype.next=function(e){return this._invoke("next",e)},m.prototype.throw=function(e){return this._invoke("throw",e)},m.prototype.return=function(e){return this._invoke("return",e)};class c extends r{constructor(e,s){void 0===s&&(s={}),super(s,[e]);const t=this,r={autoLayout:!0,messages:[],newMessagesFirst:!1,scrollMessages:!0,scrollMessagesOnEdge:!0,firstMessageRule:void 0,lastMessageRule:void 0,tailMessageRule:void 0,sameNameMessageRule:void 0,sameHeaderMessageRule:void 0,sameFooterMessageRule:void 0,sameAvatarMessageRule:void 0,customClassMessageRule:void 0,renderMessage:void 0};t.useModulesParams(r),t.params=n(r,s);const o=a(s.el).eq(0);if(0===o.length)return t;if(o[0].f7Messages)return o[0].f7Messages;o[0].f7Messages=t;const i=o.closest(".page-content").eq(0);return n(t,{messages:t.params.messages,$el:o,el:o[0],$pageContentEl:i,pageContentEl:i[0]}),t.useModules(),t.init(),t}getMessageData(e){const s=a(e),t={name:s.find(".message-name").html(),header:s.find(".message-header").html(),textHeader:s.find(".message-text-header").html(),textFooter:s.find(".message-text-footer").html(),footer:s.find(".message-footer").html(),isTitle:s.hasClass("messages-title"),type:s.hasClass("message-sent")?"sent":"received",text:s.find(".message-text").html(),image:s.find(".message-image").html(),imageSrc:s.find(".message-image img").attr("src"),typing:s.hasClass("message-typing")};t.isTitle&&(t.text=s.html()),t.text&&t.textHeader&&(t.text=t.text.replace(`<div class="message-text-header">${t.textHeader}</div>`,"")),t.text&&t.textFooter&&(t.text=t.text.replace(`<div class="message-text-footer">${t.textFooter}</div>`,""));let r=s.find(".message-avatar").css("background-image");return"none"!==r&&""!==r||(r=void 0),r=r&&"string"==typeof r?r.replace("url(","").replace(")","").replace(/"/g,"").replace(/'/g,""):void 0,t.avatar=r,t}getMessagesData(){const e=this,s=[];return e.$el.find(".message, .messages-title").each((a=>{s.push(e.getMessageData(a))})),s}renderMessage(e){const s=this,a=n({type:"sent",attrs:{}},e);return s.params.renderMessage?s.params.renderMessage.call(s,a):a.isTitle?`<div class="messages-title">${a.text}</div>`:i("div",d({class:`message message-${a.type} ${a.isTyping?"message-typing":""} ${a.cssClass||""}`},a.attrs),a.avatar&&i("div",{class:"message-avatar",style:`background-image:url(${a.avatar})`}),i("div",{class:"message-content"},a.name&&i("div",{class:"message-name"},a.name),a.header&&i("div",{class:"message-header"},a.header),i("div",{class:"message-bubble"},a.textHeader&&i("div",{class:"message-text-header"},a.textHeader),a.image&&i("div",{class:"message-image"},a.image),a.imageSrc&&!a.image&&i("div",{class:"message-image"},i("img",{src:a.imageSrc})),(a.text||a.isTyping)&&i("div",{class:"message-text"},a.text||"",a.isTyping&&i("div",{class:"message-typing-indicator"},i("div",null),i("div",null),i("div",null))),a.textFooter&&i("div",{class:"message-text-footer"},a.textFooter)),a.footer&&i("div",{class:"message-footer"},a.footer)))}renderMessages(e,s){void 0===e&&(e=this.messages),void 0===s&&(s=this.params.newMessagesFirst?"prepend":"append");const a=this,t=e.map((e=>a.renderMessage(e))).join("");a.$el[s](t)}isFirstMessage(){return!!this.params.firstMessageRule&&this.params.firstMessageRule(...arguments)}isLastMessage(){return!!this.params.lastMessageRule&&this.params.lastMessageRule(...arguments)}isTailMessage(){return!!this.params.tailMessageRule&&this.params.tailMessageRule(...arguments)}isSameNameMessage(){return!!this.params.sameNameMessageRule&&this.params.sameNameMessageRule(...arguments)}isSameHeaderMessage(){return!!this.params.sameHeaderMessageRule&&this.params.sameHeaderMessageRule(...arguments)}isSameFooterMessage(){return!!this.params.sameFooterMessageRule&&this.params.sameFooterMessageRule(...arguments)}isSameAvatarMessage(){return!!this.params.sameAvatarMessageRule&&this.params.sameAvatarMessageRule(...arguments)}isCustomClassMessage(){if(this.params.customClassMessageRule)return this.params.customClassMessageRule(...arguments)}layout(){const e=this;e.$el.find(".message, .messages-title").each(((s,t)=>{const r=a(s);e.messages||(e.messages=e.getMessagesData());const o=[],i=e.messages[t],n=e.messages[t-1],g=e.messages[t+1];e.isFirstMessage(i,n,g)&&o.push("message-first"),e.isLastMessage(i,n,g)&&o.push("message-last"),e.isTailMessage(i,n,g)&&o.push("message-tail"),e.isSameNameMessage(i,n,g)&&o.push("message-same-name"),e.isSameHeaderMessage(i,n,g)&&o.push("message-same-header"),e.isSameFooterMessage(i,n,g)&&o.push("message-same-footer"),e.isSameAvatarMessage(i,n,g)&&o.push("message-same-avatar");let l=e.isCustomClassMessage(i,n,g);l&&l.length&&("string"==typeof l&&(l=l.split(" ")),l.forEach((e=>{o.push(e)}))),r.removeClass("message-first message-last message-tail message-same-name message-same-header message-same-footer message-same-avatar"),o.forEach((e=>{r.addClass(e)}))}))}clear(){this.messages=[],this.$el.html("")}removeMessage(e,s){void 0===s&&(s=!0);const t=this;let r,o;return"number"==typeof e?(r=e,o=t.$el.find(".message, .messages-title").eq(r)):t.messages&&t.messages.indexOf(e)>=0?(r=t.messages.indexOf(e),o=t.$el.children().eq(r)):(o=a(e),r=o.index()),0===o.length||(o.remove(),t.messages.splice(r,1),t.params.autoLayout&&s&&t.layout()),t}removeMessages(e,s){void 0===s&&(s=!0);const t=this;if(Array.isArray(e)){const s=[];e.forEach((e=>{s.push(t.$el.find(".message, .messages-title").eq(e))})),s.forEach((e=>{t.removeMessage(e,!1)}))}else a(e).each((e=>{t.removeMessage(e,!1)}));return t.params.autoLayout&&s&&t.layout(),t}addMessage(){const e=this;let s,a,t;for(var r=arguments.length,o=new Array(r),i=0;i<r;i++)o[i]=arguments[i];return"boolean"==typeof o[1]?[s,a,t]=o:[s,t,a]=o,void 0===a&&(a=!0),void 0===t&&(t=e.params.newMessagesFirst?"prepend":"append"),e.addMessages([s],a,t)}setScrollData(){const e=this,s=e.pageContentEl.scrollHeight,a=e.pageContentEl.offsetHeight,t=e.pageContentEl.scrollTop;return e.scrollData={scrollHeightBefore:s,heightBefore:a,scrollBefore:t},{scrollHeightBefore:s,heightBefore:a,scrollBefore:t}}addMessages(){const e=this;let s,t,r;for(var o=arguments.length,i=new Array(o),n=0;n<o;n++)i[n]=arguments[n];"boolean"==typeof i[1]?[s,t,r]=i:[s,r,t]=i,void 0===t&&(t=!0),void 0===r&&(r=e.params.newMessagesFirst?"prepend":"append");const{scrollHeightBefore:g,scrollBefore:l}=e.setScrollData();let m="";const d=e.messages.filter((e=>e.isTyping))[0];s.forEach((s=>{d?"append"===r?e.messages.splice(e.messages.indexOf(d),0,s):e.messages.splice(e.messages.indexOf(d)+1,0,s):e.messages["append"===r?"push":"unshift"](s),m+=e.renderMessage(s)}));const c=a(m);return t&&("append"!==r||e.params.newMessagesFirst||c.addClass("message-appear-from-bottom"),"prepend"===r&&e.params.newMessagesFirst&&c.addClass("message-appear-from-top")),d?"append"===r?c.insertBefore(e.$el.find(".message-typing")):c.insertAfter(e.$el.find(".message-typing")):e.$el[r](c),e.params.autoLayout&&e.layout(),"prepend"!==r||d||(e.pageContentEl.scrollTop=l+(e.pageContentEl.scrollHeight-g)),e.params.scrollMessages&&("append"===r&&!e.params.newMessagesFirst||"prepend"===r&&e.params.newMessagesFirst&&!d)&&e.scrollWithEdgeCheck(t),e}showTyping(e){void 0===e&&(e={});const s=this,a=s.messages.filter((e=>e.isTyping))[0];return a&&s.removeMessage(s.messages.indexOf(a)),s.addMessage(n({type:"received",isTyping:!0},e)),s}hideTyping(){const e=this;let s,a;if(e.messages.forEach(((e,a)=>{e.isTyping&&(s=a)})),void 0!==s&&e.$el.find(".message").eq(s).hasClass("message-typing")&&(a=!0,e.removeMessage(s)),!a){const s=e.$el.find(".message-typing");s.length&&e.removeMessage(s)}return e}scrollWithEdgeCheck(e){const s=this,{scrollBefore:a,scrollHeightBefore:t,heightBefore:r}=s.scrollData;if(s.params.scrollMessagesOnEdge){let o=!1;s.params.newMessagesFirst&&0===a&&(o=!0),!s.params.newMessagesFirst&&a-(t-r)>=-10&&(o=!0),o&&s.scroll(e?void 0:0)}else s.scroll(e?void 0:0)}scroll(e,s){void 0===e&&(e=300);const a=this,t=a.pageContentEl.scrollTop;let r;if(void 0!==s)r=s;else if(r=a.params.newMessagesFirst?0:a.pageContentEl.scrollHeight-a.pageContentEl.offsetHeight,r===t)return a;return a.$pageContentEl.scrollTop(r,e),a}init(){const e=this;e.messages&&0!==e.messages.length||(e.messages=e.getMessagesData()),e.params.messages&&e.params.messages.length&&e.renderMessages(),e.params.autoLayout&&e.layout(),e.params.scrollMessages&&e.scroll(0)}destroy(){const e=this;e.emit("local::beforeDestroy messagesBeforeDestroy",e),e.$el.trigger("messages:beforedestroy"),e.$el[0]&&(e.$el[0].f7Messages=null,delete e.$el[0].f7Messages),g(e)}}var p={name:"messages",static:{Messages:c},create(){this.messages=o({defaultSelector:".messages",constructor:c,app:this,domProp:"f7Messages",addMethods:"renderMessages layout scroll clear removeMessage removeMessages addMessage addMessages".split(" ")})},on:{tabBeforeRemove(e){const s=this;a(e).find(".messages-init").each((e=>{s.messages.destroy(e)}))},tabMounted(e){const s=this;a(e).find(".messages-init").each((e=>{s.messages.create({el:e})}))},pageBeforeRemove(e){const s=this;e.$el.find(".messages-init").each((e=>{s.messages.destroy(e)}))},pageInit(e){const s=this;e.$el.find(".messages-init").each((e=>{s.messages.create({el:e})}))}},vnode:{"messages-init":{insert(e){const s=e.elm;this.messages.create({el:s})},destroy(e){const s=e.elm;this.messages.destroy(s)}}}};if(s){if(e.prototype.modules&&e.prototype.modules[p.name])return;e.use(p),e.instance&&(e.instance.useModuleParams(p,e.instance.params),e.instance.useModule(p))}return p}(Framework7, typeof Framework7AutoInstallComponent === 'undefined' ? undefined : Framework7AutoInstallComponent))