Specification of Chatroom behaviour using Statecharts
This assignment will make you familiar with Statechart modelling, simulation, and code synthesis (and a bit of testing).
In this assignment, you will design a Statechart model specifying the reactive behaviour of a chat client.
Note that incremental development is good practice: start modelling and trying out (after simulation and subsequently, code synthesis) small parts of the desired behaviour (satisfying only some of the requirements) in isolation. These can be saved and loaded later to incremental build the full solution Statechart.
The model and its visual representation must both be included in your index.html solution page.
The application's reactive behaviour (Python code) will be synthesized from the Statechart.
Interface provided by the controller
add_message(msg, color) shows the message in the chat window, with the specified color (as a string). append_to_buffer(string) adds a string to the input field and visualizes the change. remove_last_in_buffer() removes the final character from the input field and visualizes the change. clear_input() clears the input field and visualizes the change. input_join() color the input field in the 'join' mode. input_msg() color the input field in the 'message' mode. input_command() color the input field in the 'command' mode. get_buffer() returns the current content of the input field. Events sent to the Statechart (as strings): - connected a connection to the server is established - disconnected the connection to the server was broken - joined the room was succesfully joined - left the room was succesfully left - receive_message a message from someone else in the chatroom is received. The event has a single parameter, containing the message. - alive the server has replied to the poll Events sent to the Statechart on the tkinter_input port: - input a keystroke has occurred. The event has a single parameter, containing the input character. Some special characters include backspace (\b) and carriage return (\r). You can send the following events to the network component: - connect establish a connection to the server. This event takes 2 parameters: the hostname and portnumber. - disconnect disconnect from the server - join join a specific room. This event takes a single parameter: the roomnumber to connect to. - leave leave the current room - poll poll if the server is still alive. - send_message send a message to all users in the room. This event takes a single parameter: the message to broadcast.
As you should only focus on the reactive behaviour of the chat client, we have provided a starting point for you. The starting point includes a working chatserver (in Statecharts) and a network client (in Statecharts). Additionally, the binding with TkInter (the GUI) is also provided.
You should therefore only change the classes/chatwindow.xml file. Initialisation of the network client is already performed in the starting point.
Modelling of the Statechart model can be done using the AToMPM SCCD formalism.
For installation, see the AToMPM installation instructions
(only section 1 is required for this course).
Afterwards, please unzip the patch file in your root AToMPM folder.
Students that already have AToMPM installed for the course "Model-Driven Engineering" can unzip this file in their existing AToMPM folder.
If you already have an account in AToMPM, you will manually have to copy the folders in the users/(default)/ folder into your own user folder.
This patch contains the Statecharts and DEVS formalisms used in this assignment, as well as some example models and some bugfixes.
A detailed guide about how to load and export a model is given in AToMPM basic usage.
To use AToMPM, use Google Chrome (Firefox or others are NOT yet supported) and go to http://localhost:8124/atompm.
In the toolbar, load the toolbar /Formalisms/SCCD/SCCD.defaultIcons.metamodel.
Designed models can be exported by loading the /Toolbars/SCCD/compile.buttons.model toolbar and pressing the 'export' icon, either without state highlighting (leftmost button) or with state highlighting (rightmost button).
Left click on the desired model and afterwards right click somewhere in the canvas to place the selected model. You can edit attributes of the model by either using the middle mouse button, or selecting the model and pressing the 'insert' key on your keyboard. As the synthesized model will be in Python, you should write your methods in Python code. Drawing connections is done by right clicking on the source model and dragging the mouse to the destination model. When you are happy with your model, you can export it to SCCDXML and compile it by invoking python python_sccd_compiler/sccdc.py -p eventloop chatclient.xml. Afterwards, you can execute your model by running python run_client.py.
As this assignment uses a server, you will have to start a server with the command python run_server.py 8000 (for port 8000). You can have multiple servers running, as long as each has a different port. By default, 2 server locations are included in the ChatClient method: localhost port 8000 and 8001. The server will print some information about its communication, so you can see whether or not your calls reach the server. The server itself is also written in SCCDXML, but is provided in compiled form for your convenience. If you want to manually compile it, run python python_sccd_compiler.py/sccdc.py -p threads chatserver.xml.
Please hand in any file that you modified. Include links to these files in your index.html. DO NOT include files that weren't modified. Also, please include your model as an image. You can use the SVG export functionality of AToMPM by loading the toolbar /Toolbars/Utilities/Utils.model and pressing its first button.
It is good practice to model and simulate different parts of the overall solution in isolation (incremental, bottom-up design).
You are encouraged to use all functionality that Statecharts offer, such as history states, after events, and orthogonal components.
To use shallow history states, please unzip the latest version of the SCCD patch again: patch file. Allow it to overwrite all existing files. This will not delete your models in any way.