Dynamic website without client side url handling

Question

I have a challenge that I can't solve. I have made a website with node.js and have all of the code written for the routing including routing for sub-domains. Some location only some users can access, some locations only logged in users can access. I wanted to include a chat for my users so I went along and created one with socket.io and some client side js.

Now I need the site to keep the chat element open which in on a bar across the screen when the client goes to another portion of the website. I have looked into many solutions but almost all of them include some js library like angular.js with the ng-model or ui technique but all include writing code for the client side that handles the url and what to load.

I don't really want to do this method because:

1. I don't want to re-write all my routes and I am not even sure how to handle the authentication of the users.
2. I find the client method to be a security issue
3. My website isn't a single page app, I just want one portion of the website to stay loaded.

Here is some images of what I am wanting:

State 1: State1

State 2: State2

Notice that the chat stays but other content was loaded. Also that it went to a different sub domain and a location that is only accessible by logged in users.

Thanks!

Answer 1

I guess you want to maintain state across page refresh, much like eg Facebook does. A true and trusted way of doing this is setting a cookie that stores the chat state: open/closed, or store the state on the server. Then on page load, initialize the chat based on this data.