Skip to content

Commit 72f3ac5

Browse files
FoxLeeFoxLee
authored
Initial publication
1 parent 834a149 commit 72f3ac5

13 files changed

Lines changed: 798 additions & 0 deletions

‎burble.js‎

Lines changed: 120 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,120 @@
1+
import {registerConfigs} from "./config.js";
2+
3+
export default class Burble{
4+
static ID = 'fox-burble';
5+
static NAME = 'Burble';
6+
7+
static SETTINGS = {
8+
SPEECH_FONT: 'speech-font',
9+
ON_OFF: 'on-off'
10+
}
11+
12+
static loadCSS() {
13+
// Get HTML head element
14+
if (game.settings.get(Burble.ID,Burble.SETTINGS.ON_OFF)){
15+
16+
var head = document.getElementsByTagName('HEAD')[0];
17+
18+
var link = document.createElement('link');
19+
link.rel = 'stylesheet';
20+
link.type = 'text/css';
21+
link.href = './modules/fox-burble/styles/main.css';
22+
head.appendChild(link);
23+
24+
if (game.settings.get(Burble.ID,Burble.SETTINGS.SPEECH_FONT) != 'default'){
25+
var link = document.createElement('link');
26+
link.rel = 'stylesheet';
27+
link.type = 'text/css';
28+
link.href = `./modules/fox-burble/styles/${game.settings.get(Burble.ID,Burble.SETTINGS.SPEECH_FONT)}.css`;
29+
head.appendChild(link);
30+
}
31+
32+
//console.log(`GAME SYSTEM: ${game.system.id}`);
33+
if (['dnd4e','blades-in-the-dark'].includes(game.system.id)){
34+
var link = document.createElement('link');
35+
link.rel = 'stylesheet';
36+
link.type = 'text/css';
37+
link.href = `./modules/fox-burble/styles/${game.system.id}.css`;
38+
head.appendChild(link);
39+
40+
if (game.settings.get("dnd4e","darkMode")){
41+
link = document.createElement('link');
42+
link.rel = 'stylesheet';
43+
link.type = 'text/css';
44+
link.href = './modules/fox-burble/styles/dnd4e_dark.css';
45+
head.appendChild(link);
46+
}
47+
}
48+
49+
}
50+
}
51+
}
52+
53+
Hooks.once('init', () => {
54+
registerConfigs();
55+
Burble.loadCSS();
56+
});
57+
58+
Hooks.on('renderChatMessage', async function(message, html, data){
59+
if(!game.settings.get(Burble.ID,Burble.SETTINGS.ON_OFF)) return;
60+
61+
console.log(data);
62+
html[0].classList.add('burble');
63+
if(data?.cssClass=="emote") return;
64+
65+
if(message.isRoll){
66+
html[0].classList.add('roll');
67+
if(message.flags?.core?.initiativeRoll){
68+
html[0].classList.add('notice');
69+
}else if(message.content.startsWith('<div class="table-draw')){
70+
html[0].classList.add('roll-table','notice');
71+
}
72+
}else if( data?.cssClass=="ic" || (!message.speaker?.actor && !message.content.startsWith("<"))){
73+
html[0].classList.add('speech');
74+
}else{
75+
html[0].classList.add('notice');
76+
if(message?.flavor == 'Item Piles'){
77+
html[0].classList.add('item-piles');
78+
}
79+
}
80+
81+
if(!message.speaker?.token && !html[0].classList.contains('narrator-chat')){
82+
html[0].classList.add('system-message');
83+
}
84+
85+
//Special for D&D4e compatibility
86+
if (['dnd4e'].includes(game.system.id)){
87+
88+
if(message.isRoll){
89+
if(data.message?.rolls[0].search("RollWithOriginalExpression") > 0){
90+
html[0].classList.add('notice');
91+
}
92+
}
93+
94+
if(message.content.startsWith('<div class="dnd4e')){
95+
let cardContainer;
96+
let buttonElement;
97+
let panelElement;
98+
99+
if(message.content.startsWith('<div class="dnd4e chat-card')){
100+
html[0].classList.add('chat-card');
101+
html[0].classList.remove('notice');
102+
cardContainer = html.find(".chat-card")[0];
103+
buttonElement = html.find(".card-buttons")[0];
104+
panelElement = html.find(".effects-tray")[0];
105+
}else if(message.content.startsWith('<div class="dnd4e dot-report')){
106+
html[0].classList.add('dot-report');
107+
cardContainer = html.find(".dot-report")[0].parentElement;
108+
buttonElement = html.find(".chatDamageButtons")[0];
109+
panelElement = html.find(".effects-tray")[0];
110+
}
111+
112+
if(buttonElement){
113+
cardContainer.appendChild(buttonElement);
114+
}
115+
if(panelElement){
116+
cardContainer.appendChild(panelElement);
117+
}
118+
}
119+
}
120+
});

