Combining the pcengine.freeforums.org chat window and the pcenginefx.com forums on a single web page

Once upon a time, the pcenginefx.com forums included a “shoutbox” that allowed visitors to chat in real-time with each other.  It was always active.

Sadly, the shoutbox was exploited in a malicious way and the website was taken down, indefinitely. 

However, like a phoenix rising from the ashes of an epic monument, pcengine.freeforums.org was created by sunteam_paul.  It acted as a “temporary” forums until the original site was brought back online.  One of the many great features of this new forum architecture was a chat window!  And there was much rejoicing.

Time passed and the original forums were eventually brought back online, but the shoutbox was disabled.  Many of the “regulars” continue to use the chat window from pcengine.freeforums.org while actively participating in discussions over at pcenginefx.com.

And now we get to this little page.  I wanted to create a web page that would allow me to chat in the chat window at pcengine.freeforums.org while reading/writing at pcenginefx.com all on one screen.  Integrating both elements on a singe page is mostly a convenience factor.  Now I don’t have to switch between tabs to see if there is anything new.  I’ve also added a button that will hide the chat window, opening up the entire browser screen to the forums.

You can try it out here or right-click to download: obeypce.html

Feel free to download it and tinker with it to your heart’s desire.  Currently it has not been tested on any tablets or mobile devices. If you are unfamiliar with html or CSS and would like to customize it, I’d be more than happy to update the html file with notes so give you an idea of how to tweak it. 

UPDATE 12/31/12: I made a couple of minor tweaks to the file.  Now the chat window area is  narrower, taking up about 150 pixels less space. Also tweaked things a bit so the double scroll bars on the right doesn’t show up as often, though I haven’t figured out how to eliminate that completely, yet.  At least not without setting an absolute set dimension for the bottom window, but I’d like to keep it fluid.

Here’s an updated screenshot with the chat window closed and open: