Skip to content
Permalink
Branch: master
Find file Copy path
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
826 lines (812 sloc) 34.2 KB
<html>
<head>
<!-- Custom CSS -->
<link href="../css/app/sidebox/applozic.combined.min.css"
rel="stylesheet">
<link href="../css/app/sidebox/applozic.sidebox.css" rel="stylesheet">
<link href="../css/app/sidebox/viewer.css" rel="stylesheet">
<!-- Custom JS -->
<!-- Your jquery -->
<!-- <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>-->
<script type="text/javascript">
var $original;
if (typeof jQuery !== 'undefined') {
$original = jQuery.noConflict(true);
$ = $original;
jQuery = $original;
}
</script>
<script src="../js/jquery.min.js"></script>
</head>
<body>
<div id="mck-side-panel">
<div id="mck-sidebox" class="mck-sidebox mck-box mck-fade">
<div class="mck-box-dialog mck-box-sm mck-right mck-bg-white">
<div id="mck-sidebox-content"
class="mck-sidebox-content mck-box-content">
<div id="mck-conversation-header"
class="mck-conversation-header mck-truncate n-vis"></div>
<div class="mck-box-top">
<div class="blk-lg-10">
<div id="mck-tab-individual" class="mck-row n-vis">
<div class="mck-tab-link blk-lg-2">
<a href="#" target="_self" role="link" class="mck-conversation-tab-link"><span
class="mck-icon-backward"></span></a>
</div>
<div class="blk-lg-6 mck-box-title">
<div id="mck-tab-title" class="mck-tab-title mck-truncate">
Conversations</div>
<div id="mck-tab-status"
class="mck-tab-status mck-truncate n-vis"></div>
<div class="mck-typing-box mck-truncate n-vis">
<span id="mck-typing-label">typing...</span>
</div>
</div>
<div id="mck-btn-video-call" class="mck-videocall-btn blk-lg-2 n-vis"></div>
</div>
<div id="mck-tab-conversation" class="mck-row">
<h4 id="mck-conversation-title"
class="mck-box-title mck-truncate">Conversations</h4>
</div>
</div>
<div class="blk-lg-2">
<button type="button"
class="mck-minimize-icon mck-box-close mck-close icon n-vis">
<span aria-hidden="true">&minus;</span>
</button>
<button type="button"
class="mck-box-close mck-close-sidebox move-right"
data-dismiss="mckbox" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
</div>
<div id="mck-product-group"
class="mck-tab-panel mck-btn-group mck-product-group">
<div id="mck-product-box"
class="mck-product-box n-vis mck-dropdown-toggle"
data-toggle="mckdropdown" aria-expanded="true">
<div class="mck-row">
<div class="blk-lg-10">
<div class="mck-row">
<div class="blk-lg-3 mck-product-icon"></div>
<div class="blk-lg-9">
<div class="mck-row">
<div class="blk-lg-8 mck-product-title mck-truncate"></div>
<div
class="move-right mck-product-rt-up mck-truncate blk-lg-4">
<strong class="mck-product-key"></strong><span
class="mck-product-value"></span>
</div>
</div>
<div class="mck-row">
<div class="blk-lg-8 mck-truncate mck-product-subtitle"></div>
<div
class="move-right mck-product-rt-down mck-truncate blk-lg-4">
<strong class="mck-product-key"></strong><span
class="mck-product-value"></span>
</div>
</div>
</div>
</div>
</div>
<div class="blk-lg-2">
<span class="mck-caret n-vis"></span>
</div>
</div>
</div>
<ul id="mck-conversation-list"
class="mck-dropdown-menu menu-right mck-conversation-list n-vis"
role="menu"></ul>
</div>
<div id="mck-tab-option-panel"
class="mck-tab-panel mck-top-btn-panel">
<div id="mck-tab-menu-box" class="mck-tab-menu-box vis">
<div class="mck-row">
<div class="blk-lg-2 move-right">
<div class="mck-dropdown-toggle" data-toggle="mckdropdown"
aria-expanded="true">
<img
src="../images/mck-icon-menu.png"
alt="Tab Menu">
</div>
<ul id="mck-tab-menu-list"
class="mck-dropdown-menu mck-tab-menu-box menu-right"
role="menu">
<li class="mck-tab-message-option"><a href="#" target="_self"
id="mck-btn-clear-messages"
class="mck-btn-clear-messages menu-item"
title="Clear Messages"> Clear Messages </a></li>
<li id="li-mck-block-user"><a href="#" target="_self"
id="mck-block-button" class="menu-item" title="Block User">
Block User </a></li>
<li id="li-mck-group-info" class="mck-group-menu-options">
<a href="#" target="_self" id="mck-group-info-btn" class="menu-item"
title="Group Info"> Group Info </a>
</li>
<li id="li-mck-leave-group" class="mck-group-menu-options">
<a href="#" target="_self" id="mck-btn-leave-group" class="menu-item"
title="Exit Group"> Exit Group </a>
</li>
<!-- <li id="li-mck-video-call">
<a href="#" target="_self" id="mck-btn-video-call" class="menu-item n-vis" title="Video Call">Video Call</a>
</li> -->
</ul>
</div>
</div>
</div>
</div>
<div class="mck-box-body">
<div id="mck-video-call-indicator" class="applozic-launchar n-vis row">
<div id="mck-video-call-icon" class="col-lg-3 mck-alpha-contact-image">
<span class="mck-contact-icon"></span>
</div>
<div id="mck-vid-btn" class="mck-vid-flex-box">
<div id="mck-video-call-indicator-txt" class="mck-video-call-indicator-txt"></div>
<div id="mck-call-btn-div" class= "col-lg-8">
<button id="mck-vid-receive-btn" class="mck-btn">Accept</button>
<button id="mck-vid-reject-btn" class="mck-btn">Reject</button>
</div>
</div>
</div>
<div id="mck-message-cell" class="mck-tab-cell mck-message-cell">
<div id="mck-price-widget"
class="mck-row mck-price-widget mck-top-widget n-vis">
<div class="mck-widget-panel">
<input type="text" id="mck-price-text-box"
placeholder="Enter final agreed price">
<button type="button" id="mck-price-submit"
class="mck-btn mck-btn-green mck-price-submit" title="Submit">
<span>Submit</span>
</button>
</div>
</div>
<div class="mck-message-inner"></div>
<div id="mck-contact-loading" class="mck-loading">
<img src="../images/ring.gif"
alt="Loading" />
</div>
<div id="mck-no-conversations"
class="mck-no-data-text mck-text-muted n-vis">
<h3>No conversations yet!</h3>
</div>
<div id="mck-no-messages"
class="mck-no-data-text mck-text-muted n-vis">
<h3>No messages yet!</h3>
</div>
<div id="mck-no-more-conversations"
class="mck-show-more-icon n-vis">
<h3>No more conversations!</h3>
</div>
<div id="mck-no-more-messages" class="mck-show-more-icon n-vis">
<h3>No more messages!</h3>
</div>
</div>
</div>
<div id="mck-offline-message-box"
class="mck-offline-message-box n-vis">SET DEFAULT OFFLINE
MESSAGE!</div>
<div id="mck-sidebox-ft" class="mck-box-ft">
<div class="mck-box-form mck-row n-vis">
<div class="blk-lg-12">
<p id="mck-msg-error" class="mck-sidebox-error n-vis"></p>
</div>
<div id="mck-msg-response"
class="blk-lg-12 mck-box-response n-vis">
<div id="mck-response-text" class="response-text"></div>
</div>
<div class="blk-lg-12">
<form id="mck-msg-form" class="vertical mck-msg-form">
<div class="mck-form-group n-vis">
<label class="sr-only placeholder-text control-label"
for="mck-msg-to">To:</label> <input class="mck-form-cntrl"
id="mck-msg-to" name="mck-msg-to" placeholder="To" required>
</div>
<div id="mck-audio" class="mck-mic-timer n-vis">
<a href="#" target="_self" id="mck-stop-recording" class="mck-stop-btn n-vis "></a>
<label id="mck-minutes">00</label>:<label id="mck-seconds">00</label>
</div>
<div id="mck-reply-to-div" class="n-vis">
<button type="button" id="close"
class="mck-box-close mck-close-panel move-right">
<span aria-hidden="true">&times;</span>
</button>
<div id="mck-reply-to" class=" mck-msgto "></div>
<div id="mck-reply-msg"> </div>
</div>
<div class="mck-form-group last last-child">
<label class="sr-only placeholder-text control-label"
for="mck-textbox">Message</label>
<div id="mck-textbox-container" class="mck-textbox-container">
<div class="mck-blk-2 mck-text-box-panel move-left">
<div class="mck-blk-12">
<button type="button" id="mck-btn-smiley"
class="mck-btn mck-btn-smiley mck-btn-text-panel"
title="Smiley">
<span class="mck-icon-smiley-blue"></span>
</button>
</div>
</div>
<div
class="mck-blk-2 mck-text-box-panel mck-mid-panel move-left">
<div id="mck-attachmenu-box" class="mck-attach-menu">
<div id="mck-btn-attach"
class="mck-dropdown-toggle mck-btn-attach mck-file-attach-label mck-btn mck-btn-text-panel"
data-toggle="mckdropdown" aria-expanded="true"
title="Attach File">
<span class="mck-icon-upload"></span>
</div>
<ul id="mck-upload-menu-list"
class="mck-dropup-menu mck-upload-menu-list mck-menu-right"
role="menu">
<li><a id="mck-file-up" href="#" target="_self"
class="mck-file-upload menu-item"
title="File &amp; Photos"> <img
src="../images/mck-icon-photo.png"
class="menu-icon" alt="File &amp; Photos"><span
id="mck-file-up-label">Files &amp; Photos</span>
</a></li>
<li><a id="mck-btn-loc" href="#" target="_self"
class="menu-item mck-btn-loc" title="Share Location">
<div class="mck-menu-icon">
<span class="mck-icon-marker-blue"></span>
</div> <span id="mck-share-loc-label">Share Location</span>
</a></li>
</ul>
</div>
<div id="mck-attachfile-box" class="mck-blk-12 n-vis">
<button id="mck-file-up2" type="button"
class="mck-file-upload mck-file-attach-label mck-btn mck-btn-text-panel"
title="Attach File">
<span class="mck-icon-upload"></span>
</button>
</div>
</div>
<a href="#" target="_self" id="mck-mike-btn" type="button"
class="mck-mic-btn mck-mike-btn vis"
title="Mic"></a>
<div id="mck-text-box" contenteditable="true"
class="mck-blk-8 mck-text-box mck-text required"></div>
<div class="mck-blk-2 mck-text-box-panel move-right">
<div class="mck-blk-12">
<button type="submit" id="mck-msg-sbmt"
class="mck-btn mck-btn-text-panel" title="Send Message">
<span class="mck-icon-send"></span>
</button>
</div>
</div>
<input id="mck-file-input" class="mck-file-input n-vis"
type="file" name="files[]">
<div id="mck-file-box" class="n-vis"></div>
</div>
</div>
</form>
</div>
</div>
<div id="mck-contacts-content"
class="mck-contacts-content mck-text-center">
<button type="button" id="mck-msg-new"
class="mck-contact-search mck-btn mck-btn-blue"
title="Start New">
<span>Start New</span>
</button>
</div>
</div>
<div class="mck-running-on n-vis">
<a href="https://www.applozic.com" target="_blank"><span
class="n-vis">Applozic Chat SDK</span><strong>Powered by
Applozic</strong></a>
</div>
</div>
<div id="mck-sidebox-search"
class="mck-sidebox-search mck-sidebox-content mck-box-content n-vis">
<div class="mck-box-top">
<div class="mck-tab-link blk-lg-4">
<a href="#" target="_self" role="link" class="mck-conversation-tab-link"><span
class="mck-icon-backward"></span></a>
</div>
<div class="blk-lg-5">
<div class="mck-box-title mck-truncate" title="Start New">Start
New</div>
</div>
<div
class="blk-lg-3 move-right mck-start-new-menu-item mck-tab-menu-box">
<div class="mck-dropdown-toggle" data-toggle="mckdropdown"
aria-expanded="true">
<img src="../images/icon-menu.png"
alt="Tab Menu">
</div>
<ul id="mck-start-new-menu-list"
class="mck-dropdown-menu menu-right" role="menu">
<li><a href="#" target="_self" id="mck-new-group"
class="mck-new-group-button menu-item" title="Create Group">Create
Group</a></li>
</ul>
</div>
</div>
<div id="mck-search-tab-box" class="mck-search-tab-box mck-row">
<div class="blk-lg-12">
<ul class="mck-nav mck-nav-panel">
<li class="mck-nav-item mck-nav-divider"><a
id="mck-contact-search-tab"
class="mck-nav-link mck-contact-search active" href="#" target="_self"><strong>Contacts</strong></a></li>
<li class="mck-nav-item"><a id="mck-group-search-tab"
class="mck-nav-link mck-group-search" href="#" target="_self"><strong>Groups</strong></a>
</li>
</ul>
</div>
</div>
<div class="mck-box-top mck-search-box-top">
<div id="mck-contact-search-input-box"
class="mck-input-group blk-lg-12">
<input id="mck-contact-search-input" type="text"
data-provide="typeahead" placeholder="Search..."/> <span
class="mck-search-icon"><a href="#" target="_self" role="link"
class="mck-contact-search-link"><span
class="mck-icon-search"></span></a></span>
</div>
<div id="mck-group-search-input-box"
class="mck-input-group blk-lg-12 n-vis">
<input id="mck-group-search-input" type="text"
data-provide="typeahead" placeholder="Search..."/> <span
class="mck-search-icon"><a href="#" target="_self" role="link"
class="mck-group-search-link"><span class="mck-icon-search"></span></a></span>
</div>
</div>
<div class="mck-box-body">
<div id="mck-search-cell" class="mck-tab-cell">
<div class="mck-message-inner">
<ul id="mck-contact-search-list"
class="mck-contact-search-list mck-contact-list mck-nav mck-nav-tabs mck-nav-stacked"></ul>
<ul id="mck-group-search-list"
class="mck-contact-list mck-group-search-list mck-nav mck-nav-tabs mck-nav-stacked n-vis"></ul>
<div id="mck-no-search-groups"
class="mck-no-data-text mck-text-muted n-vis">No groups
yet!</div>
<div id="mck-no-search-contacts"
class="mck-no-data-text mck-text-mutedn n-vis">No
contacts yet!</div>
<div id="mck-search-loading" class="mck-loading n-vis">
<img src="../images/ring.gif"
alt="Loading" />
</div>
</div>
</div>
</div>
</div>
<div id="mck-group-create-tab"
class="mck-group-create-tab mck-sidebox-content mck-box-content n-vis">
<div class="mck-box-top">
<div class="mck-tab-link blk-lg-4">
<a id="mck-search-tab-link" href="#" target="_self" role="link"
class="mck-contact-search"><span class="mck-icon-backward"></span>
</a>
</div>
<div class="blk-lg-8">
<div class="mck-box-title mck-truncate" title="Create Group">Create
Group</div>
</div>
</div>
<div class="mck-box-body">
<div class="mck-tab-cell">
<div id="mck-group-create-panel"
class="mck-tab-panel mck-message-inner mck-group-create-inner">
<div class="mck-group-sub-sec">
<div id="mck-group-create-icon-box"
class="mck-group-create-icon-box mck-group-icon-box mck-hover-on">
<div class="mck-group-icon"></div>
<span class="mck-overlay-box">
<div class="mck-overlay">
<span class="mck-camera-icon"></span> <span
id="mck-gc-overlay-label" class="mck-overlay-label">Add
Group Icon</span>
</div>
<div id="mck-group-create-icon-loading"
class="mck-loading n-vis">
<img
src="../images/mck-loading.gif"
alt="Loading" />
</div> <input id="mck-group-icon-upload"
class="mck-group-icon-upload n-vis" type="file"
name="files[]">
</span>
</div>
</div>
<div id="mck-group-create-name-sec" class="mck-group-sub-sec">
<div id="mck-group-create-name-box"
class="mck-row mck-group-name-box">
<div class="blk-lg-12">
<div id="mck-gc-title-label" class="mck-label">Group
Title</div>
</div>
<div class="blk-lg-12">
<div id="mck-group-create-title"
class="mck-group-create-title mck-group-title"
contenteditable="true">Group title</div>
</div>
</div>
</div>
<div id="mck-group-create-type-sec" class="mck-group-sub-sec">
<div id="mck-group-create-type-box"
class="mck-row mck-group-type-box">
<div class="blk-lg-12">
<div id="mck-gc-type-label" class="mck-label">Group
Type</div>
</div>
<div class="blk-lg-12">
<select id="mck-group-create-type" class="mck-select">
</select>
</div>
</div>
</div>
<div id="mck-group-create-btn-sec" class="mck-group-sub-sec">
<button type="button" id="mck-btn-group-create"
class="mck-btn mck-btn-green mck-btn-group-create"
title="Create Group">Create Group</button>
</div>
</div>
</div>
</div>
</div>
<div id="mck-group-info-tab"
class="mck-group-info-tab mck-sidebox-content mck-box-content">
<div class="mck-box-top">
<div class="mck-tab-link blk-lg-4">
<a id="mck-group-back-link" href="#" target="_self" role="link"
class="mck-group-back-link"> <span class="mck-icon-backward"></span>
</a>
</div>
<div class="blk-lg-8">
<div class="mck-box-title mck-truncate" title="Group Info">Group
Info</div>
</div>
</div>
<div id="mck-group-info-panel"
class="mck-tab-panel mck-group-info-panel">
<div class="mck-group-icon-sec">
<div id="mck-group-info-icon-box"
class="mck-group-icon-box mck-group-info-icon-box mck-hover-on">
<div class="mck-group-icon"></div>
<span class="mck-overlay-box n-vis">
<div class="mck-overlay">
<span class="mck-camera-icon"></span> <span
id="mck-gi-overlay-label" class="mck-overlay-label">Change
Group Icon</span>
</div>
<div id="mck-group-info-icon-loading" class="mck-loading vis">
<img
src="../images/mck-loading.gif"
alt="Loading" />
</div> <input id="mck-group-icon-change"
class="mck-group-icon-change n-vis" type="file" name="file[]" />
</span>
</div>
<div class="mck-text-center">
<a id="mck-btn-group-icon-save" href="#" target="_self" role="link"
class="mck-btn-group-icon-save n-vis" title="Save"> <img
src="../images/mck-icon-save.png"
alt="Save">
</a>
</div>
</div>
<div id="mck-group-name-sec" class="mck-group-name-sec">
<div id="mck-group-name-box" class="mck-row mck-group-name-box">
<div class="blk-lg-9">
<div id="mck-group-title" class="mck-group-title"
contenteditable="false">Group title</div>
</div>
<div class="blk-lg-3 mck-group-name-edit-icon">
<a id="mck-group-name-edit" href="#" target="_self" role="link"
class="mck-group-name-edit vis" title="Edit"> <img
src="../images/mck-icon-write.png"
alt="Edit"></a> <a id="mck-group-name-save" href="#" target="_self"
role="link" class="mck-group-name-save n-vis" title="Save">
<img
src="../images/mck-icon-save.png"
alt="Save">
</a>
</div>
</div>
</div>
</div>
<div id="mck-group-member-panel"
class="mck-tab-panel mck-group-member-panel vis">
<div class="mck-group-md-sec">
<div id="mck-group-member-title"
class="mck-row mck-group-member-text">Members</div>
<div id="mck-group-add-member-box"
class="mck-row mck-group-admin-options mck-group-add-member-box n-vis">
<a id="mck-group-add-member" class="mck-group-add-member"
href="#" target="_self">
<div class="blk-lg-3">
<img
src="../images/mck-icon-add-member.png"
alt="Add Member">
</div>
<div class="blk-lg-9">Add Member</div>
</a>
</div>
</div>
</div>
<div class="mck-box-body">
<div class="mck-tab-cell">
<div class="mck-group-member-inner">
<ul id="mck-group-member-list"
class="mck-group-member-list mck-contact-list mck-nav mck-nav-tabs mck-nav-stacked">
</ul>
</div>
</div>
</div>
<div id="mck-group-update-panel"
class="mck-tab-panel mck-group-update-panel n-vis">
<div class="mck-group-bottom-sec">
<div class="mck-row mck-group-update-sec">
<button type="button" id="mck-btn-group-update"
class="mck-btn mck-btn-green mck-btn-group-update"
title="Update">Update</button>
</div>
</div>
</div>
<div id="mck-group-info-ft" class="mck-group-info-ft">
<button type="button" id="mck-btn-group-exit"
class="mck-btn mck-btn-blue mck-btn-group-exit"
title="Exit Group">Exit Group</button>
</div>
</div>
</div>
</div>
</div>
<div id="mck-loc-box" class="mck-box mck-loc-box mck-fade"
aria-hidden="false">
<div class="mck-box-dialog mck-box-md">
<div class="mck-box-content">
<div class="mck-box-top mck-row">
<div class="blk-lg-10">
<h4 class="mck-box-title">Share Location</h4>
</div>
<div class="blk-lg-2">
<button type="button" class="mck-box-close" data-dismiss="mckbox"
aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
</div>
<div class="mck-box-body">
<div class="mck-form-group">
<div class="blk-lg-12">
<input id="mck-loc-address" type="text" class="mck-form-control"
placeholder="Enter a location" autocomplete="off">
</div>
</div>
<div id="mck-map-content" class="mck-loc-content"></div>
<div class="n-vis">
<label class="blk-sm-2 mck-control-label">Lat.:</label>
<div class="blk-sm-3">
<input type="text" id="mck-loc-lat" class="mck-form-control">
</div>
<label class="blk-sm-2 mck-control-label">Long.:</label>
<div class="blk-sm-3">
<input type="text" id="mck-loc-lon" class="mck-form-control">
</div>
</div>
</div>
<div class="mck-box-footer">
<button id="mck-my-loc" type="button"
class="mck-my-loc mck-btn mck-btn-green">My Location</button>
<button id="mck-loc-submit" type="button"
class="mck-btn mck-btn-blue mck-loc-submit move-right">Send</button>
<button id="mck-btn-close-loc-box" type="button"
class="mck-btn mck-btn-default move-right" data-dismiss="mckbox">Close</button>
</div>
</div>
</div>
</div>
<div id="mck-gm-search-box" class="mck-box mck-gm-search-box mck-fade"
aria-hidden="false">
<div class="mck-box-dialog mck-box-sm">
<div class="mck-box-content">
<div class="mck-box-top mck-row">
<div class="blk-lg-3">
<img
src="../images/mck-icon-add-member.png"
alt="Add Member">
</div>
<div class="blk-lg-7">
<h4 class="mck-box-title">Add Member</h4>
</div>
<div class="blk-lg-2">
<button type="button" class="mck-box-close" data-dismiss="mckbox"
aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
</div>
<div class="mck-box-body">
<div class="mck-form-group">
<div class="mck-input-group blk-lg-12">
<input id="mck-group-member-search" type="text"
data-provide="typeahead" placeholder="Search..."/> <span
class="mck-search-icon"><a href="#" target="_self" role="link"
class="mck-group-member-search-link"><span
class="mck-icon-search"></span></a></span>
</div>
</div>
<div class="mck-tab-cell">
<div class="mck-message-inner">
<ul id="mck-group-member-search-list"
class=" mck-contact-list mck-group-member-search-list mck-nav mck-nav-tabs mck-nav-stacked"></ul>
<div id="mck-no-gsm-text"
class="mck-no-data-text mck-text-muted n-vis">No contacts
yet!</div>
</div>
<div id="mck-gms-loading" class="mck-loading n-vis">
<img src="../images/ring.gif"
alt="Loading" />
</div>
</div>
</div>
</div>
</div>
</div>
<div id="mck-video-box">
<div class="container applozic-vid-container n-vis">
<div class="row">
<div id="mck-vid-media" class="col-lg-12">
<div id="mck-audio-call-icon center-block"></div>
</div>
</div>
</div>
<div id="mck-vid-div-overlay" class="container applozic-vid-container n-vis">
<div class="row mck-vid-overlay-header">
<div id="mck-vid-icon" class="centered n-vis"><span></span></div>
</div>
<div class="row mck-vid-overlay-footer mck-flex-footer">
<div class="mck-vid-scr-controls">
<div class="footer-controls pull-right">
<button id="mck-microfone-mute-btn" class="btn-controls">
<svg id="mck-unmute-icon" class="mck-unmute-icon" focusable="false" height="24px" viewBox="0 0 24 24" width="24px" xmlns="http://www.w3.org/2000/svg">
<path d="M12 14c1.66 0 2.99-1.34 2.99-3L15 5c0-1.66-1.34-3-3-3S9 3.34 9 5v6c0 1.66 1.34 3 3 3zm5.3-3c0 3-2.54 5.1-5.3 5.1S6.7 14 6.7 11H5c0 3.41 2.72 6.23 6 6.72V21h2v-3.28c3.28-.48 6-3.3 6-6.72h-1.7z" />
</svg>
<svg id="mck-mute-icon" class="mck-mute-icon" focusable="false" height="24px" viewBox="0 0 24 24" width="24px" xmlns="http://www.w3.org/2000/svg">
<path d="M19 11h-1.7c0 .74-.16 1.43-.43 2.05l1.23 1.23c.56-.98.9-2.09.9-3.28zm-4.02.17c0-.06.02-.11.02-.17V5c0-1.66-1.34-3-3-3S9 3.34 9 5v.18l5.98 5.99zM4.27 3L3 4.27l6.01 6.01V11c0 1.66 1.33 3 2.99 3 .22 0 .44-.03.65-.08l1.66 1.66c-.71.33-1.5.52-2.31.52-2.76 0-5.3-2.1-5.3-5.1H5c0 3.41 2.72 6.23 6 6.72V21h2v-3.28c.91-.13 1.77-.45 2.54-.9L19.73 21 21 19.73 4.27 3z" />
</svg>
</button>
<button id="mck-vid-disconnect" class="btn-controls">
<svg class="mck-disconnect-icon" xmlns="http://www.w3.org/2000/svg" focusable="false" width="24px" height="24px" viewBox="0 0 24 24" class=" A1NRff">
<path d="M12 9c-1.6 0-3.15.25-4.6.72v3.1c0 .39-.23.74-.56.9-.98.49-1.87 1.12-2.66 1.85-.18.18-.43.28-.7.28-.28 0-.53-.11-.71-.29L.29 13.08c-.18-.17-.29-.42-.29-.7 0-.28.11-.53.29-.71C3.34 8.78 7.46 7 12 7s8.66 1.78 11.71 4.67c.18.18.29.43.29.71 0 .28-.11.53-.29.71l-2.48 2.48c-.18.18-.43.29-.71.29-.27 0-.52-.11-.7-.28-.79-.74-1.69-1.36-2.67-1.85-.33-.16-.56-.5-.56-.9v-3.1C15.15 9.25 13.6 9 12 9z"></path>
</svg>
</button>
</div>
</div>
<div id="local-media" class="n-vis"></div>
</div>
</div>
</div>
<!-- Video Call dependencies -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/howler/2.0.2/howler.min.js"></script>
<script type="text/javascript" src="../js/app/call/mck-ringtone-service.js"></script>
<script type="text/javascript" src="../js/twilio-video.js"></script>
<!-- Video Call dependencies -->
<script type="text/javascript" src="../js/viewer.js"></script>
<script type="text/javascript" src="../js/applozic.plugins.min.js"></script>
<script type="text/javascript" src="../js/applozic.widget.min.js"></script>
<script type="text/javascript" src="../js/applozic.emojis.min.js"></script>
<script type="text/javascript" src="https://maps.google.com/maps/api/js?key=AIzaSyDKfWHzu9X7Z2hByeW4RRFJrD9SizOzZt4&libraries=places"></script>
<script type="text/javascript" src="../js/locationpicker.jquery.min.js"></script>
<script type="text/javascript" src="../js/applozic.aes.js"></script>
<script type="text/javascript" src="../js/app/modules/applozic.jquery.js"></script>
<!-- remomve comment from below file to usey applozic.chat.min.js file from repository and comment out cdn file -->
<!-- <script type="text/javascript" src="../../applozic.chat.min.js"></script> -->
<script type="text/javascript" src="https://cdn.applozic.com/applozic/applozic.chat-5.5.2.min.js"></script>
<script type="text/javascript" src="../js/app/sidebox/applozic.sidebox.js"></script>
<script type="text/javascript">
var oModal = "";
if (typeof $original !== 'undefined') {
$ = $original;
jQuery = $original;
if (typeof $.fn.modal === 'function') {
oModal = $.fn.modal.noConflict();
}
} else {
$ = $applozic;
jQuery = $applozic;
if (typeof $applozic.fn.modal === 'function') {
oModal = $applozic.fn.modal.noConflict();
}
}
</script>
<script src="../js/Media/recorder.js"></script>
<script src="../js/Media/Fr.voice.js"></script>
<script src="../js/Media/app.js"></script>
<script type="text/javascript">
//var $applozic = jQuery.noConflict(true);
//Sample json contains display name and photoLink for userId
var contacts = {
"user1" : {
"displayName" : "Devashish",
"imageLink" : "https://www.applozic.com/resources/images/applozic_icon.png"
},
"user2" : {
"displayName" : "Adarsh",
"imageLink" : "https://www.applozic.com/resources/images/applozic_icon.png"
},
"user3" : {
"displayName" : "Shanki",
"imageLink" : "https://www.applozic.com/resources/images/applozic_icon.png"
}
};
function readMessage() {
//console.log(userId);
}
//Callback Function to return display name by userId
function displayName(userId) {
//Todo: replace this with users display name
var contact = contacts[userId]; // contacts sample given above
if (typeof contact !== 'undefined') {
return contact.displayName;
}
}
//Callback Function to return contact image url by userId
function contactImageSrc(userId) {
var contact = contacts[userId]; // contacts sample given above
if (typeof contact !== 'undefined') {
return contact.imageLink;
}
}
//callback function execute after plugin initialize.
function onInitialize(status,data) {
if (status === 'success') {
//write your logic exectute after plugin initialize.
} else if (typeof response === 'object' && response.status === 'error') {
alert(response.errorMessage);
}
}
$(document)
.ready(
function() {
//Function to initialize plugin
$applozic.fn
.applozic({
baseUrl:'https://apps.applozic.com',
userId : 'debug4', //TODO: replace with actual userId
userName : 'debug4', //TODO: replace with actual userName
appId : 'applozic-sample-app', //TODO: replace with actual appId
accessToken: 'debug4', //TODO: replace with actual Access token
ojq : $original,
obsm : oModal,
customFileUrl:'https://googleupload.applozic.com', //optional, google cloud file upload url
genereateCloudFileUrl: "https://googleupload.applozic.com/files/url?key={key}", //optional, generate viewable link for a file incase of file upload on google cloud
notificationIconLink : "https://www.applozic.com/resources/images/applozic_icon.png",
notificationSoundLink : "../audio/notification_tone.mp3",
authenticationTypeId: 1, //1 for password verification from Applozic server and 0 for access Token verification from your server
readConversation : readMessage, // readMessage function defined above
contactDisplayName : displayName, // displayName function defined above
contactDisplayImage : contactImageSrc, // contactImageSrc function defined above
onInit : onInitialize, //callback function execute on plugin initialize
maxAttachmentSize : 25, //max attachment size in MB
desktopNotification : true,
locShare : true,
olStatus: true,
// awsS3Server :true,
// emojilibrary: true, // true if you want to load emoticons in chat
fileupload : "googleServer", // awsS3Server or googleCloud or googleServer or customStorage,
onTopicDetails: function(topic) { console.log(topic); },
googleApiKey : "AIzaSyDKfWHzu9X7Z2hByeW4RRFJrD9SizOzZt4",
// video: true,
topicBox: true
// disableSelfChat:true
/* groupUserCount: false,
defaultMessageMetaData: {'eventId' : '123'},
openGroupSettings: {
'disableChatForNonGroupMember' :true,
'allowAccessGroupMembers' : true,
'defaultChatDisabledMessage': 'Write display message!'
} */
});
// var contactjson = {"contacts": [{"userId": "user1", "displayName": "Devashish", "imageLink": "https://www.applozic.com/resources/images/applozic_icon.png"}, {"userId": "user2", "displayName": "Adarsh", "imageLink": "https://www.applozic.com/resources/images/applozic_icon.png"}, {"userId": "user3", "displayName": "Shanki", "imageLink": "https://www.applozic.com/resources/images/applozic_icon.png"}]};
// To load contact list use below function and pass contacts json in format shown above in variable 'contactjson'.
// $applozic.fn.applozic('loadContacts', contactjson);
});
</script>
</body>
</html>
You can’t perform that action at this time.