Speech input for Visual HTML 5 Editors - Lately in JavaScript podcast episode 20 - JS Classes blog

Contents

Listen or download the podcast, RSS feed

Watch the podcast video

Read the podcast transcript

Contents

Introduction (00:20)

Introduction (00:20)

Manuel Lemos: Hello, welcome to the Lately-In-JavaScript podcast.  This is episode number 20, and as always I have my special co-host, rock star Special K.

Michael Kimsal: Special?  You trying to say I'm fat?  You're calling me fat, aren't' you?  I have been working out.

Manuel Lemos: It is on your label, so maybe that's why you are special now, you are no longer Michael Kimsal, you are Special K.

Michael Kimsal: Yes (guitar strumming).

Manuel Lemos: So we are going to start our podcast, as always needless to ask you how you are doing because I can see that you doing fine as usual.  It's hotter than the previous months, right?

Michael Kimsal: It is hot here?

Manuel Lemos: I mean the temperature.

Michael Kimsal: Oh, it's hot here alright, but temperature wise it's up here too out here in sunny Raleigh, which I've turned the thing out there, but you know what Raleigh looks like, just Google it, it's fine.

Yeah, so, I never asked how you're doing, so let me turn around and ask how you're doing before I tell how I'm doing.

Manuel Lemos: Yeah, well, that's kind of a different question, well, I've been working a lot, probably that's nothing new, but I've been working a lot more than usual and staying up later than usual just to develop some new features that I've been working on for the Classes site.

But I'll get back to that later because I want to comment on those features that I think they are important to comment here when we get closer to talk about the, how do I say, latest objects published in the JS Classes site.

Michael Kimsal: Yeah, that's how you say it.

jqBootstrap Validation (2:10)

Manuel Lemos: So we are going to go on with the podcast as usual, and this time maybe you should start with a topic that you proposed, right, about jQuery bootstrap validation.

Michael Kimsal: Before that, I was just being polite asking how you are, but I'm still gonna say how I am because you asked me that before, and it would be impolite of me to ignore your question.

So on that, with that setup, which was quite casual and unrehearsed, take two, I am... I've been working and I've been busy.

Two things, actually a few things, I haven't done one of my audio podcasts, we've been doing a video for a bit for Webdev Radio, it is coming up onto year seven.  I used to do these every couple of weeks or so, and I've slowed down in my old age, but on July 4th or July 5th 2005 was the very first one, so we are coming up sometime next week it's going to be year seven, so I'm doing sort of a pre-birthday podcast after this just for everybody, hello, thank you, go listen to Webdev Radio. 

But, outside of that, don't get me distracted, outside of that I was at CodeStock a couple weeks ago, speaking at CodeStock, which is a very awesome code conference in Knoxville Tennessee, about six hours east of here, and I gave two... no, that's probably rude, I gave two presentations -- to those of you in Europe... I gave two presentations, one on freelancing, there was a few there on people who are freelancers and describing how they find work, what their workday is, and so on.

And I also did one on Twitter Bootstrap. I don't think I did the Twitter Bootstrap one very well, I got a couple of not horrible reviews, but people were looking for more live coding I think, and given that it's CodeStock, and I didn't do enough of that.

So to anybody who's watching this that watched that presentation I'm sorry.  It was standing room only in that room, but mostly because they put me in the tiniest room, they only hold about 15 people or so, actually they hold about 20.

So that was the third time I think I've given that talk, and it was better, those of you who didn't like it then at CodeStock you should've seen it two months ago.  But it was good, I think it was okay as an introduction, but there are certainly a lot more that I think people want, that's the one good thing that I got from that is people were asking some good questions, how do you do this, how do you do this, so I will take that and incorporate it.  But if you haven't used Twitter Bootstrap yet you should use Twitter Bootstrap because it's pretty awesome.

Okay, so that's how I've been doing.  I saw some family, I saw some of my family in Tennessee, which is nice, just a couple of days, and relaxed, and then I came back to the grind and I'm still grinding.  Okay.

Manuel Lemos: Well, I can see you have been very, very busy, and that's good because it's better than not being busy at all.

Michael Kimsal: Yes.

