This commit is contained in:
Piyush मिश्रः 2021-05-10 20:27:34 +05:30
parent 65ecc030b8
commit 46eced24ce
6 changed files with 64 additions and 50 deletions

View File

@ -6,36 +6,6 @@
src: url("../img/Itim-Regular.ttf");
}
:root {
--bg-color: #ffffff;
--bg-secondary-color: #f3f3f6;
--bg-tertiary-color: #cacad8;
--color-primary: #14854F;
--color-lightGrey: #d2d6dd;
--color-border: #d2d6dd;
--color-grey: #747681;
--color-darkGrey: #3f4144;
--color-error: #d43939;
--color-success: #28bd14;
--grid-maxWidth: 120rem;
--grid-gutter: 2rem;
--font-size: 1.8rem;
--font-color: #333333;
--font-family-sans: "Itim";
--font-family-mono: monaco, "Consolas", "Lucida Console", monospace;
--msg-other-bg-color : rgb(97, 182, 238);
--msg-me-bg-color : rgb(92, 175, 148);
--msg-reply-bg-color : rgb(209, 215, 219);
--msg-other-border-color : rgb(62, 127, 212);
--msg-me-border-color : rgb(64, 148, 116);
--msg-reply-border-color : rgb(94, 100, 105);
--msg-other-border-sel-color : rgb(58, 90, 139);
--msg-me-border-sel-color : rgb(48, 105, 86);
--svg-filter: none;
}
* {
scrollbar-width: auto;
}
@ -262,9 +232,7 @@ input {
}
.clip-win.selected-clip {
width: fit-content;
min-width: 250px;
height: fit-content;
left: 50%;
transform: translateX(-50%);
border-radius: 15px;

View File

@ -4,10 +4,43 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="css/style.css">
<style>
:root {
--bg-color: #ffffff;
--bg-secondary-color: #f3f3f6;
--bg-tertiary-color: #cacad8;
--color-primary: #14854F;
--color-lightGrey: #d2d6dd;
--color-border: #d2d6dd;
--color-grey: #747681;
--color-darkGrey: #3f4144;
--color-error: #d43939;
--color-success: #28bd14;
--grid-maxWidth: 120rem;
--grid-gutter: 2rem;
--font-size: 1.8rem;
--font-color: #333333;
--font-family-sans: "Itim";
--font-family-mono: monaco, "Consolas", "Lucida Console", monospace;
--msg-other-bg-color : rgb(97, 182, 238);
--msg-me-bg-color : rgb(92, 175, 148);
--msg-reply-bg-color : rgb(209, 215, 219);
--msg-other-border-color : rgb(62, 127, 212);
--msg-me-border-color : rgb(64, 148, 116);
--msg-reply-border-color : rgb(94, 100, 105);
--msg-other-border-sel-color : rgb(58, 90, 139);
--msg-me-border-sel-color : rgb(48, 105, 86);
--svg-filter: none;
}
</style>
<title>Lupt Chat</title>
</head>
<body>
<div id="progress" class="bg-sec" style="z-index: 9999; position: fixed; top: 0; bottom: 0;width: 100%; height: 100%;">
<div id="progress"
style="z-index: 9999; position: fixed; top: 0; bottom: 0;
width: 100%; height: 100%; background-color: var(--bg-secondary-color);">
<div style="top: 50%;
left: 50%;
width:10em;
@ -18,7 +51,8 @@
text-align: center;
">
<img src="img/loading.svg" style="height: 100%;">
<button id="progress_button" class="button is-hidden" onclick="leave()">Close</button>
<div id="initerror"></div>
<button id="progress_button" class="button" style="display: none;" onclick="leave()">Close</button>
</div>
</div>
<!-- Connect Screen -->

View File

@ -15,10 +15,13 @@ var vayakti = {};
var typing = [];
var no_name_message = false;
// Connection opened
socket.addEventListener('open', function (event) {
$('#progress_button').removeClass('is-hidden');
// check if support ws
if(!('WebSocket' in window || 'MozWebSocket' in window)) {
$('initerror').text('Warning: Web Browser dosen\'t support websocket! Upgrade');
}
// Connection opened
socket.onopen = function(event) {
var params = window.location.search;
params = params.substr(1,params.length).split('&');
@ -31,12 +34,18 @@ socket.addEventListener('open', function (event) {
frm.find('[name=kaksh_kunjika]').val(params[0]);
frm.find('[name=kunjika]').val(params[1]);
frm.find('[name=name]').val(params[2]);
$('#progress_button').css('display', '');
connect(frm);
});
}
// Connection fail
socket.onerror = function(event) {
$('initerror').text('Warning: Failed to connect websocket! Refresh the '+
'page and if still don\'t work upgrade Web Browser');
}
// Listen for messages
socket.addEventListener('message', function (event) {
socket.onmessage = function(event) {
var j = JSON.parse(event.data);
switch(j.cmd) {
case 'resp':
@ -100,13 +109,13 @@ socket.addEventListener('message', function (event) {
});
break;
}
});
}
function connect(frm) {
if(actions.has_key('join') || actions.has_key('leave')) return;
var frm = $(frm);
var data = {};
frm.serializeArray().forEach(el => {
frm.serializeArray().forEach(function(el) {
if(typeof el.value == 'string')
data[el.name] = el.value.trim();
else
@ -204,7 +213,7 @@ function changeColor() {
function refreshVayaktiList() {
var v = $('#vayakti_list');
v.empty();
Object.keys(vayakti).forEach((key) => {
Object.keys(vayakti).forEach(function(key) {
v.append($('<tr>')
.append($('<td>').append(vayakti[key]))
.append($('<td>').append(key)));
@ -216,6 +225,6 @@ function autosize(el){
el.style.cssText = 'height:auto; padding:0';
el.style.cssText = 'height:' + el.scrollHeight + 'px';
$('#reply_clip').css('bottom', (el.scrollHeight + 10) + 'px');
$('#selected_clip').css('bottom', (el.scrollHeight + 10) + 'px');
$('#selected_clip').css('bottom', (el.scrollHeight + 25) + 'px');
},0);
}

View File

@ -1,6 +1,6 @@
var Camera = class {
static setupCamera() {
$('#file-input')[0].addEventListener('change', (e) => {
$('#file-input')[0].addEventListener('change', function(e) {
const file = e.target.files[0];
if (!file) {
return;
@ -19,11 +19,14 @@ var Camera = class {
reader.readAsDataURL(result);
reader.onloadend = function() {
var base64data = reader.result;
if(base64data.length > 63000 && mime != 'image/jpeg') {
if(base64data.length > 63488 && mime != 'image/jpeg') {
base64data = null;
result = null;
Camera.compressImage(file, 0.7, 'image/jpeg');
return;
} else if(base64data.length > 63488 && mime == 'image/jpeg') {
window.alert('file is too large!');
return;
}
socket.send(JSON.stringify({

View File

@ -4,7 +4,7 @@ let Messages = class {
var elm = $(elm);
elm.toggleClass('active');
if($('.active').length == 0)
if($('.message.active').length == 0)
$('#selected_clip').addClass('is-hidden');
else
$('#selected_clip').removeClass('is-hidden');
@ -49,7 +49,7 @@ let Messages = class {
if(elm.length > 0) elm.remove();
if(typing.length == 0) return;
var text = '';
typing.forEach((val) => {
typing.forEach(function(val) {
var name = vayakti[val];
if(name == undefined) name = "";
text += name+'('+val.substr(0,8)+')'+ ','
@ -98,7 +98,7 @@ let Messages = class {
else
elm.append($('<div>', {class: 'message-by'}).append(vayakti[sender]+'('+sender.substr(0, 8)+')'))
}
elm.append($('<img>', {src: src}));
elm.append($('<img>', {src: src, width: 300}));
elm.click(function() {
Messages.pick(this);
});

View File

@ -2,7 +2,7 @@ if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').match
$('body').toggleClass('dark');
}
$(document).ready(() => {
$(document).ready(function() {
$(".tabs > a").click(function() {
var t = $(this);