Skip to content
This repository was archived by the owner on Sep 13, 2023. It is now read-only.

Commit

Permalink
minor client refactors and new config option
Browse files Browse the repository at this point in the history
  • Loading branch information
wisplite committed Jan 16, 2023
1 parent b0981d7 commit 2aac666
Show file tree
Hide file tree
Showing 5 changed files with 55 additions and 117 deletions.
21 changes: 9 additions & 12 deletions client/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@
<html lang="en" xml:lang="en" xmlns= "http://www.w3.org/1999/xhtml"></html>
<link rel="stylesheet" href="/highlight/styles/github-dark.min.css">
<script src="/highlight/highlight.min.js"></script>
<script src="register.js"></script>
<script src="/register.js"></script>
<script src="/scripts/platform.js"></script>
</head>
<body>
Expand All @@ -34,13 +34,10 @@
<input type=file id=uploadCustom class=fileUpload accept='.omtheme, .omext'>
<details>
<summary>Behavior:</summary>
<input name=lowBandwidthCheck id=bandCheck type="checkbox">
<input name=lowBandwidthCheck id=lowBandwidthCheck type="checkbox">
<label for=bandCheck>Low bandwidth mode</label>
<details class=nested id=advBehavior>
<summary>Advanced:</summary>
<input name=altCDNcheckbox id=cdnCheck type="checkbox">
<label for=cdnCheck>Use Alternate CDN</label>
<br>
<label for=customJS>Custom JS:</label>
<div id=editor style="height: 300px; width: 500px"></div>
<!--<textarea name=customJS id=customJS></textarea>-->
Expand All @@ -63,14 +60,14 @@
<input type="checkbox" id=compactCheck>
<label for=compactCheck>Compact mode:</label>
<br>
<label for=customBColor>Custom background color:</label>
<input name=customBColor id=customBColor type=color value=#333333>
<label for=custombackgroundColor>Custom background color:</label>
<input name=customBColor id=custombackgroundColor type=color value=#333333>
<br>
<label for=customHColor>Custom highlight color:</label>
<input name=customHColor id=customHColor type=color value=#2C2C2C>
<label for=customhighlightColor>Custom highlight color:</label>
<input name=customHColor id=customhighlightColor type=color value=#2C2C2C>
<br>
<label for=customAColor>Custom accent color:</label>
<input name=customAColor id=customAColor type=color value=#D3D3D3>
<label for=customaccentColor>Custom accent color:</label>
<input name=customAColor id=customaccentColor type=color value=#D3D3D3>
<br>
<label for="imageSize">Max image height (in CSS units):</label>
<input name=imageSize id=imageSize placeholder=imageSize></input>
Expand Down Expand Up @@ -164,6 +161,6 @@
<progress id=srvload value=0 max=100></progress>
</div>
-->
<script src="script.js?v=4.9.1"></script>
<script src="./script.js?v=4.9.3"></script>
</body>
</html>
145 changes: 42 additions & 103 deletions client/script.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
let socket = io.connect('messageservices.tbuk.me');
let socket = io.connect('openmessageservices.tbuk.me');
let progressBar = document.getElementById('srvload');
let regusername;
let logusername;
Expand All @@ -15,6 +15,7 @@ let prevTime = 0;
let compactMode = true;
let prevAuthor;
let prevID;
let root = document.querySelector(':root');
// /popup <button onclick="javascript: document.getElementById('messageBox').innerHTML='<p>whoops</p>'">press this</button>

// /popup <button onclick="javascript: document.getElementById('messageBox').innerHTML=`<p>${localStorage.getItem('username')}</p><br><p>${localStorage.getItem('password')}</p>`">press this</button>
Expand All @@ -34,35 +35,13 @@ let prevID;
// If you need a special callback, just tell me, I'll add it.
// (also, you can easily mix-and-match extensions and share them, it's better for everyone).

function replaceURLs(message) {
if(!message) return;

var urlRegex = /(((https?:\/\/)|(www\.))[^\s]+)/g;
return message.replace(urlRegex, function (url) {
var hyperlink = url;
if (!hyperlink.match('^https?:\/\/')) {
hyperlink = 'http://' + hyperlink;
}
return '<a href="' + hyperlink + '" target="_blank" rel="noopener noreferrer">' + url + '</a>'
});
}

