Repository: CryptoBlades/cryptoblades
File: frontend/src/views/Blacksmith.vue (Vue)

Code before:

        this.viewNewWeapons(this.forgeMultiplier);

      } catch (e) {
        console.error(e);
        this.onError = true;
        this.$dialog.notify.error('Could not forge sword: insuffucient funds or transaction denied.');
      }
    },
    onShowForgeDetails() {
      this.$refs['forge-details-modal'].show();
    },

    onClickForge(i) {
      this.chlickedForgeButton = i;
      this.$refs['forge-element-selector-modal'].show();
    },

    setChoosenElement(ele, i) {
      this.selectedElement = i;
      if (i === 4) {
        this.forgeCostMultiplier = 1;
      } else{
        this.forgeCostMultiplier = 2;
      }
      [].forEach.call(ele.srcElement.parentNode.childNodes, function(child) {
        child.style.transform = 'scale(1)';
      });
      ele.srcElement.style.transform = 'scale(1.4)';
      this.disableConfirmButton = false;
    },

    showReforgeConfirmation() {
      this.$refs['reforge-confirmation-modal'].show();
    },

    isWeaponRare() {
      return this.getWeaponToBurn().stars >= 3;
    },

    isWeaponReforged() {
      return this.getWeaponToBurn().bonusPower > 0;
    },

    getWeaponToBurn() {
      return this.ownWeapons.find(x => x.id === this.burnWeaponId);
    },

    getCurrentListofWeapons(){
      this.ownedWeaponIds.forEach(x => {
        this.currentListofWeapons.push(x);

Review comment (suggestion):
don't do this. cast it to an array so you don't have to call it like this. also, use arrow functions.

Code after:
                  <div class="col-md-5 weapon-container" align="center">
                    <h1 class="text-center">Select the weapon you wish to burn</h1>
                    <weapon-grid v-model="burnWeaponId" :ignore="burnWeaponIds"
                      :showGivenWeaponIds="true" :weaponIds="hideWeapons" @chooseweapon="addBurnWeapon" />
                  </div>
                  <div class="col-md-4 weapon-container">
                    <div v-if="showReforge && showDustForge === true">
                      <h1 class="text-center">
                        <b-button
                                variant="primary"
                                tagname="confirm_forge_weapon"
                                class="multiForging"
                                @click="clearAllMassBurn()"
                                v-tooltip="'Clear all'"
                                :disabled="burnWeaponIds === []">
                          Clear all
                        </b-button>
                      </h1>
                      <div class="weapon-grid-container">
                        <weapon-grid :showGivenWeaponIds="true" :weaponIds="burnWeaponIds" @chooseweapon="removeBurnWeapon" />
                      </div>
                    </div>
                  </div>
                  <div class="col-md-3 upgrade-container">
                <div v-if="showReforge && showDustForge === true">
                  <div class="confirmReforge">
                    <h2 class="text-center">Create Dust</h2>
                        <div class="dust-image1"></div>
                      <h2 class="text-center">Lesser</h2>
                        <h2>{{getLesserDust()}}</h2>
                        <div class="dust-image2"></div>
                      <h2 class="text-center">Greater</h2>
                        <h2>{{getGreaterDust()}}</h2>
                        <div class="dust-image3"></div>
                      <h2 class="text-center">Powerful</h2>
                        <h2>{{getPowerfulDust()}}</h2>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
          </div>
        </div>
      </b-tab>
      <b-tab>
        <template #title>
          Equipment <b-icon-question-circle class="centered-icon" scale="0.8"
            v-tooltip.bottom="`You can buy shield in Skill shop tab in the market and loot other nfts from Raids!`"/>
        </template>
        <div class="row mt-3">