bekroogle/pegedit

A browser-based tool for editing PEG.js grammars.

pegedit's Issues

Show errors

Grammar & parse errors should be shown in the output panel (where the user expects to see their parse results.)

Consider using Foundation alerts to style the error messages.

Also... just maybe, make the errors clickable, so that they take you to the offending spot in the appropriate editor.

Zooming of parse-tree

So far, I've not yet implemented the zoom-in and zoom-out buttons for the parse tree diagram . . . apparently, I'm not the first to have trouble with programmatic zoom in d3 either.

Provide build instructions in README.md

Right now, it doesn't say much.

It should mention:

• bower install
• bundle
• bundle exec compass watch

Create a "New File" button

Perhaps just let the user name it (with a modal) and then save it to localStorage under it's name.

Some settings should be saved

Once a user has selected a color theme or font size for an ace editor, that choice should persist via local Storage.

Gist name isn't loaded from localStorage

When closing and re-opening the browser, the access-token, editor contents are all preserved, but the editor reverts to PEG.js editor, so if one commits the changes, it goes in as a new file by that name.

Layout for small, mobile.

replace side-by-side layout with stacked panels for phone and portrait tablet users.

Enable changing filenames

Make the filename on the editor changeable, perhaps through double clicking or an 'edit' icon.

Track state of parser build for parsing/exporting

Don't let the user parse or export their parser if it hasn't been successfully built.

Reorganize menu UI

Consider placing all menu action at the top, leaving minimal UI for each editor (such as save/export buttons, zoom +/- buttons, etc.)

Add fullscreen mode for output

Add a mode (either full-screen, or just maximized overlay) for the output panel. The tree, in particular, would be much more useful if it had more real estate.

Triggering .click() reveals hidden buttons

