pylover/adia-live

Demo page for https://github.com/pylover/adia.

adia-live's Issues

Fancy scrollbars

Just a fancy scroll instead of default browser's one.

Mobile friendly GUI

Or show a proper not supporting message.

Show/hide Line numbers

Lint

ADia version is not appears in /about page.

pending on pylover/adia#43.

Unexpected white area at the bottom of the splitter.

Scroll down the page to see it.

Open file tool: review enabled state

Hide textarea scrollbars without miss the scroll functionality.

Good error message when JavaScript is disabled.

Examples gallery

A gallery page to show the various aspects of the ADia.

Analytics

https://clicky.com/ seems promising.

Highlight the current source code line

Disable spell-checking for both textareas on the ADia.svelte component.

Copy function

A button to copy the right textarea content into the cripboard.

Reset button for ADia component

To reset the source code to the default.

Vertical Scroll on source area.

The vertical scroll bars are not matching when the text ends with the newline.

Syntax highlighting.

Syntax highlight defnition for the ADia language is already defined at https://github.com/pylover/prism.

Use svelte special elements for scripts inside head

Web worker

How about move the ADia process into a web worker?

The color palete

GUI

$bg-verydark: #1f1f1f
$bg-dark: #2d2d2d
$bg-light: #393939
$fg: #e7e8eb
$jingool: #4c4359
$mangool: #5a9e70

Syntax Highlight

$hl-keyword: #1e90ff
$hl-comment: #008b8b
$hl-attr: #4682b4
$hl-op: #ff69b4
$hl-text: #d3d3d3
$hl-module: #e9967a
$hl-return: #a9a9a9

Put the adia-live version on the /about page.

Render diagram

Zoom for diagram area

Download the content of the right side text area (generated diagram) as a plain text file.

A save file dialog which allows the user to name the saving file.

Show the message when browser is IE and or Edge

For example:

Oh Sorry!

We're not taking care of the Microsoft browsers. So, you have two options:

1. Make your own ASCII diagram service for your environment.
2. Use Google Chrome, Firefox etc...

We strongly recommend the second option.

Status bar

VIM hotkeys

Popular VIM hotkeys should be implemented:

h j k l o y p x d

Rename the project to adia-live

List of all contributors inside /about page.

Call Github API to get a list of contributors.

Loading for about page.

Display loading message before loading docs/index.json and jsdist/index.json.

Load file from the local computer into leftside textarea.

A file open dialogue which allows user to choose a text file with .adia extension to load into left side textarea.

Use buttons for download dialogue.

Page title

Specofy title for each path

Download the content of the left side text area as a plain text file.

A save file dialog which allows the user to name the saving file.

Open file tool: Confirm before reset the source area content.

Disable text wrap for diagram text area.

Persistency

It would be great if the data inside the left (editable) text area became persistent (storing in local storage, etc...) and restored after a refresh or every time the page opened on the same browser and the same machine.

It helps users to not lose data accidentally.

Fullscreen

A fullscreen button to make the ADia component fullscreen.

Line numbers for left side text area

Remove package-lock.json from version control

Move reset css into global.sass

Automatically set the filename by the diagram's title before download.

We can grab the filename from the first line of the source code and or output ASCII diagram.

diagram: foo
...

Readme

• About
• Install
• Contributing

404 page

Use svelte store for source code

Change component by pushState