diff --git a/frontend/gfx/ingame.css b/frontend/gfx/ingame.css index 8be4ad6..a4b1abd 100644 --- a/frontend/gfx/ingame.css +++ b/frontend/gfx/ingame.css @@ -52,6 +52,10 @@ body { align-items: center; } +.player-event.itemBuy { + transform-origin: center top; +} + .level { display: none; transform-origin: center; @@ -72,23 +76,35 @@ body { levelOut 0.4s ease-in 2.6s forwards; } -.item { - display: none; +.item, .sponsor { object-fit: contain; width: 60px; height: 60px; +} + +.sponsor { + position: absolute; + transform: scale(0); +} + +.item { + display: none; transform: translateY(-100%); } +.itemBuy .sponsor { + animation: scaleUp 0.4s ease-out 0.4s forwards; +} + .itemBuy { animation: backgroundUp 0.4s ease-out forwards, - backgroundDown 0.4s ease-out 3.45s forwards; + backgroundDown 0.4s ease-out 5.45s forwards; // 3.45s } .itemBuy .item { display: block; - animation: levelIn 0.4s ease-in 0.1s forwards, - levelOut 0.4s ease-in 3.15s forwards; + animation: levelIn 0.4s ease-in 2.1s forwards, + levelOut 0.4s ease-in 5.15s forwards; } .player:not(:last-child) { @@ -178,6 +194,15 @@ body { } } +@keyframes scaleUp { + from { + transform: scale(0); + } + to { + transform: scale(1); + } +} + #inhibDiv { opacity: 1; background-image: url(./img/inhibbadge.png); diff --git a/frontend/gfx/ingame.html b/frontend/gfx/ingame.html index 8e8dcf1..516f538 100644 --- a/frontend/gfx/ingame.html +++ b/frontend/gfx/ingame.html @@ -153,6 +153,7 @@

Gold

+
@@ -160,6 +161,7 @@

Gold

+
@@ -167,6 +169,7 @@

Gold

+
@@ -174,6 +177,7 @@

Gold

+
@@ -181,6 +185,7 @@

Gold

+
@@ -197,6 +202,7 @@

AT 15:25

+
@@ -204,6 +210,7 @@

AT 15:25

+
@@ -211,6 +218,7 @@

AT 15:25

+
@@ -218,6 +226,7 @@

AT 15:25

+
@@ -225,6 +234,7 @@

AT 15:25

+
diff --git a/frontend/gfx/ingame.js b/frontend/gfx/ingame.js index 4e0e799..ce0ed2c 100644 --- a/frontend/gfx/ingame.js +++ b/frontend/gfx/ingame.js @@ -46,6 +46,7 @@ function itemUpdate(e) { const playerDiv = team.children[playerId].querySelector('.player-event') const levelContainer = playerDiv.querySelector('.item') + // const sponsorImage = playerDiv.querySelector('.sponsor') if ( playerDiv.classList.contains('levelUp') || @@ -56,6 +57,7 @@ function itemUpdate(e) { }, 3000) } + // sponsorImage.src = "/pages/op-plugin-theming/active/turniej/logo5.png"; levelContainer.src = `/serve/module-league-static/img/item/${e.item}.png` playerDiv.classList.add('itemBuy') setTimeout(() => {