Skip to content

Instantly share code, notes, and snippets.

View dongido001's full-sized avatar
🕳️
../

Onwuka Gideon dongido001

🕳️
../
View GitHub Profile
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body, html {
overflow: hidden;
background-color: #f5f5f5;
}
.main-container {
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="./style.css">
<title>Vanilla PHP and JavaScript Stream Group Chat</title>
</head>
<body>
<div class="main-container">
// [...]
// Stream Chat server SDK
const StreamChat = require('stream-chat').StreamChat;
const serverClient = new StreamChat(
'<STREAM_API_KEY>',
'<STREAM_API_SECRET>'
);
app.get('/token', (req, res) => {
const express = require('express')
const app = express()
const port = 3000
app.use(express.static((__dirname + 'public')));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(express.static('public'));
app.get('/', (req, res) => res.sendFile(__dirname + 'index.html'))
// [...]
addMessage() {
// Send message to the channel
this.channel && this.channel.sendMessage({
text: this.message
});
this.message = "";
}
// [...]
// [...]
// fetch the channel state, subscribe to future updates
channel.watch().then(state => {
this.messages = state.messages
// Listen for new messages on the channel
channel.on('message.new', event => {
this.messages.push(event.message)
});
})
// [...]
const to_username = this.chat.email.replace(/[@\.]/g, '_')
const {data} = await axios.post('/api/get-or-create-channel', {
from_username: this.username,
to_username: to_username,
from: this.autheduser.id,
to: this.chat.id,
})
// [...]
this.initializeClient()
// [...]
// [...]
async initializeClient () {
// Initialize the StreamChat SDK
const {data} = await axios.post('/api/generate-token', {
username: this.autheduser.email.replace(/[@\.]/g, '_')
})
const client = new StreamChat(process.env.MIX_STREAM_API_KEY, {timeout: 9000});
await client.setUser(
{
// [...]
/**
* Create or get channel
*/
public function createOrGetChannel(Request $request)
{
$from = $request->input('from');
$to = $request->input('to');