[1.3.b69] CSS and Chat
Moderators: dorpond, trevor, Azhrei, giliath, jay, Mr.Ice
- Mathemagician
- Dragon
- Posts: 666
- Joined: Tue May 22, 2007 2:27 pm
[1.3.b69] CSS and Chat
I'd like to see the same CSS support that is in frames appear within the chat panel as well. Is this possible, or are they wildly separate beasts?
Re: [1.3.b69] CSS and Chat
Yes. Anything is possible.Mathemagician wrote:Is this possible,
Yes.or are they wildly separate beasts?
What are the specific things that are missing from the chat window? As they both use the same core components I'm curious to know what's missing as it might be something that just isn't "turned on".
- Mathemagician
- Dragon
- Posts: 666
- Joined: Tue May 22, 2007 2:27 pm
Re: [1.3.b69] CSS and Chat
You're right, I should have posted an example.
If I copy / paste this code into the chat, I get a properly formatted frame:
On the other hand, if I copy and paste "the guts" of this example (that is, without the frame wrapper)
I get just black text with a white background.
If I try to get a little more fancy and put my CSS declarations within the html tags, like so:
it's still a no go, I'm getting my CSS declarations displayed in the text.
It is more than possible I'm doing it incorrectly...all the html and css I know I've learned for maptool , but I think it "should" work the way I want it to?
If I copy / paste this code into the chat, I get a properly formatted frame:
Code: Select all
[frame("test"):{
<html>
<head>
<link rel="stylesheet" type="text/css" href="myCSS@Lib:xStatus">
</head>
<body>
<table>
<tr class="itemname">Blurred Strike Ki Focus</tr>
<tr class="info">You can master the secret of speed by catching this small mechanical fly in your hands.</tr>
<tr class="info">Level: 5</tr>
<tr class="info">Price: 1,000 gp</tr>
<tr class="info">Implement (Ki Focus)</tr>
<tr class="info">Enhancement: +1 attack rolls and damage rolls</tr>
<tr class="info">Critical: +1d8 damage</tr>
<tr class="power">Property: You can use your Flurry of Blows power an additional time during your turn, but the two uses of that power must be triggered by two different attacks that you make with this ki focus.</tr>
<tr class="power2">Power (Daily): Free Action. Trigger: You move at least half your speed during this turn. Effect: You gain a +2 bonus to all defenses until the end of your next turn.</tr>
</table>
</body>
</html>
}]
Code: Select all
<html>
<head>
<link rel="stylesheet" type="text/css" href="myCSS@Lib:xStatus">
</head>
<body>
<table>
<tr class="itemname">Blurred Strike Ki Focus</tr>
<tr class="info">You can master the secret of speed by catching this small mechanical fly in your hands.</tr>
<tr class="info">Level: 5</tr>
<tr class="info">Price: 1,000 gp</tr>
<tr class="info">Implement (Ki Focus)</tr>
<tr class="info">Enhancement: +1 attack rolls and damage rolls</tr>
<tr class="info">Critical: +1d8 damage</tr>
<tr class="power">Property: You can use your Flurry of Blows power an additional time during your turn, but the two uses of that power must be triggered by two different attacks that you make with this ki focus.</tr>
<tr class="power2">Power (Daily): Free Action. Trigger: You move at least half your speed during this turn. Effect: You gain a +2 bonus to all defenses until the end of your next turn.</tr>
</table>
</body>
</html>
If I try to get a little more fancy and put my CSS declarations within the html tags, like so:
Code: Select all
[h: str=".itemname {background-color:#FFAA33; color:black; font-weight:bold; font-size:medium; padding:0}
.info{background-color:white; padding:0}
.power { background-color: #FFFFCC; padding:0;line-height:0 }
.power2{background-color:#FFCC99; padding:0;line-heigh:0}
.willname {background-color:green; color:black; font-weight:bold; font-size:medium}
.encname {background-color:red; color:black; font-weight:bold; font-size:medium}
.dailyname {background-color:gray; color:black; font-weight:bold; font-size:medium}
.buttons {background-color:green}"]
<html>
<head>
<style type="text/css">
[r: str]
</style>
</head>
<body>
<table>
<tr class="itemname">Blurred Strike Ki Focus</tr>
<tr class="info">You can master the secret of speed by catching this small mechanical fly in your hands.</tr>
<tr class="info">Level: 5</tr>
<tr class="info">Price: 1,000 gp</tr>
<tr class="info">Implement (Ki Focus)</tr>
<tr class="info">Enhancement: +1 attack rolls and damage rolls</tr>
<tr class="info">Critical: +1d8 damage</tr>
<tr class="power">Property: You can use your Flurry of Blows power an additional time during your turn, but the two uses of that power must be triggered by two different attacks that you make with this ki focus.</tr>
<tr class="power2">Power (Daily): Free Action. Trigger: You move at least half your speed during this turn. Effect: You gain a +2 bonus to all defenses until the end of your next turn.</tr>
</table>
</body>
</html>
It is more than possible I'm doing it incorrectly...all the html and css I know I've learned for maptool , but I think it "should" work the way I want it to?
-
- Dragon
- Posts: 317
- Joined: Fri Apr 23, 2010 8:17 pm
Re: [1.3.b69] CSS and Chat
It's a pain, but have you tried putting 'style' attributes on the individual tags instead? I'd be surprised if an entire HTML document works well in the chat window. My suspicion (though I may well be wrong) is that the whole chat window works like one big HTML document, with fragments continually inserted at the end. That would mean putting 'html', 'head', and 'body' tags in there may not work very well.
EDIT: Example:
EDIT: I tried the above example (minus the elipsis) and it seems to work. I'll leave converting the whole table as an exercise for the reader.
EDIT: Example:
Code: Select all
<table>
<tr><td style="background-color:#FFAA33; color:black; font-weight:bold; font-size:medium; padding:0">Blurred Strike Ki Focus</td></tr>
<tr><td style="background-color:white; padding:0">You can master the secret of speed by catching this small mechanical fly in your hands.</td></tr>
...
</table>
"He knows not how to know who knows not also how to un-know." --Sir Richard Burton
- Mathemagician
- Dragon
- Posts: 666
- Joined: Tue May 22, 2007 2:27 pm
Re: [1.3.b69] CSS and Chat
Yeah, I knew some elements like that are supported....It would just be nice if I could reference the CSS stuff that I've already defined on my lib token, so that I can copy/paste stuff from notepad into chat for my players, or utilize it more easily in macro output. Thanks though.
-
- Dragon
- Posts: 317
- Joined: Fri Apr 23, 2010 8:17 pm
Re: [1.3.b69] CSS and Chat
Here's a great guide and reference on CSS and HTML (the "Wilbur" section is HTML 3.2), by the way.
"He knows not how to know who knows not also how to un-know." --Sir Richard Burton
Re: [1.3.b69] CSS and Chat
Math, your problem is likely the <link> element. The short answer is that it may never work.
The long answer...
The chat window is one, very long document. And the link element likely isn't interpreted except at the very top inside a <head> element, so I doubt you can put text into the chat window early enough to have an effect. (Although you might try dumping the <link> element to the chat log during an onCampaignLoad macro -- that might be as early as you can get.)
If you save the chat log to a file and look at the HTML that is generated when you paste that I think you'll see what I mean.
Some day we'll have an entry in the Campaign Properties where the GM can provide a URI to a global stylesheet. But don't hold your breath.
The long answer...
The chat window is one, very long document. And the link element likely isn't interpreted except at the very top inside a <head> element, so I doubt you can put text into the chat window early enough to have an effect. (Although you might try dumping the <link> element to the chat log during an onCampaignLoad macro -- that might be as early as you can get.)
If you save the chat log to a file and look at the HTML that is generated when you paste that I think you'll see what I mean.
Some day we'll have an entry in the Campaign Properties where the GM can provide a URI to a global stylesheet. But don't hold your breath.
- Mathemagician
- Dragon
- Posts: 666
- Joined: Tue May 22, 2007 2:27 pm
Re: [1.3.b69] CSS and Chat
That makes sense. For the use I had in mind, I can just pop up a frame on all players' windows with the desired formatting, that's not a big deal. (Probably better for me anyway!)
I think the campaign property thing would be a sticky fix...I think the chat pane is loaded prior to, and preserved across opening a campaign file. So there would need to be a way to instantiate a new chat pane with the desired properties.
I think the campaign property thing would be a sticky fix...I think the chat pane is loaded prior to, and preserved across opening a campaign file. So there would need to be a way to instantiate a new chat pane with the desired properties.
-
- Dragon
- Posts: 317
- Joined: Fri Apr 23, 2010 8:17 pm
Re: [1.3.b69] CSS and Chat
Hmm. Yeah. And what about a "/clear" command?
"He knows not how to know who knows not also how to un-know." --Sir Richard Burton
-
- Dragon
- Posts: 317
- Joined: Fri Apr 23, 2010 8:17 pm
Re: [1.3.b69] CSS and Chat
Now you COULD separate out style stuff into another macro or set of macros.... Maybe pass the value you're using for the 'class' attribute now as an argument to the macro, and have it return the sequence of style attributes:
Or simply have a different macro for each style "class":
It's not quite full stylesheet functionality, but it's at least a little separation and reuse....
Code: Select all
<tr><td style="[r, macro("getStyle@this"): "itemname"]">Blurred Strike Ki Focus</td></tr>
<tr><td style="[r, macro(getStyle@this): "info"]">You can master the secret of speed by catching this small mechanical fly in your hands.</td></tr>
Code: Select all
<tr style="[r, macro("css.itemname@this"): ""]>Blurred Strike Ki Focus</tr>
<tr><td style="[r, macro(css.info@this): ""]">You can master the secret of speed by catching this small mechanical fly in your hands.</td></tr>
"He knows not how to know who knows not also how to un-know." --Sir Richard Burton
- jfrazierjr
- Deity
- Posts: 5176
- Joined: Tue Sep 11, 2007 7:31 pm
Re: [1.3.b69] CSS and Chat
What do you mean by that? there is a /cls that clears the entire chat panel... are you thinking of something else?prestidigitator wrote:Hmm. Yeah. And what about a "/clear" command?
I save all my Campaign Files to DropBox. Not only can I access a campaign file from pretty much any OS that will run Maptool(Win,OSX, linux), but each file is versioned, so if something goes crazy wild, I can always roll back to a previous version of the same file.
Get your Dropbox 2GB via my referral link, and as a bonus, I get an extra 250 MB of space. Even if you don't don't use my link, I still enthusiastically recommend Dropbox..
Get your Dropbox 2GB via my referral link, and as a bonus, I get an extra 250 MB of space. Even if you don't don't use my link, I still enthusiastically recommend Dropbox..
-
- Dragon
- Posts: 317
- Joined: Fri Apr 23, 2010 8:17 pm
Re: [1.3.b69] CSS and Chat
It's an alias for the same command. Try it.jfrazierjr wrote:What do you mean by that? there is a /cls that clears the entire chat panel... are you thinking of something else?prestidigitator wrote:Hmm. Yeah. And what about a "/clear" command?
But yeah, that's what I meant. Not only does chat persist between the loading of campaign files, but it can be cleared at any time. That PROBABLY causes the entire document to be recreated, so I wouldn't assume things you did on "onCampaignLoad" could persist after that. I COULD be wrong; maybe it simply removes any children of the 'body' element. But it's the kind of thing that doesn't seem well specified, so it could easily be expected to change in the future....
"He knows not how to know who knows not also how to un-know." --Sir Richard Burton
- jfrazierjr
- Deity
- Posts: 5176
- Joined: Tue Sep 11, 2007 7:31 pm
Re: [1.3.b69] CSS and Chat
Ah.. so your talking about clear in reference to how the html link element would work in chat.... sometime I am so dense...lolprestidigitator wrote:It's an alias for the same command. Try it.jfrazierjr wrote:What do you mean by that? there is a /cls that clears the entire chat panel... are you thinking of something else?prestidigitator wrote:Hmm. Yeah. And what about a "/clear" command?
But yeah, that's what I meant. Not only does chat persist between the loading of campaign files, but it can be cleared at any time. That PROBABLY causes the entire document to be recreated, so I wouldn't assume things you did on "onCampaignLoad" could persist after that. I COULD be wrong; maybe it simply removes any children of the 'body' element. But it's the kind of thing that doesn't seem well specified, so it could easily be expected to change in the future....
I save all my Campaign Files to DropBox. Not only can I access a campaign file from pretty much any OS that will run Maptool(Win,OSX, linux), but each file is versioned, so if something goes crazy wild, I can always roll back to a previous version of the same file.
Get your Dropbox 2GB via my referral link, and as a bonus, I get an extra 250 MB of space. Even if you don't don't use my link, I still enthusiastically recommend Dropbox..
Get your Dropbox 2GB via my referral link, and as a bonus, I get an extra 250 MB of space. Even if you don't don't use my link, I still enthusiastically recommend Dropbox..
-
- Dragon
- Posts: 317
- Joined: Fri Apr 23, 2010 8:17 pm
Re: [1.3.b69] CSS and Chat
No worries, mate. You gotta be dense sometimes. Too much work otherwise. Bad for the digestion.jfrazierjr wrote:Ah.. so your talking about clear in reference to how the html link element would work in chat.... sometime I am so dense...lol
"He knows not how to know who knows not also how to un-know." --Sir Richard Burton
Re: [1.3.b69] CSS and Chat
But creating the chat panel isn't the problem -- if the first text written to the chat panel is a <head> element with a nested <link> element, it should work fine.Mathemagician wrote:I think the chat pane is loaded prior to, and preserved across opening a campaign file. So there would need to be a way to instantiate a new chat pane with the desired properties.
The first element that appears in the chat panel which is NOT valid inside the <head> is probably what triggers the Java code to switch from the head to the body. And once switched, you can't get back.