slaguru666/roll20-character-sheets-tester
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
dc43addfaee6ecfd93dba8a9876ae787b4b8e847
roll20-character-sheets-tester/Sentinel Comics RPG/SCRPG-Sheet.html
T
the-Dissilent dc43addfae update to version by theDissilent 
Expand the sheet to include full details from Character sheets and adds in Auxiliary sheets. Also incorporates CSS for ease of use.
2020-04-26 12:43:48 -05:00

1497 lines
88 KiB
HTML
Raw Blame History

<!-- Buttons for Tabs -->
<div>
<button type="action" name="act_description" >Description</button>
<button type="action" name="act_abilities" >Abilities</button>
<button type="action" name="act_auxiliary" >Forms / Modes</button>
<button type="action" name="act_minions" >Minions</button>
<div class="col" style="width: 5%;"> </div>
<!-- Roll Macro -->
<button type='roll' class='rolldice' value='
&{template:default} {{name=@{character_name}}} {{@{power_chosen} - @{power_value}=[[@{power_value}cs>13cf<0]]}} {{@{quality_chosen} - @{quality_value}=[[@{quality_value}cs>13cf<0]]}} {{@{status_chosen} - @{status_value}=[[@{status_value}cs>13cf<0]]}}
' name='roll_action'>Roll Action Dice</button>
</div>
<input type='hidden' class='tabstoggle' name='attr_sheetTab' value='description' />
<div class='description'>
<!-- Logo and Name -->
<div class="logo-img" style="width: 50%; float: left;">
<img src="https://i.imgur.com/yOvY9Kv.png.png">
</div>
<div class="col" style="width: 50%;">
<div class="col" style="float: right; width: 100%; height: 70px; border-style: solid; border-width: 1%; background-color: #fde2c3;">
<h2 class="detail-head">Player</h2><input class="detail-input" type="text" name="attr_player_name" style="width: 95%;">
</div>
</div>
<!-- Hero and Alias -->
<div class="col" style="width: 100%;height: 70px; border-style: solid; border-width: 1%; background-color: #fde2c3;">
<div class="sheet2rowcol">
<div class="col" style="width: 49%;">
<h2 class="detail-head"><b>Hero Name</b></h2><input class="detail-input" type="text" name="attr_character_name" style="width: 95%;">
</div>
<div class="col" style="width: 49%; float: right;">
<h2 class="detail-head"><b>Alias</b></h2><input class="detail-input" type="text" name="attr_alias" style="width: 95%;">
</div>
</div>
</div>
<div class="col" style="width: 100%; height: 15px;"></div>
<!-- Physical Attributes -->
<div class="col" style="width: 100%; float: left; border-style: solid; border-width: 1%; background-color: #fde2c3;">
<h2 class="detail-head"><b>Physical Attributes</b></h2>
<b>Gender </b><input class="peach-fill" type="text" name="attr_gender" style="width: 24%;"/>
<b>Age </b><input class="peach-fill" type="text" name="attr_age" style="width: 34%;"/>
<b>Height </b><input class="peach-fill" type="text" name="attr_height" style="width: 24%;"/>
<div style="width: 100%">
<b>Eyes </b><input class="peach-fill" type="text" name="attr_eyes" style="width: 24%;">
<b>Hair </b><input class="peach-fill" type="text" name="attr_hair" style="width: 31%;">
<b>Skin </b><input class="peach-fill" type="text" name="attr_skin" style="width: 30%;">
</div>
<div style="width: 100%">
<b>Build </b><input class="peach-fill" type="text" name="attr_herobuild" style="width: 93%;">
</div>
<b>Costume/Equipment</b>
<textarea class="peach-fill" name="attr_costume" style="height: 81px; margin: 0px 0px 8.99148px; width: 96%; resize: none;"></textarea>
</div>
<div class="col" style="width: 100%; height: 15px;"></div>
<!-- Characteristics -->
<div class="col" style="width: 100%; float: left; height: 100px; border-style: solid; border-width: 1%; background-color: #fde2c3;">
<h2 class="detail-head"><b>Characteristics</b></h2>
<b>Background </b><input class="detail-input" type="text" name="attr_background" style="width: 38%;">
<b>Power Source </b><input class="detail-input" type="text" name="attr_powersource" style="width: 38%;">
<div style="width: 100%">
<b>Archetype </b><input class="detail-input" type="text" name="attr_archetype" style="width: 39.5%;">
<b>Personality </b><input class="detail-input" type="text" name="attr_personality" style="width: 40%;">
</div>
</div>
<div class="col" style="width: 100%; height: 15px;"></div>
<!-- PRINCIPLES -->
<div class="col" style="width: 100px;"><h3>Principle of </h3></div>
<div class="col" style="width: 36.5%;"><input class="typed-head" type="text" name="attr_principle_name1" style="width: 75%;"></div>
<div class="col" style="width: 100px;"><h3>Principle of </h3></div>
<div class="col" style="width: 36.5%;"><input class="typed-head" type="text" name="attr_principle_name2" style="width: 75%;"></div>
<div class="principles" style="border-style: solid; border-width: 1%;">
<div class="sheet2rowcol">
<div class="col" style="width: 49%;">
<p style="text-align:center"><b>During Roleplaying</b></p>
<textarea name="attr_principle_rp1" style="height: 81px; margin: 0px 0px 8.99148px; width: 96%; resize: none;"></textarea>
<p style="text-align:center"><b>Minor Twist</b></p>
<textarea name="attr_principle_minor1" style="height: 81px; margin: 0px 0px 8.99148px; width: 96%; resize: none;"></textarea>
<p style="text-align:center"><b>Major Twist</b></p>
<textarea name="attr_principle_major1" style="height: 81px; margin: 0px 0px 8.99148px; width: 96%; resize: none;"></textarea>
</div>
<div class="col" style="width: 49%;">
<p style="text-align:center"><b>During Roleplaying</b></p>
<textarea name="attr_principle_rp2" style="height: 81px; margin: 0px 0px 8.99148px; width: 96%; resize: none;"></textarea>
<p style="text-align:center"><b>Minor Twist</b></p>
<textarea name="attr_principle_minor2" style="height: 81px; margin: 0px 0px 8.99148px; width: 96%; resize: none;"></textarea>
<p style="text-align:center"><b>Major Twist</b></p>
<textarea name="attr_principle_major2" style="height: 81px; margin: 0px 0px 8.99148px; width: 96%; resize: none;"></textarea>
</div>
</div>
</div>
<div class="col" style="width: 100%; height: 15px;"></div>
<!-- HERO POINTS / ISSUES / COLLECTIONS (REPEATING) -->
<div class="3colrow">
<div class="col" style="width: width: 10%; background-color: #e8eff6;">
<div class="details" style="border-style: solid; border-width: 1%;">
<h3><b>Hero Points this Issue:</b></h3>
<div class="5colrow">
<div class="col" style="width: 6%;">
<input type="checkbox" name="attr_1hp" style="width: 35px; height: 35px; margin: 0 auto; float: left; margin-left: 10px;">
</div>
<div class="col" style="width: 6%;">
<input type="checkbox" name="attr_2hp" style="width: 35px; height: 35px; margin: 0 auto; float: left; margin-left: 10px;">
</div>
<div class="col" style="width: 6%;">
<input type="checkbox" name="attr_3hp" style="width: 35px; height: 35px; margin: 0 auto; float: left; margin-left: 10px;">
</div>
<div class="col" style="width: 6%;">
<input type="checkbox" name="attr_4hp" style="width: 35px; height: 35px; margin: 0 auto; float: left; margin-left: 10px;">
</div>
<div class="col" style="width: 6%;">
<input type="checkbox" name="attr_5hp" style="width: 35px; height: 35px; margin: 0 auto; float: left; margin-left: 10px;">
</div>
</div>
<div class="col" style="width: 100%; height: 15px;"></div>
<h3><b>Hero Points Rewards</b></h3>
<b>+1 </b><input class="detail-input" type="number" name="attr_plus1" style="width: 16%;" value="0"/>
<b>+2 </b><input class="detail-input" type="number" name="attr_plus2" style="width: 16%;" value="0"/>
<b>+3 </b><input class="detail-input" type="number" name="attr_plus3" style="width: 16%;" value="0"/>
<b>+4 </b><input class="detail-input" type="number" name="attr_plus4" style="width: 16%;" value="0"/>
</div>
</div>
<div class="col" style="width: width: 35%;">
<div class="details" style="border-style: solid; border-width: 1%; background-color: #e8eff6;">
<h3><b>Back Issues </b></h3>
<fieldset class="repeating_issues">
<input type="text" name="attr_issue">
</fieldset>
<em>6 Issues = 1 Collection</em>
</div>
</div>
<div class="col" style="width: width: 35%;">
<div class="details" style="border-style: solid; border-width: 1%; background-color: #e8eff6;">
<h3><b>Collections </b></h3>
<fieldset class="repeating_collections">
<input type="checkbox" name="attr_collection-check">
<input type="text" name="attr_collection">
</fieldset>
</div>
</div>
</div>
</div>
<div class='abilities'>
<!-- POWERS / QUALITIES (REPEATING) / STATUS -->
<div class="3colrow" style="border-style: solid; border-width: 1%;">
<!-- Powers or Modes -->
<div class="col" style="width: 33%;">
<input type="hidden" class="modeselect" name="attr_poweromode" value="0" />
<!-- Powers -->
<div class='powerbase'>
<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_powercheck" value="1" style="width: 25px; height: 25px; margin: 0 auto; float: left; margin-left: 5px;">
</fieldset>
</div>
<!-- Modes -->
<div class='modebase' style="height: 230.5px;">
<input type="text" style="width: 60%; float: left;" class="typed-head" value="Forms / Modes">
<input type="text" style="width: 60%; float: left;" class="gfill" name="attr_g1name" value="Default Form/Mode">
<input type="checkbox" name="attr_g1check" value="1" style="width: 25px; height: 25px; margin: 0 auto; float: left; margin-left: 15px;">
<input type="text" style="width: 60%; float: left;" class="gfill" name="attr_g2name">
<input type="checkbox" name="attr_g2check" value="1" style="width: 25px; height: 25px; margin: 0 auto; float: left; margin-left: 15px;">
<input type="text" style="width: 60%; float: left;" class="gfill" name="attr_g3name">
<input type="checkbox" name="attr_g3check" value="1" style="width: 25px; height: 25px; margin: 0 auto; float: left; margin-left: 15px;">
<input type="text" style="width: 60%; float: left;" class="yfill" name="attr_y1name">
<input type="checkbox" name="attr_y1check" value="1" style="width: 25px; height: 25px; margin: 0 auto; float: left; margin-left: 15px;">
<input type="text" style="width: 60%; float: left;" class="yfill" name="attr_y2name">
<input type="checkbox" name="attr_y2check" value="1" style="width: 25px; height: 25px; margin: 0 auto; float: left; margin-left: 15px;">
<input type="text" style="width: 60%; float: left;" class="rfill" name="attr_r1name">
<input type="checkbox" name="attr_r1check" value="1" style="width: 25px; height: 25px; margin: 0 auto; float: left; margin-left: 15px;">
</div>
<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 Power'>
<input type="text" name="attr_power_value" style="width: 25%; float: left;" value='d4'>
</div>
</div>
<!-- Qualities -->
<div class="col" 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_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 Quality'>
<input type="text" name="attr_quality_value" style="width: 25%; float: left;" value='d4'>
</div>
</div>
<!-- Status & Health-->
<div class="col" style="width: 25%;">
<div class="statusgrid">
<h3></h3>
<h3 class="shead">Status</h3>
<h3></h3>
<h3 class="shead">&</h3>
<h3 class="shead">Health</h3>
<!-- Green Status -->
<div class="sgreen"></div>
<div class="sgreen">Green</div>
<div class="sgreen"></div>
<div class="sgreen">Max</div>
<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>
</div>
<div class="sgreen"></div>
<div class="sgreen"><input type="number" name="attr_greenmax" style="width: 42px" value=17></div>
<span class="sgreen" name="attr_greenmin"></span>
<!-- Yellow Status -->
<div class="syellow"></div>
<div class="syellow">Yellow</div>
<div class="syellow"></div>
<div class="syellow">Max</div>
<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>
</div>
<div class="syellow"></div>
<span class="syellow" name="attr_yellowmax"></span>
<span class="syellow" name="attr_yellowmin"></span>
<!-- Red Status -->
<div class="sred"></div>
<div class="sred">Red</div>
<div class="sred"></div>
<div class="sred">Max</div>
<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>
</div>
<div class="sred"></div>
<span class="sred" name="attr_redmax"></span>
<div class="sred">1</div>
<!-- Out Status -->
<div class="sgrey"><input type="checkbox" name="attr_outcheck" value="1" style="width: 25px; height: 25px; margin: 0 auto; margin-left: 5px;"></div>
<div class="sgrey">OUT</div>
<!-- Current Health -->
<div class="sblack"></div>
<span class="sblack">Current</span>
<div class="sblack"><input type="number" name="attr_currenthp" style="width: 42px" value=17></div>
</div>
<!-- Status Tracking -->
<div class="col" style="width: 85px; height: 30px; border-style: solid; border-width: 1%;">
<input type="text" name="attr_status_chosen" style="width: 56%; float: left;" value='Out'>
<input type="text" name="attr_status_value" style="width: 44%; float: left;" value='d0'>
</div>
</div>
</div>
<div class="col" style="width: 100%; height: 15px;"></div>
</div>
<div class='aux'>
<!-- MODES / FORMS -->
<!-- First, re-display Power/Quality/Status --
<div class="col" style="width: 5%;"></div>
<div class="col" style="width: 33%;">
<div class="details" style="width: 80%; height: 30px; border-style: solid; border-width: 1%;">
<input type="text" name="attr_power_chosen" style="width: 75%; float: left;" value='Untrained Power'>
<input type="text" name="attr_power_value" style="width: 25%; float: left;" value='d4'>
</div>
</div>
<div class="col" style="width: 33%;">
<div class="details" style="width: 80%; height: 30px; border-style: solid; border-width: 1%;">
<input type="text" name="attr_quality_chosen" style="width: 75%; float: left;" value='Untrained Quality'>
<input type="text" name="attr_quality_value" style="width: 25%; float: left;" value='d4'>
</div>
</div>
<div class="col" style="width: 25%;">
<div class="col" style="width: 50%; height: 30px; border-style: solid; border-width: 1%;">
<input type="text" name="attr_status_chosen" style="width: 45%; float: left;" value='Out'>
<input type="text" name="attr_status_value" style="width: 55%; float: left;" value='d0'>
</div>
</div>
<!-- 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' />
<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>
</div>
<!-- Default Mode & Notes -->
<div class="modeg1">
<input type="radio" value="1" name="attr_moderadio" />
<input type="text" class="typed-head" name="attr_g1name" value="Default Form/Mode">
<input type="hidden" class="direction" name="attr_g1direction" value="down" />
<button type="action" name="act_g1direction_toggle" class="direction">
<span class="down" style="color: #46e35e;">▼</span>
<span class="right" style="color: #46e35e;">►</span>
</button>
<div class="col" style="width: 38%; float: right">
<input type="text" class="typed-head" name="attr_auxnotesname" value="Notes">
</div>
<div class="eachform">
<div class="col" style="border-style: solid; border-width: 1%; background-color: #46e35e;; width: 60%;">
<div class="2colrow">
<div class="col" style="width: 50%;">
<h3>Powers</h3>
<fieldset class="repeating_g1powers">
<input type="text" name="attr_g1power" style="width: 65%; float: left;">
<select name="attr_g1powerdtype" style="width: 22%; 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_g1powercheck" value="1" style="width: 25px; height: 25px; margin: 0 auto; float: left; margin-left: 5px;">
</fieldset>
</div>
<div class="col" style="width: 35%;">
<h3>Description</h3>
<textarea name="attr_g1desription" style="width: 99%; height: 78px;"></textarea>
<p>Default Form/Mode.<br>All actions are normal.</p>
</div>
</div>
</div>
<div class="col" style="width: 37%;">
<textarea name="attr_auxnotes" style="width: 98%; height: 150px;"></textarea>
</div>
</div>
<div class="col" style="width: 100%; height: 15px;"></div>
</div>
<!-- g2 is Second Green Mode -->
<div class="modeg2">
<input type="radio" value="2" name="attr_moderadio" />
<input type="text" class="typed-head" name="attr_g2name">
<input type="hidden" class="direction" name="attr_g2direction" value="down" />
<button type="action" name="act_g2direction_toggle" class="direction">
<span class="down" style="color: #46e35e;">▼</span>
<span class="right" style="color: #46e35e;">►</span>
</button>
<div class="eachform" style="border-style: solid; border-width: 1%; background-color: #46e35e;">
<div class="2colrow">
<div class="col" style="width: 30%;">
<h3>Powers</h3>
<fieldset class="repeating_g2powers">
<input type="text" name="attr_g2power" style="width: 65%; float: left;">
<select name="attr_g2powerdtype" style="width: 22%; 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_g2powercheck" value="1" style="width: 25px; height: 25px; margin: 0 auto; float: left; margin-left: 5px;">
</fieldset>
</div>
<div class="col" style="width: 65%;">
<h3>Description</h3>
<textarea name="attr_g2desription" style="width: 98%; height: 41px;"></textarea>
<b>Icon</b>
<span>
<div class="col" style="width: 47px;">
<input type="hidden" class="icon-cycle" name="attr_g2icon1" value=0 />
<span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
<span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
<span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
<span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
<span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
<span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
<div class="col" style="width: 25%; float: right;">
<button type="action" name="act_g2icon1_cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
</div>
</div>
</span>
<span>
<div class="col" style="width: 47px;">
<input type="hidden" class="icon-cycle" name="attr_g2icon2" value=0 />
<span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
<span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
<span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
<span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
<span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
<span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
<div class="col" style="width: 25%; float: right;">
<button type="action" name="act_g2icon2_cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
</div>
</div>
</span>
<span>
<div class="col" style="width: 47px;">
<input type="hidden" class="icon-cycle" name="attr_g2icon3" value=0 />
<span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
<span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
<span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
<span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
<span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
<span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
<div class="col" style="width: 25%; float: right;">
<button type="action" name="act_g2icon3_cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
</div>
</div>
</span>
<span><div class="col" style="width: 1.5%;"></div></span>
<b>Name</b>
<input type="text" name="attr_g2abilityname" style="width: 39%;">
<span><div class="col" style="width: 80px; float: right">
<b>Type</b>
<select name="attr_g2abilitytype" style="width: 42px;">
<option>A</option>
<option>I</option>
<option>R</option>
</select>
</div></span>
<textarea name="attr_g2abilitydesc" style="width: 98%; height: 31px;"></textarea>
</div>
</div>
</div>
<div class="col" style="width: 100%; height: 15px;"></div>
</div>
<!-- g3 is Third Green Mode -->
<div class="modeg3">
<input type="radio" value="3" name="attr_moderadio" />
<input type="text" class="typed-head" name="attr_g3name">
<input type="hidden" class="direction" name="attr_g3direction" value="down" />
<button type="action" name="act_g3direction_toggle" class="direction">
<span class="down" style="color: #46e35e;">▼</span>
<span class="right" style="color: #46e35e;">►</span>
</button>
<div class="eachform" style="border-style: solid; border-width: 1%; background-color: #46e35e;;">
<div class="2colrow">
<div class="col" style="width: 30%;">
<h3>Powers</h3>
<fieldset class="repeating_g3powers">
<input type="text" name="attr_g3power" style="width: 65%; float: left;">
<select name="attr_g3powerdtype" style="width: 22%; 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_g3powercheck" value="1" style="width: 25px; height: 25px; margin: 0 auto; float: left; margin-left: 5px;">
</fieldset>
</div>
<div class="col" style="width: 65%;">
<h3>Description</h3>
<textarea name="attr_g3desription" style="width: 98%; height: 41px;"></textarea>
<b>Icon</b>
<span>
<div class="col" style="width: 47px;">
<input type="hidden" class="icon-cycle" name="attr_g3icon1" value=0 />
<span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
<span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
<span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
<span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
<span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
<span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
<div class="col" style="width: 25%; float: right;">
<button type="action" name="act_g3icon1_cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
</div>
</div>
</span>
<span>
<div class="col" style="width: 47px;">
<input type="hidden" class="icon-cycle" name="attr_g3icon2" value=0 />
<span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
<span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
<span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
<span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
<span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
<span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
<div class="col" style="width: 25%; float: right;">
<button type="action" name="act_g3icon2_cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
</div>
</div>
</span>
<span>
<div class="col" style="width: 47px;">
<input type="hidden" class="icon-cycle" name="attr_g3icon3" value=0 />
<span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
<span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
<span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
<span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
<span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
<span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
<div class="col" style="width: 25%; float: right;">
<button type="action" name="act_g3icon3_cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
</div>
</div>
</span>
<span><div class="col" style="width: 1.5%;"></div></span>
<b>Name</b>
<input type="text" name="attr_g3abilityname" style="width: 39%;">
<span><div class="col" style="width: 80px; float: right">
<b>Type</b>
<select name="attr_g3abilitytype" style="width: 42px;">
<option>A</option>
<option>I</option>
<option>R</option>
</select>
</div></span>
<textarea name="attr_g3abilitydesc" style="width: 98%; height: 31px;"></textarea>
</div>
</div>
</div>
<div class="col" style="width: 100%; height: 15px;"></div>
</div>
<!-- y1 is First Yellow Mode -->
<div class="modey1">
<input type="radio" value="4" name="attr_moderadio" />
<input type="text" class="typed-head" name="attr_y1name">
<input type="hidden" class="direction" name="attr_y1direction" value="down" />
<button type="action" name="act_y1direction_toggle" class="direction">
<span class="down" style="color: #ffff99;">▼</span>
<span class="right" style="color: #ffff99;">►</span>
</button>
<div class="eachform" style="border-style: solid; border-width: 1%; background-color: #ffff99;">
<div class="2colrow">
<div class="col" style="width: 30%;">
<h3>Powers</h3>
<fieldset class="repeating_y1powers">
<input type="text" name="attr_y1power" style="width: 65%; float: left;">
<select name="attr_y1powerdtype" style="width: 22%; 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_y1powercheck" value="1" style="width: 25px; height: 25px; margin: 0 auto; float: left; margin-left: 5px;">
</fieldset>
</div>
<div class="col" style="width: 65%;">
<h3>Description</h3>
<textarea name="attr_y1desription" style="width: 98%; height: 41px;"></textarea>
<b>Icon</b>
<span>
<div class="col" style="width: 47px;">
<input type="hidden" class="icon-cycle" name="attr_y1icon1" value=0 />
<span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
<span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
<span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
<span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
<span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
<span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
<div class="col" style="width: 25%; float: right;">
<button type="action" name="act_y1icon1_cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
</div>
</div>
</span>
<span>
<div class="col" style="width: 47px;">
<input type="hidden" class="icon-cycle" name="attr_y1icon2" value=0 />
<span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
<span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
<span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
<span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
<span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
<span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
<div class="col" style="width: 25%; float: right;">
<button type="action" name="act_y1icon2_cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
</div>
</div>
</span>
<span>
<div class="col" style="width: 47px;">
<input type="hidden" class="icon-cycle" name="attr_y1icon3" value=0 />
<span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
<span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
<span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
<span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
<span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
<span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
<div class="col" style="width: 25%; float: right;">
<button type="action" name="act_y1icon3_cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
</div>
</div>
</span>
<span><div class="col" style="width: 1.5%;"></div></span>
<b>Name</b>
<input type="text" name="attr_y1abilityname" style="width: 39%;">
<span><div class="col" style="width: 80px; float: right">
<b>Type</b>
<select name="attr_y1abilitytype" style="width: 42px;">
<option>A</option>
<option>I</option>
<option>R</option>
</select>
</div></span>
<textarea name="attr_y1abilitydesc" style="width: 98%; height: 31px;"></textarea>
</div>
</div>
</div>
<div class="col" style="width: 100%; height: 15px;"></div>
</div>
<!-- y2 is Second Yellow Mode -->
<div class="modey2">
<input type="radio" value="5" name="attr_moderadio" />
<input type="text" class="typed-head" name="attr_y2name">
<input type="hidden" class="direction" name="attr_y2direction" value="down" />
<button type="action" name="act_y2direction_toggle" class="direction">
<span class="down" style="color: #ffff99;">▼</span>
<span class="right" style="color: #ffff99;">►</span>
</button>
<div class="eachform" style="border-style: solid; border-width: 1%; background-color: #ffff99;">
<div class="2colrow">
<div class="col" style="width: 30%;">
<h3>Powers</h3>
<fieldset class="repeating_y2powers">
<input type="text" name="attr_y2power" style="width: 65%; float: left;">
<select name="attr_y2powerdtype" style="width: 22%; 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_y2powercheck" value="1" style="width: 25px; height: 25px; margin: 0 auto; float: left; margin-left: 5px;">
</fieldset>
</div>
<div class="col" style="width: 65%;">
<h3>Description</h3>
<textarea name="attr_y2desription" style="width: 98%; height: 41px;"></textarea>
<b>Icon</b>
<span>
<div class="col" style="width: 47px;">
<input type="hidden" class="icon-cycle" name="attr_y2icon1" value=0 />
<span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
<span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
<span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
<span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
<span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
<span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
<div class="col" style="width: 25%; float: right;">
<button type="action" name="act_y2icon1_cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
</div>
</div>
</span>
<span>
<div class="col" style="width: 47px;">
<input type="hidden" class="icon-cycle" name="attr_y2icon2" value=0 />
<span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
<span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
<span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
<span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
<span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
<span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
<div class="col" style="width: 25%; float: right;">
<button type="action" name="act_y2icon2_cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
</div>
</div>
</span>
<span>
<div class="col" style="width: 47px;">
<input type="hidden" class="icon-cycle" name="attr_y2icon3" value=0 />
<span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
<span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
<span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
<span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
<span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
<span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
<div class="col" style="width: 25%; float: right;">
<button type="action" name="act_y2icon3_cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
</div>
</div>
</span>
<span><div class="col" style="width: 1.5%;"></div></span>
<b>Name</b>
<input type="text" name="attr_y2abilityname" style="width: 39%;">
<span><div class="col" style="width: 80px; float: right">
<b>Type</b>
<select name="attr_y2abilitytype" style="width: 42px;">
<option>A</option>
<option>I</option>
<option>R</option>
</select>
</div></span>
<textarea name="attr_y2abilitydesc" style="width: 98%; height: 31px;"></textarea>
</div>
</div>
</div>
<div class="col" style="width: 100%; height: 15px;"></div>
</div>
<!-- r1 is the Red Mode -->
<div class="moder1">
<input type="radio" value="6" name="attr_moderadio" />
<input type="text" class="typed-head" name="attr_r1name">
<input type="hidden" class="direction" name="attr_r1direction" value="down" />
<button type="action" name="act_r1direction_toggle" class="direction">
<span class="down" style="color: #f9beac;">▼</span>
<span class="right" style="color: #f9beac;">►</span>
</button>
<div class="eachform" style="border-style: solid; border-width: 1%; background-color: #f9beac;">
<div class="2colrow">
<div class="col" style="width: 30%;">
<h3>Powers</h3>
<fieldset class="repeating_r1powers">
<input type="text" name="attr_r1power" style="width: 65%; float: left;">
<select name="attr_r1powerdtype" style="width: 22%; 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_r1powercheck" value="1" style="width: 25px; height: 25px; margin: 0 auto; float: left; margin-left: 5px;">
</fieldset>
</div>
<div class="col" style="width: 65%;">
<h3>Description</h3>
<textarea name="attr_r1desription" style="width: 98%; height: 41px;"></textarea>
<b>Icon</b>
<span>
<div class="col" style="width: 47px;">
<input type="hidden" class="icon-cycle" name="attr_r1icon1" value=0 />
<span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
<span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
<span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
<span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
<span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
<span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
<div class="col" style="width: 25%; float: right;">
<button type="action" name="act_r1icon1_cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
</div>
</div>
</span>
<span>
<div class="col" style="width: 47px;">
<input type="hidden" class="icon-cycle" name="attr_r1icon2" value=0 />
<span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
<span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
<span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
<span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
<span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
<span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
<div class="col" style="width: 25%; float: right;">
<button type="action" name="act_r1icon2_cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
</div>
</div>
</span>
<span>
<div class="col" style="width: 47px;">
<input type="hidden" class="icon-cycle" name="attr_r1icon3" value=0 />
<span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
<span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
<span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
<span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
<span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
<span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
<div class="col" style="width: 25%; float: right;">
<button type="action" name="act_r1icon3_cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
</div>
</div>
</span>
<span><div class="col" style="width: 1.5%;"></div></span>
<b>Name</b>
<input type="text" name="attr_r1abilityname" style="width: 39%;">
<span><div class="col" style="width: 80px; float: right">
<b>Type</b>
<select name="attr_r1abilitytype" style="width: 42px;">
<option>A</option>
<option>I</option>
<option>R</option>
</select>
</div></span>
<textarea name="attr_r1abilitydesc" style="width: 98%; height: 31px;"></textarea>
</div>
</div>
</div>
<div class="col" style="width: 100%; height: 15px;"></div>
</div>
</div>
<div class='abilities'>
<!-- ABILITIES (REPEATING) -->
<h3>Abilities</h3>
<div class="abilities_repeat">
<!--Green Abilities -->
<div class="green-abilities" style="background-color: #46e35e; border-style: solid; border-width: 0.5%;">
<fieldset class="repeating_greenabilities">
<b>Icon</b>
<div class="col" style="width: 47px;">
<input type="hidden" class="icon-cycle" name="attr_icon1" value=0 />
<span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
<span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
<span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
<span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
<span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
<span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
<div class="col" style="width: 25%; float: right;">
<button type="action" name="act_icon1cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
</div>
</div>
<div class="col" style="width: 47px;">
<input type="hidden" class="icon-cycle" name="attr_icon2" value=0 />
<span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
<span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
<span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
<span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
<span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
<span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
<div class="col" style="width: 25%; float: right;">
<button type="action" name="act_icon2cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
</div>
</div>
<div class="col" style="width: 47px;">
<input type="hidden" class="icon-cycle" name="attr_icon3" value=0 />
<span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
<span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
<span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
<span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
<span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
<span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
<div class="col" style="width: 25%; float: right;">
<button type="action" name="act_icon3cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
</div>
</div>
<div class="col" style="width: 10%;"></div>
<div class="col" style="width: 40%;">
<b>Name</b>
<input type="text" name="attr_abilityname" style="width: 80%;">
</div>
<div style="width: 105px; float: right;">
<b>Type</b>
<select name="attr_abilitytype" style="width: 40px;">
<option>A</option>
<option>I</option>
<option>R</option>
</select>
</div>
<textarea name="attr_greenabilitydesc" style="width: 95%; height: 31px;"></textarea>
</fieldset>
</div>
<div class="col" style="width: 100%; height: 15px;"></div>
<!-- Yellow Abilities -->
<div class="yellow-abilities" style="background-color: #ffff99; border-style: solid; border-width: 0.5%;">
<fieldset class="repeating_yellowabilities">
<b>Icon</b>
<div class="col" style="width: 47px;">
<input type="hidden" class="icon-cycle" name="attr_icon1" value=0 />
<span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
<span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
<span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
<span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
<span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
<span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
<div class="col" style="width: 25%; float: right;">
<button type="action" name="act_icon1cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
</div>
</div>
<div class="col" style="width: 47px;">
<input type="hidden" class="icon-cycle" name="attr_icon2" value=0 />
<span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
<span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
<span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
<span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
<span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
<span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
<div class="col" style="width: 25%; float: right;">
<button type="action" name="act_icon2cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
</div>
</div>
<div class="col" style="width: 47px;">
<input type="hidden" class="icon-cycle" name="attr_icon3" value=0 />
<span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
<span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
<span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
<span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
<span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
<span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
<div class="col" style="width: 25%; float: right;">
<button type="action" name="act_icon3cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
</div>
</div>
<div class="col" style="width: 10%;"></div>
<div class="col" style="width: 40%;">
<b>Name</b>
<input type="text" name="attr_abilityname" style="width: 80%;">
</div>
<div style="width: 105px; float: right;">
<b>Type</b>
<select name="attr_abilitytype" style="width: 40px;">
<option>A</option>
<option>I</option>
<option>R</option>
</select>
</div>
<textarea name="attr_greenabilitydesc" style="width: 95%; height: 31px;"></textarea>
</fieldset>
</div>
<div class="col" style="width: 100%; height: 15px;"></div>
<!-- Red Abilities -->
<div class="red-abilities" style="background-color: #f9beac; border-style: solid; border-width: 0.5%;">
<fieldset class="repeating_redabilities">
<b>Icon</b>
<div class="col" style="width: 47px;">
<input type="hidden" class="icon-cycle" name="attr_icon1" value=0 />
<span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
<span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
<span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
<span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
<span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
<span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
<div class="col" style="width: 25%; float: right;">
<button type="action" name="act_icon1cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
</div>
</div>
<div class="col" style="width: 47px;">
<input type="hidden" class="icon-cycle" name="attr_icon2" value=0 />
<span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
<span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
<span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
<span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
<span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
<span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
<div class="col" style="width: 25%; float: right;">
<button type="action" name="act_icon2cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
</div>
</div>
<div class="col" style="width: 47px;">
<input type="hidden" class="icon-cycle" name="attr_icon3" value=0 />
<span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
<span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
<span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
<span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
<span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
<span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
<div class="col" style="width: 25%; float: right;">
<button type="action" name="act_icon3cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
</div>
</div>
<div class="col" style="width: 10%;"></div>
<div class="col" style="width: 40%;">
<b>Name</b>
<input type="text" name="attr_abilityname" style="width: 80%;">
</div>
<div style="width: 105px; float: right;">
<b>Type</b>
<select name="attr_abilitytype" style="width: 40px;">
<option>A</option>
<option>I</option>
<option>R</option>
</select>
</div>
<textarea name="attr_greenabilitydesc" style="width: 95%; height: 31px;"></textarea>
</fieldset>
</div>
<div class="col" style="width: 100%; height: 15px;"></div>
<!-- Out Ability -->
<div class="out-abilities" style="background-color: #bfbfbf; padding: 2px; border-style: solid; border-width: 0.5%;">
<b>Out Ability</b>
<input type="text" name="attr_outability" style="padding: 2px; width: 80%;">
</div>
</div>
</div>
<div class='minions'>
<!-- MINIONS -->
<div class="col" style="width: 40%;">
<input class="typed-head" type="text" name="attr_miniontype" style ="width: 75%;" value='Your Minions'>
<span>
<div>
<table style="width: 100% ; margin: 0 auto ; border-style: solid; border-width: 1%;">
<tbody>
<tr style="background-color: #9c95d3">
<td style="width: 25%">KEY VALUE</td>
<td style="width: 25%">DIE TYPE</td>
<td style="width: 50%">EXAMPLE FORMS</td>
</tr>
<tr>
<td>0 or Less</td>
<td><img src="https://i.imgur.com/zKe7brQ.png" style="height: 25px; width: 25px;"> minion</td>
<td>tiny/featureless</td>
</tr>
<tr>
<td>1-3</td>
<td><img src="https://i.imgur.com/2wFSDlU.png" style="height: 25px; width: 25px;"> minion</td>
<td>small/limited detail</td>
</tr>
<tr>
<td>4-7</td>
<td><img src="https://i.imgur.com/BQuOtZf.png" style="height: 25px; width: 25px;"> minion</td>
<td>house pet sized/detailed</td>
</tr>
<tr>
<td>8-12</td>
<td><img src="https://i.imgur.com/dO59pvM.png" style="height: 25px; width: 25px;"> minion</td>
<td>humanoid sized/intracate</td>
</tr>
<tr>
<td>12+</td>
<td><img src="https://i.imgur.com/VMxuy5U.png" style="height: 25px; width: 25px;"> minion</td>
<td>large/paragon</td>
</tr>
</tbody>
</table>
</div>
</span>
</div>
<div class="col" style="width: 57%;">
<input class="typed-head" type="text" name="attr_minionnotename" style ="width: 55%;" value='Notes'>
<textarea name="attr_minionnotes" style="width: 98%; height: 150px;"></textarea>
</div>
<div class="col" style="width: 100%; height: 15px;"></div>
<input class="typed-head" type="text" name="attr_minionform" style ="width: 30%;" value='Minion Forms'>
<div class="minionforms" style="border-style: solid; border-width: 0.5%;">
<div style="background-color: #9c95d3">
<div class="col" style="width: 15%">NAME</div>
<div class="col" style="width: 69%">DESCRIPTION</div>
<div class="col" style="width: 15%">BONUS</div>
</div>
<fieldset class="repeating_minionforms; 3colrow">
<input type="text" name="attr_mformname" style ="width: 15%;">
<input name="attr_mformdesription" style="width: 69%;">
<select name="attr_mformbonus" style ="width: 15%;">
<option>+1 or higher</option>
<option>+2 or higher</option>
<option>+3 or higher</option>
<option>+4 or higher</option>
</select>
</fieldset>
</div>
</div>
<div class='villain'>
<!-- VILLAIN -->
<h2>Villain</h2>
<span>Villain goes here</span>
</div>
<span style="color: gray; float: right;">
<em>coded by: theDissilent - theDissilent@gmail.com</em>
</span>
<script type="text/worker">
//Buttons for Tabs
const buttonlist = ["description","abilities","auxiliary","minions","villain"];
buttonlist.forEach(button => {
on(`clicked:${button}`, function() {
setAttrs({
sheetTab: button
});
});
});
//CODE FOR changing the aux radio by form checks
on("change:g1check", function(eventInfo) {
getAttrs(["g1check"],function(v) {
let check = parseInt(v.g1check)||0;
if(check === 1) {
setAttrs({
"moderadio":1,
"g1check":0
});
}
});
});
on("change:g2check", function(eventInfo) {
getAttrs(["g2check"],function(v) {
let check = parseInt(v.g2check)||0;
if(check === 1) {
setAttrs({
"moderadio":2,
"g2check":0
});
}
});
});
on("change:g3check", function(eventInfo) {
getAttrs(["g3check"],function(v) {
let check = parseInt(v.g3check)||0;
if(check === 1) {
setAttrs({
"moderadio":3,
"g3check":0
});
}
});
});
on("change:y1check", function(eventInfo) {
getAttrs(["y1check"],function(v) {
let check = parseInt(v.y1check)||0;
if(check === 1) {
setAttrs({
"moderadio":4,
"y1check":0
});
}
});
});
on("change:y2check", function(eventInfo) {
getAttrs(["y2check"],function(v) {
let check = parseInt(v.y2check)||0;
if(check === 1) {
setAttrs({
"moderadio":5,
"y2check":0
});
}
});
});
on("change:r1check", function(eventInfo) {
getAttrs(["r1check"],function(v) {
let check = parseInt(v.r1check)||0;
if(check === 1) {
setAttrs({
"moderadio":6,
"r1check":0
});
}
});
});
//When the aux radio changes, also change hidden value
on("change:moderadio", function(eventInfo) {
getAttrs(["moderadio"],function(v) {
let modenum = parseInt(v.moderadio)||0;
setAttrs({
"poweromode": modenum,
});
});
});
//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 POWER VALUES from REPEATING SECTIONS from Aux g1-r1
on("change:repeating_g1powers:g1powercheck", function(eventInfo) {
getAttrs(["repeating_g1powers_g1power","repeating_g1powers_g1powerdtype","repeating_g1powers_g1powercheck"],function(v) {
let check = parseInt(v.repeating_g1powers_g1powercheck)||0;
if(check === 1) {
let power = v.repeating_g1powers_g1power;
let value = v.repeating_g1powers_g1powerdtype;
setAttrs({
"power_chosen": power,
"power_value": value,
"repeating_g1powers_g1powercheck":0
});
}
});
});
on("change:repeating_g2powers:g2powercheck", function(eventInfo) {
getAttrs(["repeating_g2powers_g2power","repeating_g2powers_g2powerdtype","repeating_g2powers_g2powercheck"],function(v) {
let check = parseInt(v.repeating_g2powers_g2powercheck)||0;
if(check === 1) {
let power = v.repeating_g2powers_g2power;
let value = v.repeating_g2powers_g2powerdtype;
setAttrs({
"power_chosen": power,
"power_value": value,
"repeating_g2powers_g2powercheck":0
});
}
});
});
on("change:repeating_g3powers:g3powercheck", function(eventInfo) {
getAttrs(["repeating_g3powers_g3power","repeating_g3powers_g3powerdtype","repeating_g3powers_g3powercheck"],function(v) {
let check = parseInt(v.repeating_g3powers_g3powercheck)||0;
if(check === 1) {
let power = v.repeating_g3powers_g3power;
let value = v.repeating_g3powers_g3powerdtype;
setAttrs({
"power_chosen": power,
"power_value": value,
"repeating_g3powers_g3powercheck":0
});
}
});
});
on("change:repeating_y1powers:y1powercheck", function(eventInfo) {
getAttrs(["repeating_y1powers_y1power","repeating_y1powers_y1powerdtype","repeating_y1powers_y1powercheck"],function(v) {
let check = parseInt(v.repeating_y1powers_y1powercheck)||0;
if(check === 1) {
let power = v.repeating_y1powers_y1power;
let value = v.repeating_y1powers_y1powerdtype;
setAttrs({
"power_chosen": power,
"power_value": value,
"repeating_y1powers_y1powercheck":0
});
}
});
});
on("change:repeating_y2powers:y2powercheck", function(eventInfo) {
getAttrs(["repeating_y2powers_y2power","repeating_y2powers_y2powerdtype","repeating_y2powers_y2powercheck"],function(v) {
let check = parseInt(v.repeating_y2powers_y2powercheck)||0;
if(check === 1) {
let power = v.repeating_y2powers_y2power;
let value = v.repeating_y2powers_y2powerdtype;
setAttrs({
"power_chosen": power,
"power_value": value,
"repeating_y2powers_y2powercheck":0
});
}
});
});
on("change:repeating_r1powers:r1powercheck", function(eventInfo) {
getAttrs(["repeating_r1powers_r1power","repeating_r1powers_r1powerdtype","repeating_r1powers_r1powercheck"],function(v) {
let check = parseInt(v.repeating_r1powers_r1powercheck)||0;
if(check === 1) {
let power = v.repeating_r1powers_r1power;
let value = v.repeating_r1powers_r1powerdtype;
setAttrs({
"power_chosen": power,
"power_value": value,
"repeating_r1powers_r1powercheck":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) {
let check = parseInt(v.repeating_qualities_qualitycheck)||0;
if(check === 1) {
let quality = v.repeating_qualities_quality;
let value = v.repeating_qualities_qualitydtype;
setAttrs({
"quality_chosen": quality,
"quality_value": value,
"repeating_qualities_qualitycheck":0
});
}
});
});
//CODE FOR SETTING/GETTING STATUS VALUES
on("change:greencheck", function(eventInfo) {
getAttrs(["greendtype","greencheck"],function(v) {
let check = parseInt(v.greencheck)||0;
if(check === 1) {
let value = v.greendtype;
setAttrs({
"status_chosen": "Green",
"status_value": value,
"greencheck":0
});
}
});
});
on("change:yellowcheck", function(eventInfo) {
getAttrs(["yellowdtype","yellowcheck"],function(v) {
let check = parseInt(v.yellowcheck)||0;
if(check === 1) {
let value = v.yellowdtype;
setAttrs({
"status_chosen": "Yellow",
"status_value": value,
"yellowcheck":0
});
}
});
});
on("change:redcheck", function(eventInfo) {
getAttrs(["reddtype","redcheck"],function(v) {
let check = parseInt(v.redcheck)||0;
if(check === 1) {
let value = v.reddtype;
setAttrs({
"status_chosen": "Red",
"status_value": value,
"redcheck":0
});
}
});
});
on("change:outcheck", function(eventInfo) {
getAttrs(["outcheck"],function(v) {
let check = parseInt(v.outcheck)||0;
if(check === 1) {
setAttrs({
"status_chosen": "Out",
"status_value": "d0",
"outcheck":0
});
}
});
});
// CODE FOR HEALTH RANGES from TOTAL HP
on('change:greenmax sheet:opened', function() {
getAttrs(['greenmax'], function(values) {
var indexg = parseInt(values.greenmax);
var indexy = Math.round((indexg+2)*0.7);
var indexr = Math.round((indexg+2)/3);
if (indexg === 37) {
var indexy = 28;
} else if (indexg === 19) {
var indexy = 14;
}
setAttrs({ 'greenmin': indexy+1 });
setAttrs({ 'yellowmax': indexy });
setAttrs({ 'yellowmin': indexr+1 });
setAttrs({ 'redmax': indexr });
});
});
// Opens and Closes each Form/Mode
on("clicked:g1direction_toggle", function() {
// Check the current value of the hidden attribute.
getAttrs(["g1direction"], function(v) {
// Toggle the hidden attribute value between "down" and "right"
setAttrs({
"g1direction": v["g1direction"] !== "down" ? "down" : "right"
});
});
});
// repeat for other 5 matching buttons
on("clicked:g2direction_toggle", function() {getAttrs(["g2direction"], function(v) {
setAttrs({"g2direction": v["g2direction"] !== "down" ? "down" : "right"});
});});
on("clicked:g3direction_toggle", function() {getAttrs(["g3direction"], function(v) {
setAttrs({"g3direction": v["g3direction"] !== "down" ? "down" : "right"});
});});
on("clicked:y1direction_toggle", function() {getAttrs(["y1direction"], function(v) {
setAttrs({"y1direction": v["y1direction"] !== "down" ? "down" : "right"});
});});
on("clicked:y2direction_toggle", function() {getAttrs(["y2direction"], function(v) {
setAttrs({"y2direction": v["y2direction"] !== "down" ? "down" : "right"});
});});
on("clicked:r1direction_toggle", function() {getAttrs(["r1direction"], function(v) {
setAttrs({"r1direction": v["r1direction"] !== "down" ? "down" : "right"});
});});
// Cycle Icons on Abilities
on("clicked:repeating_greenabilities:icon1cycle", () => {
// Check the current value of the hidden attribute.
getAttrs(["repeating_greenabilities_icon1"], (v) => {
const iconValue = parseInt(v["repeating_greenabilities_icon1"]) || 0;
// Increment the attribute value by 1, or cycle back to 0 if the incremented value is equal to 7.
setAttrs({
"repeating_greenabilities_icon1": (iconValue + 1) % 7
});
});
});
on("clicked:repeating_greenabilities:icon2cycle", () => {
getAttrs(["repeating_greenabilities_icon2"], (v) => {
const iconValue = parseInt(v["repeating_greenabilities_icon2"]) || 0;
setAttrs({"repeating_greenabilities_icon2": (iconValue + 1) % 7
});});});
on("clicked:repeating_greenabilities:icon3cycle", () => {
getAttrs(["repeating_greenabilities_icon3"], (v) => {
const iconValue = parseInt(v["repeating_greenabilities_icon3"]) || 0;
setAttrs({"repeating_greenabilities_icon3": (iconValue + 1) % 7
});});});
on("clicked:repeating_yellowabilities:icon1cycle", () => {
getAttrs(["repeating_yellowabilities_icon1"], (v) => {
const iconValue = parseInt(v["repeating_yellowabilities_icon1"]) || 0;
setAttrs({"repeating_yellowabilities_icon1": (iconValue + 1) % 7
});});});
on("clicked:repeating_yellowabilities:icon2cycle", () => {
getAttrs(["repeating_yellowabilities_icon2"], (v) => {
const iconValue = parseInt(v["repeating_yellowabilities_icon2"]) || 0;
setAttrs({"repeating_yellowabilities_icon2": (iconValue + 1) % 7
});});});
on("clicked:repeating_yellowabilities:icon3cycle", () => {
getAttrs(["repeating_yellowabilities_icon3"], (v) => {
const iconValue = parseInt(v["repeating_yellowabilities_icon3"]) || 0;
setAttrs({"repeating_yellowabilities_icon3": (iconValue + 1) % 7
});});});
on("clicked:repeating_redabilities:icon1cycle", () => {
getAttrs(["repeating_redabilities_icon1"], (v) => {
const iconValue = parseInt(v["repeating_redabilities_icon1"]) || 0;
setAttrs({"repeating_redabilities_icon1": (iconValue + 1) % 7
});});});
on("clicked:repeating_redabilities:icon2cycle", () => {
getAttrs(["repeating_redabilities_icon2"], (v) => {
const iconValue = parseInt(v["repeating_redabilities_icon2"]) || 0;
setAttrs({"repeating_redabilities_icon2": (iconValue + 1) % 7
});});});
on("clicked:repeating_redabilities:icon3cycle", () => {
getAttrs(["repeating_redabilities_icon3"], (v) => {
const iconValue = parseInt(v["repeating_redabilities_icon3"]) || 0;
setAttrs({"repeating_redabilities_icon3": (iconValue + 1) % 7
});});});
// Cycle Icons on Mode Abilities
on("clicked:g2icon1_cycle", () => {
getAttrs(["g2icon1"], (v) => {
const iconValue = parseInt(v["g2icon1"]) || 0;
setAttrs({"g2icon1": (iconValue + 1) % 7
});});});
on("clicked:g2icon2_cycle", () => {
getAttrs(["g2icon2"], (v) => {
const iconValue = parseInt(v["g2icon2"]) || 0;
setAttrs({"g2icon2": (iconValue + 1) % 7
});});});
on("clicked:g2icon3_cycle", () => {
getAttrs(["g2icon3"], (v) => {
const iconValue = parseInt(v["g2icon3"]) || 0;
setAttrs({"g2icon3": (iconValue + 1) % 7
});});});
on("clicked:g3icon1_cycle", () => {
getAttrs(["g3icon1"], (v) => {
const iconValue = parseInt(v["g3icon1"]) || 0;
setAttrs({"g3icon1": (iconValue + 1) % 7
});});});
on("clicked:g3icon2_cycle", () => {
getAttrs(["g3icon2"], (v) => {
const iconValue = parseInt(v["g3icon2"]) || 0;
setAttrs({"g3icon2": (iconValue + 1) % 7
});});});
on("clicked:g3icon3_cycle", () => {
getAttrs(["g3icon3"], (v) => {
const iconValue = parseInt(v["g3icon3"]) || 0;
setAttrs({"g3icon3": (iconValue + 1) % 7
});});});
on("clicked:y1icon1_cycle", () => {
getAttrs(["y1icon1"], (v) => {
const iconValue = parseInt(v["y1icon1"]) || 0;
setAttrs({"y1icon1": (iconValue + 1) % 7
});});});
on("clicked:y1icon2_cycle", () => {
getAttrs(["y1icon2"], (v) => {
const iconValue = parseInt(v["y1icon2"]) || 0;
setAttrs({"y1icon2": (iconValue + 1) % 7
});});});
on("clicked:y1icon3_cycle", () => {
getAttrs(["y1icon3"], (v) => {
const iconValue = parseInt(v["y1icon3"]) || 0;
setAttrs({"y1icon3": (iconValue + 1) % 7
});});});
on("clicked:y2icon1_cycle", () => {
getAttrs(["y2icon1"], (v) => {
const iconValue = parseInt(v["y2icon1"]) || 0;
setAttrs({"y2icon1": (iconValue + 1) % 7
});});});
on("clicked:y2icon2_cycle", () => {
getAttrs(["y2icon2"], (v) => {
const iconValue = parseInt(v["y2icon2"]) || 0;
setAttrs({"y2icon2": (iconValue + 1) % 7
});});});
on("clicked:y2icon3_cycle", () => {
getAttrs(["y2icon3"], (v) => {
const iconValue = parseInt(v["y2icon3"]) || 0;
setAttrs({"y2icon3": (iconValue + 1) % 7
});});});
on("clicked:r1icon1_cycle", () => {
getAttrs(["r1icon1"], (v) => {
const iconValue = parseInt(v["r1icon1"]) || 0;
setAttrs({"r1icon1": (iconValue + 1) % 7
});});});
on("clicked:r1icon2_cycle", () => {
getAttrs(["r1icon2"], (v) => {
const iconValue = parseInt(v["r1icon2"]) || 0;
setAttrs({"r1icon2": (iconValue + 1) % 7
});});});
on("clicked:r1icon3_cycle", () => {
getAttrs(["r1icon3"], (v) => {
const iconValue = parseInt(v["r1icon3"]) || 0;
setAttrs({"r1icon3": (iconValue + 1) % 7
});});});
</script>
Reference in New Issue View Git Blame Copy Permalink