Shop OBEX P1 Docs P2 Docs Learn Events
Visual Studio Code — Parallax Forums

Visual Studio Code

A little while ago, I came across Visual Studio Code (not to be confused with the Visual Studio, Microsoft's flagship dev tool). I've really enjoyed playing with Code over the past several weeks. A few notable features are:

* Very clean interface!
* Cross-platform (windows, linux, mac)
* Relatively lightweight
* Open source
* Has an ever-increasing set of extensions
* Actively being developed/maintained

To get a little deeper into the inner workings of the tool, I decided to write a simple extension that provides formatting any syntax highlighting for P2 code. If you are interested in trying it out, you can find it at

https://github.com/Seairth/VSCode-Propeller

So far, it's fairly simple:
* Ensures tabs are 8 spaces
* Syntax highlighting

Note:
* The repository doesn't yet contain everything necessary for compiling the extension.
* However, you will find a p2asm-0.0.1.vsix, which is an extension package. To install, just type "code p2asm-0.0.1.vsix" at the command line.
* caveat: the expected file extension is "p2asm", not "spin". "spin" can be easily added, but I was using "p2asm" to avoid confusion with P1 code that I have floating around.

In the long run, I'd like to add the following:

* Intellisense (or is it CodeLens?) integration
* Snippets for common patterns
* Custom theme for improved syntax highlighting
* Compile (requires improved pnut)
* Load binary (requires improved pnut)
* And more!
«1345

Comments

  • jmgjmg Posts: 15,140
    Looks a nice Editor / Environment.
    I use notepad++, and one feature I use a lot is column editing mode, and I see Visual Studio Code has added that.
    A quick read looks like it also can support debug, which could get interesting.

    Maybe you could list the improvements needed to pnut, and the operations that then enables ?
  • I will give it a try, I like to use atom.io, but visual studio code is similar
  • cgraceycgracey Posts: 14,131
    edited 2016-04-28 08:00
    Seairth, I downloaded and am running Visual Studio Code. I also downloaded your setup from github, but what do I do with it to get VSC to recognize it? I dropped your p2asm folder into VSC's resources\app\extensions folder, in case it was supposed to recognize it (like Sublime Text does), but nothing seemed to happen. VSC looks very nice. And this Microsoft app is open-source?
  • Chip,
    Yes, it's open source, You can find it here: https://github.com/Microsoft (vscode repository)
    They have a TON of open source code/projects in there.

    To get the extension installed and working you need to "run" the vsix file as Seairth said above: you will find a p2asm-0.0.1.vsix, which is an extension package. To install, just type "code p2asm-0.0.1.vsix" at the command line.
  • cgraceycgracey Posts: 14,131
    edited 2016-04-28 09:15
    Roy Eltham wrote: »
    Chip,
    Yes, it's open source, You can find it here: https://github.com/Microsoft (vscode repository)
    They have a TON of open source code/projects in there.

    To get the extension installed and working you need to "run" the vsix file as Seairth said above: you will find a p2asm-0.0.1.vsix, which is an extension package. To install, just type "code p2asm-0.0.1.vsix" at the command line.

    Thanks, Roy. I should have noticed that.

    Okay. It's running now. Looks good!

    Does this vscode IDE exist for things like C-Lang integration?
  • jmg wrote: »
    Looks a nice Editor / Environment.
    I use notepad++, and one feature I use a lot is column editing mode, and I see Visual Studio Code has added that.

    Yeah, my go-to text editor is usually notepad++ too. However, Code is beginning to take over for some tasks. Unfortunately, it's not robust enough to replace my use of Visual Studio, but that seems more to do with the extensions than the IDE.
    jmg wrote: »
    A quick read looks like it also can support debug, which could get interesting.

    Indeed! And since you write your own debugger to hook into it, I can see the potential for future "built-in" debugging of P2 code.
    jmg wrote: »
    Maybe you could list the improvements needed to pnut, and the operations that then enables ?

    That's a good question. At the very least, it needs command-line options to compile a file and load it to the P2. That would be enough to use Code on top of pnut for the things we are currently doing. Beyond that, I don't know if it makes sense to significantly enhance pnut or just write a separate assembler/compiler.
  • cgracey wrote: »
    Does this vscode IDE exist for things like C-Lang integration?

    Indeed! There's a wealth of extensions available, with more showing up every day.

    One thing I find interesting about Code, which seems to take some of its cues from Sublime and TextMate, is the ability to support multiple languages in a single file. The obvious use case for this is something like PHP and HTML, where each extension can focus on its own part of the file. But this could just as easily be SPIN and PASM, or C/C++ and PASM, or FORTH and PASM, or...
  • RaymanRayman Posts: 13,767
    This looks pretty good.
    Just like Visual Studio, the trick is to figure out how to write custom extensions for syntax and direct programming.
    One problem here is that people might expect the direct serial programming part to be cross platform, which might be hard...
  • cgracey wrote: »
    Seairth, I downloaded and am running Visual Studio Code. I also downloaded your setup from github, but what do I do with it to get VSC to recognize it? I dropped your p2asm folder into VSC's resources\app\extensions folder, in case it was supposed to recognize it (like Sublime Text does), but nothing seemed to happen.

    Yeah, I apologize for that. When I first created the extension, I though I'd try out TypeScript instead of straight JavaScript. While I am enjoying it, it appears you need a good deal of supporting code to generate the .js files that the extensions ultimately use. For some odd reason, the extension template provides a .gitignore that excludes the necessary folders. As a result, what's checked into GitHub is just the files that contain custom code. All of the boilerplate stuff that goes along with it is missing.

    Hence the inclusion of the vsix file. Had I included everything in the repository, you could have just copied the p2asm folder into Extensions and it would have worked.

    Right now, I'm debating whether to convert the extension to a pure JavaScript extension or figure out how to correctly include all the extra stuff necessary for TypeScript. Less is needed for the former, but my productivity will be higher with the latter. The vsix itself only contains the generated JavaScript, I believe.

    Regardless, Code (and the extensions) should make @Heater. happy, because JavaScript! ;)
  • Rayman wrote: »
    This looks pretty good.
    Just like Visual Studio, the trick is to figure out how to write custom extensions for syntax and direct programming.
    One problem here is that people might expect the direct serial programming part to be cross platform, which might be hard...

    That is a good point. Add cross-platform support to pnut's requirements. ;)

    Actually, though, there is another possibility:

    * Rewrite the assembler in JS and host it entirely within the extension. This would also allow better intellisense integration, reporting of compilation errors, etc.

    * Provide a command (or set of commands) to program the P2. I'm not sure how much of the code should be in the extension and how much should be in an external application, though. Also, I haven't looked to see if there's any baked-in way to connect to serial ports. There may be a node.js library out there to add support for that.
  • A note about the syntax highlighting: The extension does not directly control the color choices. Instead, it just names the components and the Color Themes set the colors for the names. From what I can tell, this is similar to the way that TextMate and Sublime work. But as I've never used either of those, I'm guessing that other's haven't either. Try switching the theme to see how the syntax highlighting looks. So far, I think "Kimbie Dark" provides the best out-of-the-box theme for viewing p2asm. But, as with all personal preferences, YMMV!
  • cgraceycgracey Posts: 14,131
    edited 2016-04-28 12:23
    About rewriting the assembler in Javascript... how would one do that? I'm thinking it would be one thing to code it, but another to make it conversant in the system. The latter part is more difficult for me to visualize.
  • One thing I've had a hard time figuring out is how to deal with SPIN sections (con, dat, etc). My original intent was to do two things:

    * Allow users to to do code folding at the section level.
    * Allow contextual formatting in the various sections. For instance, I wanted to highlight all instructions as invalid if they were not in a DAT section.

    Unfortunately, I am either hitting a limitation of the IDE or a am not able to grok regular expressions well enough to pull this off. For code folding, I have to specify a begin and end pattern. Unfortunately, the only thing that indicates the end of a section is the beginning of another section. But the code folding feature does not allow me to use the same pattern for both begin and end. This same issue is preventing me from providing the contextual formatting, as I cannot see a way to delimit each section.

    For example:
    1: CON
    2:         cfg = 1         
    3:
    4: DAT
    5:         org
    6: .loop   jmp #.loop
    

    How do I detect line 3 (or possibly line 2 as the last non-empty line of CON) using a regular expression?

  • SeairthSeairth Posts: 2,474
    edited 2016-04-28 12:38
    cgracey wrote: »
    About rewriting the assembler in Javascript... how would one do that? I'm thinking it would be one thing to code it, but another to make it conversant in the system. The latter part is more difficult for me to visualize.

    I 'm not sure yet. It looks like you would implement a Language Server (see this example) and provided Diagnostic information back to the IDE.


    Edit: Incidentally, having a JS compiler might open up some other opportunities outside of VS Code. I believe heater has mentioned the idea of a web-based development tool a number of times. Also, it could be used in the self-hosting development environment you want to do. That way, users can not only compile and run code, but they have the source code for the compiler itself!
  • Heater.Heater. Posts: 21,230
    Searith,

    Can't you define a regexp that matches any section name that is not the current section for the end pattern.

    start pattern for DAT section = /^DAT$/

    end pattern for DAT section = /^(CON)|(PUB)|(PRIV)|(OBJ)/

    Or something like that, I always have terrible trouble getting regexps to work.
  • Heater. wrote: »
    Or something like that, I always have terrible trouble getting regexps to work.

    That is probably because you are not using "The Regex Coach" :

    http://www.weitz.de/regex-coach/

    The best tool ever to interactively test regular expressions. Works on linux (wine) too.

    Maybe you will need to use the modifiers ( /m/ , /g/ ) for multiple line matching.
    With this tool and perl I have made HTML parsers capable of digesting a whole website and convert the information into a single CSV file.
  • David BetzDavid Betz Posts: 14,511
    edited 2016-04-28 13:35
    cgracey wrote: »
    About rewriting the assembler in Javascript... how would one do that? I'm thinking it would be one thing to code it, but another to make it conversant in the system? The latter part is more difficult for me to visualize.
    Was that really a serious suggestion? I'd offer an alternate approach which would be to rewrite it in C or C++ and then use Emscripten to convert it to Javascript. In fact, it might be possible to do that with Pascal as well if you're more comfortable with that than C/C++. Heater will probably know if there is a LLVM implementation of Pascal floating around.

  • Heater.Heater. Posts: 21,230
    Ramon,

    Never heard of Regex Coach. I just type reg exps directly into the Javascript REPL and see what happens:
    > var match = /^(CON)|(PUB)|(PRIV)|(OBJ)/ .exec("xyz");
    undefined
    > match
    null
    > var match = /^(CON)|(PUB)|(PRIV)|(OBJ)/ .exec("PUB");
    undefined
    > match
    [ 'PUB',
      undefined,
      'PUB',
      undefined,
      undefined,
      index: 0,
      input: 'PUB' ]
    > 
    

    Or test them in https://regex101.com/
  • Heater.Heater. Posts: 21,230
    cgracey,
    About rewriting the assembler in Javascript... how would one do that? I'm thinking it would be one thing to code it, but another to make it
    conversant in the system. The latter part is more difficult for me to visualize.

    One could just write the guts of the compiler as a JS function. It would take the source code in as a string, or an array of strings, and return the binary and error messages etc.

    Then that function can be used by anyone how they like.

    Another approach would be to write the thing as a normal C or C++ command line program which reads source files and writes binary as usual. That can then be compiled into Javascript using Emsripten. Which can then be used in the browser, under node.js, in an IDE or whatever. Like we do for the Openspin compiler.

    The advantage of having the assembler written in C/C++ is that it will run anywhere that has a C compiler but perhaps not a JS environment. It will have best performance as natively compiled C/C++ anyway.


  • Heater. wrote: »
    cgracey,
    About rewriting the assembler in Javascript... how would one do that? I'm thinking it would be one thing to code it, but another to make it
    conversant in the system. The latter part is more difficult for me to visualize.

    One could just write the guts of the compiler as a JS function. It would take the source code in as a string, or an array of strings, and return the binary and error messages etc.

    Then that function can be used by anyone how they like.

    Another approach would be to write the thing as a normal C or C++ command line program which reads source files and writes binary as usual. That can then be compiled into Javascript using Emsripten. Which can then be used in the browser, under node.js, in an IDE or whatever. Like we do for the Openspin compiler.

    The advantage of having the assembler written in C/C++ is that it will run anywhere that has a C compiler but perhaps not a JS environment. It will have best performance as natively compiled C/C++ anyway.

    Is there an LLVM implementation of Pascal that would work with Emscripten around that Chip could use? I get the impression that might be more comfortable for him than C/C++.

  • Heater.Heater. Posts: 21,230
    Not as far as I know. But one can build Pascal programs into Javascript with http://smartmobilestudio.com/ which even has a free version for Windows and Mac only though.

    A quick google reveals there are other Pascal to JS compilers.
  • Actually, why not just use Dave Hein's P2 assembler? I think he said that it was up to date except for the new smart pin instructions.
  • David Betz wrote: »
    Actually, why not just use Dave Hein's P2 assembler? I think he said that it was up to date except for the new smart pin instructions.

    This one?

    @DaveHein, I don't suppose that's available on GitHub (or similar)...

    Also, whether using dave's tool or pnut, is there a way to load a binary file from the command line?
  • Seairth wrote: »
    David Betz wrote: »
    Actually, why not just use Dave Hein's P2 assembler? I think he said that it was up to date except for the new smart pin instructions.

    This one?

    @DaveHein, I don't suppose that's available on GitHub (or similar)...

    Also, whether using dave's tool or pnut, is there a way to load a binary file from the command line?
    If it would be useful, I could probably revive p2load so it works with the latest images. I'll just need to get Chip's code for his second-stage loader.

  • David Betz,
    If pnut still works the same as before, then only the "wrapper" stuff is delphi (which is not really pascal, it's derived from it). The actual guts of the compiler is in x86 ASM (using TASM to assemble it into a lib that Delphi imports).
  • Roy Eltham wrote: »
    David Betz,
    If pnut still works the same as before, then only the "wrapper" stuff is delphi (which is not really pascal, it's derived from it). The actual guts of the compiler is in x86 ASM (using TASM to assemble it into a lib that Delphi imports).
    Yeah, I knew the assembler was written in x86 assembly. I just thought that if Chip were going to write it over in a high-level language, he might prefer Pascal to C/C++. I guess the best approach would probably be to get you to create OpenSpin2! :-)

  • Heater.Heater. Posts: 21,230
    What can we do to drag Chip into the 21st century? Writing compilers and assemblers in x86 asm now a days is nuts.

    Pascal is nice and all, but it has had it's day.

    Surely we can get him up to 1972 (C) or 1979 (C++).

    OK, I can see why he might rebel against that.

    How about 1995 (Javascript)?

    I thought that with OpenSpin the dark ages were over.

  • RaymanRayman Posts: 13,767
    I think javascript might be too slow.
    There was a time when you'd want it in assembly to be fast.
    But, these days I'm not sure you'd notice if it were C++ instead of assembly...
  • Rayman wrote: »
    I think javascript might be too slow.
    There was a time when you'd want it in assembly to be fast.
    But, these days I'm not sure you'd notice if it were C++ instead of assembly...

    I think Heater would disagree with you about performance. Besides, even if a JS version were demonstrably slower than a C/C++ version, does it matter that much? My guess we are talking a difference of seconds.
  • cgraceycgracey Posts: 14,131
    Roy has already transcribed and improved the Prop assembler into C**.
Sign In or Register to comment.