Friday's Post

I found a really very handy PDF document showing every single available music glyph in the Bravura font, organised by type. Gaze upon it and be amazed by how much notation you don't know and how very very many types of accidentals there are. I really like the treble clef whose lower stroke ends in a down arrow. I don't know how I missed it earlier. This is truly the best font ever. I also has letters and numbers and stuff.

I've got an example of using Bravura in a canvas. You have to go elsewhere to see it, because it's downloading the font via @font-face in css and I can't do that from this blog.

If you look at it, you should see an upside down treble clef. This is from the Bravura font. If you don't see the treble clef, please leave a comment with what browser you're using (ex: Internet Explorer), the version number (ex: 4.05), the sort of device (ex: Desktop, laptop, tablet, iphone, etc) and the operating system.

I got that glyph into the canvas by typing the unicode into the string in my text editor. The editor is using a different font, so this is kind of annoying because looking at the text source doesn't show the result or even the unicode number.

This is an example of an image in a canvas with some text:

Your browser does not support the HTML5 canvas tag.

Big Red Blob originally uploaded by celesteh.

If you reload the page, the <3's will be in a different place and also, my hit count will go up and I will think I'm more popular than I actually am. (I tried to do this with unicode hearts ♡, but blogger escaped them, so it was just integer strings, alas.)

In other news, my internet has been offline almost as much as it has been online today. I called BT yesterday to complain and was on hold long enough to hear the most well-known movement of the pastoral symphony multiple times (you know the one I mean, the one in Fantasia with the centaurs (I'd look it up, but I'm offline right now)). They ran a line test and blamed my router and have promised to send me a new one. Honestly, I have my doubts. I should probably buy my own router anyway, because they put everything local on a .home domain, which is cute and all, but breaks a bunch of mac services, especially on a mixed network. I really thought somebody there would have noticed this problem by now. Maybe the dev team also needs to phone in bugs and all have been on hold the past five years.

Drawing

Today I went to the dentist because my dental surgery from last week was still all swollen and that turns out to not be a good sign. So I picked up some antibiotics and then went to the Goldsmiths degree show, which was interesting and extremely variable. I did not get a lot of creative pacting done today. I read a wee bit about how to declare objects in javascript, which is really easy:

var cleff = {
unicode: "&x#1d11e";
repeats: 1
};

What I really need is just a syntax cheat sheet, since I'm already familiar with most of the concepts of this language. So I skipped ahead to canvases.

Your browser does not support the HTML5 canvas tag.

What the source for that looks like is:

<canvas id="myCanvas" width="200" height="100" style="border:1px solid #d3d3d3;">
Your browser does not support the HTML5 canvas tag.</canvas>

<script>

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.fillStyle="#FF0000";
ctx.fillRect(0,0,200,100);
ctx.fillStyle="#000000";
ctx.moveTo(0,0);
ctx.lineTo(200,100);
ctx.stroke();
ctx.fillStyle="#0000FF";
ctx.moveTo(0, 32);
ctx.lineTo(200, 32);
ctx.stroke();
ctx.fillText("unicode?",32,32)


</script>

I need to learn how to get unicode into those strings. Just typing it in with the ctrl-shift-u thing doesn't work, nor does typing the html escape sequence. Also, it seems like changing the line colour didn't work.

OSC and Javascript

Having my mouth cut open took a bit more out of me than I expected. I have nothing new to share about rendering graphics with font symbols in javascript, but here are some js libraries that can do OSC, which will be needed for a later stage of this project. I was looking these up for another project that needs to both send and receive OSC. I don't want to have to learn two different OSC libraries, so even though this project only needs to receive, I'm only interested in libraries that do both. All of these seem to be built on top of another library called Node.js

• Kievii does a lot more than I need, but there's OSC in it too.
• OSC-web has some proxy stuff which could be useful for later projects
• OSC-min is a minimal implementation that does everything I need
• The website for Node.js has a list of popular OSC implementations

Back to rendering graphics soon. I've been reading an introduction to javascript, which is way too basic, but a place to start. After that, I think what I need to know about is probably canvas, so I'll be reading about that.

Also, obviously, I need to think about symbols that are not just bits of music notation font. If I also want to use text, I either need to write some or find something that I can use, such as a philosophical text or poem. If I want the text to be related to the mechanics of the piece, it should be about sounding and listening. There's some odd text on this theme that I remember from the very start of Noise Water Meat, so I might go looking for that in translation. I really do need to make some paper sketches soon or there's a risk that I'll just be making a real-time, machine-listening, pastiche of Redhead and while that would be great fun, I do want to make this my own.

I'm also sort of wondering how I want to page changing to work. Do I want the boxes to just fade in and then fade out? Do I want them to move their location on the screen? Do I want them to change size? Should the elements within them stay fixed? I'm thinking that if the box is moving or changing size, the stuff in it can't also move or it's too much.