If the topbar is collapsed (so that the #build_parser_btn and #parse_btn buttons are not visible, then any time they are programmatically clicked, the topbar expands to reveal the button.

TODO: Use another level of abstraction, don't trigger a click, just call a freaking function, funny guy.

File dropdown quits working after use.

After using the file dropdown to change peg files, it loses its dropdown-ability.

Set up Ace editor to do PEG.js highlight

Ace has the capability of importing textmate languages and themes, see: https://github.com/ajaxorg/ace/wiki/Importing-.tmtheme-and-.tmlanguage-Files-into-Ace

And there currently exists a textmate bundle for PEG.js: https://github.com/alexstrat/PEGjs.tmbundle

... so, put two and two together.

Tree View tab empty on return

After seeing the tree view, then changing to the console tab, executing the parser again, and returning to tree view, the d3 tree is gone.

Parse tree doesn't fit container.

When the SVG for the parse tree is created, it visibly overflows its container, #treediv.

Annotated errors for source editor

The PEG editor does have annotated errors (for grammar errors).

I'd like to add annotated errors for parsing errors too!

Output modes can break parse

Output modes: Tree View, Console, and soon-to -be-implemented Symbol Table should either have the option to be toggled or otherwise set up so that exceptions don't prevent parsing when grammars don't meet conventions for those features.

Node ellipses don't resize

Node ellipses fail to resize the first time the tree is built (on the enter set, I imagine). However, after parsing again, (the update set), they resize to fit text.

Sub-menus not scrolled to top

On my android tablet, in portrait view, I scrolled deep into my list of gists, then when I selected one, the list of files wasn't visible until I scrolled back to the top.

Add more parameters to url.

Include parameters to pre-select the following:

1. Which file from the Gist should be opened in the PEG.js editor?
2. Is there a file that should be used in the source editor?
3. Which treenav mode should be selected?
4. Which output tab should be set initially?

Move settings to right-side off-canvas

At the moment, both settings and file management are in a left-side off-canvas menu. It'd be best to move settings to a separate menu, perhaps a right-side one.

Committing killed my Gist!

After using URL parameters to load a gist/file, etc. . . I made a change, clicked commit, and began rapidly refreshing the page. It somehow renamed the file as all the files concatenated together, and then broke the gist.

When selecting it from https://gist.github.com/bekroogle, it gives me the "Whoops!" page. . . they can't find my gist.

Sample overwrites local storage

Every page load auto-loads sample one, thereby overwriting whatever was placed in local storage.

Automatic updates on parse tree failing

It no longer updates the parse tree.

Tree not centered when first generated

It's way off to the left.

More options for output

Create a separate options menu for each output view (Parser Output, Tree View, Console View, Symbol Table).

E.g.: Tree View could have the following options:

• Full Screen
• Collapsible Tree
• Pan/Zoom enabled Tree
• Pop Out
• etc. . .

Automatic parse tree generation

I've been wanting to have an option of kind of hands-off d3 graphical parse trees generated from PEG.js definitions without having to use special return statements to massage the tree... finally proved the concept.

see: https://gist.github.com/bekroogle/f54e557d0f491fda4b80

Inconsistency in identifiers

Mixed use of underscores, hyphens and camelCase need to be fixed.

top-bars don't collapse at medium size

on my tablet in landscape mode, parts of the top bars get stacked instead of collapsing gracefully.

Gists should load in a submenu

When clicking bekroogle's gists, the list of gists should be pulled up in a sub-menu, with a list of files as a sub-menu of the gists.

Note: I already set the files up as a sub-menu of the gists, but now want the gists to load that way too.

Key bindings in Firefox failing

Key bindings which have native use in Firefox won't rebind.

e.g. Ctrl-B opens bookmarks panel instead of building parser.

Parser output should scroll

It overflows its container. See below:

Anti-semantic identifiers

Variable names such as output which describes the second Ace editor (the one used for "source" or "parse strings") will complicate maintenance and discourage potential contributors.

Zoom buttons on source editor fail.

The '+' and '-' buttons for the source editor are doing nothing, but the ace options and parse buttons are working.

Keybinding conflict

Keystroke	Ace's binding	My binding
Ctrl-p	Go to matching brace	Parse

Simple on-screen help

It should be noted somewhere that the parse tree can be zoomed/panned using the mouse and/or touch gestures.

Parsing errors when switching between samples

When going back and forth between sample PEGs, it tries to parse the new string with the old parser, or versa vice-a.

Sample grammars

I need to include a couple sample grammars so people can get an idea of what it's supposed to do. I haven't decided whether to just include them in the project, or go through the trouble of loading them from the Gist API to simplify updates/changes.

Update Joyride

Significant changes have been made to the UI. The joyride tips and their positions need to updated to reflect this.

Zoom/pan target on tree is too small

in order to zoom or pan the tree using the mouse, the cursor must actually be over one of the paths in the SVG. it needs to be more forgiving, especially if there's no button zoom.

Allow linking to a specific pegedit gist.

Ideally, it'd be nice to serve it up as http:/domain/gistid, but i don't know if that's possible with current hosting solution.

Worst case scenario, I should be able to use a parameter in the URL.

Formatting in webkit...

On both tablet and desktop versions of Chrome/Chromium, the far right button on the top-bars displaced below the bar.

New View Mode: Symbol table

In addition to the current view modes: Parser Output, Tree View, & Console View, add another, Symbol Table

Unexpected behavior from modals

There are some issues with how the forms in the foundation reveal-modals are being handled.

Originally, I bound events directly to the button click. Perhaps it's a browser thing, but I was usding Firefox, where pressing return from the text input did nothing. Now that I'm back in Chromium, it's triggering a form submit.

I've started to implement the solution, but running into little bugs.

Auto-parse is too slow

At a certain point, auto parsing makes typing your source string rather laggy. I don't know if it's because the exceptions are drawn on the page in a foundation alert or whether it's because of redrawing the d3 tree, but something needs to be done.

Easy method: add an option to disable auto-parse.
Other: consider making parse run in the background so it doesn't block UX.

Run PEG.js and generated parser in Web Workers

These potentially blocking operations should be run asynchronously so they don't impede user interaction. See http://peg.arcanis.fr for an example.

Joyride and auto-sample loading kills url params

The URL params don't work for a first time viewer because joyride comes up and then auto loads a broken gist for samples.

Allow users to download their finished grammar

Look to dmajda's online version of PEG.js at http://pegjs.org/online for hints.

Use a callback for traversal

I had this thought a week ago, does it make sense?

To best accommodate multiple output formats and embrace decomposition, the traversal function needs to be removed from the grammar definition.

Right now, it's hard coded into the site's JavaScript. It should be replaced with a callback that the user can write in the page.