geolocation enabled and tested

public/index.html

@@ -16,6 +16,7 @@
         <button>Send</button>
     </form>
 
+    <button id="send-location">Send location</button>
     <script src = "/socket.io/socket.io.js"></script>
     <script src = "js/libs/jquery-3.4.1.min.js"></script>
     <script src = "js/index.js"></script>

public/js/index.js

@@ -13,11 +13,22 @@ socket.on('disconnect',function(){
 socket.on('newMessage',function(message){
     // console.log("New Message",message);
 
-    var li = jQuery('<li>');
+    var li = jQuery('<li></li>');
     li.text(`${message.from}: ${message.text}`)
     jQuery('#messages').append(li);
 })
 
+socket.on('newLocationMessage',function(message){
+    var li = jQuery('<li></li>');
+    var a = jQuery('<a target="_blank">My current location</a>')
+    li.text(`${message.from}: `);
+    a.attr('href',message.url);
+    li.append(a);
+    jQuery('#messages').append(li);
+})
+
+
+
 // socket.emit('createMessage',{
 //     from:"Erik",
 //     text:"Erik is all fit and fine",
@@ -35,4 +46,21 @@ jQuery('#message-form').on('submit',function(e){
     },function(){
 
     })
+})
+
+var locationButton = jQuery('#send-location');
+
+locationButton.on('click',function(){
+    if(!navigator.geolocation){
+        return alert('Geolocation not supported by your browser')
+    }
+
+    navigator.geolocation.getCurrentPosition(function(position){
+        socket.emit('createLocationMessage',{
+            latitude: position.coords.latitude,
+            longitude: position.coords.longitude
+        })
+    },function(){
+        alert('Unable to fetch location');
+    })
 })

server/server.js

@@ -2,7 +2,7 @@ const path = require('path');
 const http = require('http');
 const express = require('express');
 const socketIO = require('socket.io');
-const {generateMessage} = require('./utils/message')
+const {generateMessage,generateLocationMessage} = require('./utils/message')
 const publicPath = path.join(__dirname,'../public');
 
 const app = express();
@@ -24,11 +24,11 @@ io.on('connection',(socket)=>{
 
         io.emit('newMessage',generateMessage(message.from,message.text))
         callback('This is form server');
-        // socket.broadcast.emit('newMessage',{
-        //     from:message.from,
-        //     text:message.text,
-        //     createdAt:new Date().getTime()
-        // })
+
+    })
+
+    socket.on('createLocationMessage',(coords)=>{
+        io.emit('newLocationMessage',generateLocationMessage('Admin',coords.latitude,coords.longitude))
     })
 
     socket.on("disconnect",()=>{

server/utils/message.js

@@ -6,4 +6,12 @@ var generateMessage  = (from,text) =>{
     }
 }
 
-module.exports = {generateMessage};
+var generateLocationMessage = (from,latitude,longitude)=>{
+    return {
+    from,
+    url:`https://www.google.com/maps?q=${latitude},${longitude}`,
+    createdAt:new Date().getTime()
+}
+}
+
+module.exports = {generateMessage,generateLocationMessage};

server/utils/message.test.js

@@ -1,6 +1,6 @@
 var expect = require('expect');
 
-var {generateMessage} = require('./message')
+var {generateMessage, generateLocationMessage} = require('./message')
 describe('generateMessage',()=>{
     it('should generate correct message object',()=>{
         var from = 'Jen';
@@ -10,4 +10,17 @@ describe('generateMessage',()=>{
         expect(typeof message.createdAt).toBe('number');
         expect(message).toMatchObject({from, text});
     })
+})
+
+describe('generateLocationMessage',()=>{
+    it('should generate correct location object',()=>{
+        var from = 'Monty';
+        var latitude = 15;
+        var longitude = 19;
+        var url = 'https://www.google.com/maps?q=15,19';
+        var message = generateLocationMessage(from, latitude,longitude);
+
+        // expect(typeof message.createdAt).toBe('number');
+        expect(message).toMatchObject({from, url});
+    })
 })