I've been doing a bunch of things with Javascript recently, such as an equation parser and graphing calculator and a bad jokes database. I also submitted a new track to the audio portal today, which got me thinking. Surely something like the Newgrounds audio player could be done with modern web technologies, right?

Short answer: almost.

If you want to see what I made, here's an almost functional HTML/javascript audio player (works in modern browsers): http://codepen.io/davepvm/pen/eDFij

What worked well:
Getting the audio playing part was actually not much of a challenge. Getting the visuals to look reasonably close to the Flash version on Newgrounds took the longest, and it's still not quite the same, since I don't have the same fonts and icons, and I'm missing some glows and textures. Feature-wise, though, everything works in the newest versions of Chrome, Firefox, and IE.

What didn't:
Audio visualizations.

If you've done anything like this in Flash, you'll know that you can grab the current sound sample being played in an event and update the visuals accordingly. The API for the HTML5 <a udio> tag, on the other hand, is much (much much much) higher level than that. It lets you change the volume, pause and play, etc. That's pretty much it.

HOWEVER: there may be some solutions!

1. Using (currently) non-standard APIs
We've got the Web Audio API, which actually is supposed to be supported by a lot of browsers, but only recently (it apparently only works in the current nightly builds of Firefox, for example.) It doesn't work at all in IE. Basically, it only works reliably in new versions of Chrome. If the benefit of not using Flash is to get this thing working on things like mobile devices where Flash isn't an option, then using an API that is barely supported seems a little weird. That said, for the situations when a Flashless solution is best, a visualizer might not even be necessary. This looks like the way to go going forward, though, so possibly over the weekend I'll make a visualizer for the player and then only run it if the browser supports it.

UPDATE: I recently got a basic visualizer working, which you can see if you're running a new version of Chrome! Check out the source code and maybe try making a visualizer of your own! (instructions in a comment at the bottom of the code.)

