Verify privKey of groupID when creating new group Names and Messages are now added in textContent instead of innerHTML to prevent HTML injection Both direct message and group message use the same IDB objectStore Converted send message input to textarea : now users can send multi-line messages Minor UI changes and fixes Improved Enter Key Press : Shift+Enter key will now insert a new line (Enter key pressed without shift key will send message as before) Enter key event to send message will now tigger on keydown instead of keyup
136 lines
4.8 KiB
HTML
136 lines
4.8 KiB
HTML
<html lang="en">
|
|
|
|
<head>
|
|
<title>FLO Whatsapp</title>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
|
|
<link rel="stylesheet" href="styles.css">
|
|
<!-- Font Awesome File -->
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
|
|
|
|
<script type="text/javascript" src="init.js"></script>
|
|
<script type="text/javascript" src="kBucket.js"></script>
|
|
<script type="text/javascript" src="app.js"></script>
|
|
|
|
</head>
|
|
|
|
<body onload="userDataStartUp();">
|
|
|
|
<div id="overlay">
|
|
<div class="userChecklist-container">
|
|
<input type="text" class="grpName form-control" placeholder="Group Name">
|
|
<div class="row searchBox">
|
|
<div class="col-sm-12 searchBox-inner">
|
|
<div class="form-group has-feedback">
|
|
<input id="searchList" type="text" class="form-control" placeholder="Search">
|
|
<span class="glyphicon glyphicon-search form-control-feedback"></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="userChecklist"></div>
|
|
<button class="ok btn btn-success">Ok</button>
|
|
<button class="cancel btn btn-default">Cancel</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="container app">
|
|
<div class="row app-one">
|
|
|
|
<div class="col-sm-4 side">
|
|
<div class="side-one">
|
|
<!-- Heading -->
|
|
<div class="row heading">
|
|
<span class="name-meta"><b>FLO Whatsapp </b> </span>
|
|
<!--
|
|
<div class="col-sm-1 col-xs-1 heading-icon pull-right">
|
|
<i class="fa fa-ellipsis-v fa-2x pull-right" aria-hidden="true" onclick="min();"></i>
|
|
</div>
|
|
|
|
-->
|
|
<div class="col-sm-2 col-xs-2 heading-icon pull-right">
|
|
<i class="fa fa-comments fa-2x pull-right" aria-hidden="true" onclick="createGroup();"></i>
|
|
</div>
|
|
<br />
|
|
<span class="name-meta"><i>created by Ranchimall</i></span>
|
|
</div>
|
|
|
|
<!-- Heading End -->
|
|
|
|
<!-- SearchBox -->
|
|
<div class="row searchBox">
|
|
<div class="col-sm-12 searchBox-inner">
|
|
<div class="form-group has-feedback">
|
|
<input id="searchContact" type="text" class="form-control" placeholder="Search Contact/Group">
|
|
<span class="glyphicon glyphicon-search form-control-feedback"></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Search Box End -->
|
|
<!-- sideBar -->
|
|
<div class="row sideBar" id="contact-display"></div>
|
|
<!-- Sidebar End -->
|
|
</div>
|
|
<!-- Sidebar End -->
|
|
</div>
|
|
<!-- New Message Sidebar End -->
|
|
|
|
<!-- Conversation Start -->
|
|
<div class="col-sm-8 conversation">
|
|
<!-- Heading -->
|
|
<div class="row heading">
|
|
<div class="col-sm-8 col-xs-8 heading-name">
|
|
<span class="heading-name-meta"><span id="recipient-status">O</span>
|
|
<span id="recipient-floID">Select Contact</span>
|
|
</span>
|
|
</div>
|
|
<div class="col-sm-1 col-xs-1 heading-icon pull-right dropdown" id="groupOptions">
|
|
<i class="fa fa-ellipsis-v fa-2x pull-right" aria-hidden="true"></i>
|
|
<div class="dropdown-content">
|
|
<li onclick="addGroupMembers()">Add Members</li>
|
|
<li onclick="rmGroupMembers()">Remove Members</li>
|
|
<li onclick="addGroupAdmins()">Add Admins</li>
|
|
<li onclick="rmGroupAdmins()">Remove Admins</li>
|
|
<li onclick="deleteGroup()">Delete Group</li>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Heading End -->
|
|
|
|
<!-- Message Box -->
|
|
<div class="row message" id="conversation">
|
|
</div>
|
|
<!-- Message Box End -->
|
|
|
|
<!-- Reply Box -->
|
|
<div class="row reply">
|
|
<!--
|
|
<div class="col-sm-1 col-xs-1 reply-icon">
|
|
<i class="fa fa-smile-o fa-2x"></i>
|
|
</div>
|
|
-->
|
|
<div class="col-sm-9 col-xs-9 reply-main">
|
|
<textarea class="form-control" rows="1" id="sendMsgInput" placeholder="Type message"
|
|
autocomplete="off"></textarea>
|
|
</div>
|
|
<!--
|
|
<div class="col-sm-1 col-xs-1 reply-icon">
|
|
<i class="fa fa-microphone fa-2x" aria-hidden="true"></i>
|
|
</div>
|
|
-->
|
|
<div class="col-sm-1 col-xs-1 reply-icon" onclick="sendMsg()">
|
|
<i class="fa fa-send fa-2x" aria-hidden="true"></i>
|
|
</div>
|
|
</div>
|
|
<!-- Reply Box End -->
|
|
</div>
|
|
<!-- Conversation End -->
|
|
</div>
|
|
<!-- App One End -->
|
|
</div>
|
|
|
|
<!-- App End -->
|
|
</body>
|
|
|
|
</html> |