Manuel Lemos: But I was sort of introducing one first topic that you thought would be interesting to mention, I'm not sure if it's somewhat related with your talk because it has bootstrap in the name.

Michael Kimsal: Yes, as a matter of fact, this is something I meant to demonstrate in my talk, and I didn't, and this is an example, it's certainly not the only one, but this is something called jqBootstrap Validation.

This is a jQuery plugin designed for Twitter Bootstrap, I'm going to try to show this and share the screen, now my bandwidth has been a little on the slow side, but let's see if I can do... screen share, look at that, I did it.  Do you see that there, do you see the screen?

Manuel Lemos: It would be better if you could somehow increase the font, CTRL +.  

Michael Kimsal: Is that better?  

Manuel Lemos: Yeah, it improved a bit.  It's still blurred, but nevermind if that's not possible to do miracles with the limitations of the resolution of the hangouts video.

Michael Kimsal: You just hate Macintosh, don't you?  Your pro Linux and anti Mac.

Manuel Lemos: It's Google, Google problem this time.  

Michael Kimsal: It's been evident since day one, my goodness, your agenda just never ends.

Manuel Lemos: I never mentioned anything with Macs.

Michael Kimsal: Right, okay, well, I think the screen's too fat, could you make it a little thinner please?  Sigh.  Okay, so here is jqBootstrap Validation, just an idea or an example of what you can do.

If you can see that that's a red outline, if I can type in specialk@gmail.com, it suddenly changes, it says... but down here my other email needs to be the same so I can go up there, and you can see as I'm toggling between these it's doing some color feedback and some textual feedback. 

Color feedback is nice, it's useful, it shouldn't be the only thing you rely on from a lot of usability, well, some usability situations that you can get into people can't see color very well, can't make out color, somebody might be looking at it using a black and white monitor, for goodness' sake, I don't know, not everybody has color all the time.

So, things like that, you change the text as well down here.  See down here it's telling you to choose two, and when I choose two it does that, when I try to choose three it says you can't have that.

There's a couple other examples of validators, numbers, if something is required, and it shows you the code for each of these.  And if you've done any recent bootstrap you'll notice here they're using the same class, the control groups and control labels, they're doing all the standard bootstrap stuff, and then have the validator... you're attaching the validators on there.

So, it's pretty nice, I have played with it some, I haven't put it in a project yet, but much like the rest of bootstrap when I show it to clients generally the first thing out of their mouth is, oh, that looks nice and clean.

In some ways it looks boring, and the anti-bootstrap crowd I think has kind of gotten tired or overloaded with so many bootstrap sites, and we need to I think be a little careful of that and maybe not throw things away too quickly because I've got six projects right now, and I'm bootstrapping... I'm putting Bootstrap on many of them.

The clients I'm doing this for, they don't see the other projects, they don't see 50 bootstrap sites a day, they just see that, gosh, their site looks nice and clean, it has responsive adjustments to it and all that kind of stuff, so it's lightweight, clean, we can style it more if we want, but there are a lot of nice little things that I like about bootstrap in general, and it's plugins like this that make things even nicer to work with.

So that's kind of my Bootstrap plug, but that plugin was something I've come across in the past few weeks that I'm going to be integrating and I thought was nice. Carry on.

Manuel Lemos: Yeah, well, I have one question, so basically it inserts the validation rules, I mean it requires that the validation rules be in the HTML, is that the way it works?

Michael Kimsal: It looks for... it's got some of the data attributes. Do you see this again, so it tells you here that for the maxlength, maclength=10, it will use that HTML attribute for part of the validator, but you can also add a data validation maxlength message.

If we look at the code for required we just have a required attribute on here, and then data validation required message down there, number code, type, input type=number, so instead of text or file or something like that you're going to put number and then a data attribute, so it's input type=email, so that's how it's doing it.

Manuel Lemos: So that will sort of in validation or input constraints is implemented with the JavaScript library, right?

Michael Kimsal: Yes, jQuery, yes.

Manuel Lemos: Well, just wondering if it would be a good practice to mix a presentation logic with application logic, but in the end that's the final HTML that the server side application would probably generate, and the actual separation would have to happen on the server side, and the client side some more things have to mingle, if I can put it that way.  And you have been using that library?

