Wt: A Project Manager

For the whole week, I’ve been continuing work on my task, which is to build some sort of project manager interface. Last week, I built a simple interface without much functions. So, what I did is mostly creating functions and improving the graphical interface.

Requests, requests and more requests

As I am working with Google Drive to handle project files (store/delete/upload/download/modify), I need to constantly send requests. In default use, my app is given only project folder access, which means only files/folders I created is visible and editable. In my project, I have made several functions:-

1. Creating a project folder and inserting files in folder
   • This folder will be used to store all the files that the user creates. To create a folder, a  POST request is sent to https://www.googleapis.com/drive/v2/files. The body is the file metadata, with title and mimeType set to ‘application/vnd.google-apps.folder’. The ID of the folder is needed when creating a file inside the folder. In the multipart/related request to create a file (which I’ve explained here previously), the ‘parents’ file metadata must be sent with the folder ID as its value. Example:  'parents':[{'id':'(folderID)'}]"
2. A button to create project file in which a button is created to represent the project
   • When the ‘create project’ button is pressed, a request is sent to Drive to create a file in the project folder. In turn, a new button will be spawned which “represents” the file. I’ve connected it to two signals, clicked() and doubleClicked(), both with respective functions. I think generating push buttons with event handling in a WContainerWidget on the fly is pretty cool.
3. Sending a local request to Wt
   • The request is used to signal the frontend (editor and schematic) of a new project. I had to upload a file through request and also several parameters. For this purpose, a multipart/form-data request with boundary is used. It turned out to be a nightmare for me, as I kept getting format error. I took the multipart request format for granted as I have previously got it to work with Drive. However, sending a multipart request to Wt required more detail. For instance, \n must be accompanied with \r to properly “enter” a line. Also, single quotes are strictly prohibited.

Using window.onunload()

I discovered there is a jquery event ‘unload’ which I implemented in the frontend. My objective was to send some data to the storage backend when it is closed. I tried to use emit() during the event and of course it didn’t work, as the Wt application is closed. However, using a Ajax request is a different story. Due to it being asynchronous, the request can still send through, but don’t expect a respond :). For now, I used ajax request to send a few long strings. On a side note, I am very interested to see if it can send a jpeg (page screenshot) through the request.

Building a better interface with Wt

Honestly, I’ve always been skeptical towards Wt and it’s potential in building ‘modern-looking’ and responsive web application. This is mainly due to the existing example programs that aren’t very ‘appealing’ to the eye and lacks fluidity especially in animations.

BUT, I do admit that it greatly simplified the coding whenever it could. With just a few lines of code, a grid layout is created, with options to make it resizable, set its stretch factor and a lot more. The functionalities are definitely not lacking. I played with show() and hide() of a WContainerWidget in a WGridLayout to create a sort of interactive interface and the result was surprisingly good.

I must say that the journey to learn Wt isn’t smooth-sailing, but slowly I am getting better and the rewards are satisfying. Sometimes, I do wonder if there are vacancies for Wt Web developers in the market…

😕