2. Preprocessing the sound data into another format
This one seems pretty crazy, but in a cool way. Grant Skinner made an AIR app that takes the sound data from a file and puts it into an image, which can then be easily read by Javascript. This solution is great because once the preprocessing is done, Javascript compatibility is a lot less of an issue, since the image isn't a problem at all, and <canvas> support is pretty decent. The problem with this is that it means the sound files need to be preprocessed. There are lots of sound files on Newgrounds so it's definitely not a practical solution (and also I'm just doing this for fun with no affiliations, so that would be impossible for me to test with more than one or two songs anyway.)

Final Thoughts
This isn't very practical right now. It doesn't really do visualizations, so it wouldn't work that well for a desktop site, and this version of the player is pretty reliant on mouseovers, which doesn't apply to mobile. I hear audio embeds for external sites is going to become a thing, though, so possibly a visualizationless player in Javascript might work well for that, with a Flash fallback. Either way, it was a cool way to kill an afternoon.

UPDATE: Once again, there are now visualizations if you're on Chrome. Check those out, and leave a comment with a link if you fork the pen on CodePen and add your own visualizer!

UPDATE 2: Here's a version with much more modular code, without a visualizer, and where it stretches to fit the width of the container: http://codepen.io/davepvm/pen/DgwlJ

UPDATE 3: Here it is as a video player, currently still using the old (read: worse) code. http://codepen.io/davepvm/pen/luqFk

</dave>

I present to you: The Random Bad Joke Database! Basically, it's a website to get bad jokes from. If you guys want to help add your own bad jokes to the database, it's really simple, and would be greatly appreciated!

So, about this project.

Those who know me personally know that I love bad jokes to a fault.

As this was my last free weekend before school, I figured I should probably take the time to do some more programming. Logical, right? But anyway, the last thing I made, CoolStory, was made entirely in Javascript, so there was no backend at all, and it ended up being a lot less practically useful than I had hoped. I wanted to do make something with a database this time and with a simpler purpose, so a random bad joke site seemed like a good thing to make.

Features
- Reloading the website takes you to a new bad joke randomly selected from the database. Pressing the “Random Joke” button does the same but uses AJAX to load in the next joke to minimize requests.
- Press the “Flag as Inappropriate” button to mark a joke as being spam, offensive, or not actually a joke. If a joke is flagged by enough people, it will be automatically deleted.
- Add your own bad jokes to the site without having to create an account. A maximum of ten jokes added per day is imposed per IP address to help prevent spam. If you really feel like adding more, though, just message me.
- There is a page showing every joke that has been submitted by your IP address. You are given the option to update your jokes.
- The site has been built responsively and should work fine on mobile devices and stuff.

So yep, that's what I've been up to recently. Go check it out.

So NATA's pretty much done now. In case you missed it, here's my video and here's Sif's. Let's reflect on how NATA went this past year.

WHAT'S IMPROVED
Visually, I like the style that I've adopted recently. It works better, I think, than the one I was using previously. I also got in that one 3D animation, which is something really hope to do more of in the coming months so I can get better at that.

WHAT STILL NEEDS TO BE IMPROVED
Story. It hasn't gone anywhere. There are two problems here that I think need to be fixed:

1. Detail - The stories in these movies are never made detailed enough to get real empathy for the characters. People seem to still be able to get empathy out of them, but I think that is just because ambiguous characters let you project your own thoughts as a viewer onto them more, which only works if the viewer's mindset is in line with the video, which it isn't always. Part of the problem is that I can't make movies long enough to add that sort of detail in the one month that NATA gives, so maybe now that NATA's over I can spend more time on making something longer and with a better story. We'll see.

2. Purpose - I'm making some of these videos for the wrong reasons. The more depressing ones aren't really made for an audience; they're made as an outlet for me to get rid of some thoughts, sort of like how some people write angry letters and then rip them up immediately. Except then I get stuck with them for a month and then show them to the internet. So at first that means I feel strongly about what I'm making and it builds upon what I'm feeling, but then after a while that part fades away and I'm just working on something to which I no longer feel any connection and which I feel lacks substance. Basically, I need to find another outlet for that sort of cleansing so that I can have unclouded judgement when working on animations, or I have to snap out of this mood I'm in that's producing all of these dark and pretentious movies. Unfortunately, just snapping out of it is pretty much impossible to do, but that's my problem that I can try to deal with on my own, and I can always force myself to make other types of things in the mean time.

WHAT NOW?
I've been making some little animation tutorials recently. They're not general character animation tutorials since there are plenty of those being made by better animators than me so I'm doing tutorials for specific things in my videos that you might want to try out yourself.

We've got one last NATA collab in the works for this year (here's our previous one, the Sarcastic Voice Collab) so you can look forward to that.

Then, there's school. School always means I'll be busy, but I'm going to try not to disappear again like I did last year.

</dave>

The deadline for the NATA Pro Round passed this week, and I submitted something for that! You may have missed it, but you can see it here. It's called Narcissus and here are my thoughts on it:
- I really like how it turned out visually. I was afraid that doing it lineless would take too long like it did last year with Until It's Gone, but I made some changes and now it's as fast as regular animation.
- The animation turned out better than I expected as well, so that was nice.
- The plot was kind of pointless. However, I don't entirely regret this, since last month I kind of forced myself to marinate in sadness because I had to work on something sad for an extended period of time and I wanted a break from that. I don't want to do another meaningless movie any time soon, though, so I'm going to have to strike a balance of some sort.
- The music worked well. Last time I tried to make a comedy, Until It's Gone, the music and plot ended up so bland that I reworked it all to make it sad again. This time the music made it seem less bland, and that was good.
I'm not confident that I'll make it through NATA, and if I do happen to I know I won't be winning it again, but so far this year has proved to be useful already, so I am ok with that.

Next up: I'm kind of starting to make animation tutorials. The first one I made is a brief demonstration of how I did that little ripple effect in Narcissus.

I'm not sure if this will become a regular thing that I do or not. It won't for a little bit, anyway, because as you can tell I'm not that great at making these. If you want me to try to teach or explain (read: ramble about) something about animation, and you accept the fact that it's me that'll be making it, you can let me know and I will maybe try.

Lastly: Work is interesting, as usual. I work at a summer camp, and I generally get home late and too tired to work on things. So if I do make it to the next round of NATA, that'll be interesting to juggle. It might actually be a little bit of a relief if I don't, although if I do, of course I will make it work somehow. We'll see how it goes.