Michael Kimsal: I haven't.  I have played around with it, I have not used it in production yet.  I plan to on, one, a redesign of a project that I'm on, and an upgrade to a current project, so I'm bootstrap-ifying one existing project, and I'm creating a new one and I'm starting with bootstrap.

So I'm going to be using that as some basic validation UI stuff unless I run into some major, major problems, but I don't foresee any right now.

Manuel Lemos: Yeah, well, in general since we have been doing Web applications for many years, and most of the logic is decided on the server side, mostly if not all, we already have our components to generate HTML and JavaScript and whatever to implement whatever logic needs to also happen on the browser side.

So whatever components we are using today on the server side to take advantage of that library we would have to integrate them with what the library provides...

Michael Kimsal: If you're already doing... if you already have server side components that generate this sort of stuff or if you're already doing client side stuff and you've already got validators you probably don't need something like this.

This is just another implementation of it, it just happens to integrate nicely and use some of the stylings and control names as the bootstrap framework. So if you're starting from scratch with bootstrap this is a nice thing to have.

If you've already got stuff and you're already dealing with this in other ways, if you already have maybe your own client side validators, replacing it with this probably isn't gong to get you anything nice, I just happen to like the simplicity of it.

Actually it goes back a little bit to the jQuery, and I wish I wasn't such a jQuery fan boy these days, I'm turning into one or I am one.  I did this mobile app a couple months ago and I looked at Sencha, I looked at ExtJS, I looked at jQuery mobile

And the fact is I already had a basic prototype working which I could enhance with jQuery mobile far easier than introducing what seemed like all of the baggage, I don't want to say that in a negative way, but all of the overhead or all of the baggage of Sencha or ExtJS.  Sencha used to be something else, or Sencha mobile or what ExtJS used to be. 

Manuel Lemos: Yeah, ExtJS.

Michael Kimsal: Used to be ExtJS and now it's Sencha?  What did Sencha used to be?

Manuel Lemos: Alzheimer is attacking you again.

Michael Kimsal: I'm sorry, I'm sorry.  Anyway, there were a couple that I was looking at and they looked they would actually solve a few more problems that I might have in the future, but it was so much easier to just take what I had and put some jQuery Mobile on top of that, much like many people take a basic static site and throw in some PHP, as opposed to saying well really from an architecture standpoint you should scrap it and start with Rails or start with .NET or start with Grails or something.

Yeah, I'm maybe throwing bad stuff on top, I'm patching something that isn't good as a base, but it was very seductive and I just felt a lot more productive doing basic stuff with jQuery Mobile, and another reason why something like jQuery Bootstrap Validation lets me take what I have already and just do these small minor progressive enhancements little by little, as opposed to like starting over from scratch with GWT or something which would generate all that, or Cold Fusion which has really nice declarative tags which will generate all the client side validators for you.

Manuel Lemos: Oh, no, please no. Okay, let's not be that much nostalgic.

A WYSIWYG editor that supports voice text input (15:20)

Manuel Lemos: Anyway, moving on with the podcast, I wanted to try to demonstrate something about this new, well maybe not so new, but it is claimed to be a good thing at least by the authors, which is What You See is What You Get editor, apparently taking advantage of the HTML5 features.

I did not find it so much different than usual except for one feature.  I'm not sure if I'm able to demonstrate because this hangout is taking so much CPU that I'm not sure if there will be any CPU bandwidth left to demonstrate it, but I can try.

Basically I'm showing here I hope you can see it well, I am showing this editor which is a regular HTML editor, and I have some buttons on the top should be a toolbar, and there is a special one that can insert other text speech sample from the user machine and eventually translate it with some Google API I suppose.  I'm trying to use it here but I'm not sure if this will work well.

Michael Kimsal: It might not be able to take an audio because you're already doing audio on this recording.

Manuel Lemos: Oh, that makes sense.  That may be why nothing is happening.

Michael Kimsal: The bone is too logical.

Manuel Lemos: I'm not going to be able.  I thought this would be a multitasking machine that would be able to sample audio for different applications.

Michael Kimsal: Linux.

