Martin Cohen @martincohen - Tumblr Blog

VS Code immature for C/C++ development on Windows

CURRENT STATUS: Don’t use VS Code for C/C++ production until you really really enjoy it’s other features.

This is not a rant post (except for one paragraph at the end), but rather a report on what to expect when you are considering using VS Code.

I’m trying something new this time. I decided to stay with VS Code for a while, even if it’s slowing me down, as opposed to leaving and never going back. So I’m filling and pursuing issues I find with C/C++ development, building and debugging. And here’s the current summary for VS Code 1.8.1 and C/C++ extension 0.9.3.

Features that I enjoy

Integrated shell (even integrated cmd.exe that I have customized) saves a lot of Alt+Tabs (especially if I keep several projects open).

Very simple every-day git features in the UI. (you can’t do everything, but basic add, commit, push and pull work quite well from the UI, even the merge/diff viewer is there)

Integrated MS debugger that seem to be shared with VS2017 itself. (It is a bit slow, but it’s quite okay for everyday debugging. I’d use VS for more hard-core debugging tasks.)

Not focused on C/C++ only. I can work on Python, Lua, HTML, JS with the same shortcuts. Most of them already offer debugger.

Very well polished UI that doesn’t distract.

Minimal need to have IDE-specific project configuration files (I only have very basic configs that I can just copy to other project).

Note that I use standard Visual Studio Compiler and respective Visual Studio debugger integration provided by cpptools . I haven’t tried gcc/gdb or llvm/lldb and I don’t plan to. Also I don’t look for code intelligence nor autocomplete, I just need Sublime-level of editing features with building (and optionally everyday debugging).

Grouping compile errors by file

Compiler output is fed into Problems view by grouping the issues by file, which is largerly unhelpful. In C you want to see the original order of issues from the compiler, as you almost always care about errors on the top of the list (that later propagate to the rest of the source code producing a flood of misleading errors). Therefore F8 (jump to next issue location) does not work.

Cursor in problems view

The cursor in Problems view is not reset after a new build, that means that jumping to next issue location won’t work if you already reached the end of the list. This also has a huge dependency on following issue.

Warnings produced for all files opened in VS Code

The Code Intelligence in cpptools (C/C++ plugin for VSCode) produces warnings like Include file not found in include directory for all files, especially for those that don’t belong to the project. I use code from my older prototypes and open the files in the VS Code, which causes Problems view to overflow with the warnings.

While normally I wouldn’t care, this causes the Problems view to never empty, which in turn causes the next-issue-cursor to never really reset, hence it doesn’t work after a new build. You have to go to the Problems view yourself (Ctrl+Shift+M) and hit Page-Up several times (as Home doesn’t work there).

Case-sensitive file path handling on Windows

Windows’ file system is case-insensitive, therefore you get paths with various case letters to be fed into the software. Programs usually deal with this by normalizing the paths, or simply by using case-insensitive compare (and only normalize slashes if they support both / and \). VS Code currently only handles paths as case-sensitive, which causes tons of problems.

New editors are opened for files with even slightly different paths, and each is being treated as a completely separate file. So if you change it, save it and then open the other editor (with the same file, but different case letters in the path) you’ll be forced to manually Compare and merge the changes before it allows you to save. This is extremely annoying and I already lost several changes.

The cpptools plugin is obviously feeding paths with essentially random case compared to Explorer (integrate file browser in the side-panel of VS Code), so each time you go to next issue, or stop on breakpoint, or click on call stack, there’s a good chance it’ll open a separate editor for the file.

I spent good amount of life on opening and closing issues in vscode and cpptools as they were each blaming the other. This obviously is best handled in the vscode itself as otherwise each of the plugins will have to provide own path normalization.

Minor issues

A very slow response times from Sublime. It’s not lagging, rather it’s a bit lazier than Sublime, even for typing. But that’s to be expected.

I’d expect to see Debug output console to be shown when I start debugging a file. This does not happen automatically. I’m yet to investigate whether I can configure it.

I’d expect to see Problems view to be opened after the build is finished (if there are issues). However, currently I’m happy this doesn’t happen and only the build task output is shown as I’m forced to use it.

