It has been almost a month since SoK has started, and my project has kept me quite busy for the last couple of weeks. Here I am going to discuss my experiences with KDE, and a detailed report on the work done by me on my project so far. I think this post is going to be a bit long, so a fair warning to all the readers 😉
KHangMan is an interesting KDE application that implements the Hangman game. In this game a word is chosen by the application, and some blanks are displayed that needs to be filled up by the correct characters. The user is given 10 chances to guess wrong letters, within which the correct word has to be guessed. Initially I wanted to work on KHangMan’s port to KF5, as it would help me to get more familiar with the framework’s API. So I contacted Jeremy Whiting in IRC and discussed my ideas with him. He asked me to grab a copy of the source code and set it up first. So I did the needful, and encountered some segmentation faults when I tried to launch the app. After exploring the code a bit I found that the segfault was occurring because it could not locate the .kvtml files and the theme files. So with Jeremy’s help I made some modifications in the code, and now if either of those files are not found, it simply displays a messagebox and exit normally, without a segmentation fault. I sent the patch to reviewboard and soon got a “Ship it”. It felt really good after submitting my first patch to KDE 🙂
After fixing that, I turned my attention to some relatively small tasks related to the KF5 port. The port was mostly done, but a few changes here and there were still needed. I looked at the warning and error messages from the build output to find out the parts of the code that needed to be updated and solved them. Then I found a bunch of TODO and FIXME in the code, and fixed a bunch of them. Some of them was simply clearing out old TODO comments that have already been fixed. A few other tasks included the following-
- Changing “What’s this” display message for File -> Open Recent
- Relocate standardthemes.xml to a more logical place (khangman/themes)
- Changing some classes and their associated methods to avoid deprecation of code
Soon after getting these issues fixed, the frameworks branch was ready to be merged with master, completing KHangMan’s port to KF5. In the meantime the SoK deadlines were also approaching, and having already submitted a few patches of KHangMan I wanted to do a substantial project on it. I soon had a discussion with Jeremy in IRC and he came up with some great ideas. One particular task suggested by him that sounded quite interesting was to create a QML based UI for KHangMan that will be compatible for all the 3 platforms (harmattan, desktop and plasma-active). Earlier there were separate UIs designed for the respective platforms. So it would be a simpler approach to use one common UI that will be compatible with all the above-mentioned platforms, and QML was the answer to it. This seemed to be a pretty good idea for a SoK project, and I submitted my proposal under the title “Improve/refresh KHangMan UI“. Jeremy agreed to mentor me for it. Heena Mahour was also interested in it, and agreed to co-mentor me for the project.
To start with the task, I found some existing QML files in the src/harmattan folder , which I copied to src/qml , and changed the CMakeLists.txt to add the src/qml , and also copied a bunch of classes from src/desktop to src. Then I added a QQuickWidget object to KHangMan class and added main.qml as it’s source to load the QML UI when the app is started. On doing this a lot of errors related to QML popped up, most of which was because the code was initially written in QML 1, and it had to be ported to QML 2. Some of the other errors were silenced by commenting out some stuff temporarily, only to come back to them later and fix them. Soon the basic QML view was up and running without any errors, but a lot of functionalities were still to be implemented.
Next I started to implement more functionalities and get the game to work. The main page that loaded on launching KHangMan had 3 buttons -> Play Game, Settings and About. I added to them a black background to make a contrast with the white background. There was also some code duplication in a couple of classes which had to be removed. A lot of stuff from KHangMan class were present in KHangManEngine and KHangManEngineHelper classes, so to resolve it I copied the non-repeating portions of the codes from them to KHangMan class. The other two classes are not needed anymore as KHangMan will alone suffice.
With the UI now displaying most of the elements, it still lacked the basic functionalities. For instance, on clicking the alphabet buttons the letters were not getting displayed on the screen. With a few changes I got the buttons to work. The next major issue was to get the sound files to play at the right moment. After modifying some includes in main.qml and properly defining the SoundEffect objects there, I made them play at appropriate moments. Now a chalk-drawing sound (similar to Kanagram) is played every time a new word is loaded while playing the game. There are also appropriate sound files played for a right guess and a wrong guess of the current word.
There was initially a status-bar defined in the KHangMan class to be displayed below when the game was started. I removed it and some associated variables (like m_levelLabel, m_accentLabel, etc) from there and instead used a toolbar from GamePage.qml and added the necessary buttons to it. Next I removed the currentWord property from GamePage that was used to store the current word to be guessed, and used a m_currentWord in KHangMan class instead, which stores the current word that the user has to guess while playing. A signal is emitted when it is changed. In the QML file we invoke the currentWord method of KHangMan class that returns a QStringList representing the current word.
A timer was already defined for the game, but it had a small issue. It did not start the countdown when the first word was loaded, but it worked perfectly from the second word onwards. Some small changes in the code got that fixed. By far the game was working fine, but the display needed to be changed. The alphabet buttons that were displayed looked somewhat ugly. I changed it to display the buttons in 2 rows, 13 buttons in each. Now the buttons have a square shape with black background and the alphabets are displayed in bold white in the center and are of considerable pixel-size. I also added a short sound file that is played whenever the app is launched.
The toolbar displayed below has an option for choosing the category of the words displayed, but the display of the dialog was broken. So with some minor changes in MySelectionDialog.qml the display got fixed, and now it displays each category as a button with black background and bold white text in the center, like all the other buttons in the game.
Next I added a Play/Pause button in the game, instead of the 3 buttons that were there previously. So when the app is launched, it initially shows only a button with the standard “play” image displayed. When the user clicks on it, a new game is started, the toolbar and all the other relevant items are displayed, and the image toggles to the standard “pause” image.
There is a “hint” button in the toolbar that is displayed at the bottom of the GamePage, but it’s functionality needed some polishing. So I made it display a hint one is found for the current word. On clicking it again the hint disappears. The text displayed is green in color and displayed between the alphabet buttons and the blanks to be filled displayed above it.
After that I also added a Quit button similar to the Play/Pause button, that simply exits the app. It is located at the top-right corner.
With the above features implemented, there is still a lot to be done. Some of the pending tasks are-
- Make the wrong guesses show the alphabets in a separate area, with some animation maybe
- Display the non-ascii letters display somewhere in the UI
- Fix the Settings button functionality
- Implement dynamic word-wrap for the current puzzle displayed (may contain multiple words, display them intelligently in multiple lines, as needed)
- Clear any old TODO/FIXME and update the manual/README/TODO/AUTHORS etc.
Working with KHangMan has been a real pleasure. The app in itself is quite interesting, and working on this project has helped me learn some new concepts. Jeremy is simply an awesome guy to work with. He is a really good mentor, and has always helped me out whenever I got stuck with something. Along with him there were also other developers in IRC who have always come up with suggestions whenever possible. I am glad to get a chance to work on this SoK project, as it is a wonderful opportunity to get started with KDE contributions, and I am looking forward to keep contributing in the long run. I hope to have a successful SoK experience 🙂
rahulc93 
Nice job! Keep up with the good work. 😉
Thank you 🙂