Manuel Lemos: No, it's Windows.  But now that you mention it, it makes sense, I'm using the microphone to actually record, but well anyway, the information that I wanted to show, actually the feature that I wanted to show, it would be able to sample some audio while you are...

Michael Kimsal: You mean the speech not just the Bee Gees or something.

Manuel Lemos: No, it doesn't get it, too slow, here and probably for the reason that you mentioned I would not be able to demonstrate it anyhow, but it seemed to work well for English words because I suppose that's what it supports. I suppose it's not exactly the editor itself that does that, it's some Google API, and that is used...

Michael Kimsal: Oh, hang on, mine is working.  Yeah, oh, I'm going to demonstrate that, see, let me screen share, cancel your screen share.

Manuel Lemos: I've canceled it but it's slow.

Michael Kimsal: It's Brazilian Windows.  How many is in a Brazilian anyway?  Ooh, sorry, that was a George Bush joke from some time ago.

Manuel Lemos: I did not notice that.

Michael Kimsal: Somebody came up to George Bush at a State's dinner and they kind of pulled him aside and said, sir, three Brazilian soldiers have been killed in Iraq, and he says that's horrible, how many's in a Brazilian?  Okay, can you see my screen up?  Have I offended you, Manuel?

Manuel Lemos: For some reason I'm not able to stop my own screen sharing.

Michael Kimsal: Okay, can you see my Chrome up, you see that?

Manuel Lemos: It's fine.

Michael Kimsal: Now, what I understand is happening is it's actually sending the audio back to Google, I've only ever seen this work in Chrome so far, but if I do this... now it's not working, what the heck.

I'm not pheasant plucker, I'm a pheasant plucker's mate.  Wow, that was pretty close but not quite. That was close, but no cigar.  On that bombshell there is speech input for you on Chrome, were you seeing that?  I'll try it one more time.

Manuel Lemos: Just if you could show the result and try to increase the font as much as possible.

Michael Kimsal: Do you see that? 

Manuel Lemos: It is not showing.

Michael Kimsal: Sorry. 

Manuel Lemos: You can see it now?

Michael Kimsal: Oh, yeah.  I can see too much I think.

Manuel Lemos: Well, Google has been messing with Hangouts and some things with screen sharing are not working as they should.  Well, anyway, the point is just to show what this can do.  Let me just try to share again and so I can exit from screen sharing because it's so messed up right now.

Michael Kimsal: Should I sing again while you're waiting?  (Playing guitar)  

Ballons.io Node.js based Web chat system (24:28)

Manuel Lemos: Well, actually moving on to that topic, basically balloons.io is... let me see if you can see it now.

Michael Kimsal: Oh, yeah, it's lovely.

Manuel Lemos: Basically this is a framework, or maybe an application, I'm not sure which would be the right name to call it, to provide a chat system based on Node.js on the server side and other libraries like the Express framework and Socket IO and also Redis for Storage. 

And this looks like an interesting complete application to implement a chat system that would be scalable, I did not try it in practice but it looked interesting enough to mention on this podcast.  I don't know if you have looked at it, what were your impressions?

Michael Kimsal: I haven't run much Node stuff for the past few months, but my initial impression is that it looks nice, visually appealing, whether it's actually going to... it's probably going to work okay at the loads that I would need it, a chat server... I'm not saying well it's a chat server so I'm not going to use it, I actually have one need for a chat system at some point, but I'm probably going to be doing that in Java because the rest of the app's going to be in Java.

So it kind of... I'm certainly not questioning why would you use this, it serves their purpose and it's probably a great piece of software, just not going to be on my server, uh-uh.  You know what I'm talking about.

Manuel Lemos: Right, well, we never know if you need a chat system that will be scalable, probably you may not want to try to develop one from scratch and try this one.

Michael Kimsal: But there are good chat servers written in a lot of languages. I'm sure the asynch aspect of Node probably makes it better suited for some of that, but a lot of people can write basic staple stuff in PHP or Python or Ruby or Java or .net or whatever, and in and of itself the times when I would need a chat server, there's actually one coming up this summer maybe, I still... I'm not comfortable enough to be integrating multiple different types of technologies together.

