{"version":3,"sources":["webpack:///./src/developing/components/chat/ChatLog.vue?75f7","webpack:///src/developing/components/chat/ChatLog.vue","webpack:///./src/developing/components/chat/ChatLog.vue?a435","webpack:///./src/developing/components/chat/ChatLog.vue"],"names":["render","_vm","this","_h","$createElement","_c","_self","staticClass","attrs","_l","chatData","msg","index","key","isSameDay","time","_e","_v","_s","toDate","hasSentPreviousMsg","isSent","class","senderImg","textContent","staticRenderFns","props","userId","type","Number","required","computed","activeUserImg","isSentByActiveUser","methods","date_time_to","getFullYear","date_time_from","month","date_obj","getDate","scrollToBottom","$nextTick","updated","mounted","component"],"mappings":"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","file":"js/chunk-2d21f46f.190c7e7e.js","sourcesContent":["var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return (_vm.chatData)?_c('div',{staticClass:\"m-8\",attrs:{\"id\":\"component-chat-log\"}},_vm._l((_vm.chatData.msg),function(msg,index){return _c('div',{key:index,staticClass:\"msg-grp-container\"},[(_vm.chatData.msg[index-1])?[(!_vm.isSameDay(msg.time, _vm.chatData.msg[index-1].time))?_c('vs-divider',{staticClass:\"msg-time\"},[_c('span',[_vm._v(_vm._s(_vm.toDate(msg.time)))])]):_vm._e(),(!_vm.hasSentPreviousMsg(_vm.chatData.msg[index-1].isSent, msg.isSent))?_c('div',{staticClass:\"spacer mt-8\"}):_vm._e()]:_vm._e(),_c('div',{staticClass:\"flex items-start\",class:[{'flex-row-reverse' : msg.isSent}]},[(_vm.chatData.msg[index-1])?[((!_vm.hasSentPreviousMsg(_vm.chatData.msg[index-1].isSent, msg.isSent) || !_vm.isSameDay(msg.time, _vm.chatData.msg[index-1].time)))?[_c('vs-avatar',{staticClass:\"border-2 shadow border-solid border-white m-0 flex-shrink-0\",class:msg.isSent ? 'sm:ml-5 ml-3' : 'sm:mr-5 mr-3',attrs:{\"size\":\"40px\",\"src\":_vm.senderImg(msg.isSent)}})]:_vm._e()]:_vm._e(),(index == 0)?[_c('vs-avatar',{staticClass:\"border-2 shadow border-solid border-white m-0 flex-shrink-0\",class:msg.isSent ? 'sm:ml-5 ml-3' : 'sm:mr-5 mr-3',attrs:{\"size\":\"40px\",\"src\":_vm.senderImg(msg.isSent)}})]:_vm._e(),(_vm.chatData.msg[index-1])?[(!(!_vm.hasSentPreviousMsg(_vm.chatData.msg[index-1].isSent, msg.isSent) || !_vm.isSameDay(msg.time, _vm.chatData.msg[index-1].time)))?_c('div',{staticClass:\"mr-16\"}):_vm._e()]:_vm._e(),_c('div',{staticClass:\"msg break-words relative shadow-md rounded py-3 px-4 mb-2 rounded-lg max-w-sm\",class:{\n          'bg-primary-gradient text-white': msg.isSent,\n          'border border-solid border-transparent bg-white': !msg.isSent\n        }},[_c('span',[_vm._v(_vm._s(msg.textContent))])])],2)],2)}),0):_vm._e()}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<!-- =========================================================================================\n    File Name: ChatLog.vue\n    Description: Chat Application - Log of chat\n    ----------------------------------------------------------------------------------------\n    Item Name: Vuexy - Vuejs, HTML & Laravel Admin Dashboard Template\n      Author: Pixinvent\n    Author URL: http://www.themeforest.net/user/pixinvent\n========================================================================================== -->\n\n<template>\n  <div id=\"component-chat-log\" class=\"m-8\" v-if=\"chatData\">\n    <div v-for=\"(msg, index) in chatData.msg\" class=\"msg-grp-container\" :key=\"index\">\n\n      <!-- If previous msg is older than current time -->\n      <template v-if=\"chatData.msg[index-1]\">\n        <vs-divider v-if=\"!isSameDay(msg.time, chatData.msg[index-1].time)\" class=\"msg-time\">\n          <span>{{ toDate(msg.time) }}</span>\n        </vs-divider>\n        <div class=\"spacer mt-8\" v-if=\"!hasSentPreviousMsg(chatData.msg[index-1].isSent, msg.isSent)\"></div>\n      </template>\n\n      <div class=\"flex items-start\" :class=\"[{'flex-row-reverse' : msg.isSent}]\">\n\n        <template v-if=\"chatData.msg[index-1]\">\n          <template v-if=\"(!hasSentPreviousMsg(chatData.msg[index-1].isSent, msg.isSent) || !isSameDay(msg.time, chatData.msg[index-1].time))\">\n            <vs-avatar size=\"40px\" class=\"border-2 shadow border-solid border-white m-0 flex-shrink-0\" :class=\"msg.isSent ? 'sm:ml-5 ml-3' : 'sm:mr-5 mr-3'\" :src=\"senderImg(msg.isSent)\"></vs-avatar>\n            </template>\n        </template>\n\n        <template v-if=\"index == 0\">\n            <vs-avatar size=\"40px\" class=\"border-2 shadow border-solid border-white m-0 flex-shrink-0\" :class=\"msg.isSent ? 'sm:ml-5 ml-3' : 'sm:mr-5 mr-3'\" :src=\"senderImg(msg.isSent)\"></vs-avatar>\n        </template>\n\n        <template v-if=\"chatData.msg[index-1]\">\n            <div class=\"mr-16\" v-if=\"!(!hasSentPreviousMsg(chatData.msg[index-1].isSent, msg.isSent) || !isSameDay(msg.time, chatData.msg[index-1].time))\"></div>\n        </template>\n\n        <div\n          class=\"msg break-words relative shadow-md rounded py-3 px-4 mb-2 rounded-lg max-w-sm\"\n          :class=\"{\n            'bg-primary-gradient text-white': msg.isSent,\n            'border border-solid border-transparent bg-white': !msg.isSent\n          }\"\n        >\n            <span>{{ msg.textContent }}</span>\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script>\nexport default {\n  props: {\n    userId: {\n      type: Number,\n      required: true,\n    }\n  },\n  computed: {\n    chatData() {\n      return {\n        msg: [\n          {\n            time: new Date(),\n            isSent: true,\n            textContent: \"Test Chat Message\"\n          },\n          {\n            time: new Date(),\n            isSent: false,\n            textContent: \"Test Chat Message 2\"\n          },\n        ]\n      };\n      // return this.$store.getters['chat/chatDataOfUser'](this.userId);\n    },\n    activeUserImg() {\n      return \"\";\n      // return this.$store.state.AppActiveUser.photoURL;\n    },\n    senderImg() {\n      return (isSentByActiveUser) => {\n        if (isSentByActiveUser) return this.$store.state.AppActiveUser.photoURL\n      //   else return this.$store.getters['chat/contact'](this.userId).photoURL\n      }\n    },\n    hasSentPreviousMsg() {\n      return (last_sender, current_sender) => last_sender == current_sender\n    },\n  },\n  methods: {\n    isSameDay(time_to, time_from) {\n      const date_time_to = new Date(Date.parse(time_to))\n      const date_time_from = new Date(Date.parse(time_from));\n      return date_time_to.getFullYear() === date_time_from.getFullYear()\n        && date_time_to.getMonth() === date_time_from.getMonth()\n        && date_time_to.getDate() === date_time_from.getDate();\n    },\n    toDate(time) {\n      const locale = \"en-us\";\n      const date_obj = new Date(Date.parse(time));\n      const monthName= date_obj.toLocaleString(locale, {\n        month: 'short'\n      });\n      return date_obj.getDate() + ' '  + monthName;\n    },\n    scrollToBottom() {\n      this.$nextTick(() => {\n        this.$parent.$el.scrollTop = this.$parent.$el.scrollHeight\n      });\n    }\n  },\n  updated() {\n    this.scrollToBottom();\n  },\n  mounted() {\n    this.scrollToBottom();\n  }\n}\n</script>\n","import mod from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./ChatLog.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./ChatLog.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./ChatLog.vue?vue&type=template&id=e255a5fc&\"\nimport script from \"./ChatLog.vue?vue&type=script&lang=js&\"\nexport * from \"./ChatLog.vue?vue&type=script&lang=js&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports"],"sourceRoot":""}