Popup.js

Skip to content This repository

   Pull requests
   Issues
   Marketplace
   Explore

   @HALCONDEORO

2 1

   1

Thathanka-Iyothanka/West-Wiki Code Issues 0 Pull requests 0 Projects 0 Wiki Insights West-Wiki/Popup.js 00b5ea2 6 hours ago @Thathanka-Iyothanka Thathanka-Iyothanka Update Popup.js 619 lines (604 sloc) 28.1 KB //Append popup container

$('body').append('

');

//Set events $(document).on('mouseenter', '.item_container', function (e) {

   Popup.show(this);
   Popup.setPosition(e);

}); $(document).on('mouseleave', '.item_container', function () {

   Popup.hide();

}); $(document).on('mousemove', '.item_container', function (e) {

   Popup.setPosition(e);

});

$('.item_level').mousedown(function (e) {

   e.preventDefault();

}); $(document).on('click', '.upgrade', function () {

   var container = $(this).closest('.item_container');
   var lvl = parseInt(container.attr('data-lvl'));
   if (lvl !== 5) {
       container.attr('data-lvl', lvl + 1);
       container.find('.level').html(lvl + 1);
   }
   Popup.show(container[0]);

}); $(document).on('click', '.downgrade', function () {

   var container = $(this).closest('.item_container');
   var lvl = parseInt(container.attr('data-lvl'));
   if (lvl !== 0) {
       container.attr('data-lvl', lvl - 1);
       container.find('.level').html(lvl - 1);
   }
   Popup.show(container[0]);

});

//Append input level if ($("#input_level").length === 1) {

   var input_level = $('<input type="number" style="width:80px;" class="west" placeholder="Your level" min="0" max="150">').bind("propertychange keyup input paste", function () {
       if (this.value > 150) {
           this.value = 150;
       } else if (this.value < 0) {
           this.value = 0;
       }
       $(".calc").each(function () {
           if (input_level.val() === 0) {
               $(this).html(this.id);
               $('.per_level_off').addClass('per_level').removeClass('per_level_off');
           } else {
               $(this).html(Math.ceil(Number(this.id) * input_level.val()));
               $('.per_level').addClass('per_level_off').removeClass('per_level');
           }
       });
   }).appendTo($("#input_level"));

}

//Search if ($("#input_search").length === 1) {

   var input_search = $('<input type="search" class="west" placeholder="Search">').bind("propertychange keyup input paste", function () {
       var val = this.value.toLowerCase();
       if (val === ) {
           $('.item_container').show();
       } else {
           $('.item_container').hide();
           $('.item_container').filter(function () {
               return $(this).attr('data-popup').toLowerCase().indexOf(val) > -1;
           }).show();
       }
   }).appendTo($("#input_search"));

}

//Switch weapons if ($("#switch").length === 1) {

   $("#fire").hide();
   $("#switch").on("click", function () {
       $('#melee, #fire').toggle();
   });

}