I'd rather have one app or all the parts of the app using one language right now, that's more just a comfort level on my part, though if I had another two months on the project I would probably want to explore something like this and probably Node and some other alternative things in more detail, but we always have these time pressures on where I end up needing to stick with if not things that I know at least languages and platforms that I know.

I'm going to be looking at Atmosphere as a chat server largely because there's a plugin for the framework I'm using already, and I think it would be faster to do some customization there, though this particular one in Node from a scalability standpoint is probably bigger or probably able to do more.

Manuel Lemos: Yeah, it's also based on Redis. I don't know if you ever worked with Redis, I did not work but I know it somewhat works, it's basically similar to memcached except that the keys can be stored persistently on some database.

So it's still fast to access, but the key values, key-pair values, are stored also in a database, so if you need to shutdown your server for some reason when you restart it, it will still be there.

Michael Kimsal: Hmm-mm, cool.

jQuery++ providing features that jQuery doesn't (28:30)

Manuel Lemos: Well, anyway, moving on to the next topic, I just want to comment briefly about this jQuery++ library.

I don't know if it would be right to call jQuery something because from what I understood this is not so much about jQuery, what jQuery does, it is more about what jQuery does not do.

I don't know if probably it's not very easy to read on the screen that is shared, but it provides a lot of things that the authors thought would be interesting to implement that jQuery does not implement or does not implement as well as they would like, things like text ranges, which I'm not sure if jQuery does not implement, I'm not a regular jQuery user.

But I thought it would be interesting to comment on here just briefly because sometimes people love jQuery but they still miss something that probably is provided by this library that is more like why I thought it would be interesting to comment here.

I do not have much more detail to give than this because I only looked at it briefly, but I think it would be worth mentioning.  You have not looked at it either, right?

Michael Kimsal: I'm looking at it right now and I wanted to comment on something in it, and for the life of me I met this guy and I cannot remember his name, I remember what he looked like. 

I don't mean this guy Justin B. Meyer, I mean the guy whose name I can't remember, but this goes back to CodeStock a couple weeks ago.  There was a presentation from... it's kind of a unique name and some of you watching may recognize, you probably won't because I won't say his name.

But he was from Microsoft and he works on the IE 10 team, or works on the IE team working on IE 10, and he gave a couple of demonstrations of benchmarks saying if you do this in Chrome, Chrome looked faster than IE, but if you do it in this demo IE looks faster than Chrome.

His point was not that IE is better, Chrome's better, but sometimes benchmarks that we look at are kind of stacked, this is Microsoft kind of slinging back a little bit saying, hey, let's measure other things besides looping something over ten thousand times.

But what was interesting after he got through that, which I think he focused on that maybe a little too much, he went through a performance, don't do this, don't do this, and he went through things not to do in JavaScript, not specific to jQuery, just JavaScript code.

If you do this it's going to be slow, if you do this it's going to be faster.  Now all of these almost all cases you're looking at usually pretty small things, but when you do these in loops they're going to be faster.

Now how this relates to what you're talking about, the jQuery++ link is one of the things they mentioned, speed up your app, add fast fix to improve your app's overall performance.

Now fast fix is their... speeds up event fix, that's just speeding up event fix, well, I can't speak to exactly what fast fix is doing, it was interesting to me though to watch his presentation on just JavaScript access patterns, JavaScript usage patterns, and things like if you don't declare this variable in this loop than JavaScript will go up the chain and try to find that same variable in a different scope until it finds it, and if it keeps doing that you're going to be walking the stack several times, or if you do this one other thing then it will bypass maybe checking seven or eight or ten levels of the stack every single time.

Things like that, so I was kind of wondering if jQuery ++ is rewriting or if they've tightened some of their code or if they're doing some rewriting of some of the core jQuery code to be faster.  I don't see that that's necessarily the case, but it might be that they're doing some of that, or if not maybe somebody else should.  So I realize I just kind of threw that at you out of left field, but it was a very interesting talk, opened my eyes about a lot of things.

Sharing the best content of JSClasses in social networks (32:42)

