From b2e4570bfb77952747c7ab8bee243f350e8894bd Mon Sep 17 00:00:00 2001 From: Mashy Date: Tue, 15 Oct 2019 16:05:58 +1000 Subject: [PATCH 01/15] coloured border experiment --- client/assets/styles/styles.less | 18 ++++++++++++++++++ client/src/components/vbox.component.jsx | 24 +++++++++++++++++++++++- 2 files changed, 41 insertions(+), 1 deletion(-) diff --git a/client/assets/styles/styles.less b/client/assets/styles/styles.less index f89cecb0..51884646 100644 --- a/client/assets/styles/styles.less +++ b/client/assets/styles/styles.less @@ -139,6 +139,24 @@ button, input { color: @gray-focus; border-color: @gray-focus; } + &.red-border { + font-z-color: @red; + } + &.blue-border { + border-color: @blue; + } + &.green-border { + border-color: @green; + } + &.red-blue-border { + border-image: linear-gradient(to right, @red 50%, @blue 50%) 5; + } + &.red-green-border { + border-image: linear-gradient(to right, @red 50%, @green 50%) 5; + } + &.blue-green-border { + border-image: linear-gradient(to right, @blue 50%, @green 50%) 5; + } } a { diff --git a/client/src/components/vbox.component.jsx b/client/src/components/vbox.component.jsx index 067f8310..52d1d2e8 100644 --- a/client/src/components/vbox.component.jsx +++ b/client/src/components/vbox.component.jsx @@ -3,6 +3,7 @@ const range = require('lodash/range'); const countBy = require('lodash/countBy'); const without = require('lodash/without'); const { connect } = require('preact-redux'); +const { removeTier } = require('../utils'); const shapes = require('./shapes'); const actions = require('../actions'); @@ -282,8 +283,29 @@ function Vbox(args) { return combinerChange(combiner); } + const source = itemInfo.combos.filter(c => c.item === removeTier(v)); + const colours = itemSource => { + if (!itemSource || !itemSource.length) return ''; + if (itemSource[0].components[0] === 'Blue') { + if (itemSource[0].components[1] === 'Red') return 'red-blue-border'; + if (itemSource[0].components[1] === 'Green') return 'blue-green-border'; + if (itemSource[0].components[1] === 'Blue') return 'blue-border'; + } + if (itemSource[0].components[0] === 'Red') { + if (itemSource[0].components[1] === 'Red') return 'red-border'; + if (itemSource[0].components[1] === 'Green') return 'red-green-border'; + if (itemSource[0].components[1] === 'Blue') return 'red-blue-border'; + } + if (itemSource[0].components[0] === 'Green') { + if (itemSource[0].components[1] === 'Red') return 'red-green-border'; + if (itemSource[0].components[1] === 'Green') return 'green-border'; + if (itemSource[0].components[1] === 'Blue') return 'blue-green-border'; + } + return ''; + }; + const highlighted = combiner.indexOf(i) > -1; - const classes = `${highlighted ? 'highlight' : ''}`; + const classes = `${highlighted ? 'highlight' : colours(source)}`; if (shapes[v]) { return ( ; } + const combinerItems = combiner.map(j => vbox.bound[j]); + const comboHighlight = combinerItems.length > 0 && itemInfo.combos.some(combo => { + if (combo.components.includes(v) && combinerItems.every(c => combo.components.includes(c))) { + return combinerItems.every(c => { + if (c !== v) return true; + const comboCount = countBy(combo.components, co => co); + const combinerCounts = countBy(combinerItems, co => co); + if (comboCount[c] > combinerCounts[c]) return true; + return false; + }); + } return false; + }) ? 'combo-border' : ''; + function onClick(e) { if (vboxSelecting) clearVboxSelected(); if (reclaiming) return sendVboxReclaim(i); @@ -266,36 +279,13 @@ function Vbox(args) { const combinerItems = combiner.map(j => vbox.bound[j]); const combinerCounts = countBy(combinerItems, c => c); - // unless some combo - // contains every combinerItems - // and combinerItems.count of item >= components.count(item) - - if (!itemInfo.combos - .some(combo => { - const comboCount = countBy(combo.components, c => c); - return combinerItems.every(c => - combo.components.includes(c) && comboCount[c] >= combinerCounts[c] - ); - })) { + if (!comboHighlight) { return combinerChange([i]); } return combinerChange(combiner); } - const combinerItems = combiner.map(j => vbox.bound[j]); - const comboHighlight = combinerItems.length > 0 && itemInfo.combos.some(combo => { - if (combo.components.includes(v) && combinerItems.every(c => combo.components.includes(c))) { - return combinerItems.every(c => { - if (c !== v) return true; - const comboCount = countBy(combo.components, co => co); - const combinerCounts = countBy(combinerItems, co => co); - if (comboCount[c] > combinerCounts[c]) return true; - return false; - }); - } return false; - }) ? 'combo-border' : ''; - const highlighted = combiner.indexOf(i) > -1; const border = buttons[removeTier(v)] ? buttons[removeTier(v)]() : ''; const classes = `${highlighted ? 'highlight' : border} ${comboHighlight}`; From f2ae3e5212029bc17a868cf8fa9e23e2c716369d Mon Sep 17 00:00:00 2001 From: ntr Date: Wed, 16 Oct 2019 16:18:24 +1100 Subject: [PATCH 10/15] fade to gray to prevent rainbowing --- client/assets/styles/colours.less | 21 +++++++++++++++------ 1 file changed, 15 insertions(+), 6 deletions(-) diff --git a/client/assets/styles/colours.less b/client/assets/styles/colours.less index a2e5ac88..b6362c6b 100644 --- a/client/assets/styles/colours.less +++ b/client/assets/styles/colours.less @@ -87,28 +87,37 @@ svg { } @keyframes rg { - from { + 0% { border-color: @red; } - to { + 50% { + border-color: @gray-box; + } + 100% { border-color: @green; } } @keyframes rb { - from { + 0% { border-color: @red; } - to { + 50% { + border-color: @gray-box; + } + 100% { border-color: @blue; } } @keyframes bg { - from { + 0% { border-color: @blue; } - to { + 50% { + border-color: @gray-box; + } + 100% { border-color: @green; } } From 935d1d47ee47c60bc468d2a9ff3cad64ec091bfa Mon Sep 17 00:00:00 2001 From: Mashy Date: Wed, 16 Oct 2019 16:17:02 +1000 Subject: [PATCH 11/15] fix combo highlighting (some rare case like 2 green) --- client/src/components/vbox.component.jsx | 15 ++++++--------- 1 file changed, 6 insertions(+), 9 deletions(-) diff --git a/client/src/components/vbox.component.jsx b/client/src/components/vbox.component.jsx index 3257c87b..5a13b404 100644 --- a/client/src/components/vbox.component.jsx +++ b/client/src/components/vbox.component.jsx @@ -249,13 +249,14 @@ function Vbox(args) { const combinerItems = combiner.map(j => vbox.bound[j]); const comboHighlight = combinerItems.length > 0 && itemInfo.combos.some(combo => { - if (combo.components.includes(v) && combinerItems.every(c => combo.components.includes(c))) { + if (combo.components.includes(v)) { return combinerItems.every(c => { - if (c !== v) return true; + if (!combo.components.includes(c)) return false; const comboCount = countBy(combo.components, co => co); - const combinerCounts = countBy(combinerItems, co => co); - if (comboCount[c] > combinerCounts[c]) return true; - return false; + const combinerCount = countBy(combinerItems, co => co); + if (combinerCount[c] > comboCount[c]) return false; + if (c === v && combinerCount[c] + 1 > comboCount[c]) return false; + return true; }); } return false; }) ? 'combo-border' : ''; @@ -275,10 +276,6 @@ function Vbox(args) { combiner.push(i); - // invalid combo - const combinerItems = combiner.map(j => vbox.bound[j]); - const combinerCounts = countBy(combinerItems, c => c); - if (!comboHighlight) { return combinerChange([i]); } From 03a0953b46c78fc31d501f1ce92501bdc3e317c0 Mon Sep 17 00:00:00 2001 From: Mashy Date: Wed, 16 Oct 2019 17:26:03 +1000 Subject: [PATCH 12/15] background highlight equip slots --- client/assets/styles/instance.less | 14 +++++++++----- 1 file changed, 9 insertions(+), 5 deletions(-) diff --git a/client/assets/styles/instance.less b/client/assets/styles/instance.less index 151443c1..05952fc7 100644 --- a/client/assets/styles/instance.less +++ b/client/assets/styles/instance.less @@ -361,12 +361,16 @@ // } .equipping, .receiving { - transition: border-color 0.5s ease-in; - transition-duration: 0.25s; - transition-delay: 0; - transition-timing-function: ease; + animation: eq 0.75s cubic-bezier(0, 0, 1, 1) 0s infinite alternate; +} - border: 2px dashed @gray-hint; +@keyframes eq { + from { + background: @black; + } + to { + background: @gray; + } } .thresholds { From ea5d9088939fecd9f77e57b78184d7a7cf9b4f15 Mon Sep 17 00:00:00 2001 From: Mashy Date: Wed, 16 Oct 2019 18:27:06 +1000 Subject: [PATCH 13/15] vbox highlight for combiner --- client/src/components/vbox.component.jsx | 18 +++++++++++++++++- 1 file changed, 17 insertions(+), 1 deletion(-) diff --git a/client/src/components/vbox.component.jsx b/client/src/components/vbox.component.jsx index 5a13b404..02551acc 100644 --- a/client/src/components/vbox.component.jsx +++ b/client/src/components/vbox.component.jsx @@ -169,12 +169,28 @@ function Vbox(args) { function onClick(e) { e.stopPropagation(); + setItemEquip(null); setCombiner([]); + if (selected) return clearVboxSelected(); return setVboxSelected([group, index]); } - const classes = `${v.toLowerCase()} ${selected ? 'highlight' : ''}`; + const combinerItems = combiner.map(j => vbox.bound[j]); + const comboHighlight = combinerItems.length > 0 && itemInfo.combos.some(combo => { + if (combo.components.includes(v)) { + return combinerItems.every(c => { + if (!combo.components.includes(c)) return false; + const comboCount = countBy(combo.components, co => co); + const combinerCount = countBy(combinerItems, co => co); + if (combinerCount[c] > comboCount[c]) return false; + if (c === v && combinerCount[c] + 1 > comboCount[c]) return false; + return true; + }); + } return false; + }) ? 'combo-border' : ''; + + const classes = `${v.toLowerCase()} ${selected ? 'highlight' : ''} ${comboHighlight}`; if (shapes[v]) { return ( From 245cb603fc4ec2fee5f6bb50bfd0de5acab676cc Mon Sep 17 00:00:00 2001 From: Mashy Date: Thu, 17 Oct 2019 09:33:26 +1000 Subject: [PATCH 14/15] improve check --- client/src/components/vbox.component.jsx | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/client/src/components/vbox.component.jsx b/client/src/components/vbox.component.jsx index 02551acc..8152aad6 100644 --- a/client/src/components/vbox.component.jsx +++ b/client/src/components/vbox.component.jsx @@ -177,12 +177,13 @@ function Vbox(args) { } const combinerItems = combiner.map(j => vbox.bound[j]); + const combinerCount = countBy(combinerItems, co => co); + const comboHighlight = combinerItems.length > 0 && itemInfo.combos.some(combo => { if (combo.components.includes(v)) { return combinerItems.every(c => { if (!combo.components.includes(c)) return false; const comboCount = countBy(combo.components, co => co); - const combinerCount = countBy(combinerItems, co => co); if (combinerCount[c] > comboCount[c]) return false; if (c === v && combinerCount[c] + 1 > comboCount[c]) return false; return true; @@ -264,12 +265,13 @@ function Vbox(args) { } const combinerItems = combiner.map(j => vbox.bound[j]); + const combinerCount = countBy(combinerItems, co => co); + const comboHighlight = combinerItems.length > 0 && itemInfo.combos.some(combo => { if (combo.components.includes(v)) { return combinerItems.every(c => { if (!combo.components.includes(c)) return false; const comboCount = countBy(combo.components, co => co); - const combinerCount = countBy(combinerItems, co => co); if (combinerCount[c] > comboCount[c]) return false; if (c === v && combinerCount[c] + 1 > comboCount[c]) return false; return true; From 47d060432cef6d6a65d0e4c88c5f0a6a14a7f7c1 Mon Sep 17 00:00:00 2001 From: ntr Date: Thu, 17 Oct 2019 11:24:29 +1100 Subject: [PATCH 15/15] v1.5.6 --- VERSION | 2 +- acp/package.json | 2 +- client/package.json | 2 +- ops/package.json | 2 +- server/Cargo.toml | 2 +- 5 files changed, 5 insertions(+), 5 deletions(-) diff --git a/VERSION b/VERSION index 5ebba4f0..03082db7 100644 --- a/VERSION +++ b/VERSION @@ -1 +1 @@ -1.5.5 \ No newline at end of file +1.5.6 \ No newline at end of file diff --git a/acp/package.json b/acp/package.json index c1034fe4..a9ffeccf 100644 --- a/acp/package.json +++ b/acp/package.json @@ -1,6 +1,6 @@ { "name": "mnml-client", - "version": "1.5.5", + "version": "1.5.6", "description": "", "main": "index.js", "scripts": { diff --git a/client/package.json b/client/package.json index acec772b..9d22f205 100644 --- a/client/package.json +++ b/client/package.json @@ -1,6 +1,6 @@ { "name": "mnml-client", - "version": "1.5.5", + "version": "1.5.6", "description": "", "main": "index.js", "scripts": { diff --git a/ops/package.json b/ops/package.json index 8cb6c98f..673c03d7 100755 --- a/ops/package.json +++ b/ops/package.json @@ -1,6 +1,6 @@ { "name": "mnml-ops", - "version": "1.5.5", + "version": "1.5.6", "description": "", "main": "index.js", "scripts": { diff --git a/server/Cargo.toml b/server/Cargo.toml index fcf67d51..4285bf4c 100644 --- a/server/Cargo.toml +++ b/server/Cargo.toml @@ -1,6 +1,6 @@ [package] name = "mnml" -version = "1.5.5" +version = "1.5.6" authors = ["ntr "] [dependencies]