‎config.js‎

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
import Burble from "./burble.js";
2+
3+
export function registerConfigs() {
4+
game.settings.register(Burble.ID, Burble.SETTINGS.ON_OFF, {
5+
name: `Burble.settings.${Burble.SETTINGS.ON_OFF}.Name`,
6+
default: true,
7+
type: Boolean,
8+
scope: 'client',
9+
config: true,
10+
hint: `Burble.settings.${Burble.SETTINGS.ON_OFF}.Hint`,
11+
onChange: debouncedReload
12+
});
13+
game.settings.register(Burble.ID, Burble.SETTINGS.SPEECH_FONT, {
14+
name: `Burble.settings.${Burble.SETTINGS.SPEECH_FONT}.Name`,
15+
default: 'komika-slick',
16+
type: String,
17+
scope: 'client',
18+
config: true,
19+
choices: {
20+
"komika-slick": `Burble.settings.${Burble.SETTINGS.SPEECH_FONT}.komika-slick`,
21+
"komika-hand": `Burble.settings.${Burble.SETTINGS.SPEECH_FONT}.komika-hand`,
22+
"komika-slim": `Burble.settings.${Burble.SETTINGS.SPEECH_FONT}.komika-slim`,
23+
"komika-jam": `Burble.settings.${Burble.SETTINGS.SPEECH_FONT}.komika-jam`,
24+
"default": `Burble.settings.${Burble.SETTINGS.SPEECH_FONT}.default`
25+
},
26+
hint: `Burble.settings.${Burble.SETTINGS.SPEECH_FONT}.Hint`,
27+
onChange: debouncedReload
28+
});
29+
}

‎lang/en-au.json‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
{
2+
"Burble.settings.speech-font.Name": "Speech bubble font",
3+
"Burble.settings.on-off.Name": "Active",
4+
"Burble.settings.speech-font.Hint": "Use a comic-book lettering font for speech bubbles?",
5+
"Burble.settings.on-off.Hint": "Use Cute Chat styles",
6+
"Burble.settings.speech-font.komika-hand": "Komika Hand",
7+
"Burble.settings.speech-font.komika-slick": "Komika Slick",
8+
"Burble.settings.speech-font.komika-slim": "Komika Slim",
9+
"Burble.settings.speech-font.komika-jam": "Komika Jam",
10+
"Burble.settings.speech-font.default": "No (don't change)"
11+
}

‎lang/en-us.json‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
{
2+
"Burble.settings.speech-font.Name": "Speech bubble font",
3+
"Burble.settings.on-off.Name": "Active",
4+
"Burble.settings.speech-font.Hint": "Use a comic-book lettering font for speech bubbles?",
5+
"Burble.settings.on-off.Hint": "Use Cute Chat styles",
6+
"Burble.settings.speech-font.komika-hand": "Komika Hand",
7+
"Burble.settings.speech-font.komika-slick": "Komika Slick",
8+
"Burble.settings.speech-font.komika-slim": "Komika Slim",
9+
"Burble.settings.speech-font.komika-jam": "Komika Jam",
10+
"Burble.settings.speech-font.default": "No (don't change)"
11+
}

‎module.json‎

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
{
2+
"title": "Burble",
3+
"id": "fox-burble",
4+
"description": "A comic-book inspired chat redesign",
5+
"version": "1.0",
6+
"url": "https://github.com/FoxLee/burble/",
7+
"manifest": "https://github.com/FoxLee/burble/releases/latest/download/module.json",
8+
"download": "https://github.com/FoxLee/burble/releases/latest/download/module.zip",
9+
"license": "https://github.com/FoxLee/burble/blob/main/LICENSE",
10+
"readme": "https://github.com/FoxLee/burble/blob/main/README.md",
11+
"bugs": "https://github.com/FoxLee/burble/issues",
12+
"authors": [{
13+
"name": "Fox Lee",
14+
"discord": "TheArtGremblin",
15+
"email": "fox@invincible.ink",
16+
"url": "https://www.invincible.ink"
17+
}],
18+
"compatibility": {
19+
"minimum": "11",
20+
"verified": "11.315"
21+
},
22+
"esmodules": [
23+
"burble.js"
24+
],
25+
"languages": [
26+
{
27+
"lang": "en",
28+
"name": "US English",
29+
"path": "lang/en-us.json",
30+
"flags": {}
31+
},
32+
{
33+
"lang": "en-AU",
34+
"name": "Australian English",
35+
"path": "lang/en-au.json",
36+
"flags": {}
37+
}
38+
],
39+
"hotReload": {
40+
"extensions": [
41+
"css",
42+
"html"
43+
],
44+
"paths": [
45+
"styles/"
46+
]
47+
}
48+
}

‎styles/blades-in-the-dark.css‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
/* BURBLE for BitD */
2+
3+
.chat-message .message-content .label-stripe-chat{
4+
margin-left:-5px;
5+
margin-right:-5px;
6+
margin-top:-5px;
7+
}
8+
.chat-message .message-content .label-stripe-chat-small{
9+
margin-left:-5px;
10+
margin-right:-5px;
11+
}
12+
.chat-message.burble .blades-die-tooltip .description+em{
13+
display:block;
14+
font-family:var(--comic-text-font);
15+
font-size:var(--comic-text-size);
16+
margin:-5px -5px 0.3rem;
17+
padding:0.5rem;
18+
font-style:italic;
19+
color:#000;
20+
font-weight:500;
21+
}