Manuel Lemos: Well, moving on with the podcast, actually we had to restart the recording because it did not come out right, but I'm going to continue from where I was going to go next which is a topic on before we start going to the regular section on the latest objects published in the JS Classes site.

I would like to comment on certain features just made available in the latest days before the recording which is basically now there is support to let the users, any user, not just contributors, to share information on social networks about the best published on the site.

And as you may see on here basically I'm showing a page on which users can let the site know about the social networks they are participating on.

But currently on Facebook is supported, so you can link your JS Classes account to the Facebook account, so whenever there is some good content published on the site you can actually see that content published on your timeline so you have it shared with other users.

Here below we have a list of options of all types of notifications, content that will be published on the user's timeline, and well currently not all of these types of notifications are implemented but soon they will all be ready to go live.

Currently only the support for notifying about new packages published by the person, or notable packages published by the users or some other user are notified.  Soon all other options will be implemented.

Here on the page you may see there are two groups of options, one that is related with the participation of each user, and the options below are related with other content posted by other users like other user's packages that you consider notable or the Innovation Award results, which is not yet started, but hopefully it will be before the end of the year.

And this is just one feature that was implemented recently and I recommend to all users that would like to help make the site better to join in, go in the user options page of the site, there is a link on the right that says Social networks, and it arrives at this page so you can link your JS Classes account to the social networks' account, for now only Facebook is implemented as I said before, but soon Twitter and other social networks will also be supported.

So this is just an invitation for everybody else to help spreading about the great content that is posted on the site because that will hopefully attract more users to eventually post even more great content to the site. 

The Latest Objects Published in the JSClasses site (36:06)

Manuel Lemos: And given that we are going to now move on to one of our regular sections on which we comment on the latest packages published on the JS Classes site.

Fortunately the initiative of the challenge for the Innovation Award is ramping up, as I mentioned in a previous episode the goal is to reach 200 packages, and it is already reaching 77% of that goal. And the estimation to reach the goal is before the end of this year.

And all this means that now you have many packages to comment about, it's going to be hard to be fair with all users that posted with great JavaScript components, but we have to start somewhere and just comment on a few.

I hope now that the authors that we do not mention understand, but we try to give a fair chance to different authors we mention.  Michael, would you like to start with your recommendation?

Michael Kimsal: Sure.  Well, the first thing that caught my eye actually relates somewhat to the balloons.io multi-room chat server we talked about before, and that is a recent... this is Little Chat from Dixan Santiesteban from Cuba, mentioned that before in the earlier version that don't get many people from Cuba.

It's a very lightweight class, I'm going to pull this up here if I can, very lightweight class, doesn't do more than it needs to, and this strikes me as something that you can take and expand but connect back.

He bundles a small PHP file to use on the server side, but really you could use anything on the servers side, this is front end JavaScript stuff.

So just a couple of screens worth of code here, but in the spirit of chat which we're doing right now and which we talked about earlier in the podcast, this is one I thought worth mentioning, and he's from Cuba.

Manuel Lemos: Yeah, actually Dixan has been publishing quite a lot of packages. He arrived to the site just recently, probably attracted with this new initiative of Innovation Award challenge which will award the symbolic prize to the first top contributors that send more notable packages, and currently he's leading that rank.

And he's submitted several packages that are most of them very simple but useful for many purposes, so kudos to Dixan for his contributions, I hope he continues to send even more.  But other than that, which other components would you like to mention?

Michael Kimsal: Well, the other question that I have for you is are you still seeing my screen shared because I stopped it.  Oh, there we go, I'm back.

The next one to review what we talked about before is a Whiteboard from Arturs, I will try to share my screen again and demo a little bit of this.  This object lets a user draw freehand graphics on a page, I'm going atempt fate here and go into... I had the actual code up.  

Manuel Lemos: There is a link in the related link section that goes to a demo page.

Michael Kimsal: Look at how great my drawing is, isn't that sweet.  But we can clear it out too, he's built a clear thing, isn't that great.

Manuel Lemos: This is the love moment of the podcast.

Michael Kimsal: Oh, now you stop, don't go telling everybody.  I'm not actually sure in North Carolina that's allowed anymore.  That said, that was an interesting one to me too, Arturs has, as many people know that listen and watch the podcast, he's been very prolific over the past year or so with JS Classes.

