Thursday, May 10, 2007

BASIC and CSS

One of the important aspects of integrating a programming language with web development is page layout. Until recently this would have meant inserting lots of HTML tags into your source code. You can do this with Run BASIC.

However there is a better way. It is called CSS (Cascading Style Sheets). This provides a way to wrap the things on your web page with tags that you give your own names to, and you defined the appearance of the stuff wrapped in those tags somewhere else. This way your program's code has very little extra stuff in it to clutter up your code. If there is too much clutter it can be very hard to understand what code means, and this can slow you down and lead to bugs.

So, Scott McLaughlin and I have begun to integrate CSS with Run BASIC. We added a CSSID statement (originally this blog entry had this as CSS, but we changed the command), a DIV statement, and an END DIV statement. Here's a very short example:

cssid #myTag, "{ background: #FFDDDD; font-family: tahoma }"

div myTag
print "count to ten"
for x = 1 to 10
print x
next x
end div

Okay, so this displays all the text printed between the DIV and the END DIV with a light red background, and using the tahoma font. The #myFont token isn't a handle like the ones used for files and GUI controls. The # is simply part of CSS syntax.

DIV statements can be nested, and the contents of one DIV block will be rendered on the page nested inside of each other.

There is a lot more that can be done with CSS, and we're trying to explore what are the simplest and most useful things to include in Run BASIC.

We will be posting a screencast in the next few days that shows how this works.