ntr/mnml
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

highlight active skills

Browse Source
This commit is contained in:
Mashy 2019-04-15 21:49:58 +10:00
parent f0fad93966
commit 1af39ea368
3 changed files with 29 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
client/cryps.css
View File

@ -648,6 +648,13 @@ text.combat-text {
/* /*
CRYP DAMAGE CRYP DAMAGE
*/ */
.cryp-box.active-skill {
filter: drop-shadow(0 0 0.2em silver);
border-width: 5px;
border-color: silver;
}
.cryp-box.red-damage { .cryp-box.red-damage {
filter: drop-shadow(0 0 0.2em red); filter: drop-shadow(0 0 0.2em red);
border-width: 5px; border-width: 5px;

6
client/src/constants.jsx
View File

@ -1,9 +1,9 @@
module.exports = { module.exports = {
TIMES: { TIMES: {
RESOLUTION_TIME_MS: 2000, RESOLUTION_TIME_MS: 2000,
START_SKILL: 750, START_SKILL: 1000,
END_SKILL: 750, END_SKILL: 1000,
POST_SKILL: 750, POST_SKILL: 1000,
}, },
ITEMS: { ITEMS: {

24
client/src/utils.jsx
View File

@ -99,12 +99,17 @@ const COLOUR_ICONS = {
function eventClasses(resolution, cryp) { function eventClasses(resolution, cryp) {
if (!resolution) return ''; if (!resolution) return '';
const startSkill = resolution.stage === 'START_SKILL';
const endSkill = resolution.stage === 'END_SKILL';
const postSkill = resolution.stage === 'POST_SKILL';
const source = cryp.id === resolution.source.id;
const target = cryp.id === resolution.target.id;
// not involved at all. blur them // not involved at all. blur them
if (cryp.id !== resolution.source.id && cryp.id !== resolution.target.id) return 'unfocus'; if (!(source || target)) return 'unfocus';
// not the target. just ignore for now // not the target. just ignore for now
if (cryp.id !== resolution.target.id) return ''; // if (cryp.id !== resolution.target.id) return '';
const [type, event] = resolution.event; const [type, event] = resolution.event;
@ -126,13 +131,19 @@ function eventClasses(resolution, cryp) {
if (type === 'Damage') { if (type === 'Damage') {
const { skill, amount, mitigation, colour } = event; const { skill, amount, mitigation, colour } = event;
if (colour === 'RedDamage' && resolution.stage === 'POST_SKILL') return 'red-damage'; // Highlight the flow of damage from source -> target
if (colour === 'BlueDamage' && resolution.stage === 'POST_SKILL') return 'blue-damage'; if (source && startSkill) return 'active-skill';
if (colour === 'GreenDamage' && resolution.stage === 'POST_SKILL') return 'green-damage'; if (target && endSkill) return 'active-skill';
if (colour === 'RedDamage' && target && postSkill) return 'red-damage';
if (colour === 'BlueDamage' && target && postSkill) return 'blue-damage';
if (colour === 'GreenDamage' && target && postSkill) return 'green-damage';
} }
if (type === 'Healing') { if (type === 'Healing') {
const { skill, amount, overhealing } = event; const { skill, amount, overhealing } = event;
if (source && startSkill) return 'active-skill';
if (target && endSkill) return 'active-skill';
} }
if (type === 'Inversion') { if (type === 'Inversion') {
@ -145,6 +156,8 @@ function eventClasses(resolution, cryp) {
if (type === 'Effect') { if (type === 'Effect') {
const { skill, effect, duration } = event; const { skill, effect, duration } = event;
if (source && startSkill) return 'active-skill';
if (target && endSkill) return 'active-skill';
} }
if (type === 'Removal') { if (type === 'Removal') {
@ -180,6 +193,7 @@ function getCombatText(cryp, resolution) {
const { skill, disable } = event; const { skill, disable } = event;
if (startSkill && source) return `${skill}`; if (startSkill && source) return `${skill}`;
if (endSkill && target) return `${skill}`; if (endSkill && target) return `${skill}`;
if (postSkill && target) return `${disable}`;
} }
if (type === 'Immunity') { if (type === 'Immunity') {