And in terms of looking at the code it's a very nice clean way of saying how do you interact with Canvass, it's doing canvas overlay on regular screen.  So I thought those were worth mentioning this month.

Manuel Lemos: Yes, I was just opening a bracket not to mention Arturs.  Arturs has been pushing a lot of help in making the site better not just with his contributions but other suggestions to improve the site.

We had him in the latest episode just to talk about the Innovation Award challenge, but other than that he has been helping on testing this feature of the social networks, and the one upcoming feature, actually I don't know if I could call it a feature because probably it would be an understatement, which will be something that has been planned for many years and it's now time to implement it, which is basically a unified reputation system that will grant privileges to authors that submit more and better contributions.

It's probably similar to what you have seen in many other sites where you are assigned points to each action that you do, and then depending on how many points you accumulate you will be able to have access to additional privileges in the site.

Well, this is nothing new in the Internet, but it was about time before the JS Classes, also PHP Classes site, to have this kind of system that will hopefully encourage authors to contribute more and submit better contributions.

And I just mentioned this just to give props to Arturs because as I mentioned he not only contributed many classes but also has been helping also defining those privileges and the actions that will considered in that system, but I'll get back to that more later probably in a few months that is ready to at least show something.

And on my part I also would like to comment on a couple of classes from authors that have just arrived to the site, one of them is Gábor Martini from Hungary. And he has submitted a component that is not usual, it's basically a JavaScript component to manage a chess board.

Basically what it does it allows to render a chess board on the webpage, but more than that it also manages the game play, the coordinates of the pieces, and tracking of the moves throughout the game.

The only thing that it does not do is to actually play for one computer player so the user could play against the machine, but that will probably be a topic for an additional component that somebody else can use.

I think at least in this case you can play human vs. human, and if you enjoy chess probably you will appreciate this game.  Even if you do not enjoy chess probably you can learn from how you can implement a board game using JavaScript components.

Michael Kimsal: I have a suggestion for him, the next version, Gábor, should be battle chess.  I'm dating myself by saying that but that was where all the pieces were animated and they would fight with each other, so if he can bundle all that together in his next version I'm not sure what I would do, but my hat would certainly be off to him if I wore a hat.

Manuel Lemos: That would probably be cool.   I remember many, many years ago, I think you mentioned you had and Amiga computer in the past.

Michael Kimsal: Oh, yeah.

Manuel Lemos: There is a chess game, this was in the 90's, a chess game that would actually do that.

Michael Kimsal: That's it, that's battle chess, yes, that's what I'm talking about.

Manuel Lemos: I'm just trying to remember the name.  Yes, that will be cool because I've seen it on an Amiga computer and it will be better to see that on a webpage, and well the idea is given, let's see if Gábor or somebody else would like to pick up on that.

Michael Kimsal: Yes, I will buy a hat and then take it off to them.

Manuel Lemos: Yes, okay, and the other package that I wanted to mention is from Philippe Thomassigny, he has been a regular contributor of the PHP Classes site and he just arrived to JS Classes site.

He's from Mexico and he has been developing very complex framework, and I think this is just part of the whole framework that includes both browser side and client side components.  And this package is quite complex, it provides components for all sorts of purposes, I don't know if you can call it a full stack framework for JavaScript.

Michael Kimsal: I will.  I can, I'm gonna call it, it's a full stack framework.

Manuel Lemos: Okay.  But basically he just submitted it as a framework for building single page applications. We comment about single page applications in a past episode, and this framework helps doing that.

And to take advantage of this framework you probably will need to spend a good time studying the documentation because it's quite extensive. What it does, it can not only render complex user interface that act as if it is a whole application, but it works on a single page.

It can handle everything else like events, AJAX requests, even playing sounds which is something that is not usual on JavaScript applications but we have seen some components to do that.

So kudos for Phillipe for this contribution. I hope he can continue with more components of this level that are not basically just a few classes, it's a whole framework. And with that I think we have ended this part of the podcast.

Articles in the upcoming issue of the JSMag magazine (48:28)

