And Now Sample Rates

Ok this was pretty simple to add. The app now supports samples rates. Which is great, the little app and now generates a 3 second tone at varying bit quality and sample rate. Listen via headphones for your best listening pleasure!

So what problems did I hit? I struggled to get the HorizontalPanel to centre all my bits of text in the toolbar at the bottom. I ended up using a html table in UiBinder and then putting in GWT components into the columns. I don't think this is the best way to do it but googling does not reveal a better way to do it.

Other than that things are going smoothly.

The head phone on laptops is a little bit funny. I could not figure out why the tone sounded so bad until on the off chance I put in my headphones, fairly cheap ones, and the sound improved a great deal. Funny and I should have thought of it before. Of course it also meant tonight I could not work out why the sound was not playing and then realised the headphones where plugged in but not on my head... Yep I am having one of those days.

GWTCanvas

Yesterday after doing a quick sketch of the UI on the back of an envelope, well a notepad, I started to implement the initial draft of the UI for my little synth web app.

It went quite well. UIBinder seemed to do its stuff and I was in general happy with the outcome. It is clearly not going to stand the test of time but getting something rough and ready is the goal of these initial phases.

Then a little problem occurred. I am going to need to draw quite a bit in this app. The HTML canvas is a prime candidate to do this after all if I am going to require the audio tag then the canvas will be available on any browser my apps work in.

I look in the incubator project for gwt. Yep canvas support is there so I go ahead download and add it to the project. Add jars to a gwt project still takes a while for me. I then start to mess with the GWTCanvas element. Integrates fine into the UIBinder stuff and I get a simple box drawing. Then I decide to write some text to the screen. Oops GWTCanvas does not support text even though the HTML canvas widget does. As fair as I can tell GWTWidget only supports a subset of HTML canvas features because it works on Internet Explorer 6. Mmmm I think that is no good to me.

Searching the web and no alternative reveals itself. I am determined to not drop into Flash or use a Java Applet for this so what are my options.

Well I could stick my head in the sand and focus on other stuff and hope with IE9 and FireFox 4 round the corner either the incubator project or someone else will provide a wrapping for the HTML canvas sometime in the near future. Or I could do a very minimal wrapping and use it as chance to learn about this area of GWT. It would be minimal in the sense as soon as an alternative wrapping appeared I would switch.

The geek in me is pulling me towards the minimal wrapping but I think I will work on it in parallel with other features to help keep my focus and not get lost in geeky coding fun.

Build 13 of the Synth App.

Yep we have reached build 13. That is I have done 13 uploads to the google app engine for this little idea/site. From a users point of view not a lot has changed over the past couple of days but from my perspective quite a bit has changed.

I hooked in the basics of the browser history support. While the single button does not need history support  it force me to get an understanding of the problem so hopefully avoid problems in the future. Currently my view is the app will be fairly light on back button support, a bit like gmail is.

I also rewrote the UI to use UiBinder. Ok move a button and a link across to UiBinder is not a big deal but it has removed the I have never used UiBinder so it must be hard thoughts. It is not hard, in fact it is quite easy.

So far I have been finding GWT quite nice to use. I feel I have enough Java UI experience with Swing and Android that learning the UI part of GWT is turning out to be fairly easy. I may well eat my own words at some point in the future!

A Front Page

This evening I spent a little time creating a front page for the synth app. Ok it is currently only a simple press a button and generate a tone but still every app no matter how small needs a page to introduce it!

This is now uploaded so people can play with err the new html page... Ok it is not much use/fun. Next up was some house work on the code. First I had to tidy up and take out lots of hacks/ in-efficient code to drastically reduce my code base and get some sane names on class files.

Then I spent a while setting up revision control. Subversion is my poison and perhaps my brain is not working very well but it took ages to get subversion to ignore some directories I wanted ignoring. So long was spent in that problems that there was not much progress after that.

My next task is to set up a framework to handle the back button. At the moment the app does not need it but I have read enough times that it is a pain to implement later on. So I will implement it when I don't need it and have it right from the start.

After that perhaps my most important task of the next few weeks. Getting some tests written. When starting a new project I find writing tests in the early stages is good, once I am out of the prototype stage that is, because if I leave it later my tests never seem to catch up with the code base and important bits of code are untested.

This is going to take a fair number of evenings, particularly as some evening are fairly full at the moment. My short term goal is to get much of this set up out of the way by the 10th of September and then start 3 weeks of rapid iteration on app.

Small update

As mentioned in the last post I am messing with sound synth in the browser via GWT, I posted another little update that to provide a link to download and save the generated file. See here.

