We Keep Coding

Get latest message in a chat application - Django

I've coded a chat application with Django Channels and it's working fine. The only issue is getting the latest messages and displaying them when coming back to the chat app. This is resolved for the moment by adding a function that gets older messages (old_messages()) in the chatSocket.onopen = function(e) part of the js file. The only problem now is: when user A refreshes the page of chat, the other user (user B) gets the older messages two times (since the connexion is closed and open for a second time by user A). Any idea how to avoid this problem ?
Here is a part of js file :
var chatSocket = new ReconnectingWebSocket(
'ws://' + window.location.host +
'/ws/chat/' + discussion_slug + '/');
chatSocket.onopen = function(e) {
console.log("open",e)
old_messages();
};
function old_messages() {
chatSocket.send(JSON.stringify({'command': 'old_messages',
'discussion_slug': discussion_slug }));
};
In consumers.py:
def old_messages(self,data):
discussion_slug = Discussion.objects.get(slug=data['discussion_slug'])
last_msgs = discussion_slug.messages.all()[:15]
content = {
'command': 'old',
'message': self.many_msg_to_json(last_msgs)
}
return content
async def receive(self, text_data):
data = json.loads(text_data)
content = self.commands[data['command']](self,data)
await self.channel_layer.group_send(
self.room_group_name,
{
'type': 'chat_message',
'message': content
}
)
Thanks!

Have you tried ModelName.objects.all().reverse()? The sorting will be latest first so you might not need old_messages().
If this doesn’t help, let me know. I’ll take a better look once I get on my pc

mailto client does not work in mobile devices and blocks the popup

I am trying to add a mailto button to send an email using email client
Here is my code:
clickEmail(e) {
let storyId = this.refs.storyToEmail.getAttribute('id');
if (storyId != undefined) {
let urlToSend = this.createURL(storyId) + "?ref=emailShare";
let subjectLine = "Shared story - " + this.props.headline;
let hrefValue = "mailto:?subject=".concat(subjectLine, "&body=", "I thought you might find this interesting:%0D%0A %0D%0A", urlToSend, "%0D%0A %0D%0AConnecting Communitie %0D%0A %0D%0A");
let email = this.refs.storyToEmail;
email.href = hrefValue;
return email.href;
}
}
However this works for me and almost all desktops and not working on many mobile devices.
After searching I noticed it needs permission from the browser as follows:
https://blog.hubspot.com/marketing/set-gmail-as-browser-default-email-client-ht
But the issue is I cannot find anyway to do the setting as suggested in the link for mobile(chrome)?
Can anyone shed light on this?

localStorage Issue -- onblur is not working on Mobile Device

I have created a form that is working perfectly on web browsers but it is not working on mobile devices. I am using localStorage to save some info from step one to step two in my forms. The way i am doing this is by using onblur function to each input element. For example on an email input I add onblur="storeData()" . The form is working perfectly on web browsers but on mobile devices it is not. I am not sure what might be the issue but I think that the onblur is not working on mobile devices. How can i replace the onblur ONLY for mobile devices? Please if you know provide the JS code to test it.
Thanks.
JS Code:
<script>
function storeData() {
var userEmail = document.querySelector("#UserName");
var userPhoneNumber = document.querySelector("#PhoneNumber");
var userName = document.querySelector("#FirstName");
var userLastName = document.querySelector("#LastName");
localStorage.setItem("mail", userEmail.value);
localStorage.setItem("phone", userPhoneNumber.value);
localStorage.setItem("name", userName.value);
localStorage.setItem("lastName", userLastName.value);
}
function getData() {
var userEmail = document.querySelector("#UserName");
var userPhoneNumber = document.querySelector("#PhoneNumber");
var userName = document.querySelector("#FirstName");
var userLastName = document.querySelector("#LastName");
userEmail.value = localStorage.getItem("mail");
userPhoneNumber.value = localStorage.getItem("phone");
userName.value = localStorage.getItem("name");
userLastName.value = localStorage.getItem("lastName");
}
</script>

Send file to Network Printer by Javascript - Acrobat DC

I have a trusted function that saves a file to my network printer. But it doesnt work, I get this error: "The file may be read-only, or another user may have it open. Please save the document with a different name or in a different folder."
This is my code:
var xerox = app.trustedFunction( function()
{
app.beginPriv();
var xeroxPath = "\\\out\\spool\\print\\Xerox\\";
this.saveAs(xeroxPath + this.documentFileName);
app.alert("PDF is sent to the printer",3)
app.endPriv();
});

Ok, I found the solution. In windows map the "\\out\spool\print\Xerox\" to a new network Drive. In my case I mapped it to X: so the code becomes:
var xerox = app.trustedFunction( function()
{ app.beginPriv();
var xeroxPath = "x:\\";
this.saveAs(xeroxPath + this.documentFileName);
app.alert("PDF is sent to the printer",3)
app.endPriv();
});

SharedWorker Not Working ...much less sharing

This post is a question which I will answer because I have searched high and low to find an answere to. Its very basic - as basic as you can get when creating a SharedWorker in JavaScript.
I came across an odd problem which has taken me hours to resolve. It was just to get a basic (really) SharedWorker to post a message to the window.
Right now, in my code I am using
...
var port = event.source
...
Everything else is pretty standard across blog articles/tutorials.
Why won't this work?

ANSWER:
I had originally started off on the blog "http://net.tutsplus.com/tutorials/javascript-ajax/getting-started-with-web-workers/" to do a hello SharedWorker example. DO NOT USE THIS ARTICLE ONLY!!!
The only problem that was holding me back was the that blog "var port = event.source" -- THIS IS INVALID!
USE var port = event.ports[0].
PS. Shared Workers don't have a window object so alert, console.log, etc will not work.
Working code:
index.html:
`<div>
<b>Welcome :)</b>
</div>
<script src="/js/main.js"></script>`
main.js:
var WorkerIO = new SharedWorker('/js/worker.io.js', 'NDN-Worker');
console.log('WorkerIO:', WorkerIO);
WorkerIO.port.addEventListener('message', function(eventM){
console.log('OnMessage:', eventM);
}, false);
WorkerIO.port.start();
WorkerIO.port.postMessage('This is a message from the client!');
WorkerIO.port.addEventListener('error', function(e){
throw new Error('WorkerIO Error: could not open SharedWorker', e);
}, false);
//importScripts();
Worker.io.js:
var ports = [];
self.addEventListener('connect', function(eventC){
'use strict';
ports = eventC.ports;
var port = ports[0];
port.postMessage('WorkerIO: connected');
console.log('o************ OnConnect ************o\n\n'
, '\t ports:', ports, '\n'
, '\t port:', port, '\n'
);
port.addEventListener('message', function(eventM){
var data = eventM.data;
console.log('o************ OnMessage ************o\n\n'
, '\t data:', data, '\n'
);
port.postMessage('from "clientPort": ' + clientPort.toString() + ', with love :)');
}, false);
port.start();
}, false);
Happy coding:)