Manuel Lemos: And we are going to move on now to the next section in which Michael comments on the upcoming issue of the JsMag magazine.

Michael Kimsal: Hey, am I ever big on the screen or not, maybe I should make you big again.

Manuel Lemos: Your mouth is just covered again by the Special K label.

Michael Kimsal: Yeah, that's fine, that's the way it should be.

We've got a few things coming up, it's still even though it's just a few days before, we're always in a constant state of flux, I never know quite what's going to come out, but we actually have a lot of things on deck this month.

 We have a piece from Trevor Ward who joined us a couple months ago, he's got a piece on Titanium and using Titanium Appcelerator, sorry, Appcelerator's Titanium with Common.js. We've got Mike Schwartz I think will have another piece in his Silk.js server side framework development series.

We've got a piece from Robert Fisher who joined us many, many moons ago, I think he was in JsMag 1 three years ago about his jQuery periodical updater. And periodical updater was basically a polling mechanism that was built into prototype many moons ago, and he took the core of that and ported it over to work with jQuery's conventions. So he's written up why he did that, how it works, what the differences are, and so on.

We have another piece from Janine Meyer, Dr. Janine Meyer I should say, on mobile geolocation, I should say geolocation in the browser and using local storage and combining those.  We may have a couple other things too, but stay tuned, it should be out next week, first week of July 2012.

Manuel Lemos: Well, it looks cool as usual, great topics will be covered.  I just want to ask a brief question, you mentioned Titanium applications with Common.js, what actually implements Common.js, it's some framework that is provided or it would be based on Node.js or something else?

Michael Kimsal: Common.js is an API that fills in some things that most applications need, sort of like a similar standard library that other like Python and Ruby and so on have, and to be honest I'm still getting my head around what that means.

So I have yet to read the piece in its entirety, the editors have done that and have said yes let's go with it, but I'm actually a little in the dark about what the implication for that would be. Other than having done some Titanium work myself, that was a couple years ago, probably a year and a half ago, I am going to presume that is using the Common.js, some implementation of Common.js and filing in some gaps, but I'm admitting a little bit of -- what's the word I'm looking for, ignorance, yeah, that's the word I'm looking for, ignorance on that.

Manuel Lemos: You have to buy your own magazine to learn more.

Michael Kimsal: Well, I do get it for free, but one of the things I have to rely on the team,  we've got a couple of good editors and production people because I wouldn't be able to do it all myself, just not on a timely basis, so sometimes I don't get to read things until very, very late in the game.

Manuel Lemos: Yeah, well, anyway, it looks interesting.  Anybody that is looking to be up-to-date with interesting technologies, frameworks and so on, should go to jsmag.com and...

Michael Kimsal: Or reach out if you're interested in contributing or writing. You can reach out to me, Michael at jsmag.com and we can get the ball rolling.  If you have some topic you were thinking I might blog about this or I'd like to research this a little bit more, work with us and we will help you get the piece written, we've got a team of editors that take your ideas and help whip them into shape, and we pay you for it too.

Conclusion (52:44)

Manuel Lemos: Right, that's great.  Well, with this we practically ended our podcast, it was a bit of a tough to record it in a single strike, but I think we covered several interesting topics.

And I'd just like to finish with a comment on something that I mentioned before regarding the upcoming features of JS Classes which are also the upcoming features of the PHP Classes site.

There was an article that was published just a few days ago because the PHP Classes site just reached 13 years of age, a teenager.

Michael Kimsal: Congratulations.

Manuel Lemos: You forgot to pick the cake effect.  I'll not try it or else my browser may crash. Anyway, I'll put the link in the show notes of this podcast for those that would like to learn more about things that have been done lately and what is coming up, because since both sites share the same code base, all the upcoming features will be common.  

So on that note, I would like to thank everybody that has been watching. Feel free to comment on the topics that we have covered, eventually suggest more topics that you'd like to see covered in future episodes, so on my part that is all for now, bye.

Michael Kimsal: Nanu nanu.

Manuel Lemos: What language is that?

Michael Kimsal: That's Ork.

Manuel Lemos: I'm so off, I think I need to get more up-to-date with your gang.  Well, that's all for now, bye.

Michael Kimsal: Bye.