Setting up tasks.json (for one-of tasks like builds) or launch.json (for setting up the debugger) rarely provides enough information on what went wrong, so you’ll have to debug problems with paths and syntax yourself. Luckily I only have to do this once and then copy the two files to my projects.

Some shortcuts like "Split Window" do not work. (I had to reconfigure them)

Bookmarks are provided as separate plugin. (Not a big deal, I'd just expect them to be in core)

WARNING: RANT! When you combine all the major issues together, the actual workflow in VS Code feels extremely comical, I even consider streaming it and making a (music) compilation video, just for the fun of it. (And because I remain extremely irritated with amount of lack of interest for basic and essential issues, while issues like "text label misaligned by 2px" are getting attention).

All these issues were reported, some of them got interest from the developers and some minors are even fixed in the dev branches waiting for release.

Simple smooth and stable camera-follow for games

In my latest game I’ve used a camera system that allows for very smooth, yet stable movements. I call it stable because it never loses the player no matter how fast he moves. It is probably a pretty common system, but I’ll write about it anyway, as it might help.

The camera uses an absolute point and a relative vector. The point is in the center of the entity the camera follows, and the vector represents direction (and distance) in which the entity is looking.

The image above shows the point at the player’s head, and the vector (of required length) that represents the look at. The circle represents the viewing distance. Camera is then simply set as:

camera.x = entity.x + entity.look_at.x camera.y = entity.y + entity.look_at.y

Each frame I set the look at to be at the natural direction (always forward from current orientation). When the player is on the ladder, I set the direction to go up or down (see image below), so it naturally follows player’s head and eyes.

Now the smoothness trick is in how the look at is updated. In my current system I have additional vector called look_at_smoothed, which is every frame calculated like this:

entity.look_at_smoothed.x += (entity.look_at.x - entity.look_at_smoothed.x) / 15 entity.look_at_smoothed.y += (entity.look_at.y - entity.look_at_smoothed.y) / 15

And the camera uses the smoothed version instead of the “hard” look at vector, so the camera code above changes to:

camera.x = entity.x + entity.look_at_smoothed.x camera.y = entity.y + entity.look_at_smoothed.y

So the final result (in work-in-progress game) looks like this:

#camera #tips #gamedev

Very cool technique to make 3D objects in 2D with layers.

Minimalistic 1-bit GIF animator: Paku

Paku is a web-based minimalistic 1-bit GIF animator. It’s in it’s early stage of development, and some more features are planned. However, even now it’s perfect for creating and tweeting tiny animations.

Use left mouse button to draw black pixel, right mouse button to draw white pixel.

With the ADD button you can duplicate the current frame and place it right after it. Paku allows you to add up to 16 frames.

You can see your frames on top of the canvas. You can switch between the frames by clicking on the circles, or with Left and Right arrow keys.

EXPORT generates an animated GIF, that you can either save to your computer, or even drag & drop to twitter. You can select from 4 speeds. You can return to editing with BACK in export window.

Some tips:

Currently nothing is being saved to any server, and nothing is being saved locally. So you can use browsers refresh button to reset the animation.

Because of the limited feature set, it’s good to plan ahead.

Sometimes it’s best to start with final frame and then work backwards (click ADD and go to previous frame with Left arrow key).

Use arrow keys to quickly check previous/next frame (a.k.a. poor-mans onion-skin)

Features I’m considering to add (tweet at me if you want to push them):

Storing the editing state in the URL.

Deleting a frame. Although I like the simplicity, deleting frames might come handy.

Reorganizing the frames. Either with copy and paste, or shifting frames forward/backward.

True onion skin.

Go pixel with Paku!

#Paku

#SoundCloud #music #martincohen #Electronica

Small executable size

Some links I’ve found

http://www.catch22.net/tuts/reducing-executable-size

http://www.codeproject.com/Articles/15156/Tiny-C-Runtime-Library

https://github.com/larryhe/tinyCRT

#gamedev #tips

Sketch: Color picker with multiple displays

My Sketch has a problem with picking a correct color code when I use a color picker. I figured that the reason is that my secondary display is using a different color profile, while Sketch is conforming to the default (which is the one from LCD display on my MacBook).

I used ColorSync Utility that is available on OS X by default. Normally, the factory and current profiles would be the same, however I’ve changed the current profile to Color LCD by clicking Open and selecting the corresponding file.

Now my color picker in Sketch works correctly, although my colors a now a bit brighter, but as a desktop/web/mobile/game designer, this is what I can easily live with.

#tips #mac

An excerpt from something completely different from my general music style. Tried to make a classic Zelda village mellow tune.

#gamedev #music

Space is the place. Again. And SoundCloud is now a place you can find sounds from the US government space agency, NASA. In addition to the requisite vocal clips (“Houston, we’ve had a problem” and “The Eagle has landed”), you get a lot more. There are rocket sounds, the chirps of satellites and equipment, lightning on Jupiter, interstellar plasma and radio emissions. And in one nod to humanity, and not just American humanity, there’s the Soviet satellite Sputnik (among many projects that are international in nature). Many of these sounds were available before; I’ve actually used a number of them ...

#usa

Concept number three.

#gamedev #pixelart

Making a timelapse video from Twitch.tv stream videos

This is mostly for future me, but some other streamers might find this useful.

First, I downloaded the videos one by one from twitch.tv using youtube-dl and this command: youtube-dl -R infinite -c --hls-prefer-native http://www.twitch.tv/martincohen/v/29855856

Then, for each video I ran a ffmpeg command: ffmpeg -i 1.mp4 -vf fps=1/5 -start_number 0 frames/%09d.png Remember to update the _start_number _so that the frames concat.

At this point I had a ton of PNGs. From that I made a final mp4 video with: ffmpeg -framerate 30 -i frames/%09d.png -c:v libx264 -r 30 -pix_fmt yuv420p timelapse.mp4

#tips

Looper’s first export.

#gamedev #looper

Concept art.

#pixelart #gamedev #art

Command mapping in Hale

I still feel stuck with how the commands (and therefore keys) are being handled in Hale. I decided to put it all out to a blog post to sort out my thoughts and concerns.

Requirement 1: Decentralized storage

What I want to achieve is to have one central place where all commands are defined. Simply one source file where you have all the commands for Hale one after another with their key bindings. Having the file separated also allows for it to be stored in multiple files randomly on the drive (whether in the bracket (project), user settings or package).

Requirement 2: Context sensitivity

UI commands depend on state of the application. Say “Copy to clipboard” command is only valid when there’s selection. “Close document” is only valid when there’s a document open.

Feature commands provide language-specific implementation for a common feature that uses the same key binding. For example “Wrap selection in comment” which, depending on the language of the document, provide the function for the user. Some languages do not have line comments (like old C or CSS), so the command has to behave quite differently. Another example is a general Build command.

Language specific commands provide features only available within one language or language group (say HTML and XML kind of belong to the same group). Typically in HTML, there’s a command to wrap selected text into a tag. But then Markdown doesn’t really need wrapping in a HTML tag, even though some implementations allow Markdown and HTML combination.

Scope specific commands depend on where the editing cursor currently is. For example you might want to turn double-quoted string to a single-quoted changing the escape sequences. Other example is when you want to jump from function’s declaration to it’s definition.

Bracket/user commands use the current bracket (project) opened or are generally specific to user needs. These are usually defined locally by the user and can override any built-in functionality. For example saving a Markdown document might also process it to HTML and upload to a web. That might not even save the Markdown locally, so the internal “Save” command is completely bypassed.

Requirement 3: Event handlers

I use word “command”, but in reality it’s just a piece of code that happens on certain event (in this case on predefined key press). Feature commands might be really implemented just as plain core-provided events (for example “wrap-selection-in-comment” event). This event might be launched from a central place (for example a command bound to a specific shortcut).

Requirement 4: Parameters and Console

With key-bound commands, you use the focus context as a parameter (the state of the application for the currently focused subject). A command can be written so that it can be launched in multiple contexts, it’s code might just branch out for different contexts (in the end the command is just a piece of code).

However, that’s not all. There is a group of commands that can be mapped to the console, by just assigning a name to them. In that case, you can just type the name to the console and command is launched.

You can pass parameters from the console to the command (very much like you would in a shell). Typically a “Save document” would first check if the document has a file path associated with it. If it has it proceeds with the saving. However if it does not, the command cannot proceed and has to ask for the path. Generally this is done by opening a dialog, but in Hale’s prototype this was done by sending the command to console, and user was expected to provide the path by typing it as a parameter of the command:

> save <where>

The console knows that the parameter expected is of type “path” and it was able to provide the path completion. I really loved this. As that allows you to have a whole new world of commands and interaction, all happening only with text.

Requirement 5: Performance vs. extensibility

Performance is of essence here, because everything should be defined as a command / event-handler to provide really global customization. This might even include critical pieces like reacting to a document change (after each typed character). And even if not, the caret movement is going to be done with this, so holding the “Right arrow” key would repeat. So finding the command for the current context has to be fast. Let me just say this: there has to be 0 latency. So the lookup has to be comparable to stupid switch/case statement.

From my experience, the amount of event handlers defined in Intype (my previous editor) was somewhere between 1000 and 2000. That was amount for almost 30 embedded languages plus internal commands (caret movements, editing operations; simply the commands from the menu plus some context variants).

Event handler’s structure

To make it more clear, this is a structure that was used to define each command in the Hale’s prototype:

id - (Required) Unique ID of the command, possibly a GUID or even a pointer to the structure.

name - (Optional) Human-readable to be used in the console. Although this can be also defined in the condition (below) as combination of ConsoleExecute event name, plus a name of the command.

title - (Optional) Name to be used in the UI, however the name can be used as well, and it’s probably better considering the mental mapping to the console.

origin - (Required) Tells where was the command defined. Origins are a fixed enumeration. The following list shows them in order. Further down the list, the higher priority in case of collision, although there might be different means of resolving collisions.

application - provided as a default by the application

package - defined by application’s package.

user - provided by the user in his global configuration file

bracket - defined by a bracket (the current project), current project is defined in any parent directory (so it’s bound to file path).

condition - (Optional) this is the primary information to determine whether the command is valid in current context. See the discussion below.

parameters - (Optional) similar to defining optional and required parameters. Handler can have required parameters, or parameters that are optional by default, but might be required depending on the context. Example is the “Save” command that can use the file path stored with the document, but if it’s not set, it will ask for it through console. Similarly to shell commands, parameters can be named or order-based.

code - (Required) the actual code to be ran. It’s a function that uses the context to get pointers to subjects it want to operate on and uses parameters to do it’s thing.

Event handler’s condition

It all comes down to how the condition for event handler (command) is defined and later used for the look up. Imagine it being a piece of code available for each handler. It takes the information in the event being fired and returns 1 if it’s valid and 0 if it’s invalid in the context.

Of course, collisions will happen, and how the collisions are resolved is determined by the nature of the event (by how it’s dispatch code works). Examples:

One handler has to be chosen for KeyDown event. For determining the best one I used a “score” to be the return value of the condition, instead a boolean. The score described how well the handler matches the condition. Is it a global handler that doesn’t really care where it’s launched (think “Save” handler), or is it a more specific handler for the current scope?

Multiple handlers can be run when the parsing is done, or when you change a document (to run additional analysis). At the time of writing this, I really think that running multiple handlers for one event is not really needed, but there might be things I’m not considering.

Final word

In the end, it all comes down to two things:

Simple way of defining event handlers and the conditions they are valid in.

Structure optimized for fast lookup based on the handler’s condition.

#hale

Pixel artist polygamy

A comprehensively incomplete list of pixel artists that I want to marry. Yeah, and no screenshots. Ordered by the amount of influence on my work.

rxi

Ludum Dare

Itch.io

GameJolt

dd.xn--i1

5734l3r.com

Managore

Ludum Dare

Itch.io

Alex Preston

HeartMachine

Backterria

Ludum Dare

Itch.io

GameJolt

Hydezeke

Flamberge

9.ar7k

Itch.io

Patreon

#pixelart

Some notes on parsing, PEG’s and it’s problems.

#hale

Good collection to provide examples on how LPEG composition and various problems in parsing languages are solved.

#hale

Trending Blogs

Recently Viewed Blogs

Martin Cohen