Tuesday, October 30, 2018

BASIC and the joy of little improvisational programs

Daring Fireball just posted a link to a 2014 article, TIME Magazine's Fifty Years of BASIC, the Programming Language That Made Computers Personal. As Gruber puts it
For those of us of a certain age, a BASIC prompt was what you’d expect to see when you turned any computer on.
This article is the best I've read on the subject (marred slightly by the amount of ads on the page) In particular, I hadn't realized how important it was as computers moved from the batch process punchcard era to the expectations of real-time interaction we enjoy today - and of getting students to realize that programming was something that mere mortals could do.

That was in the 60s - in the 80s, BASIC was the bedrock of home computers - and most kids were given a chisel and some other basic tools so that if they were motivated, they could get the computer to do whatever they wanted.

The article briefly touches on BASIC's detractors. But as my friend Jeremy Penner (founder of everyone-can-and-should-make-games celebration site Glorious Trainwrecks ) mentioned to me, line numbers, while limiting in many ways, are a super intuitive way to get a kid making that first step of "computer programs tend to go step by tedious step". I think Dijkstra infamous complaint "It is practically impossible to teach good programming to students that have had a prior exposure to BASIC" is way out of line; understanding simple step by step flow does not preclude later learning of modularity and other more sophisticated topics.

As Harry McCracken writes:
BASIC was so approachable that you could toss off little improvisational programs with barely any effort at all. I probably wrote hundreds of them in my high school’s computer lab—games, utilities, practical jokes to play on my classmates. Most were meant to be disposable, and unless any of them show up on forgotten floppy disks at my parents’ house, almost all of them are long gone.
That hit home for me. In the 2000s, that's sometimes my style for stuff in Processing and P5.js (though I'm a bit of self-absorbed nerd so I archive "the good stuff" at toys.alienbill.com.) Other people I know, like Anna Anthropy write books about writing your own games in Twine, Puzzlescript, and Scratch.

But it's still a long way from the "booting into BASIC" days - Mac/Windows/Phone environments are great program launchers, but don't have that ramp into "you type things and computer stuff happens!" Also, the gap between "real" programs and what an amateur can write is MUCH bigger than it was in 1980s - especially for games. "Casual" games are a welcome exception to that, but a beginner programmer usually isn't using a toolset for 3D stuff.