‎styles/dnd4e.css‎

Lines changed: 135 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,135 @@
1+
/* BURBLE for D&D4e */
2+
3+
*.chat-message{
4+
--background-alternate:rgba(0,0,0,0.12);
5+
--colour-text-inside:var(--color-text-dark-primary);
6+
--background-container:url('../../../ui/parchment.jpg') repeat;
7+
}
8+
.chat-message:is(.chat-card,.dot-report) .message-content{
9+
padding:0;
10+
background:transparent;
11+
color:var(--colour-text-outside);
12+
}
13+
.chat-message.chat-card .message-content .card-content,
14+
.chat-message.dot-report .message-content .dot-report{
15+
background:var(--background-container);
16+
color:var(--colour-text-inside);
17+
}
18+
.chat-message.dot-report .message-content .dot-report{
19+
padding:0.3rem;
20+
}
21+
.chat-message.chat-card .message-content .card-content p:is(.chat-flavour,.flavour){
22+
font-style:italic;
23+
background:var(--gradient-4e);
24+
}
25+
.dnd4e.chat-card .card-header,
26+
.dnd4e.chat-card .card-buttons button,
27+
.fakechatbutton,
28+
.effects-tray{
29+
background:var(--background-container);
30+
color:var(--colour-text-inside);
31+
}
32+
.dnd4e.chat-card .card-buttons button,
33+
.fakechatbutton{
34+
border:var(--border-normal);
35+
}
36+
.dnd4e.chat-card .card-buttons{
37+
margin:2px 0;
38+
}
39+
.chatDamageButtons{
40+
margin:5px 0;
41+
display:-webkit-box;
42+
display:-ms-flexbox;
43+
display:flex;
44+
-ms-flex-wrap:wrap;
45+
flex-wrap:wrap;
46+
-webkit-box-pack:justify;
47+
-ms-flex-pack:justify;
48+
justify-content:space-between;
49+
}
50+
.fakechatbutton{
51+
margin:0;
52+
-ms-flex-preferred-size:calc(50% - 2px);
53+
flex-basis:calc(50% - 2px);
54+
overflow:hidden;
55+
-webkit-box-flex:0;
56+
-ms-flex-positive:0;
57+
flex-grow:0;
58+
}
59+
.effects-tray{
60+
padding:0.3rem 0.5rem;
61+
border-radius:3px;
62+
}
63+
.effects-tray .effects{
64+
margin:0;
65+
padding:0;
66+
}
67+
.effects-tray:not(.collapsed) .effects{
68+
margin-top:0.3rem;
69+
}
70+
.dnd4e.chat-card .effects-tray .effects .effect{
71+
padding:0.3rem;
72+
margin-bottom:0;
73+
border-bottom:0;
74+
}
75+
.dnd4e.chat-card .effects-tray .effects .effect img{
76+
border:unset;
77+
}
78+
.dnd4e .effects-tray .name-stacked .title{
79+
font-family:inherit;
80+
}
81+
.effects-tray .effects .effect:nth-child(odd){
82+
background:var(--background-alternate);
83+
}
84+
.chat-message.notice.system-message .message-content>:is(b,p):first-child,
85+
.chat-message.notice.system-message .message-content>.chat-portrait-flexrow:first-child+:is(b,p){
86+
font-family:revert;
87+
font-size:0.7rem;
88+
padding:0.3rem;
89+
font-style:revert;
90+
text-transform:uppercase;
91+
position:relative;
92+
background:var(--background-alternate);
93+
margin-top:-0.3rem;
94+
margin-left:-0.3rem;
95+
margin-right:-0.3rem;
96+
}
97+
.dnd4e.chat-card .card-header{
98+
background:var(--background-other);
99+
border:unset;
100+
padding:0;
101+
}
102+
.dnd4e.power-card .item-name{
103+
background:unset;
104+
}
105+
.dnd4e.power-card.use-atwill .card-header{
106+
background:var(--background-atwill);
107+
}
108+
.dnd4e.power-card.use-encounter .card-header{
109+
background:var(--background-encounter);
110+
}
111+
.dnd4e.power-card.use-daily .card-header{
112+
background:var(--background-daily);
113+
}
114+
.dnd4e.power-card.use-item .card-header{
115+
background:var(--background-item);
116+
}
117+
.dnd4e.power-card.use-recharge .card-header{
118+
background:var(--background-recharge);
119+
}
120+
.dnd4e.power-card.use-other .card-header{
121+
background:var(--background-other);
122+
}
123+
.dnd4e.chat-card .card-content>p{
124+
margin:0;
125+
padding:1px 3px;
126+
background:var(--gradient-4e);
127+
}
128+
.chat-message a.content-link,.chat-message a.inline-result{
129+
border:0;
130+
background:0;
131+
padding:0;
132+
text-decoration:underline;
133+
-webkit-text-decoration-style:dotted;
134+
text-decoration-style:dotted;
135+
}

0 commit comments

Comments
 (0)