fixed date issue

website/.env

@@ -0,0 +1,4 @@
+TESTING=False
+DEBUG=True
+SECRET_KEY=youwontguessthiskey
+SERVER=0.0.0.0

website/application/__init__.py

@@ -1,12 +1,11 @@
 from flask import Flask
-from os import environ
 
 
 def create_app():
     """Construct the core application."""
     app = Flask(__name__, instance_relative_config=False)
     app.config.from_object('config.Config')
-    app.secret_key = "no"
+
 
     with app.app_context():
         # Imports

website/application/database.py

@@ -65,6 +65,6 @@ def save_message(self, name, msg):
         :return: None
         """
         query = f"INSERT INTO {PLAYLIST_TABLE} VALUES (?, ?, ?, ?)"
-        self.cursor.execute(query, (name, msg,datetime.now(), None))
+        self.cursor.execute(query, (name, msg, datetime.now(), None))
         self.conn.commit()
 

website/application/static/index.js

@@ -1,27 +1,77 @@
+$(function()
+{
+  $('#messages') .css({'height': (($(window).height()) * 0.8)+'px'});
+
+  $(window).bind('resize', function(){
+      $('#messages') .css({'height': (($(window).height()) - 200)+'px'});
+  });
+});
+
+function scrollSmoothToBottom (id) {
+ var div = document.getElementById(id);
+ $('#' + id).animate({
+    scrollTop: div.scrollHeight - div.clientHeight
+ }, 500);
+}
+
 async function load_name(){
-    return await fetch('/get_name')
-         .then(async function (response) {
-            return await response.json();
-        }).then(function (text) {
-            return text["name"]
-        });
+  return await fetch('/get_name')
+       .then(async function (response) {
+          return await response.json();
+      }).then(function (text) {
+          return text["name"]
+      });
 };
 
 async function load_messages() {
-    return await fetch('/get_messages')
-     .then(async function (response) {
-        return await response.json();
-    }).then(function (text) {
-        console.log(text)
-        return text
-    });
+  return await fetch('/get_messages')
+   .then(async function (response) {
+      return await response.json();
+  }).then(function (text) {
+      console.log(text)
+      return text
+  });
+}
+
+function dateNow() {
+  var date = new Date();
+  var aaaa = date.getFullYear();
+  var gg = date.getDate();
+  var mm = (date.getMonth() + 1);
+
+  if (gg < 10)
+      gg = "0" + gg;
+
+  if (mm < 10)
+      mm = "0" + mm;
+
+  var cur_day = aaaa + "-" + mm + "-" + gg;
+
+  var hours = date.getHours()
+  var minutes = date.getMinutes()
+  var seconds = date.getSeconds();
+
+  if (hours < 10)
+      hours = "0" + hours;
+
+  if (minutes < 10)
+      minutes = "0" + minutes;
+
+  if (seconds < 10)
+      seconds = "0" + seconds;
+
+  return cur_day + " " + hours + ":" + minutes;
 }
 
 var socket = io.connect('http://' + document.domain + ':' + location.port);
-  socket.on( 'connect', function() {
-    socket.emit( 'event', {
-      data: 'User Connected'
-    } )
+  socket.on( 'connect', async function() {
+    var usr_name = await load_name()
+    if (usr_name != ""){
+      socket.emit( 'event', {
+        message: usr_name + ' just connected to the server!',
+        connect: true
+      } )
+    }
     var form = $( 'form#msgForm' ).on( 'submit', async function( e ) {
       e.preventDefault()
 
@@ -40,35 +90,48 @@ var socket = io.connect('http://' + document.domain + ':' + location.port);
       } )
     } )
   } )
+  socket.on( 'disconnect', async function( msg ) {
+      var usr_name = await load_name()
+      socket.emit( 'event', {
+      message: usr_name + ' just left the server...',
+      name: usr_name
+    } )
+  })
   socket.on( 'message response', function( msg ) {
-    add_messages(msg)
+    add_messages(msg, true)
   })
 
 window.onload = async function() {
-    var msgs = await load_messages()
-    for (msg of msgs){
-        add_messages(msg)
-    }
+  var msgs = await load_messages()
+  for (i = 0; i < msgs.length; i++){
+    scroll = false
+    if (i == msgs.length-1) {scroll = true}
+    add_messages(msgs[i], scroll)
+  }
+
 }
 
-async function add_messages(msg){
-    if( typeof msg.name !== 'undefined' ) {
-            var arr = " yyyy-mm-dd hh:mm:ss".split(/-|\s|:/);// split string and create array.
-            var date = new Date(arr[0], arr[1] -1, arr[2], arr[3], arr[4], arr[5]);
-
-            if ( typeof msg.time !== "undefined") {
-                var n = msg.time
-            }else{
-                var n = date
-            }
-            var global_name = await load_name()
-
-            var content = '<div class="container">' + '<b style="color:#000" class="right">'+msg.name+'</b><p>' + msg.message +'</p><span class="time-right">' + n + '</span></div>'
-            if (global_name == msg.name){
-                content = '<div class="container darker">' + '<b style="color:#000" class="left">'+msg.name+'</b><p>' + msg.message +'</p><span class="time-left">' + n + '</span></div>'
-            }
-            // update div
-            var messageDiv = document.getElementById("messages")
-            messageDiv.innerHTML += content
+async function add_messages(msg, scroll){
+  if( typeof msg.name !== 'undefined' ) {
+    var date = dateNow()
+
+    if ( typeof msg.time !== "undefined") {
+      var n = msg.time
+    }else{
+      var n = date
     }
+    var global_name = await load_name()
+
+    var content = '<div class="container">' + '<b style="color:#000" class="right">'+msg.name+'</b><p>' + msg.message +'</p><span class="time-right">' + n + '</span></div>'
+    if (global_name == msg.name){
+      content = '<div class="container darker">' + '<b style="color:#000" class="left">'+msg.name+'</b><p>' + msg.message +'</p><span class="time-left">' + n + '</span></div>'
+    }
+    // update div
+    var messageDiv = document.getElementById("messages")
+    messageDiv.innerHTML += content
+  }
+
+  if (scroll){
+    scrollSmoothToBottom("messages");
+  }
 }

website/application/views.py

@@ -6,7 +6,7 @@
 
 # GLOBAL CONSTANTS
 NAME_KEY = 'name'
-MSG_LIMIT = 5
+MSG_LIMIT = 20
 
 # GLOBAL VARS
 client = None
@@ -75,4 +75,17 @@ def get_messages():
     """
     db = DataBase()
     msgs = db.get_all_messages(MSG_LIMIT)