(An upcoming thing I'll be keeping an eye on is Dreams for PS4 - "a space where you go to play and experience the dreams of Media Molecule and our community. It’s also a space in which to create your own dreams, whether they’re games, art, films, music or anything in-between and beyond." That's the same folks who made LittleBigPlanet which had a pretty rich online maker community too, so it'll be neat to see what comes of it.)

Thursday, October 25, 2018

wator and recreational computing

I've implemented a version of A.K. Dewdney's Wa-Tor from Scientific American's "Computer Recreations" column - it's a simplistic Cellular Automata-kind of thing, a simulation of sharks eating fish on a donut-shaped world (generally mapped onto a simple grid) You can see my version here. Kind of hypnotic!



I was partially inspired to get back to this by my UI Book Club where we just finished Edward Tufte's "Envisioning Information". It reminded me of a Windows 3.1 Version I messed with in college... in particular, it had a population graph that's always stuck with me, something like this:
I can't think of many graphs with a time element where time isn't just slapped on the X-axis - it's kind of cool how you can follow "time" as it makes its curvy path. It turns out this basically a "phase diagram" corresponding to Lotka-Volterra equations, the math that predicts predator-prey relations.

"Computer Recreations" was a big influence on me as a kid. The whole concept of recreational computing, programming for fun, is something that's been lost a bit. The home computers then were slow and with almost no memory and generally primitive, but you had full access to the machine. For kids in the era, even if you just used the computer to play games, you entered a BASIC command to load the game, and you probably learned a smattering of BASIC in school, and learned that you could make these computers follow your instructions and make original stuff.

Anyway, I wrote it in P5, and the code could serve as an example of having 2 P5 apps communicate a bit, even though the whole thing is a bit quick-and-dirty.

Tuesday, October 23, 2018

Wednesday, October 17, 2018

javascript: generations

I updated my photo mini-gallery maker so that clicking on a thumbnail will scroll to that image - I didn't realize el.scrollIntoView({behavior:'smooth'}); was now part of vanilla javascript. 

The code on the page is probably a hybrid of old and new style js - something like to be more prevalent in stackoverflow-based js culture :-D

Monday, October 15, 2018

the stupid-idea-buddies buddy

My favorite Slack channel at work is #stupid-idea-buddies, where people can pitch product ideas and other concepts, free of fear from a negative response. (Inspired by Was Twitter a Stupid Idea)

I'd recommend a channel like this as a way of brainstorming (as well as venting passive-aggressive complaints) for any organization.

To give you a flavor of it, here are a few I posted and were particularly fond of:
#321 formation of a committee to determine the plausibility of "aggressive passive" behavior; for example, furiously hammering water
and
#1593 Make years start on March 1. This will have 3 big advantages:
1. meteorological seasons now line up year - starting with March/April/May spring, June/July/August summer, the school year starts with Sep/Oct/Nov Fall, and then Dec/Jan/Feb Winter
2. September and October now fall on their appropriate Latin numbers (7 and 8)
3. NFL season is no longer this weird ambiguity springing from regular seasons and playoffs of one "season" being in different years
and
#2718 Luggage with face detection that is also delighted to see you as it swings around the baggage carousel and can express that- makes you feel loved after a rough flight and helps you locate your bag. The name of this wonder-product? "emotional baggage" 
Anyway, I made up SIBB, the stupid-idea-buddies buddy! It is a little script that comes up with very stupid and formulaic original ideas: 
#2720 eights, but for teams [SIBB]
#2721 shops, but for rheumatisms [SIBB]
#2722 buns, but for lawyers [SIBB]
Minutes of entertainment!

Sunday, October 14, 2018

stackoverflow - if you're smart enough to ask the questions, it has the answers (e.g. putting breaks in <pre> tags)

I'm revamping my ancient loveblender site. One thing I use there is Ye Olde <pre> Tags - offering my authors precisely finessed spacing control. (And back in the day, giving my site a kind of fun typewritten look.)

Honestly, I think some users use it who don't need to - in particular one author who wrote very long lines that would break the now-shared page. So I figured there might be a way of getting most of the benefits of a <pre> tag but still breaking super-long lines, and sure enough stackoverflow had the answer:

pre {
    white-space: pre-wrap; /* CSS3 */
    white-space: -moz-pre-wrap; /* Mozilla, post millennium */
    white-space: -pre-wrap; /* Opera 4-6 */
    white-space: -o-pre-wrap; /* Opera 7 */
    word-wrap: break-word; /* Internet Explorer 5.5+ */
}

Stackoverflow has so many answers - in many cases, the problem is just knowing the question. I think this is true in general, for languages you're not using every day, it's ok just to know the concepts, and make good guesses as to what commands are likely available already. Sometimes it seems embarrassing how I write all my personal sites in PHP (as I've said before, not as dumb as it sounds) but how few commands there are that I don't end up looking up. (Then again, I had my own cheatsheet for tropes in Perl...)

Friday, October 12, 2018

13 games under 13k

Some results from a Javascript 13K Game Jam. It's kind of amazing what's built into browsers these days!

Wednesday, October 10, 2018

photo albums, macros, perl regex, browser regex, terminal clipboard, and photo galleries

Middle School was not kind to me.
A long time ago I scanned the photo album I assembled shortly after college and put the photos online. (For a weird time in the late 90s too many websearches for old friends just pointed back to that dang site) The thing is I scanned things at too low of a resolution, so I decided to redo the effort at 600 dpi and post them on my blog.

Over the year I've hacked up my blog system to be pretty friendly to post photos, especially with resizing images for web display, but keeping the fullsize images there as a link (since I finally realized it really was my canonical personal data warehouse.)

(I'm still enamored of my CSS hacky photo gallery system, which easily makes a nice compact display of the album with a minimum of setup)

Anyway, I reused all the file names from my original scans, which include a lot of metadata about people and places in the photos, so I wanted to go from the html my blog system generates for me, for example
<a href="/m/2018/10/10/049.c.mrs mclaughlin at prom toasting camera.jpg"><img src="/m/2018/10/10/049_560.c.mrs mclaughlin at prom toasting camera.jpg" border="0" width="560" height="441"></a>
<br><br>
and copy the filename as the caption underneath, ala:
<a href="/m/2018/10/10/049.c.mrs mclaughlin at prom toasting camera.jpg"><img src="/m/2018/10/10/049_560.c.mrs mclaughlin at prom toasting camera.jpg" border="0" width="560" height="441"></a> mrs mclaughlin at prom toasting camera<br> 
<br><br>

Once upon a time, I would have done this in a macro in a text editor - I feel like I used to care A LOT about how well an editor supported macros (it can get tricky, especially how you record a macro that uses a dynamic "find") but now it doesn't come up so much.

So my fallback plan was writing a perl script:
while($line = <STDIN>){
    chomp $line;
    print "$line\n";
    if($line =~ /^.*?\.\w\.(.*?)\.jpg/){
        print "$1<br>\n";
    }
}

The trick was being a bit lazy about putting things in temporary files - one thing that helped was the pbcopy command in MacOS Terminal, which can pipe stuff into clipboard.

So that would have got the job done, but then I remembered I had made a tool to help me do that in the browser: regexcellent which I write about here. In this case, the matcher was
^(.*?\.\w\.)(.*?)(\.jpg.*)$
and the output was
$1$2$3 $2<br> 
(the one thing I couldn't figure out was putting in \n's for line breaks, but not such a big loss)

Anyway, I'll be posting the results starting tomorrow.

Hope any of this was useful to someone! If only as notes to my future self...

Friday, October 5, 2018

es6 re-review

Decent re-review of ES6 new(ish) hotness(also ish).

Its notes from the Wes Bos lectures- currently I'm taking his video React intro course. A lot of it is review but there's a lot that hasn't yet cemented for me with my intermittent use of it.

I admit I'm not in love with all the new concise syntax - it used to be much easier to take a guess at what a { meant in javascript code, now everything is heavily overloaded.