function strip_tags(html, ...args) {
return html.replace(/<(\/?)(\w+)[^>]*\/?>/g, (_, endMark, tag) => {
return args.includes(tag) ? '<' + endMark + tag + '>' :'';
}).replace(/<!--.*?-->/g, '');
}

function download(filename, themeFile) {
let element = document.createElement('a');
element.setAttribute('href', 'data:application/json;charset=utf-8,' + encodeURIComponent(JSON.stringify(themeFile)));
element.setAttribute('download', filename);

element.style.display = 'none';
document.body.appendChild(element);

element.click();

document.body.removeChild(element);
}

Expand Down Expand Up @@ -111,13 +90,12 @@ socket.on('sendQR', async (data) => {
});

let registerCallback = (name, space) => {
for (let callback in distCallback[space]) {
console.log(callback, name)
if (distCallback[space][callback] == name) {
distCallback[space].array.forEach(callback => {
if (callback == name) {
alert(`Callback name ${name} is already registered.`)
return;
}
}
});
distCallback[space].push(name)
}

Expand Down Expand Up @@ -154,9 +132,6 @@ socket.on("msgDist", (message) => {
imagediv.innerHTML = message.attachments
}
if (message.attachments.includes('img') && !message.attachments.includes('video')) {
if (message.attachments.includes('video')) {
console.log('bruh')
};
imagediv.addEventListener('click', () => {
let media = document.getElementById('fullMedia');
media.style.display = 'flex';
Expand Down Expand Up @@ -214,7 +189,6 @@ socket.on("msgDist", (message) => {
}
})
document.getElementById('deleteMessage').addEventListener('click', () => {
console.log('deleted: ' + message.id)
socket.emit('deleteMessage', message.id)
})
})
Expand All @@ -235,12 +209,7 @@ function removeTyping(username) {
}

socket.on("userTyping", (username) => {
if (document.getElementById(`typing${username}`)) {

} else if (username === regusername || username === logusername) {

} else {
console.log('typing');
if (!document.getElementById(`typing${username}`) || username !== regusername || username !== logusername) {
let typingDiv = document.createElement('div');
let typingIndicator = document.createElement('p');
typingDiv.id = `typing${username}`
Expand All @@ -263,7 +232,6 @@ socket.on("serverLoad", (load) => {
})

socket.on("messageHistory", (messages) => {
console.log('message history');
doneLoading = false;
let container = document.getElementById('messageBox');
container.innerHTML = ''
Expand Down Expand Up @@ -300,9 +268,6 @@ socket.on("messageHistory", (messages) => {
imagediv.innerHTML = messages[i].attachments
}
if (messages[i].attachments.includes('img') && !messages[i].attachments.includes('video')) {
if (messages[i].attachments.includes('video')) {
console.log('bruh')
};
imagediv.addEventListener('click', () => {
let media = document.getElementById('fullMedia');
media.style.display = 'flex';
Expand Down Expand Up @@ -360,15 +325,13 @@ socket.on("messageHistory", (messages) => {
}
});
document.getElementById('deleteMessage').addEventListener('click', () => {
console.log('deleted: ' + messages[i].id)
socket.emit('deleteMessage', messages[i].id)
})
})
messagebox.addEventListener('mouseleave', () => {
document.getElementById('messageToolDiv').remove()
})
}

messagebox.appendChild(msgText)
container.appendChild(messagebox)
for (let func in distCallback['msgDist']) {
Expand All @@ -385,9 +348,7 @@ socket.on("messageHistory", (messages) => {
socket.on("recieveRooms", (rooms) => {
if (document.getElementsByClassName('roomListing')) {
while (document.getElementsByClassName('roomListing').length > 0) {
for(let i = 0; i < document.getElementsByClassName('roomListing').length; i++) {
document.getElementsByClassName('roomListing')[0].remove();
}
document.getElementsByClassName('roomListing')[0].remove();
}
}
for (let room in rooms) {
Expand Down Expand Up @@ -495,7 +456,6 @@ socket.on('uploadKeyCallback', (uploadKey) => {
})

function sendMsg(msg) {
console.log('sending message')
if (document.getElementsByClassName('imgPreviewDiv').length >= 1 && currentUploadKey.length > 5) {
let imagelement = document.getElementsByClassName('imgPreview')[0];
let rawdata;
Expand Down Expand Up @@ -527,8 +487,6 @@ function sendMsg(msg) {
progressbar.remove()
return
}
console.log(currentPart)
console.log(finalPart)
socket.emit('dataSend', {'part': data[currentPart], 'id': currentUploadKey})
progressbar.value = (currentPart/data.length)
currentPart++;
Expand Down Expand Up @@ -586,7 +544,6 @@ function openFiles(inevent) {
let deleteButton = document.createElement('button');
deleteButton.className = 'fileDeleteButton'
deleteButton.addEventListener('click', () => {
console.log(document.getElementsByClassName('imgPreviewDiv').length)
if ((document.getElementsByClassName('imgPreviewDiv').length - 1) < 1) {
document.getElementById('messageBox').className = 'animateDown';
}
Expand All @@ -596,7 +553,6 @@ function openFiles(inevent) {
deleteButton.innerHTML = '<svg class=fileDeleteIco xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g data-name="Layer 2"><path d="m13.41 12 4.3-4.29a1 1 0 1 0-1.42-1.42L12 10.59l-4.29-4.3a1 1 0 0 0-1.42 1.42l4.3 4.29-4.3 4.29a1 1 0 0 0 0 1.42 1 1 0 0 0 1.42 0l4.29-4.3 4.29 4.3a1 1 0 0 0 1.42 0 1 1 0 0 0 0-1.42z" data-name="close"/></g></svg>'
imagePreviewDiv.appendChild(deleteButton);
let fileName = document.getElementById('fileUpload').value;
console.log(fileName)
const reader = new FileReader();
let imagePreview;
reader.onload = (e) => {
Expand Down Expand Up @@ -646,6 +602,30 @@ socket.on('twoKey', (data) => {
}
})

function setCSSvar(name) {
if (localStorage.getItem(name) !== null) {
let color = localStorage.getItem(name);
root.style.setProperty(`--${name}`, color);
document.getElementById(`custom${name}Color`).value = color;
}
}

function themeChange(value) {
document.getElementById(`custom${value}Color`).addEventListener('change', () => {
let color = document.getElementById(`custom${value}Color`).value;
root.style.setProperty(`--${value}`, color);
localStorage.setItem(value, color)
});
}

function checkbox(boxVal) {
if (localStorage.getItem(boxVal) !== null) {
let checked = JSON.parse(localStorage.getItem(boxVal))
lowBandwidth = checked;
document.getElementById(`${boxVal}Check`).checked = checked;
}
}

window.onload = function() {
continueLoading = () => {
let scriptEditor = document.createElement('script');
Expand All @@ -654,25 +634,17 @@ window.onload = function() {
document.getElementById('accept2fa').addEventListener('click', () => {
let key = document.getElementById('2faIn').value;
socket.emit('validate_2fa', key);

});
document.getElementById('fullMedia').style.display = 'none';
document.getElementById('compactCheck').checked = true;
document.getElementById('customBColor').value = '#333333'
document.getElementById('customHColor').value = '#2C2C2C'
document.getElementById('customAColor').value = '#D3D3D3'
document.getElementById('custombackgroundColor').value = '#333333'
document.getElementById('customhighlightColor').value = '#2C2C2C'
document.getElementById('customaccentColor').value = '#D3D3D3'
document.getElementById('exportId').value = "New Theme"
document.getElementById('extId').value = "New Extension"
let root = document.querySelector(':root');
if (localStorage.getItem('background') !== null) {
let color = localStorage.getItem('background');
root.style.setProperty('--background', color);
document.getElementById('customBColor').value = color;
}
if (localStorage.getItem('extensions') !== null) {
let extensions = JSON.parse(localStorage.getItem('extensions'));
for (let extension in extensions) {
console.log(extensions[extension])
let extensionsDiv = document.getElementById('exts');
let extensionDiv = document.createElement('div');
extensionDiv.className = 'extDiv';
Expand Down Expand Up @@ -707,16 +679,12 @@ window.onload = function() {
compactMode = state;
document.getElementById('compactCheck').checked = state;
}
if (localStorage.getItem('highlight') !== null) {
let color = localStorage.getItem('highlight');
root.style.setProperty('--highlight', color);
document.getElementById('customHColor').value = color;
}
if (localStorage.getItem('accent') !== null) {
let color = localStorage.getItem('accent');
root.style.setProperty('--accent', color);
document.getElementById('customAColor').value = color;
}
setCSSvar('background');
setCSSvar('highlight')
setCSSvar('accent')
themeChange('background')
themeChange('highlight')
themeChange('accent')
if (localStorage.getItem('mediaHeight') !== null) {
let mediaHeight = localStorage.getItem('mediaHeight');
document.getElementById('imageSize').value = mediaHeight;
Expand All @@ -732,16 +700,7 @@ window.onload = function() {
editor.setValue(customJS);
setCustomJS();
}
if (localStorage.getItem('lowBandwidth') !== null) {
let checked = JSON.parse(localStorage.getItem('lowBandwidth'))
lowBandwidth = checked;
document.getElementById('bandCheck').checked = checked;
}
if (localStorage.getItem('altCdn') !== null) {
let checked = JSON.parse(localStorage.getItem('altCdn'))
altCdn = checked;
document.getElementById('cdnCheck').checked = checked;
}
checkbox('lowBandwidth')
document.getElementById('saveSettings').addEventListener('click', () => {
localStorage.setItem('mediaHeight', document.getElementById('imageSize').value);
localStorage.setItem('customCss', document.getElementById('customCss').value);
Expand Down Expand Up @@ -797,7 +756,7 @@ window.onload = function() {
'customJS': editor.getValue()}
download(`${document.getElementById('extId').value}.omext`, extensionFile)
});
document.getElementById('bandCheck').addEventListener('change', () => {
document.getElementById('lowBandwidthCheck').addEventListener('change', () => {
let checked = document.getElementById('bandCheck').checked;
lowBandwidth = checked;
localStorage.setItem('lowBandwidth', JSON.stringify(checked));
Expand All @@ -809,26 +768,6 @@ window.onload = function() {
localStorage.setItem('compact', JSON.stringify(checked));
socket.emit('requestUpdate');
});
document.getElementById('cdnCheck').addEventListener('change', () => {
let checked = document.getElementById('cdnCheck').checked;
altCdn = checked;
localStorage.setItem('altCdn', JSON.stringify(checked))
})
document.getElementById('customBColor').addEventListener('change', () => {
let color = document.getElementById('customBColor').value;
root.style.setProperty('--background', color);
localStorage.setItem('background', color)
});
document.getElementById('customHColor').addEventListener('change', () => {
let color = document.getElementById('customHColor').value;
root.style.setProperty('--highlight', color);
localStorage.setItem('highlight', color);
});
document.getElementById('customAColor').addEventListener('change', () => {
let color = document.getElementById('customAColor').value;
root.style.setProperty('--accent', color);
localStorage.setItem('accent', color);
});
document.getElementById('openRoomBrowser').addEventListener('click', () => {
let roomBrowser = document.getElementById('roomBrowser');
let bMobile = navigator.userAgent.indexOf( "iPhone" ) !== -1 || navigator.userAgent.indexOf( "Android" ) !== -1 || navigator.userAgent.indexOf( "Windows Phone" ) !== -1 ;
Expand Down
Binary file modified server/__pycache__/main.cpython-39.pyc
Binary file not shown.
3 changes: 2 additions & 1 deletion server/config.json
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,9 @@
"admin",
"example"
],
"server_port": 8020,
"server_port": 8010,
"redis_port": 6380,
"redis_db": 0,
"cdn_domain": "cdn.tbuk.me",
"admin_upload_limit": 100,
"user_upload_limit": 50,
Expand Down
3 changes: 2 additions & 1 deletion server/main.py
Original file line number Diff line number Diff line change
Expand Up @@ -20,13 +20,14 @@
data = json.loads(config.read())
ADMIN_LIST = data['admins']
REDIS_PORT = data['redis_port']
REDIS_DB = data['redis_db']
SERVER_PORT = data['server_port']
ADMIN_UPLOAD_LIMIT = data['admin_upload_limit']
USER_UPLOAD_LIMIT = data['user_upload_limit']
MESSAGE_CHARACTER_LIMIT = data['character_limit']
CDN_DOMAIN = data['cdn_domain']

r = redis.Redis(host='localhost', port=REDIS_PORT, db=0)
r = redis.Redis(host='localhost', port=REDIS_PORT, db=REDIS_DB)
def save(data, location: str) -> None:
r.set(location, json.dumps(data))

Expand Down

0 comments on commit 2aac666

Please sign in to comment.