4 min Emacs screencast inspired by Bret Victor's Inventing on Principle

by magnars • 14 years ago

163 34 14 years ago

A note for the author regarding Dropbox's "uncool" headers: Adding `?dl=1` to the Dropbox link will automatically prompt users to download the file upon clicking, and save you from having to write the disclaimer asking users to right-click and "Save As..."

magnars8• 14 years ago

Ooh, very nice. I'll fix that straight away. Thanks!

chamakits• 14 years ago

This is some amazing stuff. As a fan of emacs, but having no experience with javascript, I would like to be able to recreate this personally, and possibly use this as my training ground. I know the purpose of the post is to show a short video of something impressive, but could you consider providing the code samples and maybe even a guide of the code?

Regardless of whether you can or not, it truly is some amazingly impressive work. Thanks for sharing!

magnars8• 14 years ago

I wrote a little bit about installing swank-js a couple of posts up. You can also check out all my emacs-settings on github https://github.com/magnars/.emacs.d/blob/master/setup-slime-...

The only thing missing there is the packages installed through package.el, which would be slime-js in this case.

And here's the code for the bouncing ball: https://github.com/magnars/blockout

stenmorten• 14 years ago

Cool, but how about the rest of the code, for the "game"?

mattdeboard3• 14 years ago

Oh man, definitely going to get this up-and-running tomorrow. This is awesome, potentially.

tikhonj3• 14 years ago

Wow, that is awesome!

I think it would be cool to combine it with a small JavaScript library that could make things like the transformation between animation and just drawing a path automatic. I doubt this would be too difficult, and it would make going between them much easier if you didn't have to change your code significantly.

There is no question that I'm using Swank-js for all my web development now!

magnars8• 14 years ago

Yeah, that would be pretty cool. I'll be making something along those lines to aid me while I'm making that bouncy ball into an actual game. I wouldn't know how to start making it general purpose, but as a wrapper around canvas and requestAnimationFrame it is definitely doable.

tikhonj3• 14 years ago

Well, I doubt you could make it arbitrarily general-purpose.

I was thinking about maybe building on top of some existing framework. I think there are various existing libraries that help you create shapes and animate them; I imagine you could make something very useful by hooking onto the various methods in a library like that.

sdgs86• 14 years ago

I've been a vim user since I was ten years old, but emacs is impressing me more and more. The learning curve for setting up some of these plugins is pretty high; does anyone have a tutorial so I can get this up and running?

tikhonj3• 14 years ago

Actually, most plugins are easy. The problem is with plugins that need to interface with external programs--getting both Emacs and some program, like a browser, to cooperate can be tricky.

I don't think there can be a general tutorial for setting things like this up. The issues with this plugin are going to be due to your browser or JavaScript engine; the issues with a different plugin are going to be due to LaTeX or GHC or whatever program you're interfacing with. So the problems are probably going to be unique to each particular plugin rather than uniform across all plugins.

jhickner• 14 years ago

I haven't tried it with swank-js yet, but most swank-related things work well with slimv, a swank client for vim: http://www.vim.org/scripts/script.php?script_id=2531

Aykroyd• 14 years ago

I love these kinds of demos. REPLs are great... it makes me want to go back to using emacs.

mark_h• 14 years ago

Awesome!! That guy is steadily doing some amazing publicity for emacs.

This is a "live" video he did, slightly longer at 18 minutes, but with lots of javascript refactoring, etc: https://www.youtube.com/watch?v=p3Te_a-AGqM

arnemart• 14 years ago

This was done as a lightning talk the night before the Web Rebels conference in Oslo in May. I was there, and Magnar completely killed it. Awesome stuff.

espeed• 14 years ago

This cool -- definitely digging into this tomorrow. I use swank-clojure every day, and it's incredibly productive to see real-time results as you type. I didn't know there was a swank-js. Is there by chance a swank-python out there somewhere?

CmdrKrool• 14 years ago

I haven't tried it yet, but this "Emacs IPython Notebook" that was posted a few days ago looks similar, and their docs say that it's "like SLIME".

http://news.ycombinator.com/item?id=4185960

http://tkf.github.com/emacs-ipython-notebook/

wavephorm• 14 years ago

Now he needs to do a 4 hour step-by-step tutorial on how he set up Emacs to do this.

magnars8• 14 years ago

The biggest problem for me was conflicting versions of SLIME.

Installing swank-js is a breeze with npm, but the installation instructions tell you to get the newest version of SLIME from their svn. That didn't work so well, since my clojure-swank already relied on an older version.

Simply installing slime-js from marmalade instead made all the difference.

As for my settings, they are public on github. https://github.com/magnars/.emacs.d/blob/master/setup-slime-...

Kototama• 14 years ago

I have the same problem. So how does ELPA resolve conflicting SLIME versions?

mattdeboard3• 14 years ago

This thread is a little stale but magnars' .emacs.d repo isn't quite sufficient to explain what's going on. Follow his instructions for installing slime-js and swank-js, then you'll need the ``setup-slime-js.el``.

I modified his version of it to decouple it from what I gather are a couple of his other repos (specifically js2-refactor, and another unknown). You can get it here:

https://github.com/mattdeboard/dotfiles-emacs/blob/master/se...

Simply put that file somewhere on your ``load-path``, then add ``(require 'setup-slime-js)`` to your .emacs/init.el. Reload everything, and you should be good to go.

Note that the in-emacs REPL is still pretty broken for me vis a vis entering code directly at the prompt. e.g. trying to enter an array causes swank-js to throw an exception. Not sure if that's because of my setup or not.

magnars8• 14 years ago

I see that you're actually creating your own slime-js-minor-mode-map. I'm guessing that was necessary because you didn't require slime-js before requiring setup-slime-js.

Maybe it will resolve your issue of you put this at the top of the file?

     (require 'slime)
     (require 'slime-js)

The swank-js documentation says it depends on js2-mode too. Are you using that? At least I have no issues with entering arrays in the repl.

msutherl• 14 years ago

SuperCollider is exactly like this, but for sound synthesis: http://supercollider.sourceforge.net/

baggers• 14 years ago

And there is an awesome Clojure interface for it called Overtone. http://vimeo.com/22798433

klawed• 14 years ago

Awesome! Emacs was my first love and while we still hang out, it's not like it used to be. But this inspires me to make some time in my life for more. Also, I love the keyboard clicks. Sounds like a Das Keyboard, to me.

thomasfl• 14 years ago

I can recommend Magnar's and Christian's emacs settings. All those fine tuned micro optimizations for emacs make you feel like a rock star programmer:

https://github.com/magnars/.emacs.d

agumonkey• 14 years ago

It's like an accelerated ride through emacs infos. Lots of straightforward valueable options. Thanks

edwinyzh• 14 years ago

Has Bret Victor expected his amazing Inventing on Principle presentation would inspired so many of us? Me included, check my profile :)

JoelMcCracken• 14 years ago

Really glad someone is doing emacs screencasts. Awesome job magnars!

justinhj• 14 years ago

Many people are. I did a couple for my eredis project that let's you interact with Redis over an elisp repl or create/edit tables dynamically in a buffer from redis keys etc http://www.youtube.com/watch?v=ZP0MOaRueHU http://code.google.com/p/eredis/ disclaimer: I am not as cool as magnars

4 min Emacs screencast inspired by Bret Victor's Inventing on Principle

Related Stories