slaguru666/roll20-character-sheets-tester
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Divided Characters

Browse Source 
Added Options for Divided (Archetype #19). Alternate Personalities are now available, as well as rolling with 2 powers or 2 qualities.
This commit is contained in:
the-Dissilent
2021-12-04 21:34:47 -05:00
parent 6eb0391e45
commit e8dd940f1a
2 changed files with 324 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Sentinel Comics RPG/SCRPG-Sheet.css
+18 -6
View File
@@ -19,6 +19,9 @@
.sheet-statusgrid {
display: grid; grid-template-columns: 30px 65px auto 50px 50px;
}
.sheet-dividedgrid {
display: grid; grid-template-columns: 15px auto 25px auto 65px 65px 65px;
}
.sheet-shead {display: inline-grid; place-items: center;}
.sheet-sgreen {background-color: #41b23b; display: inline-grid; place-items: center;}
.sheet-syellow {background-color: #f8df1b; display: inline-grid; place-items: center;}
@@ -87,6 +90,21 @@
.sheet-tabstoggle[value="auxiliary"] ~ div.sheet-modey2,
.sheet-tabstoggle[value="auxiliary"] ~ div.sheet-moder1 {display: block;}
/* Hide Powers, Qualities, or Modes from ability and villain tabs */
.sheet-modeselect[value="0"] ~ div.sheet-modebase,
.sheet-tabstoggle[value="villain"] ~ div.sheet-modebase,
.sheet-tabstoggle:not([value="villain"]) + .sheet-modeselect:not([value="0"]) ~ div.sheet-powerbase,
.sheet-dividedselect[value="1"] + .sheet-divideddouble[value="on"] ~ div.sheet-powerbase,
.sheet-dividedselect[value="0"] ~ div.sheet-dividedeither,
.sheet-dividedselect[value="2"] ~ div.sheet-dividedcivilian,
.sheet-dividedselect:not([value="2"]) ~ div.sheet-dividedheroic,
.sheet-dividedselect[value="2"] + .sheet-divideddouble[value="on"] ~ div.sheet-rightquality,
.sheet-leftquality,
.sheet-rightpower {display: none;}
.sheet-dividedselect[value="2"] + .sheet-divideddouble[value="on"] ~ div.sheet-rightpower,
.sheet-dividedselect[value="1"] + .sheet-divideddouble[value="on"] ~ div.sheet-leftquality {display: block;}
/* change font of die in roll buttons */
button[type=roll].sheet-rolldice::before { content: ''; font-family: 'dicefontd4'; }
@@ -106,12 +124,6 @@ input.sheet-icon-cycle:not([value="4"]) ~ span.sheet-boost,
input.sheet-icon-cycle:not([value="5"]) ~ span.sheet-hinder,
input.sheet-icon-cycle:not([value="6"]) ~ span.sheet-recover {display: none;}
/* Hide Powers or Modes from ability and villain tabs */
.sheet-modeselect[value="0"] ~ div.sheet-modebase,
.sheet-tabstoggle[value="villain"] ~ div.sheet-modebase,
.sheet-tabstoggle:not([value="villain"]) + .sheet-modeselect:not([value="0"]) ~ div.sheet-powerbase {display: none;}
/* Clear default open/close button styling */
button.sheet-direction,
button.sheet-lock {
Sentinel Comics RPG/SCRPG-Sheet.html
+306 -49
View File
@@ -256,10 +256,32 @@
<div class="col" style="width: 100%; height: 15px;"></div>
</div>
<div class='abilities villain'>
<!-- Divided Toggle-->
<input type="hidden" class="dividedselect" name="attr_civilianoheroic" value="0" />
<div class="dividedeither">
<div class="flexrow">
<div class="flexspace"></div>
<input type="text" class="typed-head" name="attr_divided1name" value="Character's Civilian Form" style="width: 40%">
<div class="flexspace"></div>
<!--Button facing left or right-->
<input type="hidden" class="dividedselect" name="attr_civilianoheroic" value="0" />
<div class="dividedcivilian">
<button type="action" name="act_divided_toggle">◀</button>
</div>
<div class="dividedheroic">
<button type="action" name="act_divided_toggle">▶</button>
</div>
<div class="flexspace"></div>
<input type="text" class="typed-head" name="attr_divided2name" value="Character's Heroic Form" style="width: 40%">
<div class="flexspace"></div>
</div>
</div>
<!-- POWERS / QUALITIES (REPEATING) / STATUS -->
<div class="flexrow" style="border-style: solid; border-width: 1%;">
<input type='hidden' class='tabstoggle' name='attr_sheetTab' value='description' />
<input type="hidden" class="modeselect" name="attr_poweromode" value="0" />
<input type="hidden" class="dividedselect" name="attr_civilianoheroic" value="0" />
<input type="hidden" class="divideddouble" name="attr_usingdouble" value="0" />
<!-- Powers -->
<div class='powerbase' style="width: 33%;">
<h3>Powers</h3>
@@ -309,9 +331,58 @@
<b><span style="font-family: 'dicefontd10'">0</span></b>
</button>
</div>
<!-- Qualities (repeat for Divided)-->
<div class='leftquality' style="width: 33%;">
<h3>Qualities</h3>
<fieldset class="repeating_qualities">
<input type="text" name="attr_quality" style="width: 60%; float: left;">
<select name="attr_qualitydtype" style="width: 20%; float: left;">
<option value="d0" selected>-</option>
<option value="d4">d4</option>
<option value="d6">d6</option>
<option value="d8">d8</option>
<option value="d10">d10</option>
<option value="d12">d12</option>
</select>
<input type="checkbox" name="attr_powercheck" value="1" style="width: 25px; height: 25px; margin: 0 auto; float: left; margin-left: 5px;">
</fieldset>
<div class="col" style="width: 80%; border-style: solid; border-width: 1%;">
<input type="text" name="attr_power_chosen" style="width: 75%; float: left;" value='Untrained Quality'>
<input type="text" name="attr_power_value" style="width: 25%; float: left;" value='d4'>
</div>
<button type='roll' class='rolldice' name='roll_power' value='
&{template:default} {{name=@{character_name} - Quality}} {{@{power_chosen} - @{power_value}=[[@{power_value}cs>13cf<0]]}}'>
<b><span style="font-family: 'dicefontd10'">0</span></b>
</button>
</div>
<div class="morespace leftquality"></div>
<div class="morespace powerbase"></div>
<!-- Powers (repeat for Divided) -->
<div class='rightpower' style="width: 33%;">
<h3>Powers</h3>
<fieldset class="repeating_powers">
<input type="text" name="attr_power" style="width: 60%; float: left;">
<select name="attr_powerdtype" style="width: 20%; float: left;">
<option value="d0" selected>-</option>
<option value="d4">d4</option>
<option value="d6">d6</option>
<option value="d8">d8</option>
<option value="d10">d10</option>
<option value="d12">d12</option>
</select>
<input type="checkbox" name="attr_qualitycheck" value="1" style="width: 25px; height: 25px; margin: 0 auto; float: left; margin-left: 5px;">
</fieldset>
<div class="col" style="width: 80%; border-style: solid; border-width: 1%;">
<input type="text" name="attr_quality_chosen" style="width: 75%; float: left;" value='Untrained Power'>
<input type="text" name="attr_quality_value" style="width: 25%; float: left;" value='d4'>
</div>
<button type='roll' class='rolldice' name='roll_quality' value='
&{template:default} {{name=@{character_name} - Power}} {{@{quality_chosen} - @{quality_value}=[[@{quality_value}cs>13cf<0]]}}'>
<b><span style="font-family: 'dicefontd10'">0</span></b>
</button>
</div>
<!-- Qualities -->
<div style="width: 33%;">
<div class='rightquality' style="width: 33%;">
<h3>Qualities</h3>
<fieldset class="repeating_qualities">
<input type="text" name="attr_quality" style="width: 60%; float: left;">
@@ -351,13 +422,25 @@
<div class="sgreen">Min</div>
<div class="sgreen"><input type="checkbox" name="attr_greencheck" value="1" style="width: 25px; height: 25px; margin: 0 auto; margin-left: 5px;"></div>
<div class="sgreen">
<select name="attr_greendtype" class="gdtype" style="width: 55px">
<option value="d0">-</option>
<option value="d6">d6</option>
<option value="d8">d8</option>
<option value="d10">d10</option>
<option value="d12">d12</option>
</select>
<input type="hidden" class="dividedselect" name="attr_civilianoheroic" value="0" />
<div class="dividedcivilian">
<select name="attr_greendtype" class="gdtype" style="width: 55px">
<option value="d0">-</option>
<option value="d6">d6</option>
<option value="d8">d8</option>
<option value="d10">d10</option>
<option value="d12">d12</option>
</select>
</div>
<div class="dividedheroic">
<select name="attr_green2dtype" class="gdtype" style="width: 55px">
<option value="d0">-</option>
<option value="d6">d6</option>
<option value="d8">d8</option>
<option value="d10">d10</option>
<option value="d12">d12</option>
</select>
</div>
</div>
<div class="sgreen"></div>
<div class="sgreen"><input type="number" name="attr_health_max" style="width: 42px" value=17></div>
@@ -370,13 +453,25 @@
<div class="syellow">Min</div>
<div class="syellow"><input type="checkbox" name="attr_yellowcheck" value="1" style="width: 25px; height: 25px; margin: 0 auto; margin-left: 5px;"></div>
<div class="syellow">
<select name="attr_yellowdtype" class="ydtype" style="width: 55px">
<option value="d0">-</option>
<option value="d6">d6</option>
<option value="d8">d8</option>
<option value="d10">d10</option>
<option value="d12">d12</option>
</select>
<input type="hidden" class="dividedselect" name="attr_civilianoheroic" value="0" />
<div class="dividedcivilian">
<select name="attr_yellowdtype" class="ydtype" style="width: 55px">
<option value="d0">-</option>
<option value="d6">d6</option>
<option value="d8">d8</option>
<option value="d10">d10</option>
<option value="d12">d12</option>
</select>
</div>
<div class="dividedheroic">
<select name="attr_yellow2dtype" class="gdtype" style="width: 55px">
<option value="d0">-</option>
<option value="d6">d6</option>
<option value="d8">d8</option>
<option value="d10">d10</option>
<option value="d12">d12</option>
</select>
</div>
</div>
<div class="syellow"></div>
<span class="syellow" name="attr_yellowmax"></span>
@@ -389,13 +484,25 @@
<div class="sred">Min</div>
<div class="sred"><input type="checkbox" name="attr_redcheck" value="1" style="width: 25px; height: 25px; margin: 0 auto; margin-left: 5px;"></div>
<div class="sred">
<select name="attr_reddtype" class="rdtype" style="width: 55px">
<option value="d0">-</option>
<option value="d6">d6</option>
<option value="d8">d8</option>
<option value="d10">d10</option>
<option value="d12">d12</option>
</select>
<input type="hidden" class="dividedselect" name="attr_civilianoheroic" value="0" />
<div class="dividedcivilian">
<select name="attr_reddtype" class="ydtype" style="width: 55px">
<option value="d0">-</option>
<option value="d6">d6</option>
<option value="d8">d8</option>
<option value="d10">d10</option>
<option value="d12">d12</option>
</select>
</div>
<div class="dividedheroic">
<select name="attr_red2dtype" class="gdtype" style="width: 55px">
<option value="d0">-</option>
<option value="d6">d6</option>
<option value="d8">d8</option>
<option value="d10">d10</option>
<option value="d12">d12</option>
</select>
</div>
</div>
<div class="sred"></div>
<span class="sred" name="attr_redmax"></span>
@@ -448,9 +555,9 @@
</div>
<div class='abilities aux'>
<!-- MODES / FORMS -->
<!-- First Radio Button disables Forms/Modes -->
<input type="hidden" class="modeselect" name="attr_poweromode" value="0" />
<input type='hidden' class='tabstoggle' name='attr_sheetTab' value='description' />
<!-- First Radio Button disables Forms/Modes -->
<div class="mode0">
<input type="radio" value="0" name="attr_moderadio" checked="true" />
<div class="col"><h3>Character has no Alternate Forms or Modes</h3></div>
@@ -1009,6 +1116,88 @@
</div>
<div class="col" style="width: 100%; height: 15px;"></div>
</div>
<!-- Divided Options-->
<div class="mode0">
<div class="flexrow">
<h2>Divided Options:</h2><div class="col" style="width: 5px;"></div>
<input type="hidden" class="lock" name="attr_sourcebook" value="hide" />
<div class="col sourceinput"><b>*Sourcebook</b>
<input type="text" name="attr_divided_sourcebook" value="SCRPG:Core p94-95" style="width: 61%">
</div>
</div>
<div style="border-style: solid; border-width: 1%">
<div class="dividedgrid">
<input type="radio" value="0" name="attr_dividedradio" style="height: 35px" checked="true" />
<div class="col"><h3>Character does not use Divided Template</h3></div>
<div></div><div></div>
<div class="sgreen">Green</div>
<div class="syellow">Yellow</div>
<div class="sred">Red</div>
<input type="radio" value="1" name="attr_dividedradio" style="height: 35px" />
<input type="text" class="typed-head" name="attr_divided1name" value="Character's Civilian Form" style="width: 80%">
<input type="checkbox" name="attr_dividedcheck" style="width: 20px; height: 20px; margin: 0 auto; float: left;">
<b>Use only Qualities</b>
<div class="sgreen">
<select name="attr_greendtype" class="gdtype" style="width: 55px">
<option value="d0">-</option>
<option value="d6">d6</option>
<option value="d8">d8</option>
<option value="d10">d10</option>
<option value="d12">d12</option>
</select>
</div>
<div class="syellow">
<select name="attr_yellowdtype" class="ydtype" style="width: 55px">
<option value="d0">-</option>
<option value="d6">d6</option>
<option value="d8">d8</option>
<option value="d10">d10</option>
<option value="d12">d12</option>
</select>
</div>
<div class="sred">
<select name="attr_reddtype" class="rdtype" style="width: 55px">
<option value="d0">-</option>
<option value="d6">d6</option>
<option value="d8">d8</option>
<option value="d10">d10</option>
<option value="d12">d12</option>
</select>
</div>
<input type="radio" value="2" name="attr_dividedradio" style="height: 35px" />
<input type="text" class="typed-head" name="attr_divided2name" value="Character's Heroic Form" style="width: 80%">
<input type="checkbox" name="attr_dividedcheck" style="width: 20px; height: 20px; margin: 0 auto; float: left;">
<b>Use only Powers</b>
<div class="sgreen">
<select name="attr_green2dtype" class="gdtype" style="width: 55px">
<option value="d0">-</option>
<option value="d6">d6</option>
<option value="d8">d8</option>
<option value="d10">d10</option>
<option value="d12">d12</option>
</select>
</div>
<div class="syellow">
<select name="attr_yellow2dtype" class="ydtype" style="width: 55px">
<option value="d0">-</option>
<option value="d6">d6</option>
<option value="d8">d8</option>
<option value="d10">d10</option>
<option value="d12">d12</option>
</select>
</div>
<div class="sred">
<select name="attr_red2dtype" class="rdtype" style="width: 55px">
<option value="d0">-</option>
<option value="d6">d6</option>
<option value="d8">d8</option>
<option value="d10">d10</option>
<option value="d12">d12</option>
</select>
</div>
</div>
</div>
</div>
</div>
<div class='abilities villain'>
<!-- ABILITIES (REPEATING) -->
@@ -1648,19 +1837,26 @@
});
});
//CODE FOR SETTING/GETTING POWER VALUES from REPEATING SECTIONS
on("change:repeating_powers:powercheck", function(eventInfo) {
getAttrs(["repeating_powers_power","repeating_powers_powerdtype","repeating_powers_powercheck"],function(v) {
let check = parseInt(v.repeating_powers_powercheck)||0;
if(check === 1) {
let power = v.repeating_powers_power;
let value = v.repeating_powers_powerdtype;
setAttrs({
"power_chosen": power,
"power_value": value,
"repeating_powers_powercheck":0
});
}
//Toggles between Divided Forms
on("clicked:divided_toggle", function() {getAttrs(["dividedradio"], function(v) {
setAttrs({"dividedradio": v["dividedradio"] !== "1" ? "1" : "2"});
});});
//When the divided radio changes, also change hidden value
on("change:dividedradio", function(eventInfo) {
getAttrs(["dividedradio"],function(v) {
let divnum = parseInt(v.dividedradio)||0;
setAttrs({
"civilianoheroic": divnum,
});
});
});
//CODE FOR SETTING/GETTING STATUS VALUES
on("change:dividedcheck", function(eventInfo) {
getAttrs(["dividedcheck"],function(v) {
let value = v.dividedcheck;
setAttrs({
"usingdouble": value,
});
});
});
@@ -1750,6 +1946,21 @@
});
});
//CODE FOR SETTING/GETTING POWER VALUES from REPEATING SECTIONS
on("change:repeating_powers:powercheck", function(eventInfo) {
getAttrs(["repeating_powers_power","repeating_powers_powerdtype","repeating_powers_powercheck"],function(v) {
let check = parseInt(v.repeating_powers_powercheck)||0;
if(check === 1) {
let power = v.repeating_powers_power;
let value = v.repeating_powers_powerdtype;
setAttrs({
"power_chosen": power,
"power_value": value,
"repeating_powers_powercheck":0
});
}
});
});
//CODE FOR SETTING/GETTING QUALITY VALUES from REPEATING SECTIONS
on("change:repeating_qualities:qualitycheck", function(eventInfo) {
getAttrs(["repeating_qualities_quality","repeating_qualities_qualitydtype","repeating_qualities_qualitycheck"],function(v) {
@@ -1765,26 +1976,67 @@
}
});
});
//CODE FOR SETTING/GETTING STATUS VALUES
on("change:greencheck", function(eventInfo) {
getAttrs(["greendtype","greencheck"],function(v) {
let check = parseInt(v.greencheck)||0;
//CODE FOR SETTING/GETTING POWER VALUES from REPEATING SECTIONS (in 2nd column for Divided)
on("change:repeating_powers:qualitycheck", function(eventInfo) {
getAttrs(["repeating_powers_power","repeating_powers_powerdtype","repeating_powers_qualitycheck"],function(v) {
let check = parseInt(v.repeating_powers_qualitycheck)||0;
if(check === 1) {
let value = v.greendtype;
let quality = v.repeating_powers_power;
let value = v.repeating_powers_powerdtype;
setAttrs({
"status_chosen": "Green",
"status_value": value,
"greencheck":0
"quality_chosen": quality,
"quality_value": value,
"repeating_powers_qualitycheck":0
});
}
});
});
//CODE FOR SETTING/GETTING QUALITY VALUES from REPEATING SECTIONS (in 1st column for Divided)
on("change:repeating_qualities:powercheck", function(eventInfo) {
getAttrs(["repeating_qualities_quality","repeating_qualities_qualitydtype","repeating_qualities_powercheck"],function(v) {
let check = parseInt(v.repeating_qualities_powercheck)||0;
if(check === 1) {
let power = v.repeating_qualities_quality;
let value = v.repeating_qualities_qualitydtype;
setAttrs({
"power_chosen": power,
"power_value": value,
"repeating_qualities_powercheck":0
});
}
});
});
//CODE FOR SETTING/GETTING STATUS VALUES
on("change:greencheck", function(eventInfo) {
getAttrs(["greendtype","green2dtype","greencheck","dividedradio"],function(v) {
let check = parseInt(v.greencheck)||0;
if(check === 1) {
let value = parseInt(v.dividedradio)||0;
if(value == 2) {
value = v.green2dtype;
} else {
value = v.greendtype;
}
setAttrs({
"status_chosen": "Green",
"status_value": value,
"greencheck":0
});
}
});
});
on("change:yellowcheck", function(eventInfo) {
getAttrs(["yellowdtype","yellowcheck"],function(v) {
getAttrs(["yellowdtype","yellow2dtype","yellowcheck","dividedradio"],function(v) {
let check = parseInt(v.yellowcheck)||0;
if(check === 1) {
let value = v.yellowdtype;
let value = parseInt(v.dividedradio)||0;
if(value == 2) {
value = v.yellow2dtype;
} else {
value = v.yellowdtype;
}
setAttrs({
"status_chosen": "Yellow",
"status_value": value,
@@ -1794,10 +2046,15 @@
});
});
on("change:redcheck", function(eventInfo) {
getAttrs(["reddtype","redcheck"],function(v) {
getAttrs(["reddtype","red2dtype","redcheck","dividedradio"],function(v) {
let check = parseInt(v.redcheck)||0;
if(check === 1) {
let value = v.reddtype;
let value = parseInt(v.dividedradio)||0;
if(value == 2) {
value = v.red2dtype;
} else {
value = v.reddtype;
}
setAttrs({
"status_chosen": "Red",
"status_value": value,