Ok it just uses a href tag where I embed the generated wave into the src tag, if the truth be known I am a little out of depth with all this html/browser stuff and I thought this was going to take ages for me to figure out. The fact I got it in a few minutes is quite nice.

So if you click the play sound button to generate the sound a link should appear to let you download the sample, via right click and the download link as option. One thing it does, on Firefox, linux and I suppose all other browsers, is default to an odd (random?) name in the save dialogue. I could not figure out the option to set this if it is possible.

GWT and sound synthesis

I have been a little quite of late. August is meant usually a time when I spend lots of time with the children so is usually a slow month for anything. Weather has not been great this year which has making the usual outside activities a little bit less fun.

I have written a few post which I doubt I will publish. They were really for figuring stuff out in my head. The end result is I am probably going to attempt to make a  little web app in the area of sound synthesis. Although I am not 100% sure on the direction it will take.

So with this in mind I fired up eclipse and have spend a few days attempting to work out how to use gwt to generate and play a sound. Using HTML5 playing a sound is quite simple.

If you want to synthesise a sound first you have to base64 encode the wave file and then attach it as an inlined file. Terminology may not quite correct there as I am still learning all this.

The fun part is you have to actually work out all the headers to wav files for yourself  as Java in GWT does not provide any sound api's to help you. I really just want to say to some api, here is my array of normalised double and this is the sample rate, go play the sound.

I got the code working and the results were a little noisy. I got the occasional spitting like noise on the play back. Not exactly what I wanted. As most of the code had been tested with real Java I was fairly confident in my code and decided to publish it to app-spot (google app engine) on the hunch it was a browser thing.

Turn out I was correct. FireFox on ubuntu plays back the sample with a spitting noise. Chrome make no noise at all, I guess it does not yet support wav files or the HTML5 tag. Opera on the other hand played it back perfectly. On windows FireFox played it back perfectly and I did not test other browsers. No access to a mac to check on those systems.

I am not surprised support is patchy as the Audio tag is fairly new and it maybe I am doing something in an incorrect way.

Here is the link if you wish to hear what I have been up to.

Amazon delivered Essential GWT today so I am going to spend some time studying that book over the next week or so. Will do a mini review once I have read it.

Quite a Productive Night.

Android wise I produced my first AI process, the random player. Yep a computer component who just places pieces randomly. Not exactly the most difficult AI to beat (Thankfully) but it will serve the purpose of weakening any stronger AI players I create. If one in 5 moves is a random move people should find it easier to beat.

It also served the purpose of driving the code forward and some refactoring, things are starting to find their natural place although there is more refactoring to get the stonger AIs in place. It is simple stuff just pushing methods around so I can ask the right object questions.

I also managed to get a bit more GWT learning in place. Getting GWTCanvas hook up was a bit of fun, plus I managed to get some scroll bars added as well. Yes it is all simple stuff but it is good to get these wins and help grow my confidence. Next up is writing an example of the incremental command. I have seen GWT is pretty fast but there is no excuse for freezing the browser and given I don't have an upper limit on the time it will take to compute things I need to be ready. 

I considered web worker scripts as they seemed like real threading but they appeared to not be fully supported in GWT and currently I prefer to keep it to the core GWT where possible and only branch out when I have to. 

All that in two hours and my brain not being at 100%. Time for an early night.

GWT an hour in.

After having read a reasonable amount about GWT it was time to start getting my hand dirty.

Avoiding the whole XML defined UI stuff I created a simple UI in code and attached callbacks to buttons and so on. Guess what it is much like the other UIs I have used and I only avoided the XML side of things to get myself started. After my experience with android I really like using XML to define UI components.

There does not seem to be built in support for the HTML canvas but that is not suprising as I am not sure if canvas is supported in internet explorer. You can use canvas from the incubator project. Canvas is pretty important to me as the project I want to do requires drawing a lot of objects and interconnections between them. Canvas seem ideal for this.

Overall a thumbs up from someone who has been getting his hands dirty for only about an hour or so!

On my to do list is

1. Integrate canvas
2. Look that the performance of GWT for doing pretty intensive calculations.
3. Learn how to "thread" these intense calculations so as to not block the UI and cause the browser to complain. I would prefer to not do calculations on the server.

All this is experimental/figuring out stuff out before I decide to commit to the project in a meaningful way. Given the speed at which browser seem to progress and the gradually declining share of internet explorer I am not at all worried about targeting HTML5 particularly given the target audience will be tech savy.

I am not going to reveal what my app is going to be about other than it is about sound. My main concern is whether the compiled Javascript will get the performance required.