mirror of
https://github.com/IvarK/AntimatterDimensionsSourceCode.git
synced 2024-11-10 06:02:13 +00:00
rename new-reality-button to reality-button and clean up code style
This commit is contained in:
garnet420
parent
1d8229c9c8
commit
de47d34ba5
@ -106,7 +106,7 @@
|
||||
</div>
|
||||
<div> <!-- middle -->
|
||||
<br>
|
||||
<new-reality-button></new-reality-button>
|
||||
<reality-button></reality-button>
|
||||
<br>
|
||||
<expanding-control-box v-if="view.tabs.current === 'reality-tab' && view.tabs.reality.subtab === 'glyphstab'"
|
||||
label="Glyph level factors"
|
||||
@ -617,7 +617,7 @@
|
||||
<script type="text/javascript" src="javascripts/components/eternity/dilation/tachyon-particles.js"></script>
|
||||
|
||||
<script type="text/javascript" src="javascripts/components/reality/reality-tab.js"></script>
|
||||
<script type="text/javascript" src="javascripts/components/reality/glyphs/new-reality-button.js"></script>
|
||||
<script type="text/javascript" src="javascripts/components/reality/glyphs/reality-button.js"></script>
|
||||
<script type="text/javascript" src="javascripts/components/reality/glyphs/glyph-levels-and-weights.js"></script>
|
||||
|
||||
<script type="text/javascript" src="javascripts/components/modals/modal-popup.js"></script>
|
||||
|
||||
@ -1101,7 +1101,7 @@ Vue.component("ad-slider-component", {
|
||||
<div :class="['l-ad-slider__dot-handle', 'c-ad-slider__dot-handle', dotClass]"
|
||||
:style="[sliderStyles, focusFlag && focusSlider === 0 ? focusStyles : null]">
|
||||
{{dotContents(0)}}
|
||||
<slot name="in-dot"></slot>
|
||||
<slot name="in-dot"/>
|
||||
</div>
|
||||
</slot>
|
||||
<div :class="['ad-slider-tooltip-' + tooltipDirection, 'ad-slider-tooltip-wrap']">
|
||||
|
||||
@ -1,83 +0,0 @@
|
||||
Vue.component("new-reality-button", {
|
||||
data: function () {
|
||||
return {
|
||||
canReality: false,
|
||||
machinesGained: 0,
|
||||
realityTime: 0,
|
||||
glyphLevel: 0,
|
||||
nextGlyphPercent: 0,
|
||||
nextMachineEP: 0,
|
||||
shardsGained: 0,
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
buttonHeader() {
|
||||
return this.canReality ? "Make a new reality" : "Start reality over";
|
||||
},
|
||||
formatMachinesGained() {
|
||||
return "Machines gained: " + this.shortenDimensions(this.machinesGained);
|
||||
},
|
||||
formatMachineStats() {
|
||||
if (this.machinesGained < 100) {
|
||||
return "Next at 1e" + this.nextMachineEP + " EP";
|
||||
} else {
|
||||
return shortenRateOfChange(this.machinesGained/this.realityTime) + " RM/min"
|
||||
}
|
||||
},
|
||||
formatGlyphLevel() {
|
||||
return "Glyph level: " + this.glyphLevel + " (" + this.nextGlyphPercent + "%)"
|
||||
},
|
||||
shardsGainedText() {
|
||||
return this.shorten(this.shardsGained, 2) + " Relic Shards (Teresa)"
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
update() {
|
||||
if (player.dilation.studies.length < 6) {
|
||||
this.canReality = false;
|
||||
this.shardsGained = 0;
|
||||
} else {
|
||||
this.canReality = true;
|
||||
this.machinesGained = gainedRealityMachines();
|
||||
this.realityTime = Time.thisRealityRealTime.totalMinutes;
|
||||
this.glyphLevel = gainedGlyphLevel();
|
||||
this.nextGlyphPercent = percentToNextGlyphLevel();
|
||||
this.nextMachineEP = logEPforRM(this.machinesGained.plus(1));
|
||||
this.shardsGained = Teresa.shardsGained;
|
||||
}
|
||||
},
|
||||
handleClick() {
|
||||
if (player.dilation.studies.length < 6) {
|
||||
startRealityOver();
|
||||
} else {
|
||||
reality();
|
||||
}
|
||||
},
|
||||
},
|
||||
template: `
|
||||
<button :class="['l-new-reality-button', 'c-new-reality-button', 'infotooltip',
|
||||
canReality ? 'c-new-reality-button--good' : 'c-new-reality-button--bad']"
|
||||
@click="handleClick">
|
||||
<div class="l-new-reality-button__contents">
|
||||
<div class="c-new-reality-button__header">{{buttonHeader}}</div>
|
||||
<template v-if="canReality">
|
||||
<div>{{formatMachinesGained}}</div>
|
||||
<div>{{formatMachineStats}}</div>
|
||||
<div>{{formatGlyphLevel}}</div>
|
||||
</template><template v-else>
|
||||
<div>Purchase the study in the eternity tab to unlock a new reality</div>
|
||||
</template>
|
||||
<div class="infotooltiptext">
|
||||
<template v-if="canReality">
|
||||
<div>Other resources gained:</div>
|
||||
<div>1 Perk Point</div>
|
||||
<div v-if="shardsGained !== 0">{{shardsGainedText}}</div>
|
||||
</template>
|
||||
<template v-else>
|
||||
No resources gained
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</button>
|
||||
`
|
||||
});
|
||||
89
javascripts/components/reality/glyphs/reality-button.js
Normal file
89
javascripts/components/reality/glyphs/reality-button.js
Normal file
@ -0,0 +1,89 @@
|
||||
Vue.component("reality-button", {
|
||||
data: function () {
|
||||
return {
|
||||
canReality: false,
|
||||
machinesGained: 0,
|
||||
realityTime: 0,
|
||||
glyphLevel: 0,
|
||||
nextGlyphPercent: 0,
|
||||
nextMachineEP: 0,
|
||||
shardsGained: 0,
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
buttonHeader() {
|
||||
return this.canReality ? "Make a new reality" : "Start reality over";
|
||||
},
|
||||
formatMachinesGained() {
|
||||
return `Machines gained: ${this.shorten(this.machinesGained, 2, 0)}`;
|
||||
},
|
||||
formatMachineStats() {
|
||||
if (this.machinesGained < 100) {
|
||||
return `Next at 1e${this.nextMachineEP} EP`;
|
||||
} else {
|
||||
return `${shorten(this.machinesGained / this.realityTime, 2, 2)} RM/min`
|
||||
}
|
||||
},
|
||||
formatGlyphLevel() {
|
||||
return `Glyph level: ${this.glyphLevel} (${this.nextGlyphPercent}%)`
|
||||
},
|
||||
shardsGainedText() {
|
||||
return `${this.shorten(this.shardsGained, 2)} Relic Shards (Teresa)`
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
update() {
|
||||
if (player.dilation.studies.length < 6) {
|
||||
this.canReality = false;
|
||||
this.shardsGained = 0;
|
||||
return;
|
||||
}
|
||||
function logEPforRM(rm) {
|
||||
rm = Decimal.divide(rm, Effarig.rmMultiplier * player.celestials.effarig.rmMult);
|
||||
if (rm.lte(1)) return 4000;
|
||||
return Math.ceil(4000 * (rm.log10() / 3 + 1));
|
||||
}
|
||||
this.canReality = true;
|
||||
this.machinesGained = gainedRealityMachines();
|
||||
this.realityTime = Time.thisRealityRealTime.totalMinutes;
|
||||
this.glyphLevel = gainedGlyphLevel();
|
||||
this.nextGlyphPercent = percentToNextGlyphLevel();
|
||||
this.nextMachineEP = logEPforRM(this.machinesGained.plus(1));
|
||||
this.shardsGained = Teresa.shardsGained;
|
||||
},
|
||||
handleClick() {
|
||||
if (player.dilation.studies.length < 6) {
|
||||
startRealityOver();
|
||||
} else {
|
||||
reality();
|
||||
}
|
||||
},
|
||||
},
|
||||
template: `
|
||||
<button :class="['l-reality-button', 'c-reality-button', 'infotooltip',
|
||||
canReality ? 'c-reality-button--good' : 'c-reality-button--bad']"
|
||||
@click="handleClick">
|
||||
<div class="l-reality-button__contents">
|
||||
<div class="c-reality-button__header">{{buttonHeader}}</div>
|
||||
<template v-if="canReality">
|
||||
<div>{{formatMachinesGained}}</div>
|
||||
<div>{{formatMachineStats}}</div>
|
||||
<div>{{formatGlyphLevel}}</div>
|
||||
</template>
|
||||
<template v-else>
|
||||
<div>Purchase the study in the eternity tab to unlock a new reality</div>
|
||||
</template>
|
||||
<div class="infotooltiptext">
|
||||
<template v-if="canReality">
|
||||
<div>Other resources gained:</div>
|
||||
<div>1 Perk Point</div>
|
||||
<div v-if="shardsGained !== 0">{{shardsGainedText}}</div>
|
||||
</template>
|
||||
<template v-else>
|
||||
No resources gained
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</button>
|
||||
`
|
||||
});
|
||||
@ -436,23 +436,23 @@ button {
|
||||
margin-left: -525px;
|
||||
}
|
||||
|
||||
.l-new-reality-button {
|
||||
.l-reality-button {
|
||||
display: block;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
.l-new-reality-button__contents {
|
||||
.l-reality-button__contents {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.c-new-reality-button__header {
|
||||
.c-reality-button__header {
|
||||
font-size: 1.4rem;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.c-new-reality-button {
|
||||
.c-reality-button {
|
||||
font-family: Typewriter;
|
||||
border-radius: 0.4rem !important;
|
||||
transition-duration: 0.2s;
|
||||
@ -466,52 +466,52 @@ button {
|
||||
border-style: solid;
|
||||
}
|
||||
|
||||
.t-inverted-metro .c-new-reality-button, .t-metro .c-new-reality-button, .t-s8 .c-new-reality-button {
|
||||
.t-inverted-metro .c-reality-button, .t-metro .c-reality-button, .t-s8 .c-reality-button {
|
||||
border-width: 0.1rem;
|
||||
}
|
||||
|
||||
.c-new-reality-button--good {
|
||||
.c-reality-button--good {
|
||||
color: #0b600e;
|
||||
border-color: #0b600e;
|
||||
}
|
||||
|
||||
.c-new-reality-button--bad {
|
||||
color: #B84B5F;/* #642a2c; */
|
||||
.c-reality-button--bad {
|
||||
color: #B84B5F;
|
||||
border-color: #B84B5F;
|
||||
}
|
||||
|
||||
.t-dark .c-new-reality-button--good {
|
||||
.t-dark .c-reality-button--good {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.t-dark .c-new-reality-button--bad {
|
||||
.t-dark .c-reality-button--bad {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.c-new-reality-button--good:hover, .c-new-reality-button--good.force-hover {
|
||||
.c-reality-button--good:hover, .c-reality-button--good.force-hover {
|
||||
color: white;
|
||||
background: #0b600e;
|
||||
}
|
||||
|
||||
.t-dark .c-new-reality-button--good:hover, .t-dark .c-new-reality-button--good.force-hover {
|
||||
background: #0b600e !important; /* FIXME stupid important alert */
|
||||
.t-dark .c-reality-button--good:hover, .t-dark .c-reality-button--good.force-hover {
|
||||
background: #0b600e !important;
|
||||
}
|
||||
|
||||
.t-s6 .c-new-reality-button--good:hover, .t-s6 .c-new-reality-button--good.force-hover {
|
||||
background: #0b600e !important; /* FIXME stupid important alert */
|
||||
.t-s6 .c-reality-button--good:hover, .t-s6 .c-reality-button--good.force-hover {
|
||||
background: #0b600e !important;
|
||||
}
|
||||
|
||||
.c-new-reality-button--bad:hover, .c-new-reality-button--bad.force-hover {
|
||||
.c-reality-button--bad:hover, .c-reality-button--bad.force-hover {
|
||||
color: white;
|
||||
background: #642a2c;
|
||||
}
|
||||
|
||||
.t-dark .c-new-reality-button--bad:hover, .t-dark .c-new-reality-button--bad.force-hover {
|
||||
background: #642a2c !important; /* FIXME stupid important alert */
|
||||
.t-dark .c-reality-button--bad:hover, .t-dark .c-reality-button--bad.force-hover {
|
||||
background: #642a2c !important;
|
||||
}
|
||||
|
||||
.t-s6 .c-new-reality-button--bad:hover, .t-s6 .c-new-reality-button--bad.force-hover {
|
||||
background: #642a2c !important; /* FIXME stupid important alert */
|
||||
.t-s6 .c-reality-button--bad:hover, .t-s6 .c-reality-button--bad.force-hover {
|
||||
background: #642a2c !important;
|
||||
}
|
||||
|
||||
[draggable] {
|
||||
|
||||
@ -260,29 +260,29 @@
|
||||
<button class="o-primary-btn o-primary-btn--disabled o-primary-btn--new-dim" style="position: static;">
|
||||
<b>Get 1e308 antimatter to unlock a new Dimension.</b>
|
||||
</button>
|
||||
<button class="l-new-reality-button c-new-reality-button c-new-reality-button--bad">
|
||||
<div class="l-new-reality-button__contents">
|
||||
<div class="c-new-reality-button__header">Start reality over</div>
|
||||
<button class="l-reality-button c-reality-button c-reality-button--bad">
|
||||
<div class="l-reality-button__contents">
|
||||
<div class="c-reality-button__header">Start reality over</div>
|
||||
<div>Purchase the study in the eternity tab to unlock a new reality</div>
|
||||
</div>
|
||||
</button>
|
||||
<button class="l-new-reality-button c-new-reality-button c-new-reality-button--bad force-hover">
|
||||
<div class="l-new-reality-button__contents">
|
||||
<div class="c-new-reality-button__header">Start reality over</div>
|
||||
<button class="l-reality-button c-reality-button c-reality-button--bad force-hover">
|
||||
<div class="l-reality-button__contents">
|
||||
<div class="c-reality-button__header">Start reality over</div>
|
||||
<div>HOVER HOVER HOVER</div>
|
||||
</div>
|
||||
</button>
|
||||
<button class="l-new-reality-button c-new-reality-button c-new-reality-button--good">
|
||||
<div class="l-new-reality-button__contents">
|
||||
<div class="c-new-reality-button__header">Make a new reality</div>
|
||||
<button class="l-reality-button c-reality-button c-reality-button--good">
|
||||
<div class="l-reality-button__contents">
|
||||
<div class="c-reality-button__header">Make a new reality</div>
|
||||
<div>Machines gained: 6.48e10</div>
|
||||
<div>0.04 RM/min</div>
|
||||
<div>Glyph level: 576 (35.4%)</div>
|
||||
</div>
|
||||
</button>
|
||||
<button class="l-new-reality-button c-new-reality-button c-new-reality-button--good force-hover">
|
||||
<div class="l-new-reality-button__contents">
|
||||
<div class="c-new-reality-button__header">HOVER STATE</div>
|
||||
<button class="l-reality-button c-reality-button c-reality-button--good force-hover">
|
||||
<div class="l-reality-button__contents">
|
||||
<div class="c-reality-button__header">HOVER STATE</div>
|
||||
<div>Machines gained: 6.48e10</div>
|
||||
<div>0.04 RM/min</div>
|
||||
<div>Glyph level: 576 (35.4%)</div>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user