a3994288 edited this page May 5, 2017 · 48 revisions

Each UCOSP participant is asked to log all the steps they take as they make progress through the semester. This includes difficulties they faced (getting set up, understanding how to model in Umple, using UmpleOnline, code that is difficult to figure out, and development tools that are hard to figure out, or don't seem to work properly). The more log entries added the more we can better get a grip on the usability issues with Umple, and the more we can help future new contributors come up to speed.

Please record entries in reverse chronological order

Log Entries

27-Apr to 2-May

Working on code refactoring and documentation.
I am trying to rewrite some of the code I wrote before, hopefully, it will look better this time. A PR was submitted.

12-Apr to 15-Apr

This is the last week that I am working on the project before the final exams. During this week, I've fixed all the known bugs, and I implemented all the elements of the state machine. Auto-layout of state machine works for some cases but still needs improvement.

I've pushed all the changes to my branch to that Tim and Vahdat could test on it to see all the features, and I will work on the code refactoring and documentation when I finish all my exams.

4-Apr, 6-Apr, 7-Apr

  • fixed bugs
  • wrote the editable UML state (works like the class object)
    • making changes in graph won't affect the umple code for now
  • still working on the auto-layout and links overlapping issues.

Plans for the next few weeks:

  • week of 10-Apr:
    • fix known bugs
    • improve the layout and the display of nested state machine
    • Editing state machine diagram will update the umple code (not sure)
  • week of 17-Apr: Exams
  • week of 24-Apr: code refactoring, documentation, and final PR.


  • fixed bugs
  • JointJS class will use the background color that received from server
  • Undo function is partly working
  • hightlight umple code text when item is clicked

I will start working on state machine next week.


  • fixed bugs
  • edit/display methods of classes
  • Now umplecode --> graph and graph --> umplecode are using the same JointJS object

22-Mar-2017 - 23-Mar-2017

  • Now the locations of elements are saved. The locations of the end points of the links are not saved because it is not supported by JointJS. More details are discussed in issue#600.
  • elements are changed back to their default color.
  • delete functions are added to associations and generalizations
  • some other minor bugs fixed
  • I don't have a lot of updates because of some tests of other courses I have this week.

13-Mar-2017 To 17-Mar-2017

  • Fixed JointJS link element display issue
    • Spent some time to debug and I found the outdated jQuery library is the main reason that JointJS element didn't display properly, so I send a PR to update the jQuery library.
  • edit in JointJS elements
    • Followed this Link, I wrote my own UML Class element for umple: joint.shapes.umpleuml.Class.
    • It creates a custom JointJS view that render HTML.
    • It allows the user to edit class names/ associations/ generalizations.
    • You can also drag an element over another to create generalization
  • Issues
    • I still need to do some coding to make sure my part works well with Marc's, and I will send a PR when they work fine.
    • The layout of the graph is not saved properly, I will work on it next week.
    • The default color of the element should be changed back to black/white, and the user will be able to change it.
    • I should also work the adding/editing method in the JointJS elements
    • Also, 'Undo' function is not working properly for JointJS

8-Mar-2017 To 10-Mar-2017

  • edit JointJS graph:
    • open a dialog beside the class object when click the class.
    • edit the class name/attributes (umple code will be updated)
    • add association to graph (default is --) (umple code will be updated)
    • add generalization to graph (the first one is clicked is the parent) (umple code will be updated)
  • bug fixed
    • change paper size when browser windows size changed
  • bug
    • red 'x' should be displayed when remove association. This feature is implemented in JointJS already, some code in umpleonline disabled it. Still investigating.
  • reference


  • I've implemented the following basic functions for a class:

    • add class to paper
    • edit class (name only)
    • generate umple code when adding/editing class (only works for name now)
  • I've fixed the bug with jjspaper size when window is resized.

  • My plan for next week:

    • improve the functions on the class (methods, attributes, etc.)
    • expand the functions on class to other objects (association, generalization, etc.)


  • Function added: draw classes/associations in graph
  • Still working on editing the class in graph.

19-Feb-2017 - 23-Feb-2017

  • closed issue #682, merged the PR, and created a new issue with before/after statements
  • on my own computer, I've tried to build the UML diagram with JointJS. I am able to drag/drop object to the canvas, parse the graph to JSON, edit it and rerender it, which are the basic functions for umple. I am still working on linking those functions to umple online, and I should have some functions (drag/drop object into the graph) implemented in umpleonline before tomorrows' meeting.
  • when I am able to draw the graph in umpleonline using tools, my next step is to sync the umple code with the graph. It doesn't look hard because Marc has already written a jjsParser.js to parse the response from serve to JointJS graph. My code should be very similar to his (maybe I could just reuse some of his jjsParser).
  • to keep the consistency, I will still use the draw tools in the center of the web page to select objects(class/Association/interface/etc.). If any additional options are required, I might use the property box in the graph(discuss it below).
  • one of the function I am still not sure how to implement is editing the UML in the graph. JointJs doesn't seem to provide the function that allows you to edit the objects(class name/function/attributes) in the graph out of the box. It is complicated for me to implement this feature(I will still take a look). So, I think when the user clicks any object without dragging, I will pop up a property box beside it and the user can modify the object in the box as he wants. The graph will be rerendered when the user clicks ok.


  • Still trying to figure out how to edit the diagram using graphical tools. When I click a tool (like Class/Association...), method Page.togglPageToolItem is called. But I feel hard to understand how to create/drag the item in the canvas. Still need to spend more time reading the code before I can write code.
  • I also realize that when I make change on the graphic, I should be working the following methods to update the text.DiagramEdit.doTextUpdate, Action.updateUmpleTextCallback
  • I found the bug with background focusing is this code in umple_action.js. It set a click listener to focus on jjsPaper, but there is not a blur listener to unfocus it. Should be easy to fix.
  jQuery("#jjsPaper").click(function(){ Action.focusOn(Page.umpleCanvasId(), true);});


  • working on issue #682: the original bug in the issue was fixed. However, because before/after statements do not support methods, it creates some new bugs. I am discussing those issues with Vahdat.
  • discovering how to edit the diagram (class, association) using graphical tools so that I can apply it to JointJS.

4-Feb-2017 To 11-Feb-2017

Not able to make progress due to personal reason, and I will catch up next week.


As discussed with Vahdat, here are the spots I should work on with JointJS:

  1. Edit on the graph (like add class, association and etc.)
  2. When changes made in the graph, it should also change the code.
  3. Editable HTML in the element (like, change the class name, type, attributes name, and etc.)
  4. A prettier styling for the elements. (font size, color, and etc.)
  5. a small bug to fix: when selecting the background, the focus is grabbed (yellow border), however, when de-selecting, the focus is still there (or I should say the yellow border is still there).
  6. highlight the respective code when clicking on the element.
  7. state machine (Marc has done the basic functions)


Read comments in issue600 (https://github.com/umple/umple/issues/600)
Read Marc's log (https://github.com/umple/umple/wiki/UCOSPLogMarcdeNiverville)
Read Marc's commits to understand how everything set up. (They're great but not easy to understand :(, might need another few days)


  • fixed bugs of #682 and added tests for it. (we are supposed to add tests for any bug we found & fixed).


20-Jan-2017 - 22-jan-2017 (Sprint)

  • fixed issue #771: the issue was easy to fix, however, I spent hours to figure how the reason of the txt file I created won't parse to HTML properly for a warning message. Here are some spots to check if you have the same issue:

    1. Make sure the @@example has no space after it.
    2. Ensure the file is using Unix line endings
    3. Check the permissions for the two example files you have added.
    4. Try running ant -Dmyenv=local -f build.umple.xml packageDocs

    I eventually got it fixed by creating a new txt file with vim instead of gedit, I believe that was gedit created some issues.

  • working on issue #681 (almost finished),: after investigating, I realize the issue is no longer exist(fixed by some other student), however, there is some related issue, I know how to fix them, and I am just waiting to confirm that my design is correct.

  • chose my term project: using JoiuntJS to make the UI of UML looks better and more powerful in umpleonline. this project requires to know basic umple architectural, and web development skills.

January 15th

My environment is ready and I have picked two issues I am interested in, they are:

Tim commented on the issue(#673) that we should focus on something else instead of issue #673.

Issue #771 was assigned to me by Vahdat, I started to investigate this issue.

The issue(#771) itself is pretty straightforward, and Tim suggested that we should return a warning when we have duplicated method names. I am not sure where to make the change/fix/test so I am reviewing https://github.com/umple/Umple/wiki/Architecture and other documents to have a better understanding of the development process.

January 14th

  • Build&Test: tried the fix that Ahmed Mohamed gave us for the "cruise.umple.cpp.gen" issue. All tests passed except for those are skipped(Vahdat told us not to worry about them) issue #948
  • My environment is all set, and I am ready to read some interesting issues and fix them, I will post some issues I interested in tomorrow.

January 11th

  • Build: ubuntu-14.04.5-desktop-amd64, Oracle VM VirtualBox
    • rvm package by ubuntu is broken, follow this link you will be able to re-install rvm: https://stackoverflow.com/a/9056395/497756
    • to use rvm 2.2, you need to install "rvm install ruby-2.2.6"
    • however, I cannot build by using 2.2, instead, 2.3 works.
    • all build success after reinstall rvm
    • umpleOnline setup successful.
    • When I tried to it in Eclipse(Neon.2 Release(4.6.2)), one error showed in cruise.umple.nebula/src/cruise.umple.core/Generator.java: "The import cruise.umple.cpp.gen cannot be resolved"
    • tried to run the tests in Eclipse, tests failed.

January 6th

  • Reading

    • read logs from former groups of students to have a brief idea of the process
    • read user manual
    • tried some of the examples in umpleOnline
  • Setup: https://github.com/umple/umple/wiki/DevelopmentSetUp

    • Tried to follow the instruction to set up the environment using Ubuntu 16.04.1 LTS, got many errors on Step 1 because of php, rvm.
    • Downgrade the system to Ubuntu 12.04.5 LTS, Step 1 worked fine except for this command: "rvm use 2.2" (unknown ruby interpreter version: 2.2)
    • I ignored the previous error and keep working on step 2. The first two builds were successful, and the build failed when I run "ant -Dmyenv=local":
      error: /home/chang/Documents/umple/build/build.testbed.xml:212: Execute failed: java.io.IOException: Cannot run program "rake" (in directory "/home/chang/Documents/umple/testbed_ruby"): error=2, No such file or directory
    • after searching on the web, I didn't find any useful solution, will update the solution after the teleconference
Clone this wiki locally
You can’t perform that action at this time.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.
Press h to open a hovercard with more details.