var Popup = {

   content: "",
   delay: 200,
   active: false,
   show: function (obj) {
       Popup.content = Popup.createPopup($(obj).attr('data-popup'), $(obj).attr('data-cdn-cat'), $(obj).attr('data-cdn-img'), parseInt($(obj).attr('data-lvl')));
       Popup.active = true;
       Popup.setTimeout();
       Popup.getContainer().html(Popup.content);
   },
   hide: function () {
       Popup.getEl().css({
           display: 'none',
           top: 0,
           left: 0
       });
       Popup.active = false;
       Popup.clearTimeout();
   },
   setTimeout: function () {
       Popup.clearTimeout();
       Popup.timer = window.setTimeout(function () {
           Popup.getEl().css('display', 'block');
       }, Popup.delay);
   },
   clearTimeout: function () {
       if (Popup.timer) window.clearTimeout(Popup.timer);
   },
   getEl: function () {
       return $('#popup_window');
   },
   getContainer: function () {
       return $('#popup_contents');
   },
   createPopup: function (data, cdn_cat, cdn_name, lvl) {
       data = JSON.parse(data);

var html = '

<img src="https://westzz.innogamescdn.com/images/items/' + data.cdn_cat + '/' + data.cdn_img + '.png' + '"/>

' + data.name + '

' + data.type + '

';

       var upgraded = false;
       if ((lvl >= 1) && (lvl <= 5)) {
           upgraded = true;
           data.auc = false;
       }
       if (data.dmg_min && data.dmg_max) {
           if (upgraded) {
               data.dmg_min += Math.round(Math.max(1, data.dmg_min * 0.1 * lvl));
               data.dmg_max += Math.round(Math.max(1, data.dmg_max * 0.1 * lvl));
           }

html += '

' + data.dmg_min + '-' + data.dmg_max + ' Damages

';

       }
       for (var cat in Popup.data) {
           var cnt = 0;
           for (var key in Popup.data[cat]) {
               if (data.hasOwnProperty(key)) {
                   cnt++;
                   var per_level = "";
                   if (data[key] < 0) {
                       if ($('#input_level input').val() > 0) {
                           data[key] = Math.ceil($('#input_level input').val() * -data[key]);
                           if (upgraded) {
                               data[key] += Math.round(Math.max(1, data[key] * 0.1 * lvl));
                           }
                       } else {
                           data[key] = -data[key];
                           per_level = " (per Level)";
                           if (upgraded) {
                               data[key] = Math.round(1e6 * (data[key] * 1 + Math.round(Math.max(1, data[key] * 1000 * lvl)) / 10000)) / 1e6;
                           }
                       }
                   } else if (upgraded) {
                       if (data[key] < 1) {
                           data[key] = Math.round(1e6 * (data[key] * 1 + Math.round(Math.max(1, data[key] * 1000 * lvl)) / 10000)) / 1e6;
                       } else {
                           data[key] += Math.round(Math.max(1, data[key] * 0.1 * lvl));
                       }
                   }
                   html += Popup.data[cat][key].replace('#1', data[key]).replace('#2', per_level);
               }
           }
           if (cnt > 0) {
               html += '
';
           }
       }
       if (data.text) {
           for (var i = 0; i < data.text.length; i++) {

html += '

' + data.text[i] + '

';

           }
           html += '
';
       }
       if (data.bonus) {
           for (var i = 0; i < data.bonus.length; i++) {

html += '

' + data.bonus[i] + '

';

           }
           html += '
';
       }
       if (data.jobs) {

html += '

';

           for (var i = 0; i < data.jobs.length; i++) {

html += '';

           }

html += '

<img src="https://westzz.innogamescdn.com/images/jobs/' + data.jobs[i][1] + '.png"/>

' + data.jobs[i][0] + '

';

       }
       if (data.craft) {

html += '

<img src="https://westzz.innogamescdn.com/images/crafting/profsymbol_' + data.craft.id + '_small.png"/>

'; for (var i = 0; i < data.craft.req.length; i++) { html += ''; } html += ''; for (var i = 0; i < data.craft.req.length; i++) { html += ''; } html += ' <img style="width:36px;height:36px;" src="https://westzz.innogamescdn.com/images/items/yield/' + data.craft.req[i][0] + '.png"/> x' + data.craft.req[i][1] + '

';

       }

html += '

';

       if (data.spd) {
           if (upgraded) {
               data.spd += Math.round(Math.max(1, data.spd * 0.1 * lvl));
           }

html += '

Speed: +' + data.spd + '%

';

       }

if (data.set) html += '

<a class="popup_set" href="/wiki/' + data.set + '">' + data.set + '</a>

';

       if (data.sp) {
           html += '<img src="/images/5/57/Buy_price.png"/>' + data.bp + '    <img src="/images/f/fc/Sell_price.png"/> ' + data.sp + '

';
       } else {
           html += 'Unsalable

';
       }
       if (data.lvl) html += 'Level ' + data.lvl + '
';
       if (data.sex) {
           if (data.sex == 0) {
               html += '<img src="/images/c/c5/Gender_m.png"/>   ';
           } else {
               html += '<img src="/images/4/41/Gender_f.png"/>   ';
           }
       }
       if (data.auc == 1) {
           html += 'Auctionable
';
       } else {
           html += 'Not auctionable
';
       }
       if (data.upg == 0) {
           html += 'Not upgradeable
';
       } else {
           html += 'Upgradeable
';
       }

html += '

[item=' + data.id + ']

';

       return html;
   },
   setPosition: function (e) {
       var window_width = $(window).width();
       var window_height = $(window).height();
       var popup_width = Popup.getEl().outerWidth();
       var popup_height = Popup.getEl().outerHeight();
       var pos_x = e.clientX;
       var pos_y = e.clientY;
       var top;
       var left;
       var margin_top = 20;
       var margin_left = 20;
       if (pos_x + popup_width + margin_left > window_width) {
           left = pos_x - popup_width - margin_left + (e.pageX - e.clientX);
       } else {
           left = pos_x + margin_left + (e.pageX - e.clientX);
       }
       if (pos_y + popup_height + margin_top > window_height) {
           top = window_height - popup_height + (e.pageY - e.clientY);
       } else {
           top = pos_y + margin_top + (e.pageY - e.clientY);
       }
       Popup.getEl().css({
           top: top,
           left: left
       });
   },data: {
       dmg: {

dmglvl: '

+ #1 Daño#2

'

       },
       skills: {

str: '

+ #1 Fuerza#2

', mob: '

+ #1 Movilidad#2

', dex: '

+ #1 Destreza#2

', cha: '

+ #1 Carisma#2

', con: '

+ #1 Construcción#2

', vig: '

+ #1 Vigor#2

', tou: '

+ #1 Tenacidad#2

', sta: '

+ #1 Condición#2

', hea: '

+ #1 Puntos de vida#2

', rid: '

+ #1 Montar a caballo#2

', ref: '

+ #1 Reflejos#2

', dod: '

+ #1 Eludir#2

', hid: '

+ #1 Esconder#2

', swi: '

+ #1 Nadar#2

', aim: '

+ #1 Apuntar#2

', sho: '

+ #1 Disparar#2

', pit: '

+ #1 Poner trampas#2

', fin: '

+ #1 Destreza de manos#2

', rep: '

+ #1 Reparar#2

', lea: '

+ #1 Liderazgo#2

', tac: '

+ #1 Táctica#2

', tra: '

+ #1 Comerciar#2

', ani: '

+ #1 Instinto animal#2

', app: '

+ #1 Apariencia#2

', luck: '

+ #1 % más posibilidades de ganar#2

', mon: '

+ #1 % Dinero de trabajo y duelos#2

', speed: '

+ #1 % de Velocidad#2

', res: '

+ #1 Resistencia (Bonus de batalla)#2

', reg: '

+ #1 % de regeneración#2

', exp: '

+ #1 % Exp por trabajos, duelos y batallas de fuerte#2

', lp: '

+ #1 Puntos de trabajo#2

', sfboff: '

+ #1 Ataque (Bonus de batalla)

', sfbdef: '

+ #1 Defensa (Bonus de batalla)

', sfbres: '

+ #1 Resistencia (Bonus de batalla)

', sfbdmg: '

+ #1 Daño (Bonus de batalla)

', sfboffs: '

+ #1 Ataque (Bonus de sector de batalla)

', sfbdefs: '

+ #1 Defensa (Bonus de sector de batalla )

', sfbdmgs: '

+ #1 Daño (Bonus de sector de batalla)

', textjob: '

#1 #2

', textjob1: '

#1 #2

', textjob2: '

#1 #2

', textjob3: '

#1 #2

',

       },
       buff:{

bdes: '

Algo para desempaquetar

', bluck: '

+ #1 % más posibilidades de ganar#2

', bmon: '

+ #1 % Dinero de trabajo y duelos#2

', bspeed: '

+ #1 % de Velocidad#2

', bres: '

+ #1 Resistencia (Bonus de batalla)#2

', breg: '

+ #1 % de regeneración#2

', bsal: '

+ Bonus de puntos de salud #1 % #2

', bene: '

Energía incrementada: #1 % #2

', bexp: '

+ #1 % Exp por trabajos, duelos y batallas de fuerte#2

', blp: '

+ #1 Puntos de trabajo#2

', btextjob: '

#1 #2

', btextjob1: '

#1 #2

', btextjob2: '

#1 #2

', btextjob3: '

#1 #2

',

              },
       fb: {

fboff: '

+ #1 Ataque (Bonus de batalla)

', fbdef: '

+ #1 Defensa (Bonus de batalla)

', fbres: '

+ #1 Resistencia (Bonus de batalla)

', fboffs: '

+ #1 Ataque (Bonus de sector de batalla)

', fbdefs: '

+ #1 Defensa (Bonus de sector de batalla )

', fbdmgs: '

+ #1 Daño (Bonus de sector de batalla)

',

       }
   }

};

