Add battle items

src/components/battleItemContainer.html

@@ -0,0 +1,29 @@
+<div id="BattleItemContainer" class="card mb-3">
+    <div class="card-header p-0"><span>Battle Items</span></div>
+    <div class="card-body p-0">
+      <table class="table table-bordered">
+        <tbody>
+          <tr data-bind="foreach: Object.keys(ItemList).filter(i=>ItemList[i].constructor.name == 'BattleItem')">
+            <td class="p-0" data-bind="attr: {
+                                disabled: !player.itemList[$data]()
+                            },
+                            css: {
+                                'bg-primary': EffectEngineRunner.getEffect($data) > 5,
+                                'bg-warning': EffectEngineRunner.getEffect($data) <= 5 && EffectEngineRunner.getEffect($data) > 0,
+                                'bg-secondary': !EffectEngineRunner.isActive($data)()
+                            },
+                            event: {
+                                click: function(){ItemHandler.useItem($data)}
+                            }">
+                <img src="" class="clickable" data-bind="attr: { src: '/assets/images/items/' + $data + '.png' }">
+
+            </td>
+          </tr>
+          <tr class="bg-dark" data-bind="foreach: Object.keys(ItemList).filter(i=>ItemList[i].constructor.name == 'BattleItem')">
+            <td class="text-light p-0"><code data-bind="text: EffectEngineRunner.formattedTimeLeft($data)()"></code></td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+
+</div>

src/index.html

@@ -511,6 +511,10 @@ <h1>Pokéclicker</h1>
 
         <!--Right column-->
         <div class="col-lg-3 col-md-6">
+
+            <!-- Battle Item container-->
+            @import "battleItemContainer.html"
+
             <div class="card border-secondary mb-3" id="oakItemsContainer"
             data-bind="visible: player.starter != GameConstants.Starter.None">
                 <div class="card-header p-0">

src/scripts/Battle.ts

@@ -120,14 +120,10 @@ class Battle {
 
     static gainItem() {
         let p = player.route() / 1600 + 0.009375;
+
         if (Math.random() < p) {
-            this.getRandomBerry()
+            player.getRandomBerry()
         }
     }
 
-    public static getRandomBerry() {
-        let i = GameHelper.getIndexFromDistribution(GameConstants.BerryDistribution);
-        Notifier.notify("You got a " + GameConstants.BerryType[i] + " berry!", GameConstants.NotificationOption.success);
-        player.berryList[i](player.berryList[i]() + 1);
-    }
 }

src/scripts/GameConstants.ts

