niklasfink/ruml

A ruby to UML generator

ruml's Issues

Evaluate Javascript Ruby-Interpreter

Find a way to omit the Ruby part on the Serverside and compile/convert the input-ruby-code to DOT with pure Javascript.

Final Design

• change Button Text
• add Buttons for Load/Save from Cache
• scrollbars on UML Image
• add some animations
• seperate the coding part from the generator part visually
• some minor design changes

request handler

• handle the request
• receive the json-string

Requirements M1

Requirements Milestone 1

1. Story: Editor

Als User möchte ich Code eingeben können.
Damit ein Ergebnis angezeigt wird.

Szenario:

• Ich befinde mich auf der Webseite und habe ein Textfeld offen
• Wenn ich nun Code eingebe
• Und dann "Go" drücke
• Dann sollte ich ein Ergebnis sehen

Test:

• [x]

2. Story: Live-Ansicht

Ich möchte als User den Code, den ich eingebe, direkt als Ergebnis zu sehen bekommen.
Damit ich sofort sehen kann, was ich fabriziert habe.

Szenario:

• Ich möchte ein Diagramm erstellen
• Wenn ich nun Code in den Editor eintippe
• Dann möchte ich meinen eingegeben Code direkt übersetzt bekommen
• Und eine Live-Ansicht meines Diagramms sollte sichtbar sein

Test:

• [x]
  Siehe Webseite!

Setup GitHub repository and ZenHub for project management

Hola! @kilianeifler has created a ZenHub account for the niklasfink organization. ZenHub is the leading team collaboration and project management solution built for GitHub.

---

How do I use ZenHub?

To get set up with ZenHub, all you have to do is download the browser extension and log in with your GitHub account. Once you do, you’ll get access to ZenHub’s complete feature-set immediately.

What can ZenHub do?

ZenHub adds a series of enhancements directly inside the GitHub UI:

• Real-time, customizable task boards for GitHub issues;
• Burndown charts, estimates, and velocity tracking based on GitHub Milestones;
• Personal to-do lists and task prioritization;
• “+1” button for GitHub issues and comments;
• Drag-and-drop file sharing;
• Time-saving shortcuts like a quick repo switcher.

Add ZenHub to GitHub

Still curious? See more ZenHub features or read user reviews. This issue was written by your friendly ZenHub bot, posted by request from @kilianeifler.

Evaluation of Javascript Editors (Plugins)

We need an editor for our input area where the ruby-uml-definitions are written.

Should be:

• Good looking / themeable
• Ruby code highlighting
• Undo/Redo/Save
• Autocompletion
• Custom buttons (for export as png or whatever)

Therefore we need a comparison between different Javascript editor plugins. Maybe also take a look at angularjs plugins.

Corporate/Website Design

For a unique user experience, we need an incomparable presence.

Therefore, we should follow a structure like this:

• Create different MockUps.
• Discuss those MockUps in our team and determine the best ones.
• Define design guidelines (Button design, Colors, general appearance, font, Logo, T-Shirts, ...)
• Create a website based on the chosen MockUps (Home page, FAQs, HowTo, ...)

Requirements M3

Requirements Milestone 3

5. Story: How-To Seite

Als User will ich eine Art Tutorial haben.
Damit ich weiß, wie das Tool zu benutzen ist.

Szenario:

• Ich benutze zum ersten Mal die Seite
• Wenn ich wissen will, wie sie funktioniert
• Muss mir ein Tab bereitgestellt werden, auf dem ich mich informieren kann

Test:

• [x]
  Siehe Webseite!

6. Story: Diagramme exportieren

Als Nutzer würde ich meine Diagramme exportieren können.
Damit ich meine Diagramme in einem Bildformat verwenden kann.

Szenario:

• Ich habe ein Diagramm das ich exportieren will
• Wenn ich also in der Liste ein Bildformat auswähle
• Und auf Download drücke
• Dann will ich mein Diagramm im entsprechenden Bildformat besitzen
• Und damit weiterarbeiten können

Test:

• [x]
  Siehe Webseite!

Merge Design and Function

• merge the design with the full function

Basic functionality

• have an Input Area,
• can send a request
• get a result/answer -> display UML diagram

parse string

• parse the string
• prepare it for factoring the uml

Evaluate a dot-language to image mechanism

We need a client- or serverside mechanism to translate the generated dot-language to an image (diagram).
A clientside mechanism would reduce serverload, a serverside mechanism would reduce the footprint of the website (only relevant on mobile side).

Setup Build/Test Environment

We are going to use Travis-CI for our complete build process.
We are testing our page with Sauce Labs, what can do automated tests with selenium and over 700 different browsers. This is automatically triggered via Travis-CI, which is triggered on every commit to the master branch.

We will add badges to our README.md to indicate that the product is working.

All tools are free for open source projects.

Evaluate User Management System

We should choose a suitable User Management System for our project.
Should be lightweight.

Evaluate Build-Process and Test Environment

We need a build process and a testing framework for our development process.

User Management functions

• User should be able to create an account
• User should be able to login
• User should be able to logout
• There should be an admin user with access to advanced functions
• Users should be able to save UML diagrams
• User should be able to load UML diagrams

How to Video

for the lazy ones, you should be able to watch a short video that explain the syntax

How To Site

rUML How To.docx

Requirements M2

Requirements Milestone 2

3. Story: Text Highlighting

Ich hätte als Nutzer gern den Ruby Code verschieden gehighlightet.
Damit ich die einzelnen Eingaben besser erkenne.

Szenario:

• Ich erstelle ein Diagramm
• Wenn ich jetzt Ruby Code eingebe
• Dann soll er gehighlightet werden

Test:

• [x]

4. Story: Speicherverwaltung

Als User will ich meine Diagramme abspeichern können.
Damit meine harte Arbeit nicht verloren geht.

1. Szenario: Speichern

• Ich habe ein Diagramm erstell
• Wenn ich nun fertig mit meiner Arbeit bin
• Dann will ich das Diagramm abspeichern können

2. Szenario: Laden

• Ich besuche die Webseite
• Wenn ich an meinen bereits erstellten Diagramm weiterarbeiten möchte
• Dann will ich sie laden können

Test:

• [x]