-    return jsonify(msgs)
+    messages = []
+    for msg in msgs:
+        message = msg
+        message["time"] = remove_seconds(message["time"])
+        messages.append(message)
+
+    return jsonify(msgs)
+
+
+def remove_seconds(msg):
+    """
+    removes the seconds off of a date time string
+    """
+    return msg.split(".")[0][:-3]

website/config.py

@@ -1,10 +1,17 @@
-from os import environ
+from dotenv import load_dotenv
+from pathlib import Path  # python3 only
+import os
+
+# load enviornment variables
+env_path = Path('.') / '.env'
+load_dotenv(dotenv_path=env_path)
 
 
 class Config:
     """Set Flask configuration vars from .env file."""
 
-    # General
-    TESTING = environ.get('TESTING')
-    FLASK_DEBUG = environ.get('FLASK_DEBUG')
-    SECRET_KEY = environ.get('SECRET_KEY')
+    # Load in enviornemnt variables
+    TESTING = os.getenv('TESTING')
+    FLASK_DEBUG = os.getenv('FLASK_DEBUG')
+    SECRET_KEY = os.getenv('SECRET_KEY')
+    SERVER = os.getenv('SERVER')

website/main.py

@@ -3,6 +3,7 @@
 import time
 from application import create_app
 from application.database import DataBase
+import config
 
 # setup flask application
 app = create_app()
@@ -24,27 +25,10 @@ def handle_my_custom_event(json, methods=['GET', 'POST']):
     if "name" in data:
         db = DataBase()
         db.save_message(data["name"], data["message"])
-    socketio.emit('message response', json)
-
-
-'''
-@socketio.on('join')
-def on_join(data):
-    username = data['username']
-    room = data['room']
-    join_room(room)
-    send(username + ' has entered the room.', room=room)
 
-
-@socketio.on('leave')
-def on_leave(data):
-    username = data['username']
-    room = data['room']
-    leave_room(room)
-    send(username + ' has left the room.', room=room)
-'''
+    socketio.emit('message response', json)
 
 # MAINLINE
 
 if __name__ == "__main__":
-    socketio.run(app, debug=True, host="192.168.0.21")
+    socketio.run(app, debug=True, host=str(config.Config.SERVER))