+
+ `)
+ }
+
+ constructor() {
+ super({
+ attrTypes: AuthedUser.attrTypes,
+ template: AuthedUser.template
+ });
+
+ // render component
+ this.render();
+ }
+
+ // call on attributes changed
+ attributeChangedCallback(attrName, oldValue, newValue) {
+ if (oldValue === newValue)
+ return;
+
+ // re-render component
+ this.render();
+ }
+
+ setUser(user) {
+ this._user = user;
+
+ this.setAttribute("id", user.id);
+ this.setAttribute("name", user.name);
+ this.setAttribute("username", user.username);
+ this.setAttribute("avatar", user.avatar);
+ }
+
+ /**
+ * reflect the hidden attr on HTML tag
+ * @param value
+ */
+ set hidden(value) {
+ if (value)
+ this.setAttribute("hidden", '');
+ else
+ this.removeAttribute("hidden")
+ }
+
+ get hidden() {
+ return this.hasAttribute("hidden")
+ }
+
+ /**
+ * render component according to template and attributes
+ */
+ render() {
+
+ // check the existence of avatar
+ // fetch first char of title to show if avatar not passed
+ if (!this.getAttribute("avatar")) {
+ // put first char of title when avatar not passed
+ const name = (this.getAttribute("name") || "").toUpperCase();
+ this.shadowRoot.querySelector(".char-avatar").innerText = name.substr(0, 1);
+ }
+
+ // loop over attributes and set all
+ for (let attr of this.attributes) {
+ const target = this.shadowRoot.getElementById(attr.name);
+ if (!target)
+ continue;
+
+ switch (attr.name) {
+ case "username":
+ case "name":
+ target.innerText = attr.value;
+ break;
+ case "avatar":
+ target.src = attr.value;
+ break;
+ }
+
+ }
+ }
+}
+
+// define auth-user tag name
+customElements.define(AuthedUser.tagName, AuthedUser);
diff --git a/Chat Application/components/chat-box.js b/Chat Application/components/chat-box.js
new file mode 100644
index 0000000..72e2acd
--- /dev/null
+++ b/Chat Application/components/chat-box.js
@@ -0,0 +1,511 @@
+class ChatBox extends Component {
+
+ /**
+ * define attributes types
+ * @returns {Object}
+ */
+ static get attrTypes() {
+ return {
+ hidden: {
+ type: "boolean",
+ observe: true
+ },
+ };
+ }
+
+ /**
+ * generate observed attributes array from attr types object
+ */
+ static get observedAttributes() {
+ return super.getObservedAttrs(ChatBox.attrTypes);
+ }
+
+ /**
+ * generate tag-name from component class name
+ * @returns {string}
+ */
+ static get tagName() {
+ return super.generateTagName(ChatBox.name);
+ }
+
+ /**
+ * styles of component
+ * @returns {string}
+ */
+ static get style() {
+ return (``)
+ }
+
+ /**
+ * html template of component
+ * @returns {string}
+ */
+ static get template() {
+ return (`
+
+ ${ChatBox.style}
+
+
+
+
+
+
+
+
+
+
+
Hi there! \n Select a chat to start messaging.
+
This app is one of the projects that developed under name
+
+ practical front-end projects for educational purposes.
+ This project developed with Web Components without any third-party libs.
+
+
+ `)
+ }
+
+ constructor() {
+ super({
+ attrTypes: ChatBox.attrTypes,
+ template: ChatBox.template
+ });
+
+ this._chatList = this.shadowRoot.getElementById("chat-list");
+ this._newMessageBox = this.shadowRoot.querySelector("new-message");
+ this._scrollToBottomBtn = this.shadowRoot.getElementById("scroll-to-bottom");
+ this._activeChatElm = this.shadowRoot.querySelector("active-chat");
+ }
+
+ // call on mounting
+ onMount() {
+ this.initListeners();
+ }
+
+ // call on un-mounting
+ onUnmount() {
+ this.removeListeners();
+ }
+
+ // call on attributes changed
+ attributeChangedCallback(attrName, oldValue, newValue) {
+ if (oldValue === newValue)
+ return;
+
+ if (attrName === "readonly")
+ this.checkNewMessageBoxVisibility();
+ }
+
+ /**
+ * reflect the readOnly attr on HTML tag
+ * @param value
+ */
+ set readOnly(value) {
+ if (value) {
+ this.setAttribute('readonly', '');
+
+ } else {
+ this.removeAttribute('readonly');
+ }
+ }
+
+ get readOnly() {
+ return this.hasAttribute('readonly');
+ }
+
+ /**
+ * use this to set active chat of chatBox
+ * @param chat
+ */
+ setActiveChat(chat) {
+ // if chat is not valid do nothing
+ if (!chat || !chat.id)
+ return;
+
+ this._activeChat = chat;
+
+ // make chatBox visibility visible anyway
+ // clear the chats lis
+ // and clear the lastMessage flag
+ this.hidden = false;
+ this._chatList.innerHTML = '';
+ this.lastMessage = null;
+
+ // render the chatBox header with activeChat
+ this.renderChatBoxHeader();
+ }
+
+ /**
+ * active chat getter
+ * @returns {*|{id}}
+ */
+ get activeChat() {
+ return this._activeChat;
+ }
+
+ /**
+ * reflect the hidden attr on HTML tag
+ * @param value
+ */
+ set hidden(value) {
+ if (value) {
+ this.setAttribute("hidden", '');
+ } else {
+ this.removeAttribute("hidden");
+ }
+ }
+
+ get hidden() {
+ return this.hasAttribute("hidden")
+ }
+
+ /**
+ * Initialize required listeners
+ */
+ initListeners() {
+ // listen for user sign-in
+ this.on(APP_EVENTS.USER_SIGN_IN, this._userSignIn.bind(this));
+ // listen for new messages that send from authed user
+ this._newMessageBox.on(APP_EVENTS.AUTHED_USER_NEW_MESSAGE, this._onAuthedMessageReceive.bind(this));
+
+ // control the visibility and the behavior of scrollToBottom button in chats list
+ this._chatList.addEventListener("scroll", this.checkScrollToBottomBtnVisibility.bind(this));
+ this._scrollToBottomBtn.addEventListener("click", this.scrollToEnd.bind(this));
+
+ this._activeChatElm.on(APP_EVENTS.CHAT_BOX_BACK_CLICKED, this._onBackBtnClicked.bind(this));
+ }
+
+ /**
+ * remove added listeners
+ */
+ removeListeners() {
+ this._newMessageBox.off(APP_EVENTS.AUTHED_USER_NEW_MESSAGE, this._onAuthedMessageReceive.bind(this));
+ this.off(APP_EVENTS.USER_SIGN_IN, this._userSignIn.bind(this));
+ this._scrollToBottomBtn.removeEventListener("click", this.scrollToEnd.bind(this));
+ this._chatList.removeEventListener("scroll", this.checkScrollToBottomBtnVisibility.bind(this));
+ }
+
+ /**
+ * Render message object and add to chats-box
+ * @param sender
+ * @param text
+ * @param audio
+ * @param time
+ * @param forceScrollToEnd
+ */
+ renderMessage({sender, text, audio, time}, forceScrollToEnd = false) {
+ // if the message is invalid do nothing
+ if (!sender || (!text && !audio) || !time || !(time instanceof Date))
+ return;
+
+ const isFromAuthedUser = sender === this._authedUserId;
+ const isSameSender = this.lastMessage && this.lastMessage.sender === sender;
+
+ // get time string to show in message bubble
+ const timeToShow = `${time.getHours()}:${time.getMinutes()}`;
+
+ // create component element and set attributes
+ const msg = document.createElement("chat-message");
+
+ if (text)
+ msg.text = text;
+
+ if (audio)
+ msg.audio = audio;
+
+ msg.setAttribute("position", isFromAuthedUser ? "right" : "left");
+ msg.setAttribute("sender", sender);
+ msg.setTimeObject(time);
+ msg.setAttribute("time", timeToShow);
+ msg.setAttribute("title", time.toLocaleString());
+ msg.isLastInGroup = true;
+
+ // check if the message is the last one that sender has been sent
+ // it's just for styling bubbles
+ if (this.lastMessage && isSameSender)
+ this.lastMessage.isLastInGroup = false;
+
+ // render the day date and add to chat-box if needs
+ if (!this.lastMessage || this._isMessageForDifferentDay(time)) {
+ this._appendDateToChatList(time);
+ }
+
+ // check if the user not scrolled top
+ // and the last message in chatBox is observable
+ const isLastMessageInView = this._chatList.scrollTop >= this._chatList.scrollHeight - this._chatList.clientHeight;
+
+ // set lastMessage flat and append createdElement to chatList
+ this.lastMessage = msg;
+ this._chatList.appendChild(msg);
+
+ // clear the newMessage input box if the sender is the authedUser
+ if (isFromAuthedUser)
+ this._newMessageBox.clear();
+
+ if (isLastMessageInView || forceScrollToEnd)
+ this.scrollToEnd();
+
+ // check the viability of scrollToBottom button
+ this.checkScrollToBottomBtnVisibility();
+ }
+
+ /**
+ * fire when a user signed in and set the this._authedUserId
+ * @param detail
+ * @private
+ */
+ _userSignIn({detail}) {
+ this._authedUserId = detail.id;
+ }
+
+ /**
+ * fires when back btn clicked in active-chat component
+ * @private
+ */
+ _onBackBtnClicked() {
+ this.hidden = true;
+
+ // send action to parent
+ this.emit(APP_EVENTS.CHAT_BOX_BACK_CLICKED)
+ }
+
+ /**
+ * fire when a signed user send a message
+ * this will render the message and emit it to parent
+ * @param detail
+ * @private
+ */
+ _onAuthedMessageReceive({detail}) {
+ if (!this.activeChat)
+ return;
+
+ detail.toChat = this.activeChat.id;
+ detail.sender = this._authedUserId;
+ this.renderMessage(detail, true);
+ this.emit(APP_EVENTS.AUTHED_USER_NEW_MESSAGE, detail);
+ }
+
+ /**
+ * compare the time of the last received message with this._lastMessage flag
+ * @param time
+ * @returns {boolean}
+ * @private
+ */
+ _isMessageForDifferentDay(time) {
+ if (!this.lastMessage || !time)
+ return false;
+
+ return time.toDateString() !== this.lastMessage.timeObject.toDateString();
+ }
+
+ /**
+ * this generate the day title and a chat-day element put the time on element
+ * and append it to chat-list
+ * @param time
+ * @private
+ */
+ _appendDateToChatList(time) {
+ const monthNames = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
+ this.assert(time, "Message time not passed");
+
+ let dayTitle = `${monthNames[time.getMonth()]} ${time.getDay()}, ${time.getFullYear()}`;
+ if (time.toDateString() === new Date().toDateString())
+ dayTitle = "Today";
+
+ const dateNode = document.createElement("div");
+ dateNode.classList.add("chat-day");
+ dateNode.innerHTML = `${dayTitle}`;
+
+ this._chatList.appendChild(dateNode);
+ }
+
+ /**
+ * check the scroll height and scrollTop of chat-list
+ * and toggle the visibility of the scrollToBottom button
+ * @param e
+ */
+ checkScrollToBottomBtnVisibility(e) {
+ if (this._chatList.scrollTop + 200 < this._chatList.scrollHeight - this._chatList.clientHeight) {
+ this._scrollToBottomBtn.classList.add("show")
+ } else {
+ this._scrollToBottomBtn.classList.remove("show");
+ }
+ }
+
+ /**
+ * scroll the chat list to the end
+ */
+ scrollToEnd() {
+ this._chatList.scrollTo({
+ top: this._chatList.scrollHeight,
+ })
+ }
+
+ /**
+ * render the activeChat component of the chatBox using this._activeChat
+ */
+ renderChatBoxHeader() {
+ const activeChatNode = this.shadowRoot.querySelector("active-chat");
+ this.assert(activeChatNode, "The active-chat node not found in chat-box");
+
+ activeChatNode.setAttribute("id", this._activeChat.id);
+ activeChatNode.setAttribute("name", this._activeChat.name);
+ activeChatNode.setAttribute("avatar", this._activeChat.avatar || "");
+ if (this._activeChat.online)
+ activeChatNode.setAttribute("online", '');
+ else
+ activeChatNode.removeAttribute("online");
+ }
+
+ /**
+ * check the new message box visibility
+ */
+ checkNewMessageBoxVisibility() {
+
+ // remove newMessageBox component if
+ // the chatBox is readOnly for logged in user
+ if (this.readOnly) {
+ this._newMessageBox.remove();
+ }
+
+ }
+
+}
+
+// define chat-box tag name
+customElements.define(ChatBox.tagName, ChatBox);
diff --git a/Chat Application/components/chat-list-item.js b/Chat Application/components/chat-list-item.js
new file mode 100644
index 0000000..8d8caee
--- /dev/null
+++ b/Chat Application/components/chat-list-item.js
@@ -0,0 +1,378 @@
+class ChatListItem extends Component {
+
+ /**
+ * define attributes types
+ * @returns {Object}
+ */
+ static get attrTypes() {
+ return {
+ id: {
+ type: "string",
+ required: true,
+ },
+ name: {
+ type: "string",
+ required: true,
+ observe: true
+ },
+ desc: {
+ type: "string",
+ observe: true
+ },
+ avatar: {
+ type: "string",
+ observe: true
+ },
+ lastseen: {
+ type: "string",
+ observe: true
+ },
+ unreadcount: {
+ type: "number",
+ observe: true
+ },
+ online: {
+ type: "boolean",
+ observe: true
+ },
+ };
+ }
+
+ /**
+ * generate observed attributes array from attr types object
+ */
+ static get observedAttributes() {
+ return super.getObservedAttrs(ChatListItem.attrTypes);
+ }
+
+ /**
+ * generate tag-name from component class name
+ * @returns {string}
+ */
+ static get tagName() {
+ return super.generateTagName(ChatListItem.name);
+ }
+
+ /**
+ * styles of component
+ * @returns {string}
+ */
+ static get style() {
+ return (``)
+ }
+
+ /**
+ * html template of component
+ * @returns {string}
+ */
+ static get template() {
+ return (`
+
+ ${ChatListItem.style}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ `)
+ }
+
+ constructor() {
+ super({
+ attrTypes: ChatListItem.attrTypes,
+ template: ChatListItem.template
+ });
+
+ // render component
+ this.render();
+ }
+
+ // call on mounting
+ onMount() {
+ this.initListeners();
+ }
+
+ // call on un-mounting
+ onUnmount() {
+ this.removeListeners();
+ }
+
+ // call on attributes changed
+ attributeChangedCallback(attrName, oldValue, newValue) {
+ if (oldValue === newValue)
+ return;
+
+ // re-render component
+ this.render();
+ }
+
+ /**
+ * reflect the selected attr on HTML tag
+ * @param value
+ */
+ set selected(value) {
+ if (value) {
+ this.setAttribute('selected', '');
+
+ } else {
+ this.removeAttribute('selected');
+ }
+ }
+
+ get selected() {
+ return this.hasAttribute('selected');
+ }
+
+ // call on attributes changed
+ incrementUnreadCount() {
+ let count = 0;
+ if (this.getAttribute("unreadcount"))
+ count = parseInt(this.getAttribute("unreadcount"));
+
+ this.setAttribute('unreadcount', count + 1);
+ }
+
+ /**
+ * call this when you want to reset the unread messages count
+ */
+ markAllAsRead() {
+ this.setAttribute('unreadcount', '0');
+ }
+
+ /**
+ * reflect the unread attr on HTML tag
+ * unread counter badge only shows on items that have truly unread attr
+ * @param value
+ */
+ set unread(value) {
+ if (value)
+ this.setAttribute('unread', '');
+ else
+ this.removeAttribute('unread');
+ }
+
+ get unread() {
+ return this.hasAttribute('unread');
+ }
+
+ /**
+ * reflect the online attr on HTML tag
+ * @param value
+ */
+ set online(value) {
+ if (value)
+ this.setAttribute('online', '');
+ else
+ this.removeAttribute('online');
+ }
+
+ get online() {
+ return this.hasAttribute('online');
+ }
+
+ /**
+ * Initialize required listeners
+ */
+ initListeners() {
+ this.on("click", this._onClick)
+ }
+
+ /**
+ * remove added listeners
+ */
+ removeListeners() {
+ this.off("click", this._onClick)
+ }
+
+ /**
+ * this method fire when chat-list-item clicked
+ * if the component is not disabled, it emit the
+ * clicked item id to above component (chatList) and
+ * set the selected attr
+ * @param e
+ * @private
+ */
+ _onClick(e) {
+ e.preventDefault();
+ if (this.disabled) {
+ return;
+ }
+
+ // send selected chat-item id to parent component
+ this.emit(APP_EVENTS.CHAT_CLICKED, {id: this.getAttribute("id")});
+ this.selected = true;
+ // reset unread counter of this chat
+ this.markAllAsRead();
+ }
+
+ /**
+ * render component according to template and attributes
+ */
+ render() {
+
+ // remove component if id not passed
+ if (!("id" in this.attributes)) {
+ this.remove()
+ }
+
+ // check the existence of avatar
+ // fetch first char of name to show if avatar not passed
+ if (!this.getAttribute("avatar")) {
+ // put first char of name when avatar not passed
+ const name = (this.getAttribute("name") || "").toUpperCase();
+ this.shadowRoot.querySelector(".char-avatar").innerText = name.substr(0, 1);
+ }
+
+ // loop over attributes and set all
+ for (let attr of this.attributes) {
+ const target = this.shadowRoot.getElementById(attr.name);
+ if (target)
+ target.innerText = attr.value;
+
+ switch (attr.name) {
+ case "avatar":
+ target.src = attr.value;
+ break;
+
+ case "unreadcount":
+ this.unread = parseInt(attr.value) > 0;
+ break;
+
+ }
+
+ }
+ }
+
+}
+
+// define chat-list-item tag name
+customElements.define(ChatListItem.tagName, ChatListItem);
diff --git a/Chat Application/components/chat-message.js b/Chat Application/components/chat-message.js
new file mode 100644
index 0000000..6f9e7d1
--- /dev/null
+++ b/Chat Application/components/chat-message.js
@@ -0,0 +1,388 @@
+class ChatMessage extends Component {
+
+ /**
+ * define attributes types
+ * @returns {Object}
+ */
+ static get attrTypes() {
+ return {
+ sender: {
+ type: "string",
+ observe: true
+ },
+ position: {
+ type: "string",
+ observe: true
+ },
+ lastingroup: {
+ type: "boolean",
+ observe: true
+ },
+ text: {
+ type: "string",
+ observe: true
+ },
+ audio: {
+ type: "string",
+ observe: true
+ },
+ time: {
+ type: "string",
+ observe: true
+ },
+ };
+ }
+
+ /**
+ * generate observed attributes array from attr types object
+ */
+ static get observedAttributes() {
+ return super.getObservedAttrs(ChatMessage.attrTypes);
+ }
+
+ /**
+ * generate tag-name from component class name
+ * @returns {string}
+ */
+ static get tagName() {
+ return super.generateTagName(ChatMessage.name);
+ }
+
+ /**
+ * styles of component
+ * @returns {string}
+ */
+ static get style() {
+ return (``)
+ }
+
+ /**
+ * html template of component
+ * @returns {string}
+ */
+ static get template() {
+ return (`
+
+ ${ChatMessage.style}
+
+
+
+ 00:00
+
+
+
+ `)
+ }
+
+ constructor() {
+ super({
+ attrTypes: ChatMessage.attrTypes,
+ template: ChatMessage.template
+ });
+
+ this._textElement = this.shadowRoot.getElementById("text");
+ this._timeElement = this.shadowRoot.getElementById("time");
+
+ this._audioMessageCtrl = this.shadowRoot.querySelector(".audio-control");
+ this._audioPlayBtn = this.shadowRoot.getElementById("audio-play");
+ this._audioDurationElm = this.shadowRoot.getElementById("audio-duration");
+
+ }
+
+ onMount() {
+ this._audioPlayBtn.addEventListener("click", this._onAudioPlayBtnClick.bind(this))
+ }
+
+ onUnmount() {
+ this._audioPlayBtn.removeEventListener("click", this._onAudioPlayBtnClick.bind(this))
+ }
+
+ // call on attributes changed
+ attributeChangedCallback(attrName, oldValue, newValue) {
+ if (oldValue === newValue)
+ return;
+
+ // re-render component
+ this.render();
+ }
+
+ /**
+ * reflect the text attr on HTML tag
+ * @param value
+ */
+ set text(value) {
+ if (value) {
+ this.setAttribute('text', value);
+ } else {
+ this.removeAttribute('text');
+ }
+ }
+
+ get text() {
+ return this.getAttribute('text');
+ }
+
+ /**
+ * reflect the audio attr on HTML tag
+ * @param audioObj
+ */
+ set audio(audioObj) {
+ if (audioObj) {
+
+ // set received object as _audio and do some process on it and
+ // add some listeners to control the play status or timing
+ this._audio = audioObj;
+ const {audio, duration, audioUrl} = audioObj;
+ this._audioElement = audio || new Audio(audioUrl);
+
+ this._audioDurationElm.innerText = duration;
+
+ const onPause = () => {
+ // handle icon changing for btn
+ this._audioPlayBtn.classList.remove("playing");
+ };
+
+ const onEnded = () => {
+ // reset the duration text and handle icon changing for btn
+ this._audioDurationElm.innerText = duration;
+ this._audioPlayBtn.classList.remove("playing");
+ };
+
+ const onTimeUpdate = () => {
+ // calc duration and update the text when audio is playing
+ const passedTime = Recorder.secToTimeStr(this._audioElement.currentTime);
+ this._audioDurationElm.innerText = `${passedTime} / ${duration}`;
+ };
+
+ const onPlay = () => {
+ this._audioPlayBtn.classList.add("playing");
+ };
+ this._audioElement.onended = onEnded;
+ this._audioElement.onpause = onPause;
+ this._audioElement.onplay = onPlay;
+ this._audioElement.ontimeupdate = onTimeUpdate;
+
+ } else {
+ // set the _audio as null to remove it from component
+ this._audio = null;
+ }
+ }
+
+ get audio() {
+ return this._audio;
+ }
+
+ setTimeObject(value) {
+ this._timeObject = value;
+ }
+
+ get timeObject() {
+ return this._timeObject;
+ }
+
+ /**
+ * reflect the time attr on HTML tag
+ * @param value
+ */
+ set time(value) {
+ if (value) {
+ this.setAttribute('time', value);
+ } else {
+ this.removeAttribute('time');
+ }
+ }
+
+ get time() {
+ return this.getAttribute('time');
+ }
+
+ /**
+ * reflect the sender attr on HTML tag
+ * @param value
+ */
+ set sender(value) {
+ if (value) {
+ this.setAttribute('sender', value);
+ } else {
+ this.removeAttribute('sender');
+ }
+ }
+
+ get sender() {
+ return this.getAttribute('sender');
+ }
+
+ /**
+ * reflect the islastingroup attr on HTML tag
+ * @param value
+ */
+ set isLastInGroup(value) {
+ if (value) {
+ this.setAttribute('lastingroup', '');
+ } else {
+ this.removeAttribute('lastingroup');
+ }
+ }
+
+ get isLastInGroup() {
+ return this.hasAttribute('lastingroup');
+ }
+
+ /**
+ * fire when audio message play btn clicked and toggle the playing status
+ * @private
+ */
+ _onAudioPlayBtnClick() {
+ if (!this._audioElement)
+ return;
+
+ if (this._audioElement.paused) {
+ this._audioElement.play();
+ } else {
+ this._audioElement.pause();
+ }
+ }
+
+ /**
+ * render message by attributes
+ */
+ render() {
+ this._textElement.innerHTML = this.text;
+ this._timeElement.innerHTML = this.time;
+ this._audioMessageCtrl.style.display = this.audio ? "flex" : "none";
+ }
+
+}
+
+// define chat-message tag name
+customElements.define(ChatMessage.tagName, ChatMessage);
diff --git a/Chat Application/components/chats-list.js b/Chat Application/components/chats-list.js
new file mode 100644
index 0000000..4de2f12
--- /dev/null
+++ b/Chat Application/components/chats-list.js
@@ -0,0 +1,322 @@
+class ChatsList extends Component {
+
+ /**
+ * define attributes types
+ * @returns {Object}
+ */
+ static get attrTypes() {
+ return {};
+ }
+
+ /**
+ * generate observed attributes array from attr types object
+ */
+ static get observedAttributes() {
+ return super.getObservedAttrs(ChatsList.attrTypes);
+ }
+
+ /**
+ * generate tag-name from component class name
+ * @returns {string}
+ */
+ static get tagName() {
+ return super.generateTagName(ChatsList.name);
+ }
+
+ /**
+ * styles of component
+ * @returns {string}
+ */
+ static get style() {
+ return (``)
+ }
+
+ /**
+ * html template of component
+ * @returns {string}
+ */
+ static get template() {
+ return (`
+
+ ${ChatsList.style}
+
+
+
+
+
+
+
+ `)
+ }
+
+ constructor() {
+ super({
+ attrTypes: ChatsList.attrTypes,
+ template: ChatsList.template
+ });
+
+ this.chatsWrapper = this.shadowRoot.getElementById("chats-wrapper");
+ this._searchInput = this.shadowRoot.getElementById("search-input");
+ this._searchDebounceFlag = null;
+ this._selectedChat = null;
+
+ }
+
+ // call on mounting
+ onMount() {
+ this.initListeners();
+ }
+
+ // call on un-mounting
+ onUnmount() {
+ this.removeListeners();
+ }
+
+ /**
+ * Initialize required listeners
+ */
+ initListeners() {
+ document.addEventListener("keydown", this._onKeyDown.bind(this));
+ this._searchInput.addEventListener("input", this._onSearch.bind(this));
+ this.on(APP_EVENTS.NEW_MESSAGE_RECEIVE, this._onNewMessageReceive.bind(this));
+ this.on(APP_EVENTS.DESELECT_SELECTED_CHAT, this._onChatDeselect.bind(this));
+ }
+
+ /**
+ * remove added listeners
+ */
+ removeListeners() {
+ document.removeEventListener("keydown", this._onKeyDown.bind(this))
+ }
+
+ /**
+ * Listen document keypress to handle Ctrl + F keys and focus on search box
+ * @param e
+ * @private
+ */
+ _onKeyDown(e) {
+ if (e.ctrlKey && e.key === "f") {
+ e.preventDefault();
+ this._searchInput.focus();
+ }
+ }
+
+ /**
+ * fires on search input change and call render on every 300ms
+ * @param e
+ * @private
+ */
+ _onSearch(e) {
+ if (this._searchDebounceFlag)
+ clearTimeout(this._searchDebounceFlag);
+
+ this._searchDebounceFlag = setTimeout(() => {
+ this.render();
+ }, 300);
+ }
+
+ /**
+ * fires when a new message received, and handle the
+ * position changing of chat that send/receive message
+ * also, handle the unread message count of the chat.
+ * @param detail
+ * @private
+ */
+ _onNewMessageReceive({detail}) {
+ if (!detail.sender)
+ return;
+
+ // actually here we find the target chat and
+ // remove it's element from chats-list DOM,
+ // update the unread messages count,
+ // generate a new element for it and append it
+ // as the first child of chats-list
+ const senderChatIndex = this._chats.findIndex(c => c.id === detail.sender);
+ const senderChat = this._chats.splice(senderChatIndex, 1)[0];
+
+ // update unread messages count
+ senderChat.unreadcount = (+senderChat.unreadcount || 0) + 1;
+
+ // check the selection status of chat to apply it on the new element
+ const alreadySelected = senderChat.elm.selected;
+
+ // remove previous element of chat
+ senderChat.elm.remove();
+
+ // generate new element for updated chat
+ senderChat.elm = this.generateChatListItem(senderChat);
+
+ senderChat.elm.selected = alreadySelected;
+
+ // push the updated chat to the start of the chats array
+ this._chats.unshift(senderChat);
+
+ // append the updated chat to chatsList as the first child in the list
+ this.appendChatToList(senderChat, true);
+ }
+
+ /**
+ * this method call from parent component to set the chats array
+ * every time, it makes the this.chatsWrapper empty and calls the render method
+ * @param chats
+ */
+ setChats(chats) {
+ this._chats = chats;
+ this.chatsWrapper.innerHTML = '';
+ this.render();
+ }
+
+ /**
+ * this method generate chat-list-item component for chat object
+ * @param chat
+ * @returns {HTMLElement}
+ */
+ generateChatListItem(chat) {
+ const chatListItem = document.createElement("chat-list-item");
+ chatListItem.setAttribute("id", chat.id);
+ chatListItem.setAttribute("title", chat.name);
+ chatListItem.setAttribute("name", chat.name);
+ chatListItem.setAttribute("avatar", chat.avatar);
+ chatListItem.setAttribute("desc", chat.desc || chat.username);
+ chatListItem.setAttribute("lastseen", chat.lastseen);
+ chatListItem.setAttribute("unreadcount", chat.unreadcount);
+ if (chat.online)
+ chatListItem.setAttribute("online", '');
+
+ // set the click listener of newly created component
+ chatListItem.on(APP_EVENTS.CHAT_CLICKED, this._onChatClicked.bind(this));
+
+ return chatListItem
+ }
+
+ /**
+ * this method calls when component received a message to clear selection
+ * @private
+ */
+ _onChatDeselect() {
+ if (!this._selectedChat)
+ return;
+
+ this._selectedChat.elm.selected = false;
+ this._selectedChat = null;
+
+ this.render();
+ }
+
+ /**
+ * fires when a chat-item-list has been clicked
+ * @param detail
+ * @private
+ */
+ _onChatClicked({detail}) {
+
+ this._selectedChat = null;
+ // we loop over chats to reset unread message counter
+ // of clicked chat and remove selection of other chats
+ this._chats.map(chat => {
+ if (chat.id !== detail.id) {
+ chat.elm.selected = false;
+ this._selectedChat = chat;
+ } else {
+ chat.unreadcount = 0;
+ }
+ });
+
+ // send the clicked chat-item details to parent component
+ this.emit(APP_EVENTS.CHAT_SELECTED, detail)
+ }
+
+ /**
+ * this method controls the adding of chat to the this.chatsWrapper element
+ * also, the searching action happens here. it filters the chat with the value of search input
+ * @param chat
+ * @param appendFirst
+ */
+ appendChatToList(chat, appendFirst = false) {
+ const searchTrend = (this._searchInput.value || '').toLowerCase();
+
+ // check if the chat.name or chat.username contains the value of search input or not
+ if (~chat.name.toLowerCase().indexOf(searchTrend)
+ || ~chat.username.toLowerCase().indexOf(searchTrend)) {
+
+ if (!appendFirst) { // append at the end of the list
+ this.chatsWrapper.appendChild(chat.elm);
+
+ } else { // append as the first child of the list
+ this.chatsWrapper.insertBefore(chat.elm, this.chatsWrapper.firstChild);
+ }
+ }
+ }
+
+ /**
+ * render component according to template and attributes
+ */
+ render() {
+ this.chatsWrapper.innerHTML = '';
+ this._chats = this._chats.map(chat => {
+
+ // generate chat-list-item component for the chat object
+ chat.elm = this.generateChatListItem(chat);
+
+ // append chat to list
+ this.appendChatToList(chat);
+
+ return chat
+ })
+ }
+
+}
+
+// define chats-list tag name
+customElements.define(ChatsList.tagName, ChatsList);
diff --git a/Chat Application/components/component.js b/Chat Application/components/component.js
new file mode 100644
index 0000000..8deb519
--- /dev/null
+++ b/Chat Application/components/component.js
@@ -0,0 +1,194 @@
+/**
+ * Main component class that other components extends from it
+ */
+class Component extends HTMLElement {
+
+ constructor({attrTypes, template, shadowMode = "open"}) {
+ super();
+
+ this.attrTypes = attrTypes;
+ this._template = template;
+ this._shadowMode = shadowMode;
+
+ // his method attach template to root if exists
+ this.makeShadow();
+ }
+
+ /**
+ * this method fire when component attached to DOM
+ */
+ connectedCallback() {
+ // Check attributes types for each component
+ this.checkAttrs();
+ // and call onMount method
+ // onMount is the only method that call inside connectedCallback
+ if (this.onMount && typeof this.onMount === "function")
+ this.onMount();
+ }
+
+ /**
+ * This method fire when component removed from DOM
+ */
+ disconnectedCallback() {
+ // call onMount method of component.
+ // onUnmount is the only method that call inside disconnectedCallback
+ if (this.onUnmount && typeof this.onUnmount === "function")
+ this.onUnmount();
+ }
+
+ /**
+ * parse attribute types according to passed types
+ * @param value
+ * @param target
+ * @returns {(number | boolean | string)|*}
+ */
+ parseAttrType(value, target) {
+ if (value === void 0 || value === null)
+ return value;
+
+ switch (target) {
+ case "n":
+ case "number":
+ value = value.indexOf(".") ? parseFloat(value) : parseInt(value);
+ break;
+
+ case "o":
+ case "object":
+ value = JSON.parse(value);
+ break;
+
+ case "b":
+ case "bool":
+ case "boolean":
+ value = Boolean(value);
+ break;
+
+ default:
+ value = value.toString()
+ }
+
+ return value;
+ }
+
+ /**
+ * check type of attributes
+ */
+ checkAttrs() {
+ if (!this.attrTypes)
+ return;
+
+ for (let [attr, details] of Object.entries(this.attrTypes)) {
+
+ let value = this.parseAttrType(this.getAttribute(attr), details.type);
+
+ // replace attribute with parsed value if value is not null
+ if (value !== null)
+ this.setAttribute(attr, value || "");
+
+ if (details.required)
+ this.assert(!!value,
+ `"${attr}" attr is knows as required but not passed to component.`);
+
+ if (value !== null && details.type) {
+ this.assert(typeof value === details.type,
+ `The type of "${attr}" attr must be ${details.type}.`);
+ }
+
+ }
+ }
+
+ /**
+ * to check condition and fire event if its false
+ * @param condition
+ * @param error
+ */
+ assert(condition, error) {
+ if (!condition)
+ console.error(`Warning: ${error}`)
+ }
+
+ /**
+ * parse html and get content as html
+ * @returns {Node}
+ */
+ parseTemplate() {
+ let parser = new DOMParser();
+ const doc = parser.parseFromString(this._template, 'text/html');
+
+ return doc.querySelector("template").content.cloneNode(true);
+ }
+
+ /**
+ * attach template to shadow
+ */
+ makeShadow() {
+ // get template note
+ const template = this.parseTemplate();
+
+ // generate shadow dom
+ this.attachShadow({mode: this._shadowMode}).appendChild(template);
+ }
+
+ /**
+ * dispatch an event
+ * @param event
+ * @param detail
+ */
+ emit(event, detail) {
+ this.dispatchEvent(new CustomEvent(event, {detail}));
+ }
+
+ /**
+ * Add listener to the host
+ * @param event
+ * @param callback
+ */
+ on(event, callback) {
+ this.shadowRoot.host.addEventListener(event, callback.bind(this))
+ }
+
+ /**
+ * Remove listener of the host
+ * @param event
+ * @param callback
+ */
+ off(event, callback) {
+ this.shadowRoot.host.removeEventListener(event, callback.bind(this))
+ }
+
+ get disabled() {
+ return this.hasAttribute('disabled');
+ }
+
+ /**
+ * reflect the disabled attr on HTML tag
+ * @param val
+ */
+ set disabled(val) {
+ const isDisabled = Boolean(val);
+ if (isDisabled)
+ this.setAttribute('disabled', '');
+ else
+ this.removeAttribute('disabled');
+ }
+
+ /**
+ * generate tag-name from component class name
+ * @returns {string}
+ */
+ static generateTagName(className) {
+ return className.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase();
+ }
+
+ /**
+ * generate list of attrs has observe:true
+ * @param attrTypes {Object}
+ * @returns {string[]}
+ */
+ static getObservedAttrs(attrTypes = {}) {
+ return Object.entries(attrTypes || {})
+ .filter(([_, details]) => details.observe)
+ .map(([attr, _]) => attr);
+ }
+
+}
diff --git a/Chat Application/components/new-message.js b/Chat Application/components/new-message.js
new file mode 100644
index 0000000..2a43110
--- /dev/null
+++ b/Chat Application/components/new-message.js
@@ -0,0 +1,323 @@
+class NewMessage extends Component {
+
+ /**
+ * define attributes types
+ * @returns {Object}
+ */
+ static get attrTypes() {
+ return {};
+ }
+
+ /**
+ * generate observed attributes array from attr types object
+ */
+ static get observedAttributes() {
+ return super.getObservedAttrs(NewMessage.attrTypes);
+ }
+
+ /**
+ * generate tag-name from component class name
+ * @returns {string}
+ */
+ static get tagName() {
+ return super.generateTagName(NewMessage.name);
+ }
+
+ /**
+ * styles of component
+ * @returns {string}
+ */
+ static get style() {
+ return (``)
+ }
+
+ /**
+ * html template of component
+ * @returns {string}
+ */
+ static get template() {
+ return (`
+
+ ${NewMessage.style}
+
+
+
+
+
+
+
+
+ `)
+ }
+
+ constructor() {
+ super({
+ attrTypes: NewMessage.attrTypes,
+ template: NewMessage.template
+ });
+
+ this._textSendButton = this.shadowRoot.getElementById("text-send-btn");
+ this._soundRecordBtn = this.shadowRoot.getElementById("sound-record-btn");
+ this._textarea = this.shadowRoot.getElementById("new-message-input");
+
+ // check if audio device is exists and make mic button visible
+ this.setMicBtnVisibility(Recorder.isMicAvailable());
+
+ // create recorder instance to control recording audio message
+ this._recorder = new Recorder();
+ }
+
+ /**
+ * toggle microphone button visibility
+ * @param showMic
+ */
+ setMicBtnVisibility(showMic) {
+ this._soundRecordBtn.style.display = showMic ? "flex" : "none";
+ this._textSendButton.style.display = showMic ? "none" : "flex";
+ }
+
+ // call on mounting
+ onMount() {
+ this.initListeners();
+ }
+
+ // call on un-mounting
+ onUnmount() {
+ this.removeListeners();
+ }
+
+ /**
+ * Initialize required listeners
+ */
+ initListeners() {
+ this.addEventListener("keydown", this._onKeyPress.bind(this));
+ this._textarea.addEventListener("input", this._onType.bind(this));
+ this._textSendButton.addEventListener("click", this._onTextSend.bind(this));
+ this._soundRecordBtn.addEventListener("mousedown", this._onRecordStart.bind(this));
+ this._soundRecordBtn.addEventListener("touchstart", this._onRecordStart.bind(this));
+ this._soundRecordBtn.addEventListener("mouseup", this._onRecordStop.bind(this));
+ this._soundRecordBtn.addEventListener("touchend", this._onRecordStop.bind(this));
+ }
+
+ /**
+ * remove added listeners
+ */
+ removeListeners() {
+ this.removeEventListener("keydown", this._onKeyPress.bind(this));
+ this._textarea.removeEventListener("input", this._onType.bind(this));
+ this._textSendButton.removeEventListener("click", this._onTextSend.bind(this));
+ this._soundRecordBtn.removeEventListener("mousedown", this._onRecordStart.bind(this));
+ this._soundRecordBtn.removeEventListener("touchstart", this._onRecordStart.bind(this));
+ this._soundRecordBtn.removeEventListener("mouseup", this._onRecordStop.bind(this));
+ this._soundRecordBtn.removeEventListener("touchend", this._onRecordStop.bind(this));
+
+ }
+
+ /**
+ * fires when a key pressed and handle the Ctrl+Enter press
+ * if the user pressed Ctrl+Enter keys, this calls the send method
+ * @param e
+ * @private
+ */
+ _onKeyPress(e) {
+ if (e.ctrlKey && e.key.toLowerCase() === "enter") {
+ this._onTextSend();
+ }
+ }
+
+ /**
+ * fires when the value of textarea changes,
+ * to toggle the visibility of text message sending button
+ * @param e
+ * @private
+ */
+ _onType(e) {
+ this.setMicBtnVisibility(!e.target.value);
+ }
+
+ /**
+ * fires when you want to send a new message,
+ * when the textarea has a valid value, this
+ * emit the message details to the parent component
+ * @private
+ */
+ _onTextSend() {
+
+ if (!this._textarea.value) {
+ this._textarea.focus();
+ return;
+ }
+
+ this.emit(APP_EVENTS.AUTHED_USER_NEW_MESSAGE, {
+ text: this._textarea.value.trim(),
+ time: new Date(),
+ })
+ }
+
+ /**
+ * fires when mic btn pressed and hold, it means to start the recording
+ * @private
+ */
+ _onRecordStart() {
+ // add "recording" class to record btn to start animation around the btn
+ this._soundRecordBtn.classList.add("recording");
+ this._recorder.start();
+ }
+
+ /**
+ * fires when mic btn released, it means to stop the recording
+ * @returns {Promise}
+ * @private
+ */
+ async _onRecordStop() {
+ // remove "recording" class to record btn to stop btn animation
+ this._soundRecordBtn.classList.remove("recording");
+
+ // generate the audioObj of recording and pass it as new message to parent component
+ let audio = await this._recorder.stop();
+ this.emit(APP_EVENTS.AUTHED_USER_NEW_MESSAGE, {
+ audio,
+ time: new Date(),
+ })
+ }
+
+ // getter for the value of textarea
+ get message() {
+ return this._textarea.value;
+ }
+
+ /**
+ * this will clear the content of the textarea and puts focus on it
+ */
+ clear() {
+ this._textarea.value = "";
+ this._textarea.focus();
+
+ // check if audio device is exists and make mic button visible
+ this.setMicBtnVisibility(Recorder.isMicAvailable())
+ }
+
+}
+
+customElements.define(NewMessage.tagName, NewMessage);
diff --git a/Chat Application/index.html b/Chat Application/index.html
new file mode 100644
index 0000000..b3ece45
--- /dev/null
+++ b/Chat Application/index.html
@@ -0,0 +1,35 @@
+
+
+
+
+
+
+
+ Web Chat App
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/Chat Application/scripts/chat-app.js b/Chat Application/scripts/chat-app.js
new file mode 100644
index 0000000..ce702af
--- /dev/null
+++ b/Chat Application/scripts/chat-app.js
@@ -0,0 +1,207 @@
+// connection between components is with events and
+// this const object is for keeping all event types in one place to easy access
+window.APP_EVENTS = {
+ PROFILE_BTN_CLICK: "profile-btn-click",
+ CHAT_CLICKED: "chat-clicked",
+ CHAT_SELECTED: "chat-selected",
+ AUTHED_USER_NEW_MESSAGE: "authed-user-new-message",
+ USER_SIGN_IN: "user-sign-in",
+ SEARCH_IN_CHATS: "search-in-chats",
+ NEW_MESSAGE_RECEIVE: "new-message-receive",
+ CHAT_BOX_BACK_CLICKED: "chat-box-back-clicked",
+ DESELECT_SELECTED_CHAT: "deselect-selected-chat",
+};
+
+/**
+ * This class controls the whole app
+ */
+class ChatApp {
+
+ /**
+ * this receive the id of container of app and get it
+ * the container is required to run app
+ * @param appId
+ */
+ constructor(appId) {
+ // check the existence of appId
+ this.assert(appId, "app container id not passed.");
+ this._app = document.getElementById(appId);
+ // check the existence of container
+ this.assert(this._app, `Container with id "${appId}" not found. `);
+
+ this._authedUser = null;
+ this._chats = [];
+ this._messages = [];
+ this._componenets = {};
+
+ // find and assign required app-components
+ this.assignComponents();
+
+ // initialize listeners
+ this.initListeners();
+
+ // render the existed chats
+ this.sendChatsToList();
+ }
+
+ /**
+ * Find main components and assign it to this._components property
+ * It's just for remove duplication, after this, we access all components
+ * in this._components without re-select from DOM and just
+ */
+ assignComponents() {
+ this._componenets.authedUser = document.querySelector("authed-user");
+ this._componenets.appBranch = document.querySelector("app-brand");
+ this._componenets.chatsList = document.querySelector("chats-list");
+ this._componenets.chatBox = document.querySelector("chat-box");
+ }
+
+ /**
+ * This method is for initializing required events
+ */
+ initListeners() {
+ this._componenets.appBranch.on(APP_EVENTS.PROFILE_BTN_CLICK, this._onProfileBtnClick.bind(this));
+ this._componenets.chatsList.on(APP_EVENTS.CHAT_SELECTED, this._onChatSelected.bind(this));
+ this._componenets.chatBox.on(APP_EVENTS.AUTHED_USER_NEW_MESSAGE, this._onAuthedUserNewMessages.bind(this));
+ this._componenets.chatBox.on(APP_EVENTS.CHAT_BOX_BACK_CLICKED, this._onChatBoxBack.bind(this));
+ }
+
+ /**
+ * To simulate sign-in, use this method.
+ * Logged in user object should pass to this.
+ * @param user
+ */
+ signin(user) {
+ // check the validity of user object
+ this.assert(user && user.id, "Invalid user object");
+ this._authedUser = user;
+
+ // after sign-in we need to set active user on authedUser component
+ // and make it hidden by default
+ // and tell the chatBox component that a user is signed-in
+ this._componenets.authedUser.setUser(this._authedUser);
+ this._componenets.authedUser.hidden = true;
+ this._componenets.chatBox.emit(APP_EVENTS.USER_SIGN_IN, {id: user.id});
+ }
+
+ /**
+ * use this method to send message to app
+ * @param msg {{time: Date, sender: String, text: String, toChat: String}}
+ */
+ newMessage(msg) {
+ // check the validity of received msg object
+ this.assert(msg && msg.time && msg.sender && msg.text && msg.toChat,
+ `Invalid message object.`);
+
+ // push to messages pool
+ this._messages.push(msg);
+
+ // we need to check the sender of new message, if it send by logged in
+ // user we should tell chatBox to render the message too.
+ if (this.activeChat && msg.sender === this.activeChat.id) {
+ this._componenets.chatBox.renderMessage(msg);
+ }
+ // also we need to send received message to chatsList component
+ this._componenets.chatsList.emit(APP_EVENTS.NEW_MESSAGE_RECEIVE, msg);
+ }
+
+ /**
+ * getter for this._authedUser
+ * @returns {Object}
+ */
+ get authedUser() {
+ return this._authedUser;
+ }
+
+ /**
+ * handle profile section visibility on profile-btn click
+ * @private
+ */
+ _onProfileBtnClick() {
+ // toggle the visibility of authedUser component
+ this._componenets.authedUser.hidden = !this._componenets.authedUser.hidden
+ }
+
+ /**
+ * this method fire when a chat selected.
+ * it find the messages of target chat and send those to chatBox to render
+ * @param detail
+ * @private
+ */
+ _onChatSelected({detail}) {
+ // find all messages of selected chat
+ const chatMessaged = this._messages.filter(m => m.sender === detail.id || m.toChat === detail.id);
+
+ // set selected chat as activeChat of whole app
+ this.activeChat = this._chats.find(c => c.id === detail.id);
+
+ // if the chatBox if open for activeChat, scroll content to end
+ if (this._componenets.chatBox.activeChat && this._componenets.chatBox.activeChat.id === this.activeChat.id) {
+ this._componenets.chatBox.scrollToEnd();
+ return;
+ }
+
+ // mark all messages as read and remove unread badge for selected chat
+ this.activeChat.elm.markAllAsRead();
+ // change the current chat of chatBox component
+ this._componenets.chatBox.setActiveChat(this.activeChat);
+
+ // send all messages of target chat to render in chatBox
+ chatMessaged.map(msg => {
+ this._componenets.chatBox.renderMessage(msg)
+ })
+ }
+
+ /**
+ * this method fire when a new message from signed in user sent to a chat
+ * @param detail
+ * @private
+ */
+ _onAuthedUserNewMessages({detail}) {
+ // add sender property to message and
+ // push it to the messages pool
+ this._messages.push({...detail, sender: this.authedUser.id})
+ }
+
+ /**
+ * fires when back btn clicked in chat-box
+ * @private
+ */
+ _onChatBoxBack() {
+ this._componenets.chatsList.emit(APP_EVENTS.DESELECT_SELECTED_CHAT);
+ }
+
+ /**
+ * send chats to chatList
+ */
+ sendChatsToList() {
+ if (!this._chats)
+ return;
+
+ this._componenets.chatsList.setChats(this._chats)
+ }
+
+ /**
+ * use this method to add new chat to whole app
+ * @param chat
+ */
+ addChat(chat) {
+ // check the validity of chat object
+ this.assert(chat && chat.id, `Invalid chat object.`);
+
+ // update chats array
+ this._chats.push(chat);
+
+ this.sendChatsToList();
+ }
+
+ /**
+ * to check condition and fire event if its false
+ * @param condition
+ * @param error
+ */
+ assert(condition, error) {
+ if (!condition)
+ throw new Error(`${error}`)
+ }
+}
diff --git a/Chat Application/scripts/data-factory.js b/Chat Application/scripts/data-factory.js
new file mode 100644
index 0000000..2f35423
--- /dev/null
+++ b/Chat Application/scripts/data-factory.js
@@ -0,0 +1,75 @@
+// generate random date
+function randomDate() {
+ const start = 1585008324467;
+ const end = new Date().getTime();
+
+ let date = new Date(+start + Math.random() * (end - start));
+ let hour = randomNumber(24, 1);
+ date.setHours(hour);
+ return date;
+}
+
+// generate random number in range
+function randomNumber(max, min = 0) {
+ return Math.floor(Math.random() * (max - min) + min);
+}
+
+// generate chat object
+function chatGenerator(index) {
+ const names = ["Mario Speedwagon", "Petey Cruiser", "Anna Sthesia", "Paul Molive", "Anna Mull", "Gail Forcewind", "Paige Turner", "Bob Frapples", "Walter Melon", "Nick R. Bocker", "Barb Ackue", "Buck Kinnear", "Greta Life", "Ira Membrit", "Shonda Leer", "Brock Lee", "Maya Didas", "Rick O'Shea", "Pete Sariya", "Monty Carlo", "Sal Monella", "Sue Vaneer", "Cliff Hanger", "Barb Dwyer", "Terry Aki", "Cory Ander", "Robin Banks", "Jimmy Changa", "Barry Wine", "Wilma Mumduya", "Buster Hyman", "Poppa Cherry", "Zack Lee", "Don Stairs", "Saul T. Balls", "Peter Pants", "Hal Appeno", "Otto Matic", "Moe Fugga", "Graham Cracker", "Tom Foolery", "Al Dente", "Bud Wiser", "Polly Tech", "Holly Graham", "Frank N. Stein", "Cam L. Toe", "Pat Agonia", "Tara Zona", "Barry Cade"]
+ const name = names[index];
+ let lastseen = randomDate().toLocaleDateString().replace(/\//g, ".");
+ if (index % 3 === 0)
+ lastseen = "Today";
+ if (index % 4 === 0)
+ lastseen = "Yesterday";
+
+ return {
+ id: Math.random().toString(32).substr(2, 10),
+ name,
+ username: name.replace(/[^a-zA-Z]/g, '').toLowerCase().substr(0, 8),
+ online: Math.random() > .7,
+ lastseen,
+ unreadcount: "0",
+ avatar: `https://randomuser.me/api/portraits/${index % 3 ? "women" : "men"}/${index + 1}.jpg`,
+ }
+}
+
+// generate random sentences for messages
+function getRandomText(sub = false) {
+ // sub-string a long paragraph.
+ if (sub) {
+ const lorem = `If the family member doesn’t need hospitalization and can be cared for at home, you should help him or her with basic needs and monitor the symptoms, while also keeping as much distance as possible, according to guidelines issued by the C.D.C. If there’s space, the sick family member should stay in a separate room and use a separate bathroom. If masks are available, both the sick person and the caregiver should wear them when the caregiver enters the room. Make sure not to share any dishes or other household items and to regularly clean surfaces like counters, doorknobs, toilets and tables. Don’t forget to wash your hands frequently.`;
+ const i1 = randomNumber(lorem.length, 6);
+ const i2 = randomNumber(lorem.length, 6);
+ const start = Math.min(i1, i2);
+ const end = Math.min(i2, i1);
+ return lorem.substr(start, end)
+ }
+
+ // make a sentences of random words
+ let verbs, nouns, adjectives, adverbs, preposition;
+ nouns = ["bird", "clock", "boy", "plastic", "duck", "teacher", "old lady", "professor", "hamster", "dog",
+ "area", "book", "business", "case", "child", "company", "country", "day", "eye",
+ "fact", "family", "government", "group", "hand", "home", "job", "life", "lot"];
+ verbs = ["kicked", "ran", "flew", "dodged", "sliced", "rolled", "died", "breathed", "slept", "killed",
+ "ask", "be", "become", "begin", "call", "can", "come", "could", "do",
+ "feel", "find", "get", "give", "go", "have", "hear", "help", "keep", "know",];
+ adjectives = ["beautiful", "lazy", "professional", "lovely", "dumb", "rough", "soft", "hot", "vibrating", "slimy", "important",
+ "able", "bad", "best", "better", "big", "black", "certain", "clear", "different", "early",
+ "easy", "economic", "federal", "free", "full", "good", "great", "hard", "high", "human"];
+ adverbs = ["slowly", "elegantly", "precisely", "quickly", "sadly", "humbly", "proudly", "shockingly", "calmly", "passionately"];
+ preposition = ["down", "into", "up", "on", "upon", "below", "above", "through", "across", "towards"];
+
+
+ var rand1 = Math.floor(Math.random() * 10);
+ var rand2 = Math.floor(Math.random() * 10);
+ var rand3 = Math.floor(Math.random() * 30);
+ var rand4 = Math.floor(Math.random() * 30);
+ var rand5 = Math.floor(Math.random() * 30);
+ var rand6 = Math.floor(Math.random() * 30);
+ return "The " + adjectives[rand1] + " " + nouns[rand2] + " " + adverbs[rand1] + " " + verbs[rand4] + " because some " + nouns[rand1]
+ + " " + adverbs[rand2] + " " + verbs[rand1] + " " + preposition[rand1] + " a " + adjectives[rand2] + " " + nouns[rand5]
+ + " which, became a " + adjectives[rand3] + ", " + adjectives[rand4] + " " + nouns[rand6] + ".";
+}
+
diff --git a/Chat Application/scripts/index.js b/Chat Application/scripts/index.js
new file mode 100644
index 0000000..28304e0
--- /dev/null
+++ b/Chat Application/scripts/index.js
@@ -0,0 +1,55 @@
+const numberOfChats = 10;
+let fakeChats = [];
+// generate an array of fake chats to show in app
+for (let i = 1; i < numberOfChats; i++) {
+ fakeChats.push(chatGenerator(i))
+}
+
+// this is the signed-in user object
+const authedUser = {
+ id: '12',
+ name: "Behnam Azimi",
+ username: "bhnmzm",
+ online: true,
+ lastSeen: "Today",
+ avatar: "https://randomuser.me/api/portraits/men/1.jpg"
+};
+
+// create instance of ChatApp,
+// this is the line that run application
+const app = new ChatApp("chat-web-app");
+app.signin(authedUser);
+
+// add all generated chats to app one-by-one
+fakeChats.map(fc => app.addChat(fc));
+
+
+// below code is just for simulating message receive
+// here we send 100 messages in different times ro app
+let fakeMsgCounter = 100;
+const interval = setInterval(() => {
+
+ if (--fakeMsgCounter === 0) {
+ clearInterval(interval);
+ return;
+ }
+
+ setTimeout(() => {
+ const fakeSender = fakeChats[randomNumber(numberOfChats, 1)];
+ if (!fakeSender)
+ return;
+
+ // flag with a 20% probability
+ const randomFlag = Math.random() > .8;
+
+ app.newMessage({
+ text: getRandomText(Math.random() > .5),
+ sender: randomFlag ? authedUser.id : fakeSender.id,
+ time: new Date(),
+ toChat: randomFlag ? fakeSender.id : authedUser.id
+ });
+
+ // new message sending time can be dynamic, between 1s and 5s
+ }, randomNumber(1000, 5000))
+
+}, 1500);
diff --git a/Chat Application/scripts/recorder.js b/Chat Application/scripts/recorder.js
new file mode 100644
index 0000000..bcff52f
--- /dev/null
+++ b/Chat Application/scripts/recorder.js
@@ -0,0 +1,162 @@
+/**
+ * this class control the recording functionality.
+ * it's enough to create an instance of this and call start()
+ * to start recording and stop() to put the end to the recording.
+ */
+class Recorder {
+
+ constructor() {
+ this._recorder = null;
+ this._audioChunks = [];
+
+ this.init();
+ }
+
+ /**
+ * initial the recorder and create a new instance of MediaRecorder.
+ */
+ init() {
+ navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia;
+ if (navigator.getUserMedia) {
+ navigator.getUserMedia({audio: true}, (stream) => {
+
+ this._recorder = new MediaRecorder(stream);
+
+ // we need to listen for data available for the recorder and update the audio chunk
+ this._recorder.addEventListener("dataavailable", (e) => {
+ this._audioChunks.push(e.data)
+ });
+
+ }, () => {
+ throw new Error("Use Media not found.")
+ });
+ } else {
+ throw new Error("Use Media not found.")
+ }
+ }
+
+ /**
+ * call start method of recorder
+ */
+ start() {
+ if (!this._recorder)
+ return;
+
+ this._audioChunks = [];
+ this._recorder.start();
+ }
+
+ /**
+ * call the stop method of recorder and generate the audio object and resolve it
+ * @returns {Promise}
+ */
+ stop() {
+ return new Promise((resolve) => {
+
+ // to create audio, we should listen for stop event of recorder
+ this._recorder.addEventListener("stop", async () => {
+
+ // to create the audio, we should make its Blob first
+ // and then create a object URL for it and pass it to the Audio API
+ const audioBlob = new Blob(this._audioChunks);
+ const audioUrl = URL.createObjectURL(audioBlob);
+ this._audio = new Audio(audioUrl);
+
+ // calc the duration of audio
+ const duration = await this.findDuration(audioBlob);
+
+ resolve({audio: this._audio, duration, audioUrl})
+ });
+
+ // stop the recording
+ this._recorder.stop();
+ })
+ }
+
+ /**
+ * find duration of recorded audio
+ * @param blob
+ * @returns {Promise}
+ */
+ findDuration(blob) {
+ return new Promise((resolve) => {
+ const file = new File([blob], "audio.mp3");
+ let reader = new FileReader();
+ reader.onload = (e) => {
+ let audioContext = new (window.AudioContext || window.webkitAudioContext)();
+
+ // Asynchronously decode audio file data contained in an ArrayBuffer.
+ audioContext.decodeAudioData(e.target.result, function (buffer) {
+ let floatDuration = buffer.duration;
+
+ let dMin = Math.floor(floatDuration / 60);
+ let dSec = Math.floor(floatDuration % 60);
+
+ if (dMin < 10)
+ dMin = "0" + dMin;
+
+ if (dSec < 10)
+ dSec = "0" + dSec;
+
+ resolve(`${dMin}:${dSec}`)
+ });
+ };
+
+ reader.readAsArrayBuffer(file);
+ })
+ }
+
+ /**
+ * getter for audio objec
+ * @returns {HTMLAudioElement}
+ */
+ get audio() {
+ return this._audio;
+ }
+
+ /**
+ * check if the audio device is available
+ * @returns {boolean}
+ */
+ static isMicAvailable() {
+ let isAvailable = true;
+ navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia;
+ if (navigator.getUserMedia) {
+ navigator.getUserMedia({audio: true}, (stream) => {
+ isAvailable = true;
+ }, () => {
+ isAvailable = false;
+ });
+ }
+
+ return isAvailable;
+ }
+
+ /**
+ * Convert numbers in second to time string like 00:00
+ *
+ * @param seconds
+ * @returns {string}
+ */
+ static secToTimeStr(seconds) {
+ let timeInHour = Math.floor(seconds / 3600);
+ let timeInMin = Math.floor((seconds % 3600) / 60);
+ let timeInSec = Math.floor(seconds % 60);
+
+ if (timeInHour < 10)
+ timeInHour = `0${timeInHour}`;
+
+ if (timeInMin < 10)
+ timeInMin = `0${timeInMin}`;
+
+ if (timeInSec < 10)
+ timeInSec = `0${timeInSec}`;
+
+ let timeStr = `${timeInMin}:${timeInSec}`;
+ if (parseInt(timeInHour))
+ timeStr = `${timeInHour}:${timeStr}`;
+
+ return timeStr;
+ }
+
+}
diff --git a/Chat Application/static/chat-box-bg.png b/Chat Application/static/chat-box-bg.png
new file mode 100644
index 0000000000000000000000000000000000000000..a5eeab1e62184b8520247331dc532323a4069887
GIT binary patch
literal 111249
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
+