| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" |
| "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
| <html xmlns="http://www.w3.org/1999/xhtml" lang="en" dir="ltr"> |
| <!-- This file is part of the Civetweb project, |
| http://sourceforge.net/projects/civetweb/ --> |
| <head> |
| <title>Civetweb chat server</title> |
| <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/> |
| <link type="text/css" rel="stylesheet" href="style.css"/> |
| <script src="jquery.js"></script> |
| <script src="main.js"></script> |
| </head> |
| |
| <body> |
| <div id="header"> |
| <div id="logo"></div> |
| <div class="rounded infobox help-message" id="motd"> |
| Chat room implemented using |
| <a href="http://sourceforge.net/projects/civetweb/" target="_blank">Civetweb</a> |
| embeddable web server. |
| This application was written for educational purposes demonstrating |
| how web interface could be decoupled from the business logic. Not a |
| single line of HTML is generated by the server, instead, server |
| gives data to the client in JSON format. |
| </div> |
| </div> |
| <div> |
| |
| <div id="middle"> |
| <div><center><span id="error" class="rounded"></span><center></div> |
| |
| <div id="menu"> |
| <div class="menu-item left-rounded menu-item-selected" |
| name="chat">Chat</div> |
| <div class="menu-item left-rounded" name="settings">Settings</div> |
| </div> |
| |
| <div id="content" class="rounded"> |
| |
| <div id="chat" class="main"> |
| <div class="chat-window"> |
| <span class="top-rounded chat-title">Main room</span> |
| <div class="bottom-rounded chat-content"> |
| <div class="message-list" id="mml"> |
| </div> |
| <input type="text" size="40" class="message-input"></input> |
| <span class="help-message"> |
| Type your message here and press enter</span> |
| </div> |
| </div> |
| </div> |
| |
| <div id="settings" class="hidden main"> |
| <div> |
| <span class="top-rounded chat-title">Settings</span> |
| <div class="bottom-rounded chat-content"> |
| <table> |
| <tr><td>Max messages to display:</td><td>blah blah</td></tr> |
| <tr><td>Text color:</td><td>blah blah</td></tr> |
| </table> |
| </div> |
| </div> |
| </div> |
| |
| </div> |
| </div> |
| |
| <div id="footer"> |
| Copyright © 2004-2010 by Sergey Lyubka |
| </div> |
| |
| </body> |
| </html> |
