|
|
@ -68,15 +68,30 @@ |
|
|
|
<div class="card-body" id="collapseQuest"> |
|
|
|
<div class="card-body" id="collapseQuest"> |
|
|
|
<div v-if="currentQuest"> |
|
|
|
<div v-if="currentQuest"> |
|
|
|
Items needed: <br/> |
|
|
|
Items needed: <br/> |
|
|
|
<span v-if="currentQuest.wood > 0"><img title="wood" class="resource-icon" src="img/wood.png"> {{ currentQuest.wood }}</span> |
|
|
|
<span v-if="currentQuest.wood > 0" :style="'color: ' + getColorForQuestResource(currentQuest.wood, resources.wood)"> |
|
|
|
<span v-if="currentQuest.planks > 0"><img title="wood" class="resource-icon" src="img/planks.png"> {{ currentQuest.planks }}</span> |
|
|
|
<img title="wood" class="resource-icon" src="img/wood.png"> {{ currentQuest.wood }} |
|
|
|
<span v-if="currentQuest.stone > 0"><img title="stone" class="resource-icon" src="img/stone.png"> {{ currentQuest.stone }}</span> |
|
|
|
</span> |
|
|
|
<span v-if="currentQuest.coal > 0"><img title="coal" class="resource-icon" src="img/coal.png"> {{ currentQuest.coal }}</span> |
|
|
|
<span v-if="currentQuest.planks > 0" :style="'color: ' + getColorForQuestResource(currentQuest.planks, resources.planks)"> |
|
|
|
<span v-if="currentQuest.iron > 0"><img title="iron" class="resource-icon" src="img/iron.png"> {{ currentQuest.iron }}</span> |
|
|
|
<img title="wood" class="resource-icon" src="img/planks.png"> {{ currentQuest.planks }} |
|
|
|
<span v-if="currentQuest.bricks > 0"><img title="bricks" class="resource-icon" src="img/bricks.png"> {{ currentQuest.bricks }}</span> |
|
|
|
</span> |
|
|
|
<span v-if="currentQuest.corn > 0"><img title="corn" class="resource-icon" src="img/corn.png"> {{ currentQuest.corn }}</span> |
|
|
|
<span v-if="currentQuest.stone > 0" :style="'color: ' + getColorForQuestResource(currentQuest.stone, resources.stone)"> |
|
|
|
|
|
|
|
<img title="stone" class="resource-icon" src="img/stone.png"> {{ currentQuest.stone }} |
|
|
|
|
|
|
|
</span> |
|
|
|
|
|
|
|
<span v-if="currentQuest.coal > 0" :style="'color: ' + getColorForQuestResource(currentQuest.coal, resources.coal)"> |
|
|
|
|
|
|
|
<img title="coal" class="resource-icon" src="img/coal.png"> {{ currentQuest.coal }} |
|
|
|
|
|
|
|
</span> |
|
|
|
|
|
|
|
<span v-if="currentQuest.iron > 0" :style="'color: ' + getColorForQuestResource(currentQuest.iron, resources.iron)"> |
|
|
|
|
|
|
|
<img title="iron" class="resource-icon" src="img/iron.png"> {{ currentQuest.iron }} |
|
|
|
|
|
|
|
</span> |
|
|
|
|
|
|
|
<span v-if="currentQuest.bricks > 0" :style="'color: ' + getColorForQuestResource(currentQuest.bricks, resources.bricks)"> |
|
|
|
|
|
|
|
<img title="bricks" class="resource-icon" src="img/bricks.png"> {{ currentQuest.bricks }} |
|
|
|
|
|
|
|
</span> |
|
|
|
|
|
|
|
<span v-if="currentQuest.corn > 0" :style="'color: ' + getColorForQuestResource(currentQuest.corn, resources.corn)"> |
|
|
|
|
|
|
|
<img title="corn" class="resource-icon" src="img/corn.png"> {{ currentQuest.corn }} |
|
|
|
|
|
|
|
</span> |
|
|
|
|
|
|
|
<br/> |
|
|
|
<br/> |
|
|
|
<br/> |
|
|
|
<a href="javascript:" class="btn btn-sm btn-success" @click="redeemReward()">Redeem reward ({{ currentQuest.reward }} <img class="resource-icon" src="img/gold.png">)</a> |
|
|
|
<a href="javascript:" class="btn btn-sm btn-success float-right" @click="redeemReward()">Redeem reward ({{ currentQuest.reward }} <img class="resource-icon" src="img/gold.png">)</a> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div v-else> |
|
|
|
<div v-else> |
|
|
|
<a class="btn btn-sm btn-info" @click="generateQuestWithRandomItems()">Get Quest (resources needed)</a> |
|
|
|
<a class="btn btn-sm btn-info" @click="generateQuestWithRandomItems()">Get Quest (resources needed)</a> |
|
|
|