@@ -10,6 +10,7 @@ namespace GameConstants {
     export const UNDERGROUND_TICK = 1000;
     export const DUNGEON_TIME = 6000;
     export const DUNGEON_TICK = 1;
+    export const EFFECT_ENGINE_TICK = 1000;
     export const FARM_TICK = 1000;
     export const SAVE_TICK = 10000;
     export const GYM_TIME = 3000;
@@ -22,6 +23,7 @@ namespace GameConstants {
     export const AMOUNT_OF_POKEMONS_GEN1 = 151;
     export const AMOUNT_OF_POKEMONS_GEN2 = 251;
     export const AMOUNT_OF_BADGES = 16;
+    export const ITEM_USE_TIME = 30;
 
     export const ROAMING_MIN_CHANCE = 8192;
     export const ROAMING_MAX_CHANCE = 4096;
@@ -555,12 +557,12 @@ namespace GameConstants {
     }
 
     export enum BattleItemType {
-        xAttack,
-        xClick,
-        xExp,
-        Token_collector,
-        Item_magnet,
-        Lucky_incense
+        xAttack = "xAttack",
+        xClick = "xClick",
+        xExp = "xExp",
+        Token_collector = "Token_collector",
+        Item_magnet = "Item_magnet",
+        Lucky_incense = "Lucky_incense"
     }
 
     export enum PokemonItemType {

src/scripts/Main.ts

@@ -77,7 +77,6 @@ document.addEventListener("DOMContentLoaded", function (event) {
 class Game {
     interval;
     undergroundCounter: number;
-    farmCounter: number = 0;
     public static achievementCounter: number = 0;
 
     public static gameState: KnockoutObservable<GameConstants.GameState> = ko.observable(GameConstants.GameState.fighting);
@@ -105,6 +104,7 @@ class Game {
         // Update tick counters
         this.undergroundCounter += GameConstants.TICK_TIME;
         FarmRunner.counter += GameConstants.TICK_TIME;
+        EffectEngineRunner.counter += GameConstants.TICK_TIME;
         Game.achievementCounter += GameConstants.TICK_TIME;
         if (Game.achievementCounter > GameConstants.ACHIEVEMENT_TICK) {
             Game.achievementCounter = 0;
@@ -167,6 +167,10 @@ class Game {
             FarmRunner.tick();
         }
 
+        if (EffectEngineRunner.counter > GameConstants.EFFECT_ENGINE_TICK){
+            EffectEngineRunner.tick();
+        }
+
         if (GameHelper.counter > 60 * 1000) {
             GameHelper.updateTime();
         }

src/scripts/Player.ts

@@ -179,6 +179,7 @@ class Player {
             return ko.observable(savedPlayer.berryList ? (savedPlayer.berryList[index] || 0) : 0)
         });
         this.plotList = Save.initializePlots(savedPlayer.plotList);
+        this.effectList = Save.initializeEffects(savedPlayer.effectList || {});
         this.highestRegion = savedPlayer.highestRegion || 0;
 
         this.tutorialProgress = ko.observable(savedPlayer.tutorialProgress || 0);
@@ -225,6 +226,8 @@ class Player {
     public farmPoints: KnockoutObservable<number>;
     public berryList: KnockoutObservable<number>[];
 
+    public effectList: { [name: string]: KnockoutObservable<number> } = {};
+
     public tutorialProgress: KnockoutObservable<number>;
     public tutorialState: any;
     public tutorialComplete: KnockoutObservable<boolean>;
@@ -317,8 +320,12 @@ class Player {
     private _caughtAmount: Array<KnockoutObservable<number>>;
 
     public calculateClickAttack(): number {
-        let oakItemBonus = OakItemRunner.isActive(GameConstants.OakItem.Poison_Barb) ? (1 + OakItemRunner.calculateBonus(GameConstants.OakItem.Poison_Barb) / 100) : 1;
-        return Math.floor(Math.pow(this.caughtPokemonList.length + 1, 1.4) * oakItemBonus);
+        const oakItemBonus = OakItemRunner.isActive(GameConstants.OakItem.Poison_Barb) ? (1 + OakItemRunner.calculateBonus(GameConstants.OakItem.Poison_Barb) / 100) : 1;
+        let clickAttack =  Math.floor(Math.pow(this.caughtPokemonList.length + 1, 1.4) * oakItemBonus);
+        if(this.effectList[GameConstants.BattleItemType.xClick]){
+            clickAttack *= 1.5;
+        }
+        return clickAttack;
     }
 
     public calculateMoneyMultiplier(): number {
@@ -442,9 +449,13 @@ class Player {
         // TODO add money multipliers
         let oakItemBonus = OakItemRunner.isActive(GameConstants.OakItem.Amulet_Coin) ? (1 + OakItemRunner.calculateBonus(GameConstants.OakItem.Amulet_Coin) / 100) : 1;
         let moneytogain = Math.floor(money * oakItemBonus * (1 + AchievementHandler.achievementBonus()))
+        if(this.effectList[GameConstants.BattleItemType.Lucky_incense]){
+            moneytogain = Math.floor(moneytogain * 1.5);
+        }
         this._money(this._money() + moneytogain);
         GameHelper.incrementObservable(this.statistics.totalMoney, moneytogain);
         Game.updateMoney();
+
         Game.animateMoney(moneytogain,'playerMoney');
     }
 
@@ -554,6 +565,10 @@ class Player {
         let oakItemBonus = OakItemRunner.isActive(GameConstants.OakItem.Exp_Share) ? 1 + (OakItemRunner.calculateBonus(GameConstants.OakItem.Exp_Share) / 100) : 1;
         let expTotal = Math.floor(exp * level * trainerBonus * oakItemBonus * (1 + AchievementHandler.achievementBonus()) / 9);
 
+        if(this.effectList[GameConstants.BattleItemType.xExp]){
+            expTotal *= 1.5;
+        }
+
         for (let pokemon of this._caughtPokemonList()) {
             if (pokemon.levelObservable() < (this.gymBadges.length + 2) * 10) {
                 pokemon.exp(pokemon.exp() + expTotal);
@@ -652,7 +667,12 @@ class Player {
     }
 
     public gainDungeonTokens(tokens: number) {
+        if(this.effectList[GameConstants.BattleItemType.Token_collector]){
+            tokens *= 1.5;
+        }
+
         this._dungeonTokens(Math.floor(this._dungeonTokens() + tokens));
+
         GameHelper.incrementObservable(this.statistics.totalTokens, tokens);
         Game.animateMoney(tokens,'playerMoneyDungeon');
     }
@@ -814,7 +834,24 @@ class Player {
             }
         }
 
+        if(this.effectList[GameConstants.BattleItemType.xAttack]){
+            attack *= 1.5;
+        }
+
         return Math.round(attack);
+
+    }
+
+    public getRandomBerry() {
+        let i = GameHelper.getIndexFromDistribution(GameConstants.BerryDistribution);
+        Notifier.notify("You got a " + GameConstants.BerryType[i] + " berry!", GameConstants.NotificationOption.success);
+        let amount = 1;
+        if (this.effectList[GameConstants.BattleItemType.Item_magnet]) {
+            if (Math.random() < 0.5) {
+                amount += 1;
+            }
+        }
+        player.berryList[i](player.berryList[i]() + amount);
     }
 
 
@@ -982,6 +1019,7 @@ class Player {
             "farmPoints",
             "plotList",
             "berryList",
+            "effectList",
             "highestRegion",
             "tutorialProgress",
             "tutorialState",
@@ -990,5 +1028,4 @@ class Player {
         let plainJS = ko.toJS(this);
         return Save.filter(plainJS, keep)
     }
-
 }

src/scripts/Save.ts

@@ -152,10 +152,18 @@ class Save {
         return res;
     }
 
+    public static initializeEffects(saved?: Array<string>): {[name: string]: KnockoutObservable<number>} {
+        let res = {};
+        for (let obj in GameConstants.BattleItemType) {
+            res[obj] = ko.observable(saved ? saved[obj] || 0 : 0);
+        }
+        return res;
+    }
+
     public static loadFromFile(file) {
-        testing = file;
+        let fileToRead = file;
         let fr = new FileReader();
-        fr.readAsText(testing);
+        fr.readAsText(fileToRead);
 
         setTimeout(function () {
             try {
@@ -202,5 +210,3 @@ document.addEventListener("DOMContentLoaded", function (event) {
         $('#saveTextArea').text(JSON.stringify(player));
     });
 });
-
-let testing;

src/scripts/effectEngine/effectEngineRunner.ts

@@ -0,0 +1,39 @@
+class EffectEngineRunner {
+    public static counter: number = 0;
+
+    public static tick() {
+        this.counter = 0;
+        const timeToReduce = 1;
+        for(let itemName in GameConstants.BattleItemType){
+            player.effectList[itemName](Math.max(0, player.effectList[itemName]() - timeToReduce));
+            if (player.effectList[itemName]() == 5){
+              Notifier.notify(`The ${itemName}s effect is about to wear off!`, GameConstants.NotificationOption.warning);
+            }
+        }
+    }
+
+    public static getEffect(itemName: string) {
+        return player.effectList[itemName]();
+    }
+
+    public static addEffect(itemName: string){
+        player.effectList[itemName](Math.max(0, player.effectList[itemName]() +  GameConstants.ITEM_USE_TIME));
+    }
+
+    public static formattedTimeLeft(itemName: string){
+        return ko.computed(function () {
+             const times = GameConstants.formatTime(player.effectList[itemName]()).split(':');
+             if (+times[0] > 0) {
+               return '60:00+';
+             }
+             times.shift();
+             return times.join(':');
+        }, this);
+    }
+
+    public static isActive(itemName: string) {
+        return ko.computed(function () {
+            return !!player.effectList[itemName]();
+        }, this);
+    }
+}

src/scripts/farm/FarmRunner.ts

@@ -29,7 +29,6 @@ class FarmRunner {
         for (let i = 0; i < player.plotList.length; i++) {
             player.plotList[i]().timeLeft(Math.max(0, player.plotList[i]().timeLeft() - timeToReduce));
         }
-
     }
 
     public static computePlotPrice(): number {

src/scripts/farm/Plot.ts

@@ -26,7 +26,4 @@ class Plot {
         }
         return 4 - Math.ceil(4 * this.timeLeft() / this.berry().harvestTime);
     }
-
-
-
 }

src/scripts/items/BattleItem.ts

@@ -10,7 +10,12 @@ class BattleItem extends Item {
         this.type = type;
     }
 
+    buy(amt: number) {
+        player.gainItem(this.name(), amt);
+    }
+
     use() {
+        EffectEngineRunner.addEffect(this.name());
     }
 }
 
@@ -19,4 +24,4 @@ ItemList['xClick'] = new BattleItem(GameConstants.BattleItemType.xClick);
 ItemList['xExp'] = new BattleItem(GameConstants.BattleItemType.xExp);
 ItemList['Token_collector'] = new BattleItem(GameConstants.BattleItemType.Token_collector);
 ItemList['Item_magnet'] = new BattleItem(GameConstants.BattleItemType.Item_magnet);
-ItemList['Lucky_incense'] = new BattleItem(GameConstants.BattleItemType.Lucky_incense);
+ItemList['Lucky_incense'] = new BattleItem(GameConstants.BattleItemType.Lucky_incense);

src/scripts/items/ItemHandler.ts

@@ -1,13 +1,16 @@
 class ItemHandler {
 
     public static stoneSelected: KnockoutObservable<string> = ko.observable("Fire_stone");
-    public static pokemonSelected: KnockoutObservable<string> = ko.observable("");
+    public static pokemonSelected: KnockoutObservable<string> = ko.observable("Vulpix");
     public static amountSelected: KnockoutObservable<number> = ko.observable(1);
     static amount: KnockoutObservable<number> = ko.observable(1);
 
-    public static useItem(name:string){
-        ItemList[name].use();
-        player.itemList[name](player.itemList[name]-1);
+    public static useItem(name: string){
+        if (!player.itemList[name]())
+          return Notifier.notify(`You don't have any ${name.replace(/_/g, ' ')}s left...`, GameConstants.NotificationOption.danger);
+
+        player.itemList[name](player.itemList[name]()-1);
+        return ItemList[name].use();
     }
 
     public static resetAmount() {
@@ -23,14 +26,12 @@ class ItemHandler {
 
     public static useStones(){
         if(this.pokemonSelected() == ""){
-            Notifier.notify("No Pokémon selected", GameConstants.NotificationOption.danger);
-            return;
+            return Notifier.notify("No Pokémon selected", GameConstants.NotificationOption.danger);
         }
         let amountTotal = Math.min(this.amountSelected(), player.itemList[this.stoneSelected()]());
 
-        if(amountTotal == 0){
-            Notifier.notify("You don't have any stones left...", GameConstants.NotificationOption.danger);
-            return;
+        if(!amountTotal){
+            return Notifier.notify(`You don't have any ${this.stoneSelected().replace(/_/g, ' ')}s left...`, GameConstants.NotificationOption.danger);
         }
 
         let amountUsed = 0;

src/styles/battleItem.less

@@ -0,0 +1,24 @@
+.battle-item-small {
+  width: 36px;
+  height: 36px;
+  margin: 5px;
+  border: 1px solid black;
+}
+
+.battle-item-small-selected {
+  width: 36px;
+  height: 36px;
+  margin: 5px;
+  border: 1px solid #ff2f39;
+}
+
+.battle-item-none {
+  filter: brightness(0.8);
+  opacity: 0.4;
+}
+
+.meter {
+  width:0%;
+  background-color:rgb(58, 255, 58);
+  height:2px;
+}