</dave>

My friend Luka and I are currently in the airport in Vancouver, waiting to return from the Skills Canada national 2D character animation competition. This time, rather than getting an audio clip which we have to use as a component in an animation, we were given an audio clip to use exclusively for the animation. Basically, we were given a short audio clip which we had to animate to. No more, no less. Sort of like the 11 second club, if you've ever heard of that. And then we came second, which was nice.

Anyway here's what we made:

Things I learned:
- animation can look smoother when you spend more time on making less
- making things bouncy and floppy is fun
- making things bouncy and floppy makes more sense when the movie is funny, unlike all the stupid depressing stuff I've been making
- Toon Boom Animate can always save the day. Always.

So that was kind of fun. Other news:
- The NATA Walk cycle collab will be released soon!
- The next round of NATA starts soon, but I might not make it through because we don't have the results yet, so that might potentially be something I do
- I have to somehow make a video for math class really quickly this week, which could affect the length and scope of anything I may or may not attempt for NATA if I make it through

so yep that's that.
</dave>

I'm heading off to Vancouver next week for the Skills Canada national animation competition, so in a week I'll have another short little animation to show from that. Also, the next NATA collab is going to start soon, and it's a walk cycle collab this time, so that'll be fun.

As for NATA, I recently submitted a rather dark movie called The Monster is Me, and I feel a little guilty about how some people interpreted it. It's not supposed to glorify suicide, and I feel bad knowing that that's what some got out of it. I was intending to have two separate conclusions to the video: the darker, purple-coloured version, where yes, the main character dies, but then also the orange version, where the character fights back the monsters and reaches some sort of "better place" by doing that. The purple was supposed to show the ineffectiveness of the non-solution. I'm kicking myself because it looks like suicide was portrayed as the means to that end, especially with the rising up bit, but I assure you it wasn't intended to be that way. I might re-cut the ending later to try to make that clearer.

To be honest, I kind of regret making the video since I don't really have anyone to blame but myself for all that. I've maybe made visual metaphors too much and this time it backfired. So, I'm honestly sorry about that.

Dave

I just got back from Waterloo where Luka and I came first in the Skills Canada2D Animation Competition. We were given the line from Monty Python that you hear at the end of the video and had to make an animation about it. I'm very pleased with the results.

So in a few weeks I'll be going to Vancouver for the national level. In the meantime, I have a metric shit tonne of work to do. I might even not end up finishing a video for NATA. I knew it was going to be difficult if I entered NATA this year, and it is definitely proving to be difficult. I'm going to try to stay above the water, but I apologize in advance if I can't make it this year.

-Dave

Yesterday, me and Luka went to Kingston, Ontario for the qualifying round of the Skills Canada animation competition. It's this thing we have in Canada that I've been doing a few years where high school students from around the country get a few hours to make animations based on a theme of some sort, and there are different rounds in different places, and it's pretty fun.

So yesterday was the qualifying round (the lowest level) and we came in first. Rather than being given a theme, we were given a sound clip instead and we had a few hours to make an animation about that. Here's the video we made (the only sound in the video is the sound clip we were given):

I think the quality of the animation improved from last year, especially for Luka (the first half of the video was animated by him), who has come a long was since last year, and especially since we weren't allowed to install our tablet drivers like we are in other levels of the competition. We're definitely proud of this video for that. Also I think we had a better focus on what we had to do, so there was more time spent on animating the character speaking, for example, than animating cool explosions or something. But anyway, we came in first with that video, so we are advancing to the provincial level in Waterloo, Ontario in a few weeks. I'll report back after that happens.

