mirror of
https://github.com/IvarK/AntimatterDimensionsSourceCode.git
synced 2024-11-26 14:12:22 +00:00
standardize css usage for not reached dims, add not reached dim behavior to tds
This commit is contained in:
parent
c38f0ee8c6
commit
7ebc154315
@ -99,7 +99,7 @@ Vue.component("antimatter-dim-row", {
|
||||
},
|
||||
template:
|
||||
`<div v-show="showRow" class="c-antimatter-dim-row"
|
||||
:class="{ 'c-antimatter-dim-row--not-reached': !isUnlocked }">
|
||||
:class="{ 'c-dim-row--not-reached': !isUnlocked }">
|
||||
<div class="c-dim-row__label c-dim-row__name">
|
||||
{{name}} Antimatter Dimension {{formatX(multiplier, 1, 1)}}
|
||||
</div>
|
||||
|
@ -48,7 +48,7 @@ Vue.component("infinity-dim-row", {
|
||||
return "Unlock";
|
||||
}
|
||||
|
||||
return `Reach ${format(requirement)} AM`;
|
||||
return `Reach ${formatPostBreak(requirement)} AM`;
|
||||
},
|
||||
hardcapPurchases() {
|
||||
return format(this.hardcap, 1, 1);
|
||||
@ -103,7 +103,7 @@ Vue.component("infinity-dim-row", {
|
||||
},
|
||||
template:
|
||||
`<div v-show="showRow" class="c-infinity-dim-row"
|
||||
:class="{ 'c-infinity-dim-row--not-reached': !isUnlocked && !requirementReached }">
|
||||
:class="{ 'c-dim-row--not-reached': !isUnlocked && !requirementReached }">
|
||||
<div class="c-dim-row__label c-dim-row__name">
|
||||
{{name}} Infinity Dimension {{formatX(multiplier, 2, 1)}}
|
||||
</div>
|
||||
|
@ -15,6 +15,7 @@ Vue.component("time-dim-row", {
|
||||
cost: new Decimal(0),
|
||||
isAffordable: false,
|
||||
isAutobuyerOn: false,
|
||||
realityUnlocked: false
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
@ -27,7 +28,11 @@ Vue.component("time-dim-row", {
|
||||
: "";
|
||||
},
|
||||
buttonContents() {
|
||||
if (!this.isUnlocked) return "Purchase the study";
|
||||
return this.isCapped ? "Capped" : `Cost: ${format(this.cost, 2)} EP`;
|
||||
},
|
||||
showRow() {
|
||||
return this.isUnlocked || this.realityUnlocked;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
@ -39,10 +44,8 @@ Vue.component("time-dim-row", {
|
||||
update() {
|
||||
const tier = this.tier;
|
||||
const dimension = TimeDimension(tier);
|
||||
const isUnlocked = dimension.isUnlocked;
|
||||
this.isCapped = Enslaved.isRunning && dimension.bought > 0;
|
||||
this.isUnlocked = isUnlocked;
|
||||
if (!isUnlocked) return;
|
||||
this.isUnlocked = dimension.isUnlocked;
|
||||
this.multiplier.copyFrom(dimension.multiplier);
|
||||
this.amount.copyFrom(dimension.amount);
|
||||
if (tier < 8) {
|
||||
@ -50,7 +53,8 @@ Vue.component("time-dim-row", {
|
||||
}
|
||||
this.cost.copyFrom(dimension.cost);
|
||||
this.isAffordable = dimension.isAffordable;
|
||||
this.isAutobuyerOn = player.reality.tdbuyers[this.tier - 1];
|
||||
this.isAutobuyerOn = player.reality.tdbuyers[tier - 1];
|
||||
this.realityUnlocked = PlayerProgress.realityUnlocked();
|
||||
},
|
||||
buyTimeDimension() {
|
||||
buySingleTimeDimension(this.tier);
|
||||
@ -59,8 +63,9 @@ Vue.component("time-dim-row", {
|
||||
buyMaxTimeDimension(this.tier);
|
||||
},
|
||||
},
|
||||
template:
|
||||
`<div v-show="isUnlocked" class="c-time-dim-row">
|
||||
template: `
|
||||
<div v-show="showRow" class="c-time-dim-row"
|
||||
:class="{ 'c-dim-row--not-reached': !isUnlocked }">
|
||||
<div class="c-dim-row__label c-dim-row__name">
|
||||
{{name}} Time Dimension {{formatX(multiplier, 2, 1)}}
|
||||
</div>
|
||||
@ -69,7 +74,7 @@ Vue.component("time-dim-row", {
|
||||
<span class="c-dim-row__label--small" v-if="rateOfChange.neq(0)">{{rateOfChangeDisplay}}</span>
|
||||
</div>
|
||||
<primary-button
|
||||
:enabled="isAffordable && !isCapped"
|
||||
:enabled="isAffordable && !isCapped && isUnlocked"
|
||||
class="o-primary-btn--buy-td l-dim-row__button"
|
||||
@click="buyTimeDimension"
|
||||
>{{buttonContents}}</primary-button>
|
||||
@ -81,7 +86,7 @@ Vue.component("time-dim-row", {
|
||||
/>
|
||||
<primary-button
|
||||
v-else
|
||||
:enabled="isAffordable && !isCapped"
|
||||
:enabled="isAffordable && !isCapped && isUnlocked"
|
||||
class="o-primary-btn--buy-td-max l-dim-row__button"
|
||||
@click="buyMaxTimeDimension"
|
||||
>Buy Max</primary-button>
|
||||
|
@ -104,7 +104,7 @@ Vue.component("new-dimension-row", {
|
||||
},
|
||||
template:
|
||||
`<div v-show="showRow" class="c-antimatter-dim-row"
|
||||
:class="{ 'c-antimatter-dim-row--not-reached': !isUnlocked }">
|
||||
:class="{ 'c-dim-row--not-reached': !isUnlocked }">
|
||||
<div class="c-dim-row__label c-dim-row__name">
|
||||
{{name}} Antimatter D <span class="c-antimatter-dim-row__multiplier">{{formatX(multiplier, 1, 1)}}</span>
|
||||
</div>
|
||||
|
@ -46,7 +46,7 @@ Vue.component("new-inf-dimension-row", {
|
||||
return "Unlock";
|
||||
}
|
||||
|
||||
return `Reach ${format(requirement)} AM`;
|
||||
return `Reach ${formatPostBreak(requirement)} AM`;
|
||||
},
|
||||
capTooltip() {
|
||||
return this.isCapped
|
||||
@ -97,7 +97,7 @@ Vue.component("new-inf-dimension-row", {
|
||||
},
|
||||
template:
|
||||
`<div v-show="showRow" class="c-infinity-dim-row"
|
||||
:class="{ 'c-infinity-dim-row--not-reached': !isUnlocked && !requirementReached }">
|
||||
:class="{ 'c-dim-row--not-reached': !isUnlocked && !requirementReached }">
|
||||
<div class="c-dim-row__label c-dim-row__name">
|
||||
{{name}} Infinity D <span class="c-infinity-dim-row__multiplier">{{formatX(multiplier, 2, 1)}}</span>
|
||||
</div>
|
||||
|
@ -15,6 +15,7 @@ Vue.component("new-time-dimension-row", {
|
||||
cost: new Decimal(0),
|
||||
isAffordable: false,
|
||||
isAutobuyerOn: false,
|
||||
realityUnlocked: false
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
@ -27,7 +28,11 @@ Vue.component("new-time-dimension-row", {
|
||||
: "";
|
||||
},
|
||||
buttonContents() {
|
||||
return this.isCapped ? "Capped" : `Cost: ${format(this.cost, 2, 0)} EP`;
|
||||
if (!this.isUnlocked) return "Purchase the study";
|
||||
return this.isCapped ? "Capped" : `Cost: ${format(this.cost, 2)} EP`;
|
||||
},
|
||||
showRow() {
|
||||
return this.isUnlocked || this.realityUnlocked;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
@ -39,10 +44,8 @@ Vue.component("new-time-dimension-row", {
|
||||
update() {
|
||||
const tier = this.tier;
|
||||
const dimension = TimeDimension(tier);
|
||||
const isUnlocked = dimension.isUnlocked;
|
||||
this.isCapped = Enslaved.isRunning && dimension.bought > 0;
|
||||
this.isUnlocked = isUnlocked;
|
||||
if (!isUnlocked) return;
|
||||
this.isUnlocked = dimension.isUnlocked;
|
||||
this.multiplier.copyFrom(dimension.multiplier);
|
||||
this.amount.copyFrom(dimension.amount);
|
||||
if (tier < 8) {
|
||||
@ -50,7 +53,8 @@ Vue.component("new-time-dimension-row", {
|
||||
}
|
||||
this.cost.copyFrom(dimension.cost);
|
||||
this.isAffordable = dimension.isAffordable;
|
||||
this.isAutobuyerOn = player.reality.tdbuyers[this.tier - 1];
|
||||
this.isAutobuyerOn = player.reality.tdbuyers[tier - 1];
|
||||
this.realityUnlocked = PlayerProgress.realityUnlocked();
|
||||
},
|
||||
buyTimeDimension() {
|
||||
buySingleTimeDimension(this.tier);
|
||||
@ -59,8 +63,9 @@ Vue.component("new-time-dimension-row", {
|
||||
buyMaxTimeDimension(this.tier);
|
||||
},
|
||||
},
|
||||
template:
|
||||
`<div v-show="isUnlocked" class="c-time-dim-row">
|
||||
template: `
|
||||
<div v-show="showRow" class="c-time-dim-row"
|
||||
:class="{ 'c-dim-row--not-reached': !isUnlocked }">
|
||||
<div class="c-dim-row__label c-dim-row__name">
|
||||
{{name}} Time D <span class="c-time-dim-row__multiplier">{{formatX(multiplier, 2, 1)}}</span>
|
||||
</div>
|
||||
@ -69,7 +74,7 @@ Vue.component("new-time-dimension-row", {
|
||||
<span class="c-dim-row__label--small" v-if="rateOfChange.neq(0)">{{rateOfChangeDisplay}}</span>
|
||||
</div>
|
||||
<primary-button
|
||||
:enabled="isAffordable && !isCapped"
|
||||
:enabled="isAffordable && !isCapped && isUnlocked"
|
||||
class="o-primary-btn--buy-td l-dim-row__button o-primary-btn o-primary-btn--new"
|
||||
@click="buyTimeDimension"
|
||||
>{{buttonContents}}</primary-button>
|
||||
@ -81,7 +86,7 @@ Vue.component("new-time-dimension-row", {
|
||||
/>
|
||||
<primary-button
|
||||
v-else
|
||||
:enabled="isAffordable && !isCapped"
|
||||
:enabled="isAffordable && !isCapped && isUnlocked"
|
||||
class="o-primary-btn--buy-td-max l-dim-row__button"
|
||||
@click="buyMaxTimeDimension"
|
||||
>Buy Max</primary-button>
|
||||
|
@ -1986,6 +1986,10 @@ screen and (max-width: 480px) {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.c-dim-row--not-reached {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.c-dim-row__name {
|
||||
width: 40%;
|
||||
}
|
||||
@ -2052,10 +2056,6 @@ screen and (max-width: 480px) {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.c-antimatter-dim-row--not-reached {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.c-antimatter-dim-row__floating-text {
|
||||
position: absolute;
|
||||
bottom: 2rem;
|
||||
@ -2260,10 +2260,6 @@ screen and (max-width: 480px) {
|
||||
font-size: 1.6rem;
|
||||
}
|
||||
|
||||
.c-infinity-dim-row--not-reached {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
/*#endregion c-infinity-dim-row*/
|
||||
|
||||
/*#endregion Infinity Dimensions*/
|
||||
|
Loading…
Reference in New Issue
Block a user