ZeroBrane Studio Lua IDE v0.50 is out

[drakmaniso]

@drakmaniso, pushed one-click changes. Give them a try.

I just did, and I'm afraid this won't do it for me...

The problem is that it adds a new layer of complexity: you have to click carefully to obtain the result you want (and the visual feedback is also complex, as there is two highlighted elements with different meanings). Even if I use it enough so that it becomes automatic, that layer will still be there, adding up with all the other little details that you have to take into account when working with a GUI.

What I like in "modern" editors like Sublime Text is that they help me concentrate on my work, by removing a great part of these little details. Most of the interface is straightforward, and has one simple function. The remaining functionalities are pushed out of the way, and accessed through means that don't interfere with the most important work: editing the code.

As an example, here's what Sublime Text does for file management in the side panel:

- A single click anywhere on a directory expand or hide its content. The selection is not changed.
- A single click anywhere on a file opens it in the editor, and select it in the file tree.
- If that click is with the right mouse button, in addition to the previous actions, a context menu is opened, with entries such as "rename", "delete", "find in folder", and so on.

This provides less functionality than ZBS, as for example there is no drag'n'drop and it's not possible to move a file to a different folder. It's also not possible to do file management with the keyboard without opening the target file. So this probably wouldn't work for ZBS, since file management seems to be important to many of your users. You'll have to see if your new feature works for them or not.

I'm sorry if I sound nitpicking or pedantic about this, I love UI design and I have some strong opinions about it... But one thing I know is that there isn't one single design that will correspond to every user. The use of plugins may allow to partially solve this problem...

Anyway, thanks for taking the time to look into this!

[SneakySnake]

I might be just missing something, but is it really useful to be able to select a file with left click?
At least on my system, I can't select multiple files in the project tree, and I can still get a context menu without selecting it first with a left click.

What I really miss is being able to open files in the project by textual search, which is a feature of almost any modern IDE.

This is very useful for example when some tool (e.g. grep) gives you an output with the file name and line number. You can almost instantly navigate there without having to manually search through your project tree.
I rarely even use the project tree or editor tabs where this feature is available, as it's much quicker to navigate the project this way.

EDIT: I see there is already an issue opened for this. I might try giving it a shot, as I really want this feature.

[SiENcE]

Here is the log of Monocle unmodified.

Code: Select all

Scratchpad error on line 1:
[string "(function()lights = require('m..."]:1: attempt to call global 'require' (a nil value)

Hm, I can't run it at all. I get "monocle.lua:277: attempt to call field 'triangle' (a nil value)". I'm running 0.9.0. Should I try with a different version?

It's 0.8.0 i think.

[paulclinger]

As an example, here's what Sublime Text does for file management in the side panel:

- A single click anywhere on a directory expand or hide its content. The selection is not changed.
- A single click anywhere on a file opens it in the editor, and select it in the file tree.
- If that click is with the right mouse button, in addition to the previous actions, a context menu is opened, with entries such as "rename", "delete", "find in folder", and so on.

I see. So the difference is really what happens after the left click (and that the item is selected after the right click). This should be possible with a plugin; I'll give it a shot.

This provides less functionality than ZBS, as for example there is no drag'n'drop and it's not possible to move a file to a different folder. It's also not possible to do file management with the keyboard without opening the target file. So this probably wouldn't work for ZBS, since file management seems to be important to many of your users. You'll have to see if your new feature works for them or not.

Indeed; the majority of those requesting file operations in the tree wanted to have drag and drop and in-place renaming. The rename is actually quite powerful: you can rename "a.lua" to "b/a.lua" and it will move the file to "b" folder and create it if it's not there.

There is another thing that I plan to implement: folder/project views. When you select a folder, I plan to show a dynamically generated page that includes information about files in that folder (and subfolders): defined/used functions, initialized/used global variables, file stats, and more (even things like "strings" in files can be included). It's not so much for symbol navigation (although these things will be cross-linked), but mostly to provide a high-level view of the project/folder.

I'm sorry if I sound nitpicking or pedantic about this, I love UI design and I have some strong opinions about it... But one thing I know is that there isn't one single design that will correspond to every user. The use of plugins may allow to partially solve this problem...

