Mostly work on achievement style stuff

js/Demo/demoLayers.js

@@ -365,7 +365,6 @@ addLayer("c", {
             return (player.c.buyables[11] == 1)
         },
         resetDescription: "Melt your points into ",
-        milestonePopups: true
 })
 
 
@@ -496,7 +495,6 @@ addLayer("a", {
             11: {
                 name: "Get me!",
                 done() {return true}, // This one is a freebie
-                tooltip: "",
                 goalTooltip: "How did this happen?", // Shows when achievement is not completed
                 doneTooltip: "You did it!", // Showed when the achievement is completed
             },

js/Demo/demoMod.js

@@ -11,8 +11,8 @@ let modInfo = {
 
 // Set your version in num and name
 let VERSION = {
-	num: "2.2.9",
-	name: "Uprooted",
+	num: "2.3",
+	name: "Cooler and Newer",
 }
 
 let changelog = `<h1>Changelog:</h1><br>

js/components.js

@@ -212,7 +212,7 @@ function loadVue() {
 	Vue.component('main-display', {
 		props: ['layer'],
 		template: `
-		<div><span v-if="player[layer].points.lt('1e1000')">You have </span><h2 v-bind:style="{'color': tmp[layer].color, 'text-shadow': '0px 0px 10px' + tmp[layer].color}">{{formatWhole(player[layer].points)}}</h2> {{tmp[layer].resource}}, <span v-if="tmp[layer].effectDescription" v-html="tmp[layer].effectDescription"></span><br><br></div>
+		<div><span v-if="player[layer].points.lt('1e1000')">You have </span><h2 v-bind:style="{'color': tmp[layer].color, 'text-shadow': '0px 0px 10px' + tmp[layer].color}">{{formatWhole(player[layer].points)}}</h2> {{tmp[layer].resource}}<span v-if="tmp[layer].effectDescription">, <span v-html="tmp[layer].effectDescription"></span></span><br><br></div>
 		`
 	})
 
@@ -367,8 +367,8 @@ function loadVue() {
 				(tmp[layer].achievements[data].tooltip == '') ? false : hasAchievement(layer, data) ? (tmp[layer].achievements[data].doneTooltip ? tmp[layer].achievements[data].doneTooltip : (tmp[layer].achievements[data].tooltip ? tmp[layer].achievements[data].tooltip : 'You did it!'))
 				: (tmp[layer].achievements[data].goalTooltip ? tmp[layer].achievements[data].goalTooltip : (tmp[layer].achievements[data].tooltip ? tmp[layer].achievements[data].tooltip : 'LOCKED'))
 			"
-
-			v-bind:style="[(!tmp[layer].achievements[data].unlocked) ? {'visibility': 'hidden'} : {}, tmp[layer].achievements[data].style,]">
+			
+			v-bind:style="tmp[layer].achievements[data].computedStyle">
 			<span v-if= "tmp[layer].achievements[data].name"><br><h3 v-html="tmp[layer].achievements[data].name"></h3><br></span>
 		</div>
 		`

js/game.js

@@ -4,8 +4,8 @@ var gameEnded = false;
 
 // Don't change this
 const TMT_VERSION = {
-	tmtNum: "2.2.9",
-	tmtName: "Uprooted"
+	tmtNum: "2.3",
+	tmtName: "Cooler and Newer"
 }
 
 function getResetGain(layer, useType = null) {

js/technical/temp.js

@@ -77,6 +77,7 @@ function updateTemp() {
 		tmp[layer].prestigeNotify = prestigeNotify(layer)
 		tmp[layer].prestigeButtonText = prestigeButtonText(layer)
 		constructBarStyles(layer)
+		constructAchievementStyles(layer)
 		updateChallengeDisplay(layer)
 
 	}
@@ -148,6 +149,20 @@ function updateClickableTemp(layer)
 	updateTempData(layers[layer].clickables, tmp[layer].clickables)
 }
 
+function constructAchievementStyles(layer){
+	for (id in tmp[layer].achievements) {
+		ach = tmp[layer].achievements[id]
+		if (isPlainObject(ach)) {
+			let style = []
+			if (ach.image){ 
+				style.push({'background-image': ach.image})
+			} 
+			if (!ach.unlocked) style.push({'visibility': 'hidden'})
+			style.push(ach.style)
+			Vue.set(ach, 'computedStyle', style)
+		}
+	}
+}
 
 var DIR_MARGINS = ["margin-bottom", "margin-top", "margin-right", "margin-left"]
 

js/utils.js

@@ -727,7 +727,7 @@ function updateMilestones(layer){
 	for (id in layers[layer].milestones){
 		if (!(player[layer].milestones.includes(id)) && layers[layer].milestones[id].done()){
 			player[layer].milestones.push(id)
-			if (tmp[layer].milestonePopups) popup("milestone", tmp[layer].milestones[id].requirementDescription, "Milestone Gotten!", 3, tmp[layer].color);
+			if (tmp[layer].milestonePopups) doPopup("milestone", tmp[layer].milestones[id].requirementDescription, "Milestone Gotten!", 3, tmp[layer].color);
 		}
 	}
 }
@@ -737,7 +737,7 @@ function updateAchievements(layer){
 		if (isPlainObject(layers[layer].achievements[id]) && !(player[layer].achievements.includes(id)) && layers[layer].achievements[id].done()) {
 			player[layer].achievements.push(id)
 			if (layers[layer].achievements[id].onComplete) layers[layer].achievements[id].onComplete()
-			if (tmp[layer].achievementPopups) popup("achievement", tmp[layer].achievements[id].name, "Achievement Gotten!", 3, tmp[layer].color);
+			if (tmp[layer].achievementPopups) doPopup("achievement", tmp[layer].achievements[id].name, "Achievement Gotten!", 3, tmp[layer].color);
 		}
 	}
 }
@@ -816,7 +816,7 @@ var activePopups = [];
 var popupID = 0;
 
 // Function to show popups
-function popup(type="none",text="This is a test popup.",title="",timer=3, color="") {
+function doPopup(type="none",text="This is a test popup.",title="",timer=3, color="") {
 	switch(type) {
 		case "achievement":
 			popupTitle = "Achievement Unlocked!";