//Show a "plain text" popup in the template if ((new RegExp(mw.config.get('wgFormattedNamespaces')[10] + '\:Item\_*').test(mw.config.get('wgPageName'))) && ($('.item_container').length === 1)) {

$('#mw-content-text').append('

');

   $('#popup_plain').hide();
   $('#popup_plain_contents').append(Popup.createPopup($('.item_container').attr('data-popup'), $('.item_container').attr('data-cdn-cat'), $('.item_container').attr('data-cdn-img'), 0));
   $('#popup_plain').slideDown();

}

//On dbl click on item, redirect the user to the template $('.item_container img').on('dblclick', function() {

   window.location = '/wiki/' + mw.config.get('wgFormattedNamespaces')[10] + ':Item_' + JSON.parse($(this).parent().attr('data-popup')).id / 1000;

});

//SET CALC

if ($('.infoSet').length !== 0) {

   var set_calc = {
       bonus: {
           //List of usual bonuses matched with tooltip and image url
           set_bonus: {

str:{name:"Fuerza",img:"/images/thumb/f/fd/Fuerza.png/40px-Fuerza.png"}, mob:{name:"Movilidad",img:"https://wiki.the-west.es/images/thumb/9/98/Movilidad.png/40px-Movilidad.png"}, dex:{name:"Destreza",img:"/images/thumb/0/0d/Dexterity.png/40px-Dexterity.png"}, cha:{name:"Carisma",img:"/images/thumb/c/c9/Charisma.png/40px-Charisma.png"}, con:{name:"Construcción",img:"/images/thumb/3/37/Construction.png/40px-Construction.png"}, vig:{name:"Vigor",img:"/images/thumb/9/90/Skill_Punch.png/40px-Skill_Punch.png"}, tou:{name:"Tenacidad",img:"/images/thumb/f/f8/Skill_Tough.png/40px-Skill_Tough.png"}, sta:{name:"Condición",img:"/images/thumb/8/8d/Stamina.png/40px-Stamina.png"}, hea:{name:"Puntos de vida",img:"/images/thumb/9/94/Health.png/40px-Health.png"}, rid:{name:"Montar a caballo",img:"/images/thumb/7/78/Hbr.png/40px-Hbr.png"}, ref:{name:"Reflejo",img:"/images/thumb/e/e9/Skill_Reflex.png/40px-Skill_Reflex.png"}, dod:{name:"Eludir",img:"/images/thumb/0/07/Skill_Dodge.png/40px-Skill_Dodge.png"}, hid:{name:"Esconder",img:"/images/thumb/9/97/Hiding.png/40px-Hiding.png"}, swi:{name:"Nadar",img:"/images/thumb/f/f4/Swimming.png/40px-Swimming.png"}, aim:{name:"Apuntar",img:"/images/thumb/5/53/Skill_Aim.png/40px-Skill_Aim.png"}, sho:{name:"Disparar",img:"/images/thumb/7/73/Skill_Shot.png/40px-Skill_Shot.png"}, pit:{name:"Poner trampas",img:"/images/thumb/e/e1/Trapping.png/40px-Trapping.png"}, fin:{name:"Destreza de manos",img:"/images/thumb/1/18/Fms.png/40px-Fms.png"}, rep:{name:"Reparar",img:"/images/thumb/d/d5/Repairing.png/40px-Repairing.png"}, lea:{name:"Liderazgo",img:"/images/thumb/4/44/Leadership.png/40px-Leadership.png"}, tac:{name:"Táctica",img:"/images/thumb/9/91/Skill_Tactic.png/40px-Skill_Tactic.png"}, tra:{name:"Comerciar",img:"/images/thumb/f/f3/Skill_Trading.png/40px-Skill_Trading.png"}, ani:{name:"Instinto animal",img:"/images/thumb/9/9d/AnimalInstinct.png/40px-AnimalInstinct.png"}, app:{name:"Apariencia",img:"/images/thumb/4/4c/Skill_Appearance.png/40px-Skill_Appearance.png"}, fbdef:{name:"Defense (Fort battle bonus)",img:"/images/8/82/Set_Fb_defense.png"}, fboff:{name:"Attack (Fort battle bonus)",img:"/images/3/30/Set_Fb_offense.png"}, fbres:{name:"Resistance (Fort battle bonus)",img:"/images/4/4b/Resistance.png"}, fbdefs:{name:"Defense (Fort battle sector bonus)",img:"/images/1/1a/Set_Fb_defense_sec.png"}, fboffs:{name:"Attack (Fort battle sector bonus)",img:"/images/f/fe/Set_Fb_offense_sec.png"}, fbdmgs:{name:"Damages (Fort battle sector bonus)",img:"/images/b/b3/Damages_sector.png"}},

           //If there are any other "special" bonuses, they will be dynamically retrieved and stored there
           extra_set_bonus: {}
       },
       //Bonuses from all sets / items :
       data: {},
       //Status of all items (item lvl, activated or not)
       itemStatus: {},
       getData: function () {
           //Get bonuses from all item sets
           $('.set_container').each(function () {
               var set_id = $(this).attr('data-set-id');
               set_calc.itemStatus[set_id] = {};
               set_calc.data[set_id] = {
                   items: {},
                   set: {}
               };
               $(this).find('.item_container').each(function () {
                   var json = JSON.parse($(this).attr('data-popup'));
                   if ($(this).is(":hidden")) {
                       set_calc.itemStatus[set_id][json.id] = false;
                   } else {
                       set_calc.itemStatus[set_id][json.id] = 0;
                   }
                   for (var prop in json) {
                       if (json.hasOwnProperty(prop) && set_calc.bonus.set_bonus.hasOwnProperty(prop)) {
                           if (!set_calc.data[set_id].items[prop]) {
                               set_calc.data[set_id].items[prop] = {};
                           }
                           set_calc.data[set_id].items[prop][json.id] = json[prop];
                       }
                   }
               });
           });
           //Get bonuses from all sets
           $('.infoSet').each(function () {
               var set_id = $(this).attr('data-set-id');
               $(this).find('.infosetatt').each(function () {
                   var nb = $(this).attr('data-nb');
                   set_calc.data[set_id].set[nb] = {};
                   $(this).find('.set_bonus').each(function () {
                       key = $(this).attr('data-type');
                       if ($(this).find('.calc').length !== 0) {
                           set_calc.data[set_id].set[nb][key] = -parseFloat($(this).find('.calc').attr('id'));
                       } else {
                           set_calc.data[set_id].set[nb][key] = parseFloat($(this).find('.val').text());
                       }
                       if (!set_calc.bonus.set_bonus.hasOwnProperty(key)) {
                           set_calc.bonus.extra_set_bonus[key] = {
                               img: $(this).find('img').attr('src'),
                               name: $(this).find('#tooltip_content').text()
                           };
                       }
                   });
               });
           });

       },
       calc: function () {
           //Only calc if a player level is provided
           if ($('#input_level').length === 0 | $('#input_level input').val() !== "") {
               var level = parseInt($('#input_level input').val());
               total = {};
               for (var set_id in set_calc.data) {
                   for (var key in set_calc.data[set_id].items) {
                       for (var item_id in set_calc.data[set_id].items[key]) {
                           if (set_calc.itemStatus[set_id][item_id] !== false) {
                               lvl = set_calc.itemStatus[set_id][item_id];
                               if (!total[key]) {
                                   total[key] = 0;
                               }
                               var value = set_calc.data[set_id].items[key][item_id];

                               if (set_calc.data[set_id].items[key][item_id] < 0) {
                                   //If bonus (per Level)
                                   value = -value;

                                   if (set_calc.itemStatus[set_id][item_id] > 0) {
                                       //If item upgraded
                                       total[key] += Math.ceil(value * level) + Math.round(Math.max(1, Math.ceil(value * level) * 0.1 * lvl));
                                   } else {
                                       total[key] += Math.ceil(value * level);
                                   }
                               } else {
                                   if (set_calc.itemStatus[set_id][item_id] > 0) {
                                       if (value < 1) {
                                           total[key] += Math.round(1e6 * (value * 1 + Math.round(Math.max(1, value * 1000 * lvl)) / 10000)) / 1e6;
                                       } else {
                                           total[key] += Math.round(Math.max(1, value * 0.1 * lvl));
                                       }
                                   } else {
                                       total[key] += value;
                                   }
                               }
                           }
                       }
                   }
                   var item_nb = 0;
                   for (var item_id in set_calc.itemStatus[set_id]) {
                       if (set_calc.itemStatus[set_id][item_id] !== false) {
                           item_nb++;
                       }
                   }
                   for (var key in set_calc.data[set_id].set[item_nb]) {
                       if (!total[key]) {
                           total[key] = 0;
                       }
                       if (set_calc.data[set_id].set[item_nb][key] < 0) {
                           total[key] += Math.ceil(-set_calc.data[set_id].set[item_nb][key] * level);
                       } else {
                           total[key] += set_calc.data[set_id].set[item_nb][key];
                       }
                   }
               }
               //Create the html table

var html = '

<tbody>

Total

'; for (var key in set_calc.bonus.set_bonus) { if (total.hasOwnProperty(key)) { html += ' <img src="' + set_calc.bonus.set_bonus[key].img + '">+' + total[key] + ' ' + set_calc.bonus.set_bonus[key].name + ' '; } } for (var key in set_calc.bonus.extra_set_bonus) { if (total.hasOwnProperty(key)) { html += ' <img src="' + set_calc.bonus.extra_set_bonus[key].img + '">+' + total[key] + (['xp', 'money', 'luck', 'spd', 'regen', 'drop'].indexOf(key) !== -1 ? "%" : "") + ' ' + set_calc.bonus.extra_set_bonus[key].name + ' '; } } //Display the result at the bottom of the page $('#set_calc').html(html); } else { $('#set_calc').html(""); } }, initEvents: function () { //Deactivate / activate item on click $('.item_container > img').on('click', function () { var item_container = $(this).closest('.item_container'); item_container.toggleClass('item_off'); var set_id = item_container.closest('.set_container').attr('data-set-id'); var item_id = JSON.parse(item_container.attr('data-popup')).id; if (item_container.hasClass('item_off') || item_container.is(":hidden")) { set_calc.itemStatus[set_id][item_id] = false; } else { set_calc.itemStatus[set_id][item_id] = parseInt(item_container.attr('data-lvl')); } set_calc.calc(); }); //Update item level on upgrade / downgrade $(document).on('click', '.upgrade, .downgrade', function () { var item = $(this).closest('.item_container'); var set_id = item.closest('.set_container').attr('data-set-id'); if (!item.hasClass('item_off') && !item.is(":hidden")) { set_calc.itemStatus[set_id][JSON.parse(item.attr('data-popup')).id] = parseInt(item.attr('data-lvl')); set_calc.calc(); } }); //Calc again when player level changes $("#input_level").bind("propertychange keyup input paste", function () { set_calc.calc(); }); //Activate/deactivate melee/fire weapon when the switch btn is clicked $("#switch").on('click', function () { $('#melee, #fire').each(function () { var item = $(this).find('.item_container'); var set_id = $(this).closest('.set_container').attr('data-set-id'); if ($(this).is(":hidden")) { set_calc.itemStatus[set_id][JSON.parse(item.attr('data-popup')).id] = false; } else { set_calc.itemStatus[set_id][JSON.parse(item.attr('data-popup')).id] = parseInt(item.attr('data-lvl')); } }); set_calc.calc(); }); }, init: function () { set_calc.initEvents(); set_calc.getData(); $('#mw-content-text').append(' '); if ($('#input_level').length === 0) set_calc.calc(); } }; set_calc.init(); }