Reserved Words?

I was working on a program to convert ***very*** simple html to Run BASIC and discovered this peculiarity.
This code runs as expected

Cls
Call SetCSS
Div MainContainer
Div pre
Print "Hello World!"
End Div
Link #quit, " Quit ", XbyLink
End Div
Wait

Sub XbyLink handle$
Cls
End
End Sub

Sub SetCSS
cssID #MainContainer, "{
Margin-Top: 20px;
Margin-Left: 100px;
Width: 800px;
Background-Color: #FFFFCC;
Border-Style: Solid;
Border-Color: #3300FF;
Padding: 30px 30px 30px 30px;
}"
cssID #pre, "{
Padding: 30px 30px 30px 30px;
Font-Family: 'Times_New_Roman';
Font-Size: 12pt;
Background-Color: #CCCC99;
Color: #3399FF;
Border-Style: Double;
}"
End Sub

But, change #pre to #code

Cls
Call SetCSS
Div MainContainer
Div code
Print "Hello World!"
End Div
Link #quit, " Quit ", XbyLink
End Div
Wait

Sub XbyLink handle$
Cls
End
End Sub

Sub SetCSS
cssID #MainContainer, "{
Margin-Top: 20px;
Margin-Left: 100px;
Width: 800px;
Background-Color: #FFFFCC;
Border-Style: Solid;
Border-Color: #3300FF;
Padding: 30px 30px 30px 30px;
}"
cssID #code, "{
Padding: 30px 30px 30px 30px;
Font-Family: 'Times_New_Roman';
Font-Size: 12pt;
Background-Color: #CCCC99;
Color: #3399FF;
Border-Style: Double;
}"
End Sub

and you change the color of the Run BASIC text editor. Is there a list of reserved words that shouldn't be used for handles anyplace?

Janet,

The #code is not a handle in this case. It is a CSS rule name. I realize that's confusing, but CSS uses the # for it's own purpose.

As for conflicts in this space, this is certainly going to happen sometimes. I have been meaning to rename all the RB CSS rules to have an RB or runBasic in front of them, but this will have to wait.

I will try to get a list of rule names into the docs.

-Carl

The following CSS IDs are used when the main editor is displayed:

#div-4
#div-build
#runBasicHeader
#primary
#runBasicMain
#div-toolbar
#code
#monospaced

The folowing CSS Classes are used:
.toolbarbutton
.checkbox
.hidden
.logout

Of course, you wouldn't be able to use #div-4, #div-build or #div-toolbar natively anyway; it appears that RB doesn't support CSS IDs with dashes in their names.

When defining a CSS rule, if there is no special first character, then it is defining a rule for a tag.
If there is a # in front of the name, then it is defining a rule for an ID.
If there is a . in front of the name, then it is defining a rule for a class.


And I didn't bother looking through the source code to get this information; I just used the Web Developer Toolbar extension for Firefox. I also reinstalled Firefox to get the DOM Inspector tool. Both are extremely useful.

The Web Developer Tool is available here: chrispederick.com/work/web-developer/

Thanks for the explanation, Carl. I knew I had run into something that was 'spilling into' the html/css code. That's why I called it a peculiarity and not a bug. Seems like getting a list of rule names is not a number one priority.

Will the final documentation be something that can be easily updated online and downloaded routinely? That seems preferable over a stand-alone help file used by LB and JB.

Chris,
Thanks for that list. We all have our own distinct styles of writing code and naming variables. #primary is definitely a name I would use. .hidden is another. So if I come across any other 'peculiarities', I'll just reflect back on this post and choose another name. :)
So now I've got my #handles separated from my #css rules names and I'm getting better'n'better at tech savvy talk. ;)