Also, in case you missed it (which is pretty easy since it's not very visible anywhere), I made an entry for the NATA open round. You can see it here on Newgrounds or you can watch it on Youtube:

It's in 3D, mostly, which is new. As has been pointed out repeatedly, there's not much there in terms of story or character development. This is largely because couldn't make models with working faces in time, which seriously limits the kinds of stories I can try to tell and the depth I can go into. I won't make you think or anything after you watch it. However, I am glad I made it, because I feel a lot more comfortable working in 3D now than I used to be. If I get through the open round and if I'm able to model characters decently enough by the next round of NATA, I'll try to make another one in 3D, but otherwise I might have to go back to 2D. It's also a competition, and I know that I can make better movies in 2D than I can in 3D, so I might have to leave learning 3D to my own time. I'm not really sure yet. We'll have to see.

Lastly, on the way back from Kingston, our bus broke down and we had to wait for a bit. I didn't have any games on my phone, but I did have a graphing calculator app, so naturally I made this:

I don't want to say that I'm going back to making five-minute shorts, because I'm not (or at least not yet.) I did make this, however:

I haven't uploaded it to Newgrounds as a portal video because I feel like it's maybe a little too small. Like, it's not the same quality as my other stuff, and didn't intend to be, so I suppose I don't want to tarnish my account with it or something. That is because it is really just a video to get me animating after a half-year hiatus. This started as an entry for the Toronto Animated Image Society's "UFO Jam", but since it ended up being longer than 10 seconds (the maximum time for entries to TAIS jams), it's too long for that but too short for a "normal" video. Oh well.

Hopefully I'll start work on a more legitimate project soon.

Aaaaawwwwww yeeeeeah

Ok so in the middle of NATA last summer, I made a little progress tracking program to let you know how much you have to work on your animation each day in order to finish it on time. Today, I'm able to release a (somewhat) stable beta of what I thought to be the next logical step: A program in which you make storyboards, then check off progress for each slide (rough animation, backgrounds, sound, etc) and then the program tells you how you're doing (for example: At your current rate, you will finish in 9 days.)

So, I present to you, the sarcastically-named CoolStory!

You can go try it right now (if you use Chrome)! http://www.pahgawks.com/storyboards/

Firstly, this is currently for Google Chrome only. This project was also meant for me to learn Javascript and the cool new features of HTML5, but since implementation of HTML5 is still pretty radically different in all browsers, it currently only works the way I intend it to work in Chrome. In order to get Firefox to work, I need to change the colour picker and the date selectors and the way the slides load. For Opera, I need to change the way the colour picker works. For Internet Explorer, well, I have some work to do. For Safari, firstly, I need a mac, and then I need to change the date and colour pickers and possibly more. Also, right now, Chrome is the only browser that can save properly without uploading all the data to a server and then downloading it again. And that is why it is for Chrome only right now. More browsers soon to follow.

However, if you do use Chrome, you're in luck! Here are the features you can use right now!
- All the drawing tools and colour pickers and such work
- Add new slides with the + button in the timeline
- Hover over existing slides to move them up or down, remove them, or duplicate them (useful so you don't have to redraw backgrounds, until I make a better system for that.)
- In the settings window, set the project start and end date so that you can get a days remaining counter
- Under the drawing canvas for each slide, check off your progress as you go to get extra information in the settings panel
- Play back your storyboards using the play button in the toolbar! You can set the duration for each slide in the same area as the checkboxes (the duration also factors in to what percent of the entire project has been completed.)
- Save your storyboard locally as an xml file, which includes all the images and tracking metadata, speedily and without ever uploading it to a server (which means this app will eventually have offline support.)

That said, I'm finding new bugs every time I use it, so let me know if you find any so that I can fix them.

---

And now some little updates that don't have to do with CoolStory.

So as I said before, I'm trying to get into university for computer science or software engineering, so right now, that's my priority. That's why I'm releasing a program now and not a new video. In fact, that music video I said I was making earlier isn't going to happen any more. There was too much other stuff to focus on, and I didn't want to make a commitment that I wouldn't be able to follow through with, so unfortunately I had to drop the project. I have a lot more schoolwork than I initially expected, and I need to give that priority and keep my low-90s average so that everything else goes as planned.

I don't want to say that I'm giving up animation because I'm not, but I don't think I'm going to be making any new animations for a while. I won't be participating in NATA this year like I had wanted to earlier, which was a tough but necessary decision to make. For the next year and a half, unless something significant changes my plans, my limited free time is going to have to be spent elsewhere. I'm still going to try to keep in touch with everyone in NATA though, and hopefully I'll be able to make CoolStory (and possibly future programs) more useful that way.

Talk to you later, Newgrounds!

-Dave

p.s. here's a screenshot of CoolStory.