I agree; nothing to be sorry about and thank you for taking time to provide the constructive feedback. I do have strong opinions myself (also because I'm using it as well), but I'm always listening to what the users are saying as after using the IDE for a while I don't see the UI flaws anymore.

[paulclinger]

I might be just missing something, but is it really useful to be able to select a file with left click?
At least on my system, I can't select multiple files in the project tree, and I can still get a context menu without selecting it first with a left click.

What I really miss is being able to open files in the project by textual search, which is a feature of almost any modern IDE.

EDIT: I see there is already an issue opened for this. I might try giving it a shot, as I really want this feature.

Right; this is definitely coming. I have an early prototype, but it doesn't do what I want to provide yet.

[paulclinger]

As an example, here's what Sublime Text does for file management in the side panel:

@drakmaniso, I added a plugin that implements this functionality if you want to give it a try. You'll need the latest ZBS from github and also this plugin. You just need to install the plugin.

While I was working on the file tree, I also added a plugin that opens image files that several users asked about. It also requires the latest version of ZBS from the master branch.

[drakmaniso]

@drakmaniso, I added a plugin that implements this functionality if you want to give it a try. You'll need the latest ZBS from github and also this plugin. You just need to install the plugin.

Thanks. I did a quick test, and it seems to work nicely.

[OttoRobba]

> I can make a quick mockup of a few ideas for ZB, if you are interested

yes, I'm interested .

Better late than never? Do I get to blame my delay on my video card frying?

I did a quick mockup in Inkscape (I can send you the svg if you want), here is a side by side comparison, under Fedora20/Gnome 3. On the left, the mockup. On the right, the current ZeroBrane. Both using Monokai theme.

Click me to enlarge!!!!111oneone!

Now, this is a quick and dirty mockup and I'm sure there are many things in wxWidgets that are likely not allow it (which is sad) but I believe a few ideas are clear enough. First and foremost:

Code first, everything else second
Notice how ample the mockup feels in comparison.
"Oh, but you squashed them horizontally"
For my workflow, this is not uncommon. I'll usually have documentation on one side, the code editor on the other. Working with a smaller horizontal footprint also means that people using vertical monitors get the most out of it. Less visual noise allows a deeper focus - coding means reading and I'd rather not be distracted while I'm concentrating.

Keyboard driven workflow, mouse amenities
The gear icon (famous from Google chrome and others) invokes the menu with options. Being a programming tool allows you to get away with a slim gui because common commands are likely to be executed from the keyboard. Not sure what the command is? Go to the gear menu and discover it.

Files matter - but code matters more
On the left side you can see the filetree. It is dead simple - the address for the current folder/project is shown in a button. Clicking it allows choosing a different folder. Files and folders are listed below it. Creating a new file is as simple as clicking the "+" sign tab. Right-clicking in the filetree should offer more options (new folder, new file, rename, delete, etc...).

Advanced themeing
A nice thing is that working more with solid colors would allow a deeper customization of the interface by the user. Tabs should color themselves according to the background of the theme, the filetree could be customized independently and whatnot.

Room to expand
This is a quick mockup so of course, take all of it with a grain of salt. You could think of different ways to display the menu information, maybe adding more buttons next to it - perhaps a "play" button to execute the code. Just remember that less is more, always.
I know that software design is not easy and there are always constraints but I hope this gives you ideas on where to take ZB

[paulclinger]

@OttoRobba,

> Better late than never? Do I get to blame my delay on my video card frying?
> I know that software design is not easy and there are always constraints but I hope this gives you ideas on where to take ZB

This is great mockup and feedback! I already have been working on the changes based on the feedback from @drakmaniso and others in this thread and should be able to incorporate most of these ideas/suggestions.

Unfortunately there are some wxwidgets limitations that may limit the scope of the possible changes. And not just wxwidgets, but also wxlua that may not have all the methods that wxwidgets provides. The mapping requires some manual work and John L, the author of wxlua, adds methods on as-needed basis. The current limits are mostly related to the theming support and things like the gear icon.

I agree on the code-focused functionality, although I have to take into consideration interests of different groups, like experienced developers and someone who may be new to programming.

BTW, the filetree can be customized independently from the other colors. As I mentioned earlier in this thread, you can use "styles.auxwindow = styles.text" (or "styles.auxwindow = {bg = {r, g, b}, fg = {r, g, b}}") to set background and foreground colors of auxiliary windows (like the filetree, stack and watch windows). You need to have ZBS v0.50+. (EDIT: I realize you already set the color to the same color as the text, but you can also set it independently.)

I'm still working on the styling/theming changes and need to wait for a couple of wxlua updates to get access to all the settings I want to change. I'll update this thread when I have something to test.

[OttoRobba]

I've been using ZB for a couple of days. I figured that I should give it a second look.
Well, color me impressed. I knew that the general functionality of it was great but it has by far been the better editor for Lua. I kinda have to make it my default editor now. Kudos, it is a nice piece of software.

By the way, three things:

1st - That "Clean UI" is really close to what I'm using here - not a fan of the toolbar with the icons and would love to be able to turn it off. Looking forward to a release that allows that.

2nd - Is it possible to wrap lines in the output? I've attached it to the right side so I can view more of my code while still getting the output for any errors and debugging. Messages tend to get a bit long though and I find myself scrolling around.

3rd - Something that would be a killer feature would be showing code hints when inputting function arguments. Brackets introduced that for javascript:


View article on this feature
I imagine this would be great for bigger projects and modding.

4th - (Ok, I lied) Really happy with my current configs. Only one thing bugs me - The bright, white edge lines when something is folded. Is it possible to change this color? I tried the styles.fold options but they don't affect it.