UCCS CS5260 2012 SPRING AJAX Chat Analysis and Design Rui Zhao Index 1 Preface ....................................................................................................................................... 1 2 Introduction ............................................................................................................................... 2 2.1 Requirements ................................................................................................................ 2 2.1.1 Running Environments ...................................................................................... 2 2.1.2 Developing Environments ................................................................................. 2 2.2 Features ......................................................................................................................... 2 3 Architecture Analysis ................................................................................................................ 3 3.1 Architecture ................................................................................................................... 3 3.1.1 Definition .......................................................................................................... 3 3.1.2 Tables ................................................................................................................ 4 3.1.3 Client ................................................................................................................. 5 3.1.4 Server ................................................................................................................ 8 3.2 Techniques .................................................................................................................. 12 3.2.1 AJAX .............................................................................................................. 12 3.2.2 FLEX ............................................................................................................... 13 3.2.3 FABridge ......................................................................................................... 14 4 New Features .......................................................................................................................... 15 5 Solutions ................................................................................................................................. 16 5.1 Table Design ............................................................................................................... 17 5.1.1 User on-line Table ........................................................................................... 17 5.1.2 Message Table ................................................................................................. 18 5.1.3 Bans Table ....................................................................................................... 18 5.1.4 Invitations Table .............................................................................................. 18 5.2 Client Design............................................................................................................... 19 5.3 Server Design .............................................................................................................. 19 6 Suggestions ............................................................................................................................. 21 7 Reference ................................................................................................................................ 22 AJAX Chat Analysis and Design 1 Preface AJAX Chat is a free and fully customizable open source web chat software implemented in JavaScript, PHP and MySQL. Sound support is implemented using Flash, Socket support using Flash on client-side and Ruby on server-side. [1] AJAX Chat integrates nicely with phpBB, MyBB, PunBB, SMF, vBulletin and other PHP community software. [1] This paper starts with analyzing the chat system, and both server and client will be elaborated in four aspects (table design, infrastructure, collaboration and interface). The following chapters then discuss new features and how to add them to the system. At last, problems are proposed, especially those in design and codes, accompanied with suggestions about how to solve them. 1 AJAX Chat Analysis and Design 2 Introduction 2.1 Requirements 2.1.1 Running Environments 1. Server-Side [1] a) PHP >= 4 b) MySQL >= 4 c) Ruby >= 1.8 (optional) 2. Client-Side [1] a) Enabled JavaScript b) Enabled Cookies c) Flash Plugin >= 9 (optional) 2.1.2 Developing Environments 1. Zend Studio for Java and Php script development on both client and server; 2. FLEX for client flash development; 3. MySQL for server database development; 4. Ruby for server socket development. 2.2 Features Only main functions are listed in Table 2-1. Some of them are copied from AJAX Chat website. [1] Table 2-1 Main Features Main Feature Detail Private messaging - Multiple/Private channels - Ignore/Ban and revoke users - List online/ignored/banned users - Change username - Private channels - Such as BB Code, hyperlinks, line Custom setting breaks. Possibility to delete messages inside the chat - Developed with Security as integral part - Blink window title on new messages - Show each user’s IP - 2 AJAX Chat Analysis and Design 3 Architecture Analysis 3.1 Architecture System architecture will be analyzed in four parts: constant definitions, tables, client design and server design. Focus will be put on table design and infrastructures of client and server. 3.1.1 Definition 3.1.1.1 Role Definition AJAX chat system defined five roles as default, as Table 3-1 shown. Table 3-1 Role Definition Role Definition Chat Bot AJAX_CHAT_CHATBOT Administrator AJAX_CHAT_ADMIN Moderator AJAX_CHAT_MODERATOR User AJAX_CHAT_USER Guest AJAX_CHAT_GUEST 3.1.1.2 Channel Definition Table 3-2 Default Channel Definition Channel Definition Value Public Channel channels[0] Public Private Channel channels[1] Private 3.1.1.3 User Definition Each role can have several users. For users that were not defined as default user, their user id will be assigned with unused numbers in field ‘User ID’, as Table 3-3 shown. Table 3-3 User Definition User Name Password User Role User ID Channel NULL NULL Guest - Public admin admin Administrator 1 Public & Private moderator moderator Moderator 2 Public & Private user user User 3 Public & Private apple apple Administrator 4 Public & Private pear pear User 5 Public & Private 3 AJAX Chat Analysis and Design 3.1.2 Tables The chat system maintains four tables in database. Only ‘Field’ and ‘Type’ are copied from AJAX Chat website in each table. [2] 3.1.2.1 User on-line Table Table 3-4 Table: ajax_chat_online Field Type Notation The table records every user chatting on line. A new value will be assigned to each guest. userID INT (11) For a registered user, userID will not be changed. userName VARCHAR (64) - userRole INT (1) Refer to Table3-1. channel INT (11) Channel Id on which the user is chatting. dateTime DATETIME Time of last access. ip VARBINARY(16) Remote IP of last access. Chat bot’s userID always is ‘2147483647’; and its username always is ‘ChatBot’. Table 3-5 Example of ajax_chat_online userID userName userRole channel dateTime ip 1 admin 3 500000001 2010-09-09 16:07:11 7f000001 3 user 1 500000001 2010-09-09 16:07:14 7f000001 3.1.2.2 Message Table Table 3-6 Table: ajax_chat_messages Field Type Notation The table records all chat messages. Increased by 1 when a new message is id(PK) INT(11) inserted. userID INT(11) Refer to Table3-4. userName VARCHAR(64) - userRole INT(1) Refer to Table3-1. channel INT(11) Refer to Table3-4. dateTime DATETIME Time of message receipt. ip VARBINARY(16) Remote IP of message sender. text TEXT Message content. 4 AJAX Chat Analysis and Design Table 3-7 Example of ajax_chat_messages id(PK) userID userName userRole channel 1 2147483647 ChatBot 4 0 2 1 admin 3 500000001 dateTime ip text 2010-09-02 16:47:10 7f000001 … 2010-09-02 16:49:21 7f000001 … 3.1.2.3 Bans Table Table 3-8 Table: ajax_chat_bans Field Type Notation The table records all banned users. userID INT(11) Refer to Table3-4. userName VARCHAR(64) Banned user name. User will be banned from now to dateTime. dateTime DATETIME Default dataTime is five minutes later from now. ip VARBINARY (16) Banned remote IP. Table 3-9 Example of ajax_chat_bans userID userName dateTime ip 6 apple 2010-09-09 16:20:03 7f000001 3.1.2.4 Invitations Table Table 3-10 Table: ajax_chat_invitations Field Type Notation The table records all users and channels in invitations. userID INT(11) Refer to Table3-4. channel INT(11) Channel Id used in invited chat. dateTime DATETIME Time to join. Table 3-11 Example of ajax_chat_invitations userID channel dateTime 6 500000001 2010-09-09 16:20:03 3 500000001 2010-09-09 15:57:39 3.1.3 Client 5 AJAX Chat Analysis and Design 3.1.3.1 Infrastructure Client infrastructure is described as Figure 3-1. Comment B Comment A FLEX Comment D FABridge FABridge.js XML Stream AJAX Comment C FABridge.as Comment E JSP HTML Provide Style Config Setting Invoke Action SWF Processor User POST/GET Request Sender Comment G Comment F Comment A: AJAX receives XML stream. Comment B: Update client view. Comment C: Connection between FlEX and AJAX. Comment D: Responsible for parsing XML stream and navigating JS instances. Comment E: Responsible for updating SWF. Comment F: Process actions performed on HTML. Comment G: Send Http request to server. Figure 3-1 Client Infrastructure Client