danpersa / ascii-diag Goto Github PK
View Code? Open in Web Editor NEWASCII Diag is a tool that allows you to easily draw beautiful ASCII diagrams in the browser and render them as SVGs
License: MIT License
ASCII Diag is a tool that allows you to easily draw beautiful ASCII diagrams in the browser and render them as SVGs
License: MIT License
Whenever we select a connector, a properties section should be shown in the toolbar.
This section should allow to select the start tip of the connector and the end tip of the connector
Don't use functions in react components, as they are called on every render.
Examples of functions which are called too many times:
isConnectorToolButtonSelected
isSelectToolButtonSelected
isTextToolButtonSelected
isBoxToolButtonSelected
shouldShowBoxOptions
shouldShowConnectorOptions
Instead
Make the Handlers for moving de resizing the shapes a little big bigger, to make them more touch friendly
Rationale: Not all connectors are arrows. We should be able to have connectors without a tip.
Add line style for boxes
Right now, a connector is described by two points and a direction.
This is not accurate enough. As it is ambiguous and interpretable.
The problem was discovered when trying to parse a diagram.
The connector should be described by three points.
Force the iPad keyboard to appear when exiting text. Some ideas here
After creating a text and selecting it, a drag and move anchor is shown.
When dragging from the top left side of the anchor, instead of the text getting moved, the text gets deselected
Steps:
Create a parser which can take as input a text file representing a diagram and output an array of Shapes
Update the UI with e feature to import an ASCII diagram
Parse boxes, text, connectors with the default style
Parse connectors with arrows
Parse connectors with dashed and dotted lines
Parse boxes with rounded corners
Parse boxes with dashed and dotted lines
In order to make an arrow touch a box when rendered to SVG, the arrow tip the diagram has to overlap the box.
The correct behavior is that the arrow tip should only touch the box, not overlap it.
Add button to delete the currently selected shape, to make the app more touch friendly
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.