We created a game called “Interdia”. This is a web-based game working as a web-site. One of the game components is text-based (MUD) quests. Player moves from one screen to another choosing available actions (you can access quests here [login to view URL] – just switch localization to EN and select “Quests” button).
For quests creation we use an editor (the same site, “Editor” button) in which an author creates quest structure. Creation process is similar to development of a flowchart. User add action and condition blocks and sets up conditions of their rendering in the game. Blocks and actions are connected with arrow lines. Blocks can be dragged and moved by mouse.
The editor is built on jQuery. Data for a quest is queried from the server and received in JSON format. Arrow lines are in SVG format. Our problem is that the lines do not flow around the blocks and direct through them instead. This is not cool.
What you have to do:
Create a jQuery plugin we can connect to our editor. The plugin shall draw beautiful lines. The “beautiful” means:
1. Lines of different colors.
2. While connecting two blocks lines must flow aside other blocks. Intersection with other lines is acceptable (1).
3. When a line changes its direction the bend should be rounded (1).
4. When user drag and drop a block the lines should be redrawn (lines may not be “beautiful” when block is being moved, however in this case a direct line like we have now should be rendered).
Plugin must accept at least the following parameters:
1. Line thickness.
2. Arrow form.
3. Set of colors that will be used to draw the lines.
How blocks must be connected:
1. Currently places where lines enter the blocks are calculated from block sizes. Lines ingress via left side – all to the one point (2). You have to change it to ensure that lines ingress in optimal points (3) – e.g. we can use a set of anchor points to which lines will connect to.
2. Lines must flow around the blocks and not crossing them. If the block A is located over the B block then line AB should ingress from the top not from the left side (4, 5, 6).
Egress points are stationary you don’t need to change them.
Also the algorithm must be documented, at least in code comments. Work will be considered sufficiently documented in case all employer questions are answered.
Please send your bids and terms. Thanks.
6 freelancer đang chào giá trung bình $182 cho công việc này
Hello, I have 6+ years of experience in Website and Application development. I have checked The requirement and understand that as well. I have created SIMILAR in past. Do you want to see the DEMO ??? Thanks.