- { category.title }
+
In terms of development, the first year of a cat’s life is equal to the first 15 years of a human life. After its second year, a cat is 25 in human years. And after that, each year of a cat’s life is equal to about 7 human years.
diff --git a/bfrontend/src/Components/Categories/CategoryViewLoader.js b/bfrontend/src/Components/Categories/CategoryViewLoader.js
index ed113af..4b61f76 100644
--- a/bfrontend/src/Components/Categories/CategoryViewLoader.js
+++ b/bfrontend/src/Components/Categories/CategoryViewLoader.js
@@ -5,13 +5,14 @@ export default function CategoryViewLoader(props) {
-
+
+
)
}
\ No newline at end of file
diff --git a/bfrontend/src/Components/Users/UserLink.js b/bfrontend/src/Components/Users/UserLink.js
new file mode 100644
index 0000000..af018eb
--- /dev/null
+++ b/bfrontend/src/Components/Users/UserLink.js
@@ -0,0 +1,3 @@
+export default function UserLink({ user }) {
+ return null; // TODO: implement
+}
\ No newline at end of file
diff --git a/bfrontend/src/Config.js b/bfrontend/src/Config.js
index 1c373a8..46a58a3 100644
--- a/bfrontend/src/Config.js
+++ b/bfrontend/src/Config.js
@@ -1,5 +1,6 @@
const config = {
- apiUrl: 'http://localhost:3000'
+ apiUrl: 'http://localhost:3000',
+ gatewayUrl: '' // Leave blank for it to look for the gateway on the current page, if that makes sense
};
export default config;
\ No newline at end of file
diff --git a/bfrontend/src/Gateway/GatewayConnection.js b/bfrontend/src/Gateway/GatewayConnection.js
new file mode 100644
index 0000000..0674e45
--- /dev/null
+++ b/bfrontend/src/Gateway/GatewayConnection.js
@@ -0,0 +1,82 @@
+import io from 'socket.io-client';
+
+class GatewayConnection {
+ constructor(url="") {
+ this.isConnected = false;
+ this.socket = null;
+ this.url = url;
+
+ // TODO: set up proper event listening and such, not this dumb crap
+ this.onDisconnect = () => {}
+ this.onConnect = () => {}
+ }
+}
+
+GatewayConnection.prototype.disconnect = function() {
+ this.socket?.disconnect();
+ this.socket = null;
+ this.isConnected = false;
+};
+
+GatewayConnection.prototype.connect = function(token) {
+ console.log('[*] [gateway] [handshake] Trying to connect to gateway');
+ this.socket = io(`${this.url}/gateway`, {
+ query: {
+ token
+ },
+ transports: ['websocket']
+ });
+
+ this.socket.on('connect', () => {
+ this.socket.once('hello', (debugInfo) => {
+ console.log('[*] [gateway] [handshake] Got hello from server, sending yoo...', debugInfo);
+ this.socket.emit('yoo');
+ this.isConnected = true;
+ this.debugInfo = debugInfo;
+ this.onConnect('CONNECT_RECEIVED_HELLO');
+ console.log('[*] [gateway] [handshake] Assuming that server received yoo and that connection is completed.');
+ });
+ })
+
+ this.socket.on('error', (e) => {
+ console.log('[E] [gateway] Gateway error', e);
+ this.isConnected = false;
+ this.socket = null;
+ this.onDisconnect('DISCONNECT_ERR', e);
+ });
+ this.socket.on('disconnectNotification', (e) => {
+ console.log('[E] [gateway] Received disconnect notfication', e);
+ this.isConnected = false;
+ this.socket = null;
+ this.onDisconnect('DISCONNECT_NOTIF', e);
+ });
+ this.socket.on('disconnect', (e) => {
+ console.log('[E] [gateway] Disconnected from gateway: ', e);
+ this.isConnected = false;
+ this.onDisconnect('DISCONNECT', e);
+ });
+};
+
+GatewayConnection.prototype.sendMessage = function(categoryId, content) {
+ if (!this.isConnected) return 1;
+ if (content.length >= 2000) return 1;
+
+ this.socket.emit('message', {
+ category: {
+ _id: categoryId
+ },
+ content
+ });
+};
+
+GatewayConnection.prototype.subscribeToCategoryChat = function(categoryId) {
+ if (!this.isConnected) return;
+
+ const request = [categoryId];
+
+ console.log('[*] [gateway] Subscribing to channel(s)', request);
+
+ this.socket.emit('subscribe', request);
+};
+
+export default GatewayConnection;
\ No newline at end of file
diff --git a/bfrontend/src/Gateway/globalGatewayConnection.js b/bfrontend/src/Gateway/globalGatewayConnection.js
new file mode 100644
index 0000000..74ddeee
--- /dev/null
+++ b/bfrontend/src/Gateway/globalGatewayConnection.js
@@ -0,0 +1,6 @@
+import GatewayConnection from './GatewayConnection';
+import config from '../Config';
+
+const globalGatewayConnection = new GatewayConnection(config.gatewayUrl);
+
+export default globalGatewayConnection;
\ No newline at end of file
diff --git a/bfrontend/src/Styles/App.scss b/bfrontend/src/Styles/App.scss
index bce94a8..fe1ecc1 100644
--- a/bfrontend/src/Styles/App.scss
+++ b/bfrontend/src/Styles/App.scss
@@ -142,6 +142,40 @@ body {
max-width: 110px;
}
+.profile-picture {
+ border-radius: 50%;
+ margin: 5px;
+ width: 32px;
+ height: 32px;
+
+ &.profile-picture-8 {
+ width: 8px;
+ height: 8px;
+ }
+
+ &.profile-picture-16 {
+ width: 16px;
+ height: 16px;
+ }
+
+ &.profile-picture-32 {
+ width: 32px;
+ height: 32px;
+ }
+
+ &.profile-picture-64 {
+ width: 64px;
+ height: 64px;
+ }
+}
+
+.category-profile {
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ justify-content: left;
+}
+
@media only screen and (max-width: 600px) {